/* 
Theme Name: Tech City Investment Organisation
Author: Traffic Digital 
Author URI: http://trafficdigital.com 
Version: 1.0 
Description: A theme based on Initializr. Uses child loops attached to pages specified in page.php. Based on a 940px layout with media queries available for 748px, mobile landscape (450px) and portrait (300px).
*/ 

/* =============================================================================
	 Initializr Styles
	 ========================================================================== */
	 
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio[controls], canvas, video { display: inline-block; *display: inline; *zoom: 1; }
html { font-size: 100%; overflow-y: scroll; -webkit-overflow-scrolling: touch; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body { margin: 0; font-size: 13px; line-height: 1.231;-webkit-font-smoothing: anti-aliased; }
body, button, input, select, textarea { font-family: sans-serif; color: #222; }
a:focus { outline: thin dotted; }
a:hover, a:active { outline: 0; }
abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; margin: 0; padding: 0; }
img { border: 0; -ms-interpolation-mode: bicubic; }
svg:not(:root) {    overflow: hidden;}
figure { margin: 0; }
form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
legend { border: 0; *margin-left: -7px; padding: 0; }
label { cursor: pointer; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; *overflow: visible; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }
input[type="checkbox"], input[type="radio"] { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
input[type="search"] { -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
button:-moz-focus-inner, input:-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; }
input:valid, textarea:valid {  }
table { border-collapse: collapse; border-spacing: 0; }
:focus { outline: none; }


/*
 * CSS Styles that are needed by jScrollPane for it to operate correctly.
 *
 * Include this stylesheet in your site or copy and paste the styles below into your stylesheet - jScrollPane
 * may not operate correctly without them.
 */

.jspContainer { overflow: hidden; position: relative; }
.jspPane { position: absolute; -webkit-backface-visibility: hidden; }
.jspPane ul {list-style:none}
.jspVerticalBar { position: absolute; z-index:998; top: 0; right: 1px; width: 6px; height: 100%; }
.jspHorizontalBar { position: absolute; bottom: 0; left: 0; width: 100%; height: 6px; }
.jspVerticalBar *,
.jspHorizontalBar * { margin: 0; padding: 0; }
.jspCap { display: none; }
.jspHorizontalBar .jspCap { float: left; }
.jspActive { display: block !important; }
.jspTrack { position: relative; }
.jspDrag { background:#b1af99; background: rgba(0,0,0,0.2); -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px;  position: relative; top: 0; left: 0; cursor: pointer; }
.jspHorizontalBar .jspTrack,
.jspHorizontalBar .jspDrag { float: left; height: 100%; }
.jspArrow { background: #50506d; text-indent: -20000px; display: block; cursor: pointer; }
.jspArrow.jspDisabled { cursor: default; background: #80808d; }
.jspVerticalBar .jspArrow { height: 16px; }
.jspHorizontalBar .jspArrow { width: 16px; float: left; height: 100%; }
.jspVerticalBar .jspArrow:focus { outline: none; }
.jspCorner { background: #eeeef4; float: left; height: 100%; }
 a:focus { outline: none; }

/* Yuk! CSS Hack for IE6 3 pixel bug :( */
* html .jspcorner { margin: 0 -3px 0 0; }

@font-face {
	font-family: 'futurabt-book';
	src: url('webfonts/23627e_0_0.eot');
	src: url('webfonts/23627e_0_0.eot#iefix') format('embedded-opentype'),
		url('webfonts/23627e_0_0.woff') format('woff'),
		url('webfonts/23627e_0_0.ttf') format('truetype');
}

@font-face {
	font-family: 'FuturaBT-Bold';
	src: url('webfonts/23627e_1_0.eot');
	src: url('webfonts/23627e_1_0.eot#iefix') format('embedded-opentype'),
		url('webfonts/23627e_1_0.woff') format('woff'),
		url('webfonts/23627e_1_0.ttf') format('truetype');
}

@font-face {
	font-family: 'TCIO';
	src: url('http://www.techcityuk.com/content/themes/tcio/wevfonts/tcio.eot');
	src: url('webfonts/tcio.eot') format('embedded-opentype'),
		url('webfonts/tcio.svg') format('svg'),
		url('webfonts/tcio.woff') format('woff'),
		url('webfonts/tcio.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

/* =============================================================================
	 Primary styles
	 Author: Traffic Digital
	 ========================================================================== */
/* --------------------    ANIMATIONS    -------------------- */
@-webkit-keyframes 'fade'{
	0%{opacity:0;}
	65%{opacity:0;}
	100%{opacity:1;}
}
/* -------------------- ELEMENT DEFAULTS -------------------- */

body{

  background: #f4f2e3 fixed bottom center no-repeat;
	overflow-x:hidden;
	font-family: FuturaBT-Book, arial, helvetica;
	font-size: 14px;
	color: #3f3f3f;
	padding-top:77px;
	-webkit-animation:'fade' 0.8s 1 alternate;
	-moz-animation:'fade' 0.8s 1 alternate;
	-ms-animation:'fade' 0.8s 1 alternate;
	-o-animation:'fade' 0.8s 1 alternate;
}
.nobg body{  background: #fff; }


p{  line-height: 1.3em; margin: 0 0 10px 0;  }
a{color: #000; text-decoration: none;}
a:hover{color: #c53f48;}

/* selection colours */
:-moz-selection { background: #c53f48; color: #fff; text-shadow: none; }
:selection { background: #c53f48; color: #fff; text-shadow: none; }

/* headings */

h1, h2, h3, h4, h5{ font-weight: normal; margin: 0; color: #3f3f3f; }
h2, .accessible h1 { font-size: 2em; text-transform: uppercase; }

h3{ font-size: 1.4em; }
h4{ font-size: 1.4em; }

/* lists */

ul{  list-style-image: url('img/li_bg.png'); margin: 0 0 15px 0; padding: 0 0 0 20px;  }

/* -------------------- WIDTHS -------------------- */

header, .wrapper {  width: 960px; clear: both; margin: 0 auto;  }
section { margin: 75px 0 0; display: none; }
section.loading { display: block; background:url(img/spinner.gif) center 175px no-repeat !important; }
section.loaded { display: block; }
section.s2{  width: 460px; }
section.s3{  width: 300px;}
section.s4{  width: 220px;} 

/* -------------------- LAYOUT -------------------- */
.container, article{  width: 100%; clear: both; }
.wrapper{ position: relative; margin: 0 auto; clear: both; border-top: 2px solid black; padding: 75px 0 0; }

#home  { margin:0 0 75px; }
#home .wrapper { height:954px; border-color:transparent; }
#haveyoursay .wrapper { height:283px; }
#whatwedo .wrapper { height:620px; }
#recenthighlights .wrapper { height:500px; }
#events .wrapper { height:600px; position: relative; }

#contact .wrapper { height:825px; }


/* header */
header{
	width:100%;
	height:77px;
	text-align: center;
	position: fixed;
	top:0;
	left:0;
	z-index: 99;
	background:#000;
	background: linear-gradient(95deg, rgb(0,0,0) 10%, rgb(40,40,40) 55%);
	background: -o-linear-gradient(95deg, rgb(0,0,0) 10%, rgb(40,40,40) 55%);
	background: -moz-linear-gradient(95deg, rgb(0,0,0) 10%, rgb(40,40,40) 55%);
	background: -webkit-linear-gradient(95deg, rgb(0,0,0) 10%, rgb(40,40,40) 55%);
	background: -ms-linear-gradient(95deg, rgb(0,0,0) 10%, rgb(40,40,40) 55%);
	background: -webkit-gradient(linear, 95deg, color-stop(0.1, rgb(0,0,0)), color-stop(0.55, rgb(40,40,40)));
}
header .main{ width:960px; margin:0 auto; }
header:after { content: url(img/header-shadow.png); position: absolute; top: 77px; left: 50%; margin-left: -692px;} 
header h1.ir{   width: 252px; height: 77px; background: url('img/header_logo.png') no-repeat 0 19px; float: left; }

header .mobile-menu { display: none; }

nav { float: right;  }

nav #links { float:right; margin:12px 0 0; }
nav #links li { float:left; margin-left:20px; }
nav #links li a { display: block; font-size: 14px; padding: 5px 0; color: #7D7D7D; }
nav #links li a:hover{ color: #fff; }
nav #links li.linkedin a,
nav #links li.twitter a { text-indent:-9999px; background:url(img/header-logos.png) 0 2px no-repeat; width: 34px; height: 27px; padding:0; }
nav #links li.twitter a { background-position:-33px 3px; }
nav #links li.linkedin a:hover { background-position:0 -29px }
nav #links li.blog a{color:#E56565;}
nav #links li.blog a:hover{color:#7D7D7D;} 
nav #links li.twitter a:hover { background-position:-33px -28px; }

nav #menu-header { width:100%; float:right; clear:right; overflow: hidden; }
nav #menu-header li { float:left; }
nav #menu-header li a { display: block; font-size: 16px; padding: 5px 0 5px 20px; text-decoration: none; color: #7D7D7D; }
nav #menu-header li.current a,
nav ul#links li.current a, 
nav ul#menu-header li a:hover,
nav ul#links li a:hover{ color: #ccc; }
nav #menu-header li.sticky.current a { color:#fff; } 
.error404 .wrapper {height:400px; }

/* -------------------- CLASSES -------------------- */

.left{float: left;}
.right{float: right;}
.clear{clear: both;}

/* typo */
.large{font-size: 1.4em; line-height: 1em;   }
.italic{font-style: italic; }
.meta{font-size: .8em; clear:both; }
h2, .accessible h1 {font-size:3.1em;text-align: center;margin-bottom: 75px;}
.page-content h2 { margin:45px 0 25px;}    
a.btn, button, input[type=submit], input[type=reset]{ padding: 6px; color: #000; background: #fff;  position: relative; margin: 0 20px 10px 0; line-height: 1.1em; display: inline-block; border: none;  }

/* slides */
#slides {
	text-align: center;
	position:relative;
	/*-webkit-mask-position: 85px 0;
	-webkit-mask-size: 792px;
	-webkit-mask-image: -webkit-gradient(linear, left top, right top, 
	color-stop(0.00,  rgba(0,0,0,0)),
	color-stop(0.04,  rgba(0,0,0,1)),
	color-stop(0.96,  rgba(0,0,0,1)),
	color-stop(1.00,  rgba(0,0,0,0)));*/
}
#slides .slides_container { width: 732px; height: 290px; margin: 0 auto; padding: 0 30px 40px 30px; overflow: hidden; }
#slides .slides_container h3{font-size: 2.61em;margin-bottom: 8px;line-height: 1.1;}
#slides .slides_container div{width: 720px;height:430px;}
#slides .slides_container p{font-size: 1.3em;margin-bottom: 16px;}
#slides .slides_container li{list-style: none;}
#slides .slidesnav{ text-indent: -99999px; display: block; height: 23px; width: 14px; position: absolute; top: 50%; }
#slides .prev{ background: url(img/arrow_back.png) no-repeat top left transparent;left: 0;}
#slides .next{ background: url(img/arrow_back.png) no-repeat top right transparent;right:0;}
#slides .prev:hover{ background-position:bottom left; }
#slides .next:hover{ background-position:bottom right; }
#slides .slides_container .cta{ float: none; text-align: center; display: block; margin-bottom: 20px; text-transform: uppercase; font-family: FuturaBT-Bold; font-size: 1.5em; }
#slides .slides_container .links{ padding: 0; text-transform: uppercase;}
#slides .slides_container .links li{ display: inline-block; vertical-align: middle; position: relative; width: 120px; height: 49px; padding: 0 9px;  border-right: 2px solid #dbd8c7; }
#slides .slides_container .links li{ *display: inline }
#slides .slides_container .links li:last-child,
#slides .slides_container .links li.last{border-right: none;}
#slides .slides_container .links a { display: block; vertical-align: middle; padding-bottom: 5px; }
#slides .slides_container .links a:hover { border-bottom: 2px solid #dbd8c7; padding-bottom: 3px; }
#slides .slides_container .links a:hover:after { content: url(img/arrow_down.png); position: absolute; left: 45%; top: 50px; }

/* partners */
.partners { float:left; text-align: center; width:840px; position: relative;padding:35px 0; margin:0 auto 175px auto; }
.partners li { list-style: none; display: inline-block; zoom:1; vertical-align: middle; padding: 0 40px 20px 0; }
.partners li { *display: inline; }
.partners li.end {margin-right:0;}
.partners figcaption{display: none;position: absolute; top: 245px; width:406px; left:50%;  margin-left:-203px;}
.partners figcaption a {display:block; margin-top:5px} 
.partners img{
	display: block;
	-webkit-transition: all 0.1s ease-in-out;
	-moz-transition: all 0.1s ease-in-out;
	-o-transition: all 0.1s ease-in-out;
	transition: all 0.1s ease-in-out;
	background: transparent;
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startcolorstr=#00ffffff,endcolorstr=#00ffffff)"; /* IE8 */   
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);   /* IE6 & 7 */      
    zoom: 1;
}
.partners li.hover{cursor: pointer;}
.partners li.sticky figcaption,
.partners li.hover figcaption{display:block;}
.partners li.off figcaption{display: none;}

#companies {overflow:hidden; height:390px; position:relative}
#companies .slides_container{width: 840px;height: 340px; margin: 0 auto; padding: 0 30px 40px 30px; overflow: hidden;}
#companies .slides_container .partners{width: 840px;height:430px;}
#companies .slidesnav{ text-indent: -99999px; display: block; height: 23px; width: 14px; position: absolute; top: 30%;}
#companies .prev,#companies .next{opacity:0;}
.lt-ie9 #companies .prev, .lt-ie9 #companies .next{opacity:1;}
#companies:hover .prev, #companies:hover .next{opacity:1;}
#companies .prev{ background: url(img/arrow_back.png) no-repeat top left transparent;left: 0;}
#companies .next{ background: url(img/arrow_back.png) no-repeat top right transparent;right:0;}
#companies .prev:hover{ background-position:bottom left; }
#companies .next:hover{ background-position:bottom right; }

#companies  .screen-reader-text, 
#companies  .screen-reader-text { position: absolute;top: -9999px;left: -9999px; }
#companies  .feed-prev:before{ font-family: "TCIO"; content: "\71"; speak:none; font-size: 2.4em; }
#companies  .feed-next:before{ font-family: "TCIO"; content: "\77"; speak:none; font-size: 2.4em; }
.lt-ie8 #companies .feed-prev {display:block; background:url(img/prev.png) top left no-repeat;width:10px;height:16px;bottom:30px;}
.lt-ie8 #companies  .feed-next {display:block; background:url(img/next.png) top left no-repeat;width:10px;height:16px;bottom:30px;}


/* blog/feed */
#feed { clear: both; width: 958px; border-right: 2px solid rgba(0, 0, 0, .05); height: 187px; overflow-x: scroll; overflow-y: hidden; margin: 0 0 75px; }
#feed:focus { outline:none; }
#feed ul { margin:0; padding:0; }
#feed li { float: left; vertical-align: top; width: 218px; height: 159px; padding: 24px 10px 0; list-style: none; border: 2px solid rgba(0, 0, 0, .05); *border: 2px solid #b1af99; border-right: none; }
#feed .tweet { color: #007794;}
#feed .blog { color:#000;}
#feed h4 { color:inherit;font-family: FuturaBT-Bold;text-transform: uppercase;font-size: 1em;}
#feed a { color:inherit;}
#feed .jspHorizontalBar { display:none; }
#feed .feed-next,
#feed .feed-prev { position: absolute; bottom:0; right:0; font-size:11px; text-decoration:none; color:#606060 }
#feed .feed-next:hover,
#feed .feed-prev:hover { color:#c53f48; }
#feed .feed-prev { right:75px; }

#feed .screen-reader-text, 
#feed .screen-reader-text { position: absolute;top: -9999px;left: -9999px; }
#feed .feed-prev:before{ font-family: "TCIO"; content: "\71"; speak:none; font-size: 2.4em; }
#feed .feed-next:before{ font-family: "TCIO"; content: "\77"; speak:none; font-size: 2.4em; }
.lt-ie8 #feed .feed-prev {display:block; background:url(img/prev.png) top left no-repeat;width:10px;height:16px;bottom:30px;}
.lt-ie8 #feed .feed-next {display:block; background:url(img/next.png) top left no-repeat;width:10px;height:16px;bottom:30px;}


.cta { text-align: right; float: none;}
.cta a { text-transform: uppercase; font-weight:bold; line-height:1; }

#haveyoursay form { width: 420px; margin: 0 auto;  }
#haveyoursay form label { font-size: 18px; text-transform: uppercase; padding: 6px 0 20px; width: 120px; float: left; clear: left; }
#haveyoursay form .text, 
#haveyoursay form textarea { box-shadow: 0 0 12px #999 inset; -webkit-box-shadow: 0 0 12px #999 inset; -moz-box-shadow: 0 0 12px #999 inset; float:left; width:300px; font-size:18px; border: none; padding: 4px 3px; height: auto; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
#haveyoursay form textarea { height: 120px; margin: 0 0 20px; font-family: "FuturaBT-Book", sans-serif; }
#haveyoursay form .submit { clear:both; line-height: 1; font-size: 18px; font-family: "FuturaBT-Book", sans-serif; float: right; padding: 15px 20px 12px; background: 0; height: auto; border: 1px solid #3F3F3F; color: #3F3F3F; text-transform: uppercase; }
#haveyoursay form .submit:hover { border-color:#C53F48; color:#C53F48; }

#whatwedo { position: relative; }
#whatwedo .numbered { height:350px;margin:0;padding: 20px 0 0 0;counter-reset:li;position: relative;}
#whatwedo .numbered .trigger { position: relative; padding: 30px 25px 0; color:#5E5E5E; height: 61px; }
#whatwedo .numbered li { float:left; vertical-align: top; height:123px; width: 236px; list-style: none; text-align: center; text-transform: uppercase; border-left: 2px solid #d3d3d3; }
#whatwedo .numbered li:last-child,
#whatwedo .numbered li.last { border-right: 2px solid #d3d3d3;width: 240px; }
#whatwedo .numbered .trigger:hover,
#whatwedo .cases a:hover{ color: #000; }
#whatwedo .numbered .trigger:before{
	content: counter(li);
	counter-increment: li;
	position: absolute;
	left: -18px;
	top: 0px;
	line-height: 1;
	background: #d3d3d3;
	color: #959595;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	padding: 10px 13px;
}
#whatwedo .numbered .trigger:hover:before,
#whatwedo .numbered li:hover .trigger:before,
#whatwedo .numbered .selected .trigger:before { background: #000;color:#fff;cursor: pointer; }
#whatwedo .numbered li:hover,
#whatwedo .numbered .selected{ border-left-color: #000;}
#whatwedo .numbered li:last-child:hover,
#whatwedo .numbered li.last.hover{ border-right-color: #000;}
#whatwedo .numbered a { display: block; }
#whatwedo .numbered .more{ display: none; width: 100%; position: absolute; left:0; top: 178px; }
#whatwedo .numbered .selected .more {display: block;}
#whatwedo .numbered .description{width: 40%;text-align: left; float:left; }
#whatwedo .numbered .description h3 { font-size:18px; margin:0 0 20px; }
#whatwedo .numbered .contacts{padding:0; float:left;}
#whatwedo .numbered .contact{ white-space:nowrap;list-style: none; border: none; height: auto; margin: 0 0 10px; width: auto; text-align: left; }
#whatwedo .numbered .contact:last-child{border:none;width: auto;}
#whatwedo .numbered .contact a { font-size: 14px; padding: 10px 10px 7px; }
#whatwedo .numbered .cases { position: absolute; right: 0; top: 25px; }
#whatwedo .numbered .cases li:last-child { border-right:none; }
#whatwedo .numbered .cases li{ position: relative; border-left:none; text-align: center; height:89px; border-right: 2px solid rgb(0, 0, 0); border-right: 2px solid rgba(0, 0, 0, .05); }
#whatwedo .numbered .cases li:before{content: none;}
#whatwedo .description p{text-transform: none;}
#whatwedo .cases a{ display: block;text-transform: none;padding: 8% 20px;text-decoration: none; margin:0 20px;}
#whatwedo .cases a:hover { color:#c53f48; }
#whatwedo .cases .title{text-transform: uppercase;}
#whatwedo .cases a span,
#whatwedo .case-information h3 span{display: block;}
#whatwedo .cases li a:hover:after{ content: "\77"; position: absolute; top: 32%; right: 0; font-family: "TCIO"; font-size: 2em; } 

#whatwedo .cases li a:after{ color: #606060; content: "\77"; position: absolute; top: 32%; right: 0; font-family: "TCIO"; font-size: 2em; } 

.lt-ie8 .cases li a {display:block; background:url(img/next.png) center right no-repeat;}

#whatwedo .cases .case { display: none;}
                                                     
#case-placeholder { display: none; position: absolute; left: 1060px; top: 202px; width: 100%; }
#case-placeholder .casenumber{font-size: 1rem;}
#case-placeholder .title{font-size: 2.3rem;text-transform: uppercase;}
#case-placeholder h3 { text-align: center; margin-bottom: 70px; }
#case-placeholder h4 { font-size:1em; color:#5e5e5e; margin:0 0 25px 318px; text-transform: uppercase; }
#case-placeholder figure { display: inline-block; margin-right: 29px; }
#case-placeholder figure { *display: inline; }
#case-placeholder .photo:after { content: url(img/photo_shadow.small.png); }
#case-placeholder figure img { width: 276px; height: 174px; margin-bottom: 22px; }
#case-placeholder article { height:300px; display: inline-block; width: 620px; vertical-align: top; overflow: auto; }
#case-placeholder article { *display: inline; }
#case-placeholder .back { text-indent: -9999px; display: inline-block; text-decoration: none; }
#case-placeholder .back { *display: inline; }
#case-placeholder .back:after{ content: "\71"; font-family: "TCIO"; font-size: 3em; position: absolute; top: 4%; text-indent: 9999px; }
.lt-ie8 #case-placeholder .back {display:block; background:url(img/prev.png) top left no-repeat;}
#case-placeholder .case-col1 { float:left; width:290px; }
#case-placeholder .case-col2 { float:right; width:290px; padding-right:10px; }

#events-list { position: relative; width: 480px; height:475px; overflow: hidden; }
#events-list ul { width: 340px;margin-left: 77px; }
#events-list .date { left: -97px;top: 10px;position: absolute; }
#events-list .date span { display: block;}
#events-list .weekday { text-transform: uppercase;}
#events-list li{ list-style: none; position: relative; padding: 10px 0; border-bottom: 2px solid #3f3f3f; }
#events-list a{}
#events-list h4{text-transform: uppercase;}
#events-list li:hover:after,
#events-list .selected:after{ content: "\77"; position: absolute; top: 31%; right: -40px; font-family: "TCIO"; font-size: 2.2em; }
#events-list li a:hover,
#events-list li a:hover h4 { color:#c53f48;}
#events-list li a.selected,
#events-list li a.selected h4 { color:#c53f48;}
#events tbody { width: 260px;vertical-align: top;}
#events th { font-weight: normal;text-align: left;width: 58px;}
#events-list .more { display: none; width: 300px; position: absolute; left: 384px; top: 0; }
#events-list .selected .more{display: block;}
#events-list .more .cta { display: inline-block; zoom:1; vertical-align: top; margin: 0 10px 0 -3px; padding: 20px 27px; opacity: 0.5; border:2px solid #3f3f3f; text-transform: uppercase; }
#events-list .more .cta { *display: inline; }
#events-list .more .cta:hover { opacity: 1;}
#events a.button {margin-bottom:15px}
#event-placeholder{
	position: absolute;
	top: 213px;
	right: 100px;
	width: 338px;
}
#event-placeholder a { line-height: 1; font-size: 18px; font-family: "FuturaBT-Book", sans-serif; padding: 15px 20px 12px; border: 1px solid #3F3F3F; color: #3F3F3F; text-transform: uppercase; float: left; }
#event-placeholder a:hover { border-color:#C53F48; color:#C53F48; }
#event-placeholder table{  margin: 20px 0; }
#events .placeholder h4 { text-transform: uppercase;}   
.photo{position: relative;}
.photo:after{
	content: url(img/photo_shadow.png);
	position: absolute;
	bottom: -4px;
	left:6px;
}
.photo img{border:5px solid #fff;margin-bottom: 30px;}


#recenthighlights.loading #rh-overflow { background:0; }
#recenthighlights h2 { margin:0; }
#rh-overflow {  width:100%; position: relative; overflow: auto; background:url(img/highlights-bg.png) center 7px no-repeat; }
#rh-overflow:focus { outline:none; }
#rh-overflow .jspContainer { height:450px !important; overflow: hidden; position: relative; }
#rh-scroller { height:450px; position: relative; }
#recenthighlights dl { padding:6px 0; float: left; margin: 0 20px; width: 200px; position: relative; }
#recenthighlights dl dt { 
	background: #9A988C;
	color: white;
	font-size: 12px;
	text-transform: uppercase;
	border-radius: 100px;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	margin: 0 0 13px 20px;
	width: 30px;
	text-align: center;
	padding: 11px 10px; 
}
#recenthighlights dl dd { margin: 0 0 10px; list-style-type: disc; list-style-position: inside; padding: 0 0 0 17px; background: url(img/highlights-bullet.jpg) left center no-repeat; }
#recenthighlights dl .more{  display: none;  }
#recenthighlights dl dd p a:after {
	color:#9A988C;
	font-family: "TCIO";
	content: "w";
	speak: none;
	font-size: 1.2em;
	position: absolute;
	right:0;
	bottom: 50%;
}
.lt-ie8 #recenthighlights dl dd p a {display: block;background: url(img/next.png) right 40% no-repeat;padding-right: 20px;}
.lt-ie8 #recenthighlights .jspVerticalBar{display:none;}
#recenthighlights dl dd p { position: relative; margin: 0; padding: 0 30px 10px 0; line-height: 1;background: url(img/highlights-border.jpg) bottom left no-repeat;  }
#recenthighlights dl dd.last p { background:0; padding:0 30px 0 0; }
#recenthighlights .hr-next,
#recenthighlights .hr-prev { position: absolute; bottom:10px; right:0; font-size:11px; text-decoration:none; color:#606060 }
#recenthighlights .hr-next:hover,
#recenthighlights .hr-prev:hover { color:#c53f48; }
#recenthighlights .hr-prev { right:75px; }

#highlights-placeholder { display: none; position: absolute; left: 1060px; top: 202px; width: 100%; }
#highlights-placeholder .content { position: relative; width: 550px; margin: 0 auto; padding: 0 0 0 70px; }
#highlights-placeholder .back { text-indent: -9999px; display: inline-block; text-decoration: none; }
#highlights-placeholder .back { *display: inline; }
#highlights-placeholder .back:after{ content: "\71"; font-family: TCIO; font-size: 2em; position: absolute; top: 4%; text-indent: 9999px; }
.lt-ie8 #highlights-placeholder .back {display:block; background:url(img/prev.png) top left no-repeat;}

#highlights-placeholder .date {
	background: #9A988C;
	color: white;
	font-size: 12px;
	text-transform: uppercase;
	border-radius: 100px;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	margin: 0;
	width: 30px;
	text-align: center;
	padding: 11px 10px;
	position: absolute;
	left: 0;
	top: 0;
}

/*#contact { background:url(img/contact.png) center 0 no-repeat; }*/
#contact form input,
#contact form select,
#contact form textarea{ font-family: FuturaBT-Book; }

#contact input:focus,
#contact select:focus,
#contact textarea:focus{ outline: auto 5px #c53f48; }
#contact .contact-intro { float:left; width:32%; }
#contact .form-container { float:right; width:50%; }
#contact form legend { font-size:24px; padding:0 0 25px; text-transform:uppercase; }
#contact form fieldset { margin:0 0 25px; }
#contact form label { font-size: 14px; text-transform: uppercase; padding: 8px 0; width: 200px; clear:both; float:left; } 
#contact form input.text,
#contact form textarea { width:274px; margin:0 0 10px; float:left;  } 
#contact form input[type=text],
#contact form input[type=email],
#contact form textarea{
	box-shadow: 0 0 12px #CCC inset; -webkit-box-shadow: 0 0 12px #CCC inset; -moz-box-shadow: 0 0 12px #CCC inset;
	border: none;
	padding: 7px 7px 3px;
	height:auto;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
#contact form select{
	float:left;
	height: auto;
	border: none;
	box-shadow: 0 0 12px #ccc inset;
	-webkit-box-shadow: 0 0 12px #ccc inset;
	-moz-box-shadow: 0 0 12px #ccc inset;
	width: 275px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding: 5px 10px;
}
#contact form textarea { height: 120px; margin: 0 0 20px; width: 480px; font-family: "FuturaBT-Book", sans-serif; } 
#contact form .submit { line-height: 1; font-size: 18px; font-family: "FuturaBT-Book", sans-serif; float:right; padding:15px 20px 12px; background:0; height:auto; border:1px solid #3F3F3F; color:#3F3F3F; text-transform:uppercase;  } 
#contact form .submit:hover { border-color:#C53F48; color:#C53F48; }

#team-grid { left:0; position: relative; list-style:none; margin:0; padding:0; }
#team-grid li { float: left; margin: 0 26px 26px 0; width: 220px; position: relative; height: 150px; background: no-repeat top left; }
#team-grid li.last {margin-right:0; }
#team-grid li a.team-link { display: block; height: 100%; text-decoration: none; }
#team-grid li a.team-link h4 { background: rgba(0, 0, 0, 0.5); color: white; font-size: 14px; font-weight: 200; line-height: 1; padding: 5px 10px; position: relative;text-transform: uppercase; top: 126px; width: 200px; } 
.lt-ie9 #team-grid li a.team-link h4 { background:#000; }
#team-grid li a.team-link:hover h4 { background: #000;  }
#team-grid li .person { display: none; }

#team-placeholder { display: none; position: absolute; left: 1060px; top: 202px; width: 100%; }
#team-placeholder .back { background: url(img/slide.left.png) no-repeat top left; float: left; text-indent: -9999px; width: 14px; height: 24px; margin: 0 20px 0 0; }
#team-placeholder img { float:left; margin:0 20px 0 0; }
#team-placeholder figcaption { float: left; width: 400px; }
#team-placeholder h3 { margin:0 0 5px; font-size:18px; }
#team-placeholder h4 { margin:0 0 20px; font-size:14px; }

#team-placeholder .email,
#team-placeholder .linkedin,
#team-placeholder .twitter,
#recenthighlights .hr-next,
#recenthighlights .hr-prev {display: inline-block; position: relative; }

#recenthighlights .hr-next,
#recenthighlights .hr-prev { position: absolute; }
#team-placeholder .email,
#team-placeholder .linkedin,
#team-placeholder .twitter,
#recenthighlights .hr-next,
#recenthighlights .hr-prev { *display: inline; }

#team-placeholder .email:hover:before,
#team-placeholder .linkedin:hover:before,
#team-placeholder .twitter:hover:before { color:#C53F48; }

#team-placeholder .screen-reader-text,
#recenthighlights .screen-reader-text{position: absolute;top: -9999px;left: -9999px;}
#recenthighlights .hr-prev:before { font-family: "TCIO"; content: "\71"; speak:none; font-size: 2.4em;}
#recenthighlights .hr-next:before {font-family: "TCIO"; content: "\77"; speak:none; font-size: 2.4em; }

.lt-ie8 #recenthighlights .hr-prev {display:block; background:url(img/prev.png) top left no-repeat;}
.lt-ie8 #recenthighlights .hr-next {display:block; background:url(img/next.png) top left no-repeat;}

#team-placeholder .email:before,
#team-placeholder .linkedin:before,
#team-placeholder .twitter:before { font-family:"TCIO"; content: "\6d"; color:#7D7D7D; font-size: 1.7em; margin:0 5px 0 0; }

#team-placeholder .email:before	 { content: "\6d"; }
#team-placeholder .linkedin:before { content: "\69"; }
#team-placeholder .twitter:before { content: "\74"; }

/* Latest News and Blog pages */

#blog, #news, #page {  border-top: none; }
#blog .post-content p, #news .post-content p{  line-height: 1.6em; }
#blog h2, #news h2{   text-align: left;  }
.posts{  width: 640px; float: left; }
.posts article{   border-top: 2px solid #000; padding-top: 20px; margin: 0 0 20px; }
.posts article:first-child{   border-top: none; padding-top: 0; }
.posts article .post-header{  border-bottom: 2px solid #e2e2e2; margin: 0 0 20px; padding: 0 0 20px; position: relative;}
.posts article h3{   width: 550px; float: left; }
.posts article .post-header .post-date{  float: left; width: 90px;  }
.posts article .post-header .post-date span{   display: block; }
.posts article .post-header .post-date span.weekday{  font-size: 1.2em; text-transform: uppercase;  }
.posts article .post-header a.comment-count{ display: block; position: absolute; bottom: -60px; width: 38px; height: 23px; background: url('img/comment_count_bg.png') no-repeat 0 0; color: #fff; padding: 7px 0; text-align: center; text-decoration: none; }
.posts article .post-header a.comment-count:hover{ color: #fff; background-position: 0 -37px; }
.posts article .post-content{  padding: 0 0 0 90px; }
.posts article .post-content a.read-more{  text-transform: uppercase; font-size: .9em; }

#comments{   border-top: 2px solid #000; }
#comments h4{  font-size: 2em; text-transform: uppercase; border-bottom: 2px solid #E2E2E2; padding: 30px 0 10px 90px; }
#comments ol, #comments ol li{  list-style: none; padding: 0; margin: 0; }
#comments ol li{ margin: 0 0 20px 0; border-bottom: 2px solid #E2E2E2; padding: 10px 0 10px 90px; }
#comments .commentmetadata a{  color: #999; font-size: .9em; }
#comments .commentmetadata{  margin: 0 0 10px 0; }

#respond h4{  font-size: 2em; text-transform: uppercase; border-bottom: 2px solid #000; padding: 30px 0 10px 90px; }
#respond form#commentform{  padding: 10px 0 10px 90px; }
#respond textarea, #respond input[type=text]{ margin: 10px 0; box-shadow: 0 0 12px #999 inset; -webkit-box-shadow: 0 0 12px #999 inset; -moz-box-shadow: 0 0 12px #999 inset; width:300px; font-size:18px; border: none; padding: 4px 3px; height: auto; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; width: 382px; }
#respond label{  margin: 15px 0; width: 100px; float: left; }
#respond #submit{   line-height: 1; font-size: 14px; font-family: "FuturaBT-Book", sans-serif; padding:15px 20px 12px; background:0; height:auto; border:1px solid #3F3F3F; color:#3F3F3F; text-transform:uppercase; margin-left: 100px; } 
#respond #submit:hover { border-color:#C53F48; color:#C53F48; }
a.post-edit-link{ position: absolute; bottom: -2px; right: 0; background: #E2E2E2; padding: 6px 8px; text-transform: uppercase; font-size: .8em; font-weight: bold; text-align: center; }
a.post-edit-link:hover{  background: #000; color: #fff; }

.single h2{   margin-bottom: 40px; }
.single a.back{ display: block; width: 14px; height: 23px; background: url("img/arrow_back.png") no-repeat 0 0; margin-bottom: 35px; }
.single a.back:hover{  background-position: 0 -23px;  }

.posts ul.page-numbers{  list-style: none; padding: 0; margin: 20px 0; float: left; }
.posts ul.page-numbers li{ float: left; margin: 0 10px 0 0;  }
.posts ul.page-numbers li a, .posts ul.page-numbers li span { padding: 9px 0; background: url('img/article_pagination_bg.png') no-repeat 0 0; width: 33px; height: 15px; color: white; font-size: 1.2em; display: block; text-align: center; text-decoration: none; }
.posts ul.page-numbers li span, .posts ul.page-numbers a:hover{  background-position: 0 -33px; }
.posts ul.page-numbers li span.dots{   background: none; color: #000; }

.aside{  width: 240px; float: right; }
.aside ul{   margin: 0; padding: 0; }
.aside li{  list-style: none; margin: 0; padding: 0; }
.aside ul.widgets > li{  border-top: 2px solid #000; padding: 20px 0 0; margin: 0 0 20px; }
.aside ul.widgets > li:first-child{  border-top: none; }
.aside ul > li > ul{   margin: 20px 0; }
.aside ul > li > ul li{   margin: 0 0 5px; }
.aside ul > li > ul li a{ display: block; }
.aside ul#rssfeeds li a{ background: url('img/rss_li_bg.png') no-repeat 0 0; height: 17px; padding: 2px 0 0 30px; }
.aside ul#rssfeeds li a:hover{   background-position: 0 -19px; }
.aside ul#recentposts li{  border-top: 1px solid #e2e2e2; padding-top: 5px;  }
.aside ul#recentposts li:first-child{  border-top: none; padding-top: 0; }

footer { background:#000; }
footer .wrapper { padding:40px 0 60px; background: url(img/ukti.jpg) no-repeat right 30px; color:#fff; }
footer #mobile-links { display: none; }
footer nav { float:left; }
footer nav li { float:left; }
footer nav li a { display: block; font-size: 16px; padding: 5px 20px 5px 0; text-decoration: none; color: #7D7D7D; }
footer nav li a:hover { color:#fff; }
#FSContact1 {font-weight:bold}

/* IE7 fixes */


/* CLASSES */

a.button{ line-height: 1; font-size: 18px; font-family: "FuturaBT-Book", sans-serif; float:left; padding:15px 20px 12px; background:0; height:auto; border:1px solid #3F3F3F; color:#3F3F3F; text-transform:uppercase; margin-right:20px } 
a.button:hover { border-color:#C53F48; color:#C53F48; }

/* Alignment */
.alignleft {
	display: inline;
	float: left;
	margin-right: 1.625em;
}
.alignright {
	display: inline;
	float: right;
	margin-left: 1.625em;
}
.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/* -------------------- MEDIA QUERIES -------------------- */

@media all and (max-width: 768px) and (orientation: portrait) {
    .wrapper, header .main { width:728px; padding-left:20px; padding-right:20px; }
    header h1.ir { width: 228px; height: 77px; background-size: contain; }
    nav #menu-header li a { font-size:14px; }
    #slides .slides_container,
    #companies .slides_container { width:668px; }
    #companies .prev,#companies .next{opacity:1;}
    #slides .slides_container div,
    #companies .slides_container .partners { width:668px; }
    #companies .partners li{padding-right:25px;}
    #companies .partners img{max-width: 84px;height:auto;}
    #feed { width:726px; }
    #whatwedo .numbered li { width:179px; }
    #whatwedo .numbered li:last-child { width:179px; }
    #case-placeholder article { width:409px; }
    #case-placeholder .case-col1,
    #case-placeholder .case-col2 { width:185px; }
    #rh-overflow { background-position:center 26px; }
    #events-list { width:320px; }
    #events-list ul{width:215px;}
    #event-placeholder{right: 45px;}
    #team-grid li { width: 162px; height: 111px; background-size:contain; }
    #team-grid li a.team-link h4 { width: 142px; top: 86px; }
    #team-placeholder figcaption { width:260px; }
    #contact form label { width:150px; }
    #contact form input.text, 
    #contact form textarea { width:194px; }
    #contact form select { width:194px; }
    #contact form textarea {  width: 343px; }
}
/* Retina */
@media (orientation:portrait) and (-webkit-min-device-pixel-ratio: 2), (orientation:portrait) and (min-device-pixel-ratio: 2){
	header h1.ir{width: 252px; height: 77px; background-image: url('img/header_logo.x2.png'); float: left; }
}
/* =============================================================================
	 Non-semantic helper classes
	 Please define your styles before this section.
	 ========================================================================== */

.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
.ir br { display: none; }
.hidden { display: none; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

/* =============================================================================
	 Print styles.
	 Inlined to avoid required HTTP connection: www.phpied.com/delay-loading-your-print-css/
	 ========================================================================== */
 
@media print {
	* { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: sanbeiji.com/archives/953 */
	a, a:visited { color: #444 !important; text-decoration: underline; }
	a[href]:after { content: " (" attr(href) ")"; }
	abbr[title]:after { content: " (" attr(title) ")"; }
	.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
	pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
	thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */
	tr, img { page-break-inside: avoid; }
	img { max-width: 100% !important; }
	@page { margin: 0.5cm; }
	p, h2, h3 { orphans: 3; widows: 3; }
	h2, h3{ page-break-after: avoid; }
}