/* --------------------------------------------- */
/* PRODUCT SELECTOR */


#productSelector {
	position: relative;
	width: 940px;
	height: 450px;
	margin: 0 auto;
	}


/* --------------------------------------------- */
/* PRODUCT SELECTOR - TABS */
	
#productSelector-Tabs {
	width: 940px;
	height: 50px;
	}
	
#productSelector-Tabs li.tab {
	height: 50px;
	display: block;
	background-image: url(../images/slider/tab_fade.png);
	background-position: 0 0;
	-webkit-border-top-left-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-radius-topright: 5px;
	float: left;
	margin-right: 4px;
	/* font-family: MetaBold-Roman, Helvetica, sans-serif; */
	
	
	text-align: left;
	line-height: 50px;
	color: #4f4f4f;
	cursor: pointer;
	width: 232px;
	}
	
#productSelector-Tabs li h2 {
	/*padding-left: 20px;*/
	font-weight: bold;
	font-size: 22px;
	letter-spacing: -1px;
	text-align: center;
	}

#productSelector-Tabs li:hover {background-position: 0 -50px;}	
#productSelector-Tabs li.select {background: #eaeaea;}

#productSelector-Tabs li.tabLast {margin-right: 0;}
#productSelector-Tabs li.tabOHS {width: 248px;}
#productSelector-Tabs li.tabContract {width: 248px;}
#productSelector-Tabs li.tabPortfolio {width: 248px;}
#productSelector-Tabs li.tabSolutions {width: 184px; margin-right: 0px; background-color: #f35310; background-image: url(../images/slider/solutiontab_fade.png); color: #f9a988; }
#productSelector-Tabs li.tabSolutions:hover {color: white;}
#productSelector-Tabs li.tabSolutions.select {color: white; background: #f2791e;}

	
#productSelector-Main {
	width: 940px;
	height: 280px;
	overflow: hidden;
	background: #ffffff;
	}
	
.productSelector-Panel {
	position: absolute;
	top: 50px;
	left: 0;
	z-index: 100;
	display: none;
	}
	
#productSelector-Tabs li.select .productSelector-Panel {display: block;}
	
#productSelector-Slider {
	position: relative;
	width: 940px;
	height: 120px;
	}


.productSelector-Panel .panel, .start-Panel .panel {background: #eaeaea; width: 940px; height: 280px;}



.panel {color:#535353; font-size: 15px;}
.panel h2 {font-size: 32px; margin: 0 0 5px 0; line-height: 32px; border: none;}
.panel h3 {font-size: 15px; line-height: 17px; border-bottom: none;}
.panel p {font-size: 15px; line-height: 17px;}
.panel ul {list-style: disc; margin-left: 17px;}
.panel ul li {margin: 4px 0; line-height: 17px;}
.panel ol {	list-style: decimal inside; line-height: 14px; font-weight: bold; font-size: 14px;}
.panel ol li {margin: 0 0 8px 0;}
.panel ol p {
	font-size: 12px; line-height: 13px; font-weight: normal;
}
.panel ol h3 {margin: 0; padding: 0; font-size: 14px;}

.panelCol1, .panelCol2, .panelCol3 {
	display: block;
	float: left;
	height: 245px;
	margin-top: 20px;
	width: 287px;
	}
	
.panelCol1 {margin: 20px 20px 0 20px;}
.panelCol2 {margin: 20px 20px 0 0;}
.panelCol3 {margin: 20px 0 0 0;}
	
#pageLiift .panelCol1 {width: 330px;}
#pageLiift .panelCol2 {width: 330px;}
#pageLiift .panelCol3 {width: 200px;}
	
.product #productSelector-Tabs .panelCol1 {width: 200px;}
.product #productSelector-Tabs .panelCol2 {width: 330px;}
.product #productSelector-Tabs .panelCol3 {width: 330px;}
.product #productSelector-Tabs .panelCol3 img {float: right;}

#productSelector-Tabs .evencol .panelCol1, #productSelector-Tabs .evencol .panelCol2, #productSelector-Tabs .evencol .panelCol3 {width: 287px;}	

/* START PANEL */

.start-Panel {position: absolute; top: 50px; z-index: 100;}
.start-Panel .panel {background: black url(../images/slider/startpanel_bg.png); color: white;}

.start-Panel .large {font-size: 24px; font-weight: normal; line-height: 100%; margin-top: 0;}
.start-Panel ul.large { margin: 0 0 25px 30px;}
.start-Panel ul li {margin-top: 8px;}
.start-Panel h3, .start-Panel p {font-size: 17px;}
.start-Panel a {color: #535353;}

#pageLiift .start-Panel .panelCol1 {width: 315px; margin-left: 0; margin-right: 0;}
#pageLiift .start-Panel .panelCol2 {width: 360px; margin-left: 45px; margin-right: 36px}
#pageLiift .start-Panel .panelCol3 {width: 184px; margin-left: 0; margin-right: 0;}

.start-Panel #tagline {margin-top: 100px;}
.start-Panel .panelCol1 .cycle, .start-Panel .cycle li {list-style: none; margin: 10px 0 0 0; padding: 0; text-indent: none;}


/* SOLUTION ADVISOR PANEL */

.tabSolutions .panel {background: #333333 url(../images/slider/solution_bg.png); }

.tabSolutions .panelCol1 {
	width: 330px;
	margin: 20px 50px 0 20px;
	}

.tabSolutions .panelCol2 {
	border-left: 2px ridge #f2791e;
	padding-left: 20px;
	}
	
.tabSolutions .panelCol3 {
	display:none;
	}	
	
.tabSolutions .panelCol1 p {font-size: 24px; line-height: 26px; margin-bottom: 10px; color: white;}

.tabSolutions .panelCol2 h3 {color: white; margin: 25px 0 0 0; padding: 0px; font-size: 17px;}
.tabSolutions .panelCol2 p {color: white; font-size: 17px;}

/* SOLUTION ADVISOR DROP DOWN */	
	
.sectorSelect {width: 300px;}
	
.selectbox{
	width: 300px;
	height: 31px;
	background: url(../images/slider/solution_dropdown.png) no-repeat;
	border: none;
	font-size: 16px;
	line-height: 16px;
	color: #535353;
	padding: 3px 0 0 10px;
	}
	
div.selectbox-wrapper {
    position:absolute;
    width:279px !important;
    background-color:white;
    margin:0px;
	margin-top:-33px;
	padding:5px 0;
	text-align:left;
	overflow: hidden;
	z-index: 50 !important;
	-webkit-border-top-left-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-bottomleft: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	box-shadow: 0px 0px 15px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 15px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0px 0px 15px rgba(0,0,0,0.5);
	}
	
div.selectbox-wrapper ul {
	list-style-type:none;
	margin:0px;
	padding:0px;
	}

div.selectbox-wrapper ul li.selected { 
 	background-color: #ededed;
 	}
 	
div.selectbox-wrapper ul li.current { 
	background-color: #cccccc;
	}
	
div.selectbox-wrapper ul li {
	list-style-type:none;
	display:block;
	margin:0;
	padding:2px 10px 2px 11px;
	cursor:pointer;
	font-size: 16px;
	}

.solutiontitle {display: none;}


/* --------------------------------------------- */
/* SLIDING PANELS */

.coda-nav, .solution-nav {
	width: 868px;
	height: 120px;
	background: #a9a7a7 url(../images/slider/sliderpanel_bg.png);
	float: left;
	overflow: hidden;
	}
	
#solutionOverlay {
	position: absolute;
	top: 330px;
	z-index: 60;
	display: none;
	}

.solution-nav {
	z-index: 50;
	position: absolute;
	left: 36px;
}
	
.coda-nav ul, .solution-nav ul {width: 1400px;height: 120px;}
	
	
.coda-nav ul li, .solution-nav ul li{
	display: block;
	float: left;
	cursor: pointer;
	width: 217px;
	}

	
.twoproducts .solution-nav ul li, .twoproducts .solution-nav ul li a {width: 432px; text-align: center;}

.threeproducts .solution-nav ul li, .threeproducts .solution-nav ul li a {width: 287px; text-align: center;}
.threeproducts .solution-nav ul li:first-child {width: 288px;}
	
.coda-nav ul li.last {width: 868px}
	
.coda-nav ul li a{
	background-image: url(../images/slider/slider_bg.png);
	background-position: 0 -120px;
	}
	
	
.coda-nav ul li a img, .solution-nav ul li a img {opacity: 0.2; margin: 0}
	
.coda-nav ul li a.current, .coda-nav ul li a.highlight, .coda-nav ul li:hover a {background-position: 0 0;}
.coda-nav ul li a.current img, .coda-nav ul li a.highlight img, .coda-nav ul li a:hover img {opacity: 1;}
.hello {background: red !important;}


.solution-nav ul li{
	background-image: url(../images/slider/solution_slider_bg.png);
	background-position: 0 -120px;
	border-left: 1px solid #828080;
	border-right: 1px solid #ebebeb ;
	}

.solution-nav ul li:hover {background-position: center 0;}
.solution-nav ul li.current {background-position: center -240px;}
.solution-nav ul li:hover img, .solution-nav ul li.current img {opacity: 1;}

 .shadow {position: absolute; top:280px ; left: 0px;width: 940px; height: 5px; background: url(../images/slider/shadow.png) repeat-x; text-indent: 125px; z-index: 50;}
 
#solutionOverlay .shadow {top: 0; z-index: 40;} 

.arrow-pointer {visibility: hidden;}

.coda-slider-wrapper .panel {height: 280px;}

.coda-nav ul li.return a {
background: none;}



/* Most common stuff you'll need to change */

	.coda-slider-wrapper { padding: 0; position: relative;}
	.coda-slider { background: white }
	
	/* Use this to keep the slider content contained in a box even when JavaScript is disabled */
	.coda-slider-no-js .coda-slider { height: 200px; overflow: auto !important; padding-right: 20px }
	
	/* Change the width of the entire slider (without dynamic arrows) */
	.coda-slider, .coda-slider .panel { width: 940px } 
	
	/* Change margin and width of the slider (with dynamic arrows) */
	.coda-slider-wrapper.arrows .coda-slider, .coda-slider-wrapper.arrows .coda-slider .panel { width: 600px }
	.coda-slider-wrapper.arrows .coda-slider { margin: 0 10px }
	
	/* Arrow styling */
	.coda-nav-left a, .coda-nav-right a { color: transparent; text-transform: capitalize; display: block; height: 100%;}
	
	/* Tab nav */
	.coda-nav ul li a.current { }
	
	/* Panel padding */
	.coda-slider .panel-wrapper { padding: 0 }
	
	/* Preloader */
	.coda-slider p.loading { padding: 20px; text-align: center }

/* Don't change anything below here unless you know what you're doing */

	/* Tabbed nav */
	.coda-nav ul, .solution-nav ul { clear: both; display: block; margin: auto; overflow: hidden }
	.coda-nav ul li, .solution-nav ul li { display: inline }
	.coda-nav ul li a, .solution-nav ul li a {  color: #fff; display: block; float: left; margin-right: 1px;  text-decoration: none }
	
	/* Miscellaneous */
	.coda-slider-wrapper { clear: both; overflow: hidden; }
	.coda-slider { float: left; overflow: hidden; position: relative }
	.coda-slider .panel { display: block; float: left }
	.coda-slider .panel-container { position: relative }
	.coda-nav-left, .coda-nav-right { float: left }
	.coda-nav-left a, .coda-nav-right a { display: block; text-align: center; text-decoration: none }




/* --------------------------------------------- */
/* SLIDING PANEL NAVIGATION */


.arrow {width: 36px; height: 120px; background-position: 0 0; cursor: pointer;}
.arrow:hover {width: 36px; height: 120px; background-position: 0 -150px;}
.arrow:active {width: 36px; height: 120px; background-position: 0 -300px;}
.left {background-image: url(../images/slider/left.png); float: left;}
.right {background-image: url(../images/slider/right.png); float: right;}
.left.disable, .right.disable {background-position: 0 -450px; cursor: default;}
.arrow a {visibility: visible; text-indent: -1000px; overflow: hidden;}
.arrow a.disable {visibility: hidden;}
.arrow.right.disable {
	position: absolute;
	left: 904px;
}

#skip, #return {position: absolute; z-index: 40; top: 280px;display: none;}
#skip a, #return a {display: block;height: 100%;width: 100%;color: transparent;}
#skip {background-image: url(../images/slider/left.png);  left: 0px;}
#return {background-image: url(../images/slider/right.png); left: 904px;}