/* HTML5 display-role reset for older browsers */widd









 {
  display: block;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}
/* Variables *//* Styles for validation helpers
-----------------------------------------------------------*/.field-validation-error {
  color: #ff0000;
}
.field-validation-valid {
  display: none;
}
.input-validation-error {
  border: 1px solid #ff0000 !important;
  background-color: #ffeeee !important;
}
.validation-summary-errors {
  font-weight: bold;
  color: #ff0000;
}
.validation-summary-valid {
  display: none;
}
address {
  font-style: normal;
}

em {
  font-style: italic;
}

.content {
  width: 980px;
  position: relative;
  margin: 0 auto;
}
/* For boxes with padding in them */.paddedContent {
  width: 950px;
  padding: 0 15px 0 15px;
  margin: 0 auto;
  position: relative;
}
.paddedContent2 {
  width: 940px;
  padding: 0 30px 0 30px;
  margin: 0 auto;
  position: relative;
}

#anchors {
  list-style: none outside none;
  margin-top: 200px;
  position: fixed;
  right: 30px;
  z-index: 999;
  font-size:12px;
  
}


#anchors li {
	border:medium none;
	clear:both;
	margin:0 0 15px;
	padding-bottom:0;
	white-space:nowrap;
	width:50px;
	line-height:50px;
	text-align:center;
	background:url(../images/icons/header-background.jpg) repeat;
	text-shadow:none;
	-webkit-border-radius:50px;
	-moz-border-radius:50px;
	border-radius:50px;
	margin-bottom:1em;
	color:#fff;
}
#anchors  a {
	width:50px;
	line-height:50px;
	text-align:center;
	background:url(../images/icons/header-background.jpg) repeat;
	text-shadow:none;
	-webkit-border-radius:50px;
	-moz-border-radius:50px;
	border-radius:50px;
	margin-bottom:1em;
	color:#fff;
}

#anchors li a:hover {
	color:#799d41;
	text-decoration:none;
}

#anchors li a:active, #anchors li a.inview {
	color:#476612;
	text-decoration:none;
	
}

.block {
	width: 100%;
	overflow: hidden;
	/* [disabled]clear: left; */
	position: relative;
}
.block .action {
  width: 100%;
  cursor: pointer;
  text-decoration: underline;
  text-align: center;
  display: block;
  float: left;
  font-weight: normal;
  letter-spacing: -0.05em;
  padding-top: 36px;
}
.block .diagram {
  margin: 0 auto;
  display: block;
}
.block .intro .diagram {
  float: right;
  display: inline-block;
}
.action.textRight {
  text-align: right;
}
/* blocks */#enviroment {
  padding: 20px 0 20px 0;
  border-top: 1px dotted #343237;
}
#enviroment h1 {
  text-align: center;
  color:#857E82;
  font-size:22px;
}

#enviroment p {
	text-align:center;
	color:#4D6F13;
	font-size:16px;
}

.paper:after {
    background: url("../images/paper-fold.png") no-repeat scroll 0 0 transparent;
    bottom: -11px;
    content: "";
    display: block;
    height: 11px;
    left: -1px;
    position: absolute;
    width: 800px;
    z-index: 1;

}
.paper {
    -moz-border-bottom-colors: none;
    -moz-border-image: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: url("../images/paper_bg.jpg") repeat scroll 0 0 transparent;
    border-color: #E9E9E9 #E9E9E9 -moz-use-text-color;
    border-radius: 4px 4px 0 0;
    border-style: solid solid none;
    border-width: 1px 1px medium;
    color: #666666;
    font-size: 12px;
    line-height: 19px;
    margin-bottom: 30px;
	margin-left:90px;
    padding: 12px 14px 15px;
    position: relative;
    width: 770px;
}


#weBuildBetter {
	background: rgba(230,231,232,0.75);
  padding: 1px 0 20px 0;
  border-top: 1px dotted #343237;
}
#weBuildBetter h1 {
  text-align: center;
  color:#434343;
}
#weBuildBetter .arrow {
  float: right;
  position: relative;
  right: 32%;
}
#distributors {
	background:url(../images/calculator/img-gray-box-bg-n.gif) repeat;
  padding: 1px 0 20px 0;
  border-top: 1px dotted #343237;
}
#distributors h1 {
  text-align: center;
}
#distributors h4 {
	color:#5A762B;
}

#theModernInternet {
  background: #397721;
  padding: 70px 0 130px 0;
}
#theModernInternet h1 {
  text-align: center;
}

#theModernInternet .diagram {
  padding: 20px 0px 0 40px;
}
#theModernInternet .action {
  padding-top: 14px;
}
#imaginePlanDesignBuild {
  background: #489629;
  padding: 70px 0 130px 0;
}
#imaginePlanDesignBuild h1 {
  text-align: center;
}
#imaginePlanDesignBuild .diagram {
  padding: 0px 0px 0 20px;
}
#imaginePlanDesignBuild .action {
  padding-top: 0px;
}
#betterEveryTime {
  background: #5bbe33;
  padding: 70px 0 130px 0;
}
#betterEveryTime h1 {
  text-align: center;
}
#betterEveryTime .diagram {
  padding: 0px 150px 20px 0px;
}
#betterEveryTime .action {
  padding-top: 0px;
}
#whoFor {
  padding: 10px 0 10px 0;
  background: #6ade3c;
}
#buildBetterForYou {
  background: #97f970;
  padding: 70px 0 130px 0;
}
#buildBetterForYou h1 {
  text-align: center;
}
#buildBetterForYou h2 {
  text-align: center;
  padding-top: 15px;
}
#buildBetterForYou h2 a {
  color: #ffffff;
  text-decoration: none;
  text-align: center;
}
#buildBetterForYou h2 a:hover {
  text-decoration: underline;
}
#buildBetterForYou .action {
  text-align: right;
  float: right;
}
/* Services */#ourServices {
  padding: 180px 0 90px 0;
}
#ourServices h1 {
  padding-bottom: 20px;
  line-height: 0.7em;
}
#ourServices h3 {
  font-size: 1.62em;
  line-height: 1.2em;
}
#ourServices .diagram {
  position: relative;
  top: -20px;
  float: right;
}
#ourServices .arrow {
  position: relative;
  left: 10%;
  padding-top: 15px;
}
#multiScreen {
  background: #e9dec3;
  padding: 30px 0 60px 0;
}
#multiScreen h2 {
  text-align: center;
  width: 100%;
  padding-bottom: 30px;
}
#multiScreen h3 {
  padding-bottom: 30px;
}
#multiScreen .diagram {
  padding: 30px 0 30px 0;
}
#webSocialMobile {
  background: #e9dec3;
  padding: 70px 0 60px 0;
}
#webSocialMobile article {
  width: 33%;
  float: left;
  display: inline-block;
}
#webSocialMobile h2 {
  width: 100%;
  text-align: center;
  padding-bottom: 15px;
}
#webSocialMobile img {
  margin: 0 auto;
  display: block;
  padding-bottom: 15px;
}
#webSocialMobile ul {
  padding: 0;
  text-align: center;
  list-style: none;
}
#weBullets {
  background: #e9dec3;
  padding: 70px 0 60px 0;
}
#weBullets .paddedContent {
  background: #1d1b1c;
  overflow: hidden;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  padding: 30px 0 30px 0;
}
#weBullets h2 {
  width: 100%;
  padding-bottom: 30px;
  color: #e9dec3;
  text-align: center;
}
#weBullets ul li {
  margin-bottom: 15px;
}
#weBullets ul li a {
  color: #e9dec3;
}
#weBullets ul {
  width: 44%;
  padding: 0px;
  list-style-image: url(/content/images/bg_we_bullet.png);
  *list-style-image: url(/content/images/bg_we_bullet_ie7.png);
  padding-left: 5%;
  color: #e9dec3;
  float: left;
  display: inline-block;
}
#weBullets ul.last {
  padding: 0px;
  padding-right: 3%;
  float: right;
}
/* getinTouch */#getInTouch {
  padding: 180px 0 90px 0;
}
#getInTouch .paddedContent {
  overflow: hidden;
}
#getInTouch h1 {
  padding-bottom: 20px;
  width: 100%;
}
#getInTouch .details {
  width: 40%;
  float: left;
  display: inline-block;
  padding-top: 30px;
}
#getInTouch .details h2 {
  padding-top: 30px;
  clear: left;
}
#getInTouch .details h2.telNo {
  padding-top: 15px;
}
#getInTouch .details h2.mail {
  padding-top: 0px;
  padding-bottom: 15px;
}
#getInTouch .share {
  clear: both;
}
#getInTouch .share a:hover {
  position: relative;
  top: 1px;
}
#getInTouch .details h2 a {
  color: #ffffff;
}
#getInTouch .action {
  padding: 0;
  width: auto;
  text-align: left;
}
#getInTouch .form {
  width: 60%;
  float: right;
  display: inline-block;
  padding-top: 30px;
}
#getInTouch .form input {
  float: left;
  clear: left;
  border: 0px;
  font-family: Arial;
}
#getInTouch .form .input {
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  width: 60%;
  font-weight: normal;
  font-size: 1em;
  color: #413e3e;
  background: white;
  margin-top: 15px;
  padding: 19.5px;
}
#getInTouch .form .submit {
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  background: #ffffff;
  cursor: pointer;
  letter-spacing: -0.07em;
  font-weight: bold;
  color: white;
  font-size: 1.87em;
  margin-top: 15px;
  padding: 15px;
}
#getInTouch .form .submit:hover {
  background: #413e3e;
}
#getInTouch .form .textarea {
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  border: 0px;
  font-family: Arial;
  font-size: 1em;
  min-height: 200px;
  width: 90%;
  font-weight: normal;
  font-size: 1em;
  color: #413e3e;
  background: white;
  margin-top: 15px;
  padding: 19.5px;
}
#map_canvas {
  height: 100%;
  width: 100%;
  min-height: 500px;
}
#map .action {
  text-align: right;
  padding-bottom: 90px;
}
/* Our work */#ourWork {
  padding: 180px 0 90px 0;
}
#ourWork h1 {
  width: 100%;
  text-align: center;
}
#caseStudies {
  padding-top: 30px;
  padding-bottom: 30px;
  background: #e9dec3;
}
#caseStudies h2 {
  padding: 0 0 15px 0;
}
#caseStudies .content {
  overflow: hidden;
}
#caseStudies article {
  width: 29%;
  padding-right: 4%;
  height: 550px;
  float: left;
  display: inline-block;
}
#caseStudies a.caseImage {
  border: 7px solid white;
  overflow: hidden;
  float: left;
  display: block;
  padding: 0;
  position: relative;
  margin: 0;
  margin-bottom: 15px;
}
#caseStudies .mask {
  display: none;
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
  background: url(/content/images/bg_case_hover.png) center center;
}
#caseStudies a.caseImage:hover .mask {
  display: block;
}
#caseStudies a.caseImage:hover img {
  -moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}
#caseStudies article img {
  display: block;
  float: left;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
}
#caseStudies article h2 {
  width: 100%;
  border-bottom: 1px solid #ffffff;
  margin-bottom: 15px;
  line-height: 1.2em;
}
.action.workTop {
  text-align: right;
  padding-top: 36px;
  padding-bottom: 55px;
}
#showcase {
  background: #e9dec3;
}
.caseStudyGroup {
  display: none;
  overflow: hidden;
}
.caseStudyGroup .data {
  padding-top: 15px;
  position: relative;
  clear: both;
  border-top: 1px solid #ffffff;
  width: 100%;
}
.caseStudyGroup h2 {
  padding-bottom: 15px;
}
.caseStudyGroup .paddedContent {
  overflow: hidden;
}
.caseStudyGroup .text {
  float: left;
  width: 57%;
  padding-bottom: 40px;
}
.caseStudyGroup .text ul {
  padding-left: 15px;
}
.caseStudyGroup .text p {
  padding-bottom: 15px;
  text-align: justify;
}
.caseStudyGroup blockquote {
  background: #1d1b1c;
  color: #e9dec3;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  padding: 15px;
  font-size: 1.57em;
  font-weight: bold;
  letter-spacing: -0.07em;
  width: 35%;
  float: right;
  display: inline-block;
  line-height: 1.3em;
}
.caseStudyGroup .close {
  display: block;
  position: absolute;
  top: 25px;
  letter-spacing: -0.07em;
  right: 15px;
  cursor: pointer;
  font-weight: normal;
  text-decoration: underline;
}
/* Who We Are */#whoWeAre {
  padding: 180px 0 0px 0;
  z-index: 1000;
}
#whoWeAre h1 {
  padding-bottom: 20px;
  line-height: 0.7em;
}
#whoWeAre h3 {
  font-size: 1.62em;
  line-height: 1.2em;
}
#whoWeAre .paddedContent2 {
  overflow: visible;
  z-index: 999;
  background: transparent;
}
#whoWeAre .diagram {
  position: relative;
  top: -20px;
  right: 0px;
  padding-left: 15px;
  float: right;
}
#whoWeAre .arrow {
  position: relative;
  left: 10%;
  padding-top: 15px;
}
#ourPromise {
  padding: 40px 0 0px 0;

}
#ourPromise h3 {
  padding-bottom: 15px;
}
#ourPromise .diagram {
  position: relative;
  left: 5px;
  float: right;
  max-width: 100%;
  top: 20px;
}
#meetTheTeam {
  padding: 90px 0 90px 0;
  background: #e9dec3;
}
#meetTheTeam h2 {
  text-align: center;
}
#meetTheTeam article {
  float: left;
  overflow: hidden;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  height: 247px;
  width: 289px;
  margin-right: 15px;
  margin-top: 15px;
  display: inline-block;
  border: 8px solid white;
  position: relative;
}
#meetTheTeam article.last {
  margin-right: 0px;
}
#meetTheTeam article .teampic {
  width: 100%;
  float: left;
  display: inline-block;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
}
#meetTheTeam article .card {
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  position: relative;
  margin-left: -100%;
  z-index: 5;
  width: 100%;
  height: 100%;
  background: #fff;
}
#meetTheTeam article:hover .card {
  margin-left: 0%;
  height: 100%;
  width: 100%;
  *margin: 0px;
  *position: absolute;
  *top: 0px;
  *left: 0px;
}
#meetTheTeam .cardinfo {
  position: absolute;
  left: 0%;
  top: 0%;
  padding: 3%;
  height: 90%;
  border-bottom: 1px solid #ffffff;
}
#meetTheTeam h3 {
  font-size: 1.25em;
  float: left;
  display: block;
  color: #1d1b1c;
}
#meetTheTeam em {
  float: left;
  *padding-bottom: 10px;
  display: block;
  clear: left;
}
#meetTheTeam h4 {
  font-size: 1em;
  line-height: 1.4em;
  color: #1d1b1c;
  font-weight: normal;
  padding-top: 15px;
}
#meetTheTeam article:hover .teampic {
  margin-left: 100%;
}
#meetTheTeam .desc {
  width: 50%;
  float: left;
  clear: left;
}
#meetTheTeam article .cardinfo .smlteampic {
  float: right;
  *margin-top: 30px;
  display: inline-block;
  width: 40%;
  height: auto;
  border: 5px solid #857e82;
}
#meetTheTeam article .social {
  position: absolute;
  top: 3%;
  right: 3%;
}
#meetTheTeam article .social a {
  float: right;
  display: inline-block;
}
#meetTheTeam article .social a img {
  width: 20px;
  height: 20px;
  margin-left: 5px;
}
#meetTheTeam .action {
  text-align: right;
}
#error404 {
  padding: 20px 0 90px 0;
}
#error404 h1 {
  padding-bottom: 20px;
  color: #B0DC10;
    font-size: 5.31em;
    font-weight: bold;
    letter-spacing: -0.07em;
}
#error404 p {
  padding-bottom: 20px;
}
#getInTouch {
  padding: 180px 0 90px 0;
  z-index: 1000;
}
#getInTouch h1 {
  padding-bottom: 20px;
  text-align: left;
}
#getInTouch p {
  padding-bottom: 20px;
  text-align: left;
}
#be {
  background: #e9dec3;
}
#be .beIntro {
  float: right;
  width: 40%;
}
#be .flexslider p {
  color: #e9dec3;
}
#be .flexslider {
  border: 0px;
  background: none;
  position: relative;
}
#be .flexslider li {
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  background: none;
}
#be .flexslider .item {
  padding: 30px;
  min-height: 264px;
}
#be .flexslider li.collaborative {
  background: #1d1b1c;
}
#be .flexslider h2 {
  font-size: 5.31em;
  color: #e9dec3;
  float: left;
  display: block;
  line-height: 0.9em;
  *padding-bottom: 10px;
  letter-spacing: -0.07em;
  font-weight: bold;
  width: 50%;
}
#be .list li {
  margin-bottom: 15px;
  letter-spacing: -0.02em;
}
#be .list li a {
  color: #e9dec3;
}
#be .list {
  width: 40%;
  padding: 0px;
  list-style-image: url(/content/images/bg_we_bullet.png);
  *list-style-image: url(/content/images/bg_we_bullet_ie7.png);
  padding-left: 5%;
  color: #e9dec3;
  float: right;
  display: inline-block;
}
#be .flex-control-nav {
  position: absolute;
  bottom: 15px;
  right: 15px;
}
#be .flex-control-nav li {
  *position: relative;
  *bottom: 30px;
}
#be .flex-control-nav a {
  background-image: url(/content/images/ico_beige_circle.png);
  width: 20px;
  height: 20px;
}
#be .flex-control-nav li a.active {
  background-image: url(/content/images/ico_blue_circle.png);
  background-position: 2px 1px;
}

* {
		margin: 0;
		padding: 0;
		border: 0;
		list-style: none;
		outline: none;
		font-size: 1em;
		text-decoration: none;
		-webkit-appearance: none;
		-webkit-text-size-adjust:none;
		-webkit-tap-highlight-color:rgba(0,0,0,0);
	}


.bar{
		display: block;
		min-height: 5px;
		float: left;
		margin: 0px 22px 0px 0px;
		}
		.bar.one{
			width: 312px;
		}
		.bar.two{
			width: 646px;
		}
		.bar.three{
			width: 980px;
			margin: 0px 0px 0px 0px;
		}
		.bar.last{
			margin: 0px 0px 0px 0px;
		}
		.bar.leftside{
			width: 214px;
		}
		.bar.rightside{
			width: 740px;
			margin: 0px 0px 0px 0px;
		}
		.bar.right{
			margin: 0px 0px 0px 240px;
			width: 740px;
			min-height: 300px;
			_overflow:hidden;
			_margin: 0px 0px 0px 0px;
			_width: 540px;
		}
		.bar.right.abouttext{
			_margin: 0px;
			_width: 540px;
			_margin-left:-150px;
			_margin-top:-10px;
		}	
		.bar.right.serviceholder, #contact .bar.right, .bar.right.projectlist{
			_margin:-10px 0px 0px -30px;
			_width: 740px;
		}	
		.bar.oneAlt{
			width: 361px;
			position: relative;
		}
		.bar.oneSmallAlt{
			width: 214px;
			position: relative;
		}
		.bar.oneAlt.last{
			_top:-25px;
		}
		
	
	.bar.fixed{
		position: relative;
		top:12px; left:50%;
		margin:0px 0px 0px -498px;
		*width:120px; 
		_margin-left:-650px;
		_margin-top:-10px;
		}
		.bar.fixed ul li{
			border-top: 1px solid #deded6;
			width: 214px;
		}
		.bar.fixed ul li{
			font-weight: 400; 
		}
		.bar.fixed ul li a{
			color: #aeae9c;
			font-size: 14px;
			text-transform: uppercase;
			display: block;
			height: 34px;
			position: relative;
			line-height: 37px;
			*line-height:35px;
			padding: 0px 0px 0px 20px;
		}
		.bar.fixed ul li a:hover{
			color:#899b42;
		}
		.bar.fixed ul li a.active{
			color: #252525;
		}	
		.bar.fixed ul li a span{
			position: absolute;
			right: 0px; top:0px;
			width: 20px;	
			height: 34px;
			background-image: url(../img/blog_arrow_fixed.gif);
			background-position: -10px 34px;
			background-repeat: no-repeat;
		}
		.bar.fixed ul li a:hover span{
			background-position: -10px -34px;
		}
		.bar.fixed ul li a.active span{
			background-position: -10px 0px;
		}		
		.bar.fixed ul li form{
			position: relative;
		}
		.bar.extratopspace{
			margin-top: 12px;
		}
	
	.bar.topborder{
		border-top: 1px solid #CCC;
		padding: 40px 0px 0px 0px;
	}
	
	.generaltext{
		color: #707070;
		font-family: "verdana";
		font-size: 13px;
		line-height: 20px;
		margin: 0px 0px 10px 0px;
	}
	
	#team{
		position: relative;
		overflow: visible !important;
		margin-left:80px;
		margin-top:20px;
	}
	
	#team .thegrid{
		margin:0px -20px 0px 0px;
		}
		#team .thegrid li{
			margin:0 40px 20px 0;
			float: left;
      		list-style: none;
			display: block;
			width: 168px; height: 168px;
			background:url(../images/calculator/img-gray-box-bg-n.gif) repeat;
			border: 1px solid #e7e7e7;
			overflow: hidden;
			-moz-transition: all 0.4s ease-in-out;
			_position: relative;
			}
			#team .thegrid li.last{
				margin:0 0px 20px 0;
				_margin:20px -40px -20px 0;
			}
			#team .thegrid.hide li{
				-moz-transform: scale(0.6);
				-webkit-transform: scale(0.6); 
				-webkit-animation-name: size;
				-webkit-animation-duration: 0.4s;
				-webkit-animation-timing-function: linear; 
			}
			@-webkit-keyframes size {
				0%{ 
					-webkit-transform:scale(1); 
				}
				100%{ 
					-webkit-transform: scale(0.6); 
				}
			}
			#team .thegrid.show li{
				-moz-transform: scale(1);
				-webkit-transform: scale(1); 
				-webkit-animation-name: reversesize;
				-webkit-animation-duration: 0.4s;
				-webkit-animation-timing-function: linear; 
			}
			@-webkit-keyframes reversesize {
				0%{ 
					-webkit-transform:scale(0.6); 
				}
				100%{ 
					-webkit-transform: scale(1); 
				}
			}
		#team .thegrid li a{
			_float: left;
			position: relative;
			display: block;
			width: 160px; height: 160px;
			background-position: -5px -5px;
			overflow: hidden;
			margin: 4px;
			position: relative;
			cursor: pointer;
			}
			#team .thegrid li a.teammitchell{ background-image:url(../images/faces/dave_mitchell.png); }
			#team .thegrid li a.teamjones{ background-image: url(../images/faces/tony_jones.png); }
			#team .thegrid li a.teamchisolm{ background-image: url(../images/faces/Phelan_Chisolm.png); }
			#team .thegrid li a.teamnowlan{ background-image: url(../images/faces/laura_nowlan.png); }
			#team .thegrid li a.teammallas{ background-image: url(../images/faces/jeff_m.png); }
			#team .thegrid li a.teamhearst{ background-image: url(../images/faces/kitty_hearst.png); }
			#team .thegrid li a.teamdesign{ background-image: url(../images/faces/dnd.png); }
			#team .thegrid li a.teamarato{ background-image: url(../images/faces/alan_arato.png); }
			#team .thegrid li a.teamaccounts{ background-image: url(../images/faces/acc_man.png); }
			#team .thegrid li a.teamit{ background-image: url(../images/faces/it.png); }
			#team .thegrid li a.teamyou{ background-image: url(../images/faces/you.png); }
			#team .thegrid li a.teamkevin{ background-image: url(../img/team_kevin.png); }
			#team .thegrid li a.teamrnd{ background-image: url(../images/faces/rnd.png); }
			#team .thegrid li a.teamperson{ background-image: url(../images/faces/person-x.png); }
			#team .thegrid li a.teamarnaud{ background-image: url(../img/team_arnaud.png); }
			#team .thegrid li a.teamhatano{ background-image: url(../images/faces/kei_hatano.png); }
			#team .thegrid li a span{
				display: block;
				width: 160px; height: 160px;
				position: absolute;
				top:160px; left:0%;
				-webkit-transition: top 0.3s ease-in-out;
				-moz-transition: top 0.3s ease-in-out;
				-o-transition: top 0.3s ease-in-out;
				transition: top 0.3s ease-in-out;
				}
				#team .thegrid li a:hover span{
					top:0px;
				}
				#team .thegrid li a span p{
					display: block;
					position: absolute;
					margin: 0;
					bottom:-10px;
					background: #97ab48;
					background: rgba(151,171,72,0.7);
					color: #FFF;
					}
					#team .thegrid li a span p i{
						display: block;
						font-size: 18px;
						font-style: normal;
						padding: 8px 8px 0px 8px;
						width: 144px;
						font-weight: 600;
					}
					#team .thegrid li a span p b{
						display: block;
						font-size: 12px;
						font-weight: normal;
						padding: 0px 8px 16px 8px;
						font-weight: 400;
						color: #FFF;
					}
	#team #info	{
		position: absolute;
		left:0px; top:0px;
		background:url(../images/calculator/img-gray-box-bg-n.gif) repeat;
		}
		#team #info .member{
			display: none;
			opacity: 0;
			position: relative;
			padding: 0px 0px 0px 190px;
			}
			#team #info .member .closebutton{
				
				*display:block;
				width: 32px; height: 32px;
				background: url(../images/faces/icons/closebutton.png);
				position: absolute;
				left:-10px; top:-10px;
				z-index: 5;
				_left:-200px;
			}
			#team #info .member .closebutton:hover{
				background-position: bottom left;
			}
			#team #info .member .avatar{
				position: absolute;
				left:0px; top:0px;
				*top:6px;
				_left:-190px;
			}
			#team #info .member h2{
				font-weight: 600;
				margin-bottom: 7px;
				color: #7B3863;
				font-size: 24px;
			}
			#team #info .member h3{
				margin-bottom: 15px;
				font-weight: 400;
				color: #9FB250;
				_font-size:18px;
			}
			#team #info .member.show{
				display: block;
				opacity:0;
			}
			#team #info .member p{
				font-family: "verdana", "arial";
				width: 545px;
			}
			#team #info .member p a{
				color: #7B3863;
				font-size: 12px;
			}
			#team #info .member p b{
				font-weight: normal;
				color: #333;
			}

/*_______ Jobs _______ */
	
	div#joinourteam-feet {
		padding: 200px 25px 25px;
		height: 260px;
		background: url(../images/faces/icons/jobs_header.png) no-repeat left top;
	}
	
	div#joinourteam-feet div.blockcopy {
		padding: 15px 55px 0 30px;
    	width: 440px;
		float: left;
	}

	div#joinourteam-quote {
		width: 362px;
		height: 233px;
		padding-top: 10px;
		float: left;
		background: url(../images/faces/icons/jobs_quote.png) no-repeat 0 10px;
	}
	
	div#joinourteam-quote h5 {
		display: none;
	}
	
	div#joinourteam-jobs {
		padding: 0 25px 15px;
	}
	

	
	div.job-posting {
		margin: 0 20px;
		padding: 30px 0;
		overflow: hidden;
		background:url(../images/calculator/img-gray-box-bg-n.gif) repeat;
		border-bottom: 1px solid #ddd;
	}
	
	div.job-posting h4 {
		color: #598122;
		line-height: 28px;
	}
	
	div.job-posting h4 strong {
		font-weight: bold;
	}
	
	
	div.job-posting span.job-dept {
		color: #707070;
		font-size: 11px;
		text-transform: uppercase;
		letter-spacing: 1px;
		display: block;
		width: 200px;
		padding-top: 3px;
		text-align: right;
		float: right;
	}
	
	div.job-posting p {
		clear: both;
	}
	
	div.job-posting a.pdf {
		margin: 12px 0 0 15px;
		float: left;
	}

	a.btn-job_apply, a.btn-job_creative {
		display: block;
		width: 119px;
		height: 34px;
		float: right;
		background: url(../images/icons/btn-applynow.png) no-repeat top;
		margin: 10px 25px;
	}
	
	a.btn-job_apply:hover, a.btn-job_creative:hover {
		background: url(../images/icons/btn-applynow.png) no-repeat bottom;
	}
	
	a.btn-job_apply span, a.btn-job_creative span {
		display: none;
	}

	div#joinourteam-jobs div.job-posting:last-child {
		border-bottom: none;
	}



/*_____________ */


/*iPhone*/@media screen and (max-width: 620px) {
  /* Variables */
  body {
    width: 100%;
    font-size: 0.8em;
  }
  
  .content {
    width: 96%;
    padding: 0 2% 0 2%;
  }
  
  .paddedContent {
    width: 96%;
    padding: 0 2% 0 2%;
  }
  
  .paddedContent2 {
    width: 96%;
    padding: 0 2% 0 2%;
  }
  
  .mainHeader {
    width: 96%;
    padding: 0 2% 0 2%;
    margin-top: 2%;
  }
  
  .mainHeader .logo {
    margin-top: 10%;
    width: 100%;
    overflow: hidden;
    border: none;
  }
  
  .mainHeader .logo:hover {
    border: none;
  }
  
  .mainHeader .logo img {
    width: 40%;
    padding: 0 30% 0 30%;
  }
  
  .mainHeader .mainNav {
    width: 100%;
    padding-top: 5%;
  }
  
  .mainHeader .mainNav ul {
    list-style: none;
    padding: 0;
    width: 100%;
    float: left;
    display: table;
  }
  
  .mainHeader .mainNav ul li {
    font-weight: bold;
    float: left;
    letter-spacing: -0.05em;
    width: 100%;
    text-align: center;
    padding-left: 0;
    padding-top: 3%;
  }
  
  .mainHeader .mainNav ul li a {
    text-decoration: none;
    width: 100%;
    text-align: center;
  }
  
  h2 {
    font-size: 1.5em;
  }
  
  h4 {
    font-size: 1em;
    letter-spacing: 0;
  }
  
  /* blocks */
  .block .diagram {
    max-width: 100%;
    padding: 0;
  }
  
  #weBuildBetter .arrow {
    float: right;
    position: relative;
    right: auto;
    margin: 0 25% 0 45%;
    width: 20%;
  }
  
  .block .action {
    padding: 3%;
    background: #1d1b1c;
    font-weight: bold;
    width: 50%;
    margin: 5% 22% 0 22%;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    color: #e9dec3;
    text-decoration: none;
  }
  
  .block .action:hover {
    background: #ffffff;
  }
  
  #weBuildBetter {
    padding: 15% 0 15% 0;
  }
  
  #theModernInternet {
    padding: 15% 0 15% 0;
  }
  
  #theModernInternet .diagram {
    padding: 0;
  }
  
  #imaginePlanDesignBuild {
    padding: 15% 0 15% 0;
  }
  
  #imaginePlanDesignBuild .diagram {
    padding: 0;
  }
  
  #imaginePlanDesignBuild .action {
    padding-top: 10px;
  }
  
  #betterEveryTime {
    padding: 15% 0 15% 0;
  }
  
  #betterEveryTime .action {
    text-align: center;
  }
  
  #betterEveryTime .diagram {
    padding: 3% 0 0 0;
  }
  
  #betterEveryTime .action {
    padding-top: 10px;
  }
  
  .page#betterEveryTime {
    padding: 5% 0 5% 0;
  }
  
  #buildBetterForYou {
    padding: 15% 0 15% 0;
  }
  
  #buildBetterForYou .action {
    text-align: center;
  }
  
  #ourServices {
    padding: 10% 0 5% 0;
  }
  
  #ourServices .diagram {
    left: auto;
    top: auto;
    clear: left;
    float: left;
  }
  
  #whoWeAre {
    padding: 10% 0 5% 0;
  }
  
  #whoWeAre h1 {
    padding-top: 5%;
    clear: left;
  }
  
  #whoWeAre .diagram {
    left: auto;
    top: auto;
    clear: left;
    float: left;
    padding: 0px;
  }
  
  #ourPromise {
    padding: 10% 0 5% 0;
  }
  
  #ourPromise .diagram {
    right: auto;
    top: auto;
    clear: left;
    float: left;
  }
  
  #be {
    padding: 10% 0 5% 0;
    width: 100%;
  }
  
  #be .flexslider .item {
    padding: 5% 5% 20% 5%;
    width: 90%;
  }
  
  #be .flexslider {
    width: 100%;
    padding: 0;
    margin: 0;
  }
  
  #be .flexslider h2 {
    font-size: 2.31em;
    padding-bottom: 5%;
    color: #e9dec3;
    float: left;
    display: block;
    line-height: 0.9em;
    letter-spacing: -0.07em;
    font-weight: bold;
    width: 50%;
  }
  
  #be .list li {
    margin-bottom: 15px;
    font-weight: bold;
    letter-spacing: -0.07em;
  }
  
  #be .list li a {
    color: #e9dec3;
  }
  
  #be .list {
    width: 95%;
    padding-left: 5%;
    padding: 0px;
    list-style-image: url(/content/images/bg_we_bullet.png);
    padding-left: 5%;
    color: #e9dec3;
    float: right;
    display: inline-block;
  }
  
  #be .flex-control-nav {
    position: absolute;
    bottom: 15px;
    right: 15px;
  }
  
  #be .flex-control-nav li a.active {
    background-image: url(/content/images/ico_beige_circle.png);
    width: 20px;
    height: 20px;
  }
  
  #meetTheTeam {
    padding: 5% 0 5% 0;
  }
  
  #meetTheTeam article {
    width: 43%;
    margin-right: 2%;
    background: #fff;
    height: auto;
    border: 5px solid #fff;
    overflow: hidden;
    float: left;
  }
  
  #meetTheTeam article.last {
    margin-right: 2%;
  }
  
  #meetTheTeam article h3 {
    padding-top: 7%;
  }
  
  #meetTheTeam article h4 {
    padding-top: 5%;
  }
  
  #meetTheTeam article .teamimg {
    width: 100%;
    height: auto;
  }
  
  #meetTheTeam article .desc {
    width: 100%;
  }
  
  #meetTheTeam article .card {
    width: 100%;
  }
  
  #meetTheTeam .action {
    text-align: center;
  }
  
  #meetTheTeam article .cardinfo {
    height: auto;
    border: 0px;
  }
  
  #meetTheTeam article .cardinfo .smlteampic, #meetTheTeam article .cardinfo .social {
    display: none;
  }
  
  .flex-direction-nav {
    display: none;
  }
  
  #multiScreen {
    padding: 5% 0 5% 0;
  }
  
  #webSocialMobile {
    padding: 5% 0 5% 0;
  }
  
  #webSocialMobile article {
    width: 100%;
    padding: 0 0 5% 0;
  }
  
  #weBullets {
    padding: 5% 0 5% 0;
  }
  
  #weBullets ul, #weBullets ul.last {
    width: 85%;
    padding: 0px;
    padding-left: 10%;
    padding-right: 5%;
  }
  
  #weBullets .paddedContent {
    padding: 3% 0 3% 0;
  }
  
  #weBullets h2 {
    padding-bottom: 3%;
  }
  
  #getInTouch {
    padding: 10% 0 5% 0;
  }
  
  #getInTouch .form {
    width: 100%;
    padding: 3% 0 0 0;
  }
  
  #getInTouch .form .input {
    width: 80%;
    padding: 5%;
    text-indent: 5%;
  }
  
  #getInTouch .form .submit {
    width: 80%;
    padding: 5%;
  }
  
  #getInTouch .form .textarea {
    width: 80%;
    min-height: 150px;
  }
  
  #getInTouch .details {
    width: 100%;
    padding: 3% 0 0 0;
    text-align: center;
  }
  
  #getInTouch .details h2 {
    padding-top: 3%;
    clear: both;
    text-align: center;
  }
  
  #getInTouch .action {
    float: left;
    clear: both;
    width: 50%;
    padding: 3%;
    margin-top: 0px;
    margin-bottom: 5%;
    text-align: center;
  }
  
  #getInTouch p {
    text-align: center;
  }
  
  #map {
    width: 100%;
    overflow: hidden;
  }
  
  #map_canvas {
    min-width: 300px;
    padding: 0 5% 0 5%;
    width: 90%;
  }
  
  #map_canvas iframe {
    width: 90%;
  }
  
  #map .action {
    text-align: center;
    padding-bottom: 3%;
  }
  
  #ourWork {
    padding: 10% 0 5% 0;
  }
  
  #caseStudies {
    padding: 5% 0 5% 0;
  }
  
  #caseStudies article h2 {
    border: 0px;
  }
  
  #caseStudies article {
    width: 100%;
    padding: 0 0 3% 0;
    height: auto;
  }
  
  #caseStudies article .caseImage {
    width: 40%;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
    margin: 0px;
    padding: 0px;
    margin-right: 5%;
  }
  
  #caseStudies article .caseImage img {
    width: 100%;
    height: auto;
  }
  
  #caseStudies article h2 {
    width: 50%;
    padding: 3% 0px 3% 0;
    margin: 0px;
    float: left;
    display: inline-block;
  }
  
  #caseStudies article .info {
    float: left;
    width: 50%;
    display: inline-block;
  }
  
  .caseStudyGroup h2 {
    max-width: 80%;
  }
  
  .caseStudyGroup .text {
    width: 100%;
    column-count: 1;
    -moz-column-count: 1;
    -webkit-column-count: 1;
  }
  
  .caseStudyGroup blockquote {
    width: 90%;
    padding: 5%;
  }
  
  .caseStudyGroup .flexslider {
    padding: 0;
    max-width: 96%;
    border: 0px;
    width: 96%;
    padding: 2%;
    background: white;
  }
  
  .caseStudyGroup .close {
    right: 0px;
    top: 15px;
  }
  
  .caseStudyGroup .close span {
    text-indent: -9999px;
    text-decoration: none;
    display: block;
    float: left;
  }
  
  .caseStudyGroup .close:after {
    content: "X";
    text-indent: 0px;
    font-size: 1.2em;
    -moz-border-radius: 90px;
    -webkit-border-radius: 90px;
    border-radius: 90px;
    padding: 5px 10px 5px 10px;
    color: #e9dec3;
    background: #1d1b1c;
  }
  
  /* footer */
  #mainFooter {
    padding: 0;
    margin-top: 15%;
  }
  
  #mainFooter section {
    width: 50%;
    padding: 3% 0 3% 0;
    text-align: left;
  }
  
  #mainFooter section ul {
    float: none;
  }
  
  #secondaryFooter {
    padding: 3% 0 3% 0;
  }
  
  #secondaryFooter .action {
    padding: 3%;
    text-align: center;
    color: #1d1b1c;
    background: #ffffff;
    display: block;
  }
  
  .shareLinks {
    display: none;
  }
  
  .flexslider {
    max-width: 95%;
    overflow: hidden;
  }
  
  #whoWeAre .diagram {
    margin: 0;
    right: 0px;
  }
  
  video {
    width: 100% !important;
    padding: 0;
    margin: 0;
    height: auto !important;
  }
  
  .action.workTop {
    text-align: center;
  }
  
  .action.textRight {
    text-align: center;
  }
  
  /* fix fancybox for mobile */
  #fancybox-wrap {
    left: 0px !important;
    width: 94% !important;
    padding: 2% !important;
    border: 0px;
    top: 0px;
  }
  
  #signup {
    width: 92%;
    padding: 4%;
  }
  
  #signup form {
    float: left;
    display: block;
    width: 100%;
  }
  
  #signup form .input {
    width: 40%;
    padding: 5%;
  }
  
  #signup form .submit {
    width: 45%;
    padding: 5%;
  }
  
  #fancybox-content {
    width: 100% !important;
    border: 0px !important;
  }
  
  #fancybox-bg-e,
  #fancybox-bg-w,
  #fancybox-bg-se,
  #fancybox-bg-ne,
  #fancybox-bg-sw,
  #fancybox-bg-nw,
  #fancybox-bg-n,
  #fancybox-bg-s {
    display: none;
  }
  
  #fancybox-close {
    right: -2% !important;
    top: -4% !important;
  }
}