nav,ul,ol,li,aside,article,section{margin:0;padding:0;}
html{height:101%;}
body {font-family:Verdana, Geneva, sans-serif;line-height:150%;text-decoration:none;background-color:#F3DFC5;color:black;overflow:auto;margin:0 auto;padding:10px;}
/* layout of basic sections of the page */
header, nav, section, article, aside, footer {display:block;overflow:hidden; /* make this hidden so that child floats work well *//*overflow-x:auto; *//* new for mobile */}
header, footer{margin:auto;clear:both;}
article{margin-bottom:10px; height:100%;}
/* this marks the beginning of header look. */
header {width:101%;display:block;height:auto;overflow:hidden;clear:both;max-width:100%;text-align:auto;}
header.mascot{max-width:100%;height:auto;}
/* text design in header */
header.title{max-width:100%;text-align:left;}
/* text design for footers */
footer{font-size:12px;font-style:normal;text-align:center;color:gray;background:#F3DFC5;width:100%;overflow:auto;clear:both;}
/* nav element used to frame articles and provide navigation */
nav{background:#218CAD;display: block;text-align:center;width:100%;overflow-x:auto;}
nav ul {display:flex;flex-direction:row;margin:0;padding:0;-webkit-flex-direction:row;}
nav ul li {list-style:none;flex-grow:1;text-align:center;-webkit-flex-direction:row;}
nav ul li a {display:inline-block;}
.dragons-menu ul{display:flex;flex-direction:row;list-style-type:none;margin:0;padding:0;overflow:hidden;-webkit-flex-direction:row;}
.dragons-menu li{display:inline;flex-grow:1;-webkit-flex-direction:row;}
.dragons-menu li > a{background:#218CAD;color:white;font:bold Verdana, Geneva, sans-serif;padding:14px;text-align:center;text-decoration:none;}
.dragons-menu a:link, a:visited{background-color:#218CAD;}
.dragons-menu a:hover, a:active {background-color:#C0D9D9;color:black;}
table{background-color:#C0D9D9;border-collapse:collapse;border-spacing:0;color:black;margin:auto;}
a:link, a:visited, a:hover, a:active {color:black;text-decoration:none;}
p {margin-left: 20px;margin-right:20px;}
.extra {padding-bottom:10px;}
h1 {font-family:serif;font-style:italic;}


.responsive {/*overflow-x:auto;*/}
.card-4{margin:0px 20px 0px 0px; padding:5x 5px 10px 5px;
-webkit-box-shadow: inset -1px -1px 3px 0px rgba(33,140,173,1);
-moz-box-shadow: inset -1px -1px 3px 0px rgba(33,140,173,1);
box-shadow: inset -1px -1px 3px 0px rgba(33,140,173,1);
-webkit-column-break-inside:avoid;-moz-column-break-inside:avoid;column-break-inside:avoid;
-webkit-page-break-inside:avoid;-moz-page-break-inside:avoid;page-break-inside:avoid;
-webkit-break-inside:avoid;-moz-break-inside:avoid;break-inside:avoid-column;
-webkit-break-after:column; -moz-break-after:column; break-after:column;
vertical-align:top;}
.card-color {background-color:#F9EFE2;}

.center_image{margin-left:auto;margin-right:auto;}/* pushing the footer image to the center of the screen */
.indent, .indent a:link, .indent a:visited, .indent a:hover, .indent a:active{color:gray;font-size:15px;text-align:center;}/* pushing page name to next line and indented; used in header*/
.centering {text-align:left; padding-left:5%;}

#box{display:table;width:100%;}
.column{display:table-cell;width:50%;padding:2 20px;}
.two{display:table-cell;width:50%;padding:2 40px 2 20px; margin:0px 30px 0px 0px;}