﻿html {
  height: 100%;
  overflow-y: scroll;
}

body {
	color: #333;
	line-height: 1.4;
	font-size: 100.01%
}

body, html {
	margin: 0;
	padding: 0;
	background: #EEE url(/img/bk-body.png) left top repeat-x;
}

body, input, button, textarea, select {
	font-family: Verdana, 'Helvetica Neue', Helvetica, 'Liberation Sans', Arial, sans-serif;
	letter-spacing: .03em;
	text-rendering: optimizeLegibility;
}
body, p, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, blockquote, th, td {
	margin: 0;
	padding: 0;
}

fieldset, img { border: 0; }
img { vertical-align: bottom; }

h1, h2, h3, h4, h5, h6 {
	font-family: Verdana, 'Helvetica Neue', Helvetica, 'Liberation Sans', Arial, sans-serif;
	letter-spacing: .03em;
}
pre, tt, code, kbd, samp, var {
	font-family: "Courier New", Courier, monospace;
}

h1 { font-size: 28px; font-weight: normal; margin: 0 0 12px 0; color: #555; }
h2 { font-size: 15px; }
h3 { font-size: 13px; }
h4 { font-size: 12px; }
h5 { font-size: 11px; }
h6 { font-size: 10px; }

h2, h3, h4, h5 {
	margin: 0.5em 0 0.2em 0;
	color: #555;
	font-weight: bold;
}

p, li, dt, dd, th, td, input { font-size: 11px; }

p { margin-bottom: 8px; }
#main p {
	font-size: 12px;
	line-height: 1.6;
}
#main li {
	font-size: 12px;
	margin-bottom: 6px;
}
#tabList li { margin-bottom: 0; }

#main .sidebar p {
	font-size: 11px;
	line-height: 1.3;
}

a:link { color: #00F; text-decoration: none; }
a:visited { color: #808; text-decoration: none; }
a:hover { text-decoration: underline; }
a:focus { text-decoration: none; }
a:focus { outline: none; border-width: 0; }
a:active { outline: none; border-width: 0; }

ol li,
ul ol li { list-style-type: decimal; }
ul li { list-style-type: disc; }
ul ul li { list-style-type: circle; }
ul ul ul li { list-style-type: square; }
ol ol li { list-style-type: lower-alpha; }
ol ol ol li { list-style-type: lower-roman; }

sub {
	vertical-align: sub;
	font-size: smaller;
}

sup {
	vertical-align: super;
	font-size: smaller;
}

legend {
	color: #000;
	padding-bottom: .5em;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
	font-family: inherit;
}

caption {
  position: absolute;
  left: -999em;
}

th { text-align: center; }
tbody th { text-align: left; }

code { color: #06f; }
code, pre { font-family: "Courier New", monospace, serif; font-size: 11px; }

blockquote, q, em, cite, dfn, i, cite, var, address { font-style: italic; }
blockquote p:before, blockquote p:after, q:before, q:after { content: ''; }

th, strong, dt, b { font-weight: bold; }

ins {
	text-decoration: none;
	border-bottom: 3px double #333;
}

del { text-decoration: line-through; }
abbr, acronym {
	border-bottom: 1px dotted #333;
	font-variant: normal;
}

dd {
	padding-left: 20px;
	margin-top: .5em;
}

ol ul { margin-top: 4px; }
li { margin-left:30px; }
ul.flush li { margin-left: 11px; }
ul.plain li {
	list-style-type: none;
	margin-left: 0;
	padding: 0;
}

ul.filterList li {
	list-style-type: none;
	margin-left: 0;
	padding: 0;
	font-weight: bold;
	/*text-decoration: underline;*/
}

ul.filterList a:link,
ul.filterList a:visited {
	color: #000;
	text-decoration: none;
	font-weight: normal;
}

ul.filterList a:hover { text-decoration: underline; }

hr {
	border-style: inset;
	border-width: 1px;
}

label { padding-top: 1.2em; }
fieldset { line-height: 1; }

input[type="checkbox"] { vertical-align: bottom; }
input[type="radio"] { vertical-align: text-bottom; }
input, button, textarea, select, optgroup, option { font-size: 11px; }

/* this is to fix IE 6 and 7 which create extra right/left padding on buttons
 * IMPORTANT: because IE 6 does not understand the first selector below, you need to apply the class "inputButton" to all input of type="button" in your documents
 * the first declaration is for IE 6 and 7, the second one for IE 6 only, the third one is for all browsers.
 */
button,
input[type="submit"],
input[type="reset"],
input[type="button"],
.inputButton { padding: .2em .4em; }

.noMarker li {
	list-style: none;
	margin-left: 0;
}

/* Structure
---------------------------------------------------------------------------- */
/* #004D77 */

#header {
	margin-top: 6px;
	font-size: 0.8em;
}

#quickLinks {
	min-height: 40px;
	background: #004D77 url(/img/bk-quickLinks.png) left bottom repeat-x;
}

#quickLinksInner {
	position: relative;
	width: 950px;
	margin: 0 auto;
}

.searchPanel {
	float: right;
	width: 250px;
	margin: 3px 0 0 310px;
}

.searchTextBox {
	position: relative; /*autocomplete z-index doesn't take effect unless position is relative, fixed, or absolute */
	z-index: 28000; /* z-index of generated auto complete div = textbox z-index + 1. menu uses z-index = 28000 so this makes autocomplete cover the menu. */
	vertical-align: top;
	width: 200px;
	height: 1.5em;
	font-size: 11px;
	line-height: 1.5em;
}
.searchArrow {
	padding: 0 0 0 3px;
}

#quickLinks ul {
	float: right;
	width: 370px;
	margin: 4px 0 0 0;
	padding: 0;
}

#quickLinks ul li {
	list-style-type: none;
	float: right;
	font-size: 11px;
}

#quickLinks li a {
	display: block;
	height: 31px;
	padding-top: 4px;
	color: #FFF;
	text-decoration: none;
}

#quickLinks li a:visited { color: #FFF; }
#quickLinks li a:hover { text-decoration: underline; }

#qlWelcome {
	padding-left: 62px;
	background: transparent url(/img/img-world.png) left top no-repeat;
}

#nav {
	position: relative;
	min-height: 61px;
	background: transparent url(/img/bk-nav.png) left top repeat-x;
}

#navInner {
	width: 950px;
	margin: 0 auto;
}

a#linkHome {
	display: block;
	position: absolute;
	width: 266px;
	height: 82px;
	top: -21px;
	background: transparent url(/img/logo-trebor-badge.png) left top no-repeat;
}

a#linkHome span {
	position: absolute;
	display: block;
	top: -10000px;
	left: -10000px;
	font-size: 1px;
}

#menuWrapper {
	float: right;
	width: 675px;
	text-align: right;
}

#udm {
	/*width: 45.5em;*/
	width: 675px;
	left: 100%;
	/*margin-left: -44.5em;*/
	margin-left: -575px;
	letter-spacing: 0;
}

.currentSection { text-decoration: underline; }
.currentSubSection { text-decoration: underline; }

#udm li.onclick a {
	padding-right: 18px;
	background: transparent url(/img/bk-parent-menu.png) 100% 55% no-repeat;
}

#udm li.onclick li a {
	padding-left: 16px;
	background: transparent url(/img/bk-sub-menu.png) 4px -64px no-repeat;
}

#udm li.onclick li a:hover {
	background-color: #007DC3;
	background: #007DC3 url(/img/bk-sub-menu.png) 4px 6px no-repeat;
}

#udm li.menuItem1 ul { width: 24em; }
#udm li.menuItem2 ul { width: 19em; }
#udm li.menuItem3 ul { width: 18em; }
#udm li.menuItem4 ul { width: 23em; }
#udm li.menuItem5 ul { width: 16em; }

#content {
	background-color: #FFF;
}

#contentInner {
	width: 950px;
	margin: 0 auto;
}

#main {
	min-height: 460px;
	margin-left: 12px;
	padding: 16px 0;
}

#mainInner {
	width: 684px;
}

.sbRight #mainInner { float: left; }
.sbLeft #mainInner { float: right; }

.breadcrumb {
	margin: 0 0 16px 0;
	font-size: 11px;
}

.breadcrumb a:link,
.breadcrumb a:visited { color: #00F; }

.sidebar {
	width: 231px;
	margin-bottom: 20px;
	background: transparent url(/img/bk-sidebar.png) left top repeat-y;
}

.sbRight .sidebar { float: right; }

.sidebarTop {
	height: 17px;
	background: transparent url(/img/bk-sidebar-top.png) left top no-repeat;
}

.sbMap .sidebarTop {
	height: 128px;
	background: transparent url(/img/bk-sidebar-map-top.png) left top no-repeat;
}

.sidebarInner {
	padding: 0 18px 30px 18px;
	background: transparent url(/img/bk-sidebar-bottom.png) left bottom no-repeat;
}

.sidebar h2 {
	font-size: 11px;
	font-weight: bold;
	margin: 0 0 12px 0;
}

.sbMap .sidebarInner h2 { margin-top: 12px; }

.sidebar ul { margin-bottom: 12px; }
#main .sidebar li { font-size: 11px; }
.sidebar ul li { margin-bottom: 6px; }

#footer {
	clear: both;
	padding: 18px 0 12px 0;
	background: transparent url(/img/bk-footer.png) left top repeat-x;
	text-align: center;
	font-size: 10px;
}

#footer a:link,
#footer a:visited { color: #333; }

table.blHeader {
	width: 100%;
	margin: 12px 0;
}

table.blHeader th,
table.blHeader td { padding: 8px 12px; }
table.blHeader th {
	color: #FFF;
	background-color: #005DAE;
}
table.blHeader td { border-bottom: 1px solid #CCC; }

/* Home Page
---------------------------------------------------------------------------- */
.pgHome h1 {
	margin-bottom: 6px;
	text-align: center;
}
#rotator {
	position: relative;
	height: 217px;
	margin-right: 12px;
	overflow: hidden;
	background: transparent url(/img/bk-rotator.png) left top no-repeat;
}

#rotInner a {
	display: block;
	position: absolute;
	z-index: 99;
	width: 312px;
	height: 36px;
}

#lnkMaxim {
	top: 160px;
	left: 0;
}

#lnkQuantum {
	top: 169px;
	left: 0;
}

#lnkPirus {
	top: 160px;
	left: 0;
}

#lnkIq {
	top: 169px;
	left: 0;
}

#lnkIq span,
#lnkPirus span,
#lnkQuantum span,
#lnkMaxim span {
	position: absolute;
	display: block;
	top: -10000px;
	left: -10000px;
	font-size: 1px;
}

#welcomeLinks {
	position: absolute;
	z-index: 99;
	top: 67px;
	left: 702px;
	margin: 0;
	padding: 0;
}
#welcomeLinks a {
	display: block;
	width: 220px;
	height: 34px;
}

#rotator h2,
#welcomeLinks a span {
	position: absolute;
	display: block;
	top: -10000px;
	left: -10000px;
	font-size: 1px;
}

#features { margin: 20px 0; }
#features h2,
#features h3 { font-weight: bold; }

#featProd {
	float: left;
	width: 471px;
}

#featProd h2 { padding-left: 5px; }

#prodLinks {
	position: relative;
	width: 464px;
	height: 241px;
	background: transparent url(/img/bk-prodLinks.png) left top no-repeat;
}

#prodLinks a {
	display: block;
	position: absolute;
	width: 232px;
}
#prodLinks a:hover { text-decoration: none; }

a#prodUHPCP {
	top: 0;
	left: 0;
	height: 120px;
}

a#prodCH {
	top: 0;
	left: 232px;
	height: 120px;
}

a#prodDWH {
	top: 120px;
	left: 0;
	height: 121px;
}

a#prodPA {
	top: 120px;
	left: 232px;
	height: 121px;
}

#prodLinks a span {
	position: absolute;
	display: block;
	top: -10000px;
	left: -10000px;
	font-size: 1px;
}

#featNews {
	float: right;
	width: 440px;
	margin-right: 12px;
}

#featNews h2 {
	padding: 0 0 10px 0;
	border-bottom: 3px solid #DDD;
}

.event {
	margin: 0;
	padding: 10px 0;
	border-bottom: 3px solid #DDD;
}

.event h3 {
	margin: 0;
}

.event p {
	margin-bottom: 0;
	line-height: 1.3;
}

p.hasLogo {
	margin-left: 130px;
}
p.hasLogo:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

#news { margin-top: 12px; }

#news th {
	width: 120px;
	padding: 4px 6px 4px 0;
	vertical-align: top;
	text-align: right;
}

#news td {
	padding: 4px 0;
	vertical-align: top
}

/* Product Overview
---------------------------------------------------------------------------- */
.pgProdOV #prodLinks { margin: 25px 0; }
p.note {
	margin-top: 20px;
	padding: 22px 20px;
	background-color: #D9E6ED;
}

/* Reps Pages
---------------------------------------------------------------------------- */
#map_canvas { margin: 20px 0; }
h2.region {
	margin: 8px 0 0 0;
	padding: 8px 9px;
	color: #FFF;
	background-color: #015989;
	border-bottom: 1px solid #FFF;
	font-size: 13px;
	font-weight: bold;
}

table.repsTable {
	width: 100%;
	margin-bottom: 20px;
}

table.repsTable th {
	vertical-align: top;
	padding: 8px 9px;
	background-color: #CCC;
	text-align: left;
}

table.repsTable td {
	vertical-align: top;
	width: 50%;
	padding: 8px 9px;
}

a.btt {
	display: block;
	padding-left: 9px;
	font-size: 10px;
}

/* Product List
---------------------------------------------------------------------------- */
.bodyProdList table {
	clear: left;
	width: 100%;
	margin-bottom: 20px;
	white-space:nowrap;
}

.bodyProdList table th {
	padding: 8px 9px;
	color: #FFF;
	background-color: #005DAE;
}

.bodyProdList table th a { color: #FFF; }

.bodyProdList table td {
	padding: 8px 9px;
	border-bottom: 1px solid #CCC;
}

.productFamilyImage {
	float:left;
	padding:0 10px 10px 0
}

/* Product Detail
---------------------------------------------------------------------------- */
#productDetailHeader {
	margin: 0 0 16px 0;
}

#productDetailHeader img {
	float: left;
	margin: 0 12px 0 0;
}

#productDetailHeader h1 {
	margin: 0 0 8px 0;
	padding-top: 16px;
	color: #54555A;
	font-size: 20px;
}

#productTabs h2 {
	font-size: 12px;
	font-weight: bold;
}

table.performanceSummary {
	width: 100%;
	margin-top: 12px;
	border-top: 1px solid #CCC;
}

table.performanceSummary th,
table.performanceSummary td {
	padding: 8px 9px 8px 0;
	border-bottom: 1px solid #CCC;
}

#support ul li { margin-bottom: 6px; }

table.relatedProducts { width: 100%; }
table.relatedProducts td {
	padding: 8px 9px 8px 0;
	vertical-align: middle;
}

table.relatedProducts td img {
	float: left;
	margin-right: 12px;
}

table.relatedProducts .relatedProductLink { line-height:70px; display:block; height:100%; width:100%}
table.relatedProducts .relatedProductImage img { height:70px; width:70px; }

/* Search Results
---------------------------------------------------------------------------- */
p.resultsCount { color: #999; }

.bodySearchResults #mainInner h2 {
	margin-top: 16px;
	padding: 0 0 6px 0;
	border-bottom: 1px solid #CCC;
	font-size: 14px;
	font-weight: bold;
}

ul.searchResultsDocs { margin: 12px 0; }
ul.searchResultsDocs li { margin-bottom: 6px; }

table.searchResultsProducts { margin-bottom: 20px; }
table.searchResultsProducts th,
table.searchResultsProducts td {
	padding: 8px 9px 8px 0;
	border-bottom: 1px solid #CCC;
}

table.searchResultsProducts td.searchResultsProductsImage { padding-right: 16px; }
.searchResultsProductsImage img {width:70px; height:70px }
/* Support Documents
---------------------------------------------------------------------------- */
table.supportDocs {
	width: 100%;
	margin: 12px 0;
	border-top: 1px solid #D8D8DA;
}

table.supportDocs td,
table.supportDocs th {
	padding: 5px 0;
	border-bottom: 1px solid #D8D8DA;
}

table.supportDocs th a:link,
table.supportDocs th a:visited { color: #333; }
a.btClearFilters { padding-left: 8px; }

table.legal {
	width: 40%;
	margin: 20px 0;
}
table.legal th,
table.legal td {
	padding: 5px 8px;
	border: 1px solid #CCC;
}

table.apps {
	width: 100%;
	margin: 20px 0;
}

table.apps td {
	vertical-align: top;
	padding: 4px;
	font-size: 12px;
}


.section:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

.fl { float: left; }
.fr { float: right; }
img.fl { margin: 5px 12px 6px 0; }
img-fr { margin: 5px 0 6px 12px; }
.cl { clear: left; }
.cr { clear: right; }
.cb { clear: both; }

/* Design Request
------------------------------------------------------------------------ */
.designRequest div {
	clear: left;
	padding: 5px 0;
}
.designRequest label {
	display: block;
	float: left;
	width: 260px;
	padding: 0;
	font-size: 12px;
	line-height: 20px;
}

.designRequest label.tb {
	float: none;
	width: 600px;
}

.designRequest textarea.tb {
	width: 610px;
	height: 200px;
}

.designRequest input[type="text"] {
	height: 20px;
	line-height: 20px;
	width: 250px;
}
.required { color: #F00; }

.designRequest .getNewsletter label 
{
	float: none;
	display: inline;
	padding: 0 15px 0 5px;
}

/* Pump Selection Guide
------------------------------------------------------------------------ */
table.selectionGrid {
	width: 100%;
	margin: 20px 0;
}

.selectionGrid th {
	padding: 1px;
	color: #000;
	background-color: #fff;
	font-weight: normal;
	font-style: normal;
	font-size: 10px;
	margin: auto;
	border-width: 0 1px 1px 0;
	border-color: #000;
	border-style: solid;
	text-align: center;
}

tr.categories th {
	padding: 1px 3px;
	vertical-align: top;
}

.selectionGrid td {
	padding: 1px;
	border-width: 0 1px 1px 0;
	border-color: #000;
	border-style: solid;
}

.selectionGrid tbody th {
	padding: 3px 4px 3px 0;
	text-align: right;
}

.selectionGrid tbody td {
	min-width: 22px;
	min-height: 22px;
	vertical-align: middle;
	text-align: center;
}

.selectionGrid .yes {
	background: transparent url(/img/icon-yes.png) 50% 50% no-repeat;
	}

.selectionGrid .yes span {
	position: absolute;
	display: block;
	top: -10000px;
	left: -10000px;
	font-size: 1px;
	}

.vertical {
	position: relative;
	top: 48px;
	right: -58px;
	width: 20px;
	height: 130px;
	white-space: nowrap;
	-webkit-transform: rotate(270deg);
	-moz-transform: rotate(270deg);
	-o-transform: rotate(270deg);
}

