@charset "UTF-8";

/*
Author: Peter Barr	
Project: Refresh
Updated: 26/03/12
*/

/* 
# Colour reference ###################
	
	dark grey: #10151b;
	vibrant green: #c1d72e;
	link green: #9FAD00;
	
*/

/* 
# Notes ##############################
	
	The People section currently removed for redesign
	
*/


html { overflow-y: scroll; width:100%; height:100%; } 
body { position:relative; color:#6a6f77; font-family: Helvetica, Arial, sans-serif; font-size:12px; width:100%; height:100%; }
img { -ms-interpolation-mode: bicubic; } /* IE IMAGE SMOOTHING FIX */
a { text-decoration:none; }
p { line-height:18px; margin: 0 0 15px 0; }
#noscript{ position:absolute; top:60px; left:0; width:100%; background:#10151b;  color:#fff; font-size:12px;}
#noscript h3 { font-size:18px; margin:40px 40px 10px 58px;; font-family: Helvetica, Arial, sans-serif;}
#noscript p { margin:10px 40px 10px 60px; }
#noscript ul { padding-bottom:20px; }
#noscript li { margin:10px 40px 5px 60px; }
#noscript a{ color:#c1d72e;}

/*
# FONTS ############################################################################################################################################################
*/

h1, h2, h3, #container #refresh_is #people p.name, #controls li a, #refresh_is #refresh_header, .news_header, .details .name, .details .title, #container #brands p, .circle_btn, #footer #followUs, #login { font-family:Georgia, "Times New Roman", Times, serif; }
#news h2, #brands h3, h3#offeringsTitle , #heads h3 {margin:25px 0px 35px 0px; border-top: 6px solid #fdb814; border-bottom:1px solid #f3f3f3; padding:25px 0px 25px 0px; text-align:center; font-weight:normal; font-size:18px;}
#work h2, #murray_creative_is h2, #contact_us h2 { font-size:17px; line-height:26px; color:#FFF; font-weight:bold; text-transform:uppercase; background-color: #fdb814; height:33px; /*text-align:center; border:1px solid #cfd0d1; border-left:none; border-right:none;*/ padding:8px 0px 0px 55px; margin:0px 0px 30px 0px; }

/*
# RESIZED ELEMENTS #################################################################################################################################################
*/

/* main small */
.small #portfolio_grid, .small #container #work #workFilter, .small #container #contact_us #contact_container #inner, /*.small #container #refresh_is #about_us,*/ #digitalOfferings, .small #digitalOfferings, #heads, .small #heads, #container #brands, .small #container #brands, #news, .small #news, .news_item_container, .small .news_item_container { width:962px; }
/* main medium */
.medium #portfolio_grid, .medium #container #work #workFilter, .medium #container #contact_us #contact_container #inner, /*.medium #container #refresh_is #about_us*/.medium #digitalOfferings, .medium #heads, .medium #container #brands, .medium #news, .medium .news_item_container { width:1230px; }
/* main large */
.large #portfolio_grid, .large #container #work #workFilter, .large #container #contact_us #contact_container #inner, /*.large #container #refresh_is #about_us*/.large #digitalOfferings, .large #heads, .large #container #brands, .large #news, .large .news_item_container { width:1470px; }


/* specific resized elements */

#home #slider li, .small #home #slider, .small #home #slider li{ height:406px; }
.medium #home #slider, .medium #home #slider li{ height:519px; }
.large #home #slider, .large #home #slider li{ height:620px; }

#slider li .slideImage, .small #slider li .slideImage{position:absolute; left:50%; margin-left:-524px;}
.medium #slider li .slideImage{position:absolute; left:50%; margin-left:-669.5px;}
.large #slider li .slideImage{position:absolute; left:50%; margin-left:-800px;}

#sliderContainer/*, .small #sliderContainer .bx-wrapper*/{height:406px;}
/*.medium #sliderContainer .bx-wrapper{height:519px;}
.large #sliderContainer .bx-wrapper{height:620px; }*/

#slider li img, .small #slider li img { width:1048px; height:406px; }
.medium #slider li img { width:1339px; height:519px; }
.large #slider li img { width:1600px; height:620px; }

#slider li, .small #slider li { /*background-size:contain;*/ background-size:92px 406px;  }
.medium #slider li { background-size:117px 519px; }
.large #slider li { background-size:140px 620px; }

#home h1, .small #home h1 { font-size:18px; line-height:22px; width: 640px;}
.medium #home h1 { font-size:22px; line-height:26px; width: 749px;}
.large #home h1 { font-size:24px; line-height:32px; width: 850px;}

.small .grid_item {width:230px; font-size:12px;}
.medium .grid_item {width:297px; font-size:14px;}
.large .grid_item {width:357px; font-size:16px;}

.small .grid_item IMG {width:230px; height:182px;}
.medium .grid_item IMG {width:297px; height:235px;}
.large .grid_item IMG {width:357px; height:282px;}

.news_item_container li, .small #news_item_container li { width:210px; }
.medium .news_item_container li { width:277px; }
.large .news_item_container li { width:337px; }

#news .tweet, .small #news .tweet { width:389px; }
.medium #news .tweet { width:523px; }
.large #news .tweet { width:643px; }
#news .circle_btn, .small #news .circle_btn { left:435px; top:0px; }
.medium #news .circle_btn { left:569px; top:0px; }
.large #news .circle_btn { left:690px; top:0px; }

.small #portfolio #prev, .small #portfolio #next { top: 178px; }
.medium #portfolio #prev, .medium #portfolio #next { top: 230px; }
.large #portfolio #prev, .large #portfolio #next { top: 282px; }

ul#first_brands, .small #first_brands { width:800px; }
.medium #first_brands { width:1000px; }
.large #first_brands { width:1000px; }

#contact_form, .small #contact_form { width:422px;}
.medium #contact_form { width:690px; }
.large #contact_form { width:930px; }

#contact_us #contact_container, .small #contact_us #contact_container, { width:962px; }
.small #contentWrapper, .small #blogWrapper { width:760px; }
.medium #contact_us #contact_container, #contentWrapper, #blogWrapper { width:1230px; }
.large #contact_us #contact_container { width:1470px; }

#contact_us #contact_container #contactFormRight textarea, .small #contact_us #contact_container #contactFormRight textarea { width:275px; }
.medium #contact_us #contact_container #contactFormRight textarea { width:299px; }
.large #contact_us #contact_container #contactFormRight textarea { width:539px; }

#contact_form div.error, .small #contact_form div.error { width:275px; }
.medium #contact_form div.error { width:299px; }
.large #contact_form div.error { width:539px; }

/*
#pageContent, .small #pageContent { width:232px; margin:50px 0px 0px 30px; }
.medium #pageContent { width:385px; }
.large #pageContent { width:625px; }
*/

.small .workSlider { float:right; width:700px; height:500px; position:relative; overflow:visible;}
.small .pager { right:15px;  }

/*
# MAIN ELEMENTS #######################################################################################################################################
*/

#container { width:100%; height:100%; position:relative; }
#loader { position:absolute; top:20px; right:20px; z-index:900;}
#content { background:#ffffff; position:relative; /*height:100%;*/} /* putting a display:none here breaks scrollSpy!!!!!!!!!!! */
#contentOverlay { position:fixed; width:100%; height:100%; background-color:#ffffff; z-index:50; }

/*
# MAIN NAV ############################################################################################################################################
*/

.mc-logo {
	display: block;
	float:left; 
	margin:0px;
	width: 348px;
	height: 60px;
	background: url('../images/mc-logo.png') no-repeat top left;
	background-size: 348px 60px;
	text-indent: -9999px;
}


#container #nav {width:100%; background-color:#10151b; height:60px; position:fixed; z-index:200; top:-60px; left:0px; overflow:hidden;}
/*#container #nav #logo {float:left; margin:0px;}*/
#container #nav p#title { font-size:11px; color:#cecece; line-height:18px; font-weight:700; float:left; padding:0px; margin:29px 99px 0px 0px;}
#container #nav #nav_container { position:absolute; height:60px; display:block; left:400px;}
#container #nav #nav_container #active_tab {position:absolute; top:0px; left:0px;}
#container #nav #nav_container ul {height:60px;}
#container #nav #nav_container ul li {list-style-type:none;float:left; font-family:Helvetica, Arial, sans-serif; font-size:12px; height:60px; line-height:18px; }
#container #nav #nav_container ul li a {position: relative; display:block; color:#f4f4f4; text-decoration:none; padding:22px 20px 0px 20px; margin:0px; height:32px; font-weight:bold; background:none; }  
#container #nav #nav_container ul li a:hover {color:#fcb918;}
#container #nav #nav_container ul li.active a:before { 
	top: 0px;
	left: 50%;
	border: solid transparent;
	content: " ";
	z-index: 10;
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(252, 185, 24, 0);
	border-top-color: #fcb918;
	border-width: 7px;
	margin-left: -7px;
}

/*
# HOME HEADER w/Easy Slider #############################################################################################################################
*/

#container #home {	text-align:center; padding-top:60px;} 
#home h1 { 
	position: relative;
	color:#1e232a; 
	font-weight:normal; 
	padding-top:40px; 
	padding-bottom:15px;  
	margin:0 auto; 
}

#home h1:before {
	top: 0px;
	left: 50%;
	border: solid transparent;
	content: " ";
	z-index: 10;
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(252, 185, 24, 0);
	border-top-color: #fcb918;
	border-width: 15px;
	margin-left: -15px;
}

#container #home p {font-size:18px; line-height:26px; color:#393e44; font-weight:bold; margin:0px; padding:0px;}

#home #slider { height:406px; overflow:hidden; }
#home #slider ul, #slider li{ text-align:center; overflow:hidden; }
#home #slider li { position:relative; background:#ff0000;}
#home #slider li img { display:block; }
#slider ul, #slider li{ margin:0;	padding:0; list-style:none;	}
#slider li{ 
/* 
	define width and height of list item (slide)
	entire slider area will adjust according to the parameters provided here
*/ 
}	
	
/* prev / next controls */
#prevBtn, #nextBtn { display:block; width:30px; height:77px;	position:absolute; left:-30px; top:71px; z-index:1000;	}	
#nextBtn { left:696px;	}														
#prevBtn a, #nextBtn a { display:block; position:relative; width:30px; height:77px; background:url(../images/btn_prev.gif) no-repeat 0 0; }	
#nextBtn a { background:url(../images/btn_next.gif) no-repeat 0 0; }	
	
/* numeric controls */	
#controlNav { background-color: #fdb814; height:50px; }
ol#controls{ margin:0; padding:0; height:48px; display:inline-block; position:relative; }
ol#controls li{ margin:-24px 20px 0 20px; padding:0; float:left; list-style:none; height:28px; line-height:28px; }
ol#controls li a{ 
	float:left; 
	width:47px; 
	height:41px; 
	font-size: 18px;	
	font-weight:bold; 
	font-style:italic; 
	padding-left:1px; 
	padding-top:7px;	
	background-color: #10151b;
	-webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
	/*background: url(../images/sprite-slider-nav.png) 0 0; */
	color:#ffffff; 
	text-decoration:none; 
	border: 2px solid white;
}
ol#controls li.current a, ol#controls li a:hover{ display: block; background-color: #fdb814; color:#fff; }
ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus{ outline:none; }

/*
# HOME NEWS ###########################################################################################################################################
*/

#container #news { padding:0px 0px 0px 0px; position:relative; margin: 0 auto 0 auto; overflow:hidden; clear:both;}
#container #news .news_item_container {margin:0px auto 35px auto; /*width:960px;*/ overflow:auto; list-style:none;}
#container #news .news_item {/*width:210px;*/ margin:0px 15px 0px 15px; text-align:left; float:left;}
#container #news .news_item .date {font-size:12px; color:#b1b5ba; margin:0px 0px 5px 0px; padding:0px;}
#container #news .news_item .news_header { font-size:14px;line-height:18px; color:#10151b; font-weight:bold; margin:0px 0px 10px 0px;}
#container #news .news_item .news_header a {text-decoration:none; color:#10151b; }
#container #news .news_item .news_header a:hover {text-decoration:none; color:#A8C100; }
#container #news .news_item .news_text { font-size:12px; line-height:18px; color:#6a6f77;}
#twitterWrap { position:relative; height:100px;}
#news .circle_btn { position:absolute; }
#news .circle_btn a span { display:block; padding-top:33px; }
.tweet { font-style: italic;  line-height:18px; font-size:12px;}
#news .tweet { display:block; float:right; border-top: 1px solid #f3f3f3; border-bottom: 1px solid #f3f3f3; padding: 25px 15px 15px 30px; overflow:hidden; min-height:55px;}
#news .tweet:first-child { float:left; text-align: right; padding: 25px 30px 15px 15px;}
#news .tweet:first-child img { padding: 0px 0px 0px 10px;}
.tweet p {margin-bottom:8px;}
.tweet a { color:#9fad00; }
#news .tweet a:hover { text-decoration:underline; }
.tweet img { padding: 0px 10px 0px 0px; }
.tweetTime { padding: 0px 30px 0px 30px; background: url(../images/icon-twitter-post.png) no-repeat 0 2px; min-height:17px; margin-top:0px;}
#news .tweet:first-child .tweetTime { background-position: right 2px;}
/*
.tweet.left { text-align:right; padding: 25px 30px 15px 15px;}
.tweet.left img{ padding: 0px 0px 0px 10px; }
*/

/*
# HOME OUR WORK #######################################################################################################################################
*/

#container #work, #container #refresh_is, #container #contact_us  { border-top:solid 60px #ffffff; }

#container #work {width:100%; position:relative; clear:both; }
#container #work #our_work, /*#container #latest,*/ #container #about_refresh, #container #contact {position:absolute; top:-60px; height:1px;}
#container #latest {position:absolute; top:-60px; height:1px;}

#container #work #workFilter { width:640px; margin:0 auto; height:30px; border-bottom: 6px solid #fdb814; }
#container #work UL#work_nav {padding:0 0 0 15px; list-style:none; /* overflow:auto; */ float:left;}
#container #work UL#work_nav li {float:left;}
#container #work UL#work_nav li span{font-size:12px; color:#10151b; text-decoration:none; padding:10px 10px 10px 10px; display:block; color:#4a4f56; cursor:pointer;}
#container #work UL#work_nav li.filter{font-size:14px; color:#10151b; text-decoration:none; font-weight:bold; padding:8px 10px 10px 10px; display:inline-block; color:#4a4f56;}
#container #work UL#work_nav li span:hover { color:#a8c100; }
#container #work UL#work_nav li span.selected { background:url(../images/marker-up.gif) center bottom no-repeat; color:#10151b; } 
#portfolioPager { float:right; margin-top:5px; }
#portfolioPager li{ 
	float:left; 
	list-style:none; 
	width:15px; 
	height:15px; 
	overflow:hidden; 
	text-indent:-9999px; 
	margin-left:5px; 
	cursor:pointer; 
	background-color: #10151b;
	-webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

#portfolioPager li.active, #portfolioPager li:hover{ 
	background-color: #fdb814;
}

/* PORTFOLIO GRID SLIDER */
#portfolio { position:relative; }
#portfolio_grid {padding:0px 0px 20px 0px; margin:0px auto; overflow:hidden; position:relative;} 
#portfolio_slider { position:absolute; top: 0; left:0; -webkit-perspective: 800;}
#portfolio_slider ul { display:inline; float:left; list-style:none; padding-bottom:20px; overflow:hidden; margin-right:14px;}

/* prev / next controls */
#portfolio #prev, #portfolio #next { position:absolute; z-index: 5; width:27px; height:127px; overflow:hidden;  text-indent:-9999px; cursor:pointer;}
#portfolio #prev { left:0px; background:url(../images/portfolioArrowsL.png) 6px 57px no-repeat #10151b; }
#portfolio #next { right:0px; background:url(../images/portfolioArrowsR.png) 8px 57px no-repeat #10151b;}
#portfolio #prev.hover, #portfolio #next.hover  { background-color:#fcb918; }
#portfolio #prev.scrollInactive { background-color:#e3e3e3; }
#portfolio #next.scrollInactive { background-color:#e3e3e3; }

/*#portfolio #prev, #portfolio #next { position:absolute; top: 335px; width:55px; height:55px; overflow:hidden; background:url(../images/sprite-portfolio-nav.png) left top no-repeat; text-indent:-9999px; cursor:pointer;}
#portfolio #prev { left:40px; background-position: 0px -165px;}
#portfolio #next { right:40px; background-position: 0px 0px; }
#portfolio #prev.hover { background-position: 0px -220px; }
#portfolio #next.hover { background-position: 0px -55px; }
#portfolio #prev.scrollInactive { background-position: 0px -275px; cursor:default; }
#portfolio #next.scrollInactive { background-position: 0px -110px; cursor:default; }*/

/* our work grid items */
.projWin { position:relative; }
.proj_details { position:absolute; bottom:0px; height:55px; width: 100%; display:none;}
.projWin span{ background:#10151b; height:55px; width:100%; display:block; position:absolute; z-index:1; top:0;}
.projWin p { position:relative; z-index:2; font-weight:bold; margin: 0px 10px 0px 10px;}

#container #work #portfolio_grid UL LI.grid_item {float:left; margin:18px 14px 0px 0px; list-style:none; text-align:left; font-size:12px; position:relative;}
#container #work #portfolio_grid UL LI.grid_item IMG {margin:0px; padding:0px;}
#container #work #portfolio_grid UL LI.grid_item H3 {color:#10151b; margin:11px 0px 10px 10px; height:25px;}
#container #work #portfolio_grid UL LI.grid_item .client_name {color:#fff; margin-top:11px; }
#container #work #portfolio_grid UL LI.grid_item .project_type {color:#a8c100; font-size:11px; font-weight:normal; height:20px; overflow:hidden; } 
#container #work #portfolio_grid UL LI.grid_item:hover { cursor: pointer; }
.project_link { position:relative; overflow:visible; width:100%; height:31px; overflow:hidden; margin-top:10px;}
#container #work #portfolio_grid UL LI.grid_item .project_link a {height:20px; display:block; border:1px solid #cfd0d1; border-right:none; border-left:none; color:#10151b; text-decoration:none; padding:9px 0px 0px 12px; position:absolute; z-index:2; width:100%;} 
.project_link .link_bg { position:absolute; height:27px; background-color:#10151b; width:0px;  margin-top:2px; z-index:1;}
#container #work #portfolio_grid UL LI.grid_item:nth-child(4n+4) {margin-right:0px;}

/* our work brands */
#container #brands { margin: 0 auto; clear:both; }
#container #brands p {font-size:18px; line-height:26px; color:#393e44; font-weight:bold; margin:30px 0px 30px 0px;}
ul#first_brands { list-style:none; margin:0 auto 0px auto; overflow:auto; padding-bottom:20px;}
ul#first_brands li{	position:relative; perspective: 200; -webkit-perspective: 200; /*-moz-perspective: 200; -o-perspective: 200; -ms-perspective: 200;*/ width:125px; height:95px; float:left; padding-bottom:10px; }
ul#first_brands li div{	width:125px; height:95px; position:absolute; transition: -webkit-transform 0.5s; -webkit-transition: -webkit-transform 0.5s; /*-moz-transition: -webkit-transform 0.5s; -o-webkit-transition: -webkit-transform 0.5s;	-ms-transition: -webkit-transform 0.5s;*/	transform-style: preserve-3d; -webkit-transform-style: preserve-3d; /*-moz-transform-style: preserve-3d; -o-transform-style: preserve-3d;	-ms-transform-style: preserve-3d;*/ }
ul#first_brands li:hover div{ transform: rotateY(180deg); -webkit-transform: rotateY( 180deg ); /*-moz-transform: rotateY( 180deg ); -o-transform: rotateY( 180deg ); -ms-transform: rotateY( 180deg );*/ }
ul#first_brands li img { position:absolute;	display:block; width:125px;	height:95px; backface-visibility: hidden; -webkit-backface-visibility: hidden; /*-moz-backface-visibility: hidden; -o-backface-visibility: hidden; -ms-backface-visibility: hidden;*/ }
ul#first_brands li img.back{ transform: rotateY( 180deg ); -webkit-transform: rotateY( 180deg ); /*-moz-transform: rotateY( 180deg ); -o-transform: rotateY( 180deg ); -ms-transform: rotateY( 180deg );*/ display:none; background: #fff; z-index:1; }
ul#first_brands li img.front{ background: #fff;	z-index:2; }

/* -------------------------------------- END PORTFOLIO BRANDS --------------------------------------- */

/*
# ABOUT REFRESH #######################################################################################################################################
*/

#container #murray_creative_is {margin:0px 0px 0px 0px; padding:0px 0px 10px 0px; position:relative;}
#container #murray_creative_is h2 {margin:0px 0px 40px 0px;}
#container #murray_creative_is #refresh_header {font-size:36px; color:#10151b; text-align:center; text-transform:uppercase; font-weight:bold; line-height:38px; margin:0px 0px 45px 0px;}
#container #murray_creative_is #about_us { background:url(../images/divider.gif) no-repeat center 114px ; width:962px; margin:0px auto; text-align:center; }
#container #murray_creative_is #about_us .inner {width:435px; text-align:center; height:252px;}
#container #murray_creative_is #about_us h3 {font-size:18px; color:#10151b; margin:0px 0px 30px 0px; clear:both;}
#container #murray_creative_is #about_us .inner P { font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:18px; color:#10151b; margin:0px 0px 30px 0px; }
#container #murray_creative_is #about_us #left_inner {float:left}
#container #murray_creative_is #about_us #right_inner {float:right}

/* principals */
#about_us #principals { width:606px; height:245px; text-align:center; margin:0 auto; }
#about_us .rotate3D { position:relative; perspective: 200; -webkit-perspective: 200; width: 182px; height: 245px; float:left; margin:0 10px 0 10px;}
#about_us .rotate3D .front{ position:absolute; display:block; width: 182px; height: 245px; transition: -webkit-transform 0.5s ease-in-out; -webkit-transition: -webkit-transform 0.5s ease-in-out; transform-style: preserve-3d; -webkit-transform-style: preserve-3d; }
#about_us .rotate3D:hover .front{ transform: rotateY(-20deg); -webkit-transform: rotateY( -20deg ); }

/* offerings */
#digitalOfferings { margin:0 auto; }
#container #murray_creative_is #offerings {width:962px; margin:0px auto 0px auto; overflow:hidden;}
#container #murray_creative_is h3#offeringsTitle { margin-bottom:35px; }
#container #murray_creative_is #offerings ul {float:left; list-style:none; margin:0px 18px 0px 18px; width:201px;}
#container #murray_creative_is #offerings ul li { 
	position: relative;
	font-size:12px; 
	line-height:18px; 
	color:#10151b; 
	text-align:left; 
	padding:0px 0px 0px 17px; 
	margin:0px 0px 7px 0px;
}

#container #murray_creative_is #offerings ul li:before {
	position: absolute;
	top: 5px;
	left: 0px;
	content: '';
	width: 6px;
	height: 6px;
	display: block;
	background-color: #fcb918;
	-webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}


/* video player */
#digitalOfferings #video { position:relative; height:0px; display:none; background-color:#fff; overflow:hidden;}
#vidWinButtons { width:100%; height:93px; overflow:hidden; padding-top:20px; }
#digitalOfferings .circle_btn span { display:block; padding-top:33px; }
#videoBtn { margin:0px auto 0 auto; }
#container #refresh_is #about_us #vidWinButtons #videoBtn span {top:22px;}
#container #refresh_is #about_us #vidWinButtons #videoBtn span img {margin:0px 0px 7px 0px;}
#digitalOfferings #vidWinButtons .close { margin: 14px auto 14px auto; cursor:pointer; display:none;}
.vjs-no-video { text-align:center;}
.vjs-no-video a { color:#9FAD00; font-weight:bold; }

/* people - currently removed!! */
#heads { margin:0 auto; }
#heads h3 { margin-bottom:18px; }
#container #refresh_is #people {width:100%; text-align:center; margin-bottom:30px;}
#container #refresh_is #people h3 {}
#container #refresh_is #people P {font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:18px; color:#10151b;}
#container #refresh_is #people #person_container {width:100%; height:350px; background-color:#f5f5f5; margin:20px 0px 0px 0px;  border-top: 1px solid #e9eaea; border-bottom: 1px solid #e9eaea; overflow:hidden; }
#container #refresh_is #people #person_container .person {width:999px; margin:0px auto; position:relative; overflow:visible;}
#container #refresh_is #people #person_container .person #largeHeads{position:absolute;/*margin:0px 70px 0px 0px; float:right;*/ top:-115px; left:0px; z-index:1;}
#container #refresh_is #people #person_container .person .details {padding: 53px 40px 0px 50px; float:left; width:335px; padding-left:50px; height:297px; text-align:center; position:relative; z-index:50; /*background:url(../images/detailsBG.png) left top no-repeat ;*/}
#container #refresh_is #people #person_container .person .details .name {font-weight:bold; font-size:48px; line-height:43px; color:#10151b; margin:0px 0px 10px 0px; }
#container #refresh_is #people #person_container .person .details .title {font-size:18px; color:#10151b; margin:0px 0px 25px 0px; }
#people .circle_btn { margin: 0 auto; }
#people .circle_btn span { display:block; padding-top:40px; }
#smallPeople { height:150px; border-bottom: 1px solid #e9eaea; margin-bottom:30px; }
#smallPeople ul { width:620px; margin:0 auto; overflow:hidden; height:150px; }
#smallPeople ul li{ float:left; position:relative; width:135px; height:150px; margin: 0px 10px 0px 10px; list-style:none; }
#smallPeople ul li div{ position:absolute; top:60px; left:0px; width:135px; height:194px;}
#smallPeople ul img.personFirst, #smallPeople ul img.personSecond{  }
#smallPeople ul img.personFirst {}

/*
# CONTACT US ##########################################################################################################################################
*/

#contact_us { position:relative; background-color:#10151B; clear:both; }
#contact_us h2 { /*border-bottom: 1px solid #ffffff;*/ }
#contact_container { background-color:#10151b; padding:20px 0px 30px 0px; margin:0 auto; overflow:auto;}
#contact_container h3 {color:#d1d0d0; font-weight:normal; font-size:18px; line-height:18px; margin:9px 0px 15px 0px; /*border-bottom: solid 1px #3c3f42; padding-bottom:14px;*/}
#contact_container p {color:#7d7d7d; font-size:12px; line-height:18px; margin:0px 0px 13px 0px;}
#contact_container p a:hover {color:#c1d72e; text-decoration:none;}

/* contact details */
#contact_details {float:left; width:540px; }
#contact_container .contactTitle {color:#d0d0d0; font-weight:bold; margin:0px 0px 0px 0px; display:block;}
#contact_details a { color:#fdb814; text-decoration:none; margin-top:4px;}
#contact_details .column {width:240px; margin:0px 15px 30px 15px; float:left; }
#socialDetails { clear:both; color:#7d7d7d; margin:0px 15px 30px 15px; width:510px;}
#socialDetails h3{ margin:0px 0px 10px 0px; }

/* contact form */
#contact_form {margin:0px 0px 0px 0px; float:left; }
#contact_form #contactFormLeft{ float:left; width:290px;}	
#contact_form #contactFormRight{ float:left; position:relative; }	
#contact_form input[type='text'] { background-color:#252d38; height:30px; font-family:Helvetica, Arial, sans-serif; font-size:12px; line-height:14px; color:#7c7c7c; border:none; width:227px; padding:0px 10px 0px 8px; margin-left:35px; }
#contactFormRight textarea {float:left; height:94px; background-color:#252d38; font-family:Helvetica, Arial, sans-serif; font-size:12px; line-height:14px; color:#7c7c7c; border:none; margin:0px 10px 0px 0px; padding:8px 10px 8px 10px; resize: none;}
#contact_form input[type='button'] {
	float:right; color: white; 
	background-color: #252d38; 
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	border:none; 
	width:56px; 
	height:56px; 
	margin:25px 0px 0px 0px; 
	overflow:hidden; 
	cursor:pointer;
}
#contact_form input[type='button']:hover {
	float:right; 
	color: #10151b;
	background-color: #fdb814;
}
#contactFormLeft #fullName, #contactFormLeft #email, #contactFormLeft #company { width: 280px; height:30px; background: url(../images/form-input-divider.png) no-repeat left top #252d38; paddingt:0px; margin-bottom:10px; position:relative;}
#contactFormLeft #fullName .icon, #contactFormLeft #email .icon, #contactFormLeft #company .icon { left:5px; top:3px; }
#contactFormLeft #fullName .icon { background-position:0 0px;}
#contactFormLeft #email .icon { background-position:0 -25px; }
#contactFormLeft #company .icon { background-position:0 -50px; }
#contact_form label{ position:absolute; color:#7c7c7c;}
#contactFormLeft label { top:9px; left:43px; }
#contactFormRight label { top:9px; left:10px; }

/* form error alerts */
#contact_form div.error {clear:both; color:#fff; background: url(../images/icon-warning-white.png) 10px 11px no-repeat #ac0f0f; padding:10px 10px 15px 10px; }
#contact_form #contactFormRight div.error p { margin:0px 0px 5px 23px; color:#fff; font-weight: bold;}
#contact_form div.error ul {  }
#contact_form div.error ul li{ list-style:disc; margin:0px 0px 5px 38px; }

/* social links */
#socialDetails span/* , .pageContents .share span */ { display:inline-block; width:25px; height:25px; padding: 0px 0px 0px 8px; overflow:hidden; text-indent:-9999px;}
#socialDetails .icon, { margin-top: 5px; }
#socialDetails .icon.twitter/* , .pageContents .icon.twitter */ { background-position:0 -75px; }
#socialDetails .icon.twitter:hover/* , .pageContents .icon.twitter:hover  */{ background-position:-25px -75px; }
#socialDetails .icon.facebook/* , .pageContents .icon.facebook */ { background-position:0 -100px; }
#socialDetails .icon.facebook:hover/* , .pageContents .icon.facebook:hover  */{ background-position:-25px -100px; }

#map {height:355px; width:100%; background-color:#10151b; }

/*
# FOOTER ##############################################################################################################################################
*/

#footer { width:100%; background-color:#10151b; height:50px; position:fixed; bottom:-50px; left:0px; z-index:100; color:#c6c7c8; font-size:14px; overflow:hidden;}
#copyright { float:left; font-size:11px; margin:20px 0 0 30px;}
#followUs { float:right; height:50px; font-style:italic; }
#followUs span { float:left; margin:18px 10px 0 0; }
#footer .facebook, #footer .twitter, #footer .youtube { float:right; width:34px; height:34px; display:block; text-indent:-9999px; background: url(../images/sprite-share-work-small.png) no-repeat 0 0; margin: 8px 5px 0 0;}
#footer .facebook { background-position: 0 -204px; }
#footer .twitter { background-position: 0 -272px; }
#footer .youtube { background-position: 0 -340px; }
#footer .facebook:hover { background-position: 0 -238px; }
#footer .twitter:hover { background-position: 0 -306px; }
#footer .youtube:hover { background-position: 0 -374px; }
#footer #login { float:right; display:block; height:32px; padding: 18px 10px 0 10px; margin-right:20px; color:#c1d72e; font-style:italic;}
#footer #login:hover { border-bottom: 1px dotted #9FAD00; }

/*
# WORK PORTFOLIO ######################################################################################################################################
*/

#contentWrapper, #blogWrapper { margin: 0 auto; position:relative; color:#6a6f77; overflow:hidden;}

#workControls { position:absolute; right:56px; top:133px; z-index:6; }
.small #workControls { right:2px; top:133px; }
#workControls span { width:33px; height:33px; margin-left:7px; display:block; float:left; overflow:hidden; text-indent: -9999px; background: url(../images/sprite-work-controls-1.png); }
#workControls a { width:33px; height:33px;  display:block; overflow:hidden; text-indent: -9999px; background: url(../images/sprite-work-controls-1.png); }
#workControls span#prevWork { background-position: 0px -165px; }
#workControls span#nextWork { background-position: 0px -264px; }
#workControls #prevWork a { background-position: 0px -99px; }
#workControls #prevWork a:hover { background-position: 0px -132px; }
#workControls #nextWork a { background-position: 0px -198px; }
#workControls #nextWork a:hover { background-position: 0px -231px; }
#workControls span#backWork { background:none; }
#workControls #backWork a { background-position: 0px 0px; }
#workControls #backWork a:hover { background-position: 0px -33px; }

#workIntro { float:left; width:275px; padding: 110px 10px 100px 65px; }
.small #workIntro, .small #sidebar { width:760px; padding: 110px 0 0px 0px; border-bottom: solid 1px #D7D7D7; margin-bottom: 30px;}
.small #sidebar { float:left; }
#sideContent, #sideLinks { width:275px; padding-bottom:25px; }
.small #sideContent, .small #sideLinks { float:left; }
#sideContent { overflow:visible; }
.small #sideContent { width:435px; padding-bottom:35px; }
.small #sideLinks { padding: 93px 0 0 50px; }
#sideContent h1, #sideContent h2, #sideLinks h3 { font-family: Georgia, "Times New Roman", Times, serif; font-weight:normal; font-style:italic; color: #3b3b3b;  }
#sideContent h1 {  min-height:24px; border-top: solid 6px #fdb814; border-bottom: solid 1px #d7d7d7; color:#3b3b3b; font-family: Helvetica, Arial, sans; font-size:24px; font-weight:bold; padding: 28px 0 13px 0; text-transform: uppercase; letter-spacing: -1px;}
.small #sideContent h1 { width:760px; }
#sideContent h2 { margin: 13px 0 8px; 0; font-size:14px; line-height:18px; }
#sideContent ul { padding-bottom:25px; }
#sideContent li { list-style: none; font-style: italic; display:inline; font-size:11px; margin-right:10px;}
#sideContent li a { color:#9FAD00;  text-decoration: none; border-bottom: 1px dotted #9fad00; }
#sideContent li a:hover { color:#6a6f77; border-bottom: none; }
.small #workDescription { padding-bottom:0px; }

#sideLinks h3 { text-transform: uppercase; border-bottom: solid 1px; border-bottom: solid 1px #d7d7d7; padding-bottom:15px; }
#onlineLinks ul, #relatedWork ul/* , #categories ul */{ padding: 2px 0 25px 0; }
#onlineLinks ul li, #relatedWork ul li/* , #categories ul li */ { list-style: none; border-bottom: 1px dotted #d9d9da;}
#onlineLinks ul li a, #relatedWork ul li a/* , #categories ul li a */ { display:block; color:#fcb918; padding:7px 0 7px 0; font-style: italic; }
#onlineLinks ul li a:hover, #relatedWork ul li a:hover/* , #categories ul li a:hover */ { background: url(../images/sprite-arrows-bent.png) no-repeat right -73px; }
#sideLinks li a { color:#6a6f77; }
#sideLinks li a:hover { color:#3b3b3b;  }

#sideLinks #shareWork ul { padding:10px 0 25px 0; height:48px; }
#shareWork li { display:inline; }
#shareWork li a { display:block; float:left; width:48px; height:48px; overflow:hidden; text-indent: -9999px; background: url(../images/sprite-share-work.png) no-repeat 0px 0px; margin:0 7px 0 0; padding:0; }

#shareWork li a#shareTwitter { background-position: 0 0; }
#shareWork li a#shareFacebook { background-position: 0 -192px; }
.pluginShareButtonLink { visibility:hidden; }
#shareWork li a#shareEmail { background-position: 0 -384px;  }
#shareWork li a#shareTwitter:hover { background-position: 0 -48px; }
#shareWork li a#shareFacebook:hover { background-position: 0 -240px; }
#shareWork li a#shareEmail:hover { background-position: 0 -432px;  }

.ddMenu { margin-bottom: 35px; position:relative; width:275px;}
.selectedFilter { height:21px; padding: 9px 0 0 7px; background:#10151b url(../images/sprite-dd-arrows.png) 245px 3px no-repeat; color:#ffffff; font-style: italic; font-weight:bold; margin:5px 0 1px 0; cursor: pointer; }
ul.dropList, ul.dropList li { list-style: none; width:275px; background:#10151b; }
ul.dropList { padding: 0 0 5px 0; }
ul.dropList li:first-child { padding-top:5px; }
#sideLinks .dropList li a { padding:7px 0 7px 7px; color:#ffffff; display:block; }
#sideLinks .dropList li a:hover{ color:#c1d72e; }

/*
# PAGE CONTENT ########################################################################################################################################
*/

#pageContent { font-family: Helvetica, Arial, sans; float:left; width:760px; padding:110px 0 100px 65px; overflow:hidden; line-height:20px; color:#6a6f77; position:relative; } /* image max width is 760px but add 40 px buffer */
#pageContent h1, #pageContent h2, #pageContent h3, #pageContent h4, #pageContent h5 { font-family: Georgia, "Times New Roman", Times, serif; font-style:italic; font-weight:normal; color:#3b3b3b; border-bottom: solid 1px #d7d7d7; }
.small #pageContent { padding: 0 0 100px 0px; width:760px; }

#pageContent h2, #blogWrapper #pageContent h1 { min-height:37px; border-top: solid 6px #fdb814; border-bottom: solid 1px #d7d7d7;  font-size:24px; font-weight:normal; font-style:italic; padding: 28px 0 0 0;  margin-bottom:30px; }
#blogWrapper #pageContent h1 { margin-bottom:18px; }
.small #pageContent h2 { display:none; }
#blogWrapper #pageContent h2 { border: none; font-size:36px; letter-spacing: -1px; line-height:44px; padding-top:10px; margin-left:-3px;}
#blogWrapper #pageContent .post h2 { margin-left:0px;}
#pageContent h3, #pageContent h4, #pageContent h5 { padding-bottom:15px; margin: 30px 0 25px 0; }
#pageContent h3 { font-size:20px; }
#pageContent h4 { font-size:16px; }
#pageContent h5 { font-size:14px; }


/* TEXT/LINKS/IMG */
#pageContent p {margin: 10px 0 18px;}
#pageContent em {font-style:italic;}
#pageContent strong {font-weight:bold;}
#pageContent a:link, #pageContent a:visited, #jstwitter .tweet a:link, #jstwitter  .tweet a:visited { color: #9FAD00; text-decoration: none; outline:none; border-bottom: 1px dotted #9fad00;}
#pageContent a:hover, #jstwitter  .tweet a:hover { text-decoration: none; color:#000000; border-bottom:none;}
#pageContent a:active, #pageContent a.active, #jstwitter  .tweet a:active, #jstwitter  .tweet a.active {color: #9FAD00;}
#pageContent img, #pageContent a img {border: none; outline:none; margin-bottom:20px;}
#pageContent abbr,#pageContent acronym {	/*indicating to users that more info is available */ border-bottom:1px dotted #000;	cursor:help; }

#pageContent hr {  margin: 0 0 30px 0;  padding: 0;  border: none;  height: 1px;  background: #d7d7d7; }
#pageContent ul, #pageContent blockquote, #pageContent quote, #pageContent code, #pageContent fieldset {margin: 16px 0;}

/* Lists */
#pageContent ul {margin-left:32px;}

#pageContent ol,#pageContent ul,#pageContent dl {margin-left:32px;}
#pageContent ol, #pageContent ul, #pageContent dl {margin-left:32px;}
#pageContent ul, #pageContent ol {margin: 8px 0 16px; padding: 0;}
#pageContent ol li, #pageContent ul li {margin: 7px 0 7px 32px;}
#pageContent ul ul li {margin-left: 10px;}

#pageContent ul li {padding: 0 0 4px 6px; list-style: disc outside;}
#pageContent ul li ul li {list-style: circle outside;}

#pageContent ol li {padding: 0 0 5px; list-style: decimal outside;}

#pageContent dl {margin: 8px 0 16px 24px;}
#pageContent dl dt {font-weight:bold;}
#pageContent dl dd {margin: 0 0 8px 20px;}

/* tables */
#pageContent table {margin: 16px 0; width: 90%;}
#pageContent thead th {  border-bottom: 2px solid #cecece;  color: #ffffff;  font-weight: bold;}
#pageContent th a:link, #pageContent th a:visited {  color: #6f9dbd;}
#pageContent td, #pageContent th {padding: 4px 6px; border:1px solid #000;}
#pageContent caption {margin-bottom:8px; text-align:center;}

/* scroll to page top */
#pageContent #top { display:block; width:55px; height:55px; margin:50px 0 0 353px; overflow:hidden; text-indent:-9999px; background: url(../images/sprite-top.png) 0px 0px; border-bottom:none; clear:both; }
#pageContent #top:hover { background-position: 0px -55px; }


/* grid system */
.row { overflow:hidden; margin:30px 0 30px -20px; }
div.two-col { float:left; width:370px; margin-left:20px; }
div.three-col { float:left; width:240px; margin-left:20px; }
p.two-col, p.three-col { -moz-column-gap: 20px; -webkit-column-gap: 20px; column-gap: 20px; padding-bottom:30px; }
p.two-col { -moz-column-count: 2;  -webkit-column-count: 2; column-count: 2; }
p.three-col { -moz-column-count: 3; -webkit-column-count: 3; column-count: 3; }

/*
# BLOG ################################################################################################################################################
*/

#sidebar { float:right; width:275px; padding: 110px 65px 100px 0px;  }
#sidebar #sideLinks { border-top: solid 6px #c1d72e; padding-top:38px;}
#blogWrapper #workControls { right:404px;  }
#jstwitter, .tweet { list-style: none; }
#sideLinks .tweet { margin: 15px 0 25px 0; }
#sideLinks .tweetTime { margin: 7px 0 0 0; }

.small #blogWrapper #workControls { right:0px;  }
.small #blogWrapper #pageContent { padding: 110px 0 100px 0px; width:760px; }
.small #blogWrapper #pageContent h1 { margin-bottom:120px; }
.small #blogWrapper #pageContent h2 { display:block; }

.small #blogWrapper #sidebar { position:absolute; padding:0; top:202px; float:none; left:0px; }
.small #blogWrapper #sideLinks { border:none; padding: 0 0 0 0; float:none; position:relative; display:block; width:760px; height:80px; }
.small #blogWrapper #sidebar #jstwitter, .small .jstwitter{ display:none; }
.small #blogWrapper #categories, .small #blogWrapper #archive, .small #blogWrapper #shareWork { position:absolute; top:0; } 
.small #blogWrapper #categories { left:0px; }
.small #blogWrapper #archive { left:305px; }
.small #blogWrapper #shareWork { right:0px; }
.small #blogWrapper #sideLinks h3 { border:none; padding-bottom:8px; }

.small #blogWrapper #shareWork ul { padding-top:3px; }
.small #blogWrapper #shareWork li a { display:block; float:left; width:34px; height:34px; overflow:hidden; text-indent: -9999px; background: url(../images/sprite-share-work-small.png) no-repeat 0px 0px; margin:0 4px 0 0; padding:0; }
.small #blogWrapper #shareWork li a#shareTwitter { background-position: 0 0; }
.small #blogWrapper #shareWork li a#shareFacebook { background-position: 0 -68px; }
.small #blogWrapper #shareWork li a#shareEmail { background-position: 0 -136px;  }
.small #blogWrapper #shareWork li a#shareTwitter:hover { background-position: 0 -34px; }
.small #blogWrapper #shareWork li a#shareFacebook:hover { background-position: 0 -102px; }
.small #blogWrapper #shareWork li a#shareEmail:hover { background-position: 0 -170px;  }

#blogDate { font-style:italic; font-size:11px; }

#articlesList { width:800px; margin-left:-40px; overflow:hidden; }
.post { width:360px; float:left; border-bottom: 1px solid #d7d7d7; padding-bottom:5px; margin:20px 0 10px 40px; /* min-height:300px; */}
.postThumbnail { width:360px; height:175px; overflow:hidden; }
#pageContent .postThumbnail a { display:block; width:360px; height:175px; position:relative; outline: none; border:none; }
.postThumbnail span { position:absolute; z-index:50; display:block; width:360px; height:175px; left:0; top:0; background: url(../images/blog-thumb-over.png) no-repeat 0 0; }
/* .postThumbnail a:hover span, .post:hover a span { background: url(../images/blog-thumb-over.png) no-repeat 0 0; } */
.dateCat { margin-top:15px; font-style:italic;}
.postDate { margin-right:6px; }
.postCat { margin-left:6px; }
#articlesList .post h2 { margin-bottom:10px; letter-spacing:0px;}
#articlesList .post h2 a { font-size:24px; line-height: 30px; border:none; color:#3b3b3b; display:block; letter-spacing:0px; }
#articlesList .post h2 a:hover { color:#9FAD00; }

/*
# GENERAL #############################################################################################################################################
*/

.icon { background:url(../images/sprite-icons.png) 0 0 no-repeat; display: block; width:25px; height:25px; text-indent:-9999px; overflow:hidden; position:absolute; }
.circle_link_container {border-top:1px solid #f3f3f3; width:100%; text-align:center; margin-top:50px; height:80px;}
.circle_link_container .circle_link {background:url(../images/circle_link_bg.png) no-repeat top center #10151b; height:103px; width:103px; position:relative; display:block; font-size:14px; font-weight:bold; color:#FFF; text-decoration:none; margin:0px auto; top:-50px; }
.circle_link_container .circle_link SPAN { width:46px; display:block; position:absolute; top:35px; left:28px;}
.clear {clear:both;}
/* .titleGap { height:60px; background:#ffffff; } */
.float_right {float:right; margin-left:10px;}
.float_left {float:left; margin-right:10px;}
.left { float:left; }
.right { float:right; }
.bufferTop { margin-top:20px; }
.vimeo { margin-bottom:20px; }
.circle_btn { width:93px; height:93px; background:url(../images/circle-white-cutout.png) no-repeat top left #10151b; overflow:hidden; text-transform: uppercase; }
.circle_btn a { display:block; width:93px; height:93px; text-align: center; font-size:14px; font-weight:bold; color:#fff; }

.close { width:55px; height:55px; overflow:hidden; background:url(../images/sprite-close-btn.png) left top no-repeat; text-indent:-9999px;}
.close:hover { background:url(../images/sprite-close-btn.png) left -55px no-repeat; }

.emailrtl { direction: rtl; unicode-bidi: bidi-override; }

/*
# AWARDS ##############################################################################################################################################
*/

/* AWWWARDS.COM NOMINATIONS */
#awwwards{ position:absolute; top:268px; right:0px; z-index:5; }
#awwwards a:link, #awwwards a:visited{ width:69px; height:105px; text-indent:-8000px; display:block; outline: none; border:none; }
#awwwards a.blackLeft{ background:url(../images/awards/awwwards_nominee_b_left.png) no-repeat; overflow:hidden; }
#awwwards a.blackRight{ background:url(../images/awards/awwwards_nominee_b_right.png) no-repeat; overflow:hidden; }
#awwwards a.greenLeft{ background:url(../images/awards/awwwards_nominee_g_left.png) no-repeat; overflow:hidden; }
#awwwards a.greenRight{ background:url(../images/awards/awwwards_nominee_g_right.png) no-repeat; overflow:hidden; }
#awwwards a.whiteLeft{ background:url(../images/awards/awwwards_nominee_w_left.png) no-repeat; overflow:hidden; }
#awwwards a.whiteRight{ background:url(../images/awards/awwwards_nominee_w_right.png) no-repeat; overflow:hidden; }