/* CSS for index files */

body { font-family: sans-serif; font-size: 20px; 
    max-width:1160px; min-width:450px; margin: auto;padding-left:8px; }
p {  margin-top: 0.6em; margin-bottom: 0em; }
h1 {   margin-top: 0em;   margin-bottom: 0em; }
h2 {   margin-top: 0em;   margin-bottom: 0em; font-size:130% }
td.hd {vertical-align: bottom;}
td {vertical-align: top;}

img.th {width: 160; height: 105; float: left; margin-right: 10px;
    margin-bottom:4px; border-width:2px; border-color: #9090b0; 
    border-width:2px; border-color: #9090b0; border-style:solid; }

/* Regular item style */
div.th { float:left; box-sizing: border-box; 
    min-width:190px; width:20%; height:235px; padding-right:20px; padding-left:10px;
    font-size:19px; }
@media (max-width: 1050px) { div.th { width:25% } }
@media (max-width: 840px) { div.th { width:33% } }
@media (max-width: 630px) { div.th { width:50% } }


div.th img { width: 176; height: 115; 
   margin-bottom:4px; border-width:2px; border-color: #9090b0; border-style:solid; display: block; background-color: #b0b0c0;}
@media (max-width: 630px) { div.th img { width:192; height:126;}} /* Bigger images for phone screens */


/* Two column items with thumnails */
div.col2 { float:left; width:48%; min-width:450px;height:210px; padding-left: 10px; margin-right:20px;
    font-size:22px;}
div.col2 img { width: 200; height: 131; float: left; margin-right: 20px;
    margin-bottom:4px; border-width:2px; border-color: #9090b0; 
    border-style:solid; display: block; background-color: #ffffff;}
   
@media (max-width: 1010px) {
    div.col2 {width:100%; height: 240px; font-size:23px; }
    div.col2 img { width: 240; height: 157;}
}

/* Larger item text on right style, three columns on full size */
div.col3 { float:left; width:32%; height:125px; padding-left:10px; padding-top:15px;
    font-size:22px;}
div.col3 img { width: 176; height: 115; 
    margin-right: 12px; margin-top: -15px; margin-bottom:4px; float: left;
    border-width:2px; border-color: #9090b0; border-style:solid; }

@media (max-width: 1050px) {
    div.col3 {width:48%; height:140px; font-size:23px;}
    div.col3 img {width:200; height: 131px;}
}
@media (max-width: 800px) {div.col3 {width:100%}}