html, body { 
	width: 100%; 
	height: 100%; 
	min-height: 100%; 
}
body {
	background-color: #fafafa;
}
	body.fixed {
		overflow: hidden;
	}

.wrap {
	position: relative;
	margin: 0 auto;
	max-width: 1500px;
}
.wrap h2 {
	margin-bottom: 80px;
}


/* TYPOGRAPHY */

body {
	font-family: "Foco", sans-serif;
	font-size: 62.5%;
}
h1 {
	font-family: "museo-sans-rounded", sans-serif;
	font-weight: 100;
	font-size: 4.2em;
}
h2 {
	font-family: "museo-sans-rounded", sans-serif;
	font-weight: 700;
	font-size: 3.6em;
	color: #0d5280;
}
h3 {
	font-family: "museo-sans-rounded", sans-serif;
	font-weight: 500;
	font-size: 3.0em;
}
h4 {
	font-size: 2.4em;
}
h5 {
	font-family: "museo-sans-rounded", sans-serif;
	font-size: 1.4em;
	font-weight: 700;
	text-transform: uppercase;
	color: #b2b2b2;
	letter-spacing: 1px;
}
h6 {
	font-family: "museo-sans-rounded", sans-serif;
	font-size: 1.2em;
	font-weight: 700;
	text-transform: uppercase;
	color: #b2b2b2;
	letter-spacing: 1px;
}
p {
	margin: 1em 0;
	line-height: 1.6em;
	font-size: 1.6em;
	font-family: "foco", sans-serif;
	font-weight: 400;
	color: #464646;
}
p strong {
	font-weight: 700;
}
p.small {
	font-size: 1.4em !important;
	line-height: 1.4em !important;
}

.centerTitle {
	text-align: center;
	position: relative;
	width: 50%;
	margin: 0 auto;
}
.centerTitle.blue h5 {
	color: #fff;
}
.centerTitle.blue p {
	color: #fff;
}

/* BUTTONS */

.button, button {
	display: inline-block;
	width: auto;
	min-height: 55px;
	padding: 15px 60px 15px 30px;
	border-radius: 60px;
	border: none;
	color: #fff !important;
	font-family: "foco", sans-serif;
	font-weight: 700;
	font-size: 18px;
	margin-top: 20px;
	cursor: pointer;
	transition: all 0.2s ease;
	position: relative;
	line-height: 1;
}
.button:after, button span {
	content: '';
	background: url(../img/arrow.png) no-repeat;
	background-size: cover;
	display: inline-block;
	width: 11px;
	height: 17px;
	position: absolute;
	right: 30px;
	top: 50%;
	margin-top: -9px;
	transition: right 0.2s;
}
	.button.gray, button.gray {
		background: #595858;
	}
	.button.blue, button.blue {
		background: #0d5280;
	}

.button:hover span, button:hover span {
	right: 20px;
	transition: all 0.2s ease;
}

/* HEADER */

header {
	position: fixed;
	top: 0; left: 0; right: 0;
	z-index: 99;
	width: 100%;
	max-width: 1500px;
	margin: 0 auto;
	background: #fff url(../img/patternGray.png) no-repeat right center;
	padding: 30px 30px 0 30px;
	transition: all 0.5s ease;
}
	header > * {
		transition: all 0.5s ease;
	}

	#logo {
		float: left;
		max-width: 300px;
		margin-bottom: 2em;
	}
		
	#mobileNav, #showNav {
		display: none;
	}
	
	#nav {
		float: right;
		position: absolute;
		right: 0; bottom: 0;
	}
		#nav li {
			display: inline-block;
			border-left: 1px solid #eee;
			
		}
			#nav li a {
				display: block;
				font-weight: 700;
				font-size: 1.4em;
				color: #8b8b8b;
				padding: 35px 45px;
				transition: all 0.2s ease;
				-moz-transition: all 0.2s ease;
				-webkit-transition: all 0.2s ease;
			}
				#nav li a span {
					display: none;
					font-size: 0.7em;
					margin-bottom: 2px;
					color: #d3d3d3;
					transition: all 0.2s ease;
					-moz-transition: all 0.2s ease;
					-webkit-transition: all 0.2s ease;
				}
			#nav li a.active, #nav li a:hover, #nav li a.active span, #nav li a:hover span {
				color: #0d5280;
				transition: all 0.2s ease;
				-moz-transition: all 0.2s ease;
				-webkit-transition: all 0.2s ease;
			}
		
/* HEADER SHRUNK */

header.shrink {
	padding-top: 0;
	transition: all 0.5s ease;
	width: 100%;
	max-width: 100%;
}
	header.shrink > * {
		transition: all 0.5s ease;
	}

	header.shrink #logo {
		max-width: 230px;
		margin-bottom: 0;
		padding: 4px 0;
	}

/* SECTIONS */
	
	.cover {
		display: block;
		width: 100%;
		height: 100%;
		position: absolute;
		background: rgba(68, 68, 68, 0.7);
	}
	
	/* USP */
	
	#usp {
		height: 100%;
		background: url(../img/homeBg.jpg) no-repeat;
		background-size: cover;
		position: relative;
		z-index: 10;
	}
		#usp .wrap {
			height: 100%;
		}
		#uspStatement {
			position: absolute;
			bottom: 10%;
			width: 50%;
			left: 5%;
		}
			#uspStatement h1 {
				color: #fff;
				margin-bottom: 0.5em;
				font-size: 4em;
			}
			#uspStatement h4 {
				color: #4e9acc;
				width: 60%;
				letter-spacing: normal;
				text-transform: none;
				font-family: "museo-sans-rounded", sans-serif;
				font-weight: 500;
				font-size: 2.2em;
			}
			
	/* SERVICES */
	
	#services {
		position: relative;
		z-index: 1;
	}
		#servicesText {
			padding: 7% 7% 5% 5%;
			position: relative;
			z-index: 5;
		}
			#servicesText:after {
				content: '';
				position: absolute;
				right: -93px;
				top: 40%;
				z-index: 10;
				width: 186px;
				height: 79px;
				background: url(../img/bracket.png) no-repeat center right;
			}
		#servicesSlider {
			margin: 0 auto;
			padding: 15% 10% 20% 10%;
			background: #4e9acc;
			z-index: 2;
		}
			#servicesSlider h1 {
				color: #fff;
				font-size: 6em;
				font-weight: 500;
				line-height: 0.8;
				position: relative;
			}
				#servicesSlider h1 span {
					font-size: 0.4em;
					display: inline-block;
					vertical-align: top;
					color: #0d5280;
					position: absolute;
					left: -35px;
				}
			#servicesSlider p {
				color: #0d5280;
				font-size: 2em;
				line-height: 1.4em;
			}
		
		.services2 {
			background: #f3f3f3;
			margin-top: -5%;
			z-index: 1;
			padding: 7% 5%;
		}
			.services2 h2 {
				margin-bottom: 0;
			}
			#customersSlider {
				padding: 5% 0 2% 0;
				margin-bottom: 0;
			}
				#customersSlider .customerLogo {
					height: 110px;
					position: relative;
				}
				#customersSlider .customerLogo:after {
					content: '';
					width: 1px;
					height: 200px;
					background: #e7e7e7;
					position: absolute;
					top: 0; right: 0;
				}
					#customersSlider .customerLogo img {
						transition: margin 0.2s ease;
						margin: 0 auto;
					}
					#customersSlider .customerLogo a:hover > img {
						margin-top: -110px;
						transition: margin 0.2s ease;
					}
	
		/*
		.service {
			background: #4e9acc;
			border-right: 1px solid #75b0d7;
			padding: 50px;
			color: #fff;
			position: relative;
			height: 400px;
			cursor: pointer;
		}
			.service:last-child {
				border: none;
			}
			
			.serviceFront {
				opacity: 1;
				transition: opacity 0.5s 0.5s ease;	
			}
				.serviceFront span {
					font-size: 1.4em;
				}
				.serviceFront h2 {
					position: absolute;
					bottom: 50px;
					width: 70%;
					font-weight: 500;
					margin-bottom: 0;
				}
			
			.serviceBack {
				background: #4e9acc;
				position: absolute;
				left: 0; right: 0;
				top: -100%;
				opacity: 0;
				width: 100%;
				padding: 50px;
				transition: top 0.5s ease, opacity 0.5s  ease;
			}
				.serviceBack h5 {
					color: #265777;
					margin-bottom: 2em;
					text-transform: none;
					letter-spacing: normal;
				}
				.serviceBack li {
					font-size: 14px;
					margin-bottom: 0.8em;
				}
					.serviceBack ul li:before {
						content: '';
						width: 15px;
						height: 2px;
						background: #9ec8e3;
						display: inline-block;
						vertical-align: middle;
						margin-right: 2em;
					}
					.serviceBack ul li ul {
						margin-top: 0.8em;
					}
					.serviceBack ul li ul li {
						margin-left: 3em;
					}
						.serviceBack ul li ul li:before {
							content: '';
							width: 7px;
							height: 7px;
							background: none;
							display: inline-block;
							vertical-align: middle;
							margin-right: 2em;
							border-left: 2px solid #2e719c;
							border-bottom: 2px solid #2e719c;
						}			
			
			.service:hover {
				
				transition: height 0.5s 0.5s ease;
			}
			.service:hover .serviceFront {
				opacity: 0;
				transition: opacity 0.5s ease;
			}
			.service:hover .serviceBack {
				top: 0;
				opacity: 1;
				transition: top 0.5s 0.2s ease, opacity 0.5s 0.1s ease;
			}
*/
			
	/* ABOUT */
	
	.about1 .image, .about2 .image {
		width: 55%;
		height: 110%;
		position: absolute;
	}	
	.about1 .image.imageRight{
		background: url(../img/about1.jpg) no-repeat right;		
		background-size: cover;
		right: -5%;		
	}
	
	.about2 .image.imageLeft{
		background: url(../img/about2.jpg) no-repeat left;
		background-size: cover;
		left: -5%;
	}
	
	.aboutQuote {
		background: #464646;
	}
		.aboutQuote h3 {
			color: #fff;
			text-align: center;
			width: 50%;
			margin: 0 auto;
		}
			.aboutQuote h3:before {
				content: '';
				width: 36px;
				height: 28px;
				display: block;
				background: url(../img/quotes.png) no-repeat;
				margin: 0 auto;
				position: relative;
				top: -40px;
			}
			
		/* PARTNERS */
		
		.about3 .wrap {
			background: #4e9acc url(../img/partnersBg.jpg);
		}
			.about3 .centerTitle {
				margin-bottom: 10%;
			}
			.partner {
				width: 24% !important;
				margin-right: 1.33%;
				background: #4e9ed2;
				margin-bottom: 2em;
				margin-top: 2em;
				transition: all 0.2s ease;
				position: relative;
			}
			.partner.last {
				margin-right: 0;
			}
				.partner:hover, .partner.active {
					background: #fff;
				}
				.partner:hover h4, .partner.active h4 {
					color: #0d5280;
				}
			
			.partner h4 {	
				cursor: pointer;		
				font-weight: 700;
				font-size: 1.8em;
				color: #fff;		
				padding: 30px 30px 50px 30px;
				line-height: 1;
			}
			.partner h4:after {
				content: '';
				width: 17px;
				height: 10px;
				background: url(../img/arrowDown.png) no-repeat;
				float: right;
				position: relative;
				top: 0;
				transition: all 0.2s;
			}
			.partner:hover h4:after {
				top: 5px;
			}
			.partner.active h4:after {
				transition: transform 0.5s ease;
				transform: rotate(-180deg);
			}
			.partner.active:hover h4:after {
				top: 0;
			}
			.partner ul {
				display: none;
				padding: 0 30px 30px 30px;
			}
				.partner ul li {
					font-size: 2.4em;
					margin-bottom: 0.5em;
					color: #464646;
					position: relative;
					padding-left: 1em;
				}
				.partner ul li:before {
					content: '';
					width: 4px;
					height: 4px;
					background: #0d5280;
					position: absolute;
					left: 0; top: 50%;
					margin-top: -2px;
				}
		
					
	/* FACILITIES */
	
	#facilities .row {
		margin-bottom: 20%;
	}	
	#facilities .row:last-of-type {
		margin-bottom: 10%;
	}
		#facilities .images {
			position: relative;
			float: left;
			clear: none;
		}
		#facilities .images:before {
			content: '';
			position: absolute;
			background: #4e9acc;
			width: 15px;
			height: 15px;
			border-radius: 100%;
			left: 80%;
			top: 15%;
			z-index: 1;
		}
		#facilities .images:after {
			content: '';
			position: absolute;
			background: #4e9acc;
			width: 60%;
			height: 2px;
			left: 80%;
			top: 15%;
			margin-top: 7px;
			z-index: 1;
		}
		#facilities .images.right:before {
			right: 80%;
			left: auto;
		}
		#facilities .images.right:after {
			right: 80%;
			left: auto;
		}
			#facilities .images img:nth-child(2) {
				width: 80%;
				position: absolute;
				z-index: 1;
				top: 40%;
				left: 65%;
			}
			#facilities .images.right img:nth-child(2) {
				left: auto;
				right: 60%;
			}
		#facilities .stats {
			margin-top: 5%;
		}
		#facilities .stats h5 {
			color: #4e9acc;
			margin-bottom: 10px;
		}
		#facilities .stats h1 {
			color: #464646;
			font-weight: 300;
			line-height: 0.9;
			margin-bottom: 1em;
		}
			#facilities .stats h1 span {
				font-size: 0.5em;
				font-family: 'Foco', sans-serif;
				display: block;
				margin: 5px 0;
			}
	
	/* RECRUITMENT */
	
	#recruitment .wrap {
		background: #464646;
	}				
		#recruitment .unit {
			padding: 5%;
		}	
		#recruitment h2 {
			color: #4e9acc;
		}
		#recruitment h6 {
			margin-bottom: 1em;
		}
		#recruitment p {
			color: #fff;
			font-size: 1.6em;
			line-height: 1.4em;
		}
		#recruitment a {
			color: #4e9acc;
			font-weight: 700;
		}
		#recruitment .button {
			margin-top: 80px;
		}
		
		.download {
			float: left;
			width: 60px;
			height: 64px;
			text-indent: -9999px;
			margin-right: 2em;
		}
			.pdf {
				background: url(../img/pdf.png) no-repeat;
			}
			.doc {
				background: url(../img/doc.png) no-repeat;
			}
		.applyDetails {
			float: left;
			margin: 0;
		}
		
	/* CONTACT */
	
	#contact {
		background: url(../img/contactBg.png) no-repeat left bottom;
	}	
		#contact .row {
			position: relative;
		}
			#contact h2 {
				margin-bottom: 80px;
				color: #4e9acc;
			}
			#contact p {
				line-height: 1.2;
			}
			#contact p.info {
				font-family: "museo-sans-rounded", sans-serif;
				font-size: 1.2em;
				text-transform: uppercase;
				font-weight: 700;
				margin: 0;
				padding: 2% 5%;
			}
				#contact p.info span {
					color: #a1a1a1;
				}
				#contact p.info span a {
					color: #4e9acc;
				}
			
			#contact #map {
				background: #4e9acc;
				float: right;
				width: 145px;
				max-width: 100%;
				height: 145px;
				position: relative;
			}
				#contact #map a {
					width: 100%;
					height: 100%;
					display: block;
					position: relative;
				}
				#contact #map a:before {
					content: '';
					position: absolute;
					top: 20px; right: 20px;
					background: url(../img/geo.png);
					background-size: contain;
					width: 18px;
					height: 28px;
					display: block;
					transition: top 0.2s;
				}
				#contact #map a:hover:before {
					top: 15px;
				}
				#contact #map h5 {
					position: absolute;
					bottom: 0;
					color: #fff;
					padding: 20px;
				}
			
			#contact a {
				color: #4e9acc;
			}
					
				
			/* FORM */
	
			.antispam { 
				display:none;
			}
			form p {
				position: relative;
				margin: 0 0 15px 0;
			}
			label {
				position: absolute;
				left: 15px;
				bottom: 15px;
				font-family: "museo-sans-rounded", sans-serif;
				font-weight: 700;
				text-transform: uppercase;
				font-size: 12px;
				color: #4e9acc;
				letter-spacing: 0.07em;
			}
			input, textarea {
				background: none;
				border: 1px solid #cacaca;
				width: 100%;
				color: #464646;
				font-size: 14px;
			}
			input:focus, textarea:focus {
				outline: none;
				border-color: #4e9acc;
			}
			input {
				height: 50px;
				padding: 15px;
			}
			textarea {
				height: 100px;
				padding: 15px;
			}

			
/* MEDIA QUERIES */

@media screen and (max-width:1500px) {
	
	/* ABOUT */
	
	.about1 .image.imageRight {
		width: 50%;
		right: 0;
	}
	.about2 .image.imageLeft {
		width: 50%;
		left: 0;
	}
	
}

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

	header {
		padding: 0 30px 0 0;
		background: #fff;
	}
	
	#logo {
		max-width: 230px;
		margin-bottom: 0;
		padding: 10px 0;
	}
		#logo img {
			max-width: 100%;
		}
	
	#nav, #mobileNav {
		display: none;
	}
	
	#showNav {
		display: block;
		float: right;
		cursor: pointer;
		padding-top: 33px;
	}
	
	#mobileNav {
		position: fixed;
		top: 0; right: 0; bottom: 0; left: 0;
		z-index: 99;
		background: rgba(78, 154, 204, 0.95);
	} 
		#mobileNav li {
			height: 17.6%;
			text-align: center;
			border-bottom: 1px solid #3588BE;
			display: table;
			width: 100%;
		}
			#mobileNav li:last-child {
				border-bottom: none;
			}	
			
			/** Close button **/
			#mobileNav li#closeNav {
				position: relative;
				cursor: pointer;
				height: 12%;
			}	
				#mobileNav li#closeNav span {
					display: block;
					vertical-align: middle;
					width: 3px;
					height: 40px;
					position: absolute;
					top: 0; right: 0; bottom: 0; left: 0;
					margin: auto;
					transition: all 0.2s ease;
				}	
					#mobileNav li#closeNav span:before {
						content: '';
						position: absolute;
						display: block;
						background: #fff;
						border-radius: 10px;
						width: 3px;
						height: 40px;
						transform: rotate(45deg);
						transition: all 0.2s ease;
						left: 0;
					}
					#mobileNav li#closeNav span:after {
						content: '';
						position: absolute;
						display: block;
						background: #fff;
						border-radius: 10px;
						width: 3px;
						height: 40px;
						transform: rotate(-45deg);
						transition: all 0.2s ease;
						right: 0;
					}
					
			/*
			#mobileNav li#closeNav:active span:before {
				left: -13.5px;
				transition: all 0.2s ease;
			}
			#mobileNav li#closeNav:active span:after {
				right: -13.5px;
				transition: all 0.2s ease;
			}
			*/
		
			#mobileNav li a {
				color: #fff;
				font-size: 1.6em;
				text-transform: uppercase;
				letter-spacing: 3px;
				font-weight: 600;
				font-family: "museo-sans-rounded", sans-serif;
				display: table-cell;
				vertical-align: middle;
				transition: 0.2s ease;
			}
				#mobileNav li a span {
					display: block;
					font-size: 0.7em;
					margin-bottom: 10px;
					color: #0A5281;
				}
			
			#mobileNav li:hover a {
				transform: scale(1.2);
				transition: 0.2s ease;
			}
			
	/* USP */
	
	#usp {
		height: auto;
	}		
		#uspStatement {
			width: 60%;
			position: static;
			margin-top: 25%;
		}
			#uspStatement h4 {
				width: 100%;
			}
		
	/* Services */

	#services {
		margin-top: 0;
	}
		#servicesText {
			padding: 0 0 5% 0;
		}
		#servicesText:after {
			background: none;
			display: none;
		}
		
	.services2 {
		padding: 10%;
	}
	
	/* About */
	
	#about .image {
		top: -5%;
		opacity: 0.5;
		z-index: -1;
	}
	.about1 .paddedDouble, .about2 .paddedDouble {
		padding: 0;
	}
	.about1 .paddedDouble, .about2 .paddedDouble {
		background: #fafafa;
		padding: 5%;
	}
	.about3 .centerTitle {
		text-align: left;
		width: 100%
	}
	.aboutQuote {
		padding: 10%;
	}
		.aboutQuote h3 {
			width: auto;
		}
	
	/* Clients */
	
	.clients.unit.fullThird {
		height: auto;
		padding-bottom: 0;
		width: 50% !important;
	}
	
	.partner {
		width: 49% !important;
		margin-top: 0;
		margin-bottom: 1em;
	}
	.partner:nth-child(2n) {
		margin-right: 0;
	}
	.partner:nth-child(3n) {
		clear: left;
	}
	
	/* Facilities */
	
	#facilities .row {
		margin-bottom: 5%;
	}
		#facilities .stats {
			text-align: center;
		}
		#facilities .images:before, #facilities .images:after {
			display: none;
		}
			#facilities .images img {
				width: 48%;
				float: left;
			}
			#facilities .images img:nth-child(2) {
				width: 48%;
				position: static;
				margin-left: 4%;
			}
	
	/* Recruitment */
	
	#recruitment .unit {
		padding: 0 0 50px 0;
		margin-bottom: 50px;
		border-bottom: 1px solid #515151;
	}
		#recruitment .unit:last-child {
			padding: 0;
			margin: 0;
			border: none;
		}
		
	/* Contact */
	
	#contact .wrap {
		padding-bottom: 0;
	}
	#contact .padded {
		padding: 0;
	}
	#contact p.info {
		padding: 5% 0;
	}
	#contactForm {
		margin-bottom: 50px;
	}
	
	.findUs {
		width: 50% !important;
		margin-bottom: 50px;
	}
	.contactUs {
		margin-bottom: 50px;
	}
	#map {
		float: left !important; 
	}
	
}

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

	/* USP */
	
	#uspStatement {
		width: 100%;
	}
	/* ABOUT */
	.about1 .paddedDouble  {
		padding: 10% 10% 10% 0;
	}
	.about2 .paddedDouble {
		padding: 10% 0 10% 10%;
	}
	
	.aboutQuote {
		padding: 20% 10%;
	}
		.aboutQuote h3 {
			font-size: 2.4em;
		}
	
	/* PARTNERS */
	
	.partner {
		width: 100% !important;
	}
	
	/* FACILITIES */
	
	#facilities .images img {
		width: 100% !important;
		float: left;
		margin: 0 0 1em 0 !important;
	}

} 

@media screen and (max-height:700px) { 

	header {
		padding-top: 20px;
	}

}

@media screen and (max-width: 568px) {
	
	#uspStatement {
		margin-top: 45%;
		margin-bottom: 10%;
	}
		#uspStatement h1 {
			font-size: 3em;
		}
	#servicesSlider h1 {
		font-size: 3em;
	}
	
	#customersSlider .customerLogo:after {
		background: none;
	}
	
}