/*Universal Box Sizing*/
html {box-sizing: border-box;}
*, *:before, *:after {box-sizing: inherit;}

body {background-color:#fff;margin: 0;padding:1rem 1rem 0 1rem;height:100%;min-height:4rem;font-family: Arial, Helvetica, sans-serif;}
/*over,right,under,left*/

/* If screen is 600px or less, set padding to */
@media screen and (max-width: 600px) {
body {margin: 0;padding:0.2rem 0.2rem 0.2rem;}}

.logo {width: 100%;max-width: 220px;height: auto;}

.topnav{width:98%;max-width: 900px;margin:15px auto;}
.topnav img{margin:10px;}
/*.topnavcolor{background: #fefeff;background: linear-gradient(#fefeff,#fdfdff);}*/
.topnavcolor {background: #415A66;background-image: linear-gradient(#618899, #283840);}

.dropbtn {
background-color:#000;color:white;padding:9px;font-size:16px;border:none;min-width:80px;}

.dropdown {position:relative;display:inline-block;}
.dropdown-content {
display:none;position:absolute;right:0;background:#f9f9f9;z-index:1;min-width:250px;width:auto%;min-height:250px;}

.dropdown-content a {color:black;padding:12px;text-decoration:none;display:block;}
.dropdown-content a:hover {background-color: #f1f1f1;}

.dropdown:hover .dropdown-content {display: block;}
.dropdown:hover .dropbtn {background-color: #3e8e41;}

.dropdown ul{float:right;margin: 0;padding: 0;list-style-type: none;background-color: #fdfdfd;box-shadow: 1px 2px 2px 1px #778899, 1px 4px 4px 1px #B0C4DE;}
.dropdown{overflow-wrap:anywhere;}

/* If screen size is 601px or more, set the font-size to */
@media screen and (min-width: 601px) {
h1,h2,h3,h4{font-size: 18px;}
h5,h6,b,strong, p{font-size: 14px;line-height: 100%;}
}

/* If screen is 600px or less, set the font-size to */
@media screen and (max-width: 600px) {
h1,h2,h3,h4{font-size: 16px;}
h5,h6,b,strong, p{font-size: 14px;line-height: 100%;}
}

/* Maximum image size */
/*.content img {display: block;width:100% !important;max-width: 650px;height:auto !important;}*/
.content {width:98%;max-width: 900px;background-color:#fefeff;padding: 10px;
margin:10px auto;box-shadow: 1px 2px 2px 1px #778899, 1px 4px 4px 1px #B0C4DE;}

.content ul {list-style: none}
.content li  {list-style: square; color: #243342;}

a.content:link{color: blue; text-decoration:none;}
a.content:visited{color: blue; text-decoration:none;}
a.content:hover{color: blue; text-decoration:underline;}
a.content:active{color:blue;text-decoration:underline;}

.mainlist {max-width: 800px;margin: 0 auto;display: grid;grid-gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  row-gap: 20px;column-gap: 6px;align-items: start;}

/* If screen is 600px or less */
@media screen and (max-width: 600px) {
.mainlist{max-width: 800px;margin: 0 auto;display: grid;grid-gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  row-gap: 20px;column-gap: 6px;align-items: start;}}
 
.mainlist img {width:100%;max-width:200px;}
a.mainlist img:hover{box-shadow:2px 2px 8px #05c2fb;}

h1,h2,h3,h4{padding:10px;border-bottom:1px solid #cacace;}
h5,h6,b,strong, p{padding:10px;}

.content img {
	display: block;
	max-width:90% !important;
    height:auto !important;
}/* max size images in content */


.zeromarg {margin:.0rem;padding:.9rem;}/*over,right,under,left*/
.respimg {max-width:100%;height: auto;}/* responsive resizing of images */

table {table-layout: fixed; width: 90%;border-collapse:collapse;}
td:nth-child(1) {width: 30%;} /* First column size */
td, th {border: 1px solid #ddd;word-wrap: break-word;}
tr:nth-child(even){background-color: #f2f2f2;}
th {text-align: left;background-color: #4CAF50;  color: white;}/*over,right,under,left*/

.footer{width:98%;max-width: 900px; padding: 10px;margin: 10px auto;}
.footer p, .footer a{color: #ccc; text-decoration:none;font-size:11px;}