@charset "utf-8";
/* CSS Document */

body#sub {margin:0; padding:0; background-image:url(../images/sub/bg.gif); background-repeat:repeat-x; color:#353838; font-family:Arial, Helvetica, sans-serif; font-size:11px;}
body#narrowHead {margin:0; padding:0; background-image:url(../images/sub/bg_narrowHead.gif); background-repeat:repeat-x; color:#353838; font-family:Arial, Helvetica, sans-serif; font-size:11px;}
#greenBar {background-color:#4c6629; height:6px; width:980px; background-image:url(../images/sub/bg_greenBar.gif); background-repeat:repeat-x;}
.grass {font-size:12px; color:#65b017; font-weight:bold;}
/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

#subMenu {width:945px; height:31px; margin:0; padding:0; background-image:url(../images/sub/bg_subMenu.jpg); list-style-type:none; padding:13px 0 0 35px;}
#subMenu li {float:left; width:110px;}

#breadcrumb {width:975px; height:29px; background-image:url(../images/sub/bg_breadcrumb.jpg); color:#919191; font-size:12px; padding:10px 0 0 5px;}
#breadcrumb a {color:#919191; text-decoration:none;}
#breadcrumb a:hover {text-decoration:underline;}

#subTitle {display:block; width:980px; height:37px; background-image:url(../images/sub/bg_subTitle.jpg); background-repeat:repeat-x;}
#subTitle-left {background-image:url(../images/sub/bg_subTitle-left.jpg); width:11px; height:37px; display:block; float:left;}
#subTitle-right {background-image:url(../images/sub/bg_subTitle-right.jpg); width:11px; height:37px; display:block; float:right;}
#subTitle .headline {color:#ff8401; font-size:14px; font-weight:bold; margin:9px 0 0 0; display:block; float:left;}

#innerContent {
	margin:20px 15px;
	font-size:12px;
	position:relative;
	text-align: justify;
}
.button {height:20px; display:block; margin:0 auto; background-image:url(../images/sub/bg_button.gif); background-repeat:repeat-x; max-width:250px; text-align:center; padding:6px 0 0 0; color:#ff8401; font-weight:bold; text-decoration:none;}
.button-left {display:block; height:26px; width:9px; background-image:url(../images/sub/bg_button-left.gif); float:left; margin:-6px 0 0 0;}
.button-right {display:block; height:26px; width:9px; background-image:url(../images/sub/bg_button-right.gif); float:right; margin:-6px 0 0 0;}
.button:hover {text-decoration:underline;}

#logos {margin:40px auto; padding:0; list-style-type:none; width:680px; text-align:center;}
#logos li {display:inline;}
#logos li img {border:3px solid #d4ceaa; margin:0 10px 10px 0;}

#imageSection {width:340px; height:260px; float:left;}
#benefitDetail {width:569px; height:232px; float:left; background-image:url(../images/sub/bg_benefitDetail.jpg); background-repeat:no-repeat; margin:0; padding:5px 0 0 40px; list-style-type:none;}
#benefitDetail li {background-image:url(../images/sub/bullet.gif); background-repeat:no-repeat; padding:0 0 0 10px; margin:0 0 6px 0; background-position:0 5px;}
#backOffice_content-big {
	width:890px;
	height:50px;
	border-bottom:1px solid #ebebe5;
	display:block;
	color:#ff8401;
	font-weight:bold;
	font-size:20px;
	padding:25px 0 2px 90px;
	background-image:url(../images/sub/bg_backOffice-big.gif);
	text-align: left;
}
#fieldService-big {
	width:890px;
	height:50px;
	border-bottom:1px solid #ebebe5;
	display:block;
	color:#5aa4e0;
	font-weight:bold;
	font-size:20px;
	padding:25px 0 2px 90px;
	background-image:url(../images/sub/bg_fieldInterface-big.gif);
	text-align: left;
}

.divider {width:980px; height:16px; background-image:url(../images/sub/divider.gif); background-repeat:no-repeat; clear:both; display:block; margin:20px 0;}
#content #backOffice-items {margin-left:70px;}

#fieldInterface-items {margin:7px 0 0 0; padding:0; list-style-type:none;}
#fieldInterface-items li {
	float:left;
	margin-top: 0;
	margin-right: 8px;
	margin-bottom: 12px;
	margin-left: 60px;
}
#fieldInterface-items li a {display:block; width:162px; height:68px; color:#6e6b51; font-size:10px; text-decoration:none; padding:10px 10px 0 67px;}
#fieldInterface-items li.last {margin:0 0 0 0;}

#fieldInterface-items li a .title {color:#6d6a51; font-size:18px; display:block; margin:0 0 5px 0;}
#fieldInterface-items li a:hover .detail {text-decoration:underline;}

#fieldInterface-items li#benefits a {background-image:url(../images/backOffice/benefits.jpg);}
#fieldInterface-items li#dispatching a {background-image:url(../images/backOffice/dispatching.jpg);}
#fieldInterface-items li#accounting a {background-image:url(../images/backOffice/accounting.jpg);}
#fieldInterface-items li#inventory  a{background-image:url(../images/backOffice/inventory.jpg);}
#fieldInterface-items li#invoicing a {background-image:url(../images/backOffice/invoicing.jpg);}
#fieldInterface-items li#quoting  a{background-image:url(../images/backOffice/quoting.jpg);}
#fieldInterface-items li#handheldsbox  a{background-image:url(../images/backOffice/handhelds.jpg);}

#fieldInterface-items li#benefits .title, #fieldInterface-items li#benefits .detail {color:#fff;}


#contactLeft-box {width:428px; border-right:2px solid #f6f6f3; position:absolute; left:0; top:0; bottom:0; padding:0 2px 0 0; font-size:11px !important;}
#contactLeft-box img {float:right; margin:0 20px 10px 0;}
#contactRight-box {margin:0 0 0 430px; font-size:11px;}
#contactRight-box td {border-bottom:2px solid #f6f6f3;}
#contactRight-box a {text-decoration:underline; color:#353838;}
#contactRight-box a:hover {text-decoration:none;}

.textBox {background-image:url(../images/sub/bg_input.gif); width:253px; height:29px; margin:0 30px 0 0; text-align:left; padding:3px 0 0 8px;}
.textBox input {background:transparent; border:0; width:241px; margin:7px 0 0 0; height:22px; font-size:11px; color:#999; padding:0;}
.textBox-ml {background-image:url(../images/sub/bg_inputML.gif); width:253px; height:182px; margin:0 30px 0 0; text-align:left; padding:3px 0 0 8px;}
.textBox-ml textarea {background:transparent; border:0; width:247px; margin:7px 0 0 0; height:170px; font-size:11px; color:#999; padding:0; font-family:Arial, Helvetica, sans-serif;}
.sendBt {margin:0 30px 0 0;}

.days {width:150px; height:124px; background-image:url(../images/sub/bg_days.jpg); background-repeat:no-repeat; background-position:bottom; padding:0 0 0 5px;}
.telNr {background-image:url(../images/bg_telNr.gif); background-repeat:no-repeat; width:155px; height:18px; display:block; color:#ff8401; font-weight:bold; text-align:center; padding:12px 0 0 0; font-size:11px; margin:0 0 0 15px;}

#inventorySlider {width:600px; height:700px; margin:0 auto; border:1px solid #d3cfb3; background-repeat:repeat-x; background-image:url(../images/bg_inventorySlider.jpg);}

/*---------------------------------------------- SLIDER -----------------------------------------------*/

		.stripViewer .panelContainer .panel ul {
			text-align: left;
			margin: 0 15px 0 30px;
		}
		
		.slider-wrap { /* This div isn't entirely necessary but good for getting the side arrows vertically centered */
			width: 100%;
			height:700px;
			background-image:url(../images/sub/bg_bigImg.gif);
			background-repeat:no-repeat;
			background-position:40px 10px;
		}

		/* These 2 lines specify style applied while slider is loading */
		.csw {width: 100%; height:1000px; background: #fff; overflow: scroll}
		.csw .loading {margin: 200px 0 300px 0; text-align: center}

		.stripViewer { /* This is the viewing window */
			position: relative;
			float:left;
			overflow: hidden; 
			margin: 20px 0 0 50px;
			width: 600px; /* Also specified in  .stripViewer .panelContainer .panel  below */
			height: 700px;
			
		}
		.ssInfo {
	position:absolute;
	left:40px;
	bottom:0px;
	color:#585542;
	display:block;
	right: 40px;
}
		.stripViewer .panelContainer { /* This is the big long container used to house your end-to-end divs. Width is calculated and specified by the JS  */
			position: relative;
			left: 0; top: 0;
			width: 100%;
			list-style-type: none;
			/* -moz-user-select: none; // This breaks CSS validation but stops accidental (and intentional - beware) panel highlighting in Firefox. Some people might find this useful, crazy fools. */
		}
		
		.stripViewer .panelContainer .panel { /* Each panel is arranged end-to-end */
			float:left;
			height: 700px;
			position: relative;
			width: 617px; /* Also specified in  .stripViewer  above */
		}
		
		.stripViewer .panelContainer .panel .wrapper { /* Wrapper to give some padding in the panels, without messing with existing panel width */
			padding: 0;
		}
		
		.stripNav { /* This is the div to hold your nav (the UL generated at run time) */
			float:right;
			display:none;
		}
		
		.stripNav ul { /* The auto-generated set of links */display:none;}
			
		ul.rightBlockImages {float:right; list-style-type:none; margin:10px 30px 0 0; padding:0; display:block !important;}
		ul.rightBlockImages li {background-image:url(../images/sub/galThmb.jpg); background-repeat:no-repeat; width:158px; height:106px; margin:0 0 20px 0; padding:3px 0 0 3px;}
		ul.rightBlockImages li.nr2 {background-image:url(../images/sub/galThmb2.jpg) !important;}
		ul.rightBlockImages li.nr3 {background-image:url(../images/sub/galThmb3.jpg) !important;}
		ul.rightBlockImages li a.imgInfo {color:#6c903a; text-decoration:none; font-weight:bold; margin:4px 10px 0 0; float:right;}
		ul.rightBlockImages li a.imgInfo:hover {text-decoration:underline;}
		ul.rightBlockImages li img {border:0; margin:0 !important;}
		.stripNav a { /* The nav links */
			font-size: 10px;
			font-weight: bold;
			text-align: center;
			line-height: 32px;
			background: #c6e3ff;
			color: #fff;
			text-decoration: none;
			display: block;
			padding: 0 15px;
		}
		
		.stripNav li.tab1 a { background: #60f }
		.stripNav li.tab2 a { background: #60c }
		.stripNav li.tab3 a { background: #63f }
		.stripNav li.tab4 a { background: #63c }
		.stripNav li.tab5 a { background: #00e }
		
		.stripNav li a:hover {
			background: #333;
		}
		
		.stripNav li a.current {
			background: #000;
			color: #fff;
		}
		
		.stripNavL, .stripNavR { /* The left and right arrows */
			position: absolute;
			bottom: 15px;
			text-indent: -9999px;
			z-index:855;
		}
		
		.stripNavL a, .stripNavR a {
			display: block;
			height: 30px;
			width: 30px;
		}
		
		.stripNavL {
			left: 40px;
		}
		
		.stripNavR {
			right: 213px;
		}
		
		.stripNavL {
			background: url("../images/sub/arrow-left.jpg") no-repeat center;
		}
		
		.stripNavR {
			background: url("../images/sub/arrow-right.jpg") no-repeat center;
		}

		p a, li a { color: #39c; text-decoration: none }
		
		p.intro { border-bottom: 1px solid #ccc; margin-bottom: 20px; padding: 20px 0 30px 0; text-align: center; width: 100% }

