/* CSS stylesheet for music.php */

div.mediamenu
{
  margin: 10px auto;
}

div.mediamenu a
{
  background: #eee;
  background: linear-gradient(#f0f0f0, #d8d8d8);
  color: black;
  border: outset 2px #e0e0e0;
  padding: 2px 5px;
  border-radius: 5px;
}

table.medialist 
{ 
  border-top: 1px solid #999; 
}
table.medialist tr td 
{ 
  font-size: 90%; 
  border-bottom: 1px solid #999;
  padding: 2px; 
}
table.medialist tr td a
{ 
  background: #e8ffe0;
  color: #030; 
  white-space: normal;
}

table.medialist tr td.date, table.medialist tr th.date 
{ 
  font-size: 80%; 
  white-space: nowrap;
}

div.media_details 
{ 
  width: 100%; 
  display: grid;
  grid-template-columns: 1fr 5fr;
  gap: 2px;
  background: #9c9;
  padding: 2px;
}

div.media_details div 
{ 
  padding: 5px 10px;
  background: white;
}

div.media_details div.details
{
  grid-column-start: 1;
  grid-column-end: 3;
  font-size: 90%;
  line-height: 1.2;
}


table.medialist tr td.flags { background: #d8e0d0; }

@media screen and ( max-width: 500px)
{
  table.medialist tr td.date, table.medialist tr th.date,
  table.medialist tr td.who, table.medialist tr th.who
  { display: none }  

  div.media_details div { padding: 2px 3px; }
  div.media_details div:first-child { font-size: 80%; }
}

table.medialist tr.newdate td { border-top: 2px solid #960; }