/* stylesheet for teams.php */
div.main
{
  width: max-content;
  max-width: 100%;
  margin: auto;
}
table.dance_selector { background: white; margin-top: 5px; }
table.dance_selector td { padding: 2px 5px; border-top: 1px solid #caa}
table tr td span.trad { background: #f8ffee; color: #060 }
table.showteam tr.admin td
{
  border: 1px solid #939;
  background: #f0e8f0;
  color: #636;
}
div.teamdetails
{
  display: inline-block;
  width: max-content;
  max-width: 90%;
  vertical-align: top;
  margin: 0 10px 10px 0;
}

div.teamdetails div.notes
{
  border: 1px solid black; 
  padding: 10px; 
  background: white;
  width: -moz-max-content;
  width: max-content;
  min-width: 250px;
  max-width: 800px;
  margin: 10px 0;
}

div.panel.pictures
{
  width: max-content;
  padding: 5px;
  margin: 10px;

}
div.panel.pictures h3 { margin-left: 5px }
div.panel.pictures div.captioned_photo
{
  display: inline-block;
  vertical-align: top;
  margin: 5px;
  width: 90%;
  width: calc(100% - 20px);
  max-width: 400px;
}

div.panel.pictures div.captioned_photo.photo2
{
  width: 48%;
  width: calc(50% - 30px);
}

div.panel.pictures div.captioned_photo.photo3
{
  width: 30%;
  width: calc(33% - 40px);
}

@media screen and (max-width: 1000px)
{
  div.panel.pictures div.captioned_photo.photo3, 
  div.panel.pictures div.captioned_photo.photo2
    { width: 48%; width: calc(50% - 30px) }
  
}
@media screen and (max-width: 500px)
{
  div.panel.pictures div.captioned_photo.photo3, 
  div.panel.pictures div.captioned_photo.photo2
  { width: 90%; width: calc(100% - 20px) } 

  div.main { width: 100% }
}
.detail_label { color: #060 }

button.helpbutton {margin-left: 20px}
button.edithelpbutton
{
  display: block;
  margin: 20px 0 0 0;
}
hr.extraspace { margin: 20px 0 }
form.youtube 
{
  background: white; 
  padding: 10px; 
  max-width: 500px;
  border: 1px solid #9d9; 
  border-radius: 7px
}
th.style_th { max-width: 100px }
table.teamlist tr.ceased td { background: #ec9; color: #933 }
table.showteam tr td.ceased { color: #600; background: #fcc }
form.inlinebutton { display: inline-block; margin: 0 10px }
form.button_top_margin { margin: 10px 0 0 }
table tr td.tdechecked { background: #fdb }

table tr th.ourdata { background: #edc; }
table tr td.ourdata { background: #fec; }
table.dancelist tr td.owntrad 
{ text-align: center; color: #030; background: #ded; }

span.tradabbr
{
  color: #044;
  background: #dff;
  padding: 0 2px;
}
table.dancelist tr td.dancename
{
  white-space: nowrap;
}
@media screen and ( max-width: 500px )
{
  table.dancelist tr td.dancename
  {
    white-space: normal;
  } 
}

p.find-instructions { max-width: 600px; }

div.hashtags
{
  background: white;
  font-size: 80%;
  padding: 5px;
}