/*
--- OPTIMATION
--- Browser Fixes Stylesheet
--- By Emma Baker of PlasticStudio
--- June 2013
*/
	
/* rearrange z-index to put image at back and services dial above bg image */

/* === IE 6 === */

.ie6 #head {
	z-index: 1; }
	
	.ie6 #head .inner {
		z-index: 2; }

		.ie6 #head-panel,
		.ie6 #navigation,
		.ie6 .top-level-item-wrapper {
			z-index: 3; }
			
			/* needs to be very top */
			.ie6 #navigation .top-level-item-wrapper .hover-navigation {
				z-index: 4; }

	
	.ie6 #background-panel {
		z-index: 1; }
		
		.ie6 #background-panel .content-background { /* bg image */
			z-index: 2; }
			
		.ie6 #background-panel .inner {
			z-index: 3; }
	
	
.ie6 #main {
	z-index: 1; }
	
	.ie6 #services-dial-widget {
		z-index: 1; }
		
		.ie6 #services-dial-graphic {
			z-index: 1; }
		
.ie6 .section-featured-pages a {
	width: 44% !important;}
		
/* === IE 7 === */

.ie7 #head .inner {
	z-index: 4; }
	
	.ie7 #navigation {
		z-index: 5; }
		
		.ie7 #navigation .hover-navigation {
			z-index: 10; }	
			
.ie7 #background-panel {
		z-index: 1; }
		
	.ie7 #background-panel .content-background { /* bg image */
		z-index: 2; }
		
	.ie7 #background-panel .inner {
			z-index: 3; }

.ie7 #main {
	z-index: 1; }

	
/* ==== IE 8 ===== */

/* .ie8 #head {
	z-index: 1; }
	
.ie8 #main {
	z-index: 1; } */
	
.ie8 #social-bar {
	position: absolute;
	right: 0;
	z-index: 100; }
	

	
/* =============================	NAVIGATION 	================= */
	
/* Make nav items display in columns and fix > image */
.ie6 #navigation .hover-menu-item {
	display: block; }
	
.ie6 #navigation .hover-navigation {
	width: 980px; }
	
.ie6 #navigation .hover-navigation .icon.small.white-arrow {
	height: 12px;
    background-position: -169px 5px; }
	
.ie6 #navigation .hover-navigation a:hover .icon.small.white-arrow {
    background-position: -169px -19px; }
	
/* Change colour to grey and then white on hover */
.ie8-below #navigation .hover-menu-item a {
	color: #B8B9C9; }
	
.ie8-below #navigation .hover-menu-item a:hover {
	color: #fff; }
	
	
/* =============================	BACKGROUND PANEL 	================= */
	
/* Fix background height on home page headings */

.ie6 #background-panel .inner .first.content-block .background-colour {
	height: 5px; }

.ie6 #background-panel .inner .second.content-block .background-colour {
	height: 59px; }
	
.ie6 #background-panel .background-colour {
	height: 60px; }
	
/* remove gap above nipple */
.ie6 #background-panel .nipple {
	bottom: -2px; }
	
.ie6 #background-panel .background-colour {
	padding-top: 70px;}
	
.ie6 #background-panel .content-block {
	width: 100%;
	padding-left: 10px;
	text-align: left;}
	
.ie6 #background-panel .first h1 {
	font-weight: 600;
	color: #FFFFFF;
	text-transform: uppercase;}
	
.ie6 #background-panel .homepage .first {
	width: 23%;
	float: left;}
	
.ie6 #background-panel .homepage .second {
	padding: 0;
	width: 75%;
	float: right;}
	
	
	
	
	
/* =============================	MAIN LAYOUT 	================= */
	
/* Make left column the correct width */
.ie6 #main .left {
	width: 620px; }
	
.ie6 #main .right {
	width: 270px; }
	
	
/* hide bottom nipple because it doesn't reposition when the page is expanded and blocks content */	
.ie6 #main .nipple {
	display: none; }
	
	
	
/* =============================	FEATURED PAGES ============== */

/* reduce margin so float properly */
.ie6 ul.section-featured-pages li.odd {
    margin-right: 10px;
}

.ie6 div.section-featured-pages a .section-background-colour-me	{
	width: 104.5%;
	height: 2px !important;
	padding: 0 !important;
	display: block;
	right: -5px;
	top: 0;
	left: 0;}
	
	
/* =============================	HOMEPAGE SLIDER ============== */

/* create border to substitute for CSS3 dropshadow */
.ie6 #homepage-slider .feature-slide-item,
.ie7 #homepage-slider .feature-slide-item {
    padding: 4px;
	border: 1px solid #DDD;
}

.ie6 .homepageslidercontrols .homepagesliderleft.control.left {
	background: url('../images/icon-controls.png') 0 0 no-repeat;
	width: 60px !important;
	height: 60px;}

.ie6 .homepageslidercontrols .homepagesliderright.control.right {
	background: url('../images/icon-controls.png') -60px 0 no-repeat;
	width: 60px !important;
	height: 60px;}

.ie6 .aboutusslidercontrols .aboutussliderleft {
	background: url('../images/icon-controls.png') 0 0 no-repeat;
	width: 60px !important;
	height: 60px;}

.ie6 .aboutusslidercontrols .aboutussliderright {
	background: url('../images/icon-controls.png') -60px 0 no-repeat;
	width: 60px !important;
	height: 60px;}
	
	

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

.ie7 #quick-contact-widget label .label {
	display: block !important;
	position: relative;
	z-index: 2; }
	

.ie6 #services-dial-graphic {
	background-image: url('../images/services-dial-bg.gif');}
	
.ie6 .services-dial-item .services-dial-disc {
	background-image: url('../images/services-dial-bg.gif') ;}
	
.ie6 #cog .image {
	background-image: url('../images/services-dial-cog.gif');}
	
	
	
	
/* =============================	PNG REPLACEMENT	============== */
	
	
.ie6 #homepage-slider .slide-item .play-icon,
.ie6 #homepage-slider .slide-item .readmore-icon,
.ie6 div.section-featured-pages a span.readmore{
	background-image: url('../images/icon-readmore.gif');}
	
.ie6 .icon.small,
.ie6 #foot .right-panel .contact-us .icon {
	background-image: url('../images/icons-small.gif');}
	
	
	
	
	
/* =============================	CASE STUDIES	============== */

.ie7 .case-studies li {
	width: 31%; }
	
.ie6 .case-studies li {
	width: 30%; }
	
	
	
/* =============================	STAFF PAGE	============== */

.ie6 #staff-thumbnails .staff-click-container .staff-image {
	left: -160px; }
	
.ie8-below #staff-thumbnails .staff-item .staff-name {
	background: url('../images/transparency-white-50.png'); }
	
	

/* ===========================	 JOIN US	  =========== */

.ie6 table#entry-points .entry {
	height: 145px; }

.ie6 table#entry-points .entry .entry-active-indicator {
	bottom: -1px; }

	
	
	
/* =============================	FOOTER 	================= */
	
.ie6 #foot .menu .quarter {
	margin-right: 1%; }
	
.ie6 #foot .menu .quarter ul li {
	height: 10px; }
	
.ie6 #foot .right-panel .contact-item.phone {
	height: 15px; }