/*
--- OPTIMATION
--- Layout Stylesheet
--- By James Barnsley of PlasticStudio
--- May 2013
*/


html,
body {
	background: #022b50;
	position: relative;}

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

	
	
	
	
	
	
	
	

/* ============================================================================================================== */
/* ======================================================================================== STRUCTURE =========== */
/* ============================================================================================================== */



/* ======================================== GLOBAL ELEMENTS === */

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

.hide {
	display: none; }
	
.inner {
	width: 1200px;
	margin: 0 auto;
	position: relative;}
	
.liner {
	padding: 10px; }

.obfuscation{
	unicode-bidi:bidi-override;
	direction:rtl;
	word-wrap: break-word;
}

.staff-obfuscation{
	word-wrap: break-word;
}

.obfuscation:hover,
.staff-obfuscation{
	cursor: pointer;
}

/* ============ COLUMNS ===== */
	
.col {
	float: left;
	display: block;
	min-height: 1px;
}

.w5{	width: 5%; }
.w10{	width: 10%; }
.w15{	width: 15%; }
.w20{	width: 20%; }
.w24{	width: 24%; }
.w25{	width: 25%; }
.w30{	width: 30%; }
.w33{	width: 33%; }
.w35{	width: 35%; }
.w40{	width: 40%; }
.w45{	width: 45%; }
.w50{	width: 50%; }
.w55{	width: 55%; }
.w60{	width: 60%; }
.w65{	width: 65%; }
.w70{	width: 70%; }
.w75{	width: 75%; }
.w80{	width: 80%; }
.w85{	width: 85%; }
.w90{	width: 90%; }
.w95{	width: 95%; }
.w100{	width: 100%; }

.col.w30.lined { padding: 0 1.5%; box-sizing: border-box; -moz-box-sizing: border-box; }
.col.w45.lined { padding: 0 2.5%; }

/* ======================================== FLOATING LEFT/RIGHT === */

	
.pull-left,
.left {
	float: left; }

.pull-right,
.right {
	float: right; }

.text-left {
	text-align: left;
}

.text-right {
	text-align: right;
}


	
/* ======================================== ANIMATIONS === */

.animate-fast,
.animate {
    -webkit-transition: all 0.2s ease-in-out;
       -moz-transition: all 0.2s ease-in-out;
         -o-transition: all 0.2s ease-in-out;
            transition: all 0.2s ease-in-out; }
	
.animate-slow {
    -webkit-transition: all 0.8s ease-in-out;
       -moz-transition: all 0.8s ease-in-out;
         -o-transition: all 0.8s ease-in-out;
            transition: all 0.8s ease-in-out; }	
	
.loading {
	width: 50px;
	height: 50px;
	margin-left: -25px;
	margin-top: -25px;
	position: absolute;
	top: 50%;
	left: 50%;
	background: transparent no-repeat 50% 50%;}
	
.loading.white {	
	background-image: url('../images/loading-white.gif'); }
	

.blur {
	filter: blur(3px);
	-webkit-filter: blur(3px);
	-moz-filter: blur(3px);
	-o-filter: blur(3px);
	-ms-filter: blur(3px);
	
    -webkit-transition: all 0.4s ease-in-out;
       -moz-transition: all 0.4s ease-in-out;
         -o-transition: all 0.4s ease-in-out;
            transition: all 0.4s ease-in-out;}
	
	
	
/* ======================================== ICONS === */

.icon.small {
	background: url('../images/icons-small.png') 0 0 no-repeat transparent;
	display: inline-block;
}




/* ============================================================================================================== */
/* ======================================================================================= NAVIGATION =========== */
/* ============================================================================================================== */

#head {
	padding: 20px 0;
	background-color: #00b8ec;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-size: cover;
}

.HomePage #head {
	height: 550px;
}

#head-panel {
	width: 100%;
	height: 70px;
	background: rgba(255,255,255,0.85);
	background: url('../images/background-transparent-white-90.png');
	z-index: 99;
}

#branding {
	position: absolute;
	top: 10px;
	left: 20px;
	width: 220px;
	height: 50px;
	display: block;
	background: url('../images/logo.png') 0 0 no-repeat;}
	
#navigation {
	float: right; 
	padding-right: 40px;
	height: 70px;}
	
.mobnav-init {
	display: none;
}

#navigation .top-level-item-wrapper .navigation-item.top-level {
	font-size: 1em;
	font-weight: 600;
	color: #04003e;
	text-transform: uppercase;
	padding: 26px 0 26px 27px;
	display: block;
	float: left; 
	position: relative; 
	cursor: pointer; }
	
#navigation .top-level-item-wrapper .navigation-item.top-level span {
	color: #00b8f1; }
	
#navigation .top-level-item-wrapper .navigation-item .icon.small {
	background-position: -181px 0;
	width: 12px;
	height: 12px;
	position: absolute;
	top: 56px;
	left: 27px;
	display: none;
}

#navigation .top-level-item-wrapper .navigation-item:hover .icon.small,
#navigation .top-level-item-wrapper.hover .navigation-item .icon.small {
	display: block; }
	
	
	
	
/* ================================ HOVER NAVIGATION (pops up on click) === */	
	
#navigation .hover-navigation {
	position: absolute;
	left: 0;
	top: 70px;
	width: 100%;
	z-index: 8;
	background: url('../images/background-transparent-white-90.png');
}
	
#navigation .hover-navigation .liner {
	padding: 20px 2.5% 40px;
	width: 47%;
	float: right;
}

#navigation .hover-navigation .hover-menu-column {
	width: 45%; 
	float: left; 
}
	
#navigation .hover-navigation .hover-menu-column.even {
	float: right;
	margin: 0 40px 0 0;
}

#navigation .hover-navigation .column-title a {
	font-weight: normal;
	color: #4e4e4e;
	border-bottom: 1px dotted #4e4e4e;
	display: block;
	padding: 10px 0;
	margin: 0 50px 0 0; }
	
#navigation .hover-navigation .column-title a.current,
#navigation .hover-navigation .column-title a:hover {
	color: #00b8f1;
	border-color: #51d4fd; }
	
#navigation .hover-navigation .hover-menu-column .hover-menu-item {
	padding: 2px 0;
	display: block;}

#navigation .hover-navigation .hover-menu-column .hover-menu-item a {
	color: #04003e; /* color: #b8b9c9; */}

#navigation .hover-navigation .hover-menu-column .hover-menu-item a:hover {
	color: #00b8f1; /* color: #FFFFFF; */}
	
#navigation .hover-navigation .icon.small.white-arrow {
	background-position: 0 0;
	width: 15px;
	height: 10px;}
	
#navigation .hover-navigation a:hover .icon.small.white-arrow,
#navigation .hover-navigation .hover-menu-item.current .icon.small.white-arrow,
#navigation .hover-navigation .hover-menu-item.section .icon.small.white-arrow {
	background-position: 0 -24px;}
	
#navigation .hover-navigation .hover-menu-column .hover-menu-item.current a,
#navigation .hover-navigation .hover-menu-column .hover-menu-item.section a {
	color: #00b8f1; }
	
#navigation .hover-navigation .hover-menu-column .spacer {
	display: block;
	height: 5px; }

#navigation .hover-navigation .hover-menu-column .hover-menu-item.section-item {
	color: #4e4e4e;
	padding: 4px 0 4px 30px; 
	margin: 6px 0;
	background: url("../images/list-item-blue-arrow.gif") no-repeat scroll 10px 7px rgba(0, 0, 0, 0); 
	cursor: pointer; }
	
#navigation .hover-navigation .hover-menu-column .hover-menu-item.section-item:hover {
	color: #00b8f1; }
	
#navigation .panel-close {
	display: block;
	width: 16px;
	height: 16px;
	padding: 10px;
	background-position: -180px -14px; 
	position: absolute;
	right: 20px;
	top: 20px; 
	z-index: 2; 
	cursor: pointer;}



/* ============================================================================================================== */
/* ================================================================================= BACKGROUND PANEL =========== */
/* ============================================================================================================== */

#background-panel-spacer {
	height: 120px;}

#background-panel {
	height: 350px;
	width: 100%;
	position: relative;
	overflow: hidden;
}
	
#background-panel.tall {
	height: 700px;}
	
#background-panel .inner {
	height: 100%;}

#background-panel .content-background {
	position: absolute;
	bottom: 0px;
	z-index: 96;
}

#background-panel .content-background.align-top {
	bottom: auto;
	top: 0px;
}

#background-panel .content-background.snap-width {
	width: 100%;
}

#background-panel .content-background.snap-height {
	height: 100%;
}
	
	
	
/* --- CONTENT --- */
	
#background-panel .content {
	position: absolute;
	left: 0;
	bottom: 70px;
	z-index: 97;}
	
	



/* ============================================================= ABOUT US SLIDER PANEL === */
	

#about-us-slider {
	position: relative;
	height: 250px;
	margin-bottom: 20px;
	width: 100%;
	overflow: hidden;}

#about-us-slider .liner {
	padding: 0;
	position: absolute;
	left: 980px;
	top: 0;
	width: 5145px;
	height: 250px; }

#about-us-slider .slide-item {
	display: block;
	float: left;
	position: relative;}
	
#about-us-slider .slide-item img {
	display: block;}
	
.about-us-slider.control {
	width: 60px;
	height: 60px;
	background: url('../images/icon-controls.png') 0 0 no-repeat;
	position: absolute;
	top: 110px;
	z-index: 100;
	cursor: hand;
	cursor: pointer;}
	
.about-us-slider.control.left {
	left: -65px;
	background-position: 0 0;}
	
.about-us-slider.control.right {
	right: -65px;
	background-position: -60px 0;}
	
.about-us-slider.control.left:hover {
	background-position: 0 -60px;}
	
.about-us-slider.control.right:hover {
	background-position: -60px -60px;}	
	
	
	


/* ============================================================================================================== */
/* ================================================================================ HOMEPAGE-SPECIFIC =========== */
/* ============================================================================================================== */

.homepage-introduction {
	border-bottom: 1px solid #aaa59d;
	text-align: center;
	padding: 30px 50px;
}

.typography .homepage-introduction h1 {
	padding: 6px 15px;
	margin: 0;
	font-style: italic;
	font-weight: 100;
	color: #fff;
	background: #00b8ec;
	display: inline-block;
}


/* ========================== SOCIAL FEED ==== */

.social-feed-item {
	width: 25%;
	height: 200px;
	float: left;
	background: #dfdfdb;
	background-position: 50% 50%;
	background-size: cover;
	background-repeat: no-repeat;
	position: relative;
}

.social-feed-item.facebook.link {
    background-position: 50% 30%;
    background-size: auto;
}

.social-feed-item .origin-icon {
	position: absolute;
	top: 0;
	right: 0;
	background: url('../images/social-feed-flags.png') no-repeat;
	width: 58px;
	height: 52px;
}

.social-feed-item .origin-icon.twitter {
	background-position: -65px 0; }

.social-feed-item .liner {
	padding: 10% 7%;
	position: absolute;
	width: 86%;
	top: 55px;
}

.social-feed-item .liner img {
	position: absolute;
	top: -40px;
	left: 15px; 
	display: block; 
	margin: 0 0 10px; }
	
.social-feed-item.full-image .liner {
	padding: 4%;
	width: 93%;
	height: 32%;
	left: 0;
	display: block;
	background: url('../images/background-transparent-white-85.png');
	top: inherit; 
	bottom: 0; }
	


/* ============================================================================================================== */
/* ================================================================================ MAIN CONTENT AREA =========== */
/* ============================================================================================================== */


.main-content {
	border-right: 1px solid #aaa59d;
	padding-right: 30px;
}

.full-width.main-content {
	border: 0;
	padding: 0; }


.main-content.w75 {
	width: 72%;
	padding-right: 2.5%; }
	
#main {
	background: #FFFFFF;
	position: relative;
}
	
	
/* ==================== INTRODUCTION PANEL (full width titles area) === */

.page-introduction {
	border-bottom: 1px solid #aaa59d;
	padding: 30px 0;
}

.page-introduction.homepage {
	border: none;
	padding: 320px 0 0 0;
}

.page-introduction h1.tag {
	padding: 5px 14px;
	display: inline-block;
	color: #FFFFFF;
	text-transform: uppercase;
	background: #022b50;
	font-weight: 700;
	font-size: 13px;
	margin-top: 10px;
}

.page-introduction .introduction-content h2 {
	font-size: 1.5em;
	padding: 10px 0 5px;
	color: #99998f;
}

.page-introduction.homepage .introduction-content {
	padding: 20px 0;
}

.page-introduction.homepage .introduction-content h1 {
	color: #FFFFFF;
	font-size: 2.4em;
}
	

	
	
/* ==================== CONTENT PADDING FOR PANELS === */
	
.content-padding-left {		padding-left: 20px;}
.content-padding-right {	padding-right: 20px;}
.content-padding-top {		padding-top: 30px !important;}
.content-padding-bottom {	padding-bottom: 30px !important;}

.content-border-right { border-right: 1px solid #aaa59d; }
.content-border-bottom { border-bottom: 1px solid #aaa59d; }
	
	
/* ==================== IN-ARTICLE MAPS (contact page) === */

.map-container {
	margin-bottom:10px;}
	
.map-container h3{
	background-color:[#000](/issues/000);
	color:#fff;
	display:block;
	margin:0;
	padding:0.5em;}
	
.map-container .map{
	float:left;
	display:inline;
	width:45%;}

.map-container .akl{
	margin-left:10%;}

.map-container .map iframe{
	width:100%;}
	
	


	
/* ==================== OPTIMATION WAY MINDSET TABLE === */

#optimation-mindset {
	background: #dbf1fd;
	padding: 10px 0; 
}

#optimation-mindset strong {
	color: #00b5f0; }
	
#optimation-mindset li {
	background: url('../images/list-item-blue.gif') no-repeat 0 8px;
	padding-left: 20px;
	list-style-type: none; }


	
	
/* ==================== PRACTICE FOUNDATION TABLES === */

table#practices-table {
	border-collapse: collapse;
}

table#practices-table tr td {
	border-top: 1px solid gray;
	padding: 10px 0 20px;
}

table#practices-table tr td:first-child {
	width: 180px;
}

table#practices-table tr td h3 {
	padding-top: 0; }

.dark-blue #practices-table tr td {		border-color: #04003e; }
.blue #practices-table tr td  {			border-color: #00b8f1; }
.dark-blue #practices-table tr td  {	border-color: #04003E; }
.orange #practices-table tr td  {		border-color: #f58025; }
.red #practices-table tr td  {			border-color: #d71920; }
.green #practices-table tr td  {		border-color: #5fbb46; }
.purple #practices-table tr td  {		border-color: #9251a0; }
.grey #practices-table tr td  {			border-color: #83a3b3; }





/* ============================================================================================================== */
/* ================================================================================= HOMEPAGE =================== */
/* ============================================================================================================== */

.homepage-subjects {
	position: relative;
	padding: 30px 0;
}

.expanded-panel {
	position: absolute;
	top: 30px;
	right: 0;
	bottom: 30px;
	left: 0;
	background: #dfdfdb;
	display: none;
	z-index: 7;
}

.expanded-panel .close-panel-button {
	position: absolute;
	top: 20px;
	right: 20px;
	opacity: 0.35;
	cursor: hand;
	cursor: pointer;
	padding: 10px;
	display: inline-block;
}

.expanded-panel .close-panel-button:hover {
	opacity: 1;
}

.expanded-panel .graphic-padding {
	padding: 45px 0 0 45px;
}

.expanded-panel .title-padding {
	padding-top: 60px;
}

.expanded-panel .col-padding-right {
	padding-right: 30px;
}




/* ========================= SUBJECTS: The main panels ===== */

.homepage-subject-item {
	padding: 45px 45px 45px 250px;
	height: 160px;
	position: relative;
}

.homepage-subject-item:hover {
	background: #dfdfdb;
	cursor: hand;
	cursor: pointer;
}

.homepage-subject-item:hover  > .readmore {
	color: #f57f3b;
	border-color: #f57f3b;
}

.homepage-subject-item > .graphic {
	position: absolute;
	top: 45px;
	left: 45px;
}


/* ========================= SERVICES: Each subject's sub-items ===== */

.homepage-service-item {
	padding-bottom: 30px;
}

.homepage-service-item .content {
	padding-bottom: 25px;
}

/* ========================= LATEST NEWS FEED ===== */

.latest-news {
	border-top: 1px solid #aaa59d;
	border-right: 1px solid #aaa59d;
	width: 21.5%; 
	padding-bottom: 20px; }

.news {
	clear: left; 
	width: 95%; 
	margin: 0 0 15px; }
	
.news img {
	float: left; 
	width: 43px;
	height: 43px; 
	margin: 5px 0 0; }

.news p {
	color: #494949; 
	margin: 0 0 0 53px}
	
.news a { 
	display: block;
	margin: 0 0 0 53px; }
	
/* ========================= SOCIAL HUB ===== */

.social-hub {
	border-top: 1px solid #aaa59d; 
	padding-left: 3%;
	width: 72%; }
	
.social-hub h2 {
	float: left; 
	margin-right: 30px; }
	
.social-links {
	margin: 24px 0 0 0; }

.social-links a {
	display: block;
	float: left;
	width: 20px;
	height: 20px; 
	margin: 0 10px 0 0; }
	
.social-links .twitter { background-position: -72px -22px; }
.social-links .facebook { background-position: -72px 0; }
.social-links .linkedin { background-position: -96px -24px; width: 21px; }


/* ============================================================================================================== */
/* ============================================================================== STAFF PAGE ELEMENTS =========== */
/* ============================================================================================================== */
	
#staff-thumbnails {
	padding-bottom: 60px;}
	
#staff-thumbnails .staff-item {
	width: 20%;
	float: left;
	cursor: hand;
	cursor: pointer;
	position: relative;}
	
#staff-thumbnails .staff-item .grey-out {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background: rgba(0,0,0,0.5);
	display: block;
	opacity: 1;}
	
#staff-thumbnails .staff-item.active .grey-out,
#staff-thumbnails .staff-item:hover .grey-out {
	opacity: 0; }
	
#staff-thumbnails .staff-item img {
	width: 100%;
	display: block;}
	
#staff-thumbnails .staff-item .staff-name {
	display: none;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 10px;
	background: rgba(255,255,255,0.8);
	text-align: center;
	font-weight: 600;
	text-transform: uppercase;}
	
#staff-thumbnails .staff-item:hover .staff-name {
	display: block;}
	
#staff-thumbnails .staff-item.active:hover .staff-name {
	display: none;}
	
#staff-thumbnails .staff-active-indicator {
	display: block;
	position: absolute;
	top: 0;
	width: 100%;
	height: 25px;
	background: url('../images/icon-staff-indicator.png') top center no-repeat;}
	
#staff-thumbnails .staff-active-indicator.top-row {
	bottom: 0px;
	top: auto;
	background-position: bottom center;}
	
#staff-thumbnails .staff-active-indicator.hide {
	display: none; }
	
#staff-thumbnails .staff-click-container {
	position: relative;
	clear: both;
	padding: 10px 20px 20px 180px;
	background: #EEEEEE;
	min-height: 150px;}
	
#staff-thumbnails .staff-click-container .staff-image {
	width: 140px;
	height: 140px;
	position: absolute;
	top: 20px;
	left: 20px;}
	
	
	
	
	

/* ============================================================================================================== */
/* ========================================================= SECTION LANDING PAGE FEATURED PAGE LINKS =========== */
/* ============================================================================================================== */


	
div.section-featured-pages a.odd,
.page-panels .page-panel-item.odd {
	margin-right: 4%;}

div.section-featured-pages a,
.page-panels .page-panel-item {
	width: 45.5%;
	float: left;
	margin-bottom: 15px;
	padding: 20px 1% 7px 1%;
	min-height: 215px;
	display: block;
	background: #e7e7e8;
	color: #555 !important;
	position: relative;
	border-bottom-right-radius: 20px;}
	
.page-panels .page-panel-item {
	border-bottom-right-radius: 0;
}

div.section-featured-pages a .content,
.page-panels .page-panel-item .content {
	background: #FFFFFF;
	padding: 12px 14px;
	min-height: 158px;
	font-size: 0.97em;}
	
div.section-featured-pages a .top-border,
.page-panels .page-panel-item .top-border {
	height: 7px;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;}

div.section-featured-pages a strong,
.page-panels .page-panel-item strong{
	padding-left: 10px;
	display: block;
	margin-bottom: 12px;
	font-size: 1.2em;
	font-weight: normal;}
	
div.section-featured-pages a span.readmore,
.page-panels .page-panel-item span.readmore {
    background: url("../images/icon-readmore.png") no-repeat scroll -72px top transparent;
    bottom: 0;
    display: block;
    height: 36px;
    position: absolute;
    right: 0;
    text-indent: -10000px;
    width: 36px;
	padding: 0;
	border: 0; }
		
div.section-featured-pages a.dark-blue span.readmore {    				background-position: 0px -108px }
div.section-featured-pages a.blue span.readmore,
div.section-featured-pages a.default-colouring span.readmore {   		background-position: -36px -108px }
div.section-featured-pages a.orange span.readmore {    					background-position: -72px -108px }
div.section-featured-pages a.red span.readmore {    					background-position: -108px -108px }
div.section-featured-pages a.green span.readmore {    					background-position: -144px -108px }
div.section-featured-pages a.purple span.readmore {    					background-position: -180px -108px }
div.section-featured-pages a.yellow span.readmore {    					background-position: 0 -215px }
div.section-featured-pages a.grey span.readmore {    					background-position: -36px -215px }
		
div.section-featured-pages a.dark-blue:hover span.readmore {    		background-position: 0px -144px }
div.section-featured-pages a.blue:hover span.readmore,
div.section-featured-pages a.default-colouring:hover span.readmore {  	background-position: -36px -144px }
div.section-featured-pages a.orange:hover span.readmore {    			background-position: -72px -144px }
div.section-featured-pages a.red:hover span.readmore {    				background-position: -108px -144px }
div.section-featured-pages a.green:hover span.readmore {    			background-position: -144px -144px }
div.section-featured-pages a.purple:hover span.readmore {    			background-position: -180px -144px }
div.section-featured-pages a.yellow:hover span.readmore {    			background-position: 0 -251px }
div.section-featured-pages a.grey:hover span.readmore {    				background-position: -36px -251px }
		
.page-panels .page-panel-item.dark-blue span.readmore {    				background-position: 0px -108px }
.page-panels .page-panel-item.blue span.readmore,
.page-panels .page-panel-item.default-colouring span.readmore {   		background-position: -36px -108px }
.page-panels .page-panel-item.orange span.readmore {    				background-position: -72px -108px }
.page-panels .page-panel-item.red span.readmore {    					background-position: -108px -108px }
.page-panels .page-panel-item.green span.readmore {    					background-position: -144px -108px }
.page-panels .page-panel-item.purple span.readmore {    				background-position: -180px -108px }
.page-panels .page-panel-item.yellow span.readmore {    				background-position: 0 -215px }
.page-panels .page-panel-item.grey span.readmore {    					background-position: -36px -215px }
		
.page-panels .page-panel-item.dark-blue:hover span.readmore {    		background-position: 0px -144px }
.page-panels .page-panel-item.blue:hover span.readmore,
.page-panels .page-panel-item.default-colouring:hover span.readmore {  	background-position: -36px -144px }
.page-panels .page-panel-item.orange:hover span.readmore {    			background-position: -72px -144px }
.page-panels .page-panel-item.red:hover span.readmore {    				background-position: -108px -144px }
.page-panels .page-panel-item.green:hover span.readmore {    			background-position: -144px -144px }
.page-panels .page-panel-item.purple:hover span.readmore {    			background-position: -180px -144px }
.page-panels .page-panel-item.yellow:hover span.readmore {    			background-position: 0 -251px }
.page-panels .page-panel-item.grey:hover span.readmore {    			background-position: -36px -251px }


	
	
	


/* ============================================================================================================== */
/* ===================================================================================== CASE STUDIES =========== */
/* ============================================================================================================== */


/* --- STRUCTURE --- */

.typography h3.border-colour-me {
	font-size: 1.1em;
	border-bottom: 1px solid #ccc;
	margin-bottom: 15px; }

.dark-blue .typography h3.border-colour-me {	border-color: #04003e; }
.blue .typography h3.border-colour-me {			border-color: #00b8f1; }
.dark-blue .typography h3.border-colour-me {	border-color: #04003E; }
.orange .typography h3.border-colour-me {		border-color: #f58025; }
.red .typography h3.border-colour-me {			border-color: #d71920; }
.green .typography h3.border-colour-me {		border-color: #5fbb46; }
.purple .typography h3.border-colour-me {		border-color: #9251a0; }
.grey .typography h3.border-colour-me {			border-color: #83a3b3; }
	
.section-featured-pages .blue .section-background-colour-me,
.background-colour-me.blue {			background-color: #00b8f1; }
.section-featured-pages .dark-blue .section-background-colour-me,
.background-colour-me.dark-blue {		background-color: #04003e; }
.section-featured-pages .orange .section-background-colour-me,
.background-colour-me.orange {			background-color: #f58025; }
.section-featured-pages .red .section-background-colour-me,
.background-colour-me.red {			background-color: #d71920; }
.section-featured-pages .green .section-background-colour-me,
.background-colour-me.green {			background-color: #5fbb46; }
.section-featured-pages .purple .section-background-colour-me,
.background-colour-me.purple {			background-color: #9251a0; }
.section-featured-pages .yellow .section-background-colour-me,
.background-colour-me.yellow {			background-color: #ffd828; }
.section-featured-pages .grey .section-background-colour-me,
.background-colour-me.grey {			background-color: #83a3b3; }


ul#all-sectors,
ul.case-studies.by-sector {
	margin-left: 0 !important; }

ul.case-studies {
	list-style: none;
	padding: 0;
	margin: 0;}

	
	
	
	
/* --- ITEMS --- */

.typography .case-studies li,
.typography .case-studies.small li {
	width: 32%;
	height: 180px;
	margin: 0 2% 20px 0;
	padding: 0 !important;
	float: left;
	background: #EEE;}
	
.case-studies li.last {
	margin-right: 0;}

.case-studies li a,
.case-studies.small li a {
	width: 90%;
	padding: 15px 5%;
	height: 150px;
	display: block;
	position: relative;
	overflow: hidden; }

.case-studies li a img,
.case-studies.small li a img {
	margin-bottom: 5px;}
	
.case-studies li a .bg-image,
.case-studies.small li a .bg-image {
	position: absolute; 
	top: -5px; 
	right: -218px; }

.case-studies li a span.cs-title,
.case-studies.small li a span.cs-title {
	display: block;
	position: absolute;
	top: 7px;
	left: 0;
	padding: 10px;
	background: url('../images/transparency-white-80.png') 0 0 repeat;}
	
.case-studies li a span.cs-title .title,
.case-studies.small li a span.cs-title .title {
	color: #555;
	font-size: 18px;
	font-weight: 600;
	line-height: 28px;
	position: relative;
	z-index: 2; }
	
.case-studies li a .cs-title-bg,
.case-studies.small li a .cs-title-bg {	
	display: block;
	width: 100%;
	height: 100%;
	background: #fff;
	opacity: 0.8; 
	position: absolute;
	top: 0;
	left: 0; }
	
.case-studies li a:hover .cs-title,
.case-studies.small li a:hover .cs-title {
	background: #FFFFFF }

.case-studies li a span.cs-summary,
.case-studies.small li a span.cs-summary {
	display: block;
	color: #555;
	margin-bottom: 10px;
	font-size: 11px;
	position: relative;
	z-index: 2; }

.case-studies li a span.readmore,
.case-studies.small li a span.readmore {
	position: absolute;
	display: block;
	height: 27px;
	width: 148px;
	background: url("../images/icon-readmore.png") no-repeat scroll 0 -187px transparent;
	bottom: 10px;
	right: -6px; 
	line-height: 26px;
	padding: 0 0 0 15px;
	color: #555;
	font-weight: 600; 
	border: 0; }

.case-studies li a:hover span.readmore,
.case-studies.small li a:hover span.readmore {
	color: #000;
	background-position: -180px -186px;}
	
/* 	
ul.case-studies {
	list-style: none;
	padding: 0;
	margin: 0;}

ul.case-studies li {
	width: 30%;
	height: 180px;
	margin: 0 2% 20px 0;
	padding: 0;
	float: left;
	background: #EEE;}

ul.case-studies li a {
	width: 90%;
	padding: 15px 5%;
	height: 150px;
	display: block;
	position: relative;}

ul.case-studies li a img {
	margin-bottom: 5px;}

ul.case-studies li a strong {
	display: block;
	color: #555;
	font-size: 18px;
	line-height: 28px;
	margin-bottom: 20px;}

ul.case-studies li a span.cs-summary {
	display: block;
	color: #555;
	margin-bottom: 10px;
	font-size: 11px;}

ul.case-studies li a span.readmore {
	position: absolute;
	display: block;
	text-indent: -10000px;
	height: 36px;
	width: 36px;
	background: url("../images/icon-readmore.png") no-repeat scroll -72px top transparent;
	bottom: 0;
	right: 0;}

ul.case-studies li a:hover span.readmore {
	background-position: -72px -36px;} */

/* all case studies */
ul#all-sectors li.case-study-3,
ul#all-sectors li.case-study-6,
ul#all-sectors li.case-study-9,
ul#all-sectors li.case-study-12,
ul#all-sectors li.case-study-15,
ul#all-sectors li.case-study-18,
ul#all-sectors li.case-study-21   {
	margin-right: 0;}

/* case studies by sector */
.case-studies.large li:nth-child(odd),
.case-studies.large li:nth-child(even) {
	width: 49%;
	height: 300px;
}

.case-studies.large li:nth-child(odd) a,
.case-studies.large li:nth-child(even) a {
	height: 265px;
}
	
.case-studies.large li.case-study-2 {
	margin-right: 0;}
	
.case-studies.large li a span.cs-title {
	top: 110px; }
	
.case-studies.large li a span.cs-title .title {
	font-weight: 600; }
	
.case-studies.large li a span.cs-title .cs-summary {
	font-size: 13px; }

	
	
	
	
	
/* ============================================================================================================== */
/* ========================================================================================== PROJECT =========== */
/* ============================================================================================================== */
	
	
#projects .project {
	width: 22%;
	float: left;
	margin-right: 3.75%; }
	
#projects .project.last {
	margin-right: 0;}
	
#projects .project h3 {
	line-height: 1.2em; }
	
#projects .project p {
	font-size: 1em; }
	
#projects .project-4 {
	margin-right: 0; }
	
#projects .project .description.short {
	height: 220px;
	overflow: hidden; }
	
	
	
/* --- layout variations --- */

#projects.one-wide {
	width: 31%;
	float: left;
	margin-right: 2%;}
	
#projects.one-wide .project {
	width: 100%;
	margin-right: 0;}
	
	
#projects.three-wide .project {
	width: 32%;
	margin-right: 2%;}
	
	
	
	
/* ============================================================================================================== */
/* ===================================================================================== SOLUTION PAGE	  ======= */
/* ============================================================================================================== */	
	
.panel.content {
	padding-bottom: 40px; }
	
.disc-graphic {
	display: block;
	max-width: 230px;
	width: 90%;
	height: auto;
	border-radius: 50%;
	-moz-border-radius: 50%; }
	
.panel.row-1,	
.panel.row-2,
.panel.row-3 {
	padding: 20px 0; 
	border-top: 1px solid #aaa59d; }
	
	
/* ROW 1 - what we do / capabilities / benefits */

.panel.row-1 .col.w30 {
	padding-right: 3%; }
	
.panel.row-1 .col.w30.last {
	padding: 0 1% 0 2%; }

.panel.row-1 .col h2,	
.panel.row-1 .col h3 {
	line-height: 1em; }
	
.panel.row-1 .col h2,	
.panel.row-1 .col h3,
.panel.row-1 .col h4,
.panel.row-1 .col p {
	padding-top: 5px; }
	
/* Row 2 - Results */
	
.panel .result {
	padding: 0 3% 0 0;
	margin-bottom: 20px; }
	
.panel .result p {
	font-size: 0.9em; }
	
.panel.row-2 .result p
{
	height: 130px; 
	display: inline-block
}
	
.panel .result .graph img {
	float: left; 
	margin: 0 10px 0 0; }
	
.panel .result .graph h1 {
	float: left;
	padding: 0; }
	

	
/* Row 3 - Results */

.panel.row-3 .result.w35 {
	margin: 0 7% 20px 0; }
	
.panel.row-3 .result.pos-3,
.panel.row-3 .result.pos-5,
.panel.row-3 .result.pos-7 {
	clear: left; }

	

/* ============================================================================================================== */
/* ===================================================================================== JOIN US	  =========== */
/* ============================================================================================================== */
	
	
table#entry-points {
	margin: 20px 0;
	width: 100%; }
	
table#entry-points tr td {
	width: 32%;
	background: #EEEEEE;
	padding: 10px 10px 30px 10px;
	position: relative;
	border-right: 4px solid #FFFFFF;
	cursor: hand;
	cursor: pointer;}
	
table#entry-points a.entry {
	display: block;
	color: #000;
	width: 100%; }
	
table#entry-points td:hover {
	background-color: #d1cece; }
	
table#entry-points td.chosen {
	background: url('../images/icon-benefits-indicator.png') bottom center no-repeat #d1cece; }
	
table#entry-points a.entry .heading {
	display: block;
	font-size: 18px;
	padding: 0 0 9px; }
	
table#entry-points .entry .entry-active-indicator {
	display: none; } 

	
/* List of Benefits */

#benefits {
	display: none; 
	margin-bottom: 20px; }

.typography .left ul.entry-benefits {
	margin-left: 0; }

ul.entry-benefits li {
	list-style-type: none;
	margin: 4px 0; 
	padding: 4px 0 4px 30px !important; }
	
ul.entry-benefits li.highlight {
	background: url('../images/ticks.png') no-repeat 3px -14px #eee; }
	
ul.entry-benefits li.fade,
ul.entry-benefits li.fade ul li {
	color: #bbb; }	
	
ul.entry-benefits li ul li {
	background: none;
	list-style-type: disc;
	padding: 0 0 0 0 !important; }

	
	
	

/* ============================================================================================================== */
/* ========================================================================================== SIDEBAR =========== */
/* ============================================================================================================== */

.sidebar {
	padding-top: 40px;
}

.sidebar-subnav {
	margin-bottom: 20px; }
	

.widget-item {
	margin-bottom: 20px;
	padding-left: 20px;
}

	
/* ================================================================= NAVIGATION WIDGETS ==== */	

.widget-item.SubNavigationWidget {
	padding-left: 0;
}

.services-dial-menu ul {
	list-style: none;
}

.widget-item .menu-item,
.sidebar-subnav a {
	display: block;
	padding: 12px 20px;
	color: #00b8f1;
	border-bottom: 1px solid #aaa59d;
	font-weight: 600;
}

.sidebar-subnav a.current.parent-item {
	padding: 5px 20px;
	display: inline-block;
	color: #FFFFFF;
	text-transform: uppercase;
	background: #022b50;
	font-weight: 700;
	font-size: 11px;
	border-bottom: none;
}

.sidebar-subnav a:hover,
.widget-item .menu-item.link:hover {
	color: #434343;
}

.sidebar-subnav a.current,
.widget-item .menu-item.current {
	background: #d9d9ca;
	color: #434343;
}

.sidebar-subnav span.link.children {
	display: none; }

.sidebar-subnav a.sub-item {
	padding: 10px 20px 10px 40px; }
	
	
	
/* =================================================	 HOME PAGE CAPABILITIES WIDGET ==== */

.capabilities-button {
	display: block;
	background: url('../images/home-page-capabilities-button.jpg') no-repeat;
	width: 280px;
	height: 280px;
	color: #04003e;
	position: relative; }
	
.capabilities-button .arrow {
	display: block;
	font-size: 30px; }

.typography .capabilities-button .text {
	display: block;
	position: absolute;
	text-align: center;
	text-transform: uppercase;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.1em;
	top: 150px;
	left: 90px; }
	
.capabilities-button .text .blue {
	color: #00B8F1; }

	
/* ================================================================= SERVICES DIAL WIDGET ==== */	
	
/* see services-dial.css */

	
	


	
/* =================================================================== ACTION WIDGETS ==== */	
	
.sidebar-widget {
	padding: 10px 15px;
	background: #EEE;
	margin-bottom: 15px;
}

.typography .sidebar-widget p {
	padding: 0 10px 5px; }


/* our partners widget */
#our-partners-widget ul{
    list-style: none;
}
#our-partners-widget ul li{
    	color: #818285;
	padding: 5px 10px;
}
/* call us widget */
#call-us-widget ul {
	list-style: none;
}

#call-us-widget ul li {
	color: #818285;
	padding: 5px 0;
	margin: 0;
}

#call-us-widget .region,
#call-us-widget .details {
	width: 50%;
	text-align: left;
	display: block;
	float: left;
}

#call-us-widget .number {
	width: 50%;
	text-align: right;
	display: block;
	float: left;
}

/* live chat widget */
#live-chat-widget {
	
	background: #00b8f1;
	padding: 3px !important;
}

#live-chat-widget h5 {
	color: #FFF;
	text-transform: none;
	border: none;
}

#live-chat-widget h5 strong {
	color: #04003e;
	text-transform: uppercase;
}

#live-chat-widget form {
	position: relative;
	width: 274px;
	background: #FFF;
	height: 80px;
}

#live-chat-widget textarea {
	border: none;
	width: 210px;
	color: #818285;
	font-size: 10px;
}

#live-chat-widget input#submit {
	position: absolute;
	background: url("../images/icon-readmore.png") no-repeat scroll -36px -144px transparent;
	border: none;
	width: 36px;
	padding: 36px 0 0;
	color: #04003e;
	text-transform: uppercase;
	font-size: 9px;
	text-align: center;
	bottom: 10px;
	/*right: 50px;*/
}


/* ===================	 join the talent pool widget 	=========================== */

#join-talent-pool-widget:hover {
	background: #DDD;
}

#join-talent-pool-widget .heading {
	display: block;
	border-bottom: none;
	border-top: 1px solid;
	padding: 5px 10px 0 10px;
	text-transform: uppercase; 
	font-weight: bold; }

#join-talent-pool-widget .text {
	display: block;
	padding: 5px 10px;
	color: #04003e;
	font-size: 18px; }

#newsletter-widget input.text {
	width: 248px;
	border: none;
	margin: 2px 1px;
	color: #818285;}
	

	
	
/* ===================	 BASIC WIDGET 	=========================== */

.BasicWidget .widget-inner {
	padding: 5px 0; }

.BasicWidget .details {
	color: #04003E;
	display: block; }

.BasicWidget .name {
	display: block;
	font-size: 16px;
	width: 100% !important; }

.BasicWidget .email,
.obfuscation,
.staff-obfuscation {
	font-size: 0.95em;
	height: 20px; 
	word-break: break-all;}
	
.BasicWidget .linkedin {
	display: block;
	background: url('../images/linkedin.gif') no-repeat 0 1px;
	padding-left: 20px; }


/* current openings widget */
ul#current-openings {
	list-style: none;
	margin-left: 10px;
}

ul#current-openings li a {
	color: #555 !important;
}

ul#current-openings li a:hover,
ul#current-openings li a:hover .posting-date {
	color: #00B8F1 !important;
}

ul#current-openings .posting-date {
	display: block;
	color: #818285;
	font-style: italic;
}

	
/* =============================== CASE STUDY LOGO == */

#case-study-logo-widget {
	text-align: center;
	padding: 30px 0;}

	
	
/* ================= JOIN US PAGE WIDGETS ========== */

#personal-growth p,
#current-openings p {
	padding: 5px 10px; 
}
	
	
/* ============================================================================================================== */
/* ============================================================================================= BLOG =========== */
/* ============================================================================================================== */
	
#Breadcrumbs {
	margin: 20px 0 0 0; }
	
.TagCloudWidget {
	margin: 20px 0; }

.TagCloudWidget .tagcloud a {
	display: block;
	float: left;
	margin: 5px 5px 5px 10px;
	color: #04003E;
	font-size: 15px; }

.typography .blogEntry li {
	list-style-position: inside; }

.blogSummary {
	margin-top: 25px;
	padding-top: 12px;
	border-top: 2px solid #EEEEEE;}

.blogSummary .postTitle,
.blogEntry .postTitle {
	padding-bottom: 8px;}
	
.blogSummary .authorDate,
.blogEntry .authorDate {
	font-style: italic;
	color: #AAAAAA;}
	
	
	
/* --- pagination --- */	
	
.blogcontent .pagination .PageNumbers {
	padding-top: 30px;
	margin: 30px 0 0 0;
	border-top: 2px solid #CCCCCC;
	list-style-type: none;
	text-align: center;}
	
.blogcontent .pagination .PageNumbers li {
	display: inline;
	margin: 0;
	padding: 0;
	list-style-type: none;}
	
.blogcontent .pagination .PageNumbers a {
	display: inline-block;
	padding: 2px 5px;
	font-size: 1.1em;
	font-weight: 600;}
	
.blogcontent .pagination .PageNumbers a.disabled {
	color: #AAAAAA !important;}
	
	
	

/* ============================================================================================================== */
/* ============================================================================================= WORK READ MORE = */
/* ============================================================================================================== */	

#work-read-more {
	background: #e3e3d9;
	padding: 50px 0;
	text-align: center;
}

#work-read-more a {
	color: #999;
	max-width: 530px;
	display: block;
	margin: 0 auto;
}

#work-read-more a:hover {
	color: #f57f3b;
}
	


/* ============================================================================================================== */
/* ============================================================================================= FOOT =========== */
/* ============================================================================================================== */


#foot {
	background: #022b50;
	padding: 30px 0 40px;
	z-index: 99;
	position: relative;
}

#foot .main-footer-content {
	color: #FFFFFF;
	border-bottom: 1px solid #4e6b85;
	padding-bottom: 53px;
	background: url('../images/background-foot.gif') 50% 100% no-repeat;
}

#foot .main-footer-content h3 {
	color: #00b7f0;
	font-weight: 100;
	padding: 0 0 10px 0;
}
	
#foot .main-footer-content p {
	padding: 5px 0;
	line-height: 1.3em;
	color: #959ea7;
}
	
#foot .main-footer-content p > a {
	color: inherit;
}
	
#foot .main-footer-content p > a:hover {
	color: #FFFFFF;
}


/* ===================== UTILITY BELT (Search/Social) ======= */

#foot .utility-belt {
	padding-top: 40px;
}

#foot .utility-belt .social {
	float: left;
	padding: 6px 25px 0 0;
}

#foot .utility-belt .footer-google-search {
	width: 200px;
	display: inline-block;
}

#foot .utility-belt .social a {
	opacity: 0.4;
	height: 22px;
	display: inline-block;
	margin: 0 5px;
}

#foot .utility-belt .social a > img {
	max-height: 100%;
}
	
#foot .utility-belt .social a:hover {
	opacity: 1;
}




/* ===================== BELOW-THE-LINE END OF PAGE ======= */

#foot .end-of-page {
	clear: both;
	text-align: center;
	padding-top: 30px;
}
	
#foot .end-of-page,
#foot .end-of-page a {
	color: #4e6b85;
}

#foot .end-of-page a:hover {
	color: #FFFFFF;
}
	
	
/* SEO Page Links */
	
#foot .footer-seo {
	clear: both;
	float: left;
	margin: 20px 0 10px;
	text-align: center;
	padding-bottom: 20px;
}

#foot .footer-seo a {
	color: #173d5f;
	padding: 0 5px;
	display: inline-block;
}
	
/* checkpoint block */

.checkpoint-block {background-color:#eeeeee;border-top:1px solid #00B8F1;}
.checkpoint-block.left {padding:2%;width:45%;margin-right:2%;float:left;margin-bottom:0px;}
.checkpoint-block.right {padding:2%;width:45%;margin-left:0%;float:left;clear:right;overflow:hidden;}
.checkpoint-block .cp-title{color:#00B8F1;text-transform:uppercase;font-weight:700;}
.checkpoint-block ul{list-style-type: none;padding: 0px;margin: 0px;}
.checkpoint-block ul li{list-style-image: url('../images/list-bullet-tick.gif');background-repeat: no-repeat;background-position: 0px 5px; padding-left: 14px; }
.scale-image{max-width:100%;}





/* ===================== WIDE LAYOUT FIXES / SMALL DESKTOPS ======= */

@media (max-width: 1250px) {
	
	.inner {
		width: 94%; }

}