/* CSS for guests.php */

/* container for forms and lists */
div.guests
{
  width: 95%;
  max-width: 800px;
  margin: auto;
  padding: 0 10px;
}

div.idxwrapper
{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  margin: auto;
  max-width: 800px;
  font-family: sans-serif;
  padding-left: 20px;
  background: white;
  padding: 5px;
}

@media (max-width: 700px)
{
  div.idxwrapper { grid-template-columns: 1fr 1fr }
}


div.text
{
  box-sizing: border-box; 
  max-width: 45rem;
}

div.biocontainer
{
  padding: 20px;
  background: #eee;
}

div.bio
{
  width: 90%;
  margin: 10px auto;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 10px;
  background: white;
  opacity: 100%;
}

div.bio p{
  margin: 0.5em 0;
}

div.bio img.bio
{
  max-width: 100%;
  display: block;
  margin: auto;
  opacity: 100%;
}

div.bio div.caption
{
  margin-bottom: 10px;
  text-align: center;
  font-style: italic;
}

div.bio h5
{
  text-align: left;
  font-size: 110%;
}

@media (max-width: 500px)
{
  div.idxwrapper { grid-template-columns: 1fr }
  main { padding: 2px }
  div.guests { padding: 2px; width: auto }
  div.biocontainer { padding: 10px 0 }
}