@charset "utf-8";
/* RESPONSIVE CSS TEMPLATE */

/* CUSTOM CSS */



/* SITE SETTINGS */
body {
    font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
	font-size:14px;
	line-height:18px;
	color: #000;
	background-color: #D4D4D4;
	
}

/* SPECIAL FONT TYPE */
.font1{
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.font2{
	font-family:Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif;
}
.font3{
	font-family:Impact, Haettenschweiler, "Franklin Gothic Bold", "Arial Black", sans-serif;
}

/* SPECIAL FONT COLOR */

.fontRed{ color:#FF0004; }
.fontOrange{ color:#FF6E00; }
.fontYellow{ color:#FFC600; }
.fontGreen{ color:#08760E; }
.fontLightBlue{ color:#339EEB; }
.fontDarkBlue{ color:#002D6A; }
.fontPurple{ color:#4E0983; }
.fontBlack{ color:#000000; }
.fontGrey{ color:#555555; }
.fontWhite{ color:#FFFFFF; }
.fontBrown{ color:#311A00; }

/* PARAGRAPH FORMATS */

h1 { font-size:28px; line-height:36px; }
h2 { font-size:24px; line-height:24px; }
h3 { font-size:18px; line-height:20px; }
h5 { font-size:14px; line-height:20px; }
h6 { font-size:8px; line-height:14px; }
p { font-size:14px; line-height:18px; }

/* SPECIAL SETTINGS */

hr{ color:#000000; }


/* CONTENT FORMATTING */
@media (min-width: 1201px) {
	
#desktop{
	display:block;
}
#tablet{
	display:none;
}
#phone{
	display:none;
}
	#headerFull{ width:1001px; float:none; clear:none; background-color:#FFFFFF; height:auto; }
	#headerFixed{ width:1100px; margin-left:auto; margin-right:auto; float:none; clear:none; background-color:#FFFFFF; } 

	#navBarFull{ width:100%; background-color:#7899C0; float:none; clear:none; }
	#navBarFixed{ width:1100px; background-color:#555555; margin-left:auto; margin-right:auto; float:none; clear:none;}
	#onScreenNav{ display:block; background-color:#555555; float:none; clear:none; }
	#pushMenuNav{ display:none; background-color:#555555; float:none; clear:none; }

	#bannerFull{ max-width:1200px; width:100%; margin-top: -35px; float:none; clear:none; }
	#bannerFixed{ width: 1100px; margin-left:auto; margin-right:auto; float:none; clear:none; }

	#contentContainerFull{ width:100%; padding:25px; float:none; clear:none; }
	#contentContainerFixed{ width:1100px; padding:25px; margin-left:auto; margin-right:auto; float:none; clear:none; }

	#content1{ width:100%; margin-left:auto; margin-right:auto; float:none; clear:none; }
	#content2{ width:80%; margin-left:auto; margin-right:auto; float:none; clear:none; }
	#content3{ width:50%; float:none; clear:none; }
	#content4{ width:33.33%; float:none; clear:none; }

	.showThis{ display:block; float:none; clear:none; }
	.hideThis{ display:none; float:none; clear:none; }

}

@media (min-width: 901px) and (max-width: 1200px) {
	
#desktop{
	display:none;
}
#tablet{
	display:block;
}
#phone{
	display:none;
}
	#headerFull{ width:100%; height:auto; float:none; clear:none; background-color:#FFFFFF; }
	#headerFixed{ width:100%; margin-left:auto; margin-right:auto; float:none; clear:none; } 

	#navBarFull{ width:100%; background-color:#7899C0; float:none; clear:none; }
	#navBarFixed{ width:100%; background-color:#555555; margin-left:auto; margin-right:auto; float:none; clear:none;}
	#onScreenNav{ display:block; background-color:#555555; float:none; clear:none; }
	#pushMenuNav{ display:none; background-color:#555555; float:none; clear:none; }

	#bannerFull{ max-width:1200px; width:100%; margin-top: -35px; float:none; clear:none; }
	#bannerFixed{ width: 100%; margin-left:auto; margin-right:auto; float:none; clear:none; }

	#contentContainerFull{ width:100%; padding:25px; float:none; clear:none; }
	#contentContainerFixed{ width:100%; padding:25px; margin-left:auto; margin-right:auto; float:none; clear:none; }

	#content1{ width:100%; margin-left:auto; margin-right:auto; float:none; clear:none; }
	#content2{ width:80%; margin-left:auto; margin-right:auto; float:none; clear:none; }
	#content3{ width:50%; float:none; clear:none; }
	#content4{ width:33.33%; float:none; clear:none; }

	.showThis{ display:block; float:none; clear:none; }
	.hideThis{ display:none; float:none; clear:none; }

}

@media ( min-width : 601px ) and (max-width : 900px ){
	
#desktop{
	display:none;
}
#tablet{
	display:block;
}
#phone{
	display:none;
}
	#headerFull{ width:100%; height:auto; float:none; clear:none; background-color:#FFFFFF; }
	#headerFixed{ width:100%; margin-left:auto; margin-right:auto; float:none; clear:none; } 

	#navBarFull{ width:100%; background-color:#7899C0; float:none; clear:none; }
	#navBarFixed{ width:100%; background-color:#555555; margin-left:auto; margin-right:auto; float:none; clear:none;}
	#onScreenNav{ display:none; background-color:#555555; float:none; clear:none; }
	#pushMenuNav{ display:block; background-color:#555555; float:none; clear:none; }

	#bannerFull{ max-width:1200px; width:100%; margin-top: -35px; float:none; clear:none; }
	#bannerFixed{ width: 100%; margin-left:auto; margin-right:auto; float:none; clear:none; }

	#contentContainerFull{ width:100%; padding:25px; float:none; clear:none; }
	#contentContainerFixed{ width:100%; padding:25px; margin-left:auto; margin-right:auto; float:none; clear:none; }

	#content1{ width:100%; margin-left:auto; margin-right:auto; float:none; clear:none; }
	#content2{ width:80%; margin-left:auto; margin-right:auto; float:none; clear:none; }
	#content3{ width:50%; float:none; clear:none; }
	#content4{ width:33.33%; float:none; clear:none; }

	.showThis{ display:block; float:none; clear:none; }
	.hideThis{ display:none; float:none; clear:none; }

}

@media (max-width: 600px) {
	
#desktop{
	display:none;
}
#tablet{
	display:none;
}
#phone{
	display:block;
}
	#headerFull{ width:100%; height:auto; float:none; clear:none; background-color:#FFFFFF; }
	#headerFixed{ width:100%; margin-left:auto; margin-right:auto; float:none; clear:none; } 

	#navBarFull{ width:100%; background-color:#7899C0; float:none; clear:none; }
	#navBarFixed{ width:100%; background-color:#555555; margin-left:auto; margin-right:auto; float:none; clear:none;}
	#onScreenNav{ display:none; background-color:#555555; float:none; clear:none; }
	#pushMenuNav{ display:block; background-color:#555555; float:none; clear:none; }

	#bannerFull{ width:100%; float:none; margin-top: -35px; clear:none; }
	#bannerFixed{ width: 100%; margin-left:auto; margin-right:auto; float:none; clear:none; }

	#contentContainerFull{ width:100%; padding:25px; float:none; clear:none; }
	#contentContainerFixed{ width:100%; padding:25px; margin-left:auto; margin-right:auto; float:none; clear:none; }

	#content1{ width:100%; margin-left:auto; margin-right:auto; float:none; clear:none; }
	#content2{ width:80%; margin-left:auto; margin-right:auto; float:none; clear:none; }
	#content3{ width:50%; float:none; clear:none; }
	#content4{ width:33.33%; float:none; clear:none; }

	.showThis{ display:block; float:none; clear:none; }
	.hideThis{ display:none; float:none; clear:none; }

}


/* RESPONSIVE  COLUMN GRID SYSTEM */

/* 2 */
.span_2_of_2 { width: 100%; }
.span_1_of_2 { width: 48%; }
/* 3 */
.span_3_of_3 { width: 100%; }
.span_2_of_3 { width: 66.13%; }
.span_1_of_3 { width: 31%; }
/* 4 */
.span_4_of_4 { width: 100%; }
.span_3_of_4 { width: 74.6%; }
.span_2_of_4 { width: 49.2%; }
.span_1_of_4 { width: 23.8%; }
/* 5 */
.span_5_of_5 { width: 100%; }
.span_4_of_5 { width: 79.68%; }
.span_3_of_5 { width: 59.36%; }
.span_2_of_5 { width: 39.04%; }
.span_1_of_5 { width: 18.72%; }
/* 6 */
.span_6_of_6 { width: 100%; }
.span_5_of_6 { width: 83.06%; }
.span_4_of_6 { width: 66.13%; }
.span_3_of_6 { width: 49.2%; }
.span_2_of_6 { width: 32.26%; }
.span_1_of_6 { width: 15.33%; }
/* 7 */
.span_7_of_7 { width: 100%; }
.span_6_of_7 { width: 85.48%; }
.span_5_of_7 { width: 70.97%; }
.span_4_of_7 { width: 56.45%; }
.span_3_of_7 { width: 41.94%; }
.span_2_of_7 { width: 27.42%; }
.span_1_of_7 { width: 12.91%; }
/* 8 */
.span_8_of_8 { width: 100%; }
.span_7_of_8 { width: 87.3%; }
.span_6_of_8 { width: 74.6%; }
.span_5_of_8 { width: 61.9%; }
.span_4_of_8 { width: 49.2%; }
.span_3_of_8 { width: 36.5%; }
.span_2_of_8 { width: 23.8%; }
.span_1_of_8 { width: 11.1%; }
/* 9 */
.span_9_of_9 { width: 100%; }
.span_8_of_9 { width: 88.71%; }
.span_7_of_9 { width: 77.42%; }
.span_6_of_9 { width: 66.13%; }
.span_5_of_9 { width: 54.84%; }
.span_4_of_9 { width: 43.55%; }
.span_3_of_9 { width: 32.26%; }
.span_2_of_9 { width: 20.97%; }
.span_1_of_9 { width: 9.68%; }
/* 10 */
.span_10_of_10 { width: 100%; }
.span_9_of_10 { width: 89.84%; }
.span_8_of_10 { width: 79.68%; }
.span_7_of_10 { width: 69.52%; }
.span_6_of_10 { width: 59.36%; }
.span_5_of_10 { width: 49.2%; }
.span_4_of_10 { width: 39.04%; }
.span_3_of_10 { width: 28.88%; }
.span_2_of_10 { width: 18.72%; }
.span_1_of_10 { width: 8.56%; }
/* 11 */
.span_11_of_11 { width: 100%; }
.span_10_of_11 { width: 90.76%; }
.span_9_of_11 { width: 81.52%; }
.span_8_of_11 { width: 72.29%; }
.span_7_of_11 { width: 63.05%; }
.span_6_of_11 { width: 53.81%; }
.span_5_of_11 { width: 44.58%; }
.span_4_of_11 { width: 35.34%; }
.span_3_of_11 { width: 26.1%; }
.span_2_of_11 { width: 16.87%; }
.span_1_of_11 { width: 7.63%; }
/* 12 */
.span_12_of_12 { width: 100%; }
.span_11_of_12 { width: 91.53%; }
.span_10_of_12 { width: 83.06%; }
.span_9_of_12 { width: 74.6%; }
.span_8_of_12 { width: 66.13%; }
.span_7_of_12 { width: 57.66%; }
.span_6_of_12 { width: 49.2%; }
.span_5_of_12 { width: 40.73%; }
.span_4_of_12 { width: 32.26%; }
.span_3_of_12 { width: 23.8%; }
.span_2_of_12 { width: 15.33%; }
.span_1_of_12 { width: 6.86%; }

			/*  SECTIONS  ======== */
			
			.section { clear: both; padding: 0px; margin: 0px; }
			
			/*  GROUPING  ======== */
			
			
			.group:before,
			.group:after { content:""; display:table; }
			.group:after { clear:both; }
			.group { zoom:1; } /* For IE 6/7 (trigger hasLayout) */
			
			/*  GRID COLUMN SETUP   ======== */
			
			.col { display: block; float:left; margin: 1% 0 1% 1.6%; }
			.col:first-child { margin-left: 0; } /* all browsers except IE6 and lower */

@media only screen and (max-width : 600px ){
	/* 2 */
	.span_2_of_2 { width: 100%; }
	.span_1_of_2 { width: 100%; }
	/* 3 */
	.span_3_of_3 { width: 100%; }
	.span_2_of_3 { width: 100%; }
	.span_1_of_3 { width: 100%; }
	/* 4 */
	.span_4_of_4 { width: 100%; }
	.span_3_of_4 { width: 100%; }
	.span_2_of_4 { width: 100%; }
	.span_1_of_4 { width: 100%; }
	/* 5 */
	.span_5_of_5 { width: 100%; }
	.span_4_of_5 { width: 100%; }
	.span_3_of_5 { width: 100%; }
	.span_2_of_5 { width: 100%; }
	.span_1_of_5 { width: 100%; }
	/* 6 */
	.span_6_of_6 { width: 100%; }
	.span_5_of_6 { width: 100%; }
	.span_4_of_6 { width: 100%; }
	.span_3_of_6 { width: 100%; }
	.span_2_of_6 { width: 100%; }
	.span_1_of_6 { width: 100%; }
	/* 7 */
	.span_7_of_7 { width: 100%; }
	.span_6_of_7 { width: 100%; }
	.span_5_of_7 { width: 100%; }
	.span_4_of_7 { width: 100%; }
	.span_3_of_7 { width: 100%; }
	.span_2_of_7 { width: 100%; }
	.span_1_of_7 { width: 100%; }
	/* 8 */
	.span_8_of_8 { width: 100%; }
	.span_7_of_8 { width: 100%; }
	.span_6_of_8 { width: 100%; }
	.span_5_of_8 { width: 100%; }
	.span_4_of_8 { width: 100%; }
	.span_3_of_8 { width: 100%; }
	.span_2_of_8 { width: 100%; }
	.span_1_of_8 { width: 100%; }
	/* 9 */
	.span_9_of_9 { width: 100%; }
	.span_8_of_9 { width: 100%; }
	.span_7_of_9 { width: 100%; }
	.span_6_of_9 { width: 100%; }
	.span_5_of_9 { width: 100%; }
	.span_4_of_9 { width: 100%; }
	.span_3_of_9 { width: 100%; }
	.span_2_of_9 { width: 100%; }
	.span_1_of_9 { width: 100%; }
	/* 10 */
	.span_10_of_10 { width: 100%; }
	.span_9_of_10 { width: 100%; }
	.span_8_of_10 { width: 100%; }
	.span_7_of_10 { width: 100%; }
	.span_6_of_10 { width: 100%; }
	.span_5_of_10 { width: 100%; }
	.span_4_of_10 { width: 100%; }
	.span_3_of_10 { width: 100%; }
	.span_2_of_10 { width: 100%; }
	.span_1_of_10 { width: 100%; }
	/* 11 */
	.span_11_of_11 { width: 100%; }
	.span_10_of_11 { width: 100%; }
	.span_9_of_11 { width: 100%; }
	.span_8_of_11 { width: 100%; }
	.span_7_of_11 { width: 100%; }
	.span_6_of_11 { width: 100%; }
	.span_5_of_11 { width: 100%; }
	.span_4_of_11 { width: 100%; }
	.span_3_of_11 { width: 100%; }
	.span_2_of_11 { width: 100%; }
	.span_1_of_11 { width: 100%; }
	/* 12 */
	.span_12_of_12 { width: 100%; }
	.span_11_of_12 { width: 100%; }
	.span_10_of_12 { width: 100%; }
	.span_9_of_12 { width: 100%; }
	.span_8_of_12 { width: 100%; }
	.span_7_of_12 { width: 100%; }
	.span_6_of_12 { width: 100%; }
	.span_5_of_12 { width: 100%; }
	.span_4_of_12 { width: 100%; }
	.span_3_of_12 { width: 100%; }
	.span_2_of_12 { width: 100%; }
	.span_1_of_12 { width: 100%; }
	
				/*  REMOVE MARGINS AS ALL GO FULL WIDTH AT 480 PIXELS */

				.col { margin: 1% 0 1% 0%; }
				
	
}