/*
Theme Name: Teknision 13
*/

/**** Main Elements ****/
html {
	min-width:980px;
}

body {
	margin:0 auto;
	color:#abaeb8;
	min-width:980px;
	background: url(images/noise_pattern.jpg) repeat 0 0;
	font: 14px/24px Helvetica, Arial, sans-serif;
	-webkit-text-size-adjust:100%;
	-webkit-font-smoothing: antialiased;
}

.shadow {
	margin: 0 auto;
	width: 100%;
	max-width: 1270px;
	min-width: 940px;
	background: url(images/tek_shadow.png) repeat-y center top;
	overflow: hidden;
}

img {
	border-style:none;
	margin: 0;
	padding: 0;
}

a {
	text-decoration:none;
	color:#333;
}

a:hover {
	text-decoration:underline;
}

input, textarea, select {
	font:100% Arial, Helvetica, sans-serif;
	vertical-align:middle;
	color:#000;
}

input:focus, select:focus, textarea:focus {
	outline:none;
}

form, fieldset {
	margin:0;
	padding:0;
	border-style:none;
}

h1, h2 {
	text-transform: uppercase;

}

.clear {
	clear: left;
	height: 0;
	content: "";
	display: block;
	position: relative;
	float: left;
}


/**** Fonts ****/

/* Montserrat */
@import url(http://fonts.googleapis.com/css?family=Montserrat:400,700);

@font-face {
    font-family: 'Mono Social Icons Font';
    src: url('fonts/MonoSocialIconsFont-1.10.eot');
    src: url('fonts/MonoSocialIconsFont-1.10.eot?#iefix') format('embedded-opentype'),
         url('fonts/MonoSocialIconsFont-1.10.woff') format('woff'),
         url('fonts/MonoSocialIconsFont-1.10.ttf') format('truetype'),
         url('fonts/MonoSocialIconsFont-1.10.svg#MonoSocialIconsFont') format('svg');
    src: url('fonts/MonoSocialIconsFont-1.10.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'teknision';
    src: url('fonts/teknision-webfont.eot');
    src: url('fonts/teknision-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/teknision-webfont.woff') format('woff'),
         url('fonts/teknision-webfont.ttf') format('truetype'),
         url('fonts/teknision-webfont.svg#teknision') format('svg');
    font-weight: normal;
    font-style: normal;
}

/**** Frame ****/
.w1 {
	width:100%;
	position:relative;
	overflow:hidden;
}
.w2 {
	width: 940px;
	position:relative;
	left:50%;
}
#wrapper {
	width: 940px;
	position:relative;
	left:-50%;
}

.tabs-holder {
	width:100%;
	height: auto;
}
.tabs-holder:after {
	clear:both;
	display:block;
	content:"";
}

/**** Header ****/
#header {
	margin: 0 auto;
	width: 100%;
	min-width: 980px;
	position: fixed;
	z-index: 200;
	left: 0;
	top: 0;
}

.header-block {
	margin: 0 auto;
	max-width: 1264px;
	min-width: 980px;
	background-color: rgb(0, 0, 0);
	background-color: rgba(0, 0, 0 ,0.9);
}

.header-wrapper {
	margin: 0 auto;
	padding: 23px 0 0 0;
	display: block;
	width: 940px;
	height: 93px;
	position: relative;
}

.header-wrapper .logo {
	margin: 15px 0 0;
	padding: 0;
}

.header-wrapper .logo .teklogo {
	font-family: 'teknision';
	font-size: 40px;
	color: #FFF;
}

nav {
	margin-top: 26px;
	position: relative;
	float: right;
	width: auto;
	display: inline;
}

#nav {
	margin: 0;
	padding: 0;
	list-style:none;
	float:left;
	overflow:hidden;
	display: inline;
}

#nav li {
	float:left;
	padding:0 13px;
	margin-left:-8px;
	background:url(images/nav_splitter.png) no-repeat 3px 3px;
}

#nav li a {
	color:#989ba5;
	font-size: 13px;
	font-family: 'Montserrat'; 
	line-height: 18px;
	font-weight: 700;
	float:left;
	padding-bottom:6px;
	text-transform: uppercase;
}

#nav li a:hover ,
#nav li.active a {
	text-decoration:none;
	color:#fff;
	/*border-bottom:2px solid #989ba8;*/
}

ul.header-social  {
	display: inline;
	float: right;
	margin: -4px 0 0 0;
	padding: 0;
	width: 170px;
	height: 24px;
	background:url(images/nav_splitter.png) no-repeat left 7px;	
}


ul.header-social li {
	margin: 0;
	padding: 0;
	float: left;
	display: inline;
}

.header-social a.symbol:before {
	font-family: 'Mono Social Icons Font';
    -webkit-text-rendering: optimizeLegibility;
    -moz-text-rendering: optimizeLegibility;
    -ms-text-rendering: optimizeLegibility;
    -o-text-rendering: optimizeLegibility;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    font-smoothing: antialiased;
}

.header-social a.symbol {
	color: #fff;
	display: block;

}

.header-social a.symbol:hover {
	text-decoration: none;
}

.header-social a.symbol.twitter {
	margin-left: 10px;
}

.header-social a.symbol.twitter:hover {
	color: #19c7e9;
}

.header-social a.symbol.facebook:hover {
	color: #2f67dc;
}

.header-social a.symbol.vimeo:hover {
	color: #59bbd7;
}

.header-social a.symbol.youtube:hover {
	color: #e54346;
}

.header-social a.symbol:before {
	content: attr(title);
    margin-right: 10px;
    font-size: 36px;
}

.header-offset {
	margin-top: 118px;
}

/**** Main ****/
#main {
	height:1%;
}

#main:after {
	clear:both;
	content:"";
	display:block;
}

.holder {
	height:1%;
	padding: 20px 0 20px 0;
	border-bottom:1px solid #4f505b;
}

.holder2 {
	padding-bottom:0;
}

#content .holder {
	border-color:#cdced1;
}

#content .holder p {
	color:#222227;
}

#content .holder h2 {
	color:#282834;
}

.holder:after {
	clear:both;
	content:"";
	display:block;
}

.block {
	width:700px;
	float:right;
}

.holder .block p {
	margin:0;
	font-size:16px;
	line-height:26px;
}

h2 {
	margin:0;
	color:#fff;
	font:16px 'Montserrat', sans-serif;
	font-weight: 700;
}

.holder .block h2 {
	color:#abaeb8;
	margin:17px 0 15px;
	font:14px 'Montserrat', sans-serif;
	font-weight: 400;
}

.holder .box-hold {
	overflow:hidden;
	width:720px;
	margin:0 0 70px -20px;
}

.holder .box-hold .box {
	width:219px;
	float:left;
	padding-left:20px;
}

.holder .box-hold .box img {
	display:block;
	margin-bottom:37px;
}

.holder .box-hold .box strong {
	color:#fff;
	display:block;
	margin-bottom:4px;
	font: 14px 'Montserrat', sans-serif;
	font-weight: 400;
}

.holder .box-hold .box em {
	font-size:10px;
	font-style:normal;
	display:block;
	margin-bottom:11px;
}

.holder .box-hold .box p {
	font-size:12px;
	line-height:20px;
	margin-bottom:23px;
}

.holder .box-hold .box .social {
	margin:0;
	padding:0;
	list-style:none;
	overflow:hidden;
}

.holder .box-hold .box .social li {
	float:left;
	padding-right:5px;
}

.holder .box-hold .box .social img {
	margin:0;
}


/**** Hero ****/
.hero {
	margin: 0 auto;
	padding: 0;
	width: 1264px;
	/* min-height: 822px; */
	min-height: 700px;
	display: block;
	position: relative;
	float: left;
	left: -162px;
	background-color: #222227;
	margin-bottom: -1px;
}

.hero-brief {
	margin: 0 auto;
	float: left;
	width: 940px;
	height: 0;
	position: relative;
	left: 160px;
	top: 280px;
	z-index: 10;
}

.hero-brief h1,
.hero-brief h2 {
	margin: 0;
	padding: 0;
	font: 40px/46px 'Montserrat', sans-serif;
	font-weight: 400;
	color: #fff;
	text-transform: uppercase;
	text-shadow: 0px 2px 14px #333;
	text-shadow: 0px 1px 20px rgba(0,0,0,0.3);
}

.hero-brief h1 {
	width: 100%;
	position: relative;
	text-align: center;
	/* 	float: left; */
	/* 	width: 70%; */
	text-transform: none;
}

.hero-brief h1 span {
	text-transform: none;
}

.hero-brief h1.hero1 {
	bottom: 130px;
}

.hero-brief h1.hero2 {
	margin-left: 14px;
	width: 50%;
	bottom: 90px;
	text-align: left;
}

.hero-brief h1.hero3 {
	margin-right: 14px;
	width: 54%;
	float: right;
	bottom: 60px;
	text-align: right;
}

.hero-brief a.contact-us-hero {
	margin: 12px -20px 0 0;
	padding: 0;
	width: 253px;
	height: 120px;
	color: #fff;
	font: 16px 'Montserrat', sans-serif;
	font-weight: 700;
	line-height: 62px;
	text-align: center;
	text-transform: uppercase;
	
	display: block;
	position: relative;
	float: right;
	background: url(images/contact_hero_btn_bg.png) 0 0 no-repeat;
}

.hero-brief a.contact-us-hero:hover {
	background-position: 0 100%;
	text-decoration: none;
}

/*
.hero-brief h1,
.hero-brief a.contact-us-hero {
	bottom: 150px;
}
*/

.hero-brief .hero-device {
	margin: 0 auto;
	width: 1264px;
	height: 350px;
	position: relative;
	left: -162px;
	top: -139px;
	background: url(images/contact_pad_shadow.png) 42px bottom no-repeat;
	overflow: hidden;
		display: none;
}

.hero-brief .hero-device a {
	margin: 0 auto 0 auto;
	/* 	padding: 114px 200px 0 200px; */
	
	position: absolute;
	bottom: 0;
	float: left;
	
	text-indent: -9999px;
	display: block;
	/* background: url(images/ipad_contact.png) no-repeat; */
	background-position: 0 4px;
	background-repeat: no-repeat;
	
	-webkit-transform: translateZ(0);
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
}

.hero-brief .hero-device a.playbook-hero {
	width: 540px;
	height: 167px;
	
	left: 160px;
	background-image: url(images/playbook_hero_btn.png);
	z-index: 200;
}

.hero-brief .hero-device a.inwindow-hero {
	width: 589px;
	height: 309px;
	
	left: 330px;
	background-image: url(images/inwindow_hero_btn.png);
	z-index: 180;
}

.hero-brief .hero-device a.chameleon-hero {
	width: 601px;
	height:191px;
	
	left: 500px;
	background-image: url(images/chameleon_hero_btn.png);
	z-index: 190;
}

.hero-brief .hero-device a:hover {
	background-position: 0 0;
	/*padding-top: 110px;
	height: 80px;*/
}

.hero-alert {
	width: 52%;
	float: right;
	clear: both;
	padding: 16px;
	background: rgb(0,0,0);
	background: rgba(0,0,0,0.6);
	box-sizing: border-box;
}

.hero-alert h2 {
	text-transform: none;
	font-size: 20px;
	line-height: 28px;
}

.hero-alert a {
	color: #33baed;
}

/** Job Posting **/
.job-posting {
	margin: 0 auto;
	padding: 8px 162px 0;
	width: 940px;
	height: 68px;
	background-color: #472059;
	color: #fff;
	font-size: 20px;
	font-weight: bold;
		position: relative;
		left: -162px;
		top: -60px;
		margin-bottom: -58px;
		float: left;
}

.job-posting .job-block {
	margin: 13px auto 0;
	width: 940px;
	text-align: center;
}

.job-posting .job-block p {
	padding-top: 3px;
	width: 100%;
	font: 20px 'Montserrat', sans-serif;
	font-weight: 700;
	color: #fff;
	text-transform: uppercase;
}

.job-posting .job-block p a {
	color: #dad2de;
}

/** Slider **/

	/* Slider Setup */
	.hero input {
		display: none;
	}
	
	#slide1:checked ~ #slides .inner { margin-left:0; }
	#slide2:checked ~ #slides .inner { margin-left:-100%; }
	#slide3:checked ~ #slides .inner { margin-left:-200%; }
/* 	#slide4:checked ~ #slides .inner { margin-left:-300%; } */
	
	#overflow {
		width: 100%;
		overflow: hidden;
	}
	
	#slides .inner {
		width: 400%;
		line-height: 0;
	}
	
	#slides article {
		width: 25%;
		float: left;
		display: block;
	}
	
	/** Slider Styling **/
	
	/* Control Setup */
	#controls {
		margin: 0 auto;
		position: relative;
		float: left;
		top: -320px;
		left: 162px;
		height: 0;
		width: 924px;
		text-align: center;
		z-index: 50;
			/* display: none; */ /* TURN OFF HERO GALLERY */
	}
	
	#controls:after {
		clear: both;
		content: "";
		display: block;
	}
	
	#controls label { 
		display: none;
		width: 60px;
		height: 60px;
		opacity: 0.8;
	}
	
	#active {
		margin: 0;
		padding: 0;
		height: 0;
		position: relative;
		top: -30px;
		text-align: center;
	}
	
	#active label {
		-webkit-border-radius: 8px;
		-moz-border-radius: 8px;
		border-radius: 8px;
		display: inline-block;
		width: 10px;
		height: 10px;
		background: #333;
		box-shadow: 0px 0px 4px 1px #fff;
		box-shadow: 0px 0px 4px 1px rgba(255,255,255,0.2);
		margin: 0 2px 0 2px;
			/* display: none; */ /* TURN OFF HERO GALLERY */
	}
	
	#active label:hover {
		background: #ccc;
		border-color: #777 !important;
	}
	
	#controls label:hover {
		opacity: 1;
	}
	
	#slide1:checked ~ #controls label:nth-child(2), 
	#slide2:checked ~ #controls label:nth-child(3), 
	#slide3:checked ~ #controls label:nth-child(1) {
		background: url('images/arrow_right.png') no-repeat;
		float: right;
		margin: 0;
		display: block;
	}
	
	
	#slide1:checked ~ #controls label:nth-child(3),
	#slide2:checked ~ #controls label:nth-child(1),
	#slide3:checked ~ #controls label:nth-child(2) {
		background: url('images/arrow_left.png') no-repeat;
		float: left;
		margin: 0;
		display: block;
	}
	
	#slide1:checked ~ #active label:nth-child(1),
	#slide2:checked ~ #active label:nth-child(2),
	#slide3:checked ~ #active label:nth-child(3) {
		background: #FFF;
		border-color: #FFF !important;
		box-shadow: 0px 0px 4px 1px #333;
		box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);
	}

	/* Slider Styling */
	#slides {
		margin: 0;
	}

	/* Animation */
	#slides .inner {
		-webkit-transform: translateZ(0);
		-webkit-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000); 
		-moz-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000); 
	    -ms-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000); 
	     -o-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000); 
	        transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000); /* easeInOutQuart */
	
		-webkit-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); 
		-moz-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); 
	    -ms-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); 
	     -o-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); 
	        transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); /* easeInOutQuart */
	}
	
	#slider {
		-webkit-transform: translateZ(0);
		-webkit-transition: all 0.5s ease-out;
		-moz-transition: all 0.5s ease-out;
		-o-transition: all 0.5s ease-out;
		transition: all 0.5s ease-out;
	}
	
	#controls label{
		-webkit-transform: translateZ(0);
		-webkit-transition: opacity 0.2s ease-out;
		-moz-transition: opacity 0.2s ease-out;
		-o-transition: opacity 0.2s ease-out;
		transition: opacity 0.2s ease-out;
	}
	
	#slide1:checked ~ #slides article:nth-child(1) .info,
	#slide2:checked ~ #slides article:nth-child(2) .info,
	#slide3:checked ~ #slides article:nth-child(3) .info,
	#slide4:checked ~ #slides article:nth-child(4) .info {
		opacity: 1;
		-webkit-transition: all 1s ease-out 0.6s;
		-moz-transition: all 1s ease-out 0.6s;
		-o-transition: all 1s ease-out 0.6s;
		transition: all 1s ease-out 0.6s;
	}
	
	.info, #controls, #slides, #active, #active label, .info h3, .desktop, .tablet, .mobile {
		-webkit-transform: translateZ(0);
		-webkit-transition: all 0.5s ease-out;
		-moz-transition: all 0.5s ease-out;
		-o-transition: all 0.5s ease-out;
		transition: all 0.5s ease-out;
	}

/** **/
.slide-content {
	margin: 0 auto;
	padding: 0;
	width: 940px;
}

.hero-content {
	margin: 0 auto;
	padding: 0;
}

.hero-content .holder {
	margin: 70px auto 0 auto;
	padding: 0;
	width: 940px;
	height: 100%;
	border: none;
	color: #abaeb8;
	line-height: 24px;
}

.hero-block p {
	height: auto;
	margin-bottom: 30px;
}

.hero-content .left {
	float: left;
	width: 32%;
}

.hero-content .right {
	float: right;
	width: 66%;
}

.hero-content .right p {
	margin: 0;
	padding: 0;
	width: 90%;
	height: 100%;
}


/** Home Content **/
.home-block {
	margin: 0 auto;
	padding: 0;
	display: block;
	min-height: 66px;
	width: 1264px;
	position: relative;
	float: left;
	left: -162px;
	margin-bottom: -4px;
}

div.wall {
	background-position: -30% center !important;
}

.home-block a {
	color: #FFF;
}

.home-block p {
	margin-top: 0;
	margin-bottom: 60px;
	padding-top: 0;
	height: auto;
}

.home-block .holder {
	margin: 60px auto 0 auto;
	padding: 0;
	width: 940px;
	
	height: 100%;
	border: none;
	color: #abaeb8;
}

.home-block .left {
	float: left;
	width: 34%;
}

.home-block .right {
	float: right;
	width: 66%;
}

.view-reel {
	width: 476px;
	height: 142px;
	display: block;
	float: left;
	background-position: 0 0;
	z-index: 10;
	position: relative;
	top: -4px;
}

.view-reel:hover {
	background-position: 0 142px;
	cursor: pointer;
}

#pixie-container {
	position: absolute;
	overflow: hidden;
	z-index: 0;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	display: block;
	background: url(images/viewreel_hoverbg.png) top left  no-repeat;	
}

.show-pixie {
	opacity: 0;

	-webkit-transform: translateZ(0);
	-webkit-transition: opacity 0.2s ease-out;
	-moz-transition: opacity 0.2s ease-out;
	-o-transition: opacity 0.2s ease-out;
	transition: opacity 0.2s ease-out;
}

#pixie {
	z-index:0;
}

.wae-episode {
	margin-top: -2px;
}

.wae-episode h2 {
	margin-bottom: 30px;
}

.wae-episode h3 {
	margin: 0;
	padding: 0;
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	text-transform: uppercase;
}

a.watch-now {
	width: 130px;
	height: 80px;
	padding: 60px;
	font: 11px 'Montserrat', sans-serif;
	font-weight: 700;
	text-transform: uppercase;
	background: url(images/play_btn.png) left center no-repeat;
}

/* Video Box */
.video-box-overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgb(0, 0, 0);
	background-color: rgba(0, 0, 0, 0.8);
	z-index: 400;
}

.video-box-container {
	margin: 0 auto;
	display: none;
	position: absolute;
	top: 660px;
	left: auto;
	right: auto;
	width: 960px;
	height: 540px;
	background-color: #000;
	z-index: 500;
	overflow: visible;
}


/* */
.brand-block {
	padding-top: 60px;
	width: 100%;
	clear: both;
}

.brands {
	height:1%;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
}

.brands ul {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 1%;
	list-style: none;
}

.brands ul li {
	margin: 0 0 42px 0;
	padding: 0;
	width: 25%;
	height: 100px;
	float:left;
}

.brands ul li img {
	display:block;
	margin:0 auto;
}

.brands ul li:nth-child(4n+1) img {
	margin: 0;
}

/**** Sub Block ****/
.sub-block {
	margin: 0 auto;
	padding: 0;
	display: block;
	min-height: 140px;
	max-height:600px;
	width: 1264px;
	position: relative;
	float: left;
	left: -162px;
	margin-bottom: -4px;
	background-color: #222227;
}

.hide-sub-block {
	position: relative;
	float: right;
	cursor: pointer;
	font: 12px 'Montserrat', sans-serif;
	font-weight: 700;
	color: #bbbbbb;
	text-transform: uppercase;
	height: 1%;
	z-index: 50;
	right: 180px;
	top: 150px;
}

.sub-block, .hide-sub-block {
	/* block animation */
	-webkit-transition-property : 'min-height';
	-webkit-transition-duration : .4s;
	-webkit-transition-timing-function : cubic-bezier(0.075, 0.820, 0.165, 1.000);
	
	-moz-transition-property : 'min-height';
	-moz-transition-duration : .4s;
	-moz-transition-timing-function : cubic-bezier(0.075, 0.820, 0.165, 1.000);
}

.hide-sub-block:hover {
	color: #FFF;
}

.close-block {
	width: 17px;
	height: 17px;
	background: url(images/close_btn.png) 0 0 no-repeat;
	position: relative;
	float: right;	
}

.hide-sub-block:hover .close-block {
	background-position-y: 100%;
}

.close-block-label {
	width: 60px;
	height: 17px;
	position: relative;
	float: right;
	right: 10px;
	top: 2px;
	text-align: right;
	display: block;
}

.sub-wrapper {
	margin: 180px auto 80px auto;
	width: 700px;
}

.sub-wrapper h1 {
	font: 48px 'Montserrat', sans-serif;
	font-weight: 700;
	color: #fff;
	margin-bottom: 12px;
}

.sub-wrapper h2 {
	font: 24px 'Montserrat', sans-serif;
	font-weight: 400;
	color: #989ba5;
	text-transform: none;
	margin-bottom: 22px;
}

.sub-wrapper p {
	border-top: 1px solid #4e4e52;
	padding-top: 20px;
	font: 12px/24px;
	color: #e5e5e5;
}

/**** Text-Block ****/
.text-block {
	padding:32px 0 98px;
}

.text-block h1 {
	margin:0;
	color:#FFF;
	font:24px/30px 'Montserrat', sans-serif;
	font-weight: 700;
}
.text-block strong {
	display:block;
	margin-bottom:45px;
	color:#989ba5;
	width:750px;
	margin-right:-50px;
	font:30px 'Montserrat', sans-serif;
	font-weight: 400;
}
.text-block p{
	margin:0;
	font-size:16px;
	line-height:24px;
	color:#DDD;
}
.quote {
	margin: 90px 0 0 0;
	padding-top: 20px;
	border-top: solid 1px #cdced1;
}
.quote strong {
	font: 16px 'Montserrat', sans-serif;
	font-weight: 400;
	color: #93a2d4;
	line-height: 12px;
}

.quote h4.quote_source {
	margin-top: 8px;
	text-align: right;
	font: 12px 'Montserrat', sans-serif;
	font-weight: 400;
	text-transform: uppercase;
	color: #93a2d4;
	margin-bottom: 30px;
}


/****** Content *******/
.content-hold {
	width: 100%;
}

#content {
	width: 940px;
	margin:0 auto;
}


/* Tabset */
nav.project_nav {
	width: 100%;
	margin-bottom: 20px;
}

nav.project_nav h2 {
	float: left;
	position: relative;
	width: 100px;
	color: #333;
}

.tabset {
	margin: 0;
	padding: 0;
	list-style: none;
	overflow: hidden;
	float: right;
	font:13px 'Montserrat', sans-serif;
	font-weight: 700;
	text-transform: uppercase;
	max-width: 820px;
}

.tabset li {
	float: left;
	padding: 0 13px;
	margin-left: -8px;
	background:url(images/nav_splitter_dark.png) no-repeat 3px 3px;
}
.tabset li a {
	color:#989ba5;
	padding-bottom:6px;
	float:left;
}
.tabset li a:hover ,
.tabset li a.active {
	color:#171723;
	text-decoration:none;
	margin:0;
	position:relative;
}
#content div.tab {
	margin: 0 auto;
	width: 100%;
	min-width: 940px;
	position: relative;
	float: left;
	padding: 0;
}
#content div.tab:after {
	clear:both;
	display:block;
	content:"";
}


/**** Gallery *****/
.gallery-wrapper {
	margin: 0 auto;
	width: 1264px;
	min-width: 940px;
	height: 500px;
	position: relative;
	float: left;
	left: -162px;
	overflow: hidden;
	background-position: center top;
	background-repeat: no-repeat;
}

.gallery-block {
	display: block;
	margin-bottom: -1px;
}

.gallery-block #gallery-1 { /* inner */
	margin: 0 auto;
	width: 900% !important;
	position: relative;
}
.gallery-block #gallery-1 .gallery-item{ /* article */
	width: 1264px !important;
	min-width: 940px !important;
	display: block;
	margin: 0 auto !important;	
	text-align: center;
	overflow-x: hidden;
}

.gallery-block #gallery-1 img {
	border: 0 !important;
	overflow: hidden;
}

/* Gallery Controls */
.gallery-block .next ,
.gallery-block .prev {
	width:58px;
	height:58px;
	text-indent:-9999px;
	overflow:hidden;
	position:absolute;
	top:220px;
	z-index:100;
}
.gallery-block .prev {
	left:163px;
	background:url(images/arrow_left.png) no-repeat;
	cursor:pointer;
}
.gallery-block .next {
	right: 163px;
	background:url(images/arrow_right.png) no-repeat;
	cursor:pointer;
}

.gallery-hero-text {	
	margin: 0 auto;
	position: absolute;
	z-index: 999;
	color: #fff;
	width: 236px;
	left: 152px;
	top: 300px;
		display: none;
}



/*** Project Content ***/
.text-block2 {
	width:940px;
	margin: 0 auto;
	padding: 0 0 30px 0;
	display: block;
	color: #333;
}

.text-block2 p, .text-block2 h3 {
	width: 460px;
}

.text-block2 p {
	margin: 0;
	padding-bottom: 20px;
	display: block;
}

.text-block2 h3 {
	margin-top: 30px;
	margin-bottom: 40px;
	text-transform: uppercase;
	font-size: 20px;
}

.text-block2 h3.carrer-body-sub {
	margin-top: 20px;
	margin-bottom: 10px;
}

.text-block2 a {
	font-weight: bold;
	color: #666;
}

.text-block2.title p {
	line-height: 34px;
}

.text-block2.title p span {
	line-height: 50px;
	color: #888;
}

.text-block2 h2, .text-block2 h3 {
	color: #222227;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
} 

.text-block2.left:after, .text-block2.right:after {
	clear: both;
	content: "";
	display: block;
}

.text-block2.left p, .text-block2.left h3 {
	position: relative;
	float: left;
	clear: left;
}

.text-block2.left img {
	position: relative;
	float: right;
	margin-right: -162px;
	display: block;
}

.text-block2.right p, .text-block2.right h3 {
	position: relative;
	float: right;
	clear: right;
}

.text-block2.right img {
	position: relative;
	float: left;
	margin-left: -162px;
}

/* Project Title Block */
.text-block2.title {
	float: left;
	position: relative;
}

.text-block2.title h2 {
	font-size: 30px;
	color: #222227;
	margin-top: 65px;
	margin-bottom: 40px;
}

.text-block2.title p {
	width: 620px;
	font-size: 20px;
	color: #222227;
	margin-bottom: 20px;
}

/*Project Content Block */
.text-block2.content {
	width: 1264px;
	float: left;
	position: relative;
	left: -162px;
}

.text-block2.content:after {
	clear: both;
	content: "";
	display: block;
}

/* Project Gray Block */
.text-block2.content.gray {
	background-color: #ceced0;
}

/* Project Content Chameleon Extended */
	.patent, strong {
		font-size: 14px;
		color: #333;
	}

	/* Intro */
	.cham-intro {
		margin-bottom: 40px;
	}
	
	.cham-intro p, .cham-intro h3 {
		width: 676px;
	}
	
	.cham-intro img {
		width: 420px;
		margin-top: 40px;
	}
	
	/* Contextualization */
	.cham-context {
		padding-top: 40px;
	}
	
	.cham-context h3 {
		margin-top: 50px;
	}
	
	.cham-context img {
		top: 20px;
	}
	
	/* Personalize*/
	.cham-personilization {
		height: 459px;
	}
	
	.cham-personilization p, .cham-personilization h3, .cham-personilization strong {
		width: 460px;
		color: #fff;
	}
	
	.cham-personilization img {
		width: 622px;
		margin-top: -60px;
	}
	
	/* Differentiation */
	.cham-differentiation {
		max-height: 490px;
	}
	
	.cham-differentiation p, .cham-differentiation h3, .cham-differentiation strong {
		width: 460px;
		color: #fff;
		float: left;
		position: relative;
	}
	
	.cham-differentiation img {
		width: 625px;
		padding-top: 102px;
	}
	
	/* One More Thing */
	.cham-more {
		margin-top: 30px;
		margin-bottom: 50px;
	}
	
	.text-block2.cham-more p {
		float: none !important;
	}
	
	.cham-more img {
		float: none !important;
		margin-left: 100px;
	}


/* Other Text-Block2 Styles */
.text-block2-careers {
	width:600px;
	position:relative;
	margin: 0px 0px 0 0px;
	padding-bottom:193px;
	color: #333333;
	line-height: 20px;
}
.text-block2-careers img {
	position: relative;
	right: 16px;
}
.text-block2-careers .brief {
	line-height: 28px;
	font-size: 18px;
	padding-bottom: 30px;
}


/*** Side Image Position ***/
	.image {
		position: relative;
	}
	
	/* PlayBook */
	#content .image.playbook_side {
		margin-top: -50px;
	}
	#content .image.playbook_side2 {
		margin-top: -60px;
	}
	
	.playbook-tile p, .playbook-tile h3 {
		color: #FFF;
	}
	
	.pblaunch-tile {
		height: 425px;
	}
	
	.pblaunch-tile h3 {
		margin-top: 100px;	
	}
	
	.pblaunch-tile p, .pblaunch-tile h3 {
		color: #fff;
	}
	
	#content .image.playbookLaunch_side {
		top: -100px;
	}
	
	/*Intel*/
	#content .image.intel_side {
		top: 40px;
	}

	/*QNX Med*/
	#content .image.qnx_med_side {
		margin-top: -38px;
		float: left;
		z-index: 2;
	}
	
	.qnxmedical-tile {
		margin-top: 40px;
		height: 394px;
	}
	
	.qnxmedical-tile p, .qnxmedical-tile h3 {
		color: #fff;
	}
	
	/*QNX Home Automation*/
	#content .image.qnx_side {
		top: 34px;
		left: 150px;
	}
	
	.qnxhome-tile {
		padding-top: 80px;
		height: 434px;
	}
	
	.qnxhome-tile p, .qnxhome-tile h3 {
		color: #fff;
	}
	
	/*Open SMA*/
	#content .image.openSMA_side {
		top: 80px;
	}
	
	/*Radian6*/
	.radian6-tile {
		min-height: 438px;
		background: no-repeat bottom left;
	}
	
	/*Digital-Tutors*/
	#content .image.digitalTutors_side {
		top: 60px;
	}
	/*Inwindow Outdoor*/
	#content .image.inwindow_side {
		top: -18px;
		left: 80px;
	}
	
	#content .image.inwindow_side2 {
		margin-top: -80px;
	}
	
	/* Digital Tutors */
	.digitaltutors-tile {
		height: 500px;
		background-position: right bottom;
		background-repeat: no-repeat;
	}
	
	/* Android Framework */
	.framework_android {
		height: 340px;
		background-position: center center bottom;
		background-repeat: no-repeat;
	}
	
	.framework_android p {
		color: #fff;
	}
	
	.framework_android p {
		padding-top: 25px;
		font-size: 18px;
		line-height: 30px;
	}
	
	.framework_side1 {
		top: 110px;
		right: 200px;
	}
	
	.framework_tile {
		height: 458px;
	}
	
	.framework_tile p {
		margin-top: 60px;
		color: #fff;
		font-size: 22px;
		line-height: 36px;
		font-weight: bold;
	}
	
	.framework_side2 {
		bottom: 120px;
	}
	
	.framework_largephone {
		height: 760px;
		background-position: right bottom;
		background-repeat: no-repeat;
	}
	
	.framework_largephone h3 {
		margin-top: 110px;
	}
	
	/* Chameleon */
	.chameleon_block {
		background-position: center top;
		background-repeat: no-repeat;
	}
	
	.chameleon_block h3,
	.chameleon_block p {
		color: #fff;
	}
	
	.chameleon_block.logo_block {
	 	padding-top: 20px;
		height: 301px;
	}
	
	.chameleon_block.logo_block h3,
	.chameleon_block.logo_block p strong {
		font-size: 20px;
		line-height: 34px;
	}
	
	.chameleon_block.logo_block p strong {
		color: #fff;
		font-weight: bold;
	}
	
	.chameleon_block.device_block {
		padding-top: 40px;
		height: 300px;
	}
	
	.chameleon_block.gold_block {
		height: 534px;
	}
	
	.chameleon_block.color_block {
		height: 360px;
	}
	
	.chameleon_block.color_block p {
		margin-top: 34px;
		color: #fff;
		font-size: 18px;
		line-height: 28px;
		font-weight: bold;
		box-sizing: border-box;
		padding-right: 30px;
	}
	
	.chameleon_block.gold_block h3 {
		margin-top: 60px;
	}
	
	.chameleon_block.gold_block h3,
	.chameleon_block.gold_block p {
		margin-right: 40px;
		color: #705948;
		box-sizing: border-box;
		padding-left: 80px;
	}
	
	.chameleon_side1 {
		top: 30px;
		right: 240px;
	}
	
	.chameleon_side2 {
		top: 10px;
		right: 0;
	}
	
	.chameleon_side3 {
		bottom: 40px;
		left: 140px;
	}
	
	.chameleon_side4 {
		float: right;
		clear: right;
		width: 65%;	
		bottom: 80px;
	}
	
	/* Turkcell */
	.turkcell_intro {
		height: 320px;
		background-position: center top;
		background-repeat: no-repeat;
	}
	
	.turkcell_intro .text-block2 p{
		width: 700px;
	}
	
	.turkcell_intro h3,
	.turkcell_intro p,
	.turkcell_blue h3,
	.turkcell_blue p,
	.turkcell_fall h3,
	.turkcell_fall p {
		color: #fff;
	}
	
	.turkcell_intro h3,
	.turkcell_blue h3,
	.turkcell_green h3 {
		font-size: 30px;
		line-height: 34px;
	}
	
	.turkcell_intro p {
		font-size: 24px;
		line-height: 28px;
		font-weight: bold;
	}
	
	.turkcell_blue {
		padding-top: 100px;
		height: 890px;
	}
	
	.turkcell_blue p {
		font-size: 16px;
		font-weight: bold;
	}
	
	.turkcell_side_1 {
		left: 0;
		top: 10px;
	}
	
	.turkcell_green {
		height: 836px;
	}
	
	.turkcell_green h3,
	.turkcell_green p {
		color: #006666;
	}
	
	.turkcell_green h3 {
		padding-top: 154px;
	}
	
	.turkcell_side_2 {
		bottom: 130px;
		right: 40px;
	}
	
	.turkcell_fall {
		height: 680px;
	}
	
	.turkcell_fall h3 {
		padding-top: 280px;
	}
	
	.turkcell_side_3 {
		top: 130px;
		left: 80px;
	}



.hold:after {
	clear:both;
	content:"";
	display:block;
}


/**** Contact Block ****/
.contact-block {
	background-color: #222227;
	padding: 30px 0;
}

.contact-block.light {
	background-color: #f0f0f0;
}

.contact-block .block {
	width: 620px;
}

.holder .contact-header {
	margin-top: 0px;
	float: left;
	display: block;
}

.holder .address {
	margin-right: 100px;
	width:220px;
	float:left;
}

.holder .address address {
	margin: 0;
	padding:0;
}

.holder .address span {
	display:block;
	line-height:24px;
	font-size: 12px;
	font-style:normal;
}

.contact-block.light address {
	color: #222227;
}

.holder .box-hold2 .box a ,
.holder .address a {
	color:#999;
	padding-right:13px;
	font-style:normal;
	background:url(images/arrow01.gif) no-repeat 100% 50%;
}

.holder .box-hold2 {
	margin-left: -34px;
}

.holder .box-hold2 .box {
	margin: 0 0 0 34px;
	padding: 0;
	float: left;
	position: relative;
		max-width: 180px;
	
}

.holder .box-hold2 .box p {
	margin: 0 0 8px 0;
}


/* footer */
.footer-block {
	margin: 0 auto;
	width: 1264px;
	background-color: #1a1a20;
	position: relative;
	left: -162px;
	margin-bottom: -1px;
}

#footer {
	margin: 0 auto;
	padding: 20px 0;
	overflow:hidden;
	height:1%;
	width: 940px;
	min-height: 220px;
}

#footer a, #footer a:visited {
	color:#abaeb8;
	margin-left: 10px;
	text-decoration: underline;
}

#footer a:hover {
	color:#8c8f98;
}

#content #footer {
	margin-top:-1px;
	border-top:1px solid #cdced1;
}
#footer .logo {
	width:124px;
	height:38px;
	float:left;
	text-indent:-9999px;
	overflow:hidden;
	background:url(images/footer-logo.png) no-repeat;
}
#footer .logo-dark {
	width:124px;
	height:38px;
	float:left;
	text-indent:-9999px;
	overflow:hidden;
	background:url(images/footer-logo-dark.png) no-repeat;
}
#footer p {
	margin:0;
	text-align: right;
	line-height:38px;
	font-size:10px;
	color:#abaeb8;
}

#footer .fb-like {
	float: left;
	position: relative;
	top: 12px;
	color: #FFF;
}

#footer .light .fb-like {
	float: left;
	position: relative;
	top: 12px;
}


/**** Blog ****/
.blog {
	color: #222227;
}

.post-image {
	width: 100%;
	height: 350px;
	margin-bottom: 22px;
}

/* Post List */
.post-list {
	margin-top: 12px;
	width: 100%;
}

.post-list:after {
	clear: both;
	content: "";
	display: block;
}

.post-brief {
	margin-bottom: 40px;
	width: 620px;
	position: relative;
	float: right;
	border-bottom: 1px solid #b8b8bb;
}

.error {
	border-bottom: 0px;
	font-size: 16px;
}

header.blog-head {
	margin: 0;
	padding: 1px;
	height: 50px;
	width: 100%;
	border-bottom: 1px solid #b8b8bb;
	display: block;
}

.post-brief .post-head {
	border-bottom: none;
}

header.blog-head h1 {
	margin-top: 16px;
	font-size: 16px;
	color: #222227;
}

.post-buttons {
	width: 100%;
	height: 28px;
	margin: 20px 0 20px 0;
}

.post-buttons a.read-post {
	width: 110px;
	height: 28px;
	display: block;
	float: right;
	color: #fff;
	font-size: 12px;
	line-height: 28px;
	text-align: center;
	text-transform: uppercase;
	background-color: #222227;
}

.post-buttons a:hover.read-post {
	background-color: #404048;
	text-decoration: none;
}

/* Categories */
aside.sidebar {
	margin: -10px 0 0 0;
	padding: 0;
	width: 220px;
	position: relative;
	float: left;
	display: block;
}

aside.sidebar nav {
	margin-bottom: 44px;
	width: 100%;
}

aside.sidebar nav h3.sidebar-header {
	margin-bottom: 10px;
	text-transform: uppercase;
}

aside.sidebar nav ul {
	list-style: none;
	list-style-image: none;
	list-style-position: outside;
	list-style-type: none;
	margin: 0;
	padding: 0;
}

aside.sidebar nav ul li {
	font: 12px/30px Helvetica, Arial, sans-serif;
	font-weight: bold;
}

aside.sidebar nav ul li a {
	color: #666;
}

/* Sidebar Article Type */
aside.sidebar a.rss {
	margin-top: 46px;
	position: relative;
	display: inline;
	text-indent: 30px;
	width: 220px;
	height: 19px;
	line-height: 20px;
	display: block;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	text-transform: uppercase;
	color: #128AD6;
	background: url(images/rss_btn.png) no-repeat 0 0;
}

aside.sidebar a:hover.rss {
	background-position: 0 100%;
	color: #333;
	text-decoration: none;
}


aside.sidebar .type-ideas, aside.sidebar .type-technical {
	text-transform: uppercase;
	text-indent: 50px;
	width: 220px;
	height: 29px;
	display: block;
}

aside.sidebar .type-ideas {
	color: #3b8ce7;	
	background: url(images/ideas_icon_btn.png) no-repeat;
	margin-bottom: 10px;
}

aside.sidebar .type-technical {
	color: #990099;
	background: url(images/technical_icon_btn.png) no-repeat;
}



/* Single Post */
nav.post-nav {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 40px;
	display: block;
}

.next-post, .prev-post {
	margin-top: 7px;
	padding: 0;
	font: 13px/24px 'Montserrat', sans-serif;
	font-weight: 700;
	color: #767679;
	text-transform: uppercase;
}

a.next-post:hover, a.prev-post:hover {
	color: #767679;
}

a.next-post:hover, a.prev-post:hover {
	color: #000;
	text-decoration: underline;
}

.next-post {
	float: right;
}

.prev-post {
	float: left;
}

.single-post {
	margin: 0;
	padding: 0 0 60px 0;
	border-bottom: 1px solid #b8b8bb;
	height: auto;
	display: block;
}

.single-post:after {
	clear: both;
	content: "";
	display: block;
}

.post-head {
	margin: 0 0 40px 0;
	min-height: 90px;
	width: 100%;
	border-bottom: 1px solid #b8b8bb;
}

.post-head h2 {
	margin: 28px 0 10px 0;
	max-width: 820px;
	height: auto;
	font-size: 24px;
	color: #222227; 
}

.post-meta {
	max-width: 820px;
	color: #666;
}

.author-twitter {
	font-weight: bold;
	color: #666;
}

.single-post article {
	width: 620px;
	position: relative;
	float: right;
}

aside.post-social {
	margin-top: 14px;
	width: 264px;
	position: relative;
	float: left;
	display: inline;
}

.post-comments {
	margin: 0;
	padding: 0;
	border-bottom: 0px solid #b8b8bb;
}

.post-comments:after {
	clear: both;
	content: "";
	display: block;
}

.disqus {
	margin: 30px 0 30px 0;
	padding: 0;
	width: 620px;
	position: relative;
	float: right;
}

/* article type */
.article-type-block {
	position: relative;
	float: right;
	top: -60px;
}

.article-type {
	float: right;
	display: inline;
	position: relative;
	text-transform: uppercase;
	text-align: right;
}

.article-type img {
	float: right;
	position: absolute;
	z-index: 30;
	display: block;
	top: 248px;
	right: 0px;
}

.post-technical img, .post-ideas img {
	top: 0;
	left: 0;
}

.post-technical {
	width: 120px;
}

.post-ideas {
	width: 110px;
}

.ideas-icon, .technical-icon {
	float: left;
	padding-right: 10px;
} 

.single-post .article-type h4, .single-post .article-type h4 {
	float: right;
	margin-top: -2px;
}

.post-technical h4 {
	color: #990099;
}

.post-ideas h4 {
	color: #3399ff;
}

/** Social Sharing **/ 
.social-share {
	margin: 0;
	display: inline-table;
	position: relative;
	float:left;
	height:20px;
	width: 80%;
	min-width: 270px;
    display: block;
}

.post-buttons .social-share {
	margin-top: 3px;
}

.social-share .fb-like {
	display: block;
	position: relative;
	float: left;
}

.social-share .twitter-button {
	display: block;
	position: relative;
	float: left;
}


/** Post Styles **/
.single-post article a {
	font-weight: bold;
	color: #128ad6;
}

.single-post h4 {
	font-size: 16px;
	margin-top: 30px;
}

blockquote {
	margin: 24px 0 24px 0;
	padding: 0;
	font-weight: bold;
	font-size: 12px;
}

blockquote p {
	margin: 0;
	padding: 0;
}



/**** Maintenance ****/
#maintenance {
	background: #222227;
}

.maintenance-block {
	margin: 0 auto;
	width: 940px;
	margin-top: 100px;
	text-align: center;
}

#maintenance .header-twitter {
	margin: 0 auto;
	text-align: center;
	position: inherit;
}

#maintenance h1{
	color: #fff;
	font-size: 16px;
	margin-bottom: 0px;
	padding-bottom: 0;
}

#maintenance p {
	color: #AAA;
	margin-bottom: 20px;
}