html, body {
	margin: 0px;
	padding: 0px;
	
	font-family: Helvetica;
}

body.contact {
	overflow-x: hidden;
}

#content {
	margin: 3% 4% 0;
	
	border-top: 3px solid #000000;
	float: left;
	width: 92%;
	
	padding-top: 3%;
}

body.about #content {
	margin: 3% 4%;
}

#left-column {
	width: 20%;
	margin-right: 2%;
	float:left;
}

#right-column {
	width:78%;
	float:left;
}

body.home #right-column {
	float: right;
}

body.about #right-column {
	background: url("../images/about-splash.jpg") no-repeat scroll right center / cover  rgba(0, 0, 0, 0); 
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	padding-bottom: 3%;
}

#CFS {
	background: url(../images/CFS_logo.png) no-repeat;
	background-image: -webkit-image-set(url(../images/CFS_logo.png) 1x,
					url(../images/CFS_logo@2.png) 2x);
	
	width: 155px;
	height: 44px;
	display: block;
}

#nav {
	margin-top: 144px;
	border-top: 1px solid #000000;
	padding: 0px;
}

#nav li {
	list-style-type: none;
	border-bottom: 1px solid #000000;
	margin-left: 2px;
	padding: 4px 0;
}

#nav li a {
	font-weight: bold;
	color: #000000;
	text-decoration: none;
}

#nav li a.active {
	color: #00aeef;
}

#nav li a:hover {
	color: #00aeef;
}

#details {
	width: 27%;
	float: left;
	margin-right: 3%;
}

body.about #details {
	min-width: 500px;
	width: 35%; 
}

#details .box {
	margin-top: 187px;
	background: #00aeef;
	color: #FFFFFF;
	padding: 22px;
	
	font-weight: bold;
}

body.services #details .box {
	margin-top: 187px;
	background: #FFFFFF;
	color: #7b7c7e;
	padding: 0px;
	min-width: 640px;
}

body.services .images {
	width:42%;
	float:left;
}

#details .box p:first-child {
	margin-top: 0px;
}

#details .box p:last-child {
	margin-bottom: 0px;
}

#details .box a {
	text-decoration: none;
	color: #FFFFFF;
}

#details .box a:hover {
	text-decoration: underline;
}

.highlight {
	color: #00aeef;
}

body.services #details .box .title {
	margin-bottom: 23px;
}

body.services #details .box .title, body.services #details .box .content {
	width: 100%;
}

body.services #details .box .left, body.services #details .box .right {
	width: 48%;
	float:left;
	font-size: 14px;
}

body.services #details .box .left {
	margin-right: 2%;
}

body.services #details {
	width: 55%;
}


#splash {
  background: url("../images/splash.jpg") no-repeat scroll right bottom rgba(0, 0, 0, 0);
  float: left;
  height: 89.2%;
  width: 70%;
}

#splash .message {
  background: url("../images/contact-banner.png") no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0);
  height: 20%;
  margin-left: 27%;
  margin-top: 60%;
  width: 70%;
}

#credit {
  bottom: 10px;
  height: 169px;
  overflow: hidden;
  position: absolute;
  right: 3px;
  width: 150px;
}

#credit p {
	/* Safari */
	-webkit-transform: rotate(-90deg);
	/* Firefox */
	-moz-transform: rotate(-90deg);
	/* IE */
	-ms-transform: rotate(-90deg);
	/* Opera */
	-o-transform: rotate(-90deg);
	/* Internet Explorer */
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
	
	width: 262px;
	transform-origin: 100% 100%;
}

@-moz-document url-prefix() { 
	#credit {
		width: 261px;
		right: 10px;
		height: 299px;
	}

	#credit p {
		width: 262px;
		transform-origin: 100% 100%;
	}
}

#credit a {
	color: #000000;
	text-decoration: none;
}

#credit a:hover {
	text-decoration: underline;
}

/* HOMEPAGE TILES */
.item {
	position: absolute;
	overflow: hidden;
}

.item-1 { background: url(../images/home-1.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); }
.item-2 { background: url(../images/home-2.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); }
.item-3 { background: url(../images/home-3.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0);}
.item-4 { background: url(../images/home-4.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); }
.item-5 { background: url(../images/home-5.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); }
.item-6 { background: url(../images/home-6.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); }
.item-7 { background: url(../images/home-7.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); }
.item-8 { background: url(../images/home-8.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); background-size: 100% auto !important; }
.item-9 { background: url(../images/home-9.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); }
.item-10 { background: url(../images/home-10.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); }
.item-11 { background: url(../images/home-11.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); }
.item-12 { background: url("../images/home-12.jpg") no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); background-size: 100% auto !important; }

.item-1 { background: url(../images/home-1.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); }
.item-2 { background: url(../images/home-2.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); }
.item-3 { background: url(../images/home-3.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0);}
.item-4 { background: url(../images/home-4.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); }
.item-5 { background: url(../images/home-5.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); }
.item-6 { background: url(../images/home-6.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); }
.item-7 { background: url(../images/home-7.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); }
.item-8 { background: url(../images/home-8.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); background-size: 100% auto !important; }
.item-9 { background: url(../images/home-9.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); }
.item-10 { background: url(../images/home-10.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); }
.item-11 { background: url(../images/home-11.jpg) no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); }
.item-12 { background: url("../images/home-12.jpg") no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); background-size: 100% auto !important; }

body.services .item-1 { background: url(../images/services-1.jpg) no-repeat scroll right 0 / auto 100% rgba(0, 0, 0, 0); }
body.services .item-2 { background: url(../images/services-2.jpg) no-repeat scroll right 0 / auto 100% rgba(0, 0, 0, 0); }
body.services .item-3 { background: url(../images/services-3.jpg) no-repeat scroll right 0 / auto 100% rgba(0, 0, 0, 0);}
body.services .item-4 { background: url(../images/services-4.jpg) no-repeat scroll right 0 / auto 100% rgba(0, 0, 0, 0); }
body.services .item-5 { background: url(../images/services-5.jpg) no-repeat scroll right 0 / auto 100% rgba(0, 0, 0, 0); }
body.services .item-6 { background: url(../images/services-6.jpg) no-repeat scroll right 0 / auto 100% rgba(0, 0, 0, 0); }

body.home .overlay {
	background: #3a3c3f;
	color: #FFFFFF;
	padding: 10px;
	width: 93%;
	positioN: absolute;
	z-index: 10;
	font-size: 14px;
}

.overlay-3 {
	bottom: -45%;
	
	/*-webkit-transition:all 0.5s ease-in-out;
	-moz-transition:all 0.5s ease-in-out;
	-o-transition:all 0.5s ease-in-out;
	transition:all 0.5s ease-in-out;*/
}

.overlay-4 {
	bottom: -32%;
	
	/*-webkit-transition:all 0.5s ease-in-out;
	-moz-transition:all 0.5s ease-in-out;
	-o-transition:all 0.5s ease-in-out;
	transition:all 0.5s ease-in-out;*/
}

.overlay-5 {
	bottom: -73%;
	
	/*-webkit-transition:all 0.5s ease-in-out;
	-moz-transition:all 0.5s ease-in-out;
	-o-transition:all 0.5s ease-in-out;
	transition:all 0.5s ease-in-out;*/
}

.overlay-8 {
	bottom: -90%;
	
	/*-webkit-transition:all 0.5s ease-in-out;
	-moz-transition:all 0.5s ease-in-out;
	-o-transition:all 0.5s ease-in-out;
	transition:all 0.5s ease-in-out;*/
}

.overlay-9 {
	bottom: -90%;
	
	/*-webkit-transition:all 0.5s ease-in-out;
	-moz-transition:all 0.5s ease-in-out;
	-o-transition:all 0.5s ease-in-out;
	transition:all 0.5s ease-in-out;*/
}

.overlay-12 {
	bottom: -42%;
	
	/*-webkit-transition:all 0.5s ease-in-out;
	-moz-transition:all 0.5s ease-in-out;
	-o-transition:all 0.5s ease-in-out;
	transition:all 0.5s ease-in-out;*/
}

body.home .blue {
	background: #00aeef;
}

body.home .blue .highlight {
	color: #000000;
}

body.home .logobox {
	position: absolute;
	z-index: 9;
	width: 100%;
	height: 100%;
	background: url(../images/CFS_box_small.png) no-repeat right bottom;
}

/*body.home .item:hover  .overlay {
	bottom: 0%;
	
	-webkit-transition:all 0.5s ease-in-out;
	-moz-transition:all 0.5s ease-in-out;
	-o-transition:all 0.5s ease-in-out;
	transition:all 0.5s ease-in-out;
}*/

@media (max-width: 1024px) {

	body.contact #content {
		margin-bottom: 0%;
	}

	#left-column {
		width: 100%;
		margin-right: 0%;
	}
	
	#nav {
		margin-top: 3%;
		margin-bottom: 3%;
	}
	
	#nav li {
		width: 32.75%;
		display:inline-block;
	}
	
	#details .box {
		margin-top: 0%;
	}
	
	#right-column {
		width: 100%;
	}
	
	#splash {
		height: 71.4%;
	}
	
	#splash .message {
		margin-top: 40%;
	}
	
	#credit {
		bottom: 30px;
	}
}

@media (max-width: 1240px) {
	body.services #details .box {
		margin-top: 0px;
		margin-left: 10%;
	}
	
	body.services #details .box .left, body.services #details .box .right {
		width: 70%;
	}
	
	body.services #details .box .left {
		margin-bottom: 3%;
	}
	
	body.services #content {
		margin-bottom: 4%;
	}
}

@media (max-width: 768px) {
	
	#nav li {
		width: 32.6%;
	}
	
	#details {
		width: 50%;
	}
	
	#splash {
		height: 25%;
		float:right;
		
		margin-top: 3%;
		
		background: url("../images/splash.jpg") no-repeat scroll right 52% rgba(0, 0, 0, 0);
	}
	
	#splash .message {
		margin-top: 10%;
		height: 60%;
	}
	
	body.services #details .box {
		margin-top: 0px;
		margin-left: 10%;
	}
	
	body.services #details .box .left, body.services #details .box .right {
		width: 70%;
	}
	
	body.services #details .box .left {
		margin-bottom: 3%;
	}
	
	body.services #content {
		margin-bottom: 4%;
	}
}

@media screen and (orientation:portrait) {
	
	#splash .message {
		margin-top: 25%;
	}
}
