/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */


@import url(//fonts.googleapis.com/css?family=Fauna+One);



html,
button,
input,
select,
textarea {
    color: #333;
    font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	font-family: 'Fauna One', georgia, serif;   
    background: #FFF;
}


html {
    font-size: 1em;
    line-height: 1.4;
	-webkit-font-smoothing: antialiased;
}

#brandbox {
	width:250px;
	padding:23px;
	background-color:#FF6600;
	float:left;
	margin-right:16px;
}

#newcustomersbox {
	width:250px;
	padding:23px;
	background-color:#527325;
	float:left;
	margin-right:16px;
}

#buildsystemsbox {
	width:250px;
	padding:23px;
	background-color:#2865ad;
	float:left;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #333;
    margin: 10px 0 30px 0;
    padding: 0;
}

/*
 * Remove the gap between images, videos, audio and canvas and the bottom of
 * their containers: h5bp.com/i/440
 */

audio,
canvas,
img,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}


/*
 * Hide.
 */

.hide {
    position: absolute;
    left: -9999px;
}

a{
	text-decoration: none;
	outline: none;
	}
	

.orange{
	color: #FF6600;
	}	
	
.clearLeft{
	clear: left;
	}
	
.clearRight{
	clear: right;
	}	
	
.btn{
	display: inline-block;
	padding: 7px 25px;
	color: #FFF;	
	background: #FF6600;
	border: none;
	cursor: pointer;
	font-family:'AntagometricaBTW01-Regu', "Helvetica Neue", Helvetica, Arial, sans-serif;
    -webkit-transition: background-color 150ms ease-in-out;
    -moz-transition: background-color 150ms ease-in-out;
    -o-transition: background-color 150ms ease-in-out;
    transition: background-color 150ms ease-in-out;	
    -webkit-transition: color 150ms ease-in-out;
    -moz-transition: color 150ms ease-in-out;
    -o-transition: color 150ms ease-in-out;
    transition: color 150ms ease-in-out;	   
    -webkit-box-shadow: 2px 2px 0px 0px rgba(0,0,0,0.25);
	-moz-box-shadow: 2px 2px 0px 0px rgba(0,0,0,0.25);
	box-shadow: 2px 2px 0px 0px rgba(0,0,0,0.25); 	
	}		
		
		
.btn:hover{
	color: #FF6600;	
	background: #FFF;
	}
	
.screen-reader {
  display: block !important;
  left: -9999px !important;
  position: absolute !important;
}	


.video-wrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}

.video-wrapper object,
.video-wrapper embed,
.video-wrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	 height: 100%;
}
		

/* ==========================================================================
   Custom styles
   ========================================================================== */

.row{
	float: left;
	width: 100%;
	text-align: center;
	position: relative;	
	}

body.dark .row{	
	background-color: #414141;
	}
	
		
.row .inner{
	width: 960px;
	text-align: left;
	margin: 0 auto;
	padding: 0 0 0 0;
	}
	


.centered .inner{
	text-align: center;
	}

/*-- fix top menu --*/


body{
	padding: 0;
}



#header{
	float: left;
	width: 100%;
	height: 105px;
	line-height: 105px;
	z-index: 2001;	
	top: 0;
    background: #527325;
    background: -webkit-linear-gradient(left, #527325, #a4e84a); 
    background: -o-linear-gradient(right, #527325, #a4e84a);
    background: -moz-linear-gradient(right, #527325, #a4e84a);
    background: linear-gradient(to right, #527325, #a4e84a);
	}
	
	
	
#header .inner{
	position: relative;
	}	
	
.klarifiPage #header{
	background: #FFF;
}	

.blueprintPage #header{
	background: #7a99b6 url("../images/assets/blueprint-bg.png") no-repeat 45% 0;
}	

	
/*-- header --*/	

#logo{
	float: left;
	margin: 5px 0 0 0;
	}
	
#logo img{
	}

#logo-mobile{
	display: none;
}	
	
	
#dropdown{
	float: right;
	width: 248px;
	background: #F1F5F8;
	position: absolute;
	top: 25px;
	right: 0;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	cursor: pointer;
}	

#dropdown dt{
	float: left;
	width: 100%;
	padding: 15px 15px 15px 50px;
	box-sizing: border-box;
	color: #527325;
	font-size: 19px;
	line-height: normal;
	background: #FFF url("../img/dropdown-lines.png") no-repeat 15px 50%;
}

#dropdown span{
	float: left;
	width: 100%;
	padding: 8px 0;
	left: -9999px;
	position: absolute;
	opacity: 0;
	-webkit-transition: opacity 200ms linear;
	-moz-transition: opacity 200ms linear;
	-o-transition: opacity 200ms linear;
	transition: opacity 200ms linear;
}

#dropdown:hover span{
	left: 0;
	position: relative;
	opacity: 1;
	}

#dropdown dd a{
	float: left;
	width: 100%;
	box-sizing: border-box;
	padding: 8px 15px 8px 50px;
	position: relative;
	font-size: 16px;
	color: #333;
	line-height: normal;
}

#dropdown dd a:before {
    content: "\f105";
    font-family: FontAwesome;
    left:20px;
    position:absolute;
    top:8px;
 }

#dropdown dd:hover a:before{
	color: #FF0000;
}

/*-- nav --*/

#menu{
	display: none;
}


#nav{
	float: left;
	width: 100%;
	background: #373638;
	}


#nav.moving{
	position: fixed;
	z-index: 2000;
	background-color:rgba(0,0,0,0.8);
	}


#nav .inner{	
	position: relative;	
}


#navigation{
	float: left;
	position: relative;
	z-index: 1000;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	}	
	
#navigation li{
	float: left;
	position: relative;
	}	
	
#navigation > li > a{
	float: left;
	padding: 0 16px;
	height: 50px;
	line-height: 50px;
	color: #FFF;
	font-size: 18px;
    -webkit-transition: background-color 150ms ease-in-out;
    -moz-transition: background-color 150ms ease-in-out;
    -o-transition: background-color 150ms ease-in-out;
    transition: background-color 150ms ease-in-out;			
	}	


	
#navigation #nav-sub-home a{
	float: left;
	width: 20px;
	text-indent: -9999px;
	background-color: none !important;
	background: url("../img/home-icon.png") no-repeat 50% 50%;
	background-size: 12px 16px;
	}

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

	.moving #navigation #nav-sub-home a{	
		background: url("../images/assets/icon-home.png") no-repeat 50% 50%;
		background-image: linear-gradient(transparent, transparent),url("../images/assets/icon-home.svg");
	}

}


#navigation > li:hover > a,
#navigation > li.here > a,
#navigation > li.parent-here > a{
	background-color: #FF6600 !important;
	}		

#navigation > li#nav-sub-home:hover > a,
#navigation > li#nav-sub-home.here > a,
#navigation > li#nav-sub-home.parent-here > a{
	background-color: rgba(0,0,0,0) !important;
	}

#navigation > li > ul{
	position: absolute;
	left: -9999px;
	z-index: 2000;
	background: #FF6600;
	top: 50px;
	padding: 0px 0 0 0;
	opacity: 0;
	-webkit-transition: opacity  0.4s linear;
    -moz-transition: opacity  0.4s linear;
    -o-transition: opacity  0.4s linear;
    transition: opacity  0.4s linear;	
    -webkit-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.75);
	box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.75);	
	}
	
#navigation > li:hover > ul{
	left: 0;
	opacity: 1;		
	}	
	
#navigation > li > ul > li > a{
	float: left;
	width: 180px;
	color: #FFF;
	padding: 8px 20px 8px 20px;
	}	
	
	
#navigation > li > ul > li > a:hover,
#navigation > li > ul > li.here > a,
#navigation > li > ul > li.parent-here > a,
#navigation > li > ul > li:hover > a,
#navigation > li > ul > li > ul > li > a:hover{
	background: #FF6600;
	text-decoration: underline;
}



#navigation > li > ul > li > ul{
	position: absolute;
	left: -9999px;
	z-index: 2000;
	background: #666666;
	top: 0;
	padding: 0px 0 0 0;
	opacity: 0;
	-webkit-transition: opacity  0.4s linear;
    -moz-transition: opacity  0.4s linear;
    -o-transition: opacity  0.4s linear;
    transition: opacity  0.4s linear;		
	}
	
#navigation > li:hover > ul > li:hover > ul{
	left: 220px;
	opacity: 1;		
	}
	
	
#navigation > li > ul > li > ul > li > a{
	float: left;
	width: 180px;
	color: #FFF;
	padding: 8px 20px 8px 20px;
	}		


#call{
	float: right;
	position: relative;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	}	


#call a{
	color: #FFF;
	font-size: 19px;
	height: 50px;
	line-height: 50px;	
	cursor: default;
}

.homepage #call a{

	}



#breadcrumb{
	float left;
	width: 100%;
	font-size: 14px;
	padding: 10px 0;
	color: #4D4D4D;
	}

#breadcrumb a{
	color: #4D4D4D;
	}
	
#breadcrumb span{
	color: #FF6600;
}	
	

/*-- showcase --*/

.strapline{
	float: left;
	width: 100%;
	z-index: 150;
	color: #333;
	padding: 0;
}

#showcase .strapline{
	top:330px;
	left: 0;
	}


#pageHeader .strapline{
	height: auto;
	}

.strapline h1,
.strapline h3{
	font-size: 50px;
	line-height: 1em;
	padding: 30px 0 0 0;
	}
	
	
#pageHeader .strapline h1{	
	font-size: 50px;
	padding: 60px 0 35px 0;
	font-family: 'Helvetica Neue LT W01_35 Thin', Helvetica, Arial, sans-serif;
	}


#pageHeader.home .strapline{
	height: auto;
	overflow: visible;
	position: relative;
	top:auto;
	left: auto;
	height: auto;
	color: #333;
	background: none;
}
	
#pageHeader.home .strapline h1{	
	font-size: 58px;
	max-width: 910px;
	line-height: 1.2em;
	margin: 0 auto;
	position: relative;
	padding: 60px 0 60px 0;
	font-family: 'Helvetica Neue LT W01_35 Thin', Helvetica, Arial, sans-serif;
	}
		
	
.strapline h4{
	font-size: 38px;
	}

.strapline img{
	float: left;
	position: absolute;
	top: 0;
	left: -9999px;
	}


#slider{
	position: relative;
	}

#slider .slides li{
	float: left;
	width: 100%;
	padding: 600px 0 0 0;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: 0 0;
}


#slider .slides li .about{
	float: left;
	width: 50%;
	padding: 60px 25% 40px 25%;
	background: url("../images/assets/about-bg.png") no-repeat 50% 0;
}


#slider .slides li .about h5{
	font-size: 19px;
	color: #4473b3;
	padding: 0 0 20px 0;
	}

#slider .slides li .about p{
	font-size: 17px;
	}


#slider .flex-control-nav{
	float:right;
	position: absolute;
	top: 620px;
	right:20px;
	}


#slider .flex-control-nav li{
	float: left;
	padding: 0 0 0 10px;
	cursor: pointer;
	}


#slider .flex-direction-nav .flex-prev,
#thumbnailSlider .flex-direction-nav .flex-prev{
	position: absolute;
	bottom: -101px;
	left: 20px;
	float: left;
	width: 28px;
	height: 32px;
	text-indent: -9999px;
	z-index: 200;
	background: url("../images/assets/slider-arrows.png") no-repeat 0 0;
	}

#slider .flex-direction-nav .flex-next,
#thumbnailSlider .flex-direction-nav .flex-next{
	position: absolute;
	bottom: -101px;
	right: 40px;
	float: left;
	width: 28px;
	height: 32px;
	text-indent: -9999px;	
	z-index: 200;	
	background: url("../images/assets/slider-arrows.png") no-repeat -28px 0;	
	}

#thumbnailSlider .flex-direction-nav .flex-prev,
#thumbnailSlider .flex-direction-nav .flex-next{
	bottom: 70px;
	}
	
#slider .flex-control-nav li a{
	float: left;
	width: 9px;
	height: 9px;
	background: #333333;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;	
	text-indent: -9999px;
	behavior: url("pie/PIE.htc");
	}
	
#slider .flex-control-nav li a.flex-active{
	background: #FF6600;
}	


#results{
	width: 60%;
	padding: 20px 20%;
	background: #E6E6E6;
	position: relative;
	}
	
#carousel{

}	

#carousel .flex-control-nav{
	display: none;
}


#carousel .flex-direction-nav{
	display: none;
	}


#carousel .slides li{
	position: relative;
	}

#carousel .slides li img{
	border: 1px solid #799AB7;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;	
	margin: 0 20px;	
	behavior: url("pie/PIE.htc");
}


#carousel .slides li .btn{
	position: absolute;
	top: 45px;
	left: -9999px;
	width: 190px;
	font-size: 22px;
	}


#carousel .slides li.flex-active-slide .btn{
	left: 10px;
	}
	
	
#thumbnailSlider .slides li img{
	border: 2px solid #799AB7;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;	
	margin: 0 20px 3px 20px;	
	-webkit-box-shadow: 3px 3px 0px 0px #E6E6E6;
	-moz-box-shadow:    3px 3px 0px 0px #E6E6E6;
	box-shadow:         3px 3px 0px 0px #E6E6E6;
	behavior: url("pie/PIE.htc");	
}


#thumbnailSlider .slides li img:hover{
	border-color: #FF6600;
	-webkit-box-shadow: 3px 3px 0px 0px #ccc;
	-moz-box-shadow:    3px 3px 0px 0px #ccc;
	box-shadow:         3px 3px 0px 0px #ccc;		
	}	


/*-- pageHeader --*/	

#pageHeader{
	background-size: cover;
	background-position: 0 0;
	}
	
	
#pageHeader .mask{
	float: left;
	width: 100%;
	height: 320px;	
	background: url("../images/assets/pageHeader-bg.png") no-repeat 50% 100%;
	}	

#pageHeader .casestudy{
	float: left;
	width: 100%;
	height: 600px;
	}	

#pageHeader .blogImage{
	float: left;
	width: 100%;
	height: 355px;
	}	

#pageHeader .titleOnly{
	height: auto;
	}

#pageHeader .withQuote{
	height: auto;
	}

#pageHeader blockquote{
	margin: 200px auto 70px auto;
	width: 840px;
	padding: 50px;
	background: url("../images/assets/strapline-bg.png");
	color: #FFF;
	font-size: 21px;
	}
	
	
#pageHeader blockquote p{
	padding: 0 0 20px 0;
	}	

#pageHeader .fade{
	float: left;
	width: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
	background: url("../img/fade-bg.png") repeat-x 0 0;
	height: 204px;
}

/*-- intro --*/

#intro .inner{
	text-align: center;
	position: relative;
	}
	

#intro .inner h1{
	font-size: 64px;
	color: #799AB7;
	padding: 0 0 30px 0;
	}
	
	
#intro .inner p{
	font-size: 18px;
	line-height: 1.5em;
	width: 70%;
	padding: 0 15% 0 15%;
	}	

#intro .inner h6{
	position: absolute;
	bottom: 20px;
	left: 0;
	}



/*-- text --*/

.text{
	padding: 50px 0 40px 0;
	}


.padded .inner{
	width: 800px;
	margin: 0 auto;
	}
	
.intro{
	padding: 20px 0 0 0;
	margin: 0 0 30px 0;
	border-top: 1px solid #FFF;
	}
	
.steps{
	padding: 0;
	}	

	

.arrowWhite{
	background: url("../images/assets/arrow-white.png") no-repeat 50% 0;
	}

.arrowBlue{
	background: url("../images/assets/arrow-blue.png") no-repeat 50% 0;
	}

.blue{
	background-color: #799AB7;
	}

.grey{
	background-color: #333;
	}
	

.green{
	background-color: #7EC327;	
	}

.summary{
	padding: 20px 0 10px 0;
	margin: 0;
	clear: both;
	}

.text .inner{
	position: relative;
	}	

.text h2,
.text h3{
	font-size: 36px;
	padding: 0 0 30px 0;
	color: #799AB7;	
	}
	
.text p{
	font-size: 17px;
	padding: 0 0 20px 0;
	line-height: 1.6em;
	}	
	
	



.text ul{
	padding: 0 0 10px 0;
	}
	
.text ul li{
	font-size: 17px;
	padding: 0 0 10px 15px;
	line-height: 1.6em;
	background: url("../images/assets/bullet-orange.png") no-repeat 0 10px;
	}		
	
.blue h3,
.blue p,
.blue li,
.grey h3,
.grey p,
.grey li,
.green h3,
.green p,
.green li{	
	color: #FFF;
	}
	
	
.blue .btn{
	color: #FFF;
	-webkit-box-shadow: 2px 2px 0px 0px rgba(0,0,0,0.3);
	-moz-box-shadow:    2px 2px 0px 0px rgba(0,0,0,0.3);
	box-shadow:         2px 2px 0px 0px rgba(0,0,0,0.3);
}

	
.text .download{
	position: absolute;
	top: -20px;
	right: 0;
	}	

.text a{
	color: #e9257a;
	}


.text .download a i{
	font-size: 20px;
	}
	
	
.text ol.versions li{
	display: inline-block;
	margin: 0 10px 20px 0;
	}
	
	
.text blockquote{
	display: block;
	text-align: center;
	width: 60%;
	margin: 30px auto 20px auto;
	background: url("../images/assets/quote-orange-left.png") no-repeat 0 0;	
	}
	
.text blockquote span{
	display: block;
	padding: 0 35px 0 35px;
	background: url("../images/assets/quote-orange-right.png") no-repeat 100% 80%;
	}	
	
.text blockquote cite{
	color: #FF6600;
	}
	
u{
	background: #E6007E;
	color: #FFF;
	text-decoration: none;
	padding: 0 5px;
	display: inline-block;
	}
	
.text p a{
	color: #E6007E;
	font-weight: bold;
	background: #FFF;
	padding: 0 5px;
	display: inline-block;
	}

.text p a:hover{
	color: #FFF;
	background: #E6007E;
	}			
	
.filters{
	padding: 10px 0 0 0;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	}	
	

.filters dl{
	float: left;
	width: 100%;
	font-size: 14px;
	color: #fff;
	}			

.filters dt{
	float: left;
	width: 10%;
	height: 50px;
	}
	
.filters dd{
	float: left;
	width: 30%;
	}
	

	
.text .video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 35px;
    height: 0;
    overflow: hidden;
}


.text .video-container iframe {
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
}	
		

/*-- examples --*/


#examples{
	position: relative;
	z-index: 200;
	background: #799AB7;
	}

#examples .flex-control-paging{display:none;}


#examples .details{
	float: left;
	width: 100%;
	padding: 0 0 50px 0;
	background: #FFF;
	}

#examples .details img{
	float: left;
	width: 100%;
	height: auto;
	z-index: 99;
	}
	
#examples .details span{
	float: left;
	width: 55%;
	margin: -70px 0 0 0;
	z-index: 100;
	}	


#examples .details span h3{
	font-size: 22px;
	padding: 0 0 15px 0;
	}	
	
#examples .details span p{
	font-size: 17px;
	color: #666;
	padding: 10px;
	background: #FFF;
	background: rgba(255, 255, 255, 0.8);
	}
	
#examples .details span h4{
	font-size: 17px;
	color: #666;
	padding: 20px 0 0 0;
	}			
	
#examples .buttons{
	float: right;
	}	

#examples .buttons a{
	float: left;
	margin: 0 0 0 20px;
	}

#examples .quote{
	float: left;
	width: 100%;
	text-align: center;
	background: #333;
	color: #FFF;
	padding: 20px 0 25px 0;
	}
	
#examples blockquote{
	display: inline-block;
	width: 480px;
	padding: 10px 0 0 40px;
	margin: 0 70px;
	font-size: 17px;
	background: url("../images/assets/quote-left.png") no-repeat 0 10px;
	}	
	
	
#examples blockquote span{	
	display: inline-block;
	width: 480px;
	padding: 0 40px 0 0;
	background: url("../images/assets/quote-right.png") no-repeat 100% 80%;
	}
	

#examples blockquote p,
#examples blockquote cite{
	padding: 0 0 0px 0;
	line-height: 1.6em;
	}		
	
	
#examples blockquote cite{
	color: #799AB7;
	}	


#examples .versions{
	float: left;
	width: 100%;
	text-align: center;	
	background: #799AB7;
	color: #FFF;
	padding: 15px 0 0 0;
	}
	
#examples .versions dt,
#examples .versions dd{
	float: left;
  	height: 32px;
  	line-height:32px;	
	}

#examples .versions dt{margin: 0 10px 15px 0;}
	
#examples .versions dd {
	position: relative;
	float: left;
	width: 38px;
	height: 32px;
	margin: 0 15px 15px 0;
	background: url("../images/assets/service-icons.png") no-repeat 0 0;
}


#examples .versions dd.service1{background-position: 0 0;}
#examples .versions dd.service2{background-position: -38px 0;}
#examples .versions dd.service3{background-position: -76px 0;}
#examples .versions dd.service4{background-position: -114px 0;}
#examples .versions dd.service5{background-position: -152px 0;}
#examples .versions dd.service6{background-position: -190px 0;}
#examples .versions dd.service7{background-position: -228px 0;}


#examples .versions dd span {
  position: absolute;
  width:180px;
  color: #333333;
  background: #FFFFFF;
  text-align: center;
  visibility: hidden;
  border-radius: 6px;
  box-shadow: 2px 2px 2px #666666;
  behavior: url("pie/PIE.htc");
}
#examples .versions dd span:after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -8px;
  width: 0; height: 0;
  border-top: 8px solid #FFFFFF;
  border-right: 8px solid transparent;
  border-left: 8px solid transparent;
}
#examples .versions dd:hover span {
  visibility: visible;
  opacity: 0.8;
  bottom: 40px;
  left: 50%;
  margin-left: -90px;
  z-index: 999;
}	


#examples .flex-direction-nav .flex-prev{
	position: absolute;
	top: 240px;
	left: 0px;
	float: left;
	width: 61px;
	height: 124px;
	text-indent: -9999px;
	z-index: 200;
	background: url("../images/assets/more-arrows.png") no-repeat 0 0;
	}

#examples .flex-direction-nav .flex-next{
	position: absolute;
	top: 240px;
	right: 0;
	float: left;
	width: 61px;
	height: 124px;
	text-indent: -9999px;	
	z-index: 200;	
	background: url("../images/assets/more-arrows.png") no-repeat -61px 0;	
	}
	
	
#examples .flex-control-nav{
	position: absolute;
	bottom: -30px;
	right: 20px;
	z-index: 300;
	}

#examples .flex-control-nav li{
	float: left;
	margin: 0 0 0 10px;	
	}
	
#examples .flex-control-nav li a{
	float: left;
	text-indent: -9999px;
	width: 9px;
	height: 9px;
	background: #BCCDDD;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	cursor: pointer;
	}
	
#examples .flex-control-nav li a.flex-active{	
	background: #FFF;
	}





/*-- client --*/

#client{
	padding: 30px 0 10px 0;
	}

#client .logo{
	display: inline-block;
	}


#client a{
	color: #FF6600;
	}

#client p{
	font-size: 17px;
	padding: 10px 0 20px 0;
	}
	

#client .btn{
	color: #FFF;
	font-size: 22px;
	}


/*-- award --*/

#award{
	padding: 30px 0 30px 0;
	}


#award img{
	padding: 0 20px 0 0;
	}
	


/*-- clientList --*/


#clientList {
	padding: 0 0 30px 0;
	}

#clientList ul{
	float: left;
	width: 100%;
	margin: 0 0 10px 0;
	}

#clientList li{
	float: left;
	width: 220px;
	height: 125px;
	margin: 0 26px 26px 0;
	line-height: 125px;
	text-align: center;
	background: #4D4D4D;
	}
	

#clientList li.last{
	margin-right: 0;
	}		
	

#clientList li a{	
	float: left;
	width: 220px;
	height: 125px;
	background: #4D4D4D;
	position: relative;
    -webkit-transition: background-color 150ms ease-in-out;
    -moz-transition: background-color 150ms ease-in-out;
    -o-transition: background-color 150ms ease-in-out;
    transition: background-color 150ms ease-in-out;		
	}
	
#clientList li a:hover{
	background: #799AB7;
	}		

#clientList li a:hover i{
	color: #FFF;
	}	
	
#clientList li a i{
	position: absolute;
	bottom: 10px;
	right: 10px;
	color: #FF6600;
	font-size: 22px;
	}		


	
#clientList p i{
	font-size: 20px;
	margin: 0 5px 0 0;
	}



/*-- serviceList --*/


#serviceList {
	padding: 0 0 30px 0;
	}

#serviceList ul{
	float: left;
	width: 100%;
	}

#serviceList li{
	float: left;
	width: 280px;
	margin: 0 20px 40px 20px;
	position: relative;
	}
	
#serviceList li img{
	width: 100%;
	height: auto;
	-webkit-transition: opacity  0.4s linear;
    -moz-transition: opacity  0.4s linear;
    -o-transition: opacity  0.4s linear;
    transition: opacity  0.4s linear;			
	}	
	
#serviceList li h4{
	color: #527325;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	font-size: 26px;
	line-height: 1.2em;
	padding: 10px 0 5px 0;
	-webkit-transition: color  0.4s linear;
    -moz-transition: color  0.4s linear;
    -o-transition: color  0.4s linear;
    transition: color  0.4s linear;	
	}	
	
#serviceList li p{
	color: #666;
	font-size: 18px;
	}

#serviceList li p.continue{
	padding: 10px 0 0 0;
	font-size: 18px;
	position: relative;
	z-index: 101;
	}

#serviceList li p.continue a{
	color: #FF6600;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	}
	
#serviceList li a:hover img{
	opacity: 1;	
	}
	
#serviceList li a:hover img{
	opacity: 0.7;		
	}	


#serviceList li a:hover h4{	
	color: #FF6600;
	}
	
#serviceList li p .btn{
	margin-top: 10px;
	}

#serviceList .quick{
	display: block;
	text-align: center;
	}

#serviceList .quick span{
	display: inline-block;
	padding: 7px 0;
	margin: 0 0 0 -70px;
	width: 140px;
	color: #FFF;	
	background: #000;
	background: rgba(0,0,0,0.7);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	position: absolute;
	top: 52px;
	left: -9999px;
	z-index: 500;
	opacity: 0;
	-webkit-transition: opacity  0.4s linear;
    -moz-transition: opacity  0.4s linear;
    -o-transition: opacity  0.4s linear;
    transition: opacity  0.4s linear;
    behavior: url("pie/PIE.htc");	
	}
	
#serviceList .quick:hover span{
	left: 50%;
	opacity: 1;	
	}	

#serviceList a.popup{
	position: relative;
	display: block;
	}	
	
#serviceList a.popup i.fa-search{
	position: absolute;
	bottom: 0;
	left: 0;
	float: left;
	color: #FFF;
	width: 25px;
	height: 25px;
	line-height: 25px;
	font-size: 13px;
	text-align: center;
	background: #999999;
	-webkit-transition: all 0.1s linear;
    -moz-transition: all 0.1s linear;
    -o-transition: all 0.1s linear;
    transition: all 0.1s linear;						
	}
	
	
#serviceList a.popup:hover i.fa-search{	
	background: #000;
	width: 35px;
	height: 35px;
	line-height: 35px;
	font-size: 16px;					
	}	
	
	
#serviceList .whiteFade{
	float: left;
	width: 100%;
	z-index: 100;
	height: 56px;
	position: absolute;
	bottom: 10px;
	left: 0;
	background: url("../images/assets/fade.png") repeat-x 0 100%;
}		
	

.inline{
	display: none;
	width: 100%;
	max-width: 700px;
	text-align: center;	
	padding: 40px 0 0 0;
	}
	
.inline h3{
	font-size: 36px;
	padding: 10px 40px 0 40px;
	}			

.inline h4{
	font-size: 20px;
	color: #7899b6;
	padding: 0 40px 30px 40px;
	}

.inline h5{
	font-size: 18px;
	padding: 0 40px 20px 40px;
	text-align: left;
	}

.inline p{
	font-size: 15px;
	padding: 0 40px 20px 40px;
	text-align: left;
	}
	
.inline a{
	color: #333;
	text-decoration:underline;
	}	

.inline a:hover{
	text-decoration: none !important;
	}	

.inline a.btn{
	color: #FFF;
	text-decoration: none !important;
	}	

.inline ul{
	float: left;
	font-size: 14px;
	text-align: left;
	width: 290px;
	}

.inline ul.listCol1{
	padding: 0 20px 20px 40px;
	}	
	
.inline ul.listCol2{
	float: right;
	padding: 0 40px 20px 20px;
	}	
	
.inline ul li{
	padding: 0 0 10px 15px;
	line-height: 1.4em;
	background: url("../images/assets/bullet-orange.png") no-repeat 0 8px;
	}	
	
	
.inline .book{
	float: left;
	width: 100%;
	padding: 30px 0;
	text-align: center;
	background: #DDE6ED;
	font-size: 22px;
	}
	
	
.inline .fncy-custom-close{
	font-size: 17px;
	color: #7899b6;
	float: right;
	margin: 25px 40px 0 -40px;
	}
	

/*-- more --*/

#more img{

	}
	
#more img.shadow{
	border-right: none;
	width: 100%;
	height: 14px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 400;
	}	


#more .flex-direction-nav .flex-prev{
	position: absolute;
	bottom: 0px;
	left: 0px;
	float: left;
	width: 61px;
	height: 124px;
	text-indent: -9999px;
	z-index: 200;
	background: url("../images/assets/more-arrows.png") no-repeat 0 0;
	}

#more .flex-direction-nav .flex-next{
	position: absolute;
	bottom: 0px;
	right: 15px;
	float: left;
	width: 61px;
	height: 124px;
	text-indent: -9999px;	
	z-index: 200;	
	background: url("../images/assets/more-arrows.png") no-repeat -61px 0;	
	}
	


	


/*-- controls --*/


#controls img{
	border-right: 1px solid #6C8AA3;
	}	

#controls img.shadow{
	border-right: none;
	width: 100%;
	height: 14px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 400;
	}

#controls .flex-direction-nav .flex-prev{
	position: absolute;
	bottom: 0px;
	left: 0px;
	float: left;
	width: 61px;
	height: 124px;
	text-indent: -9999px;
	z-index: 200;
	background: url("../images/assets/more-arrows.png") no-repeat 0 0;
	}

#controls .flex-direction-nav .flex-next{
	position: absolute;
	bottom: 0px;
	right: 0;
	float: left;
	width: 61px;
	height: 124px;
	text-indent: -9999px;	
	z-index: 200;	
	background: url("../images/assets/more-arrows.png") no-repeat -61px 0;	
	}


/*-- people --*/

#people{
	padding: 30px 0 30px 0;
	}

#people .inner{
	text-align: center;
	}
	

#people .inner h1{
	font-size: 64px;
	color: #799AB7;
	padding: 0 0 30px 0;
	}

#people .profiles{
	float: left;
	width: 100%;
	}	
	

#people .profiles li{
	float: left;
	width: 100%;
	}	
	
#people .profiles li li{
	float: left;
	width: 240px;
	padding: 0 40px;
	min-height: 260px;
	margin: 0 0 60px 0;
	position: relative;
	}
	
	
#people .profiles li li img.arrow{
	position: absolute;
	bottom: -25px;
	left: 50%;
	margin: 0 0 0 -15px;
	z-index: 200;
}	

#people .profiles li.people3{
	clear: right;
	}	
	

#people .profiles li img.photo{	
	border: 3px solid #799AB7;
	-webkit-border-radius: 86px;
	-moz-border-radius: 86px;
	border-radius: 86px;
	cursor: pointer;
	behavior: url("pie/PIE.htc");
	}		
	

#people .profiles li h3{
	font-size: 22px;
	padding: 10px 0 0 0;
	}		

#people .profiles li h4{
	font-size: 17px;
	color: #799AB7;	
	}
	
	
#people .profiles li .about{
	float: left;
	background: #799AB7;
	padding: 10px 10px 0 10px;
	margin: 15px 0 0 0;
	color: #FFF;
	}
	
#people .profiles li .about p,
#people .profile p{
	padding: 0 0 10px 0;
	color: #FFF;	
	}	
	
#people .profiles li .about p a,
#people .profile p a{
	color: #FFF;
	text-decoration: underline;
	}
	
#people .profiles li .about p a:hover{
	text-decoration: none;
	}	
	
#people .profile{
	display: none;
	float: left;
	width: 90%;
	padding: 30px 5% 10px 5%;
	background: #799AB7 url("../images/assets/shadow-top.png") repeat-x 0 0;	
	margin: -50px 0 40px 0;
	text-align: left;
	}



/*-- #blueprint --*/


#blueprint{
	padding:1px 0 40px 0;	
	}

#blueprint .inner{
	width: 960px;
}

#blueprint .inner .content{
	float: left;
	width: 600px;
	padding: 40px 0 0 0;
}	


#blueprint .inner .sidebar{
	float: right;
	width: 270px;
	padding: 40px 15px 0 15px;	
	background: #7a99b6;
	color: #FFF;
}	



#blueprint .inner .sidebar form h4{
	font-size: 20px;
	padding: 0 0 30px 0;
	color: #FFF !important;
}

#blueprint .inner .sidebar form .field{
	padding: 0 0 10px 0;
}

#blueprint .inner .sidebar form .field input{
	font-size: 16px;
	}

#blueprint .inner .sidebar form .field input{
	border: none;
	width: 90%;
	padding: 5px 5%;
}

#blueprint .inner .sidebar form h5{
	font-size: 18px;
	padding: 0 0 10px 0;
	}


#blueprint .inner .sidebar .mailingList{
	text-align: center;
	font-size: 13px;
	}


#blueprint .inner .submit{
	text-align: center;	
	}


/*-- blueprintForm --*/	

#blueprintForm{
	float: left;
	width: 100%;
	position: relative;
	font-size: 18px;
	margin: 30px 0 0 0;
	background: url("../images/assets/get_blueprint-bg.png") no-repeat 100% 0;
}


#blueprintForm.klarifi{
	background: url("../images/assets/get_klarifi-bg.png") no-repeat 100% 0;
}

#blueprintForm .textarea,
#blueprintForm .field{
	width: 60%;
	}

#contactForm .textarea,
#contactForm .field,
#contactForm{
	width: 100%;
	}
	
#contactForm{
	padding: 40px 0 0 0;
	}	


#blueprintForm .textarea textarea,
#blueprintForm .field input,
#contactForm .textarea textarea,
#contactForm .field input{
	width: 90%;
	padding: 10px 5%;
	background: #E6E6E6;
	font-size: 18px;
	border: none;
	}
	
	
#blueprintForm .textarea textarea,
#contactForm .textarea textarea{
	min-height: 80px;
	padding: 15px 5%;	
	}
	

#blueprintForm dl{
	float: left;
	width: 60%;
	margin: 10px 0 30px 0;
	}
	
#contactForm dl{
	float: left;
	width: 100%;
	margin: 10px 0 30px 0;
	}	
	
#blueprintForm dd,
#contactForm dd{		
	float: left;
	width: 50%;
	margin: 10px 0 0 0;
	}
	
#blueprintForm.klarifi dd{
	width: 100%;
	}	
	
#blueprintForm .select{
	float: left;
	width: 60%;
	}
	
#contactForm .select,
#contactForm .select select,
#blueForm .select,
#blueForm .select select{
	width: 100%;
	}	
	
#blueprintForm .right{
	float: right;
	width: 35%;
	position: absolute;
	bottom: 0;
	right: 0;
	text-align: right;
	}	
	
	
#blueprintForm .mailingList,
#contactForm .mailingList{
	font-size: 13px !important;
	}

#contactForm .right{
	float: right;
	text-align: right;
}
	
#blueprintForm .right .submit{
	font-size: 20px;
	}	


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

	#people .profiles .about{display:none !important;}
	
}

	
#people .profile .close{
	float: right;
	cursor: pointer;
	}	


/*-- workshop --*/	

#workshop{
	padding: 0;
	}

#mainContent{
	float: left;
	width: 630px;
	width: 100%;
	color: #666;
	padding: 30px 0;
	}


#mainContent p{
	font-size: 17px;
}


#mainContent h3{
	font-size: 24px;
	padding: 20px 0;
	clear: both;
	}
	
#mainContent h4{
	font-size: 19px;
	padding: 20px 0;
	clear: both;
	color: #000;
	}	
	
#mainContent h6{
	clear: both;
	float: left;
	width: 100%;
	text-align: center;
	padding: 15px 0;
	margin: 25px 0;
	font-size: 17px;
	color: #333;
	border-top: 1px solid #7899b6; 	
	border-bottom: 1px solid #7899b6; 
	}
	
#mainContent strong{
	font-weight: normal;
	color: #000;
	}	
	
#mainContent p em{
	color: #ff883c;
	font-style: normal;
	}

	
#mainContent ul.listCol1{
	float: left;
	width: 45%;
	padding: 0 5% 20px 0;
	}	
	
#mainContent ul.listCol2{
	float: right;
	width: 45%;
	padding: 0 0 20px 5%;	
	}
	
	
#mainContent ol{
	float: left;
	width: 100%;
	padding: 0 0 30px 0;
	}
	
#mainContent ol li{
	float: left;
	width: 45%;
	padding: 0 5% 0 0;
	}			
	

#mainContent ol li img{
	display: block;
	margin: 0 0 10px 0;
	border: 3px solid #7899b6; 
	-webkit-border-radius: 56px;
	-moz-border-radius: 56px;
	border-radius: 56px;
	behavior: url("pie/PIE.htc");			
	}	
	
	
#workshop #mainContent p img{

	}

#form{
	float: right;
	width: 250px;
	padding: 30px 30px 10px 30px;
	background: #799AB7;
	color: #FFF;
	}	


#form h4{
	font-size: 22px;
	padding: 0 0 20px 0;
	}
	
#form .btn{
	margin: 20px 0 0 0;
	-webkit-box-shadow: 2px 2px 0px 0px rgba(0,0,0,0.3);
	-moz-box-shadow:    2px 2px 0px 0px rgba(0,0,0,0.3);
	box-shadow:         2px 2px 0px 0px rgba(0,0,0,0.3);
	}
	
	
	
#form label{
	position: absolute;
	left: -9999px;
	}			

#form .field,
#form .textarea{
	padding: 0;
	}	
	
#form .field input,
#form .textarea textarea{
	border: none;
	background: #FFF;
	width: 94%;
	padding: 10px 3%;
	margin: 0 0 10px 0;
	font-size: 15px;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
}


#form .field input{
	height: 26px;
	}

#form .textarea textarea{
	height: 70px;
	}

	
#form .submit{
	margin: 0;
	padding: 0;
	text-align: center;
	}		

#form .submit .btn{
	font-size: 18px;
	}

/*-- aboutLtf --*/		


#aboutLtf{
	padding: 0 0 50px 0;
	}

#aboutLtf .inner{
	text-align: center;
	position: relative;
	}
	
#aboutLtf .about{
	position: absolute;
	top: 0;
	left: 0;
	}
	

#aboutLtf .about .box{
	float: left;
	width: 700px;
	position: absolute;
	top: 160px;
	left: 45px;
	margin: 0 0 0 0;
	text-align: left;
	color: #FFF;
	z-index: 600;
	}
	
#aboutLtf .about .box h4{
	background: #000;
	background: rgba(0, 0, 0, 0.7);
	padding: 20px;
	position: relative;
	font-size: 20px;
}


#aboutLtf .about .box h4 span.close{
	float: right;
	text-align: center;
	width: 50px;
	height: 50px;
	line-height: 50px;
	cursor: pointer;
	position: absolute;
	top: 10px;
	right:0;
	}


#aboutLtf .about .box h4 span.close:hover{	
	color: #FF6600;
	}
	
#aboutLtf .about .box span.text{
	padding: 20px 30px 10px 30px;
	display: block;
	background: url("../images/assets/strapline-bg.png");
	}
	
	
#aboutLtf .about .box h4 div.arrow{
	width: 0;
	height: 0;
	border-bottom: 50px solid #000;
	border-bottom: 50px solid rgba(0, 0, 0, 0.7);
	border-right: 50px solid transparent;
	position: absolute;
	top: -50px;
	left: 50px;
}	


#aboutLtf .about img{
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	-moz-opacity: 0;
	-khtml-opacity: 0;
	opacity: 0;
	cursor: pointer;
	}

	
#aboutLtf .about .box p{
	padding: 0 0 20px 0;
}	
	
#aboutLtf .about1{
	top: 0;
	left: 60px;
	}
	
#aboutLtf .about2{top: 55px;left: 330px;}
#aboutLtf .about2 .box{top: 160px;left: -240px;}
#aboutLtf .about2 .box h4 div.arrow{left: 340px;}	
	
#aboutLtf .about3{top: 20px;left: 580px;}
#aboutLtf .about3 .box{top: 200px;left: -400px;}
#aboutLtf .about3 .box h4 div.arrow{left: 440px;border-left: 50px solid transparent;border-right: none;}	
	
#aboutLtf .about4{top: 240px;left: 55px;}
#aboutLtf .about4 .box{top: 200px;left: 40px;}
#aboutLtf .about4 .box h4 div.arrow{left: 200px;}	
	
#aboutLtf .about5{top: 310px;left: 430px;}
#aboutLtf .about5 .box{top: 160px;left: -280px;}
#aboutLtf .about5 .box h4 div.arrow{left: 380px;}	
	
#aboutLtf .about6{top: 410px;left: 720px;}
#aboutLtf .about6 .box{top: 160px;left: -520px;}
#aboutLtf .about6 .box h4 div.arrow{left: 560px;border-left: 50px solid transparent;border-right: none;}	

#aboutLtf .about7{top: 610px;left: 90px;}
#aboutLtf .about7 .box{top: 160px;left: 50px;}
#aboutLtf .about7 .box h4 div.arrow{left: 80px;}	
	
#aboutLtf .about8{top: 540px;left: 370px;}
#aboutLtf .about8 .box{top: 200px;left: -220px;}
#aboutLtf .about8 .box h4 div.arrow{left: 380px;}		





#homepeople .inner{
	text-align: center;
	}
	
#homepeople .inner h4{
	font-size: 38px;
	padding: 0 0 30px 0;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	}


#homepeople .inner p img{
	margin: 15px;
	}

#homepeople .carousel{
	display: block;
	width: 100%;
	max-width: 800px;
	margin: 0 auto;
}

#homepeople .carousel div.item{
	float: left;
	width: 25%;
	text-align: center;
	margin: 0 0 20px 0;
	position: relative;
}

#homepeople .carousel div.item span.bio{
	position: absolute;
	top:-30px;
	left: -9999px;
	z-index: 200;
	background: #333;
	text-align: center;
	float: left;
	width: 200px;
	padding: 20px;
	color: #fff;
	margin: 0 0 0 -120px;
}

#homepeople .carousel div.item:hover span{
	left: 50%;
}

#homepeople .carousel div.item span.bio strong{
	display: block;
}

#homepeople .awards{
	float: left;
	width: 100%;
	text-align: center;
	padding: 20px 0 0 0;
}	
	

#homepeople .awards p{
	display: inline-block;
	padding: 20px 10px;
	margin: 0;
}		
	
#homepeople .awards p strong{
	display: inline-block;
	color: #FBA519;
}		


.homerow{
	float: left;
	width: 100%;
	padding: 30px 0;
	-webkit-box-shadow: 0px 5px 5px 0 rgba(0,0,0,0.50);
	-moz-box-shadow: 0px 5px 5px 0 rgba(0,0,0,0.50);
	box-shadow: 0px 5px 5px 0 rgba(0,0,0,0.50);	
	}


.homebottomrow{	
	background: #2B2E36;
	color: #FFF !important;
	}	

.homerow .textblock{
	float: left;
	width: 48%;
	}

.homerow .textblock h3{
	font-size: 26px;
	padding: 0 0 15px 0;
	font-weight: bold;
	}

.homerow .textblock p{
	font-size: 18px;
	padding: 0 0 15px 0;	
	}
	
.homebottomrow .textblock{
	float: left;
	width: 58%;
	}	
	
.homebottomrow .textblock h3{
	font-size: 24px;
	color: #FFF;
}

.homebottomrow .textblock p{
	font-size: 14px;
	color: #FFF;
	}	
	
.homerow p.button{
	font-size: 20px;
	padding: 20px 0 0 0;
	text-align: center;
	display: block;
	}	

.homebottomrow p.button{
	width: 100%;
	font-size: 16px;
	padding: 20px 0 0 0;
	float: left;
	text-align: center;
	}

	
.homerow .videoblock{
	float: right;
	width: 48%;
	position: relative;
	}	

.homebottomrow  .videoblock{
	float: right;
	width: 38%;
	position: relative;
	}

.homerow .videoblock img{
	float: left;
	width: 100%;
	height: auto;
	}	
	

.homerow .videoblock .videolink{
	float: left;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 200; 
	}
	
.homerow .videoblock .videolink p{
	display: inline-block;
	text-align: center;
	position: absolute;
	bottom: 20%;
	left: 50%;
	color: #fff;
	background: #EE1C79;
	padding: 3px 0;
	margin: 0 0 0 -50px;
	width: 100px;
	font-size: 16px;
	}		


.homebottomrow .btn{
	color: #FF6600;	
	background: #FFF;
	}

.homebottomrow .btn:hover{
	color: #FFF;	
	background: #FF6600;
	}



/*--- homeBoxes ---*/

.homeboxes{
	padding: 0 0 0 0;
}

.homeboxes.nopadding{
	padding: 0 0 0px 0;
}

.homeboxes .box{
	float: left;
	width: 99%;
	margin: 0 2% 0 0;
	padding: 30px 20px;
	box-sizing: border-box;
	color: #FFF;
	text-align: center;
	position: relative;
}

.homeboxes .box:last-child{
	margin: 0;
}

.homeboxes .box .moving{
	display: none;
}

.homeboxes .box:hover .moving{display: inline-block;}
.homeboxes .box:hover .static{display: none;}

.homeboxes .box .fa{
	position: absolute;
	top: 15px;
	right: 15px;
	font-size: 24px;
	cursor: pointer;
	display: none;
	width: 270px;
	height: 60px;
	text-align: right;
}

.homeboxes .brands{background-color: #24CCCD; display:none !important;}
.homeboxes .customers{background-color: #6b9630; display:none !important;}
.homeboxes .systems{background-color: #8dc940;}

.homeboxes .box h2{
	font-size: 28px;
	line-height: 1em;
	padding: 0 0 20px 0;
	text-align: left;
	min-height: 60px;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
}

.homeboxes .box p{
	float: left;
	width: 100%;
	padding: 0;
	text-align: left;
	}

.homeboxes .box p.summary{
	min-height: 120px;
	padding: 0 0 15px 0;
	}

.homeboxes .box p.button{
	margin: 30px 0 0 0;
	}

.homeboxes .box p.button a{
	display: block;
	background: #FF6600;
	color: #FFF;
	text-align: center;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	font-size: 24px;
	padding: 10px;
	-webkit-box-shadow: 2px 2px 0px 0px rgba(0,0,0,0.25);
	-moz-box-shadow: 2px 2px 0px 0px rgba(0,0,0,0.25);
	box-shadow: 2px 2px 0px 0px rgba(0,0,0,0.25);
	-webkit-transition: background-color 150ms ease-in-out;
    -moz-transition: background-color 150ms ease-in-out;
    -o-transition: background-color 150ms ease-in-out;
    transition: background-color 150ms ease-in-out;	
    -webkit-transition: color 150ms ease-in-out;
    -moz-transition: color 150ms ease-in-out;
    -o-transition: color 150ms ease-in-out;
    transition: color 150ms ease-in-out;	
	}
	   

.homeboxes .box p.button a:hover{
	background: #FFF;
	color: #FF6600;	
	}		
		
		
.btn:hover{
	color: #FF6600;	
	background: #FFF;
	}

.homeboxes .box p.link{
	margin: 20px 0 0 0;
	}

.homeboxes .box p.link a{
	display: block;
	background: #FF6600;
	color: #FFF;
	text-align: center;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	font-size: 18px;
	padding: 10px;
	background-color:rgba(0,0,0,0.3);
	-webkit-transition: background-color 150ms ease-in-out;
    -moz-transition: background-color 150ms ease-in-out;
    -o-transition: background-color 150ms ease-in-out;
    transition: background-color 150ms ease-in-out;	
	}
	
.homeboxes .box p.link a:hover{
	background-color:rgba(0,0,0,0.8);
}	


/*--- homequotes ---*/

.homequotes blockquote{
	float: left;
	width: 100%;
	padding: 30px 40px;
	background: #F1F5F8;
	box-sizing: border-box;
}

.homequotes blockquote p{
	font-size: 18px;
	padding: 0 0 5px 0;
	line-height: 1.6em;
}

.homequotes blockquote h6{
	font-size: 18px;
	padding: 0 0 5px 0;
	color: #527325;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
}

.homequotes .line{
	float: left;
	width: 100%;
	height: 5px;
    background: #527325;
    background: -webkit-linear-gradient(left, #527325, #a4e84a); 
    background: -o-linear-gradient(right, #527325, #a4e84a);
    background: -moz-linear-gradient(right, #527325, #a4e84a);
    background: linear-gradient(to right, #527325, #a4e84a);
}



/*-- results-heading --*/	

.results-heading{
	color: #fff;
	background: #414141;
	}

.results-heading .inner{
	max-width: 800px;
	padding: 60px 0 35px 0;
	}

.results-heading.no-padding .inner{
	padding: 60px 0 0 0;
	}


.results-heading h1{
	font-size: 52px;
	color: #FFF;
	padding: 10px 0 40px 0;
	text-align: center;
	font-family: 'Helvetica Neue LT W01_35 Thin', Helvetica, Arial, sans-serif;
	}


.results-heading p.larger{
	font-size: 30px;
	color: #FF6600;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
}

.results-heading.white p.larger{
	color: #FFF;
	}

.results-heading p{
	margin: 0 auto;
	padding: 0 0 30px 0;
	font-size: 22px;
	font-family:'Helvetica Neue LT W01_35 Thin', Helvetica, Arial, sans-serif;
	}

.results-heading p a{
	color: #FF6600;
	}	

.results-heading p a:hover{
	text-decoration: underline;
	}


/*-- solution-heading --*/	

.solution-heading{
	background: #FF6600;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	color: #fff;
	}

.solution-heading .inner{
	text-align: center;
	padding: 60px 0 45px 0;
	}


.solution-heading h1{
	font-size: 60px;
	padding: 10px 0 0 0;
	font-family: 'Helvetica Neue LT W01_35 Thin', Helvetica, Arial, sans-serif;
	}

.solution-heading p{
	font-size: 30px;
	max-width: 800px;
	margin: 0 auto;
	}


/*-- solution-intro --*/	

.solution-intro .inner{
	max-width: 780px;
}

.solution-intro p{
	font-size: 19px;
	line-height: 1.5em;
	padding: 0 0 20px 0;
	}

.solution-intro .inner{
	padding: 60px 0 40px 0;
	}



/*-- solution-sections --*/	

.solution-sections{
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	padding: 0 0 60px 0;
}

.solution-sections .inner{
	max-width: 800px;
	text-align: center;
	}

.solution-sections ul{
	display: inline-block;
}

.solution-sections ul li{
	display: inline-block;
	width:190px;
	margin: 0 0 30px 0;
	text-align: center;
	position: relative;
	vertical-align: top;
}

.solution-sections ul li img{
	display: inline-block;
	width: 115px;
	height 115px;
	margin: 0 0 20px 0;
	border: 2px solid #24CCCD;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	border-radius: 100px;
	vertical-align: top;
}

.solution-sections ul.find-new-customers li img{
	border: 2px solid #6b9630;
}

.solution-sections ul.automate-processes li img{
	border: 2px solid #a4e84a;
}

.solution-sections ul li h3{
	color: #414141;
	font-size: 14px;
}

.solution-sections ul li span.popup{
	position: absolute;
	bottom: 100px;
	left: -9999px;
	z-index: 200;
	background: #333;
	text-align: center;
	float: left;
	width: 200px;
	padding: 20px 20px 0 20px;
	color: #fff;
	margin: 0 0 0 -120px;
}

.solution-sections ul li:hover span.popup{
	left: 50%;
}

.solution-sections ul li span.popup p{
	padding: 0 0 20px 0;
}


/*-- solutions-consultation --*/

.solutions-consultation{
	padding: 0 0 60px 0;
}

.solutions-consultation .inner{
	max-width: 700px;
	position: relative;
	clear: both;
	text-align: center;
}


.solutions-consultation img{
	float: left;
	position: absolute;
	top: 0;
	left: 0;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	border-radius: 100px;
	border: 2px solid #FF6600;
}

.solutions-consultation p{
	display: block;
	padding-left: 130px;
	min-height: 120px;
	position: relative;
	font-size: 19px;
	text-align: left;
	}


.solutions-consultation h6{
	font-size: 24px;
	}


/*-- contact --*/

.contact .inner{
	max-width: 800px;
}


.contact .inner form{
	float: left;
	width: 100%;
	box-sizing: border-box;
	padding: 80px;
	background: #333;
	color: #FFF;
	text-align: center;
}

.contact .inner .location{
	float: left;
	width: 50%;
	box-sizing: border-box;
	padding: 40px 40px 20px 40px;
	color: #FFF;
    background: #527325;
    background: -webkit-linear-gradient(left, #527325, #a4e84a); 
    background: -o-linear-gradient(right, #527325, #a4e84a);
    background: -moz-linear-gradient(right, #527325, #a4e84a);
    background: linear-gradient(to right, #527325, #a4e84a);
	}

.contact .inner .location h3{
	font-size: 34px;
	font-family: 'Helvetica Neue LT W01_35 Thin', Helvetica, Arial, sans-serif;
	padding: 0 0 30px 0;
}

.contact .inner .location p{
	padding: 0 0 30px 0;
	position: relative;
}

.contact .inner .location p img{
	position: absolute;
	top: -27px;
	left: 140px;
	}

.contact .inner .location .btn{
	font-size: 24px;
	padding: 5px 25px 9px 25px;
}

.contact .inner .map{
	float: left;
	width: 50%;
	}

.contact fieldset{
	float: left;
	width: 100%;
	padding: 0 0 30px 0;
}

.contact .select-style{
    width: 100%;
	}

.contact .select{
	float: left;
    width: 100%;
    margin: 0 0 20px 0;
	}

.contact .field{
	float: left;
    width: 100%;
    margin: 0 0 20px 0;
	}


.contact .field textarea, 
.contact .field input{
	float: left;
    width: 100%;
    box-sizing: border-box;
	padding: 10px;
	border: none;
    }


.contact .field textarea{
	min-height: 100px;
}


.contact .checkbox{
	float: left;
	margin: 0px 0 40px 0;
	width: 100%;
	}	

.contact .checkbox span{
	float: right;
	background: #FFF;
	text-align: left;
	padding: 10px 10px;
	height: 46px;
	font-size: 18px;
	box-sizing: border-box;
	width: 90%;
	color: #333;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	}
	
.contact .prettycheckbox{
	float: left;
	background: #FFF;
	padding: 8px 0 8px 0;
	width: 9%;
	text-align: center;
	}

.contact .prettycheckbox label{
	display: none;
}

.contact .prettycheckbox a{
	float: none;
	display: block;
	margin: 0 auto;
}

.contact .error{
	float: left;
	width: 100%;
	color: #FF0000;
	text-align: left;
	font-size: 16px;
}


.contact .submit{
	padding: 0;
}

.contact .submit .btn{
	font-size: 24px;
}
	

/*-- results-consultation --*/

.results-consultation{
	padding: 40px 0 0px 0;
	color: #FFF;
}

.results-consultation .inner{
	max-width: 760px;
	position: relative;
	clear: both;
	text-align: center;
}


.results-consultation img{
	float: left;
	position: absolute;
	top: 0;
	right: 0;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	border-radius: 100px;
/**	border: 2px solid #a4e84a; **/
}

.results-consultation p{
	display: block;
	padding-right: 130px;
	min-height: 120px;
	position: relative;
	font-size: 19px;
	text-align: left;
	}

.results-consultation p a{
	background: #FF6600;
	padding: 0 5px;
	color: #FFF;
	}



/*-- brand-work --*/

.brand-work{
	padding: 0 0 30px 0;
}


.brand-work h3,
.brand-work h4{
	float: left;
	width: 100%;
	padding: 15px;
	font-size: 16px;
	box-sizing: border-box;
    background: #527325;
    color: #fff;
    font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
    background: -webkit-linear-gradient(left, #527325, #a4e84a); 
    background: -o-linear-gradient(right, #527325, #a4e84a);
    background: -moz-linear-gradient(right, #527325, #a4e84a);
    background: linear-gradient(to right, #527325, #a4e84a);
}

.brand-work h3 a{
	float: right;
    color: #fff;
	}

.brand-work h3 a:hover{
	text-decoration: underline;
	}


.brand-work h4{
	padding: 0;
	}
	
.brand-work h4 span{
	float: left;
	padding: 15px;	
	color: #FF6600;
	}	

.brand-work h4 span .fa{	
	color: #FFF;
	font-size: 20px;
	}	

.brand-work h4 a{
	float: left;
	box-sizing: border-box;
	padding: 15px;	
	color: #FFF;
}

.brand-work h4 a:hover,
.brand-work h4 a.here{
	background: #FF6600;
	}


.brand-work ul{
	float: left;
	width: 100%;
	overflow: hidden;
	}	

.brand-work ul li{
	float: left;
	width: 33.333%;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: 50% 50%;
	}
	

.brand-work ul li a{	
	float: left;
	width: 100%;
	position: relative;
	color: #FFF;
	background-color:rgba(0,0,0,0.8);
	-webkit-transition: background-color 200ms linear;
	-moz-transition: background-color 200ms linear;
	-o-transition: background-color 200ms linear;
	transition: background-color 200ms linear;
	}
	
.brand-work ul li a:after {
	content: "";
	display: block;
	padding-bottom: 100%;
}


.brand-work ul li a img{
	position: absolute;
  	top: 50%;
  	left: 50%;
  	transform: translate(-50%, -50%);
  	max-height: 100px;
  	width: auto;
	}


.brand-work ul li a h4{
	float: left;
	width: 100%;
	box-sizing: border-box;
	padding: 15px;
	position: absolute;
	bottom: 0;
	left: -9999px;
	line-height: 1.1em;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	font-size: 21px;
	background: url("../img/gradient.png") repeat-x 0 0;
	}

.brand-work ul li a h4 strong{
	font-size: 48px;
	font-family:'Helvetica Neue LT W01_71488914', Helvetica, Arial, sans-serif;
	}

.brand-work ul li a h4 em{
	font-size: 18px;
	color: #FF6600;
	font-style: normal;
	}

.brand-work ul li a:hover{
	background-color:rgba(0,0,0,0);
	-webkit-box-shadow: 0px -4px 24px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px -4px 24px 0px rgba(0,0,0,0.75);
	box-shadow: 0px -4px 24px 0px rgba(0,0,0,0.75);
	}

.brand-work ul li a:hover img{
	left: -9999px;
	}

.brand-work ul li a:hover h4{
	left: 0;
	}



/*-- partnerships --*/

.partnerships{
	padding: 0 0 30px 0;
}


.partnerships h4{
	float: left;
	width: 100%;
	padding: 15px;
	font-size: 16px;
	box-sizing: border-box;
    background: #527325;
    color: #fff;
    font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
    background: -webkit-linear-gradient(left, #527325, #a4e84a); 
    background: -o-linear-gradient(right, #527325, #a4e84a);
    background: -moz-linear-gradient(right, #527325, #a4e84a);
    background: linear-gradient(to right, #527325, #a4e84a);
}


.partnerships ul{
	float: left;
	width: 100%;
	}	

.partnerships ul li{
	float: left;
	width: 33.333%;
	}

.partnerships ul li.p1{background: #303338;}
.partnerships ul li.p2{background: #158FA1;}
.partnerships ul li.p3{background: #383E4D;}


.partnerships ul li span{	
	float: left;
	width: 100%;
	position: relative;
	color: #FFF;
	-webkit-transition: background-color 200ms linear;
	-moz-transition: background-color 200ms linear;
	-o-transition: background-color 200ms linear;
	transition: background-color 200ms linear;
	}
	
.partnerships ul li span:after {
	content: "";
	display: block;
	padding-bottom: 100%;
}


.partnerships ul li span img{
	position: absolute;
  	top: 50%;
  	left: 50%;
  	transform: translate(-50%, -50%);
  	max-height: 100px;
  	max-width: 80%;
  	width: auto;
	}

.partnerships ul li span h5{
	float: left;
	width: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
	text-align: center;
	padding: 20px;
	box-sizing: border-box;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
}



/*-- awards --*/	

.hideme{
    position: relative;
    left: -3000px;
    -webkit-transition: all 0.8s linear;
	-moz-transition: all 0.8s linear;
	-o-transition: all 0.8s linear;
	transition: all 0.8s linear;
}

.hideme.alt{
	left: auto;
	right: -3000px;
	}

.reached{
	left: 0;
}

.alt.reached{
	left: auto;
	right: 0;
}

.awards{
	overflow: hidden;
}

.awards .award{
	float: left;
	width: 100%;
	background: #333;
	margin: 0 0 40px 0;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	}

.awards .award .image{
	float: left;
	width: 33.3335%;
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: cover;
	min-height: 320px;
	}

.awards .award .textarea{
	float: right;
	width: 66.6666%;
	color: #FFF;
	padding: 25px 25px 50px 25px;
	box-sizing: border-box;
	position: relative;
	}

.awards .award .textarea img{
	float: right;
	}

.awards .award .textarea span{
	display: inline-block;
	padding: 0 0 30px 0;
}

.awards .award .textarea h4{
	padding: 15px 0 0 0;
	color: #FF6600;
}

.awards .award .textarea h2{
	padding: 5px 0 10px 0;
	font-size: 32px;
	line-height: 1.1em;
	font-weight: 300;
}

.awards .award .textarea h3{
	display: block;
	color: #FF6600;
	text-align: right;
}

.awards .award .textarea .how{
	float: left;
	width: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 0;
}

.awards .award .textarea .how a{
	float: right;
	padding: 10px 20px;
	background: #FF6600;
	color: #FFF;
	}

.awards .award .textarea .how em{	
	float: left;
	width: 100%;
	height: 3px;
    background: #527325;
    background: -webkit-linear-gradient(left, #527325, #FF6600); 
    background: -o-linear-gradient(right, #527325, #FF6600);
    background: -moz-linear-gradient(right, #527325, #FF6600);
    background: linear-gradient(to right, #527325, #FF6600);
}	


.awards .alt .image{
	float: right;
	}

.awards .alt .textarea{
	float: left;
	}

.awards .alt .textarea .how a{
	background: #527325;
	}
	
	
.awards .alt .textarea .how em{	
	float: left;
	width: 100%;
	height: 3px;
    background: #FF6600;
    background: -webkit-linear-gradient(left, #FF6600, #527325); 
    background: -o-linear-gradient(right, #FF6600, #527325);
    background: -moz-linear-gradient(right, #FF6600, #527325);
    background: linear-gradient(to right, #FF6600, #527325);
}


.awards .awwwards .textarea span{
	display: block;
	padding: 0 0 30px 0;
	background: #ff5500;
}

.awards .awwwards .textarea span h2{
	display: inline-block;
	}

.awards .awwwards .textarea span h3{
	display: inline-block;
	margin: 0 0 0 20px;
	}


/*-- how-we-work --*/

.how-we-work{
	padding: 0 0 30px 0;
}

.how-we-work ul{
	float: left;
	width: 100%;
	position: relative;
}

.how-we-work ul li{
	float: left;
	width: 16.6666%;
}

.how-we-work.fullsize ul li{
	float: left;
	width: 33.333%;
}

.how-we-work ul li .inside{
	float: left;
	width: 100%;
	position: relative;
}

.how-we-work ul li.box1 .inside:after,
.how-we-work ul li.box2 .inside:after,
.how-we-work ul li.box3 .inside:after,
.how-we-work ul li.box4 .inside:after,
.how-we-work ul li.box5 .inside:after{
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-left-color: #88b7d5;
	border-width: 20px;
	margin-top: -20px;
	z-index: 100;
}

.how-we-work ul li.box6 .inside:after {
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-top-color: #88b7d5;
	border-width: 20px;
	margin-left: -20px;
	z-index: 100;
}

.how-we-work ul li.box7 .inside:after,
.how-we-work ul li.box8 .inside:after,
.how-we-work ul li.box9 .inside:after,
.how-we-work ul li.box10 .inside:after,
.how-we-work ul li.box11 .inside:after,
.how-we-work ul li.box12 .inside:after {
	right: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-right-color: #88b7d5;
	border-width: 20px;
	margin-top: -20px;
	z-index: 100;
}


.how-we-work ul li.box1{background-color:#414143;}
.how-we-work ul li.box1 .inside:after{border-left-color:#414143;}

.how-we-work ul li.box2{background-color:#FF6600;}
.how-we-work ul li.box2 .inside:after{border-left-color:#FF6600;}

.how-we-work ul li.box3{background-color:#24C2CB;}
.how-we-work ul li.box3 .inside:after{border-left-color:#24C2CB;}

.how-we-work ul li.box4{background-color:#26B7C7;}
.how-we-work ul li.box4 .inside:after{border-left-color:#26B7C7;}

.how-we-work ul li.box5{background-color:#25ADC5;}
.how-we-work ul li.box5 .inside:after{border-left-color:#25ADC5;}

.how-we-work ul li.box6{background-color:#27A3C2;}
.how-we-work ul li.box6 .inside:after{border-top-color:#27A3C2;}


.how-we-work ul li.box12{background-color:#2498BF;}
.how-we-work ul li.box12 .inside:after{border-right-color:#2498BF;}

.how-we-work ul li.box11{background-color:#268DBB;}
.how-we-work ul li.box11 .inside:after{border-right-color:#268DBB;}

.how-we-work ul li.box10{background-color:#2383B8;}
.how-we-work ul li.box10 .inside:after{border-right-color:#2383B8;}

.how-we-work ul li.box9{background-color:#247AB5;}
.how-we-work ul li.box9 .inside:after{border-right-color:#247AB5;}

.how-we-work ul li.box8{background-color:#256DB2;}
.how-we-work ul li.box8 .inside:after{border-right-color:#256DB2;}

.how-we-work ul li.box7{background-color:#8dc940;}
.how-we-work ul li.box7 .inside:after{border-right-color:#8dc940;display: none;}



.how-we-work ul li span{
	float: left;
	width: 100%;
	position: relative;
	}

.how-we-work ul li span:after {
	content: "";
	display: block;
	padding-bottom: 100%;
}


.how-we-work ul li span strong{
	float: left;
	width: 100%;
	position: absolute;
	bottom: 15px;
	left: 15px;
	font-size: 30px;
	font-family: 'Helvetica Neue LT W01_35 Thin', Helvetica, Arial, sans-serif;
	line-height: 1.1em;
	color: #FFF;
	}

.how-we-work ul li span .fa{
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -20px 0 0 -20px;
	font-size: 40px;
	color: #FFF;
	}


.how-we-work ul li span h5{
	float: left;
	width: 100%;
	position: absolute;
	bottom: 10px;
	left: 0;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	font-size: 14px;
	color: #FFF;
	text-align: center;
	}

.how-we-work ul li .text{
	display: none;
}


.how-we-work ul:hover li{opacity: 0.2;}
.how-we-work ul:hover li .inside:after{opacity: 0.1;}

.how-we-work ul:hover li:hover{opacity: 1;}
.how-we-work ul:hover li .inside:hover:after{opacity: 1;}

.how-we-work ul:hover li.box1:hover{opacity: 0.2;}
.how-we-work ul:hover li.box1 .inside:hover:after{opacity: 0.1;}

.how-we-work ul:hover li.box2:hover .text,
.how-we-work ul:hover li.box3:hover .text,
.how-we-work ul:hover li.box4:hover .text,
.how-we-work ul:hover li.box5:hover .text,
.how-we-work ul:hover li.box6:hover .text{left: 0;}

.how-we-work ul:hover li.box7:hover .text,
.how-we-work ul:hover li.box8:hover .text,
.how-we-work ul:hover li.box9:hover .text,
.how-we-work ul:hover li.box10:hover .text,
.how-we-work ul:hover li.box11:hover .text,
.how-we-work ul:hover li.box12:hover .text{left: 0;top: 0%;}




/*-- how-we-work-full --*/

.how-we-work-full{
	padding: 0 0 30px 0;
}

.how-we-work-full ul{
	float: left;
	width: 100%;
	position: relative;
}

.how-we-work-full ul li{
	float: left;
	width: 33.333%;
}


.how-we-work-full .alignleft,
.how-we-work-full .alignright{
	float: left;
	width: 100%;
	position: relative;
	}

.how-we-work-full .alignleft li{
	float: left;
}


.how-we-work-full .alignright li{
	float: right;
}

.how-we-work-full ul li .inside{
	float: left;
	width: 100%;
	position: relative;
}

.how-we-work-full ul li.ar .inside:after{
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-left-color: #88b7d5;
	border-right-color: transparent !important;
	border-bottom-color: transparent !important;
	border-top-color: transparent !important;
	border-width: 40px;
	margin-top: -40px;
	z-index: 100;
}

.how-we-work-full ul li.ab .inside:after {
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-top-color: #88b7d5;
	border-right-color: transparent !important;
	border-bottom-color: transparent !important;
	border-left-color: transparent !important;
	border-width: 40px;
	margin-left: -40px;
	z-index: 100;
}

.how-we-work-full ul li.al .inside:after{
	right: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-right-color: #88b7d5;
	border-top-color: transparent !important;
	border-bottom-color: transparent !important;
	border-left-color: transparent !important;
	border-width: 40px;
	margin-top: -40px;
	z-index: 100;
}


.how-we-work-full ul li.box1{background-color:#FFF;}
.how-we-work-full ul li.box1 .inside:after{border-left-color:#FFF;}

.how-we-work-full ul li.box2{background-color:#FF6600;}
.how-we-work-full ul li.box2 .inside:after{border-color:#FF6600;}

.how-we-work-full ul li.box3{background-color:#24C2CB;}
.how-we-work-full ul li.box3 .inside:after{border-color:#24C2CB;}

.how-we-work-full ul li.box4{background-color:#26B7C7;}
.how-we-work-full ul li.box4 .inside:after{border-color:#26B7C7;}

.how-we-work-full ul li.box5{background-color:#25ADC5;}
.how-we-work-full ul li.box5 .inside:after{border-color:#25ADC5;}

.how-we-work-full ul li.box6{background-color:#27A3C2;}
.how-we-work-full ul li.box6 .inside:after{border-color:#27A3C2;}


.how-we-work-full ul li.box12{background-color:#2498BF;}
.how-we-work-full ul li.box12 .inside:after{border-color:#2498BF;}

.how-we-work-full ul li.box11{background-color:#268DBB;}
.how-we-work-full ul li.box11 .inside:after{border-color:#268DBB;}

.how-we-work-full ul li.box10{background-color:#2383B8;}
.how-we-work-full ul li.box10 .inside:after{border-color:#2383B8;}

.how-we-work-full ul li.box9{background-color:#247AB5;}
.how-we-work-full ul li.box9 .inside:after{border-color:#247AB5;}

.how-we-work-full ul li.box8{background-color:#256DB2;}
.how-we-work-full ul li.box8 .inside:after{border-color:#256DB2;}

.how-we-work-full ul li.box7{background-color:#8dc940;}
.how-we-work-full ul li.box7 .inside:after{border-color:#8dc940;display:}



.how-we-work-full ul li span{
	float: left;
	width: 100%;
	position: relative;
	}

.how-we-work-full ul li span:after {
	content: "";
	display: block;
	padding-bottom: 100%;
}


.how-we-work-full ul li span strong{
	float: left;
	width: 100%;
	position: absolute;
	bottom: 25px;
	left: 25px;
	font-size: 45px;
	font-weight: normal;
	font-family: 'Helvetica Neue LT W01_35 Thin', Helvetica, Arial, sans-serif;
	line-height: 1.1em;
	color: #414141;
	}

.how-we-work-full ul li span .fa{
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -30px 0 0 -30px;
	font-size: 60px;
	color: #FFF;
	}


.how-we-work-full ul li span h5{
	float: left;
	width: 100%;
	position: absolute;
	bottom: 20px;
	left: 0;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	font-size: 18px;
	color: #FFF;
	text-align: center;
	}

.how-we-work-full ul li .text{
	display: none;
	}

.fancybox-wrap .text{
	padding: 40px 20px ;
	margin: 0;
	text-align: center;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
}

.fancybox-wrap .text .fa{
	font-size: 50px;
	color: #FF6600;
	}

.fancybox-wrap .text h5{
	font-size: 24px;
	padding: 10px 0 10px 0;
	}

.fancybox-wrap .text p{
	font-size: 18px;
	}


.how-we-work-full ul:hover li{opacity: 0.1;}
.how-we-work-full ul:hover li .inside:after{opacity: 0.05;}

.how-we-work-full ul:hover li:hover{opacity: 1;}
.how-we-work-full ul:hover li .inside:hover:after{opacity: 1;}

.how-we-work-full ul:hover li.box1:hover{opacity: 1;}
.how-we-work-full ul:hover li.box1 .inside:hover:after{opacity: 1;}

.how-we-work-full ul:hover li:hover .text{left: 0; top:100%;}

.how-we-work-full ul:hover .lastrow li:hover .text{left: 0; top:-100%;}



.how-we-work-full{
	overflow: hidden;
}

.how-we-work-full ul .work-row{
	float: left;
	width: 100%;
}

.how-we-work-full ul .work-row li{
	position: relative;
	}

.how-we-work-full ul .work-row li.box1,
.how-we-work-full ul .work-row li.box7{
	right: -2000px;
	-webkit-transition: right 1000ms linear;
	-moz-transition: right 1000ms linear;
	-o-transition: right 1000ms linear;
	transition: right 1000ms linear;
}

.how-we-work-full ul .work-row li.box2,
.how-we-work-full ul .work-row li.box8{
	right: -4000px;
	-webkit-transition: right 1400ms linear;
	-moz-transition: right 1400ms linear;
	-o-transition: right 1400ms linear;
	transition: right 1400ms linear;
}

.how-we-work-full ul .work-row li.box3,
.how-we-work-full ul .work-row li.box9{
	right: -6000px;
	-webkit-transition: right 1800ms linear;
	-moz-transition: right 1800ms linear;
	-o-transition: right 1800ms linear;
	transition: right 1800ms linear;
}

.how-we-work-full ul .work-row li.box1{
	right: 0;
}

.how-we-work-full ul .reached li.box2,
.how-we-work-full ul .reached li.box3,
.how-we-work-full ul .reached li.box7,
.how-we-work-full ul .reached li.box8,
.how-we-work-full ul .reached li.box9{
	right: 0;
}


.how-we-work-full ul .work-row li.box4,
.how-we-work-full ul .work-row li.box10{
	left: -2000px;
	-webkit-transition: left 1000ms linear;
	-moz-transition: left 1000ms linear;
	-o-transition: left 1000ms linear;
	transition: left 1000ms linear;
}

.how-we-work-full ul .work-row li.box5,
.how-we-work-full ul .work-row li.box11{
	left: -4000px;
	-webkit-transition: left 1400ms linear;
	-moz-transition: left 1400ms linear;
	-o-transition: left 1400ms linear;
	transition: left 1400ms linear;
}

.how-we-work-full ul .work-row li.box6,
.how-we-work-full ul .work-row li.box12{
	left: -6000px;
	-webkit-transition: left 1800ms linear;
	-moz-transition: left 1800ms linear;
	-o-transition: left 1800ms linear;
	transition: left 1800ms linear;
}

.how-we-work-full ul .reached li.box4,
.how-we-work-full ul .reached li.box5,
.how-we-work-full ul .reached li.box6,
.how-we-work-full ul .reached li.box10,
.how-we-work-full ul .reached li.box11,
.how-we-work-full ul .reached li.box12{
	left: 0;
}


/*-- home --*/	


#home h1{
	float: left;
	width: 100%;
	font-size: 25px;
	font-weight: bold;
	text-align: center;
	padding: 35px 0;
	}

#home h1 em{
	font-style: normal;
	color: #FF6600;
	}	

#home ul{
	float: left;
	width: 100%;
	}
	
#home li{
	float: left;
	width: 300px;
	margin: 0 30px 30px 0;
	-webkit-box-shadow: 4px 4px 0px 0px #FFF;
	-moz-box-shadow:    4px 4px 0px 0px #FFF;
	box-shadow:         4px 4px 0px 0px #FFF;	
	}
	
#home li.ltf{
	margin: 0 0 3px 0;
	}


#home li a{
	color: #4D4D4D;
	}
	
#home li a span.about{
	display: block;
	padding: 0 20px;
	text-align: center;
	background: #FFF;
    -webkit-transition: background-color 150ms ease-in-out;
    -moz-transition: background-color 150ms ease-in-out;
    -o-transition: background-color 150ms ease-in-out;
    transition: background-color 150ms ease-in-out;			
	}

#home li a span.about h3{
	display: none;
	min-height: 65px;
	padding: 15px 0 0 0;
	font-size: 18px;
	color: #FFF;
	}
	
#home li a span.about p{
	min-height: 74px;
	padding: 6px 0 0 0;
	color: #4D4D4D;	
	}

#home li a span.about p em{
	font-weight: bold;
	font-style: normal;	
	color: #FF6600;
	}		

#home li a span.about:hover{
	background: #7899b6 !important;
	}

#home li a span.about:hover h3{
	display: block;
	}
	
#home li a span.about:hover p{
	display: none;	
	}
	
#home li h4{
	display: block;
	text-align: right;
	padding: 5px 0;
	font-size: 18px;
	color: #7899b6;
	}
	

#home li img{
	float: left;
	width: 100%;
	height: auto;
	border-bottom: 1px solid #FFF;
	}	
	
	
#home li .box{
	float: left;
	padding: 0;
	width: 100%;
	color: #FFF;
	background: #7899b6;
	font-size: 14px;
	position: relative;
	-webkit-box-shadow: 10px 10px 0px 0px #E6E6E6;
	-moz-box-shadow:    10px 10px 0px 0px #E6E6E6;
	box-shadow:         10px 10px 0px 0px #E6E6E6;	
	}
	
#home li .box .padding{
	float: left;
	padding: 15px 5% 70px 5%;
	width: 90%;
	min-height: 230px;
	}	
	
#home li .box h2{
	font-size: 28px;
	text-align: center;
	padding: 0 0 20px 0;
	}
	

#home li .box .more{
	float: left;
	width: 100%;
	text-align: center;
	position: absolute;
	bottom: 30px;
	left: 0;
	}




#home li .box span{
	display: inline-block;
	padding: 7px 15px;
	color: #FF6600;	
	background: #FFF;
	font-size: 16px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	border: none;
	-webkit-box-shadow: 3px 3px 0px 0px #ccc;
	-moz-box-shadow:    3px 3px 0px 0px #ccc;
	box-shadow:         3px 3px 0px 0px #ccc;
	cursor: pointer;
	behavior: url("pie/PIE.htc");
    -webkit-transition: background-color 150ms ease-in-out;
    -moz-transition: background-color 150ms ease-in-out;
    -o-transition: background-color 150ms ease-in-out;
    transition: background-color 150ms ease-in-out;	
    -webkit-transition: color 150ms ease-in-out;
    -moz-transition: color 150ms ease-in-out;
    -o-transition: color 150ms ease-in-out;
    transition: color 150ms ease-in-out;	    	
	}		


#home li .box span:hover{
	color: #FFF;	
	background: #FF6600;
	}
	
#home li .box .videolink{
	float: left;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 200; 
	}
	
#home li .box .videolink p{
	display: inline-block;
	text-align: center;
	position: absolute;
	bottom: 20%;
	left: 50%;
	color: #fff;
	background: #EE1C79;
	padding: 3px 0;
	margin: 0 0 0 -50px;
	width: 100px;
	font-size: 16px;
	}	
	
#sharer .share{
	float: left;
	width: 100%;
	text-align: center;
	padding: 20px 0 40px 0;
	}

#sharer .share span{
	float: none;
	display: inline-block;
	}	
	

#home li.klarifi .box{
	background: #2B2E36;
	}
	
#home li.klarifi a span.about:hover{
	background: #2B2E36 !important;
	}	

#home li.klarifi h4{		
	color: #2B2E36;
	}	
	
#home li.ltf .box{
	background: #FF6600;
	}

#home li.ltf a span.about:hover{
	background: #FF6600 !important;
	}

#home li.ltf h4{		
	color: #FF6600;
	}
	
			
			

/*-- products --*/	
	
#products li{
	float: left;
	width: 300px;
	border: 1px solid #E6E6E6;	
	margin: 0 30px 60px 0;
	-webkit-box-shadow: 4px 4px 0px 0px #FFF;
	-moz-box-shadow:    4px 4px 0px 0px #FFF;
	box-shadow:         4px 4px 0px 0px #FFF;	
	}
	

#products li img{
	float: left;
	}		
	
	
#products li.last{
	margin: 0 0 60px 0;
	}
	
#products li div{
	float: left;
	width: 258px;
	padding: 30px 20px;
	border-top: none;
	}
		

#products li:hover{		
	-webkit-box-shadow: 4px 4px 0px 0px #E6E6E6;
	-moz-box-shadow:    4px 4px 0px 0px #E6E6E6;
	box-shadow:         4px 4px 0px 0px #E6E6E6;	
	border-color: #999999;	
	}
	
#products li:hover div{		

	}
	
	
#products li h3{
	text-align: center;
	font-size: 20px;
	}
	

#products li h5{
	text-align: center;
	font-size: 14px;
	padding: 0 0 20px 0;
	}


#products li h5 a{
	color: #ff883c;
	}	
	

#products li h4{
	font-size: 17px;
	padding: 0 0 10px 0;
	}	
	

#products li p{
	font-size: 14px;
	}		
		
#products li span{
	float: left;
	width: 258px;
	margin: 30px 0 30px 0;
	}		
		
#products li span a{
	float: left;
	width: 128px;
	text-align: center;
	height: 128px;
	position: relative;	
	margin-right: 1px;
	}
	
#products li span a img{
	width: 100%;
	height: auto;
	}


	
#products li span a i.fa-search{
	position: absolute;
	bottom: 0;
	left: 0;
	float: left;
	color: #FFF;
	width: 25px;
	height: 25px;
	line-height: 25px;
	font-size: 13px;
	background: #999999;				
	-webkit-transition: all 0.1s linear;
    -moz-transition: all 0.1s linear;
    -o-transition: all 0.1s linear;
    transition: all 0.1s linear;						
	}	
	
	
#products li span a:hover i.fa-search{	
	background: #000;
	width: 35px;
	height: 35px;
	line-height: 35px;
	font-size: 16px;					
	}		
	
#products li span a i.fa-play{
	position: absolute;
	bottom: 50%;
	left: 50%;
	float: left;
	color: #FFF;
	width: 44px;
	padding: 0 0 0 6px;
	height: 50px;
	line-height: 50px;
	margin: 0 0 -26px -26px;
	font-size: 20px;
	text-align: center;
	background: #999999;
	background: rgba(0,0,0,0.6);
	border: 2px solid #FFF;
	-webkit-border-radius: 40px;
	-moz-border-radius: 40px;
	border-radius: 40px;						
	-webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
    behavior: url("pie/PIE.htc");						
	}	
	
#products li span a:hover i.fa-play{	
	background: #000;				
	}
	
	
#products li .more{
	text-align: center;
	font-size: 18px;
	}		
	

/*-- blog --*/	
	
	
#blog{
	float: left;
	width: 100%;
	text-align: center;
	margin: -75px 0 0 0;
	}	
	
#blog.cs-header{
	margin: -350px 0 0 0;
}	

#blog .inner{
	position: relative;
	}

#blog .crumb{
	float: left;
	width: 100%;
	padding: 10px 30px;
	box-sizing: border-box;
	color: #fff;
    position: relative;
    z-index: 2;
}

#blog .crumb span{
    position: relative;
    z-index: 3;
}

#blog .crumb em{
	background: #527325;
    background: -webkit-linear-gradient(left, #527325, #a4e84a); 
    background: -o-linear-gradient(right, #527325, #a4e84a);
    background: -moz-linear-gradient(right, #527325, #a4e84a);
    background: linear-gradient(to right, #527325, #a4e84a);
    opacity: 0.8;
    z-index: 1;
	position: absolute; top: 0; left: 0; width: 100%; height: 100%;
	}

#blog .crumb a{
	color: #fff;
	}

#featured{
	float: left;
	width: 100%;
	box-sizing: border-box;
	padding: 30px 30px 20px 30px;
	margin: 0 0 0 0;
	background: #fff;
	}


#featured.full{
	padding: 30px 30px 50px 30px;
	}

#featured span{
	display: block;
	height: 180px;
	overflow: hidden;
	z-index: 10;
	position: relative;
	}	

#featured span .fade{
	float: left;
	width: 100%;
	z-index: 100;
	height: 56px;
	position: absolute;
	bottom: 0;
	left: 0;
	background: url("../images/assets/fade.png") repeat-x 0 100%;
}

#featured h1{
	font-size: 60px;
	line-height: 1.2em;
	padding: 0px 0 20px 0;
	color: #414042;
	font-family: 'Helvetica Neue LT W01_35 Thin', Helvetica, Arial, sans-serif;
	}

#featured h1 a{
	color: #414042 !important;
	}
	
#featured h2{
	font-size: 30px;
	padding: 10px 0 20px 0;
	}

#featured h3{
	clear: both;
	font-size: 22px;
	padding: 10px 0 20px 0;
	}

#featured h4{
	font-size: 19px;
	padding: 10px 0 20px 0;
	}

#featured h5{
	padding: 0 0 0px 0;
	color: #527325;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	}

#featured p:first-of-type{
	font-size: 30px !important;
	line-height: 1.5em;
	padding: 0 0 20px 0;
	color: #527325;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	}	

#featured p{
	line-height: 1.5em;
	padding: 0 0 20px 0;
	}	

#featured ul,
#featured ol{
	padding: 0 0 10px 0;
	}
	
#featured ul li{
	padding: 0 0 10px 20px;
	line-height: 1.4em;
	background: url("../images/assets/bullet-orange.png") no-repeat 0 8px;
	}
	

#featured ol li{
	margin: 0 0 10px 20px;	
	list-style: decimal;
}
			

#featured .meta{
	padding: 0 0 0px 0;
	font-size: 17px;
	color: #FF6600;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	}	
	

#featured a{
	color: #FF6600;
	}	
	
	
#featured p img{
	display: block;
	width: 100%;
	height: auto;
	margin: 20px 0 20px 0;
	}


#featured p img.alignRight{
	width: auto;
	float: right;
	margin: 0 0 20px 20px;
	}

#featured a.fancybox{
	display: block;
	position: relative;
	}	

#featured a.fancybox i.fa-search{
	position: absolute;
	bottom: 0;
	left: 0;
	float: left;
	color: #FFF;
	width: 25px;
	height: 25px;
	line-height: 25px;
	font-size: 13px;
	background: #999999;
	text-align: center;				
	-webkit-transition: all 0.1s linear;
    -moz-transition: all 0.1s linear;
    -o-transition: all 0.1s linear;
    transition: all 0.1s linear;						
	}	
	
	
#featured a.fancybox:hover i.fa-search{	
	background: #000;
	width: 35px;
	height: 35px;
	line-height: 35px;
	font-size: 16px;					
	}		

#featured h6{
	float: left;
	width: 100%;
	margin: 20px 0 30px 0;
	padding: 30px 0 30px 0;
	border-top: 1px solid #799AB7;
	border-bottom: 1px solid #799AB7;
	}

#featured h6 span{
	display: block;
	text-align: center;
	}
	
#featured h6 img{
	display: inline-block;
	margin: 0 0 20px 0;
}	

#featured blockquote {
	display: block;
	margin: 0 0 30px 0;
	background: #F1F5F8;
	}

#featured blockquote p{
	font-size: 16px !important;
	padding: 20px !important;
	margin: 0;
	color: #414141 !important;
	font-family: 'Fauna One', georgia, serif !important;
	}

#featured blockquote p:first-of-type{
	font-size: 16px !important;	
	}
	
#featured blockquote:after{
	content: "";
	float: left;
	width: 100%;
	height: 5px;
    background: #527325;
    background: -webkit-linear-gradient(left, #527325, #a4e84a); 
    background: -o-linear-gradient(right, #527325, #a4e84a);
    background: -moz-linear-gradient(right, #527325, #a4e84a);
    background: linear-gradient(to right, #527325, #a4e84a);
}	
	
#featured blockquote p em{
	font-style: normal;
	font-size: 13px;
	color: #333;
	}


#featured h1 a,
#featured .meta a{
	color: #7899b6;
	}			


#featured.full p strong{
	color: #000;
	font-weight: normal;
	}

#featured.full p{
	font-size: 17px;
}

#featured.full p a{
	color: #FF6600;
	}

#featured.full p a:hover{
	text-decoration: underline;
}

.share{
	float: left;
	width: 100%;
	font-size: 12px;
	margin: 20px 0 0 0;
	}

.share i{
	font-size: 16px;
	}

.share span{
	float: left;
	padding: 0 15px;
	height: 35px !important;
	line-height: 38px;
	color: #FFF;
	border-right: 1px solid #FFF;
	cursor: pointer;
	-webkit-transition: background-color 200ms linear;
	-moz-transition: background-color 200ms linear;
	-o-transition: background-color 200ms linear;
	transition: background-color 200ms linear;
	}
	

.share span em{
	font-style: normal;
	}	

	
.share span.st_facebook_custom{background: #4680c0;}	
.share span.st_facebook_custom i{padding: 0 10px 0 0;}

.share span.st_twitter_custom{background: #56cdf3;}	
.share span.st_twitter_custom i{padding: 0 10px 0 0;}

.share span.st_linkedin_custom{background: #007bb6;}
.share span.st_googleplus_custom{background: #dd4b39;}
.share span.st_email_custom{background: #ccc;}
.share span.st_sharethis_custom{background: #ff883c;}


.share span:hover{
	background: #EE1C79;
	}

.share span a{
	color: #fff;
	}


#featured p a.btn{
	color: #fff;
	}
	
	
#featured .address p{
	float: left;
	width: 50%;
	margin-top: 40px;
	font-size: 15px;
	}	


#comments .inner{
	padding: 20px 0;
	}
	
#comments .comment{
	float: left;
	width: 100%;
	padding: 20px 0 20px 0 !important;
	margin: 0 0 20px 0 !important;
	border-bottom: 1px solid #FFF;
	}	
	

#comments h3{
	font-size: 44px;
	}	
	
	
#comments #comment_form	h3{
	font-size: 34px;
	padding: 0 0 20px 0;
	}	


#comments #comment_form{
	float: left;
	width: 48%;
	margin-bottom: 20px;
	}
	
	
#comments #comment_form .field,
#comments #comment_form .textarea{
	float: left;
	width: 100%;
	margin: 0 0 10px 0;
	}	
	
#comments #comment_form .field label,
#comments #comment_form .textarea label{
	float: left;
	width: 24%;
	}	


#comments #comment_form .field input{
	float: right;
	width: 73%;
	padding: 1%;
	border: 1px solid #999;
	}	

#comments #comment_form textarea{
	float: right;
	width: 73%;
	padding: 1%;	
	border: 1px solid #999;
	}


#comments #comment_form .submit{
	padding-left: 24%;
	}	
	
		

#comments .textBox{
	float: right;
	width: 48%;
	padding: 64px 0 20px 0;
	}
	

#comments .textBox h4{
	font-size: 22px;
	padding: 0 0 20px 0;
	color: #FFF;
	}		
		

#blog #form{
	padding-bottom: 40px;
	}


#blog #form form{
	padding: 30px 0 0 0;
	margin: 0;
	}
	
	
.paddedTop{
	padding-top: 40px !important;
	}

#blog .inner{
	position: relative;
}

#blog .jump-menu{
	float: right;
	width: 200px;
}

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

	#blog .jump-menu.moving{
		position: fixed;
		top: 50px;
		right: 50px;
		z-index: 300;
	}

}


#blog .jump-menu dt{
	display: block;
	padding: 5px 10px;
	margin: 0 0 3px 0;
	color: #FFF;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	background-color:#FF6600;
	}

#blog .jump-menu dd{
	display: block;
}

#blog .jump-menu dd a{
	display: block;
	padding: 5px 10px;
	margin: 0 0 3px 0;
	color: #FFF;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	background-color:#fcc8a4;
	-webkit-transition: background-color 200ms linear;
	-moz-transition: background-color 200ms linear;
	-o-transition: background-color 200ms linear;
	transition: background-color 200ms linear;
	}


#blog .jump-menu dd a:hover{
	background-color:#FF6600;
	}

.case-study{
	float: left;
	width: 100%;
	max-width: 960px;
	box-sizing: border-box;
	padding: 70px;
	background: #fff;
	}

.case-study h1{
	font-size: 60px;
	line-height: 1.2em;
	padding: 0px 0 20px 0;
	color: #414042;
	font-family: 'Helvetica Neue LT W01_35 Thin', Helvetica, Arial, sans-serif;
	}
	
.case-study h2{
	font-size: 17px;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	color: #FF6600;
	padding: 0 0 5px 0;
	}

.case-study  h3{
	clear: both;
	font-size: 22px;
	padding: 10px 0 20px 0;
	}

.case-study  h4{
	font-size: 19px;
	padding: 10px 0 20px 0;
	}

.case-study  h5{
	padding: 0 0 0px 0;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	}


.case-study p{
	font-size: 19px;
	line-height: 1.5em;
	padding: 0 0 20px 0;
	}	

.case-study ul,
.case-study ol{
	padding: 0 0 10px 0;
	}
	
.case-study ul li{
	padding: 0 0 10px 20px;
	line-height: 1.4em;
	background: url("../images/assets/bullet-orange.png") no-repeat 0 8px;
	}
	

.case-study ol li{
	margin: 0 0 10px 20px;	
	list-style: decimal;
}
	

.case-study a{
	color: #FF6600;
	}	

.case-study .results-story{
	float: left;
	width: 100%;
	padding: 0 0 40px 0;
	}

.case-study .results-story p{
	font-size: 30px;
	color: #527325;
	line-height: 1.3em;
	font-family: 'Helvetica Neue LT W01_35 Thin', Helvetica, Arial, sans-serif;
	}


.case-study .results-change{
	float: left;
	width: 100%;
	padding: 40px 40px 20px 40px;
	background: #527325;
	color: #FFF;
	box-sizing: border-box;
	}
	
.case-study .results-change h2{
	color: #FFF;
	}	


.case-study .results-mobile{
	float: left;
	width: 100%;
	text-align: center;
	}
	
.case-study .results-mobile img{
	display: inline-block;
	max-width: 100%;
	height: auto;
	}

.case-study .results-mobile p{
	float: left;
	width: 100%;
	padding: 40px 40px 20px 40px;
	font-size: 17px;
	background: #F1F5F8;
	box-sizing: border-box;
	text-align: center;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	}


.case-study .results-solutions{
	float: left;
	width: 100%;
	margin: 0 0 0 0;
	background: #FF6600;
	color: #FFF;
	box-sizing: border-box;
	}

.case-study .results-solutions .inside{
	padding: 40px 40px 20px 40px;
	}
	
.case-study .results-solutions h2{
	color: #FFF;
	}	

.case-study .results-solutions .laptop{
	float: left;
	width: 100%;
	margin: 10px 0 30px 0%;
	}

.case-study .results-achieved{
	float: left;
	width: 100%;
	padding: 40px 40px 40px 40px;
	margin: 0 0 -20px 0;
	background: #8dc940;
	color: #FFF;
	box-sizing: border-box;
	}
	
.case-study .results-achieved h2{
	color: #FFF;
	}	

.case-study .desktop{
	float: left;
	width: 100%;
	}

.case-study .results-quote{
	float: left;
	width: 100%;
	}

.case-study .results-quote h4{
	float: left;
	width: 100%;
	background: #587c28;
	padding: 10px 30px;
	color: #FFF;
	box-sizing: border-box;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	font-size: 17px;
	}

.case-study .results-section{
	float: left;
	width: 100%;
	}

.case-study .results-quote blockquote{
	float: left;
	width: 100%;
	background: #abbc91 url("../img/results-quote-bg.png") no-repeat 20px 20px;
	padding: 30px 30px 10px 30px;
	color: #FFF;
	box-sizing: border-box;
	}

.case-study .results-quote blockquote p{
	font-size: 25px;
	font-family: 'Helvetica Neue LT W01_35 Thin', Helvetica, Arial, sans-serif;
	line-height: 1.2em;
	padding: 0 0 20px 0;
	}


.results-scrolling{
	float: left;
	width: 820px;
	height: 687px;
	background-image: url("../img/results-desktop-scrolling.png");
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: cover;
}

.results-scrolling .image{
	float: left;
	width: 730px;
	height: 416px;
	overflow: hidden;
	overflow-y: scroll;
	background: #FFF;
	margin: 41px 0 0 45px;
}

.results-scrolling .image img{
	float: left;
	width: 100%;
	}

.results-scrolling .image::-webkit-scrollbar {
        -webkit-appearance: none;
        width: 10px;
    }
.results-scrolling .image::-webkit-scrollbar-thumb {
        border-radius: 4px;
        background-color: rgba(0,0,0,.5);
        -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
    }


.results-video{
	float: left;
	width: 820px;
	height: 687px;
	background-image: url("../img/results-desktop-scrolling.png");
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: cover;
}

.results-video iframe{
	float: left;
	width: 730px;
	height: 416px;
	margin: 41px 0 0 45px;
}


.result-row{
	float: left;
	width: 100%;
}

.result-row li{
	position: relative;
	bottom: -4000px;
	-webkit-transition: bottom 1400ms linear;
	-moz-transition: bottom 1400ms linear;
	-o-transition: bottom 1400ms linear;
	transition: bottom 1400ms linear;
}

.result-row li:first-child{
	bottom: -2000px;
	-webkit-transition: bottom 1000ms linear;
	-moz-transition: bottom 1000ms linear;
	-o-transition: bottom 1000ms linear;
	transition: bottom 1000ms linear;
}

.result-row li:last-child{
	bottom: -6000px;
	-webkit-transition: bottom 1800ms linear;
	-moz-transition: bottom 1800ms linear;
	-o-transition: bottom 1800ms linear;
	transition: bottom 1800ms linear;
}

.result-row.reached li{
	bottom: 0;
}



#sideBar{
	float: right;
	width: 310px;
	/*-- padding-bottom: 920px; --*/
	}

	
#sideBar.maps{
	padding-bottom: 0;
	}
	
	
#sideBar.maps iframe{
	float: left;
	width: 100%;
	margin: 0 0 20px 0;
	}	
	
#sideBar.maps h4{
	float: left;
	padding: 20px 10%;
	width: 80%;
	background: #799AB7;
	color: #FFF;
	font-size: 22px;
	line-height: 1em;
	}	

#sideBar.maps h4 span{
	font-size: 17px;
	}	
	
#sideBar .feature{
	float: left;
	width: 100%;
	padding: 35px 0 0 0;
	font-size: 17px;
	}

#sideBar .feature a{	
	color: #799AB7;
	}			

#sideBar .feature a img{
	float: left;
	width: 100%;
	height: auto;
	}
	

#sideBar .feature a h4{
	float: left;
	width: 100%;
	padding: 10px 0;
	font-size: 22px;
	}
	
	
#archives{
	float: right;
	width: 310px;
	padding-bottom: 50px;
	/*-- position: absolute;
	bottom: 50px;
	right: 0; --*/
	}	

/*-- pagination --*/	
	
#pagination .inner{
	display: block;
	max-width: 900px;
	background: #F1F5F8;
	padding: 10px;
	box-sizing: border-box;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	}

#pagination .inner a{
	color: #527325;
	padding: 0 0 0 10px;
}

#pagination .inner strong{
	padding: 0 0 0 10px;
}

/*-- threeCol --*/	

#threeCol{
	padding: 40px 0 30px 0;
	}

#threeCol .col{
	float: left;
	width: 33.333%;
	padding: 20px;
	box-sizing: border-box;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	position: relative;
	}

#threeCol .col1 .show_button{
	position: absolute;
	bottom: 10px;
	right: 20px;
	color: #FFF;
	cursor: pointer;
	display: none;
}
	
#threeCol .col1{background: #FF6600;}	
#threeCol .col2{background: #527325;}	
#threeCol .col3{background: #2865AD;}	
	
#threeCol .col3 #form{
	padding: 0;
	width: 100%;
	padding: 20px;
	box-sizing: border-box;
	background: none;
	}	
	
#threeCol .last{
	padding: 0 0 0 0;
	}	
	
#archives .col{
	padding: 30px 0 0 0;
	}	

#threeCol .col h4,
#archives .col h4{
	color: #FFF;
	font-size: 22px;
	padding: 0 0 15px 0;
	}
	
	
#threeCol .col p{
	padding: 0 0 10px 0;
	}	

#threeCol .col ul{
	float: left;
	width: 100%;
}

#threeCol .col li,
#archives .col li{
	padding: 0 0 5px 0;
	}
	

#threeCol .col a,
#archives .col a{
	color: #FFF;
	-webkit-transition: color 0.2s linear;
    -moz-transition: color 0.2s linear;
    -o-transition: color 0.2s linear;
    transition: color 0.2s linear;	
}	

#threeCol .col em,
#archives .col em{
	font-style: normal;
	color: #666;
	padding: 0 0 0 0;
	}
	
#threeCol .col a:hover,
#archives .col a:hover{
	color: #FF6600;
}	

/*-- who --*/	
	
	
#who{
	float: left;
	width: 100%;
	height: 683px;
	text-align: center;
	background: #999 url("../images/assets/office-bg.jpg") no-repeat 0 0;
	background-size: cover;	
	margin: 100px 0 0 0 ;
	}	
	

#who .title{
	float: left;
	width: 90%;
	background: #799AB7;
	font-size: 48px;
	padding: 25px 5%;
	margin-top: -100px;
	color: #FFF;
	}	
	
	
#who .more{
	float: left;
	width: 100%;
	position: absolute;
	bottom: 30px;
	font-size: 22px;
	}	
	
	

/*-- quote --*/		
	

#quote{
	padding: 55px 0 90px 0;
	}	
	
#quote .image{
	float: left;
	width: 165px;
	text-align: center;
	color: #799AB7;
	}
	
	
#quote .image img{
	float: left;
	width: 100%;
	margin: 0 0 10px 0;
	border: 2px solid #799AB7;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;		
	behavior: url("pie/PIE.htc");
	}
	

#quote .image p{
	padding: 10px;
	}	


#quote blockquote{
	float: left;
	width: 480px;
	padding: 10px 0 0 40px;
	margin: 0 70px;
	font-size: 17px;
	background: url("../images/assets/quote-left.png") no-repeat 0 0;
	}	
	
	
#quote blockquote span{	
	float: left;
	width: 480px;
	padding: 0 40px 0 0;
	background: url("../images/assets/quote-right.png") no-repeat 100% 80%;
	}
	

#quote blockquote p,
#quote blockquote cite{
	padding: 0 0 30px 0;
	line-height: 1.6em;
	}		
	
	
#quote blockquote cite{
	color: #799AB7;
	}
	
	

/*-- why --*/		
	
#why{
	background: #799AB7;
	color: #FFF;
	}
	

#why .inner{
	text-align: center;
	}
	
	
#why .pixel{
	display: inline-block;
	border: 3px solid #799AB7;
	-webkit-border-radius: 76px;
	-moz-border-radius:76px;
	border-radius: 76px;
	margin: -57px 0 0 0;
	behavior: url("pie/PIE.htc");	
	}


#why h3{
	font-size: 43px;
	padding: 10px 0 20px 0;	
	}
	
	
#why p{
	font-size: 22px;
	line-height: 1.6em;
	width: 75%;
	margin: 0 auto;
	padding: 0 0 30px 0;	
	}	


	
		
/*-- ourWork --*/

#ourWork{
	}
	
#ourWork .inner{
	padding: 70px 0 40px 0;	
	text-align: center;
	background: url("../images/assets/arrow-blue.png") no-repeat 50% 0;
	}

#blocks{
	float: left;
	width: 100%;
	margin: 0 0 40px 0;	
	}
	
#blocks .item {
	width: 25%;
	}
	
#blocks .item.w2 {
	width: 50%;
	}
	
#blocks .item img{
	width:100%;
	height: auto;
	}
	

#ourWork p .btn{
	font-size: 22px;
	margin-top: 30px;
	}	


/*-- portfolio --*/

#portfolio{
	float: left;
	width: 100%;
	margin: 0 0 0 0;
	border-bottom: 1px solid #FFF;	
	}
	
#portfolio .item {
	width: 20%;
	}
	
#portfolio .item.w2 {
	width: 40%;
	}
	
#portfolio .item img{
	width:100%;
	height: auto;
	}


/*-- steps --*/	

#steps{
	text-align: center;
	float: left;
	width: 100%;
    background: #527325;
    background: -webkit-linear-gradient(left, #527325, #a4e84a); 
    background: -o-linear-gradient(right, #527325, #a4e84a);
    background: -moz-linear-gradient(right, #527325, #a4e84a);
    background: linear-gradient(to right, #527325, #a4e84a);
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	margin: 0 0 20px 0;
	}

#steps li{
	float: left;
	width: 25%;
	background: #333;
	}

#steps li span{
	float: left;
	width: 100%;
	color: #FFF;
	height: 40px;
	line-height: 40px;
	position: relative;
	}

#steps li#step1.here,
#steps li#step2.here,
#steps li#step3.here,
#steps li#step4.here{
	background: none;
}

#steps li.here span:after {
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(136, 183, 213, 0);
	border-width: 20px;
	margin-top: -20px;
}

#steps li#step1.here span:after{border-left-color: #0089C1;}
#steps li#step2.here span:after{border-left-color: #009AC6;}
#steps li#step3.here span:after{border-left-color: #00ADCA;}





.diagnostic{
	padding: 0;
	color: #FFF;
}

.twoCols{
	float: left;
	width: 100%;
	background: #333;
	color: #FFF;
	}

.leftCol{
	float: left;
	width: 500px;
	box-sizing: border-box;
	padding: 30px  30px 30px 30px !important;
	}

.rightCol{
	float: right;
	width: 350px;
	padding: 30px;
	}
	

.rightCol .field input{
	border: none;
	background: #fff;
	border: 1px solid #FFF;
	width: 94%;
	padding: 10px 3%;
	margin: 5px 0 0 0;
	}
	
.rightCol .highlight label,
.highlight span{
	color: #990000;
	}

.rightCol .highlight input{	
	border: 1px solid #990000;
	}

.rightCol .btn{
	width: 100%;
	box-sizing: border-box;
	text-align: center;
	font-size: 20px;
}


#intro{
	float: left;
	width: 100%;
	}

#intro blockquote{
	float: left;
	width: 100%;
	box-sizing: border-box;
	color: #FFF;
	background: #333;
	text-align: left;

}

#intro blockquote:after{
	content: "";
	float: left;
	width: 100%;
	height: 5px;
    background: #527325;
    background: -webkit-linear-gradient(left, #527325, #a4e84a); 
    background: -o-linear-gradient(right, #527325, #a4e84a);
    background: -moz-linear-gradient(right, #527325, #a4e84a);
    background: linear-gradient(to right, #527325, #a4e84a);
}	

#intro blockquote p{
	padding: 30px;
	}

.questions{
	float: left;
	width: 100%;
	}
	
.questions li{
	float: left;
	width: 100%;
	border-bottom: 1px solid #333;
	}
	
.questions li span{
	float: left;
	width: 70%;
	padding: 25px 0;
	}				


.select-style{
    float: right;
    width: 25%;
    height: 40px;
    overflow: hidden;
    margin: 15px 0 0 0;
	background: #FFF url("../img/select-arrow.png") no-repeat 100% 50%;
	background-size: 43px auto;
	box-sizing: border-box;
	}
	
.select-style select {
        background: transparent;
        width: 100%;
        padding: 5px 45px 5px 10px;
        font-size: 16px;
        line-height: 30px;
        border: 0;
        border-radius: 0;
        height: 40px;
        -webkit-appearance: none;
        cursor:pointer;
        box-sizing: border-box;
   }
	

.questions h5{
	float: left;
	width: 100%;
	padding: 30px 0 20px 0;
	}
	
.questions h5 span{
	float: right;
	width: 200px;
	}
	

.questions .button{
	float: right;
	width: 25%;
	margin: 30px 0 0 0;
	}

.questions .button .btn{
	width: 100%;
	box-sizing: border-box;
	text-align: center;
	font-size: 20px;
}	

form.diagnostic{
	display: none;
	}
	
	
#loading{
	float: left;
	width: 100%;
	height: 631px;
	line-height: 631px;
	text-align: center;
	}
	
	
#finalResults{
	float: left;
	width: 100%;
	height: 910px;
	padding: 30px 0 0 0;
	}

#theResult{
	float: right;
	width: 175px;
	text-align: center;
	margin: 0 0 40px 40px;
	}
	
#theResult strong{
	font-size: 90px;
	letter-spacing: -10px;
	}	
		

#order{
	float: right;
	width: 175px;
	margin: 0 0 40px 40px;
	}
	
	
#order img{
	float: left;
}

#order a span{
	float: left;
	width: 145px;
	padding: 15px;
	text-align: center;
	background: #333;
	color: #FFF;	
	}	


#order a:hover span{
	background: #FF6600;
}


#finalResults h3{
	font-size: 30px;
	color: #FF6600;
	}	
	
#finalResults ul{
	float: left;
	width: 100%;
	padding: 0 0 20px 0;
	}
	

#finalResults li{
	display: none;
	float: left;
	background: none;
	padding: 0 10px 10px 0;
	}


#finalResults li.show{
	display: block;
	}	

#finalResults li a{	
	float: left;
	width: 280px;
	padding: 5px 10px;
	background: #333;
	color: #FFF;
	}	
		

#finalResults li a:hover{
	background: #FF6600;
	}			
	

/*-- preFooter --*/


#preFooter{
	
	}

#preFooter.alt{
	}
	
#preFooter .bg,
#preFooter .bg2,
.fadeBack{
	float: left;
	width: 100%;
	background: url("../images/assets/shadow-top.png") repeat-x 0 0;	
	}	

#preFooter .bg2{
	background: url("../images/assets/shadow-btm.png") repeat-x 0 100% ;	
	}

#enquiry{
	float: right;
	width: 47%;
	padding: 20px 0 40px 3%;	
	background: #527325;
    background: -webkit-linear-gradient(left, #527325, #a4e84a); 
    background: -o-linear-gradient(right, #527325, #a4e84a);
    background: -moz-linear-gradient(right, #527325, #a4e84a);
    background: linear-gradient(to right, #527325, #a4e84a);	
	}	

#guide,
.alt #enquiry{
	float: left;
	width: 47%;
	padding: 20px 3% 40px 0;	
	}

	
#preFooter h4{
	font-size: 48px;
	color: #FFF;
	padding: 0 0 20px 0;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	}

#enquiry h4{
	color: #FFF;
	text-align: left;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	}
	

#guide h6{
	position: relative;
	text-align: center;
	}
	

#guide h6 span{
	position: absolute;
	top: 80px;
	left: 0;
	display: inline-block;
	width: 260px;
	padding: 0 85px;
	color: #fff;
	font-size: 20px;
	}
	
	
#block{
	float: right;
	width: 50%;
	text-align: left;
	padding: 20px 0 0 0;
	color: #FFF;	
	
	background: #6b9630;
	}	
	

	
#block #report{
	float: left;
	width: 450px;
	padding: 0 0 30px 30px;
	}


#block #report h4{
	font-size: 35px;
}	

#block #report p{
	padding: 0;
	margin: 0;
	float: left;
	width: 100%;
	}	


#block #report p.button{
	text-align: center;
	padding: 20px 0 0 0;
	}	

#block #report .btn{
	float: none;
	display: inline-block;
	margin: 0 auto;
	}	
	
	
#block #latest{
	float: left;
	width: 100%;
	background: #2B2E36;
	}
	
	
#block #latest #padding{
	float: left;	
	width: 450px;
	padding: 40px 0 60px 30px;	
	}
	

#block #latest h5{
	font-size: 28px;
	padding: 0 0 10px 0;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	}		

#block #latest a{
    -webkit-transition: color 150ms ease-in-out;
    -moz-transition: color 150ms ease-in-out;
    -o-transition: color 150ms ease-in-out;
    transition: color 150ms ease-in-out;
    color: #FFF;
    }	

#block #latest h5 a{
	color: #FFF;
	}	

#block #latest p a{
	color: #c1b7af;
	}
	
	
#block #latest a:hover{
	color: #FF6600;	
	}	
	
	
	
#preFooter .btn{
	font-size: 22px;
	}	

#guide .btn,
#block .btn{	
	float: right;
	margin: 20px 0 0 0;
	-webkit-box-shadow: 2px 2px 0px 0px rgba(0,0,0,0.3);
	-moz-box-shadow:    2px 2px 0px 0px rgba(0,0,0,0.3);
	box-shadow:         2px 2px 0px 0px rgba(0,0,0,0.3);
	}
	

#enquiry .inside{
	float: right;
	width: 450px;
	}
	
	
#enquiry label{
	position: absolute;
	left: -9999px;
	}			
	
	
#enquiry .field input,
#enquiry .textarea textarea{
	border: none;
	background: #FFF;
	width: 94%;
	padding: 10px 3%;
	margin: 0 0 10px 0;
	font-size: 20px;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
}


#enquiry .field input{
	height: 26px;
	}

#enquiry .textarea textarea{
	height: 70px;
	}

#enquiry .checkbox{
	float: left;
	margin: 0px 0 20px 0;
	width: 100%;
	}	

#enquiry .checkbox span{
	float: right;
	background: #FFF;
	text-align: left;
	padding: 8px 10px;
	height: 46px;
	font-size: 20px;
	box-sizing: border-box;
	width: 90%;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	}
	
#enquiry .prettycheckbox{
	float: left;
	background: #FFF;
	padding: 8px 0 8px 0;
	width: 9%;
	text-align: center;
	}

#enquiry .prettycheckbox a{
	float: none;
	display: block;
	margin: 0 auto;
}	
	
	
#enquiry .submit{
	float: right;
	margin: 10px 0 0 0;
	width: 100%;
	}	
	
	
.unhappyMessage{display: block;color: #FFF;font-size: 13px;padding: 0 0 10px 0;}	
	

/*-- footer --*/

#footer{
	padding: 40px 0 40px 0;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	text-align: center;
	}
	
	
#footer .schema div{display:inline-block;}	


	
#footer .links{
	display: block;
	margin: 0 auto 0 auto;
	font-size: 14px;
	}

#footer .links a.email{
	font-size: 22px;
	}
	
#footer .links a{color: #4d4d4d;}	
		
#footer .links a.email:hover{color: #FF6600;}

#footer .links a.phone{
	font-size: 22px;
	}
	
#footer .links .social-links{
	font-size: 24px;
	padding: 0 20px;
}

#footer .links .social-links a{
	color: #FF6600;
	margin: 0 10px;
	}
	
#footer p{
	text-align: center;
	color: #444;
	font-size: 14px;
	padding: 0 0 20px 0;
	}
	
	
#footer .share{
	float: left;
	width: 100%;
	text-align: center;
	padding: 0 0 20px 0;
	}
	

#footer .share span{
	float: none;
	display: inline-block;
	}
	

#footer .social{
	float: right;
	width: 100%;
	text-align: center;
	}	


#footer .social a{	
	color: #FF6600;
	font-size: 25px;
	margin: 0 0 0 5px;	
    -webkit-transition: color 150ms ease-in-out;
    -moz-transition: color 150ms ease-in-out;
    -o-transition: color 150ms ease-in-out;
    transition: color 150ms ease-in-out;		
	}	
	

#footer .social a:hover{		
	color: #7A98B6;
	}
	
#footer .nav{
	clear: both;
	display: block;
	text-align: center;
	padding: 20px 0 0 0;
	}	
	
#footer .nav li{
	display: inline-block;
	border-right: 1px solid #4d4d4d;
	}
	
#footer .nav li:last-child{
	border-right: none;
	}	
	
#footer .nav li a{
	display: block;
	line-height: 1em;	
	font-size: 14px;
	padding: 0 10px 0 5px;
	color: #4d4d4d;
	}
	
#footer .nav li a:hover{		
	color: #FF6600;
	}
	
	
body.dark #footer p,
body.dark #footer a,
body.dark #footer .nav li a{	
	color: #FFF !important;
	}	
	
body.dark #footer .links .social-links a{	
	color: #FF6600 !important;	
	}	
	
	
/*-- added for klarifi --*/	
	
#feature-boxes{
	float: left;
	width: 100%;
	text-align: center;
	}
	
	
#feature-boxes .features-box{
	float: left;
	width: 19.5%;
	padding: 150px 2% 2% 2%;
	margin: 0 2% 0 0;
	min-height: 390px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	background: #EEE;
	-webkit-box-shadow: 0px 6px 0px 0px #ccc;
	-moz-box-shadow: 0px 6px 0px 0px #ccc;
	box-shadow: 0px 6px 0px 0px #ccc;
	position: relative;
	}
	
	
#feature-boxes .features-box .image{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 150px;
	display: table;
	}
	
#feature-boxes .features-box .image .in{
	display: table-cell;
	vertical-align: middle;
	}		
	
#feature-boxes .last{
	margin: 0;
	}	
	
#feature-boxes .features-box h3{
	font-size: 21px;
	}
	
#feature-boxes .features-box p{
	font-size: 14px;
	}	
	
	
.text .content h6{
	font-size: 24px;
	padding: 0 0 40px 0;
	margin: -20px 0 0 0;
	}
	
	
.text .content h4{
	font-size: 24px;
	padding: 20px 0 20px 0;
	}	
	
#benefits-boxes{
	float: left;
	width: 100%;
	text-align: center;
	}
	
	
#benefits-boxes .features-box{
	float: left;
	width: 23.5%;
	padding: 190px 0 0 0;
	margin: 0 2% 0 0;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	background: #EEE;
	position: relative;
	}
	

#benefits-boxes .photo_bg{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 190px;
	display: table;
	-webkit-border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	}	
	
#benefits-boxes .photo_bg .circle-wrap{	
	display: table-cell;
	vertical-align: middle;
	}
	
	
#benefits-boxes .photo_bg .circle-wrap img{
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	border-radius: 100px;
	border: 4px solid #ccc;
	width: 70%;
	}			
	
#benefits-boxes .features-box h4{
	font-size: 21px;
	padding: 5% 2% 5px 2%;
	}
	
#benefits-boxes .features-box p{
	font-size: 14px;
	padding: 0 2%;
	min-height: 130px;
	}	
	
	
#benefits-boxes .social-block{
	float: left;
	width: 100%;
	background: #4d4d4d;
	-webkit-border-bottom-left-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-moz-border-radius-bottomleft: 5px;
	-moz-border-radius-bottomright: 5px;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;	
	-webkit-box-shadow: 0px 6px 0px 0px #333;
	-moz-box-shadow: 0px 6px 0px 0px #333;
	box-shadow: 0px 6px 0px 0px #333;	
	}				
	
#benefits-boxes .social-block a{
	display: block;
	color: #FFF;
	padding: 10px 0;	
	font-size: 22px;
	}	

#benefits-boxes .last{
	margin: 0;
	}
	
	
#pricelists{
	float: left;
	width: 100%;
	text-align: center;
	padding: 40px 0 0 0;
	}
	
	
#pricelists .prices{
	float: left;
	width: 100%;
	margin: 0;
	padding: 0;
	}	
	
	
#pricelists .prices li{
	float: left;
	width: 24%;	
	margin: 0 0 40px 0;
	padding: 0;
	list-style: none;
	background: #ddd;
	}	

#pricelists .prices li.double{
	width: 44%;	
	margin: 0 2% 40px 2%;
	}

#pricelists .prices li.full{
	width: 100%;	
	margin: 0 0 40px 0;
	}

#pricelists .prices li h3{
	display: block;
	background: #777;
	padding: 10px;
	color: #fff;
	font-size: 24px;
	-webkit-border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;	
	}
	
#pricelists .prices li.double h3{	
	background: #4d4d4d;
	}	
	
#pricelists .prices li h2{
	display: block;
	background: #87A3BD	;
	padding: 10px;
	color: #fff;
	font-size: 30px;
	}
	
#pricelists .prices li h2 span{
	font-size: 15px;
	}	
	
#pricelists .prices li p{
	display: block;
	padding: 15px 10px;
	color: #000;
	font-size: 15px;
	}
	
	
	
#pricelists .prices li p:nth-child(odd){
	background: #F3F3F3;
	}	

#pricelists .prices li h6{
	display: block;
	padding: 10px;
	color: #000;
	background: #4d4d4d;
	font-size: 18px;
	-webkit-border-bottom-left-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-moz-border-radius-bottomleft: 5px;
	-moz-border-radius-bottomright: 5px;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;		
	}
	

#pricelists .padded{
	font-size: 14px;
	padding: 0 0 40px 0;
	}
	
	
.text .content div ol,
.text .content div ol li{
	float: left;
	width: 100%;
	background: none;
	}
	
.text .content div ol li{
	margin: 0 0 30px 0;
	}	
	
.text .content div ol img{
	float: right;
	margin: 0 0 0 30px;
	}	
	
img#main{
	float: left;
	width: 100%;
	height: auto;
	margin: -50px 0 0 0;
	padding: 0 0 40px 0;
	}
	
.text .content img.half{
	float: left;
	width: 50%;
	}


.text .content table{
	float: left;
	width: 100%;
	margin: 0 0 30px 0;
	border: none;
	border-top: 1px solid #CCC;
	border-left: 1px solid #CCC;
	}	
	
.text .content table td{
	padding: 15px;
	border: none;
	border-bottom: 1px solid #CCC;
	border-right: 1px solid #CCC;
	vertical-align: top;
	}		
	
#contentslides{
	float: left;
	width: 100%;
	margin: 0 0 40px 0;
}				

#contentslides li{
	float: left;
	width: 100%;
	background: none;
	margin: 0;
	padding: 0;
	text-align: center;
	position: relative;
	}
	
#contentslides li img{
	width: 100% !important;
	height: auto !important;
	max-width: 425px !important;
	}	
	
#contentslides .flex-direction-nav .flex-prev{
	position: absolute;
	top: 70px !important;
	left: 0px;
	float: left;
	width: 61px;
	height: 124px;
	text-indent: -9999px;
	z-index: 200;
	background: url("../images/assets/more-arrows.png") no-repeat 0 0;
	}

#contentslides .flex-direction-nav .flex-next{
	position: absolute;
	top: 70px;
	right: 0;
	float: left;
	width: 61px;
	height: 124px;
	text-indent: -9999px;	
	z-index: 200;	
	background: url("../images/assets/more-arrows.png") no-repeat -61px 0;	
	}
	
	
#contentslides .flex-control-nav{
	display: none;
	position: absolute;
	bottom: -30px;
	right: 20px;
	z-index: 300;
	}

#contentslides .flex-control-nav li{
	float: left;
	margin: 0 0 0 10px;	
	}
	
#contentslides .flex-control-nav li a{
	float: left;
	text-indent: -9999px;
	width: 9px;
	height: 9px;
	background: #BCCDDD;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	cursor: pointer;
	}
	
#contentslides .flex-control-nav li a.flex-active{	
	background: #FFF;
	}
	
/*-- profile mouseover effect --*/	

.imageBlock{
	position: relative;
	display: inline-block;
	}
	
.imageBlock .caption{
	position: absolute !important;
	bottom: 100px;
	left: -50px;
	display: block;
	width: 200px;
	height: auto !important;
	padding: 10px !important;
	background: #333;
	color: #FFF;
	font-size: 14px;
	z-index: 1000;
	line-height: 1.5em;
	}
	
.imageBlock:hover .caption{
	display: block !important;
	}	
	
.imageBlock .caption strong{
	display:block;
	color: #fff !important;
	font-size: 16px;
	}		


.imageBlock.floatRight{
	float: right;
	}
	
.imageBlock.floatLeft{
	float: left;
	}
	

/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen 
and (max-width : 960px){


	#logo{display: none;}
	#logo-mobile{display: block;}
	#logo-mobile img{box-sizing: border-box;padding: 0 10px;height: auto;}	

	.row .inner{width: 740px;}
	
	.strapline h1,.strapline h3{padding: 30px 0 0 0;}
	.strapline h4{font-size: 30px;}
	#results{width: 74%;padding: 20px 13%;}
	#slider .slides li .about{width: 70%;padding: 60px 15% 40px 15%;}
	#quote blockquote{width: 380px;}
	#quote blockquote span{width: 340px;}
	
	#navigation > li > a{float: left;padding: 0 8px;font-size: 16px;}
	#call a{font-size: 18px;}		
	
	#pageHeader.home .strapline{float: none;max-width: 740px;margin: 0 auto;}
	
	#pageHeader blockquote{width: 540px;font-size: 18px;}

	#pageHeader .casestudy{height: 450px;}

	#aboutLtf .background{width: 100%;}
	#aboutLtf .about1{top: 0;left: 0px;}
	#aboutLtf .about2{top: 45px;left: 230px;}
	#aboutLtf .about2 .box{top: 160px;left: -180px;}
	#aboutLtf .about2 .box h4 div.arrow{left: 300px;}	
	#aboutLtf .about3{top: 0px;left: 440px;}	
	#aboutLtf .about4{top: 180px;left: 0px;}
	#aboutLtf .about5{top: 260px;left: 320px;}
	#aboutLtf .about6{top: 350px;left: 560px;}
	#aboutLtf .about6 .box{top: 160px;left: -480px;}
	#aboutLtf .about6 .box h4 div.arrow{left: 500px;border-left: 50px solid transparent;border-right: none;}	
	#aboutLtf .about7{top: 510px;left: 20px;}
	#aboutLtf .about8{top: 460px;left: 270px;}
	#aboutLtf .about .box{width: 600px;}

	#intro img{margin: 0;width:100%;height: auto;}

	#examples .flex-direction-nav .flex-prev{top: 180px;}
	#examples .flex-direction-nav .flex-next{top: 180px;}

	#serviceList li{width: 225px;margin: 0 10px 40px 10px;}

	#products li{width: 240px;margin: 0 10px 60px 0;}
	#products li img{width: 100%;height: auto;}
	#products li div{width: 218px;padding: 30px 10px;}	
	#products li h3{font-size: 16px;}
	#products li h5{font-size: 12px;}
	#products li h4{font-size: 15px;}
	#products li span{width: 218px;}
	#products li span a{width: 108px;height: 108px;}		
	
	#block #report .btn{margin: 15px 0 0 0;}

	#featured .address p{width: 45%;padding: 0 5% 0 0;}

	.filters dl{padding: 0 0 10px 0;}			
	.filters dd{width: 45%;}

	#people .profiles li li{width: 205px;padding: 0 20px;}

	#clientList li.c3{margin-right: 0;}
	#clientList li.last{margin-right: 26px;}

	#featured p:first-of-type{font-size: 20px !important;}	
	.share em{display: none;}
	.share span.st_facebook_custom{margin: 0 0 10px 0;}
	.share span.st_facebook_custom i{padding: 0 0px 0 0;}
	.share span.st_twitter_custom i{padding: 0 0px 0 0;}
	
	#sideBar{width: 220px;}
	#archives{float: right;width: 220px;}
	#form{width: 180px;padding: 30px 20px 10px 20px;}
	
	#preFooter h4{font-size: 32px;}
	#preFooter #guide h6 img{width: 100%;height: auto;}
	#preFooter #guide h6 span{width: 220px;font-size: 16px;top: 70px;padding: 0 65px;}
	#footer .share{margin: 0 0 20px 100px;}		
	
	.leftCol{width: 400px;}
	.rightCol{width: 250px;}
	
	#intro{height: auto;}
	
	.questions{width: 100%;height: auto;}	

	.questions li span{width: 60%;}				
	.questions li .select-style{width: 35%;margin: 20px 0;}

	#loading{height: 631px;line-height: 631px;}
	#finalResults{height: auto;padding: 30px 0 30px 0;}

	#comments #comment_form{width: 100%;}
	#comments .textBox{width: 100%;padding: 40px 0 40px 0;}

	#footer .links{font-size: 12px;}

	#block #report{width: 340px;}	
	#block #latest #padding{width: 340px;}
	#enquiry .inside{width: 340px;}	

	#blueprint .inner{width: 740px;}
	#blueprint .inner .content{width: 400px;}	


	.results-scrolling{
		width: 660px;
		height: 553px;
	}

	.results-scrolling .image{
		width: 590px;
		height: 340px;
		margin: 33px 0 0 36px;
	}
	
	.results-video{
		width: 660px;
		height: 553px;
	}

	.results-video iframe{
		width: 590px;
		height: 340px;
		margin: 32px 0 0 36px;
	}

/*--- homeBoxes ---*/

.homeboxes{
	padding: 0 0 40px 0;
}

.homeboxes .box{
	padding: 20px 15px;
}

.homeboxes .box h2{
	font-size: 22px;
}


.homeboxes .box p.summary{
	min-height: 160px;
	}


.homeboxes .box p.button a{
	font-size: 24px;
	}

.homeboxes .box p.link a{
	font-size: 16px;
	padding: 10px;
	}


/*--- homequotes ---*/

.homequotes blockquote{
	padding: 10px 20px;
}

.homequotes blockquote p,
.homequotes blockquote h6{
	font-size: 16px;
}

/*-- added for klarifi --*/	
	
#feature-boxes .features-box{
	width: 21.5%;
	padding: 150px 1% 2% 1%;
	min-height: 450px;
	}
	
	
#feature-boxes .features-box h3{
	font-size: 18px;
	}
	
#feature-boxes .features-box p{
	font-size: 14px;
	}			


#benefits-boxes .features-box h4{
	font-size: 18px;
	}

	
#benefits-boxes .features-box p{
	min-height: 180px;
	}
	
.imageBlock .caption{
	left: -20px;
	width: 130px;
	}	

/*-- .brand-work --*/	

.brand-work ul li a h4{
	font-size: 20px;
	}

.brand-work ul li a h4 strong{
	font-size: 38px;
	}

.brand-work ul li a h4 em{
	font-size: 18px;
	}


.how-we-work ul li span{
	float: left;
	width: 100%;
	position: relative;
	}

.how-we-work ul li span:after {
	content: "";
	display: block;
	padding-bottom: 100%;
}


.how-we-work ul li span strong{
	width: 100px;
	font-size: 20px;
	}

.how-we-work ul li span .fa{
	margin: -15px 0 0 -15px;
	font-size: 30px;
	}

.how-we-work ul li span h5{
	font-size: 13px;
	}

.how-we-work ul li .text{
	padding: 10px 0;
	font-size: 13px;
}



.case-study{
	padding: 40px;
	}

	
}






@media only screen 
and (max-width : 960px)
and (min-width : 740px) {	
	
	#home li{
		float: left;
		width: 240px;
		margin: 0 10px 10px 0;
	}
	
	#home li .box{
		-webkit-box-shadow: 5px 5px 0px 0px #E6E6E6;
		-moz-box-shadow:    5px 5px 0px 0px #E6E6E6;
		box-shadow:         5px 5px 0px 0px #E6E6E6;	
	}

	#home li a span.about{
		padding: 0 10px;	
	}

	#home li a span.about h3{
		min-height: 95px;
		padding: 15px 0 0 0;
	}
	
	#home li a span.about p{
		min-height: 104px;
		padding: 6px 0 0 0;
	}

	#home li .box .padding{
		float: left;
		padding: 15px 5% 70px 5%;
		width: 90%;
		min-height: 260px;
	}
	
}		




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

	#navigation{display:block !important;}

}


@media only screen 
and (max-width : 740px){



	#dropdown{display: none}

	body{padding: 0 0 0 0;}
	#header{position: relative;top: auto;height: auto;}
	#nav{top: auto;position: relative;height: auto;}


	#breadcrumb .inner{padding: 0;}
	
	.row .inner{width: 300px;padding-top: 30px;}
	
	#logo{width: 100%;text-align: center;}
	#logo img{width: 100%;max-width: 80%;height: auto;display: inline-block;}
	
	.klarifiPage #logo img{width: 70%;}
	
	#services{display: none;}
	
	#header .inner{position: relative;padding: 0;}
	#menu{display: block;float: right;position: absolute;top:0;right:0;text-align: right;}
	#call{position: absolute;top:2px;left: 10px;}
	#call a{font-size: 18px;}
	
	.homepage #call{width: 100%;position: relative;top:auto;right: auto;text-align: center;}
	
	#phone{margin: 0;position: absolute;top: 80px;right: 0;z-index: 300;}
	
	#nav .inner{width: 320px;height: 25px;}
	
	#nav .inner{width: 300px;}
	.navBg{float: left;width: 100%;background: #000;background: rgba(0,0,0,0.8);position: absolute;top: 55px;left: 0;z-index: 1000;}
	#navigation,#menu span.middle{display: block;width: 320px;margin: 0 auto;}
	#menu span.button{display: inline-block;height: 55px;line-height: 55px;padding: 0 10px;color:#FFF;cursor: pointer;font-size: 24px;}
	
	#menu span.button:hover{background: #FF6600;}
	
	#navigation{display: none;padding: 0;width: 300px;font-size: 18px;background: #FF6600;
	-webkit-box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.35);
	-moz-box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.35);
	box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.35);}
	#navigation li{width: 300px;}	
	#navigation > li > a{width: 100%;box-sizing: border-box;text-align: right;padding: 0 35px;}	
	#navigation #nav-sub-home a{float: left;width: 100%;text-indent: 0;background: none;}
	#navigation > li > ul{position: relative;left: auto;top: auto;padding: 0;opacity: 1;}
	#navigation > li:hover > ul{left: auto;}
	#navigation > li > ul > li > a{width: 100%;box-sizing: border-box;text-align: right;padding: 10px 35px;background-color:rgba(0,0,0,0.3) !important;font-size: 16px;}
	

	#slider .slides li{padding: 240px 0 0 0;}

	#pageHeader.home .strapline h1{	
		max-width: 300px;
	}	
	
	#pageHeader .casestudy{height: 380px;}

	#showcase .strapline{top: 120px;height: 70px;}
	.strapline img{display: none;}
	.strapline h1,.strapline h3{padding: 13px 0 0 0;font-size: 24px;}
	.strapline h4{font-size: 16px;}

	#pageHeader blockquote{width: 240px;font-size: 16px;padding: 20px;margin:130px auto 70px auto;}
	#pageHeader .strapline{height: auto;padding: 10px 0;}
	#pageHeader .strapline h1, #pageHeader .strapline h3{padding: 0 0 0 0;font-size: 24px;}
	#pageHeader .blogImage{height: 240px;}	
	#pageHeader .titleOnly{height: 44px;}
	
	#pageHeader.home .titleOnly{height: auto;}
	
	#pageHeader.home .strapline{
		overflow: show;
		height: auto;
		position: relative !important;
		padding: 40px 40px 20px 40px;
		box-sizing: border-box;
		}
		
	#pageHeader.home .strapline h1{padding: 0;font-size: 26px;}	

	#aboutLtf .about img{
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
	opacity: 1;
	cursor: pointer;
	max-width: 290px;
	}
	
	.homerow .textblock,
	.homerow .videoblock{width: 100%;}
	
	 .homerow .textblock{margin-bottom: 30px;}
	 
	 #homepeople .inner h4{font-size: 32px;}
	 #homepeople .inner p img{
	margin: 0 0 10px 0;
	}
	
	#aboutLtf{padding-top: 30px;}
	#aboutLtf .background{display: none;}
	#aboutLtf .about{position:relative;top:auto;left:auto;margin: 20px 0;}
	#aboutLtf .about .box{width:300px;top:auto;left:auto;}
	#aboutLtf .about .box h4 div.arrow{left: 140px;}

	#sideBar{width: 300px;padding-bottom: 20px;}
	#sideBar.maps iframe{margin-bottom: 30px;}
	#featured{width: 300px;padding: 30px 10px 20px 10px;margin: 0 0 0 0;box-sizing: border-box;}	
	#featured.full{padding: 30px 0px 50px 0px;}
	#featured h1{font-size: 30px;}
	#featured p{font-size: 18px;}
	
	#intro h1{font-size: 30px !important;}
	#intro .inner h6{position: absolute;bottom: 0px;left: 0;}
	#intro img{margin: 30px 0;width:100%;height: auto;}
	.text .download{position: relative;top: auto;right: auto;}	
	.text blockquote{width: 100%;}
	
	#client .btn{font-size: 18px;}
	
	#award img{display:block;margin: 0 auto 20px auto;}
	
	#examples .flex-direction-nav .flex-prev{top: 40px;}
	#examples .flex-direction-nav .flex-next{top: 40px;}
	
	#form{width: 260px;}
	
	#archives{width: 300px;position: relative;bottom: auto;right: auto;}	

	#people .profiles li li{width: 240px;padding: 0 30px;}
	#people .profiles .profile{display:none !important;}
	
	#slider .slides li .about{width: 90%;padding: 60px 5% 40px 5%;}
	#slider .slides li .about p{font-size: 15px;}
	
	#slider .flex-direction-nav .flex-next,
	#thumbnailSlider .flex-direction-nav .flex-next{right: 20px;}
	#slider .flex-control-nav{position: absolute;top: auto;bottom: -185px;margin: 0 -72px 0 0;right:50%;z-index: 2000;}

	#carousel{padding-bottom: 30px;}
	#carousel .slides li .btn{width: 140px;font-size: 18px;}
	#carousel .slides li.flex-active-slide .btn{left: 32px;}
	
	#who{height: 250px;margin: 0;}
	#who .title{font-size: 18px;margin-top: 0;}
	#who .more{bottom: -20px;font-size: 18px;z-index: 1000;}
	
	#quote .image{display: none;}
	#quote blockquote{width: 260px;margin: 0 0;font-size: 15px;}	
	#quote blockquote span{	width: 220px;}
	
	#why h3{font-size: 22px;}
	#why p{font-size: 16px;width: 90%;}	

	#archives{padding: 0 0 40px 0;}

	#featured h3{font-size: 18px;}
	#featured .address p{width: 100%;padding: 0 0 0 0;}

	#featured .intro p, 
	#featured .continue{font-size: 18px !important;}

	#serviceList li{width: 300px;margin: 0 0px 40px 0px; padding: 0 10px; box-sizing: border-box;}

	#clientList li,#clientList li a{width: 300px;}

	#blocks .item, #blocks .item.w2{width:50%;}

	#people .inner h1{font-size: 30px;}

	#examples{margin-top: 30px;}
	#examples .details span h4{font-size: 11px;}
	#examples .summary h3{font-size: 20px;padding: 0 0 10px 0;}
	#examples .summary p{font-size: 15px;}
	#examples .details span{width: 100%;margin: 0 0 0 0;}
	#examples .buttons{float: left;width:100%;text-align: center;}
	#examples .buttons a{float: none;display: inline-block;margin: 20px 0 0 0;}

	#examples .quote blockquote{width: 260px;}	
	#examples .quote blockquote span{width: 220px;}
	#examples .quote blockquote cite{display: block;margin-left: -40px !important;}
	
	.versions dt{width:100%;text-align: center;padding: 0 0 10px 0;}
	
	#enquiry{width: 100%;}	
	#guide, .alt #enquiry{width: 100%; padding: 20px 0 40px 0;}
	#guide h4, #enquiry h4{font-size: 22px;text-align: center;}

	#products li{width: 300px;margin: 0 0px 60px 0;}
	#products li img{width: 100%;height: auto;}
	#products li div{width: 260px;padding: 30px 20px;}	
	#products li h3{font-size: 16px;}
	#products li h5{font-size: 12px;}
	#products li h4{font-size: 15px;}
	#products li span{width: 258px;}
	#products li span a{width: 128px;height: 128px;}	

	#threeCol .col{width: 100%;margin: 0 0 20px 0;}
	
	#workshop #form{margin-bottom: 40px;}
	#mainContent{width: 300px;}
	#mainContent img{width:100%;height:auto;}
	#mainContent ul.listCol1{width: 100%;padding: 0 0 20px 0;}	
	#mainContent ul.listCol2{width: 100%;padding: 0 0 20px 0;}
	#mainContent ol li{width: 100%;padding: 0 0 20px 0;}			
	#mainContent ol li img{width: 100px;}	
	
	#portfolio .item {width: 50%;}
	#portfolio .item.w2 {width: 50%;}		
	.filters dt, .filters dd{width: 100%;height: auto;}
	
	#pagination a{font-size: 15px;padding:0 0 15px 0;}
	#pagination a.previous{float: left;}
	#pagination a.next{float: right;}
	
	#preFooter{background: #799AB7;}
	#preFooter .inner{width: 100%;box-sizing: border-box;}
	#preFooter #guide h6 span{top: 60px;width: 200px;padding: 0 50px;margin: 0;font-size: 14px;}	
	#preFooter .btn{font-size: 18px;}	
	
	
	#block{float: left;width: 100%;padding: 10px 0 260px 0;position: relative;}	
	#block #report{width: 280px;padding: 0 0 30px 0;box-sizing: border-box;}
	#block #latest{position: absolute;width: 100% !important;padding: 20px 0 0 0;bottom: 0;left: 0;}

	#block #latest #padding{float: none;margin: 0 auto;width: 280px;padding: 0 0 40px 0;}

	#guide{float: none;margin: 0 auto;width: 300px;padding: 50px 0 50px 0;}
	#guide p{text-align: center;}	
	#guide .btn,#block .btn{float: none;margin: 20px 0 0 0;}
	
	#enquiry{width: 100%;}
	#enquiry .inside, #block .inside{clear: both;float: none;margin: 0 auto;width: 280px;box-sizing: border-box;padding: 20px 0 20px 0;}
	#enquiry .field input,#enquiry .textarea textarea{font-size: 16px;}
	#enquiry .checkbox{margin: 0px 0 0 0;}	
	#enquiry .checkbox span{font-size: 16px;width: 80%;padding: 10px 10px 6px 10px;}	
	#enquiry .prettycheckbox{width: 18%;}
	#enquiry .submit{float: none;clear: both;text-align: center;padding: 20px 0 0 0;}	

	#enquiry h4{text-align: left;font-size: 32px;}

	#footer .share{float: left;width: 100%;margin: 0 0 0 0;}
	#footer .share span.st_facebook_custom{margin: 0 0 10px 15px;}	
	#footer .social{width: 100%;text-align: center;}	

	#steps li{font-size: 14px;}
	#steps li span{padding: 0 0px;}
	
	#featured img{
	width:auto !important;
	max-width: 300px !important;
	height: auto !important;
	}	

	#steps li{width: 100%;}

	#steps li span:after{display: none;}

	.leftCol{width: 300px;padding: 30px 0 0 0;}
	.rightCol{margin: 0 0 40px 0;}
	#intro{height: auto;}
	.questions{width: 100%;height: auto;}	

	.questions li span{width: 100%;}				
	.questions li .select-style{width: 100%;margin: 0 0 20px 0;}

	.questions h5 span{display: none;}
	#loading{height: 400px;line-height: 400px;}
	#finalResults{height: auto;padding: 30px 0 30px 0;}

	#theResult{float: right;width: 100%;text-align: center;margin: 0 0 40px 0;}
	#order{float: right;width: 300px;margin: 0 0 40px 0px;width: 100%;text-align: center;}
	#order img{float: none;}
	#order a span{width: 270px;}

	#comments #comment_form .field label,
	#comments #comment_form .textarea label{width: 100%;}	
	#comments #comment_form .field input,
	#comments #comment_form .textarea textarea{width: 98%;}
	#comments #comment_form .submit{padding-left: 0;}		

	#footer{padding: 0;}
	#footer .links{font-size: 14px;}
	#footer .links .email{float: left;text-align: center;width: 100%;margin: 10px 0 0 0;}	
	#footer .links .legal{float: left;text-align: center;width: 100%;margin: 10px 0 0 0;}	
	#footer .links .call{float: right;text-align: center;width: 100%;margin: 10px 0 0 0;}		

	#blueprint .inner{width: 300px;}
	#blueprint .inner .content{width: 300px;}	

	#blueprintForm{background: none;}
	#blueprintForm .textarea,#blueprintForm .field{width: 100%;}
	#blueprintForm .textarea textarea, #contactForm .textarea textarea{min-height: 140px;}
	#blueprintForm dl{width: 100%;}
	#blueprintForm dd{width: 100%;}
	#blueprintForm .select{width: 100%;}
	#blueprintForm .right,#contactForm .right{width: 100%;position: relative;text-align: center;}	

.text .content .full{
	width:100%;
	}


.partnerships ul li{
	width: 100%;
	}

.brand-work h4 a{
	width: 100%;
}


#blog .crumb{padding: 10px 10px;}

.homeboxes{padding: 0 0 10px 0;}
.homeboxes .box{height: 140px;overflow:hidden;}
.homeboxes .box p.summary{display: none;}
.homeboxes .box .fa{display: block;}


.homeboxes .box.open{height: auto;overflow:normal;}
.homeboxes .box.open p.summary{display: block;}

.homeboxes .box{width: 100%;margin: 0 0 20px 0;padding: 20px 15px;}
.homeboxes .box h2{font-size: 26px;}
.homeboxes .box p.summary{min-height: 0px;}


#homepeople{
	padding-top: 0;
}

#homepeople .carousel{
	float: left;
	width: 100%;
}

#homepeople .carousel.owl-loaded{
	overflow: hidden;
}

#homepeople .carousel div{
	float: left;
	width: 50%;
}

#homepeople .carousel div.item{
	width: 50%;
}

#homepeople .carousel.owl-loaded div.item{
	width: auto;
}


#homepeople .carousel .owl-nav{
	display: none;
}


#homepeople .carousel div.item span.bio{
	position: absolute;
	top: 0px;
	left: -9999px;
	z-index: 200;
	width: 140px;
	padding: 5px;
	margin: 0 0 0 -75px;
	font-size: 14px;
}


#homepeople .carousel div.item:hover span.bio{
	left: 50%;
	}



#homepeople .awards{
	box-sizing: border-box;
	padding: 150px 15px 0 15px;
	position: relative;
}	
	
#homepeople .awards p.logo{
	position: absolute;
	top: 30px;
	left: 0;
	margin: 0;
	float: left;
	width: 100%;
	box-sizing: border-box;
}

#homepeople .awards p.logo a{	
	padding: 0;
	margin: 0;
}	

#homepeople .awards p.logo img{
	float: left;
	width: 100% !important;
	}

#homepeople .awards p.digital{
	float: left;
	width: 50%;
	padding: 0;
	margin: 0;
	font-size: 16px;
	}
	
#homepeople .awards p.seo{
	float: right;
	width: 50%;
	padding: 0;
	margin: 0;
	font-size: 16px;
	}	


.brand-work h3{
	text-align: center;
}

.brand-work h3 a{
    width: 100%;
	}
	
.brand-work ul li{
	width: 100%;
	}	


.solution-sections{
	padding: 0 0 40px 0;
}

.solution-sections ul li{
	width:140px;
}

.solution-sections ul li img{
	width: 120px;
	height 120px;
}



.solutions-consultation{
	padding: 0 0 40px 0;
	text-align: center;
}



.solutions-consultation img{
	float: none;
	position: relative;
	top: auto;
	left: auto;
	display: block;
	margin: 0 auto 20px auto;
}

.solutions-consultation p{
	display: block;
	padding: 0 0 20px 0;
	font-size: 18px;
	text-align: center;
	}

.solutions-consultation h6{
	font-size: 22px;
	}

.solutions-consultation h6 a{
	padding: 15px 15px;
	}


#blog .jump-menu{
	width: 100%;
}

.results-consultation{
	padding: 0 0 40px 0;
	text-align: center;
}

.results-consultation img{
	float: none;
	position: relative;
	top: auto;
	left: auto;
	display: block;
	margin: 0 auto 20px auto;
}

.results-consultation p{
	display: block;
	padding: 0 0 20px 0;
	font-size: 18px;
	text-align: center;
	}

.results-consultation h6{
	font-size: 22px;
	}

.results-consultation h6 a{
	padding: 15px 15px;
	}


.results-scrolling{
		width: 280px;
		height: 235px;
}

.results-scrolling .image{
	width: 253px;
	height: 145px;
	margin: 14px 0 0 15px;
}

.results-video{
	width: 280px;
	height: 235px;
}

.results-video iframe{
	width: 253px;
	height: 145px;
	margin: 13px 0 0 15px;
}


.case-study{
	padding: 20px 10px;
	}

.case-study h1{
	font-size: 40px;
	}

.case-study p{
	font-size: 16px;
	}

.case-study .results-story p{
	font-size: 20px;
	}

.case-study .results-story{
	padding: 0 0 20px 0;
	}

.case-study .results-change{
	padding: 20px 20px 0px 20px;
	}

.case-study .results-mobile{
	padding: 20px 20px 0px 20px;
	}

.case-study .results-mobile img{
	padding: 0 0 20px 0;
	max-width: 100%;
	}

.case-study .results-solutions{
	padding: 20px 20px 0px 20px;
	margin: 0 0 20px 0;
	}

.case-study .results-achieved{
	padding: 20px 20px 40px 20px;
	}

.case-study .results-quote h4{
	padding: 10px 20px;
	font-size: 16px;
	}

.case-study .results-quote blockquote{
	padding: 20px 20px 10px 20px;
	background-position: 10px 10px;
	}

.case-study .results-quote blockquote p{
	font-size: 20px;
	}


.results-heading .inner{
	padding-bottom: 0;
	}

.results-heading h1{
	font-size: 30px;
	}

.results-heading.no-padding .inner h1{
	padding: 0;
	}

.results-heading p.larger{
	font-size: 20px;
	}

.results-heading p{
	font-size: 16px;
	}
	
	

/*-- footer --*/


#footer .links .social-links{
	float: left;
	width: 100%;
	padding: 20px 0;
}

#footer .links .social-links a{
	font-size: 30px;
}

/*-- added for klarifi --*/	
	
#feature-boxes .features-box{
	width: 90%;
	padding: 150px 5% 5% 5%;
	margin: 0 0 40px 0;
	min-height: 0;
	}

#benefits-boxes .features-box{
	float: left;
	width: 100%;
	padding: 190px 0 0 0;
	margin: 0 0 40px 0;
	}
	
#benefits-boxes .features-box p{
	min-height: 0px;
	padding: 0 0 15px 0;
	}
	
#benefits-boxes .photo_bg .circle-wrap img{
	width: 50%;
	}
	
	
#pricelists .prices li{
	width: 100% !important;	
	margin: 0 0 40px 0;
	}			



.text .content div ol img{
	width: 100%;
	margin: 15px 0 15px 0 ;
	}

.text .content img.half{
	float: left;
	width: 100%;
	}	
	
#contentslides .flex-direction-nav .flex-prev{
	top: 40px !important;
	}

#contentslides .flex-direction-nav .flex-next{
	top: 40px;
	}
	

#blueprintForm.klarifi{
	background: none;
}			


.imageBlock .caption{
	left: 0px;
	width: 100px;
	}



.how-we-work ul li{
	width: 100%;
}



.solution-heading h1{
	font-size: 30px;
	}

.solution-heading p{
	font-size: 20px;
	}


.solution-intro p{
	font-size: 16px;
	}
	
	
	
	
.how-we-work ul li .inside:after {
	top: 100% !important;
	left: 50% !important;
	right: auto !important;
	border: solid transparent !important;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-left-color: none !important;
	border-right-color: none !important;
	border-width: 20px !important;
	margin-left: -20px !important;
	margin-top: auto !important;
	z-index: 100;
}

.how-we-work ul li.box1 .inside:after{border-top-color:#414143 !important;}
.how-we-work ul li.box2 .inside:after{border-top-color:#FF6600 !important;}
.how-we-work ul li.box3 .inside:after{border-top-color:#24C2CB !important;}
.how-we-work ul li.box4 .inside:after{border-top-color:#26B7C7 !important;}
.how-we-work ul li.box5 .inside:after{border-top-color:#25ADC5 !important;}
.how-we-work ul li.box6 .inside:after{border-top-color:#27A3C2 !important;}
.how-we-work ul li.box12 .inside:after{border-top-color:#2498BF !important; display: none;}
.how-we-work ul li.box11 .inside:after{border-top-color:#268DBB !important;}
.how-we-work ul li.box10 .inside:after{border-top-color:#2383B8 !important;}
.how-we-work ul li.box9 .inside:after{border-top-color:#247AB5 !important;}
.how-we-work ul li.box8 .inside:after{border-top-color:#256DB2 !important;}
.how-we-work ul li.box7 .inside:after{border-top-color:#8dc940 !important;display: block;}


.how-we-work ul li{
	position: relative;
}

.how-we-work ul li span strong{
	width: 150px;
	font-size: 30px;
	}

.how-we-work ul li span .fa{
	margin: -25px 0 0 -25px;
	font-size: 50px;
	}

.how-we-work ul li span h5{
	font-size: 18px;
	bottom: 30px;
	}

.how-we-work ul li .text{
	position: absolute;
	top: 100% !important;
	left: -9999px;
	width:100%;
	float: left;
	padding: 40px 20px;
	margin: 0;
	box-sizing: border-box;
	font-family:'Helvetica Neue LT W01_41488878', Helvetica, Arial, sans-serif;
	font-size: 16px;
}


.how-we-work ul li.box12 .text{
	top: auto !important;
	bottom: 100%;
	}

/*-- how-we-work-full --*/


.how-we-work-full ul li{
	float: left;
	width: 100%;
}


.how-we-work-full ul li .inside:after {
	top: 100% !important;
	left: 50% !important;
	right: auto !important;
	border: solid transparent !important;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-left-color: none !important;
	border-right-color: none !important;
	border-width: 30px !important;
	margin-left: -30px !important;
	margin-top: auto !important;
	z-index: 100;
}


.how-we-work-full ul .alignright,
.how-we-work-full ul .alignleft{
	position: static;
}

.how-we-work-full ul li{
	position: relative;
}

.how-we-work-full ul li.box1 .inside:after{border-top-color:#FFF !important;}
.how-we-work-full ul li.box2 .inside:after{border-top-color:#FF6600 !important;}
.how-we-work-full ul li.box3 .inside:after{border-top-color:#24C2CB !important;}
.how-we-work-full ul li.box4 .inside:after{border-top-color:#26B7C7 !important;}
.how-we-work-full ul li.box5 .inside:after{border-top-color:#25ADC5 !important;}
.how-we-work-full ul li.box6 .inside:after{border-top-color:#27A3C2 !important;}
.how-we-work-full ul li.box12 .inside:after{border-top-color:#2498BF !important; display: none;}
.how-we-work-full ul li.box11 .inside:after{border-top-color:#268DBB !important;}
.how-we-work-full ul li.box10 .inside:after{border-top-color:#2383B8 !important;}
.how-we-work-full ul li.box9 .inside:after{border-top-color:#247AB5 !important;}
.how-we-work-full ul li.box8 .inside:after{border-top-color:#256DB2 !important;}
.how-we-work-full ul li.box7 .inside:after{border-top-color:#8dc940 !important;display: block;}


.how-we-work-full ul li .text{
	width: 100%;
	padding: 40px 20px 20px 20px;
	margin: 0;
}


.how-we-work-full ul li.box2,
.how-we-work-full ul li.box3,
.how-we-work-full ul li.box7,
.how-we-work-full ul li.box8,
.how-we-work-full ul li.box9{
	right: 0 !important;
}
.how-we-work-full ul li.box4,
.how-we-work-full ul li.box5,
.how-we-work-full ul li.box6,
.how-we-work-full ul li.box10,
.how-we-work-full ul li.box11,
.how-we-work-full ul li.box12{
	left: 0 !important;
}


.awards .hideme{
    left: auto !important;
    }

.awards .award .image{
	width: 100%;
	min-height: 320px;
	}

.awards .award .textarea{
	width: 100%;
	padding: 15px 15px 80px 15px;
	text-align: center;
	}

.awards .award .textarea img{
	float: none;
	display: inline-block;
	margin: 0 auto;
	}

.awards .award .textarea h4{
	font-size: 14px;
}

.awards .award .textarea h2{
	font-size: 32px;
}

.awards .award .textarea h3{
	font-size: 14px;
	text-align: center;
}


.contact .inner form{
	padding: 40px 20px;
}


.contact .field textarea, 
.contact .field input,
.contact select{
	font-size: 14px;
    }

.contact .inner .location{
	width: 100%;
	padding: 20px 20px 0px 20px;
	}

.contact .inner .location p img{
	position: absolute;
	top: -27px;
	left: 140px;
	}

.contact .inner .location .btn{
	font-size: 24px;
	width: 100%;
	box-sizing: border-box;
}

.contact .inner .map{
	width: 100%;
	height: 300px;
	}


.contact .inner form .checkbox{margin: 0px 0 30px 0;}	
.contact .inner form .checkbox span{font-size: 14px;width: 80%;padding: 15px 10px 6px 10px;}	
.contact .inner form .prettycheckbox{width: 18%;}



.solution-sections ul li span.popup{
	margin: 0 0 0 -50px;
}

.solution-sections ul li:nth-child(even) span.popup{
	margin: 0 0 0 -190px;
}

}			


/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    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;
    }
}



/*
 * Popup styles
 */
 
.popup{
	padding: 0;
	background: #7b98b5;
 	}
 	
 #popup{
 	float: left;	
 	width: 90%;
 	padding: 5%;
 	background: #7b98b5;	
 	}
 	
 	
  #popup h1{
  	float: left;
  	font-size: 60px;
  	font-weight: bold;
  	color: #FFF;
  	text-transform: lowercase;
  	}

#popup .hannah{
	float: right;
	max-width: 126px;
	width: 30%;
	}
  	
  	
#popup .dee{
	float: right;
	width: 40%;
	max-width: 300px;
	margin-top: 10px;
	border: 2px solid #FFF;
	} 
	
#popup p{
	float: left;
	width: 100%;
	padding: 20px 0;
	font-size: 28px;
	color: #FFF;
	}
	
	
#popup form p.field{
	float: left;
	width: 60%;
	padding: 0 0 10px 0;
	}
	
#popup form p.field input{
	border: none;
	width: 90%;
	padding: 2% 5%;
	}			


#popup form p.submit{
	float: right;
	width: 40%;
	margin: -15px 0 0 0;
	text-align: right;
	}
	
	
#popup p.small{
	font-size: 14px;
	width: 100%;
	}	


@media only screen 
and (max-width : 860px){

  #popup h1{
  	font-size: 50px;
	}

}


@media only screen 
and (max-width : 740px){

.hidemobile {
display:none;
}

#popup .hannah{
	padding-top: 30px;
	}

#popup h1{
	width: 100%;
	font-size: 30px;
	text-align: center;
	}

#popup .dee{
	display: none;
	}

#popup p{
	float: left;
	width: 70%;
	padding: 20px 0;
	font-size: 24px;
	}

#popup form p.field input{
	font-size: 20px;
	}

#popup form p.submit{
	width: 100%;
	margin: 0 0 0 0;
	text-align: center;
	}

#popup form p.field{
	float: left;
	width: 100%;
	}
	
#popup p.small{
	text-align: center;
	}		

}