/* ************************************************************
===============================================================

-- Website Name - Main Stylesheet v1.0
-- Author: Go Media Ltd (www.gomedia.co)

===============================================================
************************************************************ */

/* 
************************************************************************
	Misc Styles
************************************************************************
*/

/* CSS Imports */
@import url(https://fonts.googleapis.com/css?family=Lato:400,300,700,300italic,400italic,900);
@import url(reset.css);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css);

html { -webkit-font-smoothing: antialiased; }

body {
	margin:0;
	padding:0;
	font-family:'Lato',sans-serif;
	-webkit-text-shadow: rgba(255,255,255,0.01) 0 0 1px;
	font-size:15px;
	font-weight:300;
	color:#333333;
	line-height:2em;
	background:#FFFFFF;
}

/* Font, Text Styles */
h1 { font-family:'Lato',sans-serif; padding:0; margin:0 0 10px 0; font-size:2em; line-height:normal; font-weight:400; color:#000; }
h2 { font-family:'Lato',sans-serif; padding:0; margin:0 0 10px 0; font-size:1.8em; line-height:normal; font-weight:300; color:#000; }
h3 { font-family:'Lato',sans-serif; padding:0; margin:0 0 10px 0; font-size:1.6em; line-height:normal; font-weight:400; color:#000; }
h4 { font-family:'Lato',sans-serif; padding:0; margin:0 0 10px 0; font-size:1.2em; line-height:normal; font-weight:700; text-transform:uppercase; color:#000; }
h5 { font-family:'Lato',sans-serif; padding:0; margin:0 0 10px 0; font-size:1.2em; line-height:normal; font-weight:700; color:#000; }

::selection { background: #000; color:#FFF; }
::-moz-selection { background: #000; color:#FFF; }
a { text-decoration:none; color:#989898; -o-transition:.5s; -ms-transition:.5s; -moz-transition:.5s; -webkit-transition:.5s; transition:.5s; }
a:hover { text-decoration: underline; color:#333; }
p { margin-bottom:15px; }
strong { font-weight:700; }
.required { color:#d75e5e; }
ul { list-style:disc; line-height:normal; list-style-position:inside; margin:0 0 20px 10px; }
ol { list-style:decimal; line-height:normal; list-style-position:inside; margin:0 0 20px 10px; }
em { font-style:italic; }
small { font-size:0.9em; }
pre { padding:10px; background:#f7f7f7; border:1px solid #D2D2D2; margin-bottom:20px; font-family:monospace; overflow:auto; max-width:500px; max-height:500px;white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap: break-word; }
blockquote { background: #f9f9f9; border-left: 10px solid #ccc; margin: 1.5em 10px; padding: 0.5em 10px; quotes: "\201C""\201D""\2018""\2019"; font-size:1.2em; font-style:italic; }
blockquote:before { color: #ccc; content: open-quote; font-size: 4em; line-height: 0.1em; margin-right: 0.25em; vertical-align: -0.4em; }
blockquote p { display: inline; }

/* Layout Styles */
.col-left { float:left; width:320px; }
.col-main { float:left; width:710px; }
.col-main img { max-width:100%; }
.col-right { float:right; width:320px; }

.col1-layout .col-main { float:none; width:1100px; }

.col2-left-layout .col-main { float:right; }
.col2-right-layout .col-main { float:left; }

.col3-layout .col-main { width:320px; }
.col3-layout .col-left { margin-right:70px; }

.container { width:1100px; margin:auto; clear:both; }
.left { float:left; }
.right { float:right; }
.no-margin-left { margin-left:0 !important; }
.no-margin-right { margin-right:0 !important; }
.no-padding-left { padding-left:0 !important; }
.no-padding-right { padding-right:0 !important; }
.clear, .clr { display:block; content:"."; clear:both; font-size:0; line-height:0; height:0; overflow:hidden; }
.padding { padding:30px; }
.margin-btm { margin-bottom:20px; }
.white-bg { background:#FFF; }

/* Messages */
.success, .notification, .error { padding:15px; font-size:0.9em; font-weight:500; margin-bottom:20px; }
.success a, .notification a, .error a { font-weight:600; color:#333; }
.success { background:#d7f8d7; color:#3c773c; }
.notification { background:#ccd4db; color:#4a5054; }
.error { background:#f8d7d7; color:#773c3c; }

/* Form Elements */
.button { cursor:pointer; padding:15px 35px; line-height:normal; text-transform:uppercase; font-size:0.85em; font-weight:600; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all ease 0.8s; -moz-transition: all ease 0.8s; transition: all ease 0.8s; display:inline-block; }

.button.solid { background:#a31916; color:#FFF; border:0; }
.button.solid:hover { color:#FFF; background:#5e1210;}

.button.border { border:2px solid #a31916; background:none; color:#a31916; }
.button.border:hover { background:#a31916; color:#FFF; }

form .row { margin-bottom:20px; }
form .row.col1 { width:100%; float:none; clear:both; }
form .row.col2 { width:48%; float:left; }
form .row.col2.left { float:left; }
form .row.col2.right { float:right; }

form .row label { display:block; font-size:0.85em; font-weight:700; margin-bottom:3px; line-height:normal; }
form .row label small { font-size:0.85em; font-weight:500; margin-bottom:0; }

form .row input[type=text], form .row input[type=password], form .row input[type=file] { background:#FFF; border:1px solid #c5c5c5; font-size:0.9em; font-weight:400; font-family:'Lato',sans-serif; padding:10px; display:block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width:98%; height:50px; }
form .row input[type=text]:focus, form .row input[type=password]:focus, form .row input[type=file]:focus { border-color:#7f7f7f; }

form .row select { background:#FFF url(../img/icon-dropdown-arrow.png) no-repeat right 10px center; border:1px solid #c5c5c5; font-size:0.9em; font-weight:400; font-family:'Lato',sans-serif; padding:10px; display:block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width:98%; height:50px; -webkit-appearance: none;border-radius: 0; }
form .row select:focus { border-color:#7f7f7f; }

form .row textarea { background:#FFF; border:1px solid #c5c5c5; font-size:0.9em; font-weight:400; font-family:'Lato',sans-serif; padding:10px; display:block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; min-height:150px; line-height:2.2em; }
form .row.col1 textarea { min-width:99%; max-width:99%; }
form .row.col2 textarea { min-width:100%; max-width:100%; }
form .row textarea:focus { border-color:#7f7f7f; }

input[type=text], input[type=password], textarea, select, input[type=submit], input[type=file] { outline:0; -webkit-appearance: none; border-radius:0; }
input[type=submit], input[type=button] { -o-transition:.5s; -ms-transition:.5s; -moz-transition:.5s; -webkit-transition:.5s; transition:.5s; }
input[type=submit].button { padding:15px 40px; }

/* Overlay */
.page-overlay { position:fixed; height:100%; width:100%; background:#FFF; background:rgba(255,255,255,0.6); z-index:6; top:0; left:0; display:none; }
.page-overlay .overlay-close { position:fixed; top:0; right:0; font-size:2em; color:#4a5054; cursor:pointer; padding:40px; background:#FFF; }

.modal { width:700px; min-height:100px; padding:50px; position:absolute; background:#FFF; left:50%; margin:40px 0 0 -400px; display:none; z-index:7; }



/* 
************************************************************************
	Header
************************************************************************
*/

.upper-header {
	background-color: #333;
	color: #fff;
	font-size: 12px;
	padding: 5px 0 0;
	font-weight: 500;
}

.header-container {
	width: 1000px;	
	margin: 0 auto;
}

.header-left {
	float: left;
	margin: 10px 0;
}	

.header-right a {
	color: #000;
	text-transform: uppercase;
	margin: 10px;
	font-size: 14px;
	font-weight: 600;	
}

.header-right {
	float: right;
	margin: 30px 0  0;	
}

.logo-container {
	width: 187.5px;	
}

.logo-container img {
	width: 100%;	
}

/*
************************************************************************
	Homepage
************************************************************************
*/

.banner {
	height: auto;
}

.banner-item {
	height: 420px;
	background-size: cover;
	background-position: center;
	display: block;	
}

.banner-container {
	width: 1000px;
	margin: 0 auto;
	padding-top: 300px;
}

.banner span {
	background-color: #E0E0E0;
	color: #303382;
	text-transform: uppercase;	
	font-size: 38px;
	font-weight: 600;
	padding: 5px;
}

.banner a {
	background-color: #E0E0E0;
	color: #303382;	
	font-size: 18px;
	font-weight: 400;
	margin-top: -5px;
	padding: 5px;
}

.info-text {
	width: 920px;
	margin: 40px auto;
	text-align: center;	
}

.info-text h1 {
	font-size: 24px;	
}

.info-text p {
	font-size: 16px;
	margin: 40px 0;	
}

.info-text a {
	color: #121576;
	text-transform: uppercase;
	font-weight: 600;
	font-size: 12px;
	background-color: #EEE;
	padding: 10px 40px;	
}

.certification {
	background-color: #DDD;
	text-align: center;	
	padding: 20px 0 10px;
	display:flex;
	align-items:center;
	justify-content:center;
}

.cert-1-container {
	width: 300px;	
	display: inline-block;
	vertical-align: center;
}

.cert-1-container img {
	width: 100%;	
}

.cert-2-container {
	width: 160px;
	margin: 0 35px 0 50px;	
	display: inline-block;
	vertical-align: center;
}

.cert-2-container img {
	width: 100%;	
}

.cert-3-container {
	width: 160px;
	margin: 0 50px 0 35px;	
	display: inline-block;
	vertical-align: center;
}

.cert-3-container img {
	width: 100%;	
}

.cert-4-container {
	width: 120px;	
	display: inline-block;
	vertical-align: center;
}

.cert-4-container img {
	width: 100%;	
}

/* 

************************************************************************
	Footer
************************************************************************
*/

.footer-container {
	width: 1000px; 
	padding: 25px 0 5px 0;
	margin: 0 auto;	
}

.footer-left {
	float: left;	
}

.footer-right {
	float: right;
	font-size: 12px;
	text-align: right;
	font-weight: 600;
	margin-top: 10px;
}

.logo-black-container {
	width: 140px;	
}

.logo-black-container img {
	width: 100%;	
}

.slidesjs-container {
	height: 450px;!important	
}

.banner {
	max-height: 450px;	
}


/* 
************************************************************************
	Misc Pages
************************************************************************
*/

.case-study-container {
	width: 1000px;	
	margin: 0 auto 50px;
}

.case-study {
	width: 230px;
	display: inline-block;
	text-align: center;	
	margin: 10px 8px;
	background-color: #DDD;
	padding: 15px 0 0;
}

.case-study h1 {
	font-size: 18px;
	text-transform: uppercase;	
	height: 50px;
	padding: 0 10px;
}

.case-study p {
	font-size: 14px;	
	width: 200px;
	margin: 0 auto 15px;
}

.case-study a {
	background-color: #DDD;
	color: #000;	
	padding: 10px 71px;
	margin-bottom: -10px;
	font-weight: 500;
	text-transform: uppercase;
}

.casestudy-image{
	width: 230px;	
}

.casestudy-image img {
	width: 100%;	
}

.contact-container {
	width: 800px;
	margin: 50px auto;	
}

.contact-left {
	float: left;
	margin-top: 5px;	
}

.contact-left p {
	margin: 0;	
	font-weight: 500;
	line-height: 1.7;
}

.contact-left p:last-child {
	margin-top: 20px;	
}

.contact-right {
	float: right;	
}

input[type=text], input[type=submit], textarea {
	display: block;
	margin: 10px 0;	
	width: 480px;
	height: 10px;
	padding: 5px 10px;
	border: #000 solid 1px;
}

textarea {
	height: 75px;
	resize: none;	
}

input[type=submit] {
	height: 30px;	
	width: 503px;
	bordeR: 0;
	outline: 0;
	background-color: #DDD;
	color: #000;
	font-weight: 500;
}

.banner-2 {
	background-color: #DDD;
	height: 100px;
}

.images {
	background-color: #EEE;
	text-align: center;
	color: #000;
	font-size: 16px;
	margin: 0 auto;
	padding: 25px 0;
}

.casestudy-banner {
	background-image: url(../img/case-studies/Rockstar,%20Leeds.jpg);
	background-size: cover;
	background-position: center;
	height: 400px; 
}

.casestudy-single {
	width: 800px;	
	margin: 75px auto;
}

.casestudy-image img {
	height: 134px;	
}

.casestudy-single h1 {
	font-size: 28px;
	text-transform: uppercase;
	font-weight: 500;
}

.casestudy-single h2 {
	font-size: 18px;
	margin-bottom: 25px;	
}

.casestudy-single p {
	margin: 0 auto;
	font-size: 14px;	
	margin-bottom: 50px;
}

.casestudy-single a, .return-link a {
	margin-top: 75px;
	text-transform: uppercase;
	font-weight: 500;
	color: #000;
	font-size: 14px;	
}

.return-link {
	margin-top: 50px;
	text-align: center;	
}

.what-we-do {
	width: 1000px;
	margin: 50px auto;
	text-align: center;	
}

.product {
	width: 300px;
	margin: 15px;
	text-align: center;	
	display: inline-block;
	background-color: #EEE;
	padding: 10px 0;
}

.product img {
	width: 100%;	
}

.product h1 {
	text-transform: uppercase;
	font-size: 19px;
	font-weight: 500;
	padding: 8px 0;
}

.cert-logos {
	width: 1000px;
	margin: 20px auto 50px auto;	
	text-align: center;
}

.cert {
	width: 200px;
	display: inline-block;	
	text-align: center;
	margin: 20px 20px;
	border: #DDD 1px solid;
}
	
.cert img {
	height: 75px;
	max-width: 190px;
	display: block;	
	text-align: center;
	margin: 20px auto;
}

.cert h1 {
	text-transform: uppercase;
	font-size: 17px;
	background-color: #DDD;	
	padding: 8px 0;
	font-weight: 500;
}

.cert a {
	background-color: #DDD;
	color: #000;
	text-transform: uppercase;
	padding: 7px 59px 7px 60px;
	font-weight: 500;	
}	

.map {
	margin: 50px auto;	
}

.slidesjs-pagination, .slidesjs-navigation {
	display: none;	
}
	
/* 
************************************************************************
	Responsive Styles
************************************************************************
*/

@media only screen 
and (max-width : 1050px) 
and (min-width : 1000px) {

	.header-container, .footer-container, .banner-container {
		width: 90%;	
	}
	
	.info-text {
		width: 80%;	
	}
}

@media only screen 
and (max-width : 1000px) 
and (min-width : 0950px) {

	.header-container, .footer-container, .banner-container {
		width: 90%;	
	}
	
	.info-text {
		width: 80%;	
	}
	
	.case-study-container {
		width: 500px;	
	}
	
	.what-we-do {
		width: 95%;	
	}
	
	.cert-logos {
		width: 95%;	
	}
}

@media only screen 
and (max-width : 0950px) 
and (min-width : 0750px) {

	.header-container, .footer-container, .banner-container {
		width: 90%;	
	}
	
	.info-text {
		width: 80%;	
	}
	
	.header-left, .header-right {
		float: none;
		text-align: center;	
	}
	
	.logo-container {
		margin: 40px auto 0;	
	}
	
	.header-right a {
		font-size: 11px;
		margin-bottom: 15px	
	}
	
	.header-right {
		margin: 10px 0 25px;	
	}
	
	.upper-header {
		text-align: center;
	}
	
	.contact-container {
		width: 80%;	
	}
	
	.contact-right {
		width: 400px;	
	}
	
	textarea, input[type=text] {
		width: 94%;	
	}
	
	input[type=submit] {
		width: 100%;	
	}
	
	.casestudy-single {
		width: 90%;	
	}
	
	.case-study-container {
		width: 500px;	
	}
	
	.what-we-do {
		width: 95%;	
	}
	
	.cert-logos {
		width: 95%;	
	}
	
}

@media only screen 
and (max-width : 0750px) 
and (min-width : 0650px) {

	.header-container, .footer-container, .banner-container {
		width: 90%;	
	}
	
	.info-text {
		width: 80%;	
	}
	
	.header-left, .header-right {
		float: none;
		text-align: center;
	}
	
	.logo-container {
		margin: 40px auto 0;	
	}
	
	.header-right a {
		font-size: 11px;
		margin-bottom: 15px	
	}
	
	.header-right {
		margin: 10px 0 25px;	
	}
	
	.banner span {
		font-size: 24px;	
	}
	
	.banner a {
		font-size: 14px;	
	}
	
	.upper-header {
		text-align: center;	
	}
	
	.contact-left, .contact-right {
		float: none;	
	}
	
	.contact-left {
		text-align: center;
	}
	
	.contact-right {
		margin: 50px auto;	
	}
	
	.contact-container {
		width: 80%;	
		margin-top: 0;
	}
	
	input[type=text], input[type=submit], textarea {
		margin: 10px auto;	
	}
	
	.casestudy-single {
		width: 90%;	
	}
	
	.case-study-container {
		width: 500px;	
	}
	
	.what-we-do {
		width: 95%;	
	}
	
	.cert-logos {
		width: 95%;	
	}
	
	.banner-container {
		padding-top: 250px;	
	}
	
}

@media only screen 
and (max-width : 0650px) 
and (min-width : 0500px) {

	.header-container, .footer-container, .banner-container {
		width: 90%;	
	}
	
	.info-text {
		width: 80%;	
	}
	
	.header-left, .header-right {
		float: none;
		text-align: center;	
	}
	
	.logo-container {
		margin: 40px auto 0;	
	}
	
	.header-right a {
		font-size: 11px;
		margin-bottom: 15px;
		margin: 0 8px 15px;
	}
	
	.header-right {
		margin: 10px 0 25px;	
	}
	
	.banner span {
		font-size: 24px;	
	}
	
	.banner a {
		font-size: 14px;	
	}
	
	.footer-right p {
		font-size: 11px;	
	}
	
	.cert-1-container {
		width: 130px;	
		display: inline-block;
		vertical-align: center;
	}

	.cert-2-container {
		width: 50px;
		margin: 0 25px 0 30px;	
		display: inline-block;
		vertical-align: center;
	}
	
	.cert-3-container {
		width: 60px;
		margin: 0 30px 0 25px;	
		display: inline-block;
		vertical-align: center;
	}
	
	.cert-4-container {
		width: 90px;	
		display: inline-block;
		vertical-align: center;
	}
	
	.upper-header {
		text-align: center;	
	}
	
	.banner-container span {
		font-size: 20px;	
	}
	
	.contact-left, .contact-right {
		float: none;	
	}
	
	.contact-left {
		text-align: center;	
	}
	
	.contact-right {
		margin: 50px auto;	
	}
	
	.contact-container {
		width: 80%;	
		margin-top: 0;
	}
	
	input[type=text], input[type=submit], textarea {
		margin: 10px auto;	
	}
	
	textarea, input[type=text] {
		width: 94%;	
	}
	
	input[type=submit] {
		width: 100%;	
	}
	
	.casestudy-single {
		width: 90%;	
	}
	
	.case-study-container {
		width: 500px;	
	}
	
	.what-we-do {
		width: 95%;	
	}
	
	.cert-logos {
		width: 95%;	
	}
	
	.banner-container {
		padding-top: 200px;	
	}
	
}

@media only screen 
and (max-width : 0500px) 
and (min-width : 0000px) {

	.header-container, .banner-container {
		width: 90%;	
	}
	
	.footer-container {
		width: 95%;	
	}
	
	.info-text {
		width: 80%;	
	}
	
	.header-left, .header-right {
		float: none;
		text-align: center;	
	}
	
	.logo-container {
		margin: 40px auto 0;	
	}
	
	.header-right a {
		font-size: 11px;
		margin-bottom: 15px;
		margin: 0 4px 15px 4px
	}
	
	.header-right {
		margin: 10px 0 25px;	
	}
	
	.banner span {
		font-size: 24px;	
	}
	
	.banner a {
		font-size: 14px;	
	}
	
	.footer-right p {
		font-size: 11px;	
	}
	
	.cert-1-container {
		width: 100px;	
		display: inline-block;
		vertical-align: center;
	}

	.cert-2-container {
		width: 38px;
		margin: 0 10px 0 10px;	
		display: inline-block;
		vertical-align: center;
	}
	
	.cert-3-container {
		width: 46px;
		margin: 0 10px 0 10px;	
		display: inline-block;
		vertical-align: center;
	}
	
	.cert-4-container {
		width: 80px;	
		display: inline-block;
		vertical-align: center;
	}
	
	.upper-header {
		text-align: center;	
	}
	
	.footer-left, .footer-right {
		float: none;	
		text-align: center;
	}
	
	.logo-black-container {
		margin: 0 auto;	
	}
	
	.banner-container span {
		font-size: 20px;	
	}
	
	.contact-left, .contact-right {
		float: none;	
	}
	
	.contact-left {
		text-align: center;	
	}
	
	.contact-right {
		margin: 50px auto;	
	}
	
	.contact-container {
		width: 80%;	
		margin-top: 0;
	}
	
	input[type=text], input[type=submit], textarea {
		margin: 10px auto;	
	}
	
	textarea, input[type=text] {
		width: 91.5%;	
	}
	
	input[type=submit] {
		width: 100%;	
	}
	
	.upper-header {
		font-size: 11px;	
	}
	
	.casestudy-single {
		width: 90%;	
	}
	
	.case-study-container {
		width: 245px;	
	}
	
	.what-we-do {
		width: 95%;	
	}
	
	.cert-logos {
		width: 95%;	
	}
	
	.product {
		margin: 15px 0;	
	}
	
	.banner-2 {
		height: 75px;	
	}
	
	.case-study {
		margin: 25px 8px;	
	}
	
	.banner-container {
		padding-top: 150px;	
	}
	
}

