@charset "UTF-8";
/* CSS Document */

/**
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    contenteditable attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that are clearfixed.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */
.cf:before,
.cf:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.cf:after {
    clear: both;
}

.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.cf {
    *zoom: 1;
}

html, 
body {
    height: 100%;
}

body {
	font-family: "futura-pt", Helvetica, Arial, sans-serif;
	background: #333;
}

p {
	font-size: 18px;
	line-height: 24px;
	margin: 0 0 20px 0;
	color: #C4C4C4;
	font-weight: 300;
}

p.testimonial-name {
	margin: 0 0 60px 0;
}

a {
	color: #DFDCC5;
	text-decoration: none;
	font-weight: 500;
}

a:hover {
	color: #e65f42;
}

::selection {
        background: #e65f42; /* Safari */
		color: #e5e5e5;
        }
::-moz-selection {
        background: #e65f42; /* Firefox */
		color: #e5e5e5;
}

span.seperator {
	color: #c6af60;
}

#content ul {
	margin: 0 0 30px 0;
}

#content li {
	font-size: 18px;
	line-height: 24px;
	color: #ccc;
	font-weight: 300;
	list-style: disc;
	margin: 0 0 5px 20px;
}

#content img {
	max-width: 100%;
	margin: 0 0 20px 0;
}

h2 {
	color: #c6af60;
	font-weight: 700;
	font-size: 22px;
	text-transform: uppercase;
	margin: 40px 0 20px 0;
	padding: 0 0 30px 0;
	background:url(../img/spacer-coloured.gif) no-repeat 0 bottom;
}

h2.services-h2 {
	padding: 0;
	margin: 20px 0;
	background: none;
}

h2.services-h2 a {
	display: inline-block;
	padding: 0 20px 0 0;
	background: url(../img/arrow.png) no-repeat right 50%;
	background-size: 12px 12px;
}

h2.services-h2 a.open {
	background: url(../img/arrow-up.png) no-repeat right 50%;
	background-size: 12px 12px;
}

.home h2 {
	margin: 0 0 20px 0;
}

#content h2:first-child {
	margin: 0 0 20px 0;
}

h3 {
	color: #dfdcc5;
	font-weight: 700;
	font-size: 16px;
	text-transform: uppercase;
	margin: 0 0 20px 0;
}

#header {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 300;
	border-bottom: 5px solid #e65f42;
	background: rgb(0, 0, 0); /* The Fallback */
	background-color:rgba(0,0,0,0.7);
	width: 100%;
}

#header-inner {
	position: relative;
}

#footer {
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 290;
	width: 100%;
}

#footer-inner {
	position: relative;
	border-top: 5px solid #e65f42;
	background: rgb(0, 0, 0); /* The Fallback */
	background-color:rgba(0,0,0,1);
}

#footer p {
	padding: 15px;
	margin: 0;
	font-size: 14px;
}

#logobar {
	background: #111;
	height: 80px;
	width: 100%;
	border-top: 1px solid #222;
}

#logobar ul {
	padding: 0;
	margin: 0;
	text-align: center;
}

#logobar ul li {
	display: inline-block;
	padding: 17px 25px;
	margin: 0;
	text-align: center;
	opacity: 0.7;
}

#logobar ul li img {
	width: auto;
	height: 45px;
}

a#togglemenu {
	display: block;
	width: 50px;
	height: 50px;
	text-indent: -2000px;
	background: url(../img/menu.gif) no-repeat #e65f42;
	position: absolute;
	bottom: -50px;
	right: 0;
	display: none;
}

strong {
	font-weight: 500;
	color: #ddd;
}

em {
	font-style: italic;
}

h1 {
	position: fixed;
	top: 15px;
	left: 15px;
	z-index: 400;
}

h1 a {
	display: block;
	width: 180px;
	height: 180px;
	text-indent: -2000px;
	background:url(../img/logo-180.png) no-repeat;
}

h3#strap {
	position: fixed;
	top: 200px;
	left: 15px;
	color: #000000;
	font-weight: 500;
	width: 160px;
	
	text-align: center;
	
	padding: 10px;
	font-size: 20px;
}

ul#nav {
	float: right;
	padding: 15px;
	display: block;
}

ul#nav li {
	float: left;
	margin: 0 0 0 30px;
	font-size: 13px;
}

ul#nav li a {
	color: #dfdcc5;
	font-weight: 700;
	text-decoration: none;
	text-transform: uppercase;
	line-height: 20px;
}

ul#nav li a:hover {
	color: #e65f42;
}

ul#nav li a.selected {
	color: #e65f42;
}



select#nav-select {
	display: none;
}

.inner {
	padding: 20px;
}

#mainbody {
	/*position: relative;*/
}

#videowrapper {
	position: absolute; 
	top: 0;
	left: -620px;
	width: 600px;
	color: white;
	padding: 20px;
	background: #000000;
	-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

#content {
	position: absolute; 
	top: 280px;
	right: 0;
	width: 600px;
	color: white;
	padding: 0 0 50px 0;
}

#content.home,
#content.page-clients {
	padding: 0 0 130px 0;
}

#content .inner {
	background: black;
}

/* -- TEAM BEGIN -- */

.team #content {
	position: static; 
	top: auto;
	right: auto;
	width: 100%;
	padding: 50px 0 50px 200px;
	-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

.team #content .inner {
	background: none;
}

.team .team-person {
	display: none;
	float: left;
	padding: 10px;
	width: 220px;
	background: #000000;
	-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

.team .team-person a {
	display: block;
}

.team .team-person a span {
	display: block;
}

.team .team-person img {
	width: 200px !important;
}

.white-popup-block {
    background: #000000;
    padding: 30px;
    text-align: left;
    max-width: 650px;
    margin: 40px auto;
    position: relative
}

.white-popup-block h2 {
	margin-top: 0;
}

.white-popup-block p {
	/*color: #333;*/
}

.white-popup-block img { 
	float: right;
	margin: 0 0 20px 20px;
	max-width: 100%;
}

/* -- TEAM END -- */

.popup-gallery {
	margin: 0 0 40px 0;
}

.popup-gallery a {
	display: block;
	float: left;
	margin: 0 3px 3px 0;
}

#client-logos {
	position: absolute;
	top: -240px;
	left: 0;
	background: #ffffff;
	height: 220px;
}

#client-logos ul {
	margin: 10px 0 0 0;
	padding: 0;
}

#client-logos li {
	list-style: none;
	padding: 0;
	margin: 0;
	float: left;
	margin: 0 10px 0 10px;
	
}

#content #client-logos li img {
	margin: 0;
}

.summary-list-box {
	background: #111;
	padding: 20px;
	margin: 0 0 60px 0;
}

.summary-list-box ul {
	margin: 0;
	width: 100%;
}

#content .summary-list-box ul li {
	width: 50%;
	float: left;
	display: block;
	margin: 0 0 10px 0;
	padding: 0;
	font-weight: 700;
	font-size: 13px;
	line-height: 18px;
	text-transform: uppercase;
}

.services-section {
	display: none;
}

.services-section iframe {
	margin: 0 0 20px 0;
}

.article-box {
	background: #111;
	padding: 20px;
	margin: 0 0 20px 0;
}

.article-box p {
	margin: 0;
}

.article-box h3 a {
	font-weight: 700;
}

.article-box h3 span.date {
	font-weight: 300;
	color: #666;
}

h3 span.date {
	font-weight: 300;
	color: #666;
}



/* ---------------------------------------------------------------------------------------------------------- 
03 Media queries (using a mobile-first approach) ------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */

@media screen and (max-width: 1306px) {
	#logobar ul li { padding: 17px 20px; }
}

@media screen and (max-width:1240px) {
	#videowrapper {
		width: 500px;
		left: -520px;
	}
	
	#videowrapper iframe {
		width: 460px !important;
		height: 259px !important;
	}
	
	#logobar ul li { padding: 17px 15px; }
}

@media screen and (max-width:1140px) {
	#videowrapper {
		width: 400px;
		left: -420px;
	}
	
	#videowrapper iframe {
		width: 360px !important;
		height: 203px !important;
	}
	
	#logobar ul li { padding: 20px 15px; }
	#logobar ul li img { height: 40px; }
}

/* 960 and less */
@media screen and (max-width:1020px) {
	#videowrapper {
		position: static;
		margin: 0 0 20px 0;
		padding: 20px 0;	
		width: auto;
	}
	
	#videowrapper iframe {
		width: 560px !important;
		height: 315px !important;
	}
	
	#logobar ul li { padding: 22px 12px; }
	#logobar ul li img { height: 35px; }
}

@media screen and (max-width:890px) {
	#logobar ul li { padding: 25px 10px; }
	#logobar ul li img { height: 30px; }
}

@media screen and (min-width:801px) {

ul#nav li a.twitter {
	display: inline-block;
	width: 20px;
	height: 20px;
	overflow: hidden;
	text-indent: -2000px;
	background: url(/img/icon-twitter.png) top left;
}

ul#nav li a.facebook {
	display: inline-block;
	width: 20px;
	height: 20px;
	overflow: hidden;
	text-indent: -2000px;
	background: url(/img/icon-facebook.png) top left;
}

ul#nav li a.linkedin {
	display: inline-block;
	width: 20px;
	height: 20px;
	overflow: hidden;
	text-indent: -2000px;
	background: url(/img/icon-linkedin.png) top left;
}

ul#nav li a.twitter:hover,
ul#nav li a.facebook:hover,
ul#nav li a.linkedin:hover {
	background-position: bottom left;
}
}

/* 700 and less */
@media screen and (max-width:700px) {
	.team #content {
		padding: 200px 0 50px 0;
	}
}

/* 600 and less */
@media screen and (max-width:800px) {
	
	iframe { max-width: 100%; }
	
	html, 
	body {
	height: auto;
	}
	
	#vidBg { position: absolute !important; top: 0 !important; left: 0 !important; }
	
	h1 {
		/*display: none;*/
		position: relative;
		float: left;
	}
	
	#footer {
		
	}
	
	#footer-inner {
		display: none;
	}
	
	#logobar {
		height: auto;
		padding: 20px 10px;
	}
	
	#logobar ul li {
		padding: 5px 20px;
	}
	
	#content {
		width: 100%;
		top: 220px;
	}
	
	ul#nav {
		position: relative;
		float: none;
		padding: 15px 0;
		margin: 0;
		display: none;
		z-index: 8000;
	}
	
	ul#nav li {
		margin: 0;
		padding: 10px 0;
		width: 100%;
		font-size: 15px;
	}
	
	ul#nav li a {
		display: block;
		text-align: center;
	}
	
	#header {
		
	}
	
	a#togglemenu {
		display: block;
	}
	
	#content {
		padding: 0;
	}
	
	h3#strap {
		display: none;
	}
	
	#client-logos {
		position: static;
		height: auto;
	}
	
	#client-logos ul {
		width: 100%;
	}
	
	#client-logos li {
		width: 15%;
		margin: 2%;
		-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
	}
	
	#client-logos li img {
		width: 100%;
		margin: 0;
	}
	
	div.vegas-slide-inner {
		background-size: contain !important;
		background-position: 0 0 !important;
		background-color: #000 !important;
	}
}

/* Retina Display */
@media screen and (-webkit-min-device-pixel-ratio:2) {

					{ /* Place your styles here for all 'Retina' screens */ }

}