@charset 'utf-8';
* {box-sizing:border-box;}
body  {
	margin: 0;
	padding: 0;
	text-align: left; 
	color: #444444;
	font-size: 100.01%;
	clear: none;
	font-family: Arial, "Lucida Grande", "Lucida Sans Unicode", sans-serif;
	background: #f7f7f7; 
}     
.SH #container {
position: relative; 
min-height: 100vh;
width: 100%; 
background: #f7f7f7;
font-size: 1em;
} 
#header {
	position:relative;
	display:block;
	width:100%;
	padding: 0;  
	background-color: #FFF;
} 

.headerlogo {width:22%; position:absolute; left:2.2%; top:2%; z:300;} 
.headerlogobg {width:20.1%; height: 78%;  position:absolute; left:3%; top:9%; z:590; background-color:#f7f7f7; opacity: .7; border-radius: 50%;} 
.cceoclogo {width:100%; position:absolute; left:0%; top:0%; z:300;} 
.cceocbg {width:30%; height: 13%;  position:absolute; left:35%; top:0%; z:590; background-color:#f7f7f7; opacity: .7; border-radius: 0px 0px 5px 5px; border-left:.5px solid #444444; border-right:.5px solid #444444; border-bottom:.5px solid #444444;
}
.cceocbg a:hover img {background-color:#e0e0e0; transition-duration: .3s; border-radius: 0px 0px 5px 5px; border-left:.5px solid #444444; border-right:.5px solid #444444; border-bottom:.5px solid #444444}

#logo {float:left;}
#about	img {
	box-shadow: 4px 4px 8px rgba(0,0,0,.75);
	margin-left:5px;
	margin-bottom:10px;
}
.SH #mainContent {
	padding: 0% 10% 50px 10%;
	font-weight: normal;
} 
.SH #mainContent a:link { color: #b31b1b; text-decoration: none; }
.SH #mainContent a:visited { color: #b31b1b; text-decoration: none; }
.SH #mainContent a:hover { color: #b31b1b; text-decoration: underline;}
.clearfloat {clear:both; height:0; font-size: 1px; line-height: 0px;}
input:focus {background-color:#c7d9c7; outline: none;}
textarea:focus {background-color:#c7d9c7; outline: none;}
h1 {font-size: 1.5em;}
h2 {font-size: 1.3em; font-style: italic; color: #4b7b2b; }
h3 { font-size: 1.5em; font-weight: bold; color:#444444;  }
h4 { 	font-size: 1em; 	font-weight: bold; 	padding-top: 0.4em; 	color: #000; }
ul {	list-style-type: disc;}
th {
	font-weight: bold;
	background-color: #4b7b2b;
	color: #444444;
	text-align: center;
}
td { 
	background-color: #f7f7f7; 
	color: #444444; 
}
.center_cell {	text-align: center;}
#indent {	margin-left: 25px;	width: 80%;}
.indentdiv {
	margin-left: 40px;
	background-color: #d5c5ac;
	padding: 30px;
	border: 3px solid #34551e;
}
#footer { 
margin:0; padding: 10px; 
background-color: #222222; text-align: center; 
font-size: .8em; color: #fff; 
position:absolute; bottom:0px; 
width:100%; 
} 
#lefttext {
float: left;
width: 77%;
}
label { cursor: pointer; }

.social {width:18%; position: absolute; right:2%; bottom:3%; z:300; } 
.sociallogos {width:20%; float:right; margin-left:2%;}
.sociallogos img {width:100%;}
.sociallogos a:hover img {transform: scale(1.2); transition-duration: .3s;}
.navigation {background-color:#b31b1b; width:100%; padding:0px;}
        .navigation ul{
        /* positioning */
        	position:relative;
			margin:0px 0px 0px 30vw; /* left margin of the menu  */
            z-index:1000;
            list-style:none; 
            font-weight: bold;
            font-size: 1.5vw;
        }
.navigation ul a:hover { 
			background-color:#871414;
			transition-property: all; 	transition-duration: 750ms;
		}      
        /* we're using the direct descendant selectors > to ONLY affect the main menu items */
        .navigation > ul > li {
            position: relative;
            float: left;
   			margin-left:2.5%;	 /* distance between main menu items */
        }
        .navigation ul li a {
        /* positioning */ 
            display:block;
        /* styling: */
            background-color: #b31b1b;
            padding:8px 14px;
				text-decoration:none;
            color:#FFFFFF; 
				transition-property: all; 	transition-duration: 300ms;		
        }
/*        .navigation ul li a:hover{ background-color:#5e6a71;} */
		.navigation ul ul {
            width:21vw;
            position:absolute; left:-19vw;
            z-index:100;
            height: 0; /* dropdown menu has 0 height until hover */
            overflow: hidden;
			transition-property: all; 	transition-duration: 300ms;
        }        
        .navigation > ul > li:hover ul, 
        .navigation > ul > li > a:hover ul,
        .navigation ul ul li:hover > ul, 
        .navigation ul ul li a:hover > ul{
            height:150px; /* need a height to display dropdown menu */
        }     
        .navigation ul ul li {
            background-color:#46acc2;
            width:21vw;
        }      
        .navigation ul a:hover { 
			background-color:#871414;
			transition-property: all; 	transition-duration: 750ms;
		}      
        .navigation ul ul li a {
            display:block;
            text-decoration:none;
            margin:0px 0px;
            padding:5px 12px;
            color:#FFFFFF; 
        }
        .navigation ul ul li a:hover, .navigation ul ul li:hover > a { color:#FFFFFF; }
.button {
	display: inline-block;
	width:82px;
   outline: none;
	border-radius: 15px;
	cursor: pointer;
	color:#ffffff !important;
	background-color: #555555;
	text-align: center;
	text-decoration: none;
	text-transform:uppercase;
	font: 12px/100% Arial, "Lucida Grande", "Lucida Sans Unicode", "DejaVu Sans", Verdana, "sans-serif";
	padding: .5em 0em .55em;	
	transition-property: all;
	transition-duration: 300ms;
}
.button:link { color:#ffffff !important;}
.button:visited {color:#ffffff !important;}
.button:hover {
  text-decoration: none !important;
  color:#ffffff !important;
  background-color: #888888;
  transform: scale(1.07);
}
.button:active {
	color:#dddddd !important;
	position: relative;
	top: 2px;
}
#regular {display: block;}
.mobile {display: none;}

@media only screen and (max-width: 800px) {
body {font-size: 100%;}
#mainContent {padding: 0% 2% 70px 2%; }
h3 {font-size: 1.2em;}

.mobile {display:block;}
#regular {display:none;}
.mobilelinks  a {
	text-decoration: none;
	font-size: 3vw;
}
.mobilelinks a:link {color:#ffffff; }
.mobilelinks a:visited {color:#ffffff;}
.mobilelinks a:hover {color:#871414;}

#container {width:100% !important; border:none !important;}
.navigation ul li {position: relative; float: none; margin-left:0px;}
.navigation ul li > a {padding:0% 5%;}
.navdiv {height:auto; padding:0%; border:none;}
input[type=text] {width:100%;}
textarea {width:100%;}
.indentdiv {
	margin-left: 0%;
	padding: 1%;
	border: 1px solid #445927;
}
}