/* CWS for H */

html, body
{	padding: 0;	margin: 0;}

body
{	background:snow; 	

    font-family: Tahoma, Geneva, sans-serif;

	position: relative;	-webkit-text-size-adjust: none;}

@media all and (min-width : 1400px) {
body
{width: 80%; margin: 0 10%;}
}

body *
{	text-shadow: none;}

h1, h2, h3, h4, h5, h6
{	line-height: 1.2;	margin: 20px 0 10px 0;	}

h1{padding: 12px 0px 0px 8%; color: #fff; font-size:3.2em;  margin: 0px;  font-weight:100; text-shadow: 2px 2px 2px #6A7F4B; font-size: 4em;
letter-spacing: -.1rem;
}


h2{font-size: 1.8em;   color:#000; padding: 20px 8% 16px 8%;   margin:0;  opacity: .85; font-weight: 100; }

h3{	font-size: 1.4em; line-height: 1.6em; padding:  0 8% 0 8%; font-weight: 500; color: #000;}

h4{	font-size: .9em; padding: 0 0 0 6%; color: #888; font-weight: 100;}

p
{ font-size: 1.08em;  
  padding: 2px 8% 12px 8%;   margin:0px;
  max-width: 65rem;
  font-weight: normal; color: #3c3c3c; line-height: 2em}



@media only screen and (max-width: 480px) { 
 h1 {font-size: 3.1em; line-height: 1em; padding: 4px 0% 0 2%; }	
 h2 {font-size: 1.6em; padding:  40px 3% 0 3%;}
 h3{	font-size: 1.1em; line-height: 1.2em; padding:  0 3% 0 3%; font-weight: 100; }
 p{ padding:0 8% 0 3%; 	font-size: 1.08em;  }
}


img {margin: 0 0px 0 0; max-width: 100%; height: auto;}

.big {color:#002395;  font-size:.9em; opacity:.9; line-height: 1em; padding:0; }
.red {color:#ED2939;  font-size:.8em; opacity:.5; line-height: .8em; font-family: 'Open Sans', sans-serif; border-bottom: 60px solid;
 padding: 0 0 23px 0; text-shadow: 0 0 0;}
 .red2 {color: #d00;}
.quote {background: transparent url(quote.png) no-repeat 4% 50%;}

.lge {font-size: 1.21em; }

@media only screen and (max-width: 480px) {	 
.big{  font-size:1.2em; opacity:.9; line-height: .8em;}
.red {color:#ED2939;  font-size:.8em; opacity:.5; line-height: .8em; font-family: 'Open Sans', sans-serif; border-bottom:0; padding: 0 0 23px 0; text-shadow: 0;}
 }
 
.sml {font-size: .5em; padding: 0 0 0 290px; }


a, a:link, a:active, a:visited, a:hover
{color: orangered; border-bottom: 1px dashed ;text-decoration: none; outline:none; padding: 0 0 4px 0;}
a {outline: none;}
a:hover{border-bottom: 0px;text-decoration: none; outline:none; color: #555;}



ul li {	list-style-type: disc;	margin: 0px 0 0 10%; padding: 0; color: black;}


/* menu stuff g'wan 'ere */
nav:not(.mm-menu)
{display: none;}

#menu {background:#5d5d5d; }



#menu p{color: #ffc; padding: 20px; font-size: 1em; background: transparent; font-weight: normal;}

#menu h3 {font-size: 1.2em;}


#menu a {color: #fff;}
#menu a:hover {color: #ff0;}


.header
{	background: #000;
	font-weight: normal;
	-moz-box-sizing: border-box;
	box-sizing: border-box;	
	width: 100%; top: 0;
	height: 46px; 
	padding: 0 50px; position: fixed; opacity: .8;}
	

	
	@media all and (min-width : 1400px) {
	.header {width: 80%; margin 0 10%;}
}
		
	.header a
{	background: center center no-repeat transparent;
	background-image: url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADhJREFUeNpi/P//PwOtARMDHQBdLGFBYtMq3BiHT3DRPU4YR4NrNAmPJuHRJDyahEeT8Ii3BCDAAF0WBj5Er5idAAAAAElFTkSuQmCC );
	display: block;	width: 40px; height: 40px; position: absolute;	top: 4px; left: 12px; }
	


	.header2
{	background: #000;
	font-weight: normal;
	color: #fff;
	-moz-box-sizing: border-box;
	box-sizing: border-box;	
	width: 100%; top: 0;
	height: 50px; opacity: .9;
	padding: 7px 0 0 0; position: fixed;}


	@media only screen and (min-width: 480px) 
{ 	.header {width: 10%; background: transparent;}

	.header2 {display: none;}
	 
    .header FixedTop {display: none}
    .header a {display: none;}
}



.header.fixed{ position: fixed; top: 0; left: 0; }


#nav {width: 100%; background: #2a2a2a; position: fixed; opacity:1;  z-index: 32;}



@media all and (min-width : 1400px) {#nav {width: 80%;}}

#nav a {border: 0;  color: #fff; padding: 0 6px;}
#nav a:hover {background: tomato;  padding: 54px 6px 80% 6px; color: #fff; opacity: .8;}
#nav a:active {background: #1A39A0;  padding: 54px 6px 5px 6px;  border-top: 22px solid #fff; border-bottom: 22px solid #1A39A0; color: #fff;  } 



@media only screen and (max-width: 480px) 
{ #nav {display: none;}
}


#nav h3 {padding: 0px; font-weight: normal; font-size: 1.08em; color: #aaa; line-height: 18px;}

@media only screen and (min-width: 668px) {
#nav h3 {padding: 15px 0 0 6%; }	}

@media only screen and (max-width: 668px) {
#nav h3 { font-size: .9em; padding: 4px 0 0 6%; }	}



/*==========content ===============*/

.content, .footer {	text-align: left; background:transparent;}

#contain 
{height: auto; width: auto;
 box-shadow: 0px 0px 60px rgba(23, 23, 23, 0.4); background: transparent url(grad.jpg) repeat;
}

#intro {background: snow; height: auto;  padding-top: 0px;  padding: 40px 0 10px 0px; } 
#intro img {width: 100%;}
#intro h1 {

	color: #000;
	text-shadow: 6px 6px 12px #ccc;
	font-size: 4em;
	letter-spacing: -.05rem;
	padding: 3.2% 8% 2.3% 8%;
}

@media only screen and (max-width: 1024px) {
#intro {  line-height: 1.6em; margin:0;} 
#intro h1 { font-size: 3.6em;}
}


@media only screen and (max-width: 640px) {
#intro {  line-height: 1.6em; margin:0;} 
#intro h1 {  padding: 0 0 0 8%; font-size: 3.2rem !important;
}

@media only screen and (max-width: 480px) {
#intro h1 { font-size: 4.8em; padding: 10% 0 0 4%}
}


#first { height: auto;  width:100%; background: snow;}


#second { height: 1250px; background: transparent url(grad.jpg) repeat; width: 100%;}

#half1 {width: 46%; height: auto;  float: left; padding: 0 0 0 4%; }
#half2 {width: 46%; height: auto; float: right; padding: 0 2% 0 2%;}

@media only screen and (min-width: 1800px) {
	
	#second { height: 950px; }	
}


@media only screen and (max-width: 1024px) {
	#second { height: 1800px; background: transparent url(grad.jpg) repeat;}
#half1 {width: 100%; height: auto;  float: left; padding: 0; }
#half2 {width: 100%; height: auto; float: right;  padding: 0;}
}


@media only screen and (max-width: 480px) {
	#second { height: 1300px; background: transparent url(grad.jpg) repeat;}
}



#third { height: auto;  padding-top: 0px; background: snow; width:auto; }

	
#four{ height: auto;  background: snow url(square.jpg) repeat; width: 100%;} 


.footer
{	background: #222; font-weight: normal;	width: 100%;
	height: auto; bottom: 0; margin: 0; }
	
@media all and (min-width : 1400px) {.footer {width: 100%;}}
	
.footer.fixed
{position: fixed; bottom: 0; left: 0;}


.footer a {color: #fff; border:0;}
.footer a:hover {color: tomato;}
.footer h3 {font-size: 1.6em; margin: 0; padding:18px 0 0px 6%; font-weight: 100; color: #ccc; letter-spacing: .05em;} 

@media only screen and (max-width: 480px) {
	
  .footer	{ position: relative;	font-weight: normal;	width: 100%;	height: 140px;  margin: 0;
 text-align: center; }
	
  .footer h3 {font-size: 1.08em; margin: 0; padding:0; font-weight: normal;  bottom: 0; margin: 0;} 
}