
body { margin:0px; padding:0px;}

#splash-wrapper { background: rgba(215, 201, 44, 0.6);}
#splash-left { background: rgba(78, 127, 44, 0.6);}
#splash-right { background: rgba(78, 127, 189, 0.6);}

#splash-wrapper { position:relative; text-align:center;}

#splash-wrapper img { margin: 0px auto; position: absolute; top:8%; float:none; left: 0; right: 0;}

.cta { font-weight:bold; font-size:20px; text-transform:uppercase; display: inline-block; background: rgba(0, 0, 0, 0.6); text-align:center; text-decoration:none; color:#fff; border: 1px solid #fff; padding: 3px 40px; margin: 0px auto; 
position:absolute; top:75%; left: 20%; right: 20%;}

.cta:hover { background: rgba(0, 0, 0, 0.9); text-decoration:none;}

#splash-overlay { position: absolute; top:40%; left:0px; right: 0px; background: rgba(0, 0, 0, 0.6); text-align:center;}

#splash-overlay h2 { color:#fff; font-size: 60px; font-weight:bold; text-transform:uppercase; margin:10px 25%; padding: 0px 0px 10px 0px; border-bottom: 1px solid #fff; }
#splash-overlay h1 { color:#fff; font-size: 40px; font-weight: normal; margin: 0px 0px 10px 0px; padding: 0px; }

#splash-left { background: url(../images/left.jpg) no-repeat right center;}
#splash-right { background: url(../images/right.jpg) no-repeat left center;}

html,
body,
#splash-wrapper,
#splash-left,
#splash-right,
#splash-wrapper,
#splash-wrapper .row { height:100%;}


#footer-wrapper { display:block;}
#footer-wrapper-mobile { display:none;}

#splash-left,
#splash-right { position:relative;}



@media (min-width : 320px) and (max-width: 768px) { /* MOBILE ONLY */
	#splash-wrapper img { top:2%;}
	#splash-overlay {  top:45%;}
	#splash-overlay h2 { font-size: 30px; margin:10px 5%; padding: 0px 0px 10px 0px; border-bottom: 1px solid #fff; }
	#splash-overlay h1 { font-size: 20px; margin: 0px 0px 10px 0px; }
	.cta { position: absolute; top:75%; left: 5%; right: 5%; font-size:14px;}
	#splash-right .cta { top:55%;}
	#footer-wrapper { display:none;}
	#footer-wrapper-mobile { display:block; position:absolute; bottom:0px; left:0px; right:0px;}
	}
@media (min-width : 320px) { /* yellow */
	}
@media (min-width : 480px) { /* orange */
	}
@media (min-width : 768px) { /* red */
	}
@media (min-width : 992px) { /* purple */
	}
@media (min-width : 1200px) { /* blue */
	}



/*##############################################################################################################################################################################################################
#
#		FOOTER
#
################################################################################################################################################################################################################*/
#footer-wrapper,
#footer-wrapper-mobile { background:#000; color:#4a4a4a; font-size:11px;}
#footer { padding-bottom: 10px; padding-top: 10px;}


#footer .row { margin:0px; padding:0px;}



/*##############################################################################################################################################################################################################
#
#		FOOTER SEO
#
################################################################################################################################################################################################################*/
#seo-footer a { color:#fff;}
#seo-footer { text-align:center;}
#seo-footer h2,
#seo-footer h3,
#seo-footer h4 { color:#666666; margin:0px; padding:0px;}

#seo-footer h2 { font-size:14px;}
#seo-footer h3 { font-size:12px;}
#seo-footer h4 { font-size:12px;}

@media (min-width : 320px) and (max-width: 768px) { /* MOBILE ONLY */
	#seo-footer { padding:20px 0px}
}




/*##############################################################################################################################################################################################################
#
#		CREDITS
#
################################################################################################################################################################################################################*/
#credits {  text-align: right; background:url(../images/chameleon_creative.gif) no-repeat right 0px;}
#credits a, #credits a:active, #credits a:link, #credits a:visited { margin: 0px 25px 0px 0px; color: #4a4a4a; text-decoration: none; display: block; font-size: 10px; line-height:11px; }
#credits a:hover { color: #fff; text-decoration: underline; }


div.dialog-off-canvas-main-canvas { height: 100%; }
