/*** general styles setting up the container and some basic spacing */ body { font: .7em/1.3 Arial, Helvetica, sans-serif; color: #333; text-align: center; background: #c0d0df url(../images/layout/body_back.gif) 0 0 repeat-x; } #container { width: 780px; text-align: left; margin: 0 auto 10px; padding: 0; } #content-container { background-color: #fff; padding: 10px; } .skip-to { display: none; } /* link styles */ a { color: #0c60a9; } a:hover { background-color: #0c60a9; color: #fff; text-decoration: none; } a:visited { color: #333; } a:visited:hover { color: #fff; background-color: #333;} a:focus { outline: #000000 dotted 1px; } /* clear focus */ .small-promo .go-button a:focus { outline: none; } /* element styles */ p { padding: .5em 0 .5em; } sub { font-size:xx-small; vertical-align:bottom; } ul { margin: 8px 15px; list-style-type: disc; } li { padding-bottom: 2px; } /* style with grey border below... */ #subnav h3 , .heading, .link-promo h3 { color: #333; padding-bottom: 6px; font: bold 1.5em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; background: url(../images/layout/heading-bg.gif) bottom left repeat-x; } #subnav h3 b, .heading b, .link-promo h3 b { border-bottom: 4px solid #ccc; padding-bottom: 2px; } h1 { font: bold 2.4em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; } .large-promo h1 { font-size: 1em; font-weight: normal; } h2 { font-weight: bold; font-size: 1.2em; margin: 5px 0 5px 0; line-height: 1.2; } .cat-info h2 { font-size: 1.3em; margin: 0 0 3px; } .category-group h2, .general-item h2 { font: bold 1.4em "Trebuchet MS", Verdana; margin: 0; } .general-item h2 span { font-family: Arial, Helvetica, sans-serif; font-size: .5em; text-transform: uppercase; } h3 { font-size: 1.1em; font-weight: bold; color: #0c5fa8; margin: 2px 0 4px; } .related-info h3 { font: bold 1.1em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; color: #333; } .small-promo h3, .cross-sell h3 { font: bold 1.5em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; } .cross-sell h3 { font-size: 1.2em; } strong, b { font-weight: bold; } a.callout, a.callout:hover{ color: #0C60A9; background: url(../images/layout/blue_double_arrow.gif) 0 center no-repeat; padding: 0 0 0 10px; font-weight: bold; } a.pdf, a.zip, a.img, a.view, a.download-image{ padding: 2px 0 2px 18px; font-weight: bold; } a.pdf:hover, a.zip:hover, a.img:hover, a.view:hover, a.download-image:hover{ color: #0C60A9 } a.pdf{ background: url(../images/layout/icons/pdf.gif) 0 center no-repeat; } a.zip{ background: url(../images/layout/icons/zip.gif) 0 center no-repeat; } a.img{ background: url(../images/layout/icons/img.gif) 0 center no-repeat; } a.view{ background: url(../images/layout/icons/view.gif) 0 center no-repeat; } a.download-image{ background: url(../images/layout/icons/download-image.gif) 0 center no-repeat; } .bar{ margin: 0 3px; } .inset-left{ float: left; margin: 0 10px 10px 0; } .inset-right{ float: right; margin: 0 0 10px 10px; } /* layout styles */ /* generic */ .hr { background: url(../images/layout/hr-grey.gif) repeat-x; margin: 5px 0; height: 6px; } .smhr { background: url(../images/layout/hr-dotted-blue.gif) repeat-x; margin: 5px 0; height: 1px; } .hr hr { visibility: hidden; } /* masthead */ #masthead { padding: 0 0 0 7px; overflow: hidden; min-height:103px; height:auto !important; height:103px; } #logo { float: left; width: 310px; margin: 25px 0 0; } #logo:hover{ background: none; } #headUtil{ float: right; width: 270px; margin: 0; padding: 49px 0 0; } #loginAction{ display: none; margin: 3px 0 20px; background: #dde6ef; border-color: #98b0c6; border-width: 0 1px 1px; border-style: solid; text-align: center; padding: 4px 0 6px; font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; } #loginAction a{ font-weight: bold;} #headUtil form { float: right; width: 170px; margin: 0 10px 0 0; } #headUtil form * { vertical-align: middle; } #headUtil form label { display: block; font: bold 1.2em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; } #headUtil form input { padding: 0; font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; width: 120px; color: #333; } #headUtil form button { width: 27px; height: 22px; text-indent: -5000px; cursor: pointer; margin-left: 5px; } #headUtil form button { background: url(../images/layout/buttons.gif) 0px 0px no-repeat; } #headUtil form button:hover { background-position: -28px 0px; } #headUtil ul { text-align: right; float: right; list-style: none; margin-top: 2px; } #headUtil ul li { font: bold 1em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; } /* top navigation */ #navigation { border-bottom: 4px solid #8facc7; margin-bottom: 10px; height: 32px; } #navigation ul { list-style: none; margin: 0; background: url(../images/layout/main-nav-bg.gif) repeat-x; font: bold 1.2em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; } #navigation li { float: left; display: inline; height: 31px; border-right: 1px solid #09487f; margin-bottom: 1px; padding: 0; } #navigation a { display: block; margin: 8px 8px 0; color: #fff; text-decoration: none; } #navigation a:hover { background: none; text-decoration: none; color: #9dbedb; } #navigation li.selected { height: 32px; margin-bottom: 0; background: url(../images/layout/main-nav-bg.gif) 0px -38px repeat-x; border-color: #fff; margin-left: -1px; border-left: 1px solid #fff; } #navigation li.selected a:hover { color: #fff; } #navigation li.catalog { background: url(../images/layout/icon-requestcatalog.jpg) bottom right no-repeat; border-right: none; padding-right: 37px; } /* sub navigation */ #subnav {} #subnav ul { list-style: none; margin: 3px 5px 14px 0px; } #subnav li { background: url(../images/layout/icons/arrow-double-blue.gif) 0px 5px no-repeat; padding-left: 14px; } #subnav ul.alt li { background: url(../images/layout/icons/arrow-double-green.gif) 0px 5px no-repeat; } #subnav li { font-weight: bold; font-size: 1.05em; padding-bottom: 4px; text-indent: -4px; } #subnav .alt li { font-size: 1em; } #subnav .alt li a { color: #199e5c; } #subnav .alt li a:hover { background-color: #199e5c; color: #fff; } #subnav ul ul{ margin: 0 0 0 -4px;} #subnav ul ul li{ padding: 0 0 2px 10px; font-size: 11px; background: none; font-weight: normal; } #subnav ul ul li.current{ background: url("../images/cccc/blue_arrow.gif") no-repeat scroll 0 5px transparent; } /* column sizing */ #content { float: left; width: 580px; margin-left: 180px; display: inline; padding-bottom: 10px; position: relative; } #other { float: left; width: 170px; margin-left: -760px; } /* sub colums */ .page-info { margin: 10px 0; } .page-info .content { width: 400px; float: left; } .page-info .related { width: 170px; float: right;} .product-detail { margin: 0 0 10px; } .product-detail .product-info { float: left; width: 310px; } .product-detail .product-other { float: right; width: 264px; } /* full (no leftnav) */ .full #content{ width: 760px; margin-left: 0; padding-bottom: 60px; } .full .page-info .content{ width: 580px; } /* breadcrumb */ .specifications { width: 100%; border-collapse: collapse; margin: 10px 0; } .specifications td { border: 1px solid #ccc; width: 75%; padding: 5px; } .specifications th { text-align: left; border: 1px solid #ccc; background-color: #deeaf6; width: 25%; padding: 5px; } .breadcrumb { padding: 0; margin: 2px 0 5px; font: .9em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; } .breadcrumb i { font-style: normal; display: inline; vertical-align: -15%; font-size: 1.4em; } /* help */ .helpLink{ display: block; width: 16px; height: 16px; text-indent: -9999px; background: url(../images/layout/icons/question.gif) 0 0 no-repeat; overflow: hidden; } .helpContent{ position: absolute; left: -99999px; border: 5px solid #707070; padding: 20px; width: 690px; background: #fff; -moz-border-radius: 20px; -webkit-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; } .helpActive{ left: 10px; } .helpNubbin{ width: 16px; height: 6px; position: absolute; top: -11px; background: url(../images/layout/help_nubbin.gif) center 0 no-repeat; } .helpContent .close{ display: block; position: absolute; right: 10px; top: 10px; padding: 3px 20px 2px 0; background: url(../images/layout/icons/close.gif) right center no-repeat; color: #0C60A9; } .helpContent h2{ font-size: 24px; font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; margin: 0 0 10px; } .helpContent p{ font-size: 12px; margin: 0 0 10px; } /* category listing */ .category-listing { background: url(../images/layout/hr-grey.gif) repeat-x; padding-top: 1px; margin-top: 10px;} .category-listing .category-item { margin: 5px 0; border-top: 1px solid #cccccc; } .category-listing .cat-image { width: 135px; float: left; margin: 10px 0; } .category-listing .cat-image img { border: 1px solid #cacaca; } .category-listing .cat-info { width: 300px; float: left; padding-right: 10px; margin: 10px 0; } .cat-image a, .cat-image a:hover { background: none; text-decoration: none; } .category-listing .cat-info p { padding: 1px 0 4px; } .category-listing .cat-info ul { margin: 0 0; list-style: none; } .category-listing .cat-info li { background: #fff url(../images/layout/icons/arrow-single-blue.gif) 0px 6px no-repeat; padding-left: 8px; } /* .category-listing .cat-info .action { text-align: right; padding-right: 10px; background: url(../images/layout/icons/arrow-double-green.gif) right center no-repeat; } */ .category-listing .action a { color: #199e5c; font-weight: bold; } .category-listing .action a:hover { background-color: #199e5c; color: #fff; } .category-listing .related-info { width: 120px; float: left; margin: 10px 0; border-left: 2px solid #ccc; padding: 5px 0 5px 5px; } .category-listing .related-info ul { list-style: none; margin: 4px 0; } .category-listing .related-info li { font-size: .9em; background: #fff url(../images/layout/icons/icon-checkmark.gif) 0px 3px no-repeat; padding-left: 14px; padding-bottom: 2px; } /* general listing */ .general-listing { padding-top: 1px; margin-top: 5px;} .general-listing .general-item { margin: 5px 0; padding: 5px 0; border-top: 1px solid #cccccc; } .general-listing .general-item p { padding: 1px 0 4px; } .general-listing .general-item .read-more { padding-left: 8px; background: #fff url(../images/layout/icons/arrow-single-blue.gif) 0px 6px no-repeat; } .general-listing .read-more a { color: #199e5c; font-weight: bold; } .general-listing .read-more a:hover { background-color: #199e5c; color: #fff; } /* news contents */ .news {} .news img, .article img { border: 1px solid #cacaca; margin: 0 0 10px 0; } .news .img, .article .photo { background: none; } .news .image-right { float: right; margin-left: 10px; } .news .image-left { float: left; margin-right: 10px; } /* product detail page */ .product-detail {} .product-detail .hr { background: url(../images/layout/hr-dotted-blue.gif) repeat-x; margin: 5px 0; height: 1px; } .product-detail .short-description { font-style: italic; margin: -5px 0 0; } .product-detail .long-description { font-size: 1.1em; } .product-detail .product-other img { border: 1px solid #cacaca; margin: 5px 0 10px; } .product-detail .product-other .img { background: none; padding: 0; } .product-detail .product-other .enlarge { padding: 0; margin: 0; background: url(../images/layout/view-larger.gif) no-repeat; } .product-detail .product-other .enlarge a { display: block; height: 24px; text-indent: -5000px; } .product-detail .product-other .enlarge a:hover { background: none; } .product-detail .product-other .actions { background: url(../images/layout/gradient-grey-white.gif) repeat-x; padding: 5px 10px 10px; margin-top: 1px; } .product-detail .product-other .actions ul { list-style: none; margin-left: 0; } .product-detail .product-other .actions li { font: bold 1.2em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; padding: 5px 0 5px 30px; background: url(../images/layout/icons/product-icons.gif) 0px 0px no-repeat; } .product-detail .product-other .actions li a { text-decoration: none; } .product-detail .product-other .actions .datasheet { background-position: 0px 0px; } .product-detail .product-other .actions .manual { background-position: 0px -40px; } .product-detail .product-other .actions .print { background-position: 0px -80px; } .product-detail .product-other .actions .email { background-position: 0px -120px; } .product-detail .product-other .actions .contact { background-position: 0px -160px; } .product-detail .product-other .order{ border-top: 3px solid #ccc; border-bottom: 1px solid #ccc; padding: 1px 0; } .product-detail .product-other .order fieldset{ overflow: hidden; background: #eee; padding: 10px; font-size: 13px; color: #333; font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-weight: bold; } .product-detail .product-other .order .price{ width: 135px; float: left; } .product-detail .product-other .order .price dt{ width: 75px; float: left; clear: left; padding: 0 0 5px; } .product-detail .product-other .order .price dd{ width: 60px; float: left; padding: 0 0 5px; } .product-detail .product-other .order .addToOrder{ display: block; margin: 10px 0 0; padding: 0; width: 87px; height: 22px; background: url(../images/layout/buttons.gif) 0 -203px; cursor: pointer; float: right; text-indent: -9999px; } .product-detail .product-other .order .addToOrder:hover{ background: url(../images/layout/buttons.gif) -88px -203px; } .product-detail .product-other .orderAction fieldset{ overflow: hidden; } .product-detail .product-other .orderAction .totals{ border-top: 3px solid #ccc; border-bottom: 1px solid #ccc; padding: 1px 0; margin: 0 0 20px; } .product-detail .product-other .orderAction .totals dl{ overflow: hidden; background: #eee; padding: 10px; font-size: 13px; color: #333; font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-weight: bold; } .product-detail .product-other .orderAction .price dt{ width: 184px; float: left; clear: left; padding: 0 0 5px; } .product-detail .product-other .orderAction .price dd{ width: 60px; float: left; padding: 0 0 5px; text-align: right; } .product-detail .product-other .orderAction .addToOrder{ display: block; padding: 0; width: 144px; height: 41px; background: url(../images/layout/buttons.gif) 0 -329px; cursor: pointer; float: right; text-indent: -9999px; } .product-detail .product-other .orderAction .addToOrder:hover{ background: url(../images/layout/buttons.gif) 0px -370px; } /* product listing */ .product-listing {} .product-listing .prod-item { margin-bottom: 10px; background: url(../images/layout/hr-dotted-blue.gif) bottom left repeat-x; } .product-listing .prod-item .prod-photo { float: left; width: 75px; margin-bottom: 10px; } .product-listing .prod-item .prod-photo img { border: 1px solid #CCC; } .product-listing .prod-item .prod-name { padding-bottom: 10px; } .product-listing .prod-item .prod-name a { font: bold 1.2em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; text-decoration: none; } .product-listing .prod-item .prod-name p { padding: 0; font-style: italic; } /* tab menu */ .tab-ui {} .tab-ui { margin: 0 0 0; } .tab-ui ul { margin: 0; list-style: none; display: block; z-index: 3; } .tab-ui li { float: left; padding: 0; margin-right: 3px; } .tab-ui li a { display: block; color: #0c5ea5; text-decoration: none; font-weight: bold; border: 1px solid #CCC; background-color: #eee; padding: 10px; } .tab-ui li a:hover { background-color: #f8f8f8; color: #0c5ea5; } .tab-ui li.selected a, .tab-ui li.ui-tabs-selected a { background-color: #fff; color: #333; border-bottom: 1px solid #fff; position: relative; } .tab-ui li.selected a:hover, .tab-ui li.ui-tabs-selected a:hover { background-color: #fff; } .tab-ui .tab-content { border: 1px solid #CCC; padding: 10px; margin: -1px 0 10px; } .ui-tabs-hide{ display: none; } /* listings */ .listing { margin-bottom: 10px; } .listing div { width: 127px; float: left; } .listing .secondary { margin: 0 7px 0 6px; } .listing .highlighted { border: 1px solid #ccc; border-width: 1px 0 0 1px; } .listing .highlighted h3 { padding: 6px 6px 2px; } .listing .highlighted ul { margin: 0 0 0 6px; list-style: none; } .listing .highlighted li { background: #fff url(../images/layout/icons/icon-checkmark.gif) 0px 3px no-repeat; padding-left: 14px; padding-bottom: 2px; } .listing .prod-item { border: 1px solid #ccc; margin-bottom: 7px; width: 125px; padding: 1px; text-align: center; } .listing .prod-item img { padding-bottom: 1px; width: 77px; margin: 0 auto; } .listing .prod-item p { background-color: #eee; text-align: center; padding: 3px 6px 0; height: 30px; line-height: 1.1em; display: table-cell; vertical-align: middle; width: 113px; } .category-group { margin: 5px 0; } .category-group h2 {} .category-group {} /* datatable */ .datatable { margin: 5px 0; border-bottom: 3px solid #8facc7; padding-bottom: 1px; } .datatable th { font: bold .9em "Trebuchet MS", Verdana; text-transform: uppercase; background: #e6edf4 url(../images/layout/datatable-header.gif) bottom left repeat-x; border-right: 1px solid #fff; padding: 5px; } .datatable th a:hover { text-decoration: none; background: none; color: #0c60a9; } .datatable th .asc, .datatable th .asc:hover { padding-right: 10px; background: url(../images/layout/small-arrow-down.gif) center right no-repeat; } .datatable th .dsc, .datatable th .dsc:hover { padding-right: 10px; background: url(../images/layout/small-arrow-up.gif) center right no-repeat; } .datatable td { padding: 5px; border: 1px solid #fff; border-width: 0px 1px 1px 0; } .datatable .alt td { background-color: #f6f6f6; } .datatable ul { margin: 0 0; list-style: none; } .datatable li { background: url(../images/layout/icons/arrow-single-blue.gif) 0px 6px no-repeat; padding-left: 8px; } .data-action { background-color: #d6e1ec; text-align: right; padding: 10px; margin-top: -3px; } .data-action .viewall { width: 110px; height: 22px; text-indent: -5000px; cursor: pointer; margin-left: 5px; } .data-action .viewall { background: url(../images/layout/buttons.gif) 0px -107px no-repeat; } .data-action .viewall:hover { background-position: -111px -107px; } /* small form **/ .small-form { padding: 10px; background-color: #f6f6f6; } .small-form p { float: left; width: 270px; } .small-form p strong { display: block; font-weight: bold; } .small-form div { float: right; width: 270px; text-align: right; margin-top: 17px; } .small-form label { font-weight: bold; padding-right: 5px; float: left; width: 100px; } .small-form input, .small-form select { width: 125px; float: left; margin: 0; padding: 0; } .small-form .go { float: left; } .small-form .go { width: 27px; height: 22px; text-indent: -5000px; cursor: pointer; margin-left: 5px; } .small-form .go { background: url(../images/layout/buttons.gif) 0px -75px no-repeat; } .small-form .go:hover { background-position: -28px -75px; } .or-option { background: url(../images/layout/or-bar.gif) no-repeat; height: 21px;} .or-option b { display: none; } /* promos */ .large-promo { background-color: #fcec8b; padding-bottom: 1px; } .large-promo img { border-bottom: 1px solid #fff; margin-bottom: 3px; } .large-promo p, .large-promo h1 { font-family: Verdana, Arial, Helvetica, sans-serif; line-height: 1.5em; border: 1px solid #fff; border-width: 1px 0; background-color: #fdf5c5; padding: 10px; } .link-promo { margin-bottom: 15px; } .link-promo ul { list-style: none; margin: 3px 5px 3px 3px; } .link-promo li { background: #fff url(../images/layout/icons/arrow-single-blue.gif) 0px 6px no-repeat; padding-left: 9px; } .link-promo li { padding-bottom: 3px; position: relative; line-height: 1.2em; } .link-promo p { padding: 3px 10px 3px 12px; } .link-promo .more-link { display: inline; padding-right: 10px; background: url(../images/layout/icons/arrow-double-green.gif) right center no-repeat; } .link-promo .more-link a { color: #199e5c; font-weight: bold; } .link-promo .more-link a:hover { background-color: #199e5c; color: #fff; } .small-promo { background-color: #0c5ea5; margin-bottom: 10px; } .small-promo h3 { padding: 8px; border-bottom: 1px solid #fff; color: #fcec8b; } .small-promo p { color: #fff; padding: 8px; } .small-promo .go-button { display: block; float: right; width: 39px; margin: 0; } .small-promo .go-button a { display: block; width: 39px; height: 32px; background: url(../images/layout/buttons.gif) 0px -32px no-repeat; text-indent: -5000px; margin: 4px 0 0 0; } .small-promo .go-button a:hover { background: url(../images/layout/buttons.gif) -40px -32px no-repeat; } .cross-sell { margin: 10px 0; background-color: #eee; padding-bottom: 5px; } .cross-sell h3 { padding: 6px 6px; border-bottom: 1px solid #fff; color: #333; } .cross-sell p { padding: 3px 6px 8px 6px; } .cross-sell .go-button { display: block; float: right; width: 39px; margin: 5px 0 10px 5px; } .cross-sell .go-button a { display: block; width: 39px; height: 32px; background: url(../images/layout/buttons.gif) 0px -32px no-repeat; text-indent: -5000px; margin: 4px 0 0 0; } .cross-sell .go-button a:hover { background: url(../images/layout/buttons.gif) -40px -32px no-repeat; } .cross-sell .action { font-weight: bold; padding-right: 10px; background: url(../images/layout/icons/arrow-double-green.gif) right center no-repeat; } .cross-sell .action a { color: #199e5c; font-weight: bold; } .cross-sell .action a:hover { background-color: #199e5c; color: #fff; } .cross-sell ul { list-style: none; margin: 5px 5px 0 7px; } .cross-sell li { background: url(../images/layout/icons/arrow-double-blue.gif) 0px 5px no-repeat; padding-left: 10px; padding-bottom: 3px; } .cross-sell li a { font-weight: bold; text-decoration: none; } /* general form */ .general-form { width: 450px; margin: 10px 0; padding: 0; background-color: #eeeeee; } .element-group { padding: 4px 10px; clear: both; } .element-group label { float: left; width: 150px; padding-right: 20px; text-align: right; font-weight: bold; } .element-group input, .element-group select { float: left; width: 220px; text-align: left; } .general-form .large label { float: none; display: block; width: 100%; text-align: left; } .general-form .large input, .general-form .large select, .general-form .large textarea { float: none; width: auto; } .general-form .group { float: left; width: 220px; } .general-form .group input { width: auto; float: none; vertical-align: middle; } .general-form .group label { width: auto; float: none; font-weight: normal; display: block; text-align: left; } .general-form h2 { background-color: #fff; padding: 5px 0px; border-bottom: 1px solid #fff; } .general-form .hr { margin: 7px 10px; } .general-form .action { clear: both; background-color: #999; text-align: right; padding: 10px; border-top: 1px solid #fff; } .general-form .action .label { font-size: .9em; padding: 3px 0; width: auto; float: left; } .general-form .action button { margin: 0 35px 0 10px; } .general-form .action button { width: 52px; height: 22px; text-indent: -5000px; cursor: pointer; } .general-form .action button { background: url(../images/layout/buttons.gif) 0px -139px no-repeat; } .general-form .action button:hover { background-position: -53px -139px; } /* product-search-controls */ .product-search-controls { width: 560px; } .product-search-controls .elements { width: 100%; padding: 10px; background-color: #eeeeee; } .product-search-controls .elements .felement { margin-bottom: 10px; } .product-search-controls .buttons, .contactus-form .buttons { width: 100%; text-align: right; clear: both; background-color: #999; padding: 10px; border-top: 1px solid #fff; } .product-search-controls .f-elem div.material { float: left; width: 160px; } .product-search-controls .hierselect-input, .product-search-controls .select-input { float: none; margin: 0; width: 250px; } /* catalog form */ .catalog-form, .contactus-form { width: 450px; margin: 10px 0; } .catalog-form .elements, .contactus-form .elements { width: 100%; padding: 10px; background-color: #eeeeee; } .catalog-form select, .contactus-form select { float: none; margin: 0; } .catalog-form textarea, .contactus-form textarea { width: 400px; } .catalog-form .felement, .contactus-form .felement { margin: 5px 0; clear: both; } .catalog-form .felement .f-label, .contactus-form .felement .f-label { width: 100px; text-align: right; vertical-align: top; float:left; } .catalog-form .felement .f-elem, .contactus-form .felement .f-elem { width: 310px; padding: 0 0 0 10px; text-align: left; vertical-align: top; float:left; } .catalog-form .buttons, .contactus-form .buttons { width: 100%; text-align: right; clear: both; background-color: #999; padding: 10px; border-top: 1px solid #fff; } /* sitemap */ #sitemap { clear: both; display: block; margin-top: 10px; background-color: #cedfee; border: 1px solid #9ebfdd; border-width: 3px 0 1px; } #sitemap .sitemap-container {border: 1px solid #fff; border-width: 1px 0;} #sitemap .products { float: left; width: 390px; } #sitemap .products ul { list-style-type: none; margin: 10px 0; } #sitemap .products li { float: left; width: 120px; font-weight: bold; margin: 0 0 2px 10px; display: inline; } #sitemap .pages { float: right; width: 362px; margin: 10px 0; border-left: 1px solid #9ebfdd; padding-left: 5px; } #sitemap .pages div { float: left; width: 108px; margin: 0 5px; } #sitemap .pages div ul { font-size: .9em; list-style: none; margin: 3px 0 3px 0px; } #sitemap .pages div li { background: url(../images/layout/icons/arrow-single-blue.gif) 0px 5px no-repeat; padding: 0 0 1px 9px; } #sitemap .pages h4 { font-weight: bold; } /*newsletter signup form*/ .signupForm {} .signupForm label { font-weight: bold; } .signupForm .textInput { width: 70%; } .signupForm .error{color: #c00; } #subnav .signupForm .error_messages ul{ background-color: #fae5e5; color: #c00; list-style: none; font-weight: normal; margin: 3px 5px 8px 0px} #subnav .signupForm .error_messages ul li{font-weight: normal; background: none; padding-left: 5px; text-indent: 0; padding-top: 5px;} /*newsletter signup page */ .newsletterSignupForm{ list-style: none; margin: 0; overflow: hidden; } .newsletterSignupForm li{ width: 130px; float: left; } .newsletterSignupForm li label{ display: block; font-weight: bold; } .newsletterSignupForm li .text-input{ width: 110px; } .newsletterSignupForm li.last{ padding-top: 12px; width: 83px; text-align: right } .newsletterSignupForm li.signup{ width: 56px; } .newsletterExp{ list-style: none; margin: 0;} .newsletterExp li{ margin: 10px 0;} .general-listing .general-item .newsletterExp p, .general-listing .general-item .newsletterExp h3{ color: #262626; padding-left: 57px; margin: 0; } .newsletterExp .count{ padding: 10px 10px 10px 0; border-right: 1px solid #ccc; width: 37px; float: left; margin-right: 10px; } .newsletterExp .count span{ display: block; width: 37px; height: 37px; background-image: url(../images/layout/numbers.gif); background-repeat: no-repeat; text-indent: -99999px; } .newsletterExp .count span.one{ background-position: 0 0; } .newsletterExp .count span.two{ background-position: 0 -37px; } .newsletterExp .count span.three{ background-position: 0 -74px; } .newsletterExp .count span.four{ background-position: 0 -111px; } /* copyright */ .copyright { text-align: center; color: #666; margin: 2px 0 10px; } .sprokets { color: #739abd; clear: both; padding: 10px 0 5px 10px; } .sprokets a { margin: 3px 0; text-indent: -5000px; width: 81px; display: block; height: 24px; background: url(../images/layout/sprokets.gif) 0px 0px no-repeat; text-decoration: none; } .sprokets a:hover { background: url(../images/layout/sprokets.gif) -82px 0px no-repeat; } /* popup */ #popup-header { background-color: #c0d0df; padding: 10px; text-align: left; } #popup-header .close { float: right; margin-top: -20px; } #popup-content { text-align: left; background-color: #fff; padding: 10px; } #popup-content .form { padding: 10px 0; border-top: 5px solid #cccccc; clear: both; } #popup-content .form fieldset { border: none; padding: 0; margin: 0; } #popup-content .form legend { padding: 0 0 10px 10px; } #popup-content .form .instructions { font-size: 95%; color: #333; padding: 0 0 5px 10px; font-weight: bold; font-style: italic; font-family: "Trebuchet MS", Verdana; text-transform: uppercase; } #popup-content .form .element { background-color: #fff; border-bottom: 1px solid #fff; padding: 3px 0; } #popup-content .form .element label { float: left; width: 90px; text-align: right; padding-top: 2px; font-weight: bold; } #popup-content .form .element input, #popup-content .form .element select, #popup-content .form .element textarea { float: left; width: 230px; margin-left: 10px; } #popup-content .form .element textarea { width: 355px; height: 80px; } #popup-content .form button { font-weight: bold; } #popup-content .form button.green { font-weight: bold; background-color: #31B472; padding: 3px; color: #fff; border: solid 1px #C9C9C9; -moz-border-radius: 5px; cursor: pointer; font-size: 1.1em; } #popup-content .actions { padding: 3px; } #popup-content .actions .primary-action { margin-left: 100px; } #popup-content .url i { color: #0c5ea5; display: block; } #popup-content .url { padding-bottom: 10px; } #popup-content .error { padding: 10px; margin-bottom: 10px; border: 1px solid #CC0000; border-width: 1px 0; background-color: #FAE6E6; padding-left: 40px; } #popup-content .error li { font-weight: bold; } #popup-content .success { padding: 10px; margin-bottom: 10px; border: 1px solid #3A9D3A; border-width: 1px 0; background-color: #D9ECD9; } /* privacy policy */ .privacyPolicy .pp-block-container { border: 1px solid #ccc; } .privacyPolicy .pp-block { width: 269px; float: left; padding-top: 10px; padding-left: 10px; } .privacyPolicy div.left { padding-right: 10px; width: 259px; border-right: 1px solid #ccc; } .privacyPolicy h1.sub { font-size: 1.6em; padding-top: 10px; } .privacyPolicy h2 { clear: both; padding-top: 10px; margin: 0; } .privacyPolicy h4 { font-weight: bold; } .privacyPolicy ul { margin: 0 15px; padding-bottom: 10px; } .privacyPolicy li { margin: 0; padding: 0; } .privacyPolicy p { padding: 0; } .privacyPolicy .note { font-style: italic; color: #666; } .privacyPolicy .desc p { padding-bottom: 10px; } /* about page */ #aboutContainer{ overflow: hidden; position: relative; } #aboutContainer p{ padding: 0; } #aboutContainer .head{ background: #199e5c; padding: 0; border-bottom: 3px solid #75c59d; border-top:1px solid #75c59d; margin: 0 0 20px; } #aboutContainer .head .headInner{ border-top: 1px solid #fff; border-bottom: 1px solid #fff; padding: 20px; } #aboutContainer .head h2{ padding: 0 0 10px; height: 16px; font-size: 16px; color: #fcec8b; margin: 0; font-family: "Trebuchet MS"; } #aboutContainer .head p{ color: #fff; font-size: 13px; margin: 10px 0 0; width: 370px; } #aboutContainer .images, #greenContainer .images{ width: 100px; float: left; list-style: none; text-align: center; margin: 0; padding: 0; } #aboutContainer .images li, #greenContainer .images li{ padding: 0 0 10px; } #aboutContainer .images img, #greenContainer .images img{ display: block; } #aboutContainer .images p, #greenContainer .images p{ font-style: italic; font-size: 11px; line-height: 14px; padding: 0; margin: 5px 0 0; font-family: Georgia, serif; } #aboutContainer .aboutContent{ margin: 0 10px 0 15px; width: 284px; float: left; } #aboutContainer .aboutContent p{ margin: 0 0 1em; } #aboutContainer .aboutSidebar{ width: 170px; float: left; border-top: 1px solid #fff; border-left: 1px solid #fff; margin: 0; position: absolute; top:48px; right: 0; } #aboutContainer .aboutSidebar h3{ color: #0c5fa7; font-size: 16px; padding: 8px 10px; line-height: 1; height: 16px; background: #fcec8b; margin: 0; } #aboutContainer .aboutSidebar dl{ border-top: 1px solid #fff; border-bottom: 1px solid #fff; background: #fdf5c5; font-size: 11px; overflow: auto; padding: 0 0 10px; zoom:1; } #aboutContainer .aboutSidebar dt{ width: 35px; margin: 0 10px 0 0; text-align: right; float: left; clear: left; color: #0c5fa7; font-weight: bold; padding: 8px 0 0; } #aboutContainer .aboutSidebar dd{ width: 115px; float: left; padding: 8px 0 0; } #aboutContainer .aboutSidebar .images{ border-top: 3px solid #fcec8b; padding: 15px 0 0; width: 170px; } /* going green page */ #greenContainer{ background: #fff url(../images/going_green/background.gif) 0 0 repeat-x; padding: 1px 0 0; } * html #greenContainer{ overflow: hidden; width: 580px; } #greenContainer .head{ border-top: 1px solid #fff; padding: 20px 190px 20px 20px; position: relative; font-size: 13px; line-height: 18px; color: #fff; } #greenContainer .head h2{ padding: 0 0 10px; height: 16px; font-size: 16px; color: #fcec8b; margin: 0; font-family: "Trebuchet MS"; } #greenContainer .head .images{ position: absolute; top: 51px; right: 20px; color: #fcec8b; width: 150px; } #greenContainer .head .greenPractices{ list-style: none; font-style: italic; font-weight: bold; margin: 10px 0; line-height: 16px; } #greenContainer .head .greenPractices li{ padding: 0 0 0 13px; background: url(../images/going_green/checkmark.png) 0 0 no-repeat; margin: 0 0 10px; } * html #greenContainer .head .greenPractices li{ zoom: 1; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/going_green/checkmark.png', sizingMethod='crop'); background: none; } #greenContainer .main{ padding: 0 190px 20px 20px; position: relative; } #greenGraphContainer{ width: 352px; border: 1px solid #ccc; background: #fff; padding: 8px 8px 248px; margin: 0 0 20px; } #greenGraphContainer h3{ font-weight: bold; color: #333; font-size: 14px; font-family: "Trebuchet MS"; } #greenGraphContainer h3 em{ color: #0c5fa6; font-style: normal; } #greenGraphContainer dl{ position: absolute; text-align: right; } #greenGraphContainer dt{ display: inline; margin: 0; padding: 0; } #greenGraphContainer dt a{ color: #199e5c; font-size: 11px; background: #fff; } #greenGraphContainer dt.current a{ color: #333; text-decoration: none; cursor: default; } #greenGraphContainer dt a:hover{ background: #fff; } #greenGraphContainer dd{ position: absolute; top: 20px; left: 0; display: none; } #greenGraphContainer dd.current{ display: block; } #greenGraphContainer dd img{ width: 352px; display: block; -ms-interpolation-mode: bicubic; } #greenContainer .greenFeatures{ margin: 0 0 0 -20px; padding: 0; list-style: none; width: 400px; } #greenContainer .greenFeatures li{ overflow: hidden; padding: 0 0 20px; } #greenContainer .greenFeatures li .c{ float: right; width: 285px; margin: 0 0 0 10px; } #greenContainer .greenFeatures li .c h3{ font-size: 16px; color: #333; font-family: "Trebuchet MS"; margin: 0 0 8px; } #greenContainer .greenFeatures li .c p{ margin: 0 0 10px; font-size: 11px; padding: 0; } #greenContainer .greenFeatures li .c ul{ margin: 0 0 10px; padding: 0; } #greenContainer .greenFeatures li .c li{ margin: 0 0 5px; font-style: italic; padding: 0 0 0 14px; background: url(../images/layout/icons/icon-checkmark.gif) 0 3px no-repeat; } #greenContainer .greenFeatures li .inset{ float: right; width: 105px; text-align: center; font-family: Georgia; font-size: 11px; font-style: italic; line-height: 14px; } * html #greenContainer .greenFeatures *{ zoom: 1; } * html #greenContainer .greenFeatures li .inset{ width: 100px; } #greenContainer .greenFeatures li .inset h4{ font-weight: bold; margin: 3px 0 0; padding: 0; } #greenContainer .greenFeatures li .inset p{ margin: 0; padding: 0; } #greenContainer .greenSidebar{ position: absolute; top: 0; right: 0; width: 170px; padding: 0 0 3px; background: #fcec8b; border-top: 1px solid #fff; border-left: 1px solid #fff; } #greenContainer .greenSidebar h2{ color: #0c5fa7; font-size: 16px; line-height: 18px; font-family: "Trebuchet MS"; padding: 6px 10px; } #greenBenifitsDl{ border-top: 1px solid #fff; padding: 10px; background: #fdf5c5; } #greenBenifitsDl dt{ background: #fff; font-size: 10px; text-transform: uppercase; padding: 5px; font-weight: bold; color: #666; } #electricityGenerated{ font-size: 20px; color: #0c5fa7; padding: 10px 5px; } #environmentalSavings{} #environmentalSavings ul{ list-style: none; margin: 0; padding: 10px 5px; } #environmentalSavings li{ display: none; } #environmentalSavings li.current{ display: block; } #environmentalSavings strong{ color: #0c5fa7; } #environmentalSavings .nav{ width: 40px; margin: 0 auto 10px; overflow: hidden; } #environmentalSavings .nav a{ display: block; width: 20px; height: 20px; background-image: url(../images/going_green/nav_arrows.gif); background-repeat: no-repeat; text-indent: -99999px; float: left; } #environmentalSavings .nav a.prev{ background-position: 0 -20px; } #environmentalSavings .nav a.prev.inactive{ background-position: 0 0; cursor: default; } #environmentalSavings .nav a.next{ background-position: -20px -20px; } #environmentalSavings .nav a.next.inactive{ background-position: -20px 0; cursor: default; } #greenhouseGases dl{ padding: 5px; } #greenhouseGases dt{ padding: 0 0 3px; background: transparent; font-weight: normal; text-transform: none; display: block; width: 85px; float: left; clear: left; } #greenhouseGases dd{ color: #0c5ea6; margin: 0 0 0 85px; padding: 0 0 3px; text-align: right; } #greenContainer .greenSidebar .note{ border-bottom: 1px solid #fff; padding: 0 10px 10px; font-size: 10px; font-style: italic; background: #fdf5c5; text-align: center; } /* adapterSearch */ #adapterSearch{ } #asSearchForm{ position: relative; margin: 100px 0 0; border-top: 1px solid #ccc; } #asChoices{ list-style: none; padding: 0; margin: 0; overflow: hidden; position: absolute; top: -100px; left: 0; width: 760px; z-index: 1; } #asChoices > li{ width: 245px; float: left; margin: 0 10px 0 0; cursor: pointer; } * html #asChoices li{ width: 245px; float: left; margin: 0 10px 0 0; cursor: pointer; } * html #asChoices li li{ width: 151px; float: none; margin: 0; cursor: default; } #asSearchForm #asThird{ margin: 0; } #asSearchForm h2{ font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; text-align: center; } #asSearchForm .choice{ padding: 5px; position: relative; background: #b7cfe6 url(../images/layout/adapter_search/as_choice_back.gif) 0 0 repeat-x; border: 1px solid #b7cfe6; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; } #asSearchForm .choices{ display: none; } #asSearchForm .intro{ padding: 5px; font-size: 10px; } #asSearchForm .intro h3{ font-size: 11px; margin: 0;} #asSearchForm .intro p{ margin: 0; padding: 0;} #asSearchForm .toggle{ display: block; height: 15px; width: 15px; background-image: url(../images/layout/adapter_search/arrows.png); background-position: 0 -15px; text-indent: -9999px; position: absolute; right: 10px; top: 26px;} #asSearchForm .toggle:hover, #asSearchForm fieldset:hover .toggle{ background-position: 0 0; border: 0; text-decoration: none; background-color: transparent; } #asSearchForm .choices li img{ border: 1px solid #b7cfe6; float: left; margin: 0 5px 0 0; font-size: 11px; height: 38px; } #asSearchForm .choices h4{ color: #194b97; font-weight: bold; margin: 4px 0 0; } #asSearchForm .cancel{ display: none; } #asSearchForm .chosen .intro{ display: none; } #asSearchForm .chosen .choices{ display: block; margin: 0; padding: 0; list-style: none; } #asSearchForm .chosen .choices li{ display: none; padding: 0; } #asSearchForm .chosen .choices li.selected{ display: block; overflow: hidden; } #asSearchForm .chosen select{ width: 85px; border: 1px solid #ccc; } #asSearchForm #asChoices .disabled .choice{ cursor: default; background: #e0e0e0 url(../images/layout/adapter_search/as_choice_back_disabled.gif) 0 0 repeat-x; } #asSearchForm .disabled .intro{ padding: 12px 5px; } #asSearchForm .disabled .intro p{ display: none; } #asSearchForm .disabled .intro h3{ color: #999; } #asSearchForm .disabled .toggle{ display: none; } #asFormFooter{ border-top: 1px solid #fff; background: #eee; text-align: right; padding: 10px; vertical-align: middle; font-size: 11px; position: relative; z-index: 0; } #asFormFooter .loading{ float: left; font-size: 14px; padding: 2px 0 2px 22px; background: url(../images/layout/adapter_search/loading.gif) 0 center no-repeat; color: #999; display: none; } .loading #asSearchForm .loading{ display: block; } #asFormFooter input{ vertical-align: middle; } #asTable{ width: 100%; font-size: 11px; margin: 0 0 30; border-bottom: 3px solid #8facc7; } #asTable td, #asTable th{ border-right: 1px solid #fff; padding: 4px; color: #000; line-height: 1.2; } #asTable td{ vertical-align: middle; } #asTable thead tr th{ font-size: 10px; background: #dfe7f0; text-transform: uppercase; font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-weight: bold; } #asTable thead th{ font-weight: bold; } #asTable thead th.sortable{ /* padding: 4px 24px 4px 4px; */ } #asTable tr.alt td, #asTable tr.alt th{ background: #f6f6f6; } #asTable th.open{ background: #fff; } #asTable .tbChoices{ display: none; } #asTable .open .tbChoices{ margin: 0; padding: 0; list-style: none; width: 100px; display: block; position: absolute; border: 1px solid #9ebfdd; z-index: 2; top: -4px; left: -4px; } #asTable .tbChoices li{ padding: 2px 4px 2px 16px; background: #fff; font-weight: normal; font-family: Arial,Helvetica,sans-serif; text-transform: none; cursor: pointer; } #asTable .tbChoices li:hover{ background: #ebf2f8; } #asTable .tbChoices li.selected{ background: #ebf2f8 url(../images/layout/adapter_search/as_checkmark.gif) 0 0 no-repeat;} #asTable .sCon{ position: relative; padding: 0 20px 0 0; } #asTable .sort{ display: block; text-indent: -99999px; background: url(../images/layout/adapter_search/as_sort_arrow.gif); width: 15px; height: 15px; float: right; position: relative; margin: 2px -20px 0 0; z-index: 10;} #asTable .sort:active, #asTable .sort:focus{ outline: none; } #asTable .disabled .sort{ display: none; } #asTable th.sorted, #asTable tbody .alt td.sorted{ background: #f3e9aa; } #asTable tbody td.sorted{ background: #fdf5c5; } #asTable tbody th{ font-weight: bold; } #asTable tbody ul{ margin: 0; padding: 0; list-style: none; width: 100px} #asTable tbody a{ display: block; padding: 3px; text-align: center;} #asTable tbody a img{ border: 1px solid #B7CFE6; } #asTable tbody a:hover{ background: none; color: #0C60A9; } #asStatusAlert, #asStatusOk{ margin: 20px 0; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; padding: 5px 5px 5px 30px; display: none; zoom: 1; } #asStatusAlert{ background: #fdf5c5 url(../images/layout/adapter_search/as_status_alert.gif) 6px center no-repeat; border: 1px solid #ebdc82; } #asStatusOk{ background: #c6ead8 url(../images/layout/adapter_search/as_status_ok.gif) 6px center no-repeat; border: 1px solid #a4ddc0; } #asStatusOk img{ vertical-align: bottom;} #adapterOverlay{ display: none; } .ui-dialog #adapterOverlay{ display: block; } .ui-widget-overlay{ position: absolute; background: #c0d0df; opacity: .6; -moz-opacity: .6; -webkit-opacity: .6; top:0; left: 0; filter:alpha(opacity=60); } .adapterSearch .ui-dialog-titlebar{ height: 15px; background: url(../images/layout/adapter_search/overlay_hd.png) no-repeat; } .adapterSearch .ui-dialog-titlebar *{ display: none; } #adapterOverlay .ft{ width: 740px; height: 15px; position: absolute; left: 0; bottom: -15px; background:url(../images/layout/adapter_search/overlay_ft.png); } .asPreloader{ position: absolute; left: -9999px; top: -9999px; } .asPreloader .t{ background: url(../images/layout/adapter_search/overlay_hd.png) no-repeat; } .asPreloader .m{ background: url(../images/layout/adapter_search/overlay_back.png) 0 0 repeat-y; } .asPreloader .b{ background:url(../images/layout/adapter_search/overlay_ft.png); } .adapterSearch #adapterOverlay{ background: url(../images/layout/adapter_search/overlay_back.png) 0 0 repeat-y; margin: 0 0 15px; position: relative; padding: 20px 25px; text-align: left; } #adapterOverlay h2{ color: #333; font-size: 24px; font-family: "Trebuchet MS", Arial, sans-serif; margin: 0; line-height: 1;} #adapterOverlay p.note{ padding: 0; margin: 8px 0 15px; font-size: 11px; } #adapterOverlay .adapterList{ list-style: none; margin: 0 15px 0 0; padding: 0; width: 170px; float: left; } #adapterOverlay .adapterList li{ padding: 0 0 1px 20px; } #adapterOverlay .adapterList h3{ font-size: 12px; color: #194b97; line-height: 15px; padding: 6px 5px; cursor: pointer; vertical-align: center; margin: 0; } #adapterOverlay .adapterList h3:hover{ background: #fdf5c5; } #adapterOverlay .adapterList li.selected{ background: url(../images/layout/adapter_search/selected_check.gif) 0 center no-repeat; } #adapterOverlay .adapterList .selected h3{ background: #eeeeee; } #adapterOverlay .adapterList li.disabled h3{ color: #999; cursor: default; } #adapterOverlay .adapterList .disabled h3:hover{ background: none; } #adapterImages{ list-style: none; margin: 0; padding: 0; float: right; width: 202px; height:235px; background: url(../images/layout/adapter_search/img_background.gif) 0 0 no-repeat; position: relative; } #adapterImages.hovered{ background: none; } #adapterImages li{ display: none; position: absolute; left: 0; top: 0; z-index: 2; background: #fff;} #adapterImages li.on{ display: block; } #adapterImages li.selected{ display: block; z-index: 1; } #adapterImages li img{ display: none; border: 1px solid #ccc; } .first #adapterImages li img.left{ display: block; } .second #adapterImages li img.right{ display: block; } .third #adapterImages li img.up{ display: block; } #adapterImages h3{ padding: 5px 0; font-size: 14px; color: #333; text-align: center; } #adapterOverlay .foot{ clear: both; border-top: 1px solid #ccc; background: #eee url(../images/layout/adapter_search/1x1white.gif) 0 0 repeat-x; padding: 10px; text-align: right; vertical-align: middle; } #adapterOverlay .foot input{ vertical-align: middle; } /* !hose maker */ #hoseMaker{ } #hoseMaker .introHead{ position: relative; overflow: hidden; padding: 30px 138px 30px 64px ; background: url(../images/layout/horiz-gradient-divider.gif) center top no-repeat; } #hoseMaker .introHead h1{ font-size: 32px; font-weight: normal; } #hoseMaker .introHead p{ font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-size: 13px; color: #666; } #hoseMaker .introHead .changeLink{ position: absolute; left: 576px; display: block; font-weight: bold; width: 150px; padding: 0 0 0 18px; top: 76px; font-size: 12px; background: url(../images/layout/bullet_arrow.gif) 7px 5px no-repeat; } #hoseMaker .introHead .changeLink:hover{ color: #0C60A9; } #hmChoices{ list-style: none; padding: 0; margin: 0; overflow: hidden; z-index: 1; } #hmChoices > li{ width: 245px; float: left; margin: 0 10px 0 0; cursor: pointer; } * html #hmChoices li{ width: 245px; float: left; margin: 0 10px 0 0; cursor: pointer; } * html #hmChoices li li{ width: 151px; float: none; margin: 0; cursor: default; } #hmChoices #hmEnd2{ margin: 0; } #hmChoices h2{ font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; text-align: center; } #hmChoices .choice{ padding: 10px; position: relative; background: #b7cfe6 url(../images/layout/adapter_search/as_choice_back.gif) 0 0 repeat-x; border: 1px solid #b7cfe6; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; } #hmChoices .choices{ display: none; } #hmChoices .intro{ padding: 5px; font-size: 11px; text-align: center; overflow: hidden; min-height:30px; height:auto !important; height:30px; } #hmChoices .intro h3{ font-size: 12px; margin: 0;} #hmChoices .intro p{ margin: 0; padding: 0;} #hmChoices .choices h4{ color: #194b97; font-size: 12px; font-weight: bold; margin: 0 0 0; } #hmChoices #hmHoseLength{ cursor: default; } #hmHoseLength select{ display: none; float: left; width: 100px; margin: 7px 9px 0 0; } #hmHoseLength select.active{ display: block; } #hmHoseLength label{ display: block; float: left; font-size: 12px; font-weight: bold; color: #0C5FA8; margin: 7px 3px 0; padding: 2px 6px; cursor: pointer; } #hmHoseLength label.selected{ background: #fff; color: #333; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; -o-border-radius: 4px;} #hmChoices .cancel{ display: none; } #hmChoices .chosen .intro{ display: none; } #hmChoices .chosen .choices{ display: block; margin: 0; padding: 0; list-style: none; text-align: center; } #hmChoices .chosen .choices li{ display: none; padding: 0; } #hmChoices .chosen .choices li.selected{ display: block; padding: 5px; font-size: 11px; text-align: center; overflow: hidden; min-height:30px; height:auto !important; height:30px; } #hmChoices .chosen select{ width: 85px; border: 1px solid #ccc; } #hmChoices .choices p{ margin: 0; padding: 0; } #hoseMaker #hmChoices .disabled .choice{ cursor: default; background: #e0e0e0 url(../images/layout/adapter_search/as_choice_back_disabled.gif) 0 0 repeat-x; } #hmChoices .disabled .intro h3, #hmChoices .disabled .intro p{ color: #999; } #hmChoices .disabled label{ color: #999; cursor: default; } #hosePreview{ position: relative; height: 140px; margin: 20px 0 30px; } #hosePreview .divider{ top: 30px; position: absolute; z-index: 2; background: url(../images/layout/hose-maker-divider.png) 0 0 no-repeat; width: 10px; height: 35px; } #hosePreview .one{ left: 246px; } #hosePreview .two{ left: 502px; } #hosePreview img{ position: absolute; top: 0; z-index: 1; } #hosePreview .left{ left: 0px; cursor: pointer; } #hosePreview .middle{ left: 246px; } #hosePreview .right{ right: 0; cursor: pointer; } #hosePrevMiddle{ color: #fff; font-weight: bold; text-align: center; line-height: 1; position: absolute; width: 262px; height: 100px; position: absolute; left: 246px; top: 21px; z-index: 2; background: url(../images/hose-maker/default-middle.png) 0 0 no-repeat; } #hosePrevMiddle *{ display: none; } #hosePrevMiddle.active{ background: url(../images/hose-maker/default-middle-active.png) 0 0 no-repeat; } .xt #hosePrevMiddle.active{ background: url(../images/hose-maker/default-middle-blue-active.png) 0 0 no-repeat; } #hosePrevMiddle.active strong{ font-size: 32px; display: block; padding: 28px 0 0; } #hosePrevMiddle.active em{ font-size: 12px; display: block; } .product-detail .hoseMakerHead a{ text-decoration: none; } .product-detail #hosePreview{ height: 140px; margin: 0; } .product-detail #hosePreview img{ position: absolute; top: 0; z-index: 1; } .product-detail #hosePreview .left{ left: -10px; } .product-detail #hosePreview .right{ right: -10px; } .product-detail #hosePrevMiddle{ color: #fff; font-weight: bold; text-align: center; line-height: 1; position: absolute; width: 120px; height: 97px; position: absolute; left: 230px; z-index: 2; background: url(../images/hose-maker/middle-product-page.png) 0 0 no-repeat; } .product-detail .xt #hosePrevMiddle{ background: url(../images/hose-maker/middle-blue-product-page.png) 0 0 no-repeat; } #hosePrevMiddle strong{ font-size: 32px; display: block; padding: 28px 0 0; } #hosePrevMiddle em{ font-size: 12px; display: block; } .hoseMakerHead{ } .hoseMakerHead h2{ border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; padding: 1px 0; } .hoseMakerHead h2 .w{ display: block; background: #eee; padding: 10px 10px 7px; overflow: hidden; } .hoseMakerHead h2 .newHose{ display: block; float: right; width: 143px; height: 22px; background: url(../images/layout/buttons.gif) 0 -225px; text-indent: -9999px; } #hoseMaker .connections{ display: none; } #hmResults{ overflow: hidden; padding: 0 0 30px; } #hmResults .loading{ display: none; padding: 40px 0 0; text-align: center; background: url(../images/layout/loading-33px.gif) center top no-repeat; font-size: 13px; color: #666; font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; } #hmResults .results{ border-top: 1px solid #ccc; padding: 1px 0 0; display: none; } #hmResults .results .result{ background: #eee; padding: 10px 10px 20px; color: #333; font-size: 11px; overflow: hidden; } #hmResults .results .result .price{ font-weight: bold; font-size: 12px; clear: both; } #hmResults .results p{ padding: 0; margin: 0; } #hmResults .results .result h2{ font-size: 24px; font-weight: bold; color: #194b97; float: left; padding: 0; margin: 0; } #hmResults .results .result #hmSubmit{ width: 184px; height: 41px; padding: 0; margin: -3px 10px 0; float: right; display: block; text-indent: -9999px; background: url(../images/layout/buttons.gif) 0 -247px; cursor: pointer;} #hmResults .results .result #hmSubmit:hover{ background: url(../images/layout/buttons.gif) 0 -288px; } #hmResults .results .result strike{ margin: 0 8px 0 0;} #hoseMaker .loading .loading{ display: block; } #hoseMaker .loaded .results{ display: block; } * html #hosePrevMiddle{ filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/hose-maker/default-middle.png', sizingMethod='crop'); background: none; } * html #hosePreview .active{ filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/hose-maker/default-middle-active.png', sizingMethod='crop'); background: none; } * html #hosePrevMiddle strong, * html #hosePrevMiddle em{ display: none; } * html #hosePreview .active strong, * html #hosePreview .active em{ display: block; } * html #hmHoseLength .selected, * html #hmHoseLength label{ display: inline; } * html .product-detail #hosePrevMiddle{ filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/hose-maker/middle-sm.png', sizingMethod='crop'); background: none; } * html .product-detail #hosePrevMiddle strong, * html .product-detail #hosePrevMiddle em{ display: block; } /* #hmHoseLength select{ display: none; float: left; width: 100px; margin: 7px 9px 0 0; } #hmHoseLength select.active{ display: block; } #hmHoseLength label{ display: block; float: left; font-size: 12px; font-weight: bold; color: #0C5FA8; margin: 7px 3px 0; padding: 2px 6px; cursor: pointer; } #hmHoseLength label.selected{ background: #fff; color: #333; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; -o-border-radius: 4px;} */ #hoseMakerIntro{ padding: 40px 64px; background: url(../images/layout/horiz-gradient-divider.gif) center top no-repeat; } #hoseMakerIntro h1{ font-size: 32px; font-weight: normal; margin: 0 0 30px; } #hoseMakerIntro h2{ font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-weight: bold; font-size: 17px; padding: 1px 0; border-top: 3px solid #fcec8b; border-bottom: 1px solid #fcec8b; margin: 0 0 10px; } #hoseMakerIntro h2 em{ display: block; background: #fdf5c5; text-align: center; padding: 3px 0 5px; } #hmIntroChoices{ list-style: none; padding: 0; margin: 0 0 15px;; overflow: hidden; z-index: 1; margin: 0 -10px 0 0; } #hmIntroChoices > li{ width: 311px; float: left; margin: 0 10px 0 0; cursor: pointer; } * html #hmIntroChoices li{ width: 311px; float: left; margin: 0 10px 0 0; cursor: pointer; } * html #hmIntroChoices li li{ width: 151px; float: none; margin: 0; cursor: default; } #hmIntroChoices .choice{ text-decoration: none; color: #194b97; display: block; margin: 0 0 15px; overflow: hidden; padding: 10px; position: relative; background: #b7cfe6 url(../images/layout/adapter_search/as_choice_back.gif) 0 0 repeat-x; border: 1px solid #b7cfe6; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; } #hmIntroChoices .choice strong{ display: block; font-size: 20px; float: left; padding: 6px 12px 6px 0; background: url(../images/layout/vertical-gradient-divider.png) right center no-repeat; margin: 0 12px 0 0; } #hmIntroChoices .choice .detail{ display: block; width: 118px; float: left; line-height: 12px; margin: 8px 0 0;} #hmIntroChoices .choice .detail em{ font-weight: bold;} #hmIntroChoices .choice:hover{ color: #194b97; } #hmIntroChoices h4{ font-weight: bold; margin: 0 0 4px; font-size: 12px; } #hmIntroChoices ul{ font-size: 12px; list-style: none; margin: 0; } #hmIntroChoices ul li{ padding: 2px 0 2px 8px; background:url(../images/layout/bullet-arrow-gray.gif) 0 7px no-repeat; } * html #hoseMakerIntro, * html #hoseMakerIntro *{ zoom: 1; } * html #hmIntroChoices .choice strong{ background: none; } * html #hoseMaker, * html #hoseMaker *{ zoom: 1; } /* !generic Overlay */ .ui-dialog{ position: absolute; } .ui-widget-overlay{ position: absolute; background: #c0d0df; opacity: .6; -moz-opacity: .6; -webkit-opacity: .6; top:0; left: 0; filter:alpha(opacity=60); } .riOverlayContainer .ui-dialog-titlebar{ height: 15px; background: url(../images/layout/adapter_search/overlay_hd.png) no-repeat; } .riOverlayContainer .ui-dialog-titlebar *{ display: none; } .riOverlayInner .ft{ width: 740px; height: 15px; position: absolute; left: 0; bottom: -15px; background:url(../images/layout/adapter_search/overlay_ft.png); } .asPreloader{ position: absolute; left: -9999px; top: -9999px; } .asPreloader .t{ background: url(../images/layout/adapter_search/overlay_hd.png) no-repeat; } .asPreloader .m{ background: url(../images/layout/adapter_search/overlay_back.png) 0 0 repeat-y; } .asPreloader .b{ background:url(../images/layout/adapter_search/overlay_ft.png); } .riOverlayContainer .riOverlayInner{ background: url(../images/layout/adapter_search/overlay_back.png) 0 0 repeat-y; margin: 0 0 15px; position: relative; padding: 20px 25px; text-align: left; } .riOverlayInner h2{ color: #333; font-size: 24px; font-family: "Trebuchet MS", Arial, sans-serif; margin: 0; line-height: 1;} .riOverlayInner p.note{ padding: 0; margin: 8px 0 15px; font-size: 11px; } .riOverlayInner .choiceList{ list-style: none; margin: 0 15px 0 0; padding: 0; width: 200px; float: left; } .riOverlayInner .choiceList li{ padding: 0 0 1px 20px; } .riOverlayInner .choiceList h3{ font-size: 12px; color: #194b97; line-height: 15px; padding: 6px 5px; cursor: pointer; vertical-align: center; margin: 0; } .riOverlayInner .choiceList h3:hover{ background: #fdf5c5; } .riOverlayInner .choiceList li.selected{ background: url(../images/layout/adapter_search/selected_check.gif) 0 center no-repeat; } .riOverlayInner .choiceList .selected h3{ background: #eeeeee; } .riOverlayInner .choiceList li.disabled h3{ color: #999; cursor: default; } .riOverlayInner .choiceList .disabled h3:hover{ background: none; } .choiceImagePreview{ list-style: none; margin: 0; padding: 0; float: right; width: 202px; height:270px; background: url(../images/layout/adapter_search/img_background.gif) 0 0 no-repeat; position: relative; } .choiceImagePreview.hovered{ background: none; } .choiceImagePreview li{ display: none; position: absolute; left: 0; top: 0; z-index: 2; background: #fff; height: 265px;} .choiceImagePreview li.on{ display: block; } .choiceImagePreview li.selected{ display: block; z-index: 1; } .choiceImagePreview li img{ border: 1px solid #ccc; } .choiceImagePreview h3{ padding: 5px 0; font-size: 14px; color: #333; text-align: center; } .riOverlayInner .foot{ clear: both; border-top: 1px solid #ccc; background: #eee url(../images/layout/adapter_search/1x1white.gif) 0 0 repeat-x; padding: 10px; text-align: right; vertical-align: middle; } .riOverlayInner .foot input{ vertical-align: middle; } * html .adapterSearch .ui-dialog-titlebar, * html .riOverlayContainer .ui-dialog-titlebar{ filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/layout/adapter_search/overlay_hd.png', sizingMethod='crop'); background: none; } * html .ui-dialog *{ zoom: 1; } * html #adapterOverlay .adapterList h3.hover, * html .riOverlayContainer .choiceList h3.hover { background: #fdf5c5; } * html .overlayed select{ display: none; } * html #adapterOverlay .ft, * html .riOverlayContainer .ft{ filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/layout/adapter_search/overlay_ft.png', sizingMethod='crop'); background: none; } * html .adapterList, * html .riOverlayContainer .choiceList{ z-index: 10; position: relative; overflow: hidden; zoom: 1; } * html option.disabled{ color: #ccc; } /* !home hero styles */ .hero{ border-bottom: 1px solid #ccc; font-family: Helvetica, Arial, sans-serif; background: url(../images/layout/homehero_back.gif) 0 bottom repeat-x; position: relative; } .hero h1{ font-size: 20px; font-family: Helvetica, Arial, sans-serif; } .hero h2{ font-size: 20px; font-weight: normal; margin: 0 0 10px; font-family: Helvetica, Arial, sans-serif; } .hero p{ font-size: 12px; margin: 0 0 10px; padding: 0; } .hero *{ position: relative; z-index: 2; } #createHero{ background: url(../images/marketing/create_home_hero.jpg) right 0 no-repeat; padding: 40px 295px 40px 10px; } #handPumpHero{ padding: 40px 185px 40px 10px; } #handPumpHero p{ margin: 0 100px 10px 0; } #handPumpHero img{ display: block; position: absolute; right: 0; top: 59px; z-index: 1;} #ccccHero{ background: url(../images/marketing/cccc_home_hero.jpg) right 0 no-repeat; padding: 50px 315px 60px 10px; margin: -9px 0 0; } #ccccHero h1{ margin: 0 0 10px; } /* !cccc promo page */ #ccccPromo{ overflow: hidden; font-size: 12px; } #ccccPromo .intro{ background: url(../images/cccc/homepromo_intro.jpg) 0 0 no-repeat; padding: 33px 340px 40px 10px; } #ccccPromo h1{ font-family: Helvetica, Arial, sans-serif; font-weight: normal; font-size: 28px; line-height: 32px; margin: 0 0 10px; } #ccccPromo p{ margin: 0 0 5px; padding: 0; } #ccccPromo a.callOut{ display: block; color: #0c5ea5; padding: 0 0 0 7px; font-weight: bold; background: url(../images/cccc/blue_arrow.gif) 0 5px no-repeat; margin: 0 0 5px;} #ccccPromo .subHeadBlock{ overflow: hidden; padding: 10px 0; position: relative; margin: 10px 0 30px; } #ccccPromo .subHeadBlock h2{ background: url("../images/cccc/fadediv-horiz-nav.png") no-repeat scroll center 20px transparent; margin: 0 0 10px 0; padding: 0 0 2px; font-family: "Trebuchet MS", Arial, sans-serif; font-size: 17px; } #ccccPromo .subHeadBlock h2 span{ border-bottom: 5px solid #ccc; } #ccccPromo .subHeadBlock p{ padding: 0 10px 10px; } #ccccPromo .keys{ overflow: hidden; background: url(../images/cccc/homepromo_back.png) 0 0 repeat-x; margin: 0; list-style: none; } #ccccPromo .subHeadBlock .keys li{ float: left; width: 145px; padding: 0; position: relative; cursor: pointer; } #ccccPromo .subHeadBlock .keys li h3{ text-align: center; font-family: "Trebuchet MS", Arial, sans-serif; font-size: 13px; font-weight: normal; text-transform: uppercase; padding: 62px 0 0; margin: 0 0 10px; position: relative; z-index: 2; background-image: url(../images/cccc/homepromo_cccc_spr.png); background-repeat: no-repeat; } #ccccPromo .subHeadBlock .connect h3{ background-position: 42px 0; } #ccccPromo .subHeadBlock .create h3{ background-position: -105px 0; } #ccccPromo .subHeadBlock .control h3{ background-position: -253px 0; } #ccccPromo .subHeadBlock .calibrate h3{ background-position: -401px 0; } #ccccPromo .subHeadBlock .keys li h3 a{ color: #0c60a9; text-decoration: none; background: transparent; } #ccccPromo .subHeadBlock .keys li h3 a:hover, #ccccPromo .subHeadBlock .keys .hover h3 a{ text-decoration: underline; } #ccccPromo .subHeadBlock .keys li p{ font-size: 11px; padding: 0 7px 10px 10px; position: relative; z-index: 2; } #ccccPromo .subHeadBlock .keys li .w{ position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%; background: url(../images/cccc/homepromo_back_hover.png) 0 1px repeat-x; display: none; } /* !DLI content */ #dli-content{ overflow: hidden; } #dli-content .breadcrumb{ padding: 0 0 0 10px; margin: 0; } #dli-content .breadcrumb i{ vertical-align: -6%;} #dli-content h1{ font-size: 26px; padding: 0 0 10px 10px; clear: both; } #dli-content h2{ font-size: 17px; font-family: "Trebuchet MS", Helvetica, Arial, sans-serif; font-weight: bold; margin: 0 0 5px; clear: both;} #dli-content h3, #dli-content .account-blocks div h4{ font-size: 12px; font-weight: bold; color: #333; clear: both; } #dli-content .account-blocks div h3{ font-family: "Trebuchet MS", Arial, sans-serif; font-size: 14px; color: #666; font-style: italic; } #dli-content p{ margin: 0 0 10px; padding: 0; } #dli-detail{ width: 380px; float: left; padding: 15px 20px 0 10px; background: url(../images/layout/dli_back.png) 0 0 repeat-x; } .full #dli-detail{ width: 560px; font-size: 12px; } #dli-content .account-blocks{ margin: 0; list-style: none; } #dli-content .account-blocks li{ padding: 0 0 5px; margin: 0 0 15px; border-bottom: 1px dotted #ccc; overflow: hidden; } #dli-content .account-blocks li:last-child{ border-bottom: 0; } #dli-content .jump-down{ margin: 0; list-style: none; } #dli-content .jump-down li{ padding: 0 0 4px; border: 0; margin: 0; } #dli-content .jump-down a{ background: url(../images/layout/icons/jump_down.gif) 0 center no-repeat; padding: 0 0 2px 16px; color: #199e5c; } #dli-content .jump-up{ text-align: right; clear: both; } #dli-content .jump-up a{ background: url(../images/layout/icons/jump_up.gif) 0 center no-repeat; padding: 0 0 2px 16px; color: #199e5c; } #dli-aside{ width: 150px; float: left; padding: 15px 10px; background: url(../images/layout/dli_back.png) 0 0 repeat-x; } #dli-aside .userInfo{ margin: 0; list-style: none; } #dli-aside .userInfo li{ padding: 0 0 10px; margin: 0 0 10px; border-bottom: 1px dotted #ccc; line-height: 1.5; } #dli-aside .userInfo li:last-child{ border: 0; } #dli-aside .userInfo h3{ color: #333; margin: 0; padding: 4px 0; line-height: 16px; } #dli-aside .account h3{ padding: 4px 0 4px 20px; background: url(../images/layout/icons/account.gif) 0 center no-repeat; } #dli-aside .company h3{ padding: 4px 0 4px 20px; background: url(../images/layout/icons/company.gif) 0 center no-repeat; } #dli-content .photo-col, #dli-content .photo-col-last{ width: 120px; margin: 0 10px 0 0; float: left; } #dli-content .photo-col-last{ margin: 0; } #dli-content .photo-col ul, #dli-content .photo-col-last ul{ margin: 0; list-style: none; } #dli-content .photo-col li, #dli-content .photo-col-last li{ border: 1px solid #ccc; padding: 1px; margin: 0 0 10px; } #dli-content .photo-col img, #dli-content .photo-col-last img{ display: block; } #dli-content .photo-col a, #dli-content .photo-col-last a{ display: table-cell; text-align: center; background: #eee; padding: 2px; vertical-align: middle; height:34px; width: 112px; } #dli-content .photo-col a:hover, #dli-content .photo-col-last a:hover{ color: #0C60A9; } #dli-content .product-photos{ width: 100%; margin: 15px 0; } #dli-content .product-photos thead tr{ background: #e5e5e5; } #dli-content .product-photos thead td, #dli-content .product-photos thead th{ border-bottom: 1px solid #ccc; padding: 5px 10px; font-weight: bold; } #dli-content .product-photos thead th.note{ font-weight: normal; font-style: italic; } #dli-content .product-photos img{ vertical-align: middle; } #dli-content .product-photos a{ text-decoration: none; } #dli-content .product-photos tfoot{ display: none; } #dli-content .product-photos tbody tr.alt{ background: #eee; } #dli-content .product-photos tbody td{ padding: 5px 10px; } #dli-content .product-photos .print{ border-left: 1px solid #ccc; } #dli-content .product-photos .web{ border-right: 1px solid #ccc; } #dli-content .dli-head h1{ margin: 0; padding: 0 0 10px; } #dli-content .dli-head{ padding: 0 10px; margin: 0 0 10px; font-size: 12px; } #dli-content .logodownload-left{ width: 185px; float: left; margin: 0 10px 0 0; } #dli-content .logodownload-right{ width: 185px; float: left; } #dli-content .logodownload-right img, #dli-content .logodownload-left img{ display: block; margin: 0 0 15px; } .form-caption{ font-style: italic; font-size: 11px; } .dli-form{ padding: 10px 0 0; border-top: 1px dotted #ccc; } .dli-form dl{ overflow: hidden; } .dli-form dt{ width: 160px; float: left; clear: left; padding: 4px 20px 15px 0; text-align: right; font-size: 12px; } .dli-form dd{ width: 375px; padding: 0 0 15px 5px; float: left; } .dli-form dt.required{ background: url(../images/layout/green_asterisk.gif) 170px 9px no-repeat; } .dli-form input{ width: 280px; float: left; font-size: 12px; padding: 2px 3px; } .dli-form select{ width: 200px; float: left; font-size: 12px; } .dli-form input.number{ width: 80px; } .dli-form .helpLink{ margin: 2px 10px 0; float: left; } * html .dli-form .helpLink{ display: inline; } .dli-form .footer{ margin: 10px 0; padding: 20px 15px 0; overflow: hidden; background: url(../images/layout/form_footer.gif) 0 0 repeat-x; } #request-access{ width: 164px; height: 41px; display: block; float: right; background: url(../images/layout/request_access.png) 0 0 no-repeat; text-indent: -9999px; cursor: pointer; } #request-access:hover{ background-position: 0 -41px; } /*-- ---- --formContainer ---- --*/ .formContainer{ font-size: 12px; } .fHeader{ padding: 5px 10px 15px; border-bottom: 1px solid #ccc; } .fHeader h1{ font-size: 26px; } .fHeader p{ padding: 1em 0 0; } .fHeader h1.success:after{ content: url("../images/layout/big-check.png"); vertical-align: top; } .fBody{ margin: 10px 10px 1px; padding: 0 0 10px; border-bottom: 3px solid #ccc; } .fBlock{ padding: 0 0 10px; } .fBlock:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } .fBlock .fLabel{ width: 160px; text-align: right; padding: 7px 25px 0 0; float: left; } .required .fLabel{ background: url(../images/layout/asterix.png) right 11px no-repeat; } .fBlock .fInput{ width: 375px; float: right; line-height: 30px; } .fSubHead{ margin: 10px; padding: 0 10px; border-bottom: 1px dotted #ccc; } .fSubHead h2{ font-size: 17px; font-weight: bold; font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; } .fSubHead .note{ font-size: 11px; font-style: italic; } .fInput .text-input{ border: 1px solid #ccc; padding: 6px 6px; font-size: 12px; width: 280px; float: left; background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f3f3f3), color-stop(0.5, #fff)); background: -webkit-linear-gradient(center top , #f3f3f3 0%, #fff 50%); background: -o-linear-gradient(center top , #f3f3f3 0%, #fff 50%); background: -moz-linear-gradient(center top , #f3f3f3 0%, #fff 50%); background: linear-gradient(center top , #f3f3f3 0%, #fff 50%); } .fInput .short{ width: 80px; } .fInput .select-input{ border: 1px solid #ccc; padding: 6px 6px; font-size: 12px; width: 200px; float: left; background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f3f3f3), color-stop(0.5, #fff)); background: -webkit-linear-gradient(center top , #f3f3f3 0%, #fff 50%); background: -o-linear-gradient(center top , #f3f3f3 0%, #fff 50%); background: -moz-linear-gradient(center top , #f3f3f3 0%, #fff 50%); background: linear-gradient(center top , #f3f3f3 0%, #fff 50%); } .error .text-input, .error .select-input{ border-color: #df1f1f; background: #f3e1e1; background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f3e1e1), color-stop(0.5, #ffecec)); background: -webkit-linear-gradient(center top , #f3e1e1, #ffecec); background: -o-linear-gradient(center top , #f3e1e1, #ffecec); background: -moz-linear-gradient(center top , #f3e1e1, #ffecec); background: linear-gradient(center top , #f3e1e1, #ffecec); } .fInput .helpLink{ float: left; margin: 2px 10px 0; } .fFooter{ margin: 0 10px; padding: 15px; text-align: right; background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #eee), color-stop(0.5, #fff)); background: -webkit-linear-gradient(center top , #eee, #fff); background: -o-linear-gradient(center top , #eee, #fff); background: -moz-linear-gradient(center top , #eee, #fff); background: linear-gradient(center top , #eee, #fff); } .fFooter .error-message{ color: #f23939; float: left; width: 325px; margin: 0 0 0 40px; text-align: left; } .fFooter .error-message h3{ margin: 0; padding: 0; color: #f23939; font-size: 14px; } .submit-input{ font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-size: 18px; font-weight: bold; text-shadow: 0 -1px 0 #0c4f2e; color: #fff; padding: 8px 12px; border: 1px solid #67bf94; background: #0d693b; cursor: pointer; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; background: #51b583; /* Old browsers */ background: -moz-linear-gradient(top, #51b583 0%, #36aa70 50%, #199e5c 51%, #199e5c 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#51b583), color-stop(50%,#36aa70), color-stop(51%,#199e5c), color-stop(100%,#199e5c)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #51b583 0%,#36aa70 50%,#199e5c 51%,#199e5c 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #51b583 0%,#36aa70 50%,#199e5c 51%,#199e5c 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #51b583 0%,#36aa70 50%,#199e5c 51%,#199e5c 100%); /* IE10+ */ background: linear-gradient(top, #51b583 0%,#36aa70 50%,#199e5c 51%,#199e5c 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#51b583', endColorstr='#199e5c',GradientType=0 ); /* IE6-9 */ -webkit-box-shadow: 0 0 0 1px #15834c; -moz-box-shadow: 0 0 0 1px #15834c; -o-box-shadow: 0 0 0 1px #15834c; box-shadow: 0 0 0 1px #15834c; } .submit-input:hover{ background: #51b583; /* Old browsers */ background: -moz-linear-gradient(top, #2dc97c 0%, #1aba6a 50%, #07a858 51%, #07a858 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2dc97c), color-stop(50%,#1aba6a), color-stop(51%,#07a858), color-stop(100%,#07a858)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #2dc97c 0%,#1aba6a 50%,#07a858 51%,#07a858 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #2dc97c 0%,#1aba6a 50%,#07a858 51%,#07a858 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #2dc97c 0%,#1aba6a 50%,#07a858 51%,#07a858 100%); /* IE10+ */ background: linear-gradient(top, #2dc97c 0%,#1aba6a 50%,#07a858 51%,#07a858 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2dc97c', endColorstr='#07a858',GradientType=0 ); /* IE6-9 */ } .formContainer .related-info{ font-size: 11px; } .formContainer .related-info h3{ font-size: 17px; margin: 0; } * html #ccccPromo, * html #ccccPromo .intro{ zoom: 1; } /* * html #navigation li{ display: inline; width: 1%; } */ /* clear hover effects */ #masthead p a:hover { background: none; } /* auto clearing method #container, #content-container, #masthead, #navigation ul, .page-info, .small-promo, .listing, .sitemap-container, #sitemap .pages { overflow: auto; height: 1%; } #navigation ul, .listing { overflow: hidden; } */ #container:after, #content-container:after, #masthead:after, #navigation ul:after, .page-info:after, .small-promo:after, .listing:after, .sitemap-container:after, #sitemap .pages:after, #sitemap:after, .product-detail:after, .tab-nav:after, .prod-item:after, .cross-cell:after, .category-item:after, .small-form:after, .element-group:after, #popup-content .form .element:after, .felement:after, .pp-block-container:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } #container, #content-container, #masthead, #navigation ul, .page-info, .small-promo, .listing, .sitemap-container, #sitemap .pages, #sitemap, .product-detail, .tab-nav, .prod-item, .cross-cell, .category-item, .small-form, .element-group, #popup-content .form .element, .felement ,.pp-block-container {display: inline-block;} /* Hides from IE-mac \*/ * html #container, * html #content-container, * html #masthead, * html #navigation ul, * html .page-info, * html .small-promo, * html .listing, * html .sitemap-container, * html #sitemap .pages, * html #sitemap, * html .product-detail, * html .tab-nav, * html .prod-item, * html .cross-cell, * html .category-item, * html .small-form, * html .element-group, * html #popup-content .form .element, * html .felement, * html .pp-block-container {height: 1%;} #container, #content-container, #masthead, #navigation ul, .page-info, .small-promo, .listing, .sitemap-container, #sitemap .pages, #sitemap, .product-detail, .tab-nav, .prod-item, .cross-cell, .category-item, .small-form, .element-group, #popup-content .form .element, .felement, .pp-block-container {display: block;} /* End hide from IE-mac */ /* Adapter Search Promo Box */ #adapter-search-promo h2{ font-size: 18px; margin: 15px 0 0 0; } .category-listing h2{ font-size: 18px; margin: 20px 0 15px 0; } #adapter-search-promo { background: url(http://www.ralstoninst.com/assets/ui/images/layout/hr-grey.gif) repeat-x; padding-top: 1px; margin-top: 10px; margin-bottom: 10px; width: 100%; } #adapter-search-promo-left { float: left; width: 370px; margin-right: 30px; font-size: 12px; display: inline; } #adapter-search-promo-left img{ float: right; } #adapter-search-promo-right { width: 100px; display: inline; } #adapter-search-promo-right img{ margin-top: 10px; } /* Video Player */ #videoPlayer { float: left; margin: 30px 0px 10px 32px; } #videoBox { border: 2px solid #333; } #videoPlayer p { margin: 15px auto; text-align: center; font-size: 2em; } #videoPlayer p a { color: #0c60a9; } #videoPlayer p a:hover { background-color: #0c60a9; color: #fff; }