/* Fix unwanted default HTML styles */
body, form { margin: 0; padding: 0; }
img { vertical-align: top; }
a img { border: none; }
p, h2, h3 { line-height: 1.3; margin: 0; padding-bottom: 0.8em; }
ul, ol { padding: 0 0 0 1em; margin: 0; }
li { padding: 0; margin: 0; }

table {
    border-spacing: 0; border-collapse: collapse;
    table-layout: fixed; width: 100%;
    font-size: 100%;
}
* html table { width: auto; }
tr { vertical-align: top; }
td { padding: 0; }
th { text-align: left; }
form td { padding-bottom: 3px; }

/* General styles */
.foldable-closed, .hidden { display: none !important; }

body {
    background: white url(../img/back/swirl.gif) 0 182px no-repeat;
    background-attachment: fixed;
    font-size: 82%; text-rendering: optimizeLegibility;
}
body, input, textarea, select, option {
    font-family: "Trebuchet MS", "Trebuchet", "Bitstream Vera Sans", "Vera Sans", "Geneva", "Arial", sans-serif;
    color: rgb(76, 76, 76);
}
a { color: rgb(0, 160, 240); text-decoration: none; }
#nav, #products { font-size: 13px; }
#producttypes .foldable { font-size: 11px; }

#nav a, #products a {
    user-select: none; -moz-user-select: none; -webkit-user-select: none;
}

/* Alternative backgrounds for info pages */
#page-info-2 { background-image: url(../img/back/about.jpeg); background-position: right 200px; }
#page-info-3 { background-image: url(../img/back/quote.jpeg); background-position: right 180px; }
#page-info-4 { background-image: url(../img/back/maintenance.jpeg); background-position: right 140px; }
#page-info-5 { background-image: url(../img/back/repair.jpeg); background-position: right 120px; }
#page-info-6 { background-image: url(../img/back/usage.jpeg); background-position: right 140px; }
#page-info-7 { background-image: url(../img/back/jobs.jpeg); background-position: right 150px; }
#page-info-8 { background-image: url(../img/back/about.jpeg); background-position: right 180px; }
#page-info-15 { background-image: url(../img/back/survey.jpeg); background-position: right 150px; }

/* Page layout */
h1, #address { height: 140px; margin: 0; padding: 0; }
h1 { background: url(../img/back/edge-n.png) top left repeat-x; }
h1 img { width: 340px; height: 92px; }
#sitetools { position: absolute; z-index: 1; top: 0; right: 0; width: 376px; height: 66px; }
#sitetools.withquote { width: 464px; }
#nav { position: absolute; z-index: 2; top: 84px; left: 0; width: 100%; }
#breadcrumbs { display: none; }
#products { position: absolute; left: 0; width: 250px; top: 138px; min-height: 480px; }
#address { background: url(../img/back/edge-s.png) top left repeat-x; }
#content { margin: 0 32px 0 276px; min-height: 620px; }

/* Give IE6 non-alpha graphics */
* html h1 { background: url(../img/back/edge-n.gif); }
* html #address { background: url(../img/back/edge-s.gif); }

/* Compensate for IE5-6/Win's lack of min-height in layout */
* html #products { height: 480px; }
* html #content { height: 620px; }

/* Compensate for IE6/Win's inability to reflow selects properly */
* html .hidden select { display: none; }
* html #search select { position: relative; }

/* Site tools area */
#sitetools { background: url(../img/sep/sitetools.gif) no-repeat; }
#sitetools { vertical-align: top }
#sitelangs { position: absolute; top: 15px; right: 16px; width: 96px; text-align: right; }
#sitelangs img { width: 26px; height: 26px; }
#sitesearch-field { position: absolute; top: 12px; right: 140px; width: 160px; }
#sitesearch-submit { position: absolute; top: 12px; right: 112px; width: 28px; }
#sitesearch-button {
    width: 28px; height: 32px;
    border: none; padding: 0; margin: 0;
    background: url(../img/form/search-e.gif);
}
#sitesearch-button:hover { background-position: 0 -32px; }
#sitesearch-button:active { background-position: 0 -64px; }

#sitequote { position: absolute; top: 18px; left: 48px; width: 92px; }
#sitequote a { display: block; height: 20px; text-align: center; background-image: url(../img/link.gif); }
#sitequote a:hover { background-position: 0 -20px; }
#sitequote a.selected, #sitequote a:active { background-position: 0 -40px; }

#debugstamp {
    position: absolute; top: 12px;
    left: 256px; width: 128px;
    color: red; text-align: center;
    font-size: 150%; font-weight: bold;
    border: dashed red 3px; border-radius: 8px;
}

/* Top nav */
#nav div { margin-left: 18px; }
#nav a {
  display: block; float: left;
  width: 92px; height: 20px; margin: 1px 4px 2px 1px;
  text-align: center;
  background-image: url(../img/link.gif);
}
#nav a:hover { background-position: 0 -20px; }
#nav a.selected, #nav a:active { background-position: 0 -40px; }
#nav a:active:focus { outline: none; }

/* Bottom bits */
#address div {
    position: absolute; z-index: 3;
    right: 0; width: 440px;
    margin-top: 42px; padding-top: 20px; height: 78px;
    background: url(../img/sep/address.gif) no-repeat;
}
#address img { float: right; height: 68px; padding-right: 12px; }
#iso9001 { width: 112px; height: 68px; }
#safecontractor { width: 68px; height: 68px; padding-left: 10px; }
#address address { text-align: right; padding-top: 32px; }
#address address a { display: block; }

/* Product tree */
#products { background: url(../img/sep/products.gif) no-repeat; }
#stocktypes, #producttypes, #productsearch { padding: 16px 0 16px 12px; }
#productstocktype { padding: 16px 44px 0 16px; }
#productstocktype .f-label { width: 34px; }
#productsearch { padding-top: 0; }
#products .nav { padding: 0 0 4px 32px; }
#products img { position: absolute; left: 16px; height: 22px; width: 22px; }
#products a, #products .a {
    display: block;
    width: 156px; height: 20px;
    text-indent: 10px;
    background-image: url(../img/link.gif); background-position: -92px 0;
}
#products a:hover { background-position: -92px -20px; }
#products a.selected, #products a:active { background-position: -92px -40px; }
#products a:active:focus { outline: none; }

.folder {
    display: block; position: absolute;
    left: 16px; width: 22px; height: 22px;
    background-image: url(../img/fold.gif);
}
.folder-closed { background-position: -22px 0; }
.folder-open { background-position: -44px 0; }
.folder-closed:hover { background-position: -22px -22px; }
.folder-open:hover { background-position: -44px -22px; }

/* Greyed-out product types/categories */
#producttypes a, .disabled { color: rgb(180, 180, 180); }

#nav a, #stocktypes a, #productsearch a, #sitequote a,
#producttypes.stocktype-0 a.stock-1,
#producttypes.stocktype-0 a.stock-2,
#producttypes.stocktype-0 a.stock-3,
#producttypes.stocktype-1 a.stock-1,
#producttypes.stocktype-2 a.stock-2,
#producttypes.stocktype-3 a.stock-3,
#producttypes.stocktype-5 a
{ color: rgb(76, 76, 76); }

/* Content boxes */
.boxgrid .product, .boxgrid .feature, .boxgrid .content { float: left; width: 320px; margin-right: 20px; margin-bottom: 20px; }
.boxgrid .rowfirst, .boxgrid .rowbottom { clear: left; }
.boxgrid .rowlast { margin-right: 0; }

.product .box-nw { background: url(../img/box/product-nw.png) top left no-repeat; }
.product .box-ne { background: url(../img/box/product-ne.png) top right no-repeat; }
.product .box-w { background: url(../img/box/product-w.png) top left repeat-y; }
.product .box-e { background: url(../img/box/product-e.png) top right repeat-y; }
.product .box-sw { background: url(../img/box/product-sw.png) bottom left no-repeat; }
.product .box-se { background: url(../img/box/product-se.png) bottom right no-repeat; }
.feature .box-nw { background: url(../img/box/feature-ne.png) top right no-repeat; }
.feature .box-ne { background: url(../img/box/feature-nw.png) top left no-repeat; }
.feature .box-w { background: url(../img/box/feature-e.png) top right repeat-y; }
.feature .box-e { background: url(../img/box/feature-w.png) top left repeat-y; }
.feature .box-sw { background: url(../img/box/feature-se.png) bottom right no-repeat; }
.feature .box-se { background: url(../img/box/feature-sw.png) bottom left no-repeat; }
.content .box-nw { background: url(../img/box/content-nw.png) top left no-repeat; }
.content .box-ne { background: url(../img/box/content-ne.png) top right no-repeat; }
.content .box-w { background: url(../img/box/content-w.png) top left repeat-y; }
.content .box-e { background: url(../img/box/content-e.png) top right repeat-y; }
.content .box-sw { background: url(../img/box/content-sw.png) bottom left no-repeat; }
.content .box-se { background: url(../img/box/content-se.png) bottom right no-repeat; }

.content-end { clear: right; }

.box-nw { min-height: 160px; position: relative; }
* html .box-nw { height: 160px; }
.product .box-nw { padding: 16px 22px 16px 48px; }
.feature .box-nw { padding: 16px 48px 16px 22px; }
.content .box-nw { padding: 16px 22px 16px 22px; }

.sideinfo { position: absolute; bottom: 12px; }
.product .sideinfo { left: 12px; }
.feature .sideinfo { right: 12px; }

.box-sep { width: 16px; }
.boxes { margin: 16px 0; }
#product { margin-bottom: 24px; }

/* Product list */
.list { margin: 16px 0; }
.listpic { width: 60px; text-align: center; }
.listpic img { width: 48px; height: 48px; }
.list .product { height: 48px; padding: 0 6px 0 2px; white-space: nowrap; overflow: hidden; }
.list .product p, .list .product h2 { padding: 0.2em 0 0 0; }
.list .row1 .product { background: url(../img/sep/row1.gif) top right no-repeat; }
.list-all { text-align: right; }
#servicesearch { float: right; width: 26em; margin-left: 2em; }
#servicesearch .more { text-align: right; }
.suppliercode { display: block; font-size: 75%; }

/* Home page boxes */
#promos, #specials, .promo, .special, #centrifugesearch, #page-info-1 #calculator {
    width: 100%; height: 160px; overflow: hidden;
}
.carousel-prev, .carousel-next {
    position: absolute; font-size: 80%; cursor: pointer;
    border: none; background: transparent; margin: 0; padding: 0;
}
.product .carousel-prev, .product .carousel-next { left: 12px; color: rgb(160, 160, 160); }
.feature .carousel-prev, .feature .carousel-next { right: 12px; color: rgb(0, 160, 240); }
.carousel-prev { top: 8px; }
.carousel-next { top: 24px; }

.promo, .promo div, .promo-banner a {
  display: block; width: 100%; height: 160px;
}
.promo-banner a { background-repeat: repeat-x; background-position: top center; }
.promo-banner a .wrap { display: none; }

.product h2, .product h3, .promo h3, .boxgrid .content h3 { font-size: 100%; font-weight: bold; }
.product h2 .category { font-style: italic; font-weight: normal; }
.product h2 .newprice { font-weight: normal; margin-left: 1em; }
.productimage img, .promo-text img { float: right; width: 96px; height: 96px; margin-left: 4px; padding: 4px; }
.productimage img { background-image: url(../img/box/productimageframe.png); }
.promo-text img, .promo-survey img, .promo-hires img, .promo-recons img { background-image: url(../img/box/featureimageframe.png); }
.product .more, .promo .more { clear: right; }

#page-info-1 #calculator { background: url(../img/back/calculator.jpeg) top right; }
#centrifugesearch { background: url(../img/back/centrifugesearch.jpeg) top right no-repeat; }
.flashing { color: red; }

/* Product page */
#productimage, #thumbs, #sheets, #quoteme { margin-bottom: 16px; }

#attachments { float: right; width: 225px; height: 225px; margin: 24px 8px 0 16px;}
#moreattachments { float: right; clear: right; width: 225px; margin: 0 8px 48px 16px;}
#productimage { position: relative; width: 216px; margin-right: 1px; margin-left: 4px; background: url(../img/thumb/plinth-n.gif) top left no-repeat; }
#productimage a { display: block; padding: 12px; background: url(../img/thumb/plinth-s.gif) bottom left no-repeat; }
#productimage img { width: 192px; height: 192px; }

#thumbs a { float: left; width: 74px; height: 74px; margin-right: 1px; background: url(../img/thumb/thumb.gif); }
#thumbs a:hover { background-position: -74px; }
#thumbs a.selected, #thumbs a:active { background-position: 0 -148px; }
#thumbs a img { width: 48px; height: 48px; margin: 13px; }
#thumbs div { clear: left; }

#sheets, #quoteme { width: 216px; margin-left: 5px; margin-right: 5px; background: url(../img/thumb/plinth-n.gif) top left no-repeat; }
#sheets div, #quoteme div { padding: 12px; background: url(../img/thumb/plinth-s.gif) bottom left no-repeat; }
.sheet { padding: 3px 0; }
.sheet img { vertical-align: middle; width: 16px; height: 16px; margin-right: 6px; }

.productcost { font-weight: bold; font-size: 125%; color: rgb(0, 160, 240); }
.productvideo { position: absolute; left: 0; }
.productvideo-hidden { left: -4000px; }

.inactive-warning {
    color: red; text-align: center;
    padding: 1em; margin: 1em 240px 1em 0;
    border: dashed red 2px; border-radius: 6px;
}

/* Survey summary */
.survey-quoteses, .survey-quotes { height: 250px; overflow: hidden; }
.survey-quote { background: url(../img/survey/quote.gif) top left no-repeat; padding-left: 32px; min-height: 32px; }
.survey-toggle { clear: right; position: relative; top: -1.5em; }
.survey-chart { float: right; width: 275px; text-align: center; position: relative; left: 16px; }
.survey-subchart { float: right; width: 224px; }
.survey-main { margin-right: 264px; }
.surveyquestiongrid { clear: right; padding-top: 1em; }
.survey-main .box-e { margin: 1em 0; }

#survey-key { vertical-align: bottom; }

/* Other page-specific styling */
#tube-diagram { width: 100px; height: 118px; }
#contact-map { float: right; margin-right: -32px; width: 392px; height:387px; }
#contact-form { clear: right; }
#usage-calculator { float: right; width: 300px; }
#usage-content { margin-right: 320px; }
.contact-details p {  padding-bottom: 0; }
.report { color: red; }
#manufacturers, #links { display: none; }
#quoteproducts { margin-bottom: 16px; }
#quotedetails { margin-top: 16px; }
.equipment { position: relative; padding-left: 112px; }
.equipment-image { position: absolute; left: 0; width: 100px; overflow: hidden; }
#accessories { margin-top: 2em; }
#accessories h2 { font-size: 150%; }
#accessories h3 { padding: 0.4em 0 0.2em 0; }

/* Form fields */
input, textarea, select, option { font-size: 13px; }
.f label, .f span, .f a { display: block; padding-top: 4px; }
td.f, .f td { padding-right: 8px; }
.f input, .f textarea, .f select, .f option {
    width: 100%;
    box-sizing: border-box; -moz-box-sizing: border-box;
    -ms-box-sizing: border-box; -webkit-box-sizing: border-box; -khtml-box-sizing: border-box;
}
.f label { text-align: right; }
.f-notes label, .f-unit label { text-align: left; }
input.default { font-weight: bold; }

.f-label { width: 7.5em; }
.f-unit { width: 2.5em; }
.f-radio { width: 26px; }
.f-notes { font-size: 85%; padding-bottom: 12px; }
.r-notes { font-size: 85%; text-align: right; padding-bottom: 6px; }
.f-r { text-align: right; }
fieldset { margin-bottom: 8px; padding-right: 4px; }

table#login { width: 18em; }
.t-num { width: 6em; }
.t-cat { width: 9em; }
.t-adj { width: 48px; }
.cash { text-align: right; }

.elide, .essential { display: none; }

.adjust-minus, .adjust-plus {
    float: left; width: 18px; height: 24px;
    background-image: url(../img/form/adjust.gif);
}
.adjust-minus { background-position: 0 -24px; }
.adjust-minus:hover { background-position: 0 -48px; }
.adjust-minus:active { background-position: 0 -72px; }
.adjust-minus.disabled { background-position: 0 0px; }
.adjust-minus:active:focus { outline: none; }
.adjust-plus { background-position: -18px -24px; }
.adjust-plus:hover { background-position: -18px -48px; }
.adjust-plus:active { background-position: -18px -72px; }
.adjust-plus.disabled { background-position: -18px 0px; }
.adjust-plus:active:focus { outline: none; }


/* Search field - specialled up */
.input-search {
    background: url(../img/form/search-w.gif) top left no-repeat;
    height: 32px; padding-left: 15px;
}
.input-search div {
    background: url(../img/form/search.gif) top left repeat-x;
    padding: 6px 0; height: 32px;
}
.input-search input { border: none; margin: 0; padding: 0; background: transparent; }

/* Quote field - also specialled up */
#quoteme.active #quoteme-box {
    display: block; position: relative;
    float: right; width: 91px;
    background: url(../img/form/quote-w.gif) top left no-repeat;
}
#quoteme.active #quoteme-quantity {
    border: none; margin: 0; padding: 0; background: transparent;
    width: 45px; height: 23px;
    margin: 6px 15px;
}
#quoteme.busy { cursor: wait; }
#quoteme-label { display: block; margin-top: 6px; height: 32px; }
#quoteme-next { font-size: 82%; padding: 6px 0 0 0; }

#quoteme-button {
    float: right; text-align: center; position: relative;
    width: 89px; height: 32px;
    border: none; padding: 0; margin: 0;
    background: transparent url(../img/form/button.gif) -160px 0;
}
#quoteme-button:hover { background-position: -160px -32px; }
#quoteme-button:active { background-position: -160px -64px; }

#quoteme-inc, #quoteme-dec {
    position: absolute; display: block;
    left: 64px; width: 26px; height: 16px;
    background: url(../img/form/quoteadjust.gif);
}
#quoteme-inc { top: 1px; background-position: -26px -17px; }
#quoteme-dec { top: 17px; background-position: 0 -17px; }
#quoteme-inc:hover { background-position: -26px -34px; }
#quoteme-dec:hover { background-position: 0 -34px; }
#quoteme-inc:active { background-position: -26px -51px; }
#quoteme-dec:active { background-position: 0 -51px; }
#quoteme-inc.disabled { background-position: -26px 0; }
#quoteme-dec.disabled { background-position: 0 0; }

#paymentprotx { margin-top: 1em; }
#paymentprotx img { float: right; width: 192px; height: 67px; }
#paymentprotx input { margin-top: 1em; }

/* search result highlighting */
.highlight { border-width: 1px; border-style: dashed; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; }
.highlight-0 { border-color: rgb(128, 128, 224); }
.highlight-1 { border-color: rgb(224, 128, 128); }
.highlight-2 { border-color: rgb(112, 212, 112); }
.highlight-3 { border-color: rgb(212, 80, 212); }
.highlight-4 { border-color: rgb(80, 202, 202); }
.highlight-5 { border-color: rgb(224, 224, 80); }