/* stylesheet for home page index.php */
div.col
{
  display: inline-block;
  vertical-align: top;
  margin: 5px;
  padding: 10px 5px;
  border-top: 10px solid #ccc;
}

div.maincol
{
  border-right: 1px solid #ccc;
  width: 55%;
}
div.subcol
{
  width: 35%;
  border-left: 1px solid #ccc;
}

div.maincol h2
{
  display: inline-block;
  vertical-align: top;
  width: 45%;
  width: calc(50% - 10px);
  font-size: 200%;
  font-family: Georgia, serif;
  padding-top: 0;
  margin: 5px;
}

div.maincol h3, div.maincol h4
{
  margin: 10px 0 0 0;
}


div.subcol h2
{
  font-size: 130%;
  color: #b33;
  font-family: Georgia, serif;
}

div.subcol h3
{
  border-top: 1px solid #aaa;
  padding: 3px 0 0 0;
}

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

div.subcol p.periods { font-size: 90% }

div.subcol a.textlink
{
  clear: both;
  display: block;
  background: #eef linear-gradient(#e8e8ff, #cce);
  color: #009;
  width: 60%;
  width: max-content;
  padding: 1px 5px;
  text-decoration: none;
  white-space: nowrap;
  border: #ddf 2px outset;
}

picture.coverimg
{
  display: block;
  float: left;
  width: 45%;
  width: calc(50% - 10px);
  margin: 0 10px 10px 0;
}

picture.coverimg img
{
  display: block;
  width: 100%;
}

div.col.maincol h3 { margin: 5px 0 10px }


table.copydate { margin: 10px 0 }
table.copydate tr td:first-child { padding: 0 30px 0 0 }
@media screen and ( max-width: 700px)
{
  table.copydate { font-size: 90% }
  table.copydate tr td:first-child { padding: 0 5px 0 0 }
}

table.newadprices
{
  background: #eff;
  margin: 1em 0;
  width: 100%;
}
table.newadprices caption 
{ 
  font-style: italic; 
  background: #eff; 
  border-bottom: 1px solid #dee;

}
table.newadprices tr td, table.newadprices tr th
{
  text-align: left;
  vertical-align: top;
  padding: 3px 0px 3px 5px;
  line-height: 1.2em;
}

img.yfalogo { border: 2px outset #edc }
img.cookie { float: left; margin-right: 10px }

@media screen and (max-width: 800px)
{
  div.maincol h2 { font-size: 200% }
}



@media screen and (max-width: 500px)
{
  div.maincol, div.subcol
  { 
    width: 100%;
    border: none;
    margin: 0;
    padding: 0 2px;
  }

  div.maincol h2
  {
    font-size: 200%;
  }

}


table.subs24
{
  margin: 10px 0;
  background: #eff;
  border: 10px solid #eff;
}
table.subs24 tr td
{
  padding: 0 5px;
  font-weight: 500;
}
table.subs24 tr td.price
{
  text-align: right;
}

div.home_intro
{
  max-width: 800px;
  margin: auto;
}

div.filofolk-link
{
  max-width: 600px;
  margin: 20px auto 30px;
  padding: 10px;
  font-size: 110%;
  font-weight: bold;
  color: #b00;
  background: #feb;
  border-radius: 10px;
}