html {height: 100%;box-sizing: border-box;}
*,*:before,*:after {box-sizing: border-box;}
body 
{
background-color:white;
position:relative;
margin:0;
padding:0px;
min-height:100%;
font-size:20px;
font-family:Times;
}
.smalltext {font-size:15px;font-weight:normal;color: black}
.topsticky 
{
position: -webkit-sticky;
position: sticky;
top: 0;
}

input[type=submit] {
border: 1px silver;
color: white;
font-weight: bold;
background: #8B9DC3;
padding:8px;
border-radius: 5px;
font-size: 15px;
}
input[type=submit]:hover 
{
background: #3B5998;
}
input[type=button] 
{
border: 1px silver;
color: white;
font-weight: bold;
background: #8B9DC3;
padding:8px;
border-radius: 5px;
font-size: 15px;
}
input[type=button]:hover {background:#3B5998;}

input[type=file] 
{
border: 1px silver;
color: black;
font-weight: normal;
padding:5px;
border-radius: 5px;
font-size: 15px;
}

.crimsonlink {font-weight:normal; color:crimson; text-decoration:none;}
.blacklink {font-weight:normal; color:black; text-decoration:none;}

.registertable
{
width:600px;
text-align:center;
margin:auto;
padding:5px;
}  
li
{font-size:20px;}
ul
{padding-top:0px;padding-bottom:0px;}
pre
{font-family: Times, Helvetica; font-size:20px; font-weight:normal;}
h1
{
padding-top:10px; padding-bottom:3px; padding-left:5px; padding-right:3px;
max-width:900px; text-align:left;
font-size:20px; font-weight:normal;
margin:auto;
}
.header
{
font-weight:bold;
font-style:normal;
font-size:35px;
background-color:lightblue;
padding:0px;
text-align:left;
}
.h1
{
font-weight:bold;
text-decoration:none;
font-style:normal;
font-size:35px;
color:white;
background-color:black;
padding:0px;
text-align:left;
}
.header1
{
font-weight:bold;
text-decoration:none;
font-style:normal;
font-size:35px;
color:white;
background-color:black;
padding:0px;
text-align:left;
}
.header2
{
font-weight:bold;
font-style:normal;
font-size:35px;
color:black;
background-color:gold;
padding:0px;
text-align:left;
}
.bodytext1
{
padding-top:10px; padding-bottom:3px; padding-left:5px; padding-right:5px;
max-width:900px; text-align:left;
font-size:20px; font-weight:normal;
margin:auto;
}
.bodytext2
{
padding-top:10px; padding-bottom:3px; padding-left:5px; padding-right:5px;
max-width:900px; text-align:center;
font-size:20px; font-weight:normal;
margin:auto;
}
.mediumtext
{
padding-top:10px; padding-bottom:3px; padding-left:5px; padding-right:5px;
max-width:900px; text-align:left;
font-size:20px; font-weight:normal;
margin:auto;
}
.footertext
{
padding-top:10px; padding-bottom:3px; padding-left:5px; padding-right:5px;
max-width:900px; text-align:left;
font-size:18px; font-weight:normal;
margin:auto;
}
.compchart
{
font-size:20px; display:block;
text-align:left; max-width:900px;
overflow:hidden;
padding:10px; margin:auto;
}

input[type=textarea], input[type=email], input[type=text], input[type=date], input[type=password], select 
{
font-size:18px;
padding: 5px;
margin: 1px 0;
display: inline-block;
border: 1px solid #ccc;
box-sizing: border-box;
vertical-align: bottom;
}
/* Add form formating to style2.css */
@media only screen and (max-width: 600px)
{
input[type=textarea], input[type=email], input[type=text], input[type=date], input[type=password], select 
{
font-size:18px;
padding:5px;
box-sizing: border-box;
border: 1px solid #ccc;
background-color: #ffffff;
vertical-align: bottom;
width:100%;
}
.header 
{
font-weight:bold;
font-style:normal;
font-size:25px;
background-color:lightblue;
padding:1px;
text-align:left;
padding-top:5px;
padding-right:10px;
padding-bottom:10px;
padding-left:5px;
}
.registertable
{
width:100%;
max-width:350px;
display:block;
text-align:center;
overflow:auto;
padding:5px;
}
.compchart
{
display:block; text-align:left;
width:100%; overflow:auto;
border-radius:15px; padding:10px; margin:auto;
}
h1
{
padding-top:10px; padding-bottom:3px; padding-left:5px; padding-right:5px;
max-width:800px; text-align:left;
font-size:20px; font-weight:normal;
margin:auto;
}   
}
.footer 
{
position:absolute;
right:0;
bottom:0;
left:0;
padding:1px;
background-color:lightblue;
text-align:center;
}

.topsticky 
{
position: -webkit-sticky;
position: sticky;
top: 0;
}

.center {margin: auto; text-align:center;}

.div_home
{
width: 30%;
height: 100%;
padding: 10px;
min-height: auto;
margin: 0 auto;
background-color:#E8E8E8;
text-align:center;
color:black;
}

.headertable
{
background-color:#efefef;
text-align:center;
}
/* Style the top navigation bar */
.topnav {
overflow: hidden;
background-color: #333;
text-align: center;
color: white;
width: 100%;
}
/* Style the topnav links */
.topnav a {
float: center;
display: inline-block;
color: #f2f2f2;
text-align: center;
padding: 14px 14px;
text-decoration: none;
}
.topnav a:link {
float: center;
display: inline-block;
color: #f2f2f2;
text-align: center;
padding: 14px 14px;
text-decoration: none;
}
.topnav a:visited {
float: center;
display: inline-block;
color: #f2f2f2;
text-align: center;
padding: 14px 14px;
text-decoration: none;
}
/* Change color on hover */
.topnav a:hover {
background-color: black;
color: white;
text-decoration: none;
font-weight: bold;
}

table.center 
{
margin-left:auto; 
margin-right:auto;
padding-left: 20px;
padding-right: 20px;
padding-bottom: 10px;
padding-top: 10px;
}
select.my_dropdown3 {
width:200px;
height:55px;
}
select.my_dropdown4 {
width:200px;
height:70px;
}
select.my_dropdown {
width:200px;
height:85px;
}

table 
{
border:0px solid black;
background-color:#E8E8E8;
padding-left:20px;
padding-right:20px;
padding-bottom:10px;
padding-top:10px;
}
th 
{
text-align:left;
background:#E8E8E8;
font-size:22px;
padding:5px;
}
td 
{
text-align:left;
vertical-align:bottom;
font-size:20px;
padding:5px;
}

.logintr
{margin: auto;}
.td_right {text-align: right;}
.td_center {text-align: center;}
.td1 
{
text-align: left;
background-color: lightgrey;
}
.tr2 
{text-align: center; background-color: white;}

a.boxpopup3 {
position:relative;
z-index:24; 
color:magenta; 
text-decoration:none}
a.boxpopup3:hover{z-index:25; background-color:#FF0}
a.boxpopup3 span{display: none}
a.boxpopup3:hover span { /*the span will display just on :hover state*/
display:block;
position:absolute;
top:0em; left:15; width:10em;
padding:.5em;
border:0px outset #BBB;
color:#000; background:#AA9; 
text-align:left;
font-weight: bold;}

.searchtipstable
{
width:450px;
text-align: center;
margin: auto;
padding:3px;
}
@media only screen and (max-width: 600px)
{
.searchtipstable
{
width:100%;
max-width:400px;
display:block;
text-align:center;
overflow:auto;
border-radius:0px;
padding:3px;
}
}
#red
{color: red;background-color: #E8E8E8;}
.red
{color: red;background-color: #E8E8E8;}
.bold
{font-weight: bold;}
.italic
{font-style: italic;}
.boldtop
{font-weight: bold; vertical-align:top;}
.boldmiddle
{font-weight:bold; vertical-align:middle;}
.centerboldtext
{font-weight:normal; text-align:center;}
.centernormaltext
{
font-weight: normal;
text-align: center;

}
td.toptext {vertical-align: top;}
td.toptextbold {vertical-align: top;font-weight:bold;}
.boldred {font-weight:bold; color:red;}
#normaltext {font-weight: normal;}
.normaltext {font-weight: normal;}
#boldtext {font-weight:bold;}
.boldtext {font-weight:bold;}
#normaltextindent {font-weight:normal; text-indent:50px;}
#lefttoptext {vertical-align:top; font-weight: bold;}
#leftboldtext {text-align:left;font-weight:bold;}
#textalignright {text-align:right; font-weight:normal; font-size: 15px; float:right; vertical-align:bottom;}
#center {text-align:center; float:center;}
.left {text-align:left; float:left;}
#number {width: 3em;}

* {box-sizing: border-box;}
/* Style the footer */
#main-wrapper 
{
min-height: 100%;
padding: 0 0 100px;
position: relative;
}
p.centerred {
text-align: center; 
color: red; 
}
p.footer1 { margin: 20px 0;
background-color: #3B5998;
}
.button1 {
border: 1px silver;
color: white;
font-weight: bold;
background: #E8E8E8;
padding: 5px 5px;
font-size: 15px;
text-decoration: none;
border-radius: 5px;
}
.button1 a:link, a:visited 
{
border: 1px silver;
color: white;
font-weight: bold;
background: #E8E8E8;
padding: 5px 5px;
font-size: 15px;
text-decoration: none;
border-radius: 5px;
}
.button2 {
border: 1px silver;
color: white;
font-weight: bold;
background: #E8E8E8;
padding: 5px 5px;
font-size: 15px;
text-decoration: none;
border-radius: 5px;
}
.button2 a:link, a:visited {
border: 1px silver;
color:white;
font-weight:bold;
background:#E8E8E8;
padding:5px 5px;
font-size:15px;
text-decoration:none;
border-radius: 5px;
}

.button1:hover {
background: #3B5998;
color: white;
}
.centerDiv
{
width: 60%;
height: 100%;
min-height: auto;
margin: 0 auto;
background-color:#E8E8E8;
text-align:center;
font-weight: bold;
color:black;
}
.floatadright
{
float:right;
width: 25%;
font-size: 15px;
text-align: left;
padding: 8px 8px 8px 8px;
}
.floatright
{
float:right;
width: 60%;
font-size: 15px;
text-align: right;
padding: 8px 8px 8px 8px;
}
.div1
{
width: 25%;
background-color:#E8E8E8;
height: 175px;
float:left;
padding: 8px 8px 8px 8px;
}
.div2
{
width: 75%;
background-color:#E8E8E8;
text-align:left;
height: 175px;
float:left;
padding: 8px 8px 8px 8px;
}
.div3
{
width: 100%;
background-color:#E8E8E8;
float:left;
text-align:center;
font-weight: bold;
font-size: 20px;
padding: 8px 8px 8px 8px;
}
.div3_banner
{
width: 100%;
background-color:#FAE8E1;
float:left;
text-align:center;
font-weight: bold;
font-size: 20px;
padding: 8px 8px 8px 8px;
}
.white_banner
{
width: 100%;
background-color:white;
float:left;
text-align:center;
font-weight: bold;
font-size: 17px;
padding: 8px 8px 8px 8px;
}
.lightblue_banner
{
width: 100%;
background-color:white;
float:left;
text-align:center;
font-weight: bold;
font-size: 17px;
padding: 8px 8px 8px 8px;
}
.div3left
{
width: 100%;
background-color:#E8E8E8;
float:left;
text-align:left;
font-weight: bold;
font-size: 20px;
padding: 8px 8px 8px 8px;
}
.div4
{
width: 100%;
background-color:#E8E8E8;
float:left;
text-align:left;
font-weight: normal;
padding: 8px 8px 8px 8px;
}
.div5
{
width: 100%;
height: 100%;
min-height: auto;
background-color:#E8E8E8;
float:left;
text-align:center;
font-weight: normal;
padding: 8px 8px 8px 8px;
}
.div6
{
width: 50%;
display: block;
overflow: auto;
background-color:#E8E8E8;
float:left;
text-align:left;
font-weight: normal;
padding-top: 8px;
padding-right: 8px;
padding-bottom: 8px;
padding-left: 10px;
}
.compchartsub 
{
display: block;
width: 60%;
overflow: auto;
padding:3px;
margin: auto;
}


}
/* Responsive layout - makes the two columns/boxes stack on top of each other 
instead of next to each other on small screens */
@media only screen and (max-width: 600px)
{
.td_right
{text-align: center;}
nav, article 
{
width: 100%;
height: auto;
}
th
{ 
display: block;
width: 100%;
overflow: auto;
padding:3px;
text-align: center;
}
td,.bookmarksimg,.centerDiv 
{
display:inline-block;
width: 100%;
overflow: auto;
padding:3px;
text-align: left;
}
table 
{ 
display:block;
width:100%;
overflow:auto;
border-radius:15px;
padding:3px;
}
table.center
{ 
display:block; width:100%;
overflow:auto; padding:3px;
}
#textalignright 
{ 
display:block; width:100%;
text-align:center;
}
}

@media only screen and (max-width: 600px)
{
.compchart
{
display:block; text-align:left;
width:100%; overflow:auto;
border-radius:15px; padding:10px; margin:auto;
}
}
.tooltip
{
position:relative; display:inline-block;
font-weight:normal;
}
.li_pad
{
padding:1px;
}
.tooltip .tooltiptext {
visibility:hidden; width:250px;
background-color:#F8DAC2; color:black;
text-align:left; border-radius:6px;
padding:5px; font-weight:normal;
position:absolute; z-index:1;
}
.tooltip:hover .tooltiptext
{
visibility:visible; font-weight:normal;
}
.th_complink
{
color:black; background:#E8E8E8;
vertical-align:bottom;
}

.lightblue_banner
{
width:100%; background-color:white;
float:left; text-align:center;
font-weight:bold; font-size:20px;
padding: 8px 8px 8px 8px;
}
.smallcompchart
{
display:block; width:100%;
max-width:400px; overflow:auto;
padding:3px;
margin:auto;
}
.tableheadline 
{
font-size:22px;
font-weight:bold;
color:black;
background-color:lightgray;
padding:0px 0px 5px 5px;
}
a:link 
{color:navy;}
a:visited 
{color:navy;}
a:hover 
{color:red;}
a:active 
{color:navy;}