* {margin: 0; padding: 0; outline: 0;}



@font-face {

 font-family: MyCustomFont;

 src: url("../fonts/Britannic__Bold.eot") /* EOT file for IE */

}

@font-face {

 font-family: MyCustomFont;

 src: url("../fonts/Britannic_Bold.ttf") /* TTF file for CSS3 browsers */

}



@font-face {

 font-family: MyCustomFont;

 src: url("../fonts/Britannic_Bold.woff") /* TTF file for CSS3 browsers */

}



 



body {

	font-family: 'Open Sans', Arial, Verdana, sans-serif;

	color: #000;

	font-size: 14px;

	background:#c5c7c7;



}

#logo 

{

background-image:url(images/kwikdraw-logo-new.png);

background-position:left;}



#logo h1

{ 

 

 

 

 

color: #009534;

}





.icons
{float:right;}

.icons ul {margin:5px 0px; list-style:none;}

.icons ul li{
display:inline;
padding-left:5px;
margin:5px 0px;
list-style:none;
text-decoration:none;}

.icons ul li a img
{ width:33px;
height:auto;
}


h1, h2 {

	font-family: 'Open Sans', sans-serif;

	font-weight: 300;

	margin:0 0 15px 0;

}





h1 {

	font-size: 36px;

	letter-spacing: -2px;

	line-height: 100%;

}



h1.title {

	font-size: 46px;

	font-weight: 700;

	color: #6a6a6a;





}



h3

{font-size:28px;

	font-family:'MyCustomFont',Arial,sans-serif;

	margin-bottom:5px;}

h4

{font-size:22px;

	font-family:'Open Sans',Arial,sans-serif;

	margin-bottom:5px;}

 

h2 {

	font-size: 24px;

}



p {

	margin: 0 0 15px 0;

	font-family:'Open Sans',Arial,sans-serif;

	font-weight:400;

	font-size:14px;

	line-height:1.8em;

}



.menuBtn {



	background: center center no-repeat transparent;

	background: #000;

	display: block;

	width: 40px;

	height: 40px;

	position: absolute;

	top: 0;

	left: 10px;



}



.active {

	background: #000;

}

.clear {

	clear: both;

}

.wrap {

		/*background:url(../images/bg.png) top left repeat-x;*/

		width: 100%;

		max-width: 1140px;

		min-width: 1000px;

		z-index: 10;

		position: relative;

		margin: 0 auto;

		padding: 0;

		/*box-shadow: 0px 0px 10px #acadad;*/

}



 





.section {

	width: 100%;

	max-width: 1140px;

	min-width: 1000px;

	z-index: 10;

	position: relative;

	margin: 0 auto;

	padding: 0 0 20px 0;

}





.inner {

	width:1120px;

	padding:8px 10px;

	font-size: 16px;

	font-family: 'Open Sans', sans-serif;

	font-weight: 300;

	 

}





/* This is the selector i used for my menu, it needs to be set as position:absolute; */

.subMenu {

	 position: absolute;

	top: 160px;

	height: 40px;

	z-index: 1000;

	width: 100%;

	max-width: 1140px;

	min-width: 960px;

	background:#008743;



}



.subMenu .inner {

	padding:0;

	font-weight: 400;

	height: 40px;

}











.subNavBtn {

	display: block;

	height: 100%;

	float: left;

	margin: 0px 0px 0 0;

	text-decoration: none;

	font-size: 14px;

	padding: 10px 20px 0 ;

	text-align: center;

	color: #fff;

}



.end {

	margin: 0;

}





/* SECTIONS */

.sTop {

	min-height: 660px;

	background:#fff;

	color:#3d3d3d;

	padding:5px 0px 0px	;

	

	

}



.sTop .inner

{

padding-top:5px;

	 }













 





.s2 {

	min-height: 640px;

	background: #e9e6e1;

}





.s3 {

	min-height: 640px;

	background: #409AA0;

	/*149E9A

	2D918D

	409AA0*/

}





.s4 {

	min-height: 640px;

	background: #FAFDD4;

 

}



.s5 {

	min-height: 640px;

	background: #293b4d;

	 }



#searchbox {

	width:200px;

	float:right;

	margin-right:50px;



}

.search input[type=button], input[type=button]:hover {

	position:relative;

	border:1px solid #adc5cf;

	background: #e4f1f9; /* Old browsers */

	background: -moz-linear-gradient(top, #e4f1f9 0%, #d5e7f3 100%); /* FF3.6+ */

	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #e4f1f9), color-stop(100%, #d5e7f3)); /* Chrome,Safari4+ */

	background: -webkit-linear-gradient(top, #e4f1f9 0%, #d5e7f3 100%); /* Chrome10+,Safari5.1+ */

	background: -o-linear-gradient(top, #e4f1f9 0%, #d5e7f3 100%); /* Opera 11.10+ */

	background: -ms-linear-gradient(top, #e4f1f9 0%, #d5e7f3 100%); /* IE10+ */

	background: linear-gradient(top, #e4f1f9 0%, #d5e7f3 100%); /* W3C */

 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e4f1f9', endColorstr='#d5e7f3', GradientType=0 ); /* IE6-9 */

	color:#7da2aa;

	cursor: pointer;

}

.lighter input[type=text] {

	border:1px solid #d0d0d0;

	background-color:#fcfcfc;

	margin:4px;

}



.search {

	padding:6px 30px;

	background: url('../images/search.png') no-repeat 8px 6px;

	 }

	

	

	#about

	{float:left;

	width:470px;

	padding:10px;

	margin-right:10px;

	 

	min-height:440px;}

	

	#about h3

	{color:#333333;

	 }

	

	#about p

	{text-align:justify;

	

	color:#000;}

	

	p#more  

	{padding:5px 10px;

	float:right;

	background-color:#008743;

	 color:#fff;}

	 

	 p#more  a

	 {color:#FFFFFF;}	

  

 	#news h4

	{color:#16304C;

	font-size:18px;

	font-family:'MyCustomFont',Arial,sans-serif;

	margin:8px 0px;}

	#news p

	{text-align:justify;

	font-family:'Open Sans',Arial,sans-serif;

	font-weight:600;

	font-size:12px;

	line-height:1.8em;

	color:#000;}

	

.date 

{

height:50px;

 font-weight:bold;

margin-right:5px; 

 }



.date .month

{

background-color:#CED9DB;

font-size:12px;

padding:3px 5px;

border-radius:5px  5px 0px 0px;

color:#1E4066;}



.date .day

{background-color:#1E4066;

color:#fff;

font-size:16px;

padding:4px 5px;

font-weight:bold;}

	

.green

{color:#008743;}

	

	

	

	figure { 

  display: block; 

  position: relative; 

  float: left; 

  overflow: hidden; 

  margin: 0 20px 20px 0;

}

figcaption { 

  position: absolute; 

  background: rgba(0,0,0,0.75); 

  color: white; 

  padding: 10px 20px; 

  opacity: 0;

  -webkit-transition: all 0.6s ease;

  -moz-transition:    all 0.6s ease;

  -o-transition:      all 0.6s ease;

}

figure:hover figcaption {

  opacity: 1;

}

figure:before { 

   

  position: absolute; 

  font-weight: 800; 

  background: rgba(255,255,255,0.75); 

  text-shadow: 0 0 5px white;

  color: black;

  width: 24px;

  height: 24px;

  -webkit-border-radius: 12px;

  -moz-border-radius:    12px;

  border-radius:         12px;

  text-align: center;

  font-size: 14px;

  line-height: 24px;

  -moz-transition: all 0.6s ease;

  opacity: 0.75;	

}

figure:hover:before {

  opacity: 0;

}





.cap-bot figcaption { left: 0; bottom: -30%;}

.cap-bot:hover figcaption { bottom: 0;