body
{
 background: #000;
 padding: 0;	
  margin: 0;
 font-family: 'Oswald', sans-serif;
 position: relative;
 -webkit-text-size-adjust: none; margin: 0;	
 border-left: 0;
 border-right: 0;
 }


@media only screen and (min-width: 1601px) 
{body {margin:0 10% ;}
}


@media only screen and (min-width: 2001px) 
{body {margin:0 20% ; }
}


@media only screen and (max-width: 1220px) 
{body {margin:0 ; }}


@media only screen and (max-width: 480px) 
{body
{width: 100%; margin: 0; border: 0;}
}

body *
{	text-shadow: none;}

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


h1{	font-size:3.6em; padding: 32px 12% 0px 12%; color: white;  line-height: 1.4em; }

h2{font-size: 2em;  padding: 0 10%;  line-height: 1.4em; 
color:/*#6A7C80*/ white; margin: 0; font-weight: 400; }

h3{	font-size: 1.4em; line-height: 1.9em; padding: 0 10% 8px 10%; color: #007A3D; font-weight: 300; margin: 0;}

h4 {font-size: 1.2em; padding: 0px 20% 12px 10%; color: white; font-weight: 300;
letter-spacing: 0.09em;
line-height: 1.8em; color: #eee;}

h5 {font-size: 1.4em; padding: 0px 10% 0 10%; color: #ffc; 
font-weight: 100; line-height: 1.4em;}

h6 {font-size: 0.777em; padding: 12px 8% 0 12%; color: #6F9992; 
font-weight: 100; line-height: 1.8em; letter-spacing: 0.09em;}

p{font-size: 1.08em; margin: 0 ; padding:0 12% 0 10%;  line-height:2em; color: white; font-weight: 100; 
  }



@media only screen and (max-width: 768px) 

{ h1, h2, h3 {padding: 0 10%;}

     }



@media only screen and (max-width: 480px) {

	h1 {font-size: 1.8em; padding: 23px 3% 0 5%; line-height: 1.4em;}

	h2 {font-size: 1.6em; padding:0 5% 23px 5%;}

	h3 {font-size: 1.2em; padding: 0 5%; }

	h4 {font-size: 1.1em;}

	h3, h4, p{ padding:0 5%; }

	
h4, h5, h6 { padding: 12px 5% 0 5%;  font-weight: 300; line-height: 1.6em;}
}




.menu {margin: 0 0 0 32px; font-size: 1.2em;}

.menu2  {margin: 0 0 0 120px;font-size: 1.2em;}

.menu3  {margin: 0 0 0 100px;font-size: 1.2em;}

.menu4  {margin: 0 0 0 42px;font-size: 1.2em;}

.back  {background: #fff; padding: 2px;}



.lge {font-size: 1.8em;}

.sml{font-size:.6em;  letter-spacing: .23em;}
.sml2{font-size:.5em; letter-spacing: .15em; color: #ffc;}
.sml3{font-size:.5em; letter-spacing: .15em; color: #eee;}

.white {color: #fff; font-size: 1.2em;}

.red2 {color: #e00;}

.orr {color: lavender;}

.dsg {color: skyblue;}
.dtg {color: skyblue;   padding: 0 0 0 35%; }

.white {color: #fff; font-size: 1.8em; padding: 32px 15%;}
.green { color: olivedrab; font-variant:small-caps; font-size: 1.2em;}

iframe {
	border: 2px solid white;}

	

#bar h3 {margin:5% 15% !important;}


@media only screen and (max-width: 1024px) {
#bar h3 {margin:5% 4% 5% 0% !important;}
}

.postpone {
	background: #ff9;
font-size: 1.4rem !important; 
color: black !important;
 margin:1% 8%;
padding:2% 4%;
text-align: center;
}


@media only screen and (max-width: 480px) {

.subhead {font-size: 1.2em;}

.hols {padding: 12px 6px;}

}



a, a:link, a:active, a:visited, a:hover

{color: yellowgreen; border-bottom: 1px dotted; text-decoration: none; outline:none; opacity:1;}



a {outline: none;}

a:hover{color: white !important; text-decoration: none ; outline:none; 
border-bottom:2px solid !important;}

a:active {color: teal;}

.red a {color: #496661; outline:none;}

.red a:hover {color:#CF7000 ;}

.perky {font-weight: 600; color: white;   margin: 0 16px; }


 ul li, ol li {	 margin: 0px 2% 0 4%;  padding: 0 0 8px 0px; color: #6F9992; font-size: 1.08em;}

 

 @media only screen and (max-width: 480px) {

	 ul li { margin: 0px 2% 0 0%; }

 }



img { max-width: 100%; height: auto; padding: 0; border: 0 !important;} 



 .content {text-align: left; background: #000; margin: 0;} 


.header

{	background:#111;	font-weight: normal; 

	-moz-box-sizing: border-box; box-sizing: border-box;	

	width: 100%; top: 0; height: 0px; 

	padding: 0 50px; position: fixed; opacity: .8;}



	

	.header2

{	background:#111;	font-weight: normal;

	color: #fff;

	-moz-box-sizing: border-box; box-sizing: border-box;	

	width: 100%; top: 0; height: 50px; opacity: .9;

	padding: 7px 0px 0 0; position: fixed;}

	

     .header a
     {	background: center center no-repeat hsl(23, 70%, 22%);
       background-image: url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADhJREFUeNpi/P//PwOtARMDHQBdLGFBYtMq3BiHT3DRPU4YR4NrNAmPJuHRJDyahEeT8Ii3BCDAAF0WBj5Er5idAAAAAElFTkSuQmCC);
       display: block;	
       width: 46px; 
       height: 46px; 
       position: absolute;
       border: 0 !important;	
       top: 5px;	
       left: 12px; }
       
     @media only screen and (min-width: 480px) 
     { 		.header {
       width: 10%;}
     
         .header2 {
           display: none;}
     
         .header FixedTop {
           display: none}
     
             .header a {
           display: none;}
     }
       
     .header.fixed { 
       position: fixed; 
       top: 0; 
       left: 0;  }
     



	@media only screen and (min-width: 481px) { 

		.header {width: 10%;} 

		.header2 {display: none;}

		 }

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

#intro { height: auto;  padding: 0;  margin: 0px;} 

.socmed { padding: 0px 0 0 23px; }

.one {color: #006;  font-weight: 100;}

.two {color: #A7E9FF; padding: 0;  font-weight: 100;}



#bar {
	 background: black; 
     width: 100%; 
     height:auto; 
     padding: 0 0 30px 0; 
     margin:0;
	  }



@media only screen and (max-width: 768px) { 

#bar {padding: 0 0 10px 0;  }

}




#bar h1 { font-size: 8em;  padding:60px 5% 20px 10%;  margin:0; font-variant:normal; font-weight: 300; letter-spacing: .108rem; color: white; }


@media only screen and (max-width: 800px) {
{font-size: 5rem !important;
  letter-spacing:0.5rem;}
}

#bar h2 {color: white; padding:2% 5% 23px 10%;  font-family:Georgia, "Times New Roman", Times, serif; font-size: 3em;} 


@media only screen and (max-width: 768px) { 
#bar h2 { padding: 2% 5% 0 10%;}
}


#bar h3 {font-size: 1.8em; padding: 0px 0px 23px 5.8%;  letter-spacing: 0.4em; font-weight: 100; color: white; margin:0; }
#bar p {color: white; font-size: 1.4em;}


#bar img {padding: 0px 4px 0 0; }

#bar a {border: 0;}



@media only screen and (max-width: 768px) { 

#bar { padding: 40px 0 0 0;}

#bar h1 {font-size: 5em;}

}



@media only screen and (max-width: 480px) { 

#bar {height: auto; } 

#bar img {padding: 0 0 12px 0;}

#bar h1  {font-size: 4em; padding: 32px 2.3% 23px 8%; line-height: 1.08em;}

#bar h2 {padding: 0 10%;}

#bar h3 {font-size: 1em; padding: 0px 2.3% 0 6%; letter-spacing: .15em;}

}



form {padding: 0 0 50px 10%;}


#social {width: 100%; height: 1px; background: #000; padding: 20px 0 0 0; }

#first h1  {padding: 23px 10% 0 10%;}
#first {background: black; height: auto; padding: 0; margin:0; width: 100%; max-width: 60rem; }

#first img {width: 100%; height: auto;}




#second {background: black; height: auto; padding: 0; margin: 0; width:100%;}

 #second h1, 
#second h2, #second p {padding: 0 7%;}

#second img {border: 1px solid #fff !important; max-width: 100%;}



@media only screen and (max-width: 768px) {

#second h1 {font-size: 2.5em; padding: 32px 0 0 5%;}	

#second h2 {font-size: 1.6em;}

}





@media only screen and (max-width: 480px) {

#second h1 {font-size: 2em;}

#second h2 {padding: 0 5%;}	

}





#title {width: 100%; height: auto; float:left;  padding: 2% 0 2% 6%;}

#title h2 {color: #888; font-variant:small-caps; font-size: 1.8em;}

#title h3 {letter-spacing: .05em; }







#third {background: black; height: auto;  padding: 0; margin:0;  }



#third h1 {color: #e00;}

#third h2 {padding: 0 5% 32px 5%; color: #fff;}

#third p {color: white;}

#third img {border: 4px solid #fff; margin: 0 18px 0 0;}

	



.footer

{
	font-weight: normal;	
width: 90%; height: auto; 
padding: 0 5%;
text-align: right; 
background: black;

}
	

.footer img {border: 0; padding: 0 12px 0 0;}

.footer.fixed

{position: fixed; bottom: 0; left: 0;}

.footer a {border: 0; padding: 3px 0px; opacity: 0.7;}

.footer a:hover {opacity: 1; color: white !important;}





.footer h3 {font-size: 1.8em; line-height: 1.6em; margin: 0; padding: 50px 0 0 0; font-weight: normal; color: white;} 

.footer p {font-size: 1em;  margin: 0; padding: 14px 0 10px 0; font-weight: normal; color: white;} 



@media only screen and (max-width: 480px) {

.footer.fixed {background: #3f1d1d;}

}


/* nav */

nav { margin:0; width: 95%; position: fixed;   float: left; background: black; padding: 12px 0 0 5%; height: 60px;}


@media only screen and (max-width: 920px) {
nav {margin:  0; padding: 0; width: 100%; position: fixed; z-index: 32;  float: left; }}
	
@media only screen and (max-width: 480px) {#nav {display: none;}}

/*
#nav h3 {padding: 8px 0 0 0px; font-weight: normal; font-size: 1.08em; color: #222; margin: 0;}

@media only screen and (max-width: 920px) {
#nav h3 { font-size: .85em; }	}

*/
nav ul li {	list-style-type: none;	margin: 0; padding:0; }


/* code for menu---- http://www.cssscript.com/pure-css-mobile-compatible-responsive-dropdown-menu/ ------*/
 .toggle, [id^=drop] {display: none;}


nav:after {
  content: "";
  display: table;
  clear: both;
}

nav ul {padding: 0;  margin: 0;  list-style: none;  position: relative;  text-align:left;}

@media only screen and (max-width: 920px) {	nav ul {text-align:center;}	}


nav ul li {  margin: 0px; display: inline-block; font-size: 1.08em;
  float: left;   z-index: 20; /* here for 2nd part of menu */
  	list-style-type: none;}

nav ul li:hover { opacity: 1; }

nav a {  display: block;   padding: 0 12px; color: #fff !important; line-height: 50px;
  text-decoration: none;}

nav a:hover {background: tomato; border-bottom: 0;}

nav ul li ul li:hover {color: #000; }

nav ul ul {
  display: none;
  position: absolute;
  top: 50px; 
}

nav ul li:hover > ul { display: inherit;  }

nav ul ul li {
  width:210px; background: black; border-bottom: 0;
  float: none;
  display: list-item;
  position: relative; opacity: 1;
}
	
nav ul ul ul li {
  position: relative;
  top: -60px;
  left: 210px;
  width:270px;
}

nav ul ul ul li:hover {   background: tomato;}

li > a:after { content: ' '; }

li > a:only-child:after { content: ''; }


/* Media Queries
--------------------------------------------- */

@media all and (max-width : 2920px) {


.toggle + a,
 .menu { display: none; }

.toggle {
  display: block; 
  background-color:black; /* colour of mobile device menu */
  padding: 0;
  color: #fff;
   line-height: 50px;
  text-decoration: none; width: 100%;
  border: none; margin:  0;  letter-spacing:0.23em;
}

.toggle:hover {  color: tomato; }

[id^=drop]:checked + ul { display: block; }

nav ul li {  display: block;  width: 100%; background: black; padding: 0;}

nav ul ul .toggle,
 nav ul ul a { padding: 20px; }

nav ul ul ul a { padding: 0; }

nav a:hover,  nav ul ul ul a { background-color: #111; color: #fff !important; }

nav ul li ul li .toggle,  nav ul ul a { background-color: #111; color: #fff !important;}

nav ul ul {  float: none;  position: static;  color: #fff !important; background-color: #111; }

nav ul ul li:hover > ul,
nav ul li:hover > ul { display: none; }

nav ul ul li {  display: block;  width: 100%;}

nav ul ul ul li { position: static;}

nav ul ul li:hover {color:#f00;}

}


@media all and (max-width : 330px) {

nav ul li {  display: block;  width: 100%;}
}


.hr {height: 6px; 
 }

#box{
  float: left;	
  height: auto;
  padding: 0px;
  margin:  4% 1% 0% 1%;
  width: 31.3%;
}


@media only screen and (max-width: 1200px) {
  #box {
    width: 46%;
    margin:  2% 3% 2% 1%;
  }
  #one {width: 98% !important;} 
}



@media only screen and (max-width: 768px) {
  #box {
    width: 96%;
    margin:  2% 3% 2% 1%;
  }
  #one {width: 98% !important;} 
}

#box:hover {
  opacity: 1;  
}


.hold {width: 100%; 
height: auto; 
}


@media only screen and (max-width: 1024px) {
	
.hold {margin: 40px 0 0 0;
}
	
}


#top{
  float: left;
  height: auto;
  padding: 0px;
  margin:  2% 1% 2% 3%;
  width: 29.33%;
}

@media only screen and (max-width: 1024px) {
#top{
  float: left;
  height: auto;
  padding: 0px;
  margin:  2% 5%;
  width: 90%;
}
}


#one {
  width: 100%;
  height: auto;
  padding: 10px 0 10px 0 ;
  margin: 0;
/*  background: #079;*/
}

#one h2 {
  font-size: 2rem; 
  padding: 6px 0 0px 15px;
  color: #fff;
  margin: 0;
  line-height: 1.4em;
  font-weight: 100;
  
}

#one h4 {
  font-size: 1rem;
  padding:2px 0 0 17px ;
  line-height: 1.8em;
  margin: 0;
  font-weight: 100;
  letter-spacing: .1em; 
  }
  
  
  #con {background: transparent; }

/*
#con a {
  border: 0px !important; 
  padding: 0 !important;}

#con a:hover {
	background: transparent !important; 
  margin: 0 !important; 
	padding: 0 !important; }
*/
  
#con img{
 width: 95%;
  padding: 0%; 
  margin:0% 0 0 3%!important;
     box-shadow: 0 !important;
  border: 2px dotted #333 !important;
  }
  
    
#con img:hover{
   border: 2px solid #fff !important;
   }

 
#one:hover {
  opacity: 1;
}

#one a {
  border: 0 !important;
}