@charset "utf-8";
/* CSS Document */

/* <Global Layout Stuff> */
/* <Standard Elements> */
/* <Typography Elements> */
/* <Links> */
/* <Center Body Structure> */
/* <Right Body Structure> */
/* <Table Layouts> */
/* <Buttons> */
/* <Forms> */
/* <Footer Elements> */
/* <Internet Explorer Exceptions> */

/***********************


/* <Global Layout Stuff> */
 
body {
	font-family: Arial, Helvetica, sans-serif;
	color: #333333;
	background: #333 url(../images/body_bg.gif) repeat-x left top;
	}

#wrapper {
	clear: both;
	width: 940px;
	margin: auto;
	background: #fff;
	padding: 0;
	}

#container {
	margin: 20px 0 20px 0;
	}

#header {
	background: #fff url(../images/mts_site_header.jpg) no-repeat top left;
	height: 213px;
	clear: both;
	
}

#print_header { display:none; }

#site-title {
	margin: 167px 100px 0px 0px;
	float: right;
	display: block;
	}
	
#site-title h1 {
	font-family: Arial Narrow, Arial, Helvetica, sans-serif;
	font-size: 25px;
	font-weight: normal;
	color: #fff;
	}

.sales-title {
	width: 840px;
	margin-top: 120px;
	position: absolute;
	font-family: Arial Narrow, Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: normal;
	color: #666666;
	text-align: right;
	}
		
/* </Global Layout Stuff> */


/* ---------------------------------------------------------------*/


/* <Standard Elements> */

.content-left {
	float: left;
	width: 580px;
	margin: 5px 0px 0px 60px;
	padding: 0;
	vertical-align: top;
	}

.content-right {
	float: left;
	width: 220px;
	margin: 15px 60px 0px 20px;
	padding: 0;
	vertical-align: top;
	}

.content-modal {
	width: 380px;
	margin: 5px 0px 0px 10px;
	padding: 0;
	vertical-align: top;
	}
					
p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #666;
	line-height: 15px;
	padding-bottom: 10px;
	}

.intro {
	font-size: 12px;
	line-height: 17px;
	}

h1 {
	font-family: Arial Narrow, Arial, Helvetica, sans-serif;
	font-size: 20px;
	font-weight: normal;
	color: #c4161c; 
	margin: 0 0 10px -1px;
	}
				
h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: normal;
	letter-spacing: 1px;
	color: #000;
	margin: 25px 0 20px 0;
	text-transform: uppercase;
	}
	
h3 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #000;
	padding: 5px 0px 10px 0px;
	}

h4 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #666666;
	line-height: 18px;
	padding: 20px 0px 5px 0px;
	}

sup {
	font-size: .6em;
	}

td { vertical-align: top; }

input {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000;
	}


/* </Standard Elements> */


/* ---------------------------------------------------------------*/


/* <Typography Elements> */

.note {
	font-size: 11px;
	color: #666666;
	line-height: 15px;
	margin-top: 80px;
	}
	
.allcaps {
	text-transform: uppercase;
	}
	
/* </Typography Elements> */


/* ---------------------------------------------------------------*/


/* <Links> */

a {
	color: #ff9900;
	text-decoration: none;
	outline: none;
	}

a:link {
	color: #ff9900;
	}

a:visited {
	color: #ff9900;
	}

a:hover {
	text-decoration: underline;
	}


/* </Links> */


/* <Lists> */

ul.basic li {
	margin-top: 5px;
	list-style-type: disc;
	margin-left: 10px;
	line-height: 1.5em;
	font-size: 12px;
	}

ul.linklist li {
	font-size: 10px;
	color: #ff9900;
	line-height: 14px;
	background: url(../images/arrow-right.png) left 7px no-repeat;
	padding: 2px 0 0 10px;
	text-transform: uppercase;
	}

ul.linklist li a {
	font-size: 10px;
	text-decoration: none;
	color: #ff9900;
	}

ul.linklist li a:hover { 
	text-decoration: underline;
	}

ul.border-list li {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #666666;
	border-top: 1px solid #ddd;
	padding: 10px 0px 10px 0px;
	display: block;
	line-height: 15px;
	}

ul.border-list li.last {
	border-bottom: 1px solid #ddd;
	}
	
ul.border-list li.print {
	background: url(../images/icon-print.png) left top no-repeat;
	padding: 10px 0 10px 35px;
	font-size: 10px;
	color: #000;
	text-transform: uppercase;
	}

ul.border-list li.print a {
	color: #000;
	text-decoration: none;
	}
	
ul.border-list li.print a:hover {
	color: #000;
	text-decoration: underline;
	}
	
ul.border-list li.email {
	background: url(../images/icon-email.png) left top no-repeat;
	padding: 10px 0 10px 35px;
	font-size: 10px;
	color: #000;
	text-transform: uppercase;
	}
	
ul.border-list li.email a {
	color: #000;
	text-decoration: none;
	}
	
ul.border-list li.email a:hover {
	color: #000;
	text-decoration: underline;
	}

ul.back li {
	font-size: 11px;
	color: #000;
	margin: 5px 50px 0px 0px;
	line-height: 16px;
	background: url(../images/arrow-back.png) left 7px no-repeat;
	padding: 3px 0 0 10px;
	text-transform: uppercase;
	}

ul.back li a {
	font-size: 11px;
	text-decoration: underline;
	color: #000;
	}

ul.back li a:hover { 
	font-size: 11px;
	text-decoration: none;
	color: #000;
	}
	
ul.basic, ol.basic {
	padding: 0 0 0 2px;
	margin-bottom: 15px;
	}
			
/* </Lists> */


/* ---------------------------------------------------------------*/


/* <Center Body Structure> */

.basic-box {
	background: #FFF url(../images/filter-box-bg.jpg) right top no-repeat;
	padding: 9px 9px 10px;
	border: 1px solid #cccdce;
	}
	

.savings {width:580px;height:48px;color:#333;}
.savings .col {float:left;width:158px;font-size:12px;padding:10px 0 0 10px; line-height: 14px;}
.savings .dollar {float:left;width:20px;font-size:25px;padding:10px 0 0 5px;}
.hpu-savings {background:url(../images/hpu-savings-background.gif);}
.fluid-power-savings {background:url(../images/fluid-power-savings-background.gif);}



						
/* </Center Body Structure> */


/* ---------------------------------------------------------------*/


/* <Right Body Structure> */


.content-right img { display: inline; }

.content-right h2 { margin: 0 0 18px 0; }

.photoFeature { 
	background: #f1f1f1; 
	border-bottom: 1px solid #fff; 
	position: relative;
	clear: both;
	/* overflow: visible; */
	}
	
.photoFeature h2 {
	font-size: 10px;
	color: #fff;
	margin: 0;
	padding: 12px 10px 9px 10px;
	background: #222 url(../images/quote_box.jpg) 0 100% no-repeat;
	letter-spacing: normal;
	}
	
.photoFeature p {
	margin: 0;
	padding: 0 0 8px 0;
	font-size: 11px;
	}
	
.photoFeature img {
	/* Helps with getting rid of the space below the image in IE */
	vertical-align: text-top;
	}
	
.photoFeature .contact_image {
	position: absolute;
	left: 10px;
	top: -10px;
	z-index: 10;
	}
	
.photoFeature h2.phone {
	padding-left: 90px;
	font-size: 13px;
	text-transform: none;
	}
	
/*-------------------------------
		Black Boxes Tags
--------------------------------*/

.black_box {
	background: #1c1c1c url(../images/black_box.jpg) 0 0 no-repeat;
	padding: 19px 16px 10px 16px;
	color: #fff;
	}
	
.black_box p {
	color: #fff;
	padding: 10px 0 5px 0; 
	}

.black_box h2 {
	background: none;
	padding: 0 0 15px 0;
	}

/*-------------------------------
		Gray Boxes Tags
--------------------------------*/
  
.gray_box {
	background: #f1f1f1 url(../images/box_outline_bg.gif) 0 0 repeat-x;	
	padding: 20px 15px 20px 15px;
	}
	
.content-left .gray_box, .content-left .gray_box_products {
	background: #f1f1f1;
	padding: 15px 15px 20px 15px;
	}

.content-left .gray_box_products {
	height: 100%;
	}

.content-left .gray_box_products .left-side { 
	height: 100%;
	background-color: #f1f1f1;
	}
	
.content-left .gray_box_products .right-side {
	width: 170px;
	}

/* </Right Body Structure> */


/* ---------------------------------------------------------------*/


/* <Table Layouts> */

.data-display {
	padding: 0;
	}
	
.data-display td {
	font-size:13px;
	line-height: 17px;
	color: #333;
	padding: 5px 10px;
	}

.data-display.no-padding td { padding: 5px 0; }
	
	.data-display td.label {
		/* Recommend setting width of label column by using the "w-###" class in the first row */
		text-align:right;
		white-space:nowrap;
		font-weight:bold;
	}
	
	
table.input-grid { 
	width: 100%;
	margin: 0;
	padding: 0;
	}

	
.input-grid td {
	background: #f1f1f1;
	padding: 5px 10px 5px 10px;
	font-size: 12px;
	color: #666666;
	border-bottom: 5px solid #fff;
	vertical-align: middle;
	border-collapse: collapse;
	}
	
.input-grid td.label {
	width: 220px;
	background: #f1f1f1;
	padding: 5px 10px 5px 10px;
	font-size: 12px;
	color: #666666;
	border-bottom: 5px solid #fff;
	vertical-align: middle;
	border-collapse: collapse;
	}

/* </Table Layouts> */


/* ---------------------------------------------------------------*/


/* <Buttons> */

a.button { padding-bottom: 6px; margin-top: 16px; }

	a.button {
		background: url(../images/tab-bg.png) left top repeat-x;
		border: 1px solid #d55c19;
		padding: 8px 15px;
		font-size: 13px;
		line-height:13px;
		cursor:pointer;
		font-weight:bold;
		color: #fff;
		text-decoration:none;
		display: inline-block;
		line-height: 16px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		margin:0;
		}
				

		a.button:hover { 
		text-decoration:none; 
		color: #fff; 
		background: url(../images/tab-bg-over.png) left top repeat-x;
		}
		
		a.button-full {
			width: 100%;
			text-align:center;
			padding: 8px 0;
		}
		
a.fake-button:hover { 
		text-decoration:none; 
		}

/* </Buttons> */

/* ---------------------------------------------------------------*/

/* <Forms> */

.form-container div { 
	font-size: 12px;
	}	

.form-row { 
	clear: both;
	background: #f1f1f1;
	padding: 5px 10px 5px 10px;
	margin-bottom: 5px;
	}

.form-row .label {
	font-size: 12px;
	color: #666666;
	margin-right: 10px;
	}

a.form-help {
	font-size: 10px;
	color: #000;
	text-transform: uppercase;
	text-decoration: underline;
	margin-left: 15px;
	}

a.form-help, a.form-help:link, a.form-help:visited {
	text-decoration:underline;
	}
	
a.form-help:hover {
	text-decoration:none;
	}

.form-row div.colspan {
	width: 100%;
	text-align: left;
	}
	
	div.error { color: #F00; }
	input.error, textarea.error { background: #fcc; border: 1px solid #cc0000; }

.error-box {
	color: #cc0000;
	background: #f7d9d9 url(../images/icons/error-x.png) 8px 10px no-repeat; 
	border: 1px solid #cc0000;
	padding: 10px 10px 10px 34px!important;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	}

.error-box p {
	color: #CC0000;
	}

/* MTS CODE */

textarea, select {
	font-family: Arial, Helvetica, sans-serif;
	border: 1px solid #ccc;
	font-size: 12px;
	color: #333;
	width: 250px;
	padding: 3px;
	}

input.form_fields {
	height: 21px;
	}

textarea { margin-bottom: 9px; }

.form_fields {
	border: 1px solid #ccc;
	padding-left: 3px;
	}

/* </Forms> */

/* ---------------------------------------------------------------*/

/* <Footer Elements> */

#footer-container {
	width: 100%;
	margin: auto;
	margin-top: 20px;
	}
	
#footer {
	width: 820px;
	margin: auto;
	border-top: 1px solid #ddd; 
	font-size: 9px;
	display: block;
	padding: 28px 0 10px 5px;
	text-align: center;
	}

#footer p {
	text-align: center;
	font-size: 9px;
	margin: 0;
	color: #666666;
	}

/* </Footer Elements> */


/* ---------------------------------------------------------------*/


/* <Internet Explorer Exceptions> */
	
	/*****  Please see: /assets/utils/ie.css  *****/

/* </Internet Explorer Exceptions> */


/* ---------------------------------------------------------------*/


/* <Override Everything Else > */

/* Refined Layout Elements */

.rounded {-moz-border-radius: 5px;	-webkit-border-radius: 5px;	border-radius: 5px;}
.border { border: 1px solid #c2c2c2; }
.action-needed {background:#fcf3d9;}


.dashed {  border-bottom: 1px dashed #d6d6d6; margin-bottom: 12px; }
.unread td { font-weight:bold;}
.shaded {	background:#ebebeb; }
.white { background: #FFF; }
.no-background-color { background-color:transparent!important; }
.modal-header {padding:3px;background:#000;}
.modal-header a {font-size:12px;padding-top:-5px;}
.modal-header .wrap {float:right;}
.modal-header img {margin:8px 0 0 3px;cursor:pointer;}


/* Set Widths (does not include padding) */
.w-860 { width: 860px!important; }
.w-840 { width: 840px!important; }
.w-700 { width: 700px!important; }
.w-650 { width: 650px!important; }
.w-600 { width: 600px!important; }
.w-550 { width: 550px!important; }
.w-500 { width: 500px!important; }
.w-460 { width: 460px!important; }
.w-455 { width: 455px!important; }
.w-450 { width: 450px!important; }
.w-410 { width: 410px!important; }
.w-400 { width: 400px!important; }
.w-390 { width: 390px!important; }
.w-340 { width: 330px!important; }
.w-330 { width: 330px!important; }
.w-300 { width: 300px!important; }
.w-280 { width: 280px!important; }
.w-270 { width: 270px!important; }
.w-240 { width: 240px!important; }
.w-228 { width: 228px!important; }
.w-200 { width: 200px!important; }
.w-190 { width: 190px!important; }
.w-180 { width: 180px!important; }
.w-166 { width: 166px!important; }
.w-140 { width: 140px!important; }
.w-127 { width: 127px!important; }
.w-100 { width: 100px!important; }
.w-80 { width: 80px!important; }
.w-75 { width: 75px!important; }
.w-50 { width: 50px!important; }
.w-40 { width: 40px!important; }
.w-5 { width: 5px!important; }


/* Floats */
.float-left { float:left!important;  }
.float-right { float: right!important; }
.right { text-align:right!important; }
.left { text-align:left!important; }
.centered { text-align:center!important; }
.middle { vertical-align: middle!important; }

/* Borders + Padding */
body .margin-all { margin: 10px!important; }
body .padding-all { padding:10px!important; }
body .padding-all-med { padding:15px!important; }
body .padding-all-dbl { padding:20px!important; }
body .margin-left { margin-left:10px!important; }
body .margin-left-dbl { margin-left:20px!important; }
body .margin-left-half { margin-left:5px!important; }
body .padding-left-half { padding-left:5px!important; }
body .padding-left { padding-left:10px!important; }
body .padding-left-med { padding-left:15px!important; }
body .padding-left-dbl { padding-left:20px!important; }
body .padding-left-4x { padding-left:40px!important; }
body .no-margin-left { margin-left:0px!important; }
body .padding-right { padding-right:10px!important; }
body .padding-right-dbl { padding-right:24px!important; }
body .margin-top-neg-half { margin-top:-5px!important; }
body .margin-top-neg-half-ie { margin-top:-25px!important; }
body .margin-top-neg { margin-top:-10px!important; }
body .margin-top-neg-dbl { margin-top:-20px!important; }
body .margin-top { margin-top:10px!important; }
body .no-margin-top { margin-top:0px!important; }
body .margin-bottom-half { margin-bottom:5px!important; }
body .margin-top-dbl { margin-top:20px!important; }
body .margin-top-half { margin-top:5px!important; }
body .margin-bottom { margin-bottom:10px!important; }
body .margin-bottom-15 { margin-bottom:15px!important; }
body .margin-bottom-dbl { margin-bottom:20px!important; }
body .no-margin-bottom { margin-bottom:0px!important; }
body .padding-top-half { padding-top:5px!important; }
body .padding-top { padding-top:10px!important; }
body .padding-top-med { padding-top:15px!important; }
body .padding-top-dbl { padding-top:20px!important; }
body .padding-bottom-half { padding-bottom:5px!important; }
body .padding-bottom { padding-bottom:10px!important; }
body .padding-bottom-med { padding-bottom:15px!important; }
body .padding-bottom-dbl { padding-bottom:20px!important; }
body .auto-width { width:auto; }
body .no-border { border:none!important; }
body .no-border td { border:none!important; }
body .no-border-left { border-left:none!important; }
body .border-top {  border-top: 1px solid #d6d6d6!important;  }
body .no-padding { padding: 0; margin: 0!important; }
body .no-padding-left { padding-left : 0!important; margin-left : 0!important; }
body .no-padding-right { padding-right: 0!important; margin-right: 0; }
body .no-padding-top { padding-top: 0!important; margin-top: 0; }
body .no-padding-bottom { padding-bottom: 0!important; margin-bottom: 0; }

/* Dividers */
.divider { border-top: 1px solid #cccdce; width: 100%; }

.line-divider { 
	border-top: 1px solid #dddddd;
	height: 5px;
	width: 100%;
	margin-top: 15px;
	clear: both;
	}

/* Clear Div */
.clearer {
	width: 100%;
	margin: 0;
	padding: 0;
	clear: both;
	height: 0px;
	}

span.csym { margin-right: 3px; } 

/* </Override Everything Else > */

.ui-tooltip-content{
		padding:10px;
		border:4px solid #ebb700!important;
		font-size: 13px;
		line-height: 16px;
		background:#fbf1cc;
		}

.ui-tooltip-default .ui-tooltip-titlebar,
.ui-tooltip-default .ui-tooltip-content{
	border-color: #F1D031;
	background-color: #fbf1cc!important;
	color: #555;
}
		
.ui-tooltip-rounded,
.ui-tooltip-rounded .ui-tooltip-content{
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}
 
	.ui-tooltip-rounded .ui-tooltip-titlebar{
		-moz-border-radius: 5px 5px 0 0;
		-webkit-border-radius: 5px 5px 0 0;
		border-radius: 5px 5px 0 0;
	}
 
	.ui-tooltip-rounded .ui-tooltip-titlebar + .ui-tooltip-content{
		-moz-border-radius: 0 0 5px 5px;
		-webkit-border-radius: 0 0 5px 5px;
		border-radius: 0 0 5px 5px;
	}


/* slider root element */
.slider {
    background:#c0c0c0 repeat-x 0 0;
    height:5px;
    position:relative;
    cursor:pointer;
    border:1px solid #333;
    width:200px;
    float:left;
    clear:right;
    margin-top:10px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    -moz-box-shadow:inset 0 0 8px #000;
}

/* progress bar (enabled with progress: true) */
.progress {
    height:5px;
    background-color:#C5FF00;
    display:none;
    opacity:0.6;
}

/* drag handle */
.handle {
    background:#808080 repeat-x 0 0;
    height:22px;
    width:8px;
    top:-10px;
    position:absolute;
    display:block;
    margin-top:1px;
    border:1px solid #000;
    cursor:move;
    -moz-border-radius:4px;
    -webkit-border-radius:14px;

}

/* the input field */
.range {
    border:1px inset #ddd;
    float:left;
    font-size:12px;
    margin:0 0 0 15px;
    padding:3px 0;
    text-align:center;
    width:50px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
}

  .jslider .jslider-bg i,
  .jslider .jslider-pointer { background: url(../images/jslider.png) no-repeat 0 0; }

  .jslider { display: block; width: 100%; height: 1em; position: relative; top: 0.6em; font-family: Arial, sans-serif; }
  .jslider table { width: 100%; border-collapse: collapse; border: 0; }
  .jslider td, .jslider th { padding: 0; vertical-align: top; text-align: left; border: 0; }

  .jslider table,
  .jslider table tr,
  .jslider table tr td { width: 100%; vertical-align: top; }

  .jslider .jslider-bg { position: relative; }
  .jslider .jslider-bg i { height: 5px; position: absolute; font-size: 0; top: 0; }
  .jslider .jslider-bg .l { width: 20%; background-position: 0 -20px; left: 0; }
  .jslider .jslider-bg .r { width: 80%; left: 20%; background-position: right 0; }
  .jslider .jslider-bg .v { position: absolute; width: 60%; left: 20%; top: 0; height: 5px; background-position: 0 -20px; }

  .jslider .jslider-pointer { width: 13px; height: 15px; background-position: 0 -40px; position: absolute; left: 20%; top: -4px; margin-left: -6px; cursor: pointer; cursor: hand; }
  .jslider .jslider-pointer-hover { background-position: 0px -40px; }
  .jslider .jslider-pointer-to { left: 80%; }

  .jslider .jslider-label { font-size: 9px; line-height: 12px; color: black; opacity: 0.4; white-space: nowrap; padding: 0px 2px; position: absolute; top: -18px; left: 0px; }
  .jslider .jslider-label-to { left: auto; right: 0; }

  .jslider .jslider-value { font-size: 9px; white-space: nowrap; padding: 1px 2px 0; position: absolute; top: -19px; left: 20%; background: white; line-height: 12px; -moz-border-radius: 2px; -webkit-border-radius: 2px; -o-border-radius: 2px; border-radius: 2px; }
  .jslider .jslider-value-to { left: 80%; }

  .jslider .jslider-label small,
  .jslider .jslider-value small { position: relative; top: -0.4em; }

  .jslider .jslider-scale { position: relative; top: 9px; }
  .jslider .jslider-scale span { position: absolute; height: 5px; border-left: 1px solid #999; font-size: 0; }
  .jslider .jslider-scale ins { font-size: 9px; text-decoration: none; position: absolute; left: 0px; top: 5px; color: #999; }

  .jslider-single .jslider-pointer-to,
  .jslider-single .jslider-value-to,
  .jslider-single .jslider-bg .v,
  .jslider-limitless .jslider-label { display: none; }
.jslider_round_plastic .jslider-bg i,
.jslider_round_plastic .jslider-pointer { background-image: url(../images/jslider.round.plastic.png); }
.jslider_round_plastic .jslider-pointer { width: 18px; height: 18px; top: -7px; margin-left: -8px; }	
