/* --------------------------------------------- Whaley Screen Style Sheet author: Cyberwoven version: 2009.05 ----------------------------------------------- */ * {margin:0; padding:0;} body { background:#e8e9f7 url(../images/body_bg.jpg) repeat-x top left; font:normal 12px/18px Arial, Helvetica, sans-serif; color: #000000;} a {color:#3b475f; text-decoration:underline;} a:hover {color:#02115b; text-decoration:underline;} h2 {font:normal 22px/26px Arial, Helvetica, sans-serif; margin:0 0 6px 0; padding:0;} h3 {font:normal 18px/22px Arial, Helvetica, sans-serif; margin:20px 0 4px 0; padding:0;} h4 {font:bold 14px/20px Arial, Helvetica, sans-serif; margin:15px 0 2px 0; padding:0;} p {margin:0 0 15px 0; padding:0;} hr{color:#000000; height: 1px;} ul{list-style: none;} fieldset {border:none;} /* Structure ---------------------------------- */ #wrapper {width: 960px; margin: 0px auto; } #topbar {height:110px;} h1.logo{float: left;} h1.logo a{display: block; width: 284px; height: 110px; background:url(../images/h1_whaleylogo.jpg) no-repeat top left; text-indent: -9999px;} h1.logo a:hover{background-position: bottom left;} #mainnav {display: block; width: 676px; height: 110px; background:url(../images/mainnav_bg.jpg) no-repeat top left; float: left; position:relative;} ul.mainnav {display:block; position:absolute; bottom:5px; right:45px; margin:0; padding:0; list-style:none;} ul.mainnav li {display:block; float:left; margin:0; padding:0 1px 0 0; height:34px; background:url(../images/mainnav-right.png) no-repeat -9999px 0;} ul.mainnav li a {display:block; float: left; font-size: 12px; text-decoration: none; text-transform:uppercase; color: #572f00; padding:0 12px 6px 12px; line-height:28px; background:url(../images/mainnav-left.png) no-repeat -9999px 0;} ul.mainnav li a:hover {background-position:-1px top;} ul.mainnav li:hover {background-position:right top;} ul.mainnav li:hover a, ul.mainnav li:hover a:hover {background-position:left top;} #mainnav a.facebook { display:block; width:21px; height:21px; background:url(../images/facebook_icon.png) no-repeat 0 0; text-indent:-9999px; position:absolute; bottom:15px; right:20px; } #mainnav a.facebook:hover { background-position:0 -21px; } #content {margin: 3px 0px 3px 0px; position:relative; width:960px;} #content.internal { background:url(../images/content_background.jpg) repeat-y 0 0; } #leftnav {display:block; float:left; margin:0 0 10px 0; background:#E8E9F7;} ul.leftnav li{margin: 0px 0px 3px 0px;} ul.leftnav li a{display: block; width: 282px; height: 92px; text-indent: -9999px;} ul.leftnav li a.ordernow{background:url(../images/leftnav_ordernow.jpg) no-repeat top left;} ul.leftnav li a.ordernow:hover{background-position: bottom left;} ul.leftnav li a.viewcatalog{background:url(../images/leftnav_viewcatalog.jpg) no-repeat top left;} ul.leftnav li a.viewcatalog:hover{background-position: bottom left;} ul.leftnav li a.onlinemanuals{background:url(../images/leftnav_onlinemanuals.jpg) no-repeat top left;} ul.leftnav li a.onlinemanuals:hover{background-position: bottom left;} ul.leftnav li a.generaluseparts{background:url(../images/leftnav_generaluseparts.jpg) no-repeat top left;} ul.leftnav li a.generaluseparts:hover{background-position: bottom left;} ul.leftnav li a.partsspecial{background:url(../images/leftnav_partsspecial.jpg) no-repeat top left;} ul.leftnav li a.partsspecial:hover{background-position: bottom left;} #rightcontent {margin:0 0 10px 0; float: left; display:block; width: 670px;} #footer{display: block; width: 960px; background:url(../images/footer_bg.jpg) no-repeat 50% 0; padding: 0px 0px 60px 0px; margin:0 0 0 0; line-height:14px;} #footer ul.footernav {float: right; margin: 7px 27px 10px 0px;} #footer ul.footernav li{float: left; margin: 0px 0px 0px 30px;} #footer ul.footernav li a {color: #FFFFFF; text-transform: uppercase; text-decoration: none;} #footer ol {border-bottom: 1px solid #9e9ca0; height:95px; margin:8px 0px 0px 0px; padding:0;} #footer ol li { display:block; width:137px; float:left; margin:0; padding:0; } #footer ol li a{text-decoration:none; color: #02115b; font-size: 10px; display:inline;} #footer ol li.strong a { font-size:9px; } #footer ol li a:hover{text-decoration:underline;} #footer ul.fineprint {float: right; margin: 10px 0px 0px 0px;} #footer ul.fineprint li {float: left; margin: 0px 20px 0px 0px; font-size: 10px; font-weight: bold; color: #02115b; } #footer ul.fineprint li a { color:#f96a0b; text-decoration:none; } #footer ul.fineprint li a:hover { color:#f96a0b; text-decoration:underline; } /* Reusables ---------------------------------- */ .alt { display:none; } .clear { clear:both; display:block; overflow:hidden; width:0; height:0; } /* Internal Specific ----------------------------------- */ #leftnav {float: left; line-height:16px;} ul.internalleftnav li{margin: 0px 0px 3px 0px; width:282px; } ul.internalleftnav li a{display: block; width: 236px; padding: 15px 0px 15px 44px; background:#d5d4db url(../images/internalleftnav_bg.jpg) no-repeat -282px 0; border:solid 1px #c0c0cf; color: #5c636e; text-transform: capitalize; text-decoration: none; font-size: 16px;} ul.internalleftnav li a:hover{background-position: 100% 100%; background-color:#2723a8; color: #FFFFFF;} ul.internalleftnav li a:active{background-position: 102% 100%; background-color:#2723a8; color: #FFFFFF;} #leftnav img {width: 272px; padding: 4px; margin: 0px 0px 3px 0px; background: #b9b9c1; border: 1px solid #b3b4c1;} #leftnav #banner{width: 272px; padding: 4px; margin: 0px 0px 3px 0px; background: #b9b9c1; border: 1px solid #b3b4c1;} #leftnav #banner #bannertext{background:url(../images/internalleftnav_banner.jpg) no-repeat top left; padding: 13px 0px 13px 11px;} #leftnav #banner #bannertext h1, #leftnav #banner #bannertext h2, #leftnav #banner #bannertext h3, #leftnav #banner #bannertext h4, #leftnav #banner #bannertext h5, #leftnav #banner #bannertext h6 {font-size: 16px; font-style: italic; color: #FFFFFF; margin:0; padding:0;} #leftnav #banner #bannertext p { font-size:10px; margin:5px 0 0 0; } #leftnav #number_banner { margin-top:-17px; width:282px; height:87px; display:block; text-indent:-9999px; background:url(../images/call_button.jpg) no-repeat top left; } #leftnav #gradientblock {background-image:url(../images/internalleftnav_gradientblock_bg.jpg); background-position: bottom left; background-color: #d5d6e1; width: 282px; min-height: 135px;} * html #leftnav #gradientblock {height: 135px;} #bannertext a { color: #02115b; } #bannertext a:hover { text-decoration:underline; } #rightcontent.internal h2{display: block; width: 672px; height: 50px; background:url(../images/internal_h2_bg.jpg) no-repeat top left; color: #FFFFFF; font-size: 24px; margin: 0px 0px 15px 0px; padding: 10px 0px 0px 20px;} #rightcontent.internal #sectiontitle { margin-left:5px; width:675px; } #rightcontent.internal #belowsectionheader { margin-left:23px; width:645px; min-height:400px; padding:0 0 30px 0;} #rightcontent.internal h3{color: #000000; font-size: 18px; margin: 0px 0px 15px 0px; font-weight: bold;} #rightcontent.internal h4, #rightcontent.internal h5, #rightcontent.internal h6{color: #666666; margin: 0px 0px 10px 0px; font-size: 14px; font-weight: bold;} #rightcontent.internal h4 { font-size:18px; } #rightcontent.internal h5 { font-weight:bold; text-transform:uppercase; } #rightcontent.internal h6 { font-weight:bold; text-transform:uppercase; font-size:12px; } #rightcontent.internal a { color: #02115b; } #rightcontent.internal a:hover { text-decoration:underline; } #rightcontent.internal ul, #rightcontent.internal ol{border-top: 1px solid #9e9fad; border-bottom: 1px solid #9e9fad; clear:both; margin: 0px 0px 10px 0px; padding: 15px 0px 15px 15px;} #rightcontent.internal ul{list-style-image:url(../images/bullet.jpg);} #rightcontent.internal ol { list-style-type:numeric; } #rightcontent.internal ul ul, #rightcontent.internal ol ol { border:none; font-size:.9em; padding:5px 0 5px 10px; } #rightcontent.internal ul li, #rightcontent.internal ol li {margin: 0px 35px 0px 15px; color: #2958a0; line-height: 200%; } #rightcontent.internal ul.parts_team { border:none; display:block; } #rightcontent.internal ul.parts_team li { display:block; float:left; height:250px; margin:0 30px 30px 0; padding:0; } #rightcontent.internal ul.parts_team li img { display:block; float:none; margin:0 0 15px 0; } #rightcontent.internal img{float: right; padding: 1px; background:none; border:1px solid #080d71; margin: 0 0 15px 15px;} #locationflash { margin-bottom:20px; } #rightflash {position:relative; float:right; width:675px;} #homeflash {margin:0; padding:0;} .noflash {width:675px; height:377px; background:url(../images/noflashbg.jpg); margin:0; padding:0;} .noflash h2 {color:#fff; font-size:22px; padding:40px 0 5px 30px; margin:0;} .noflash p {color:#fff; display:block; width:350px; font-size:14px; line-height:20px; padding:10px 0 0 30px; margin:0;} .noflash p a {color:#fff; text-decoration:underline;} /* Calendar ----------------------------- */ div#rss { display:block; height:21px; width:48px; float:right; margin:-32px 0 0 0; } * html div#rss { margin-left:-50px; } div#rss a { display:block; height:100%; width:100%; text-indent:-9999px; background:url(../images/rss_icon.png) no-repeat bottom left; } * html div#rss a { background-image:url(../images/rss_icon.jpg) no-repeat bottom left; } div#rss a:hover { background-position:top left; } .dateBox { display:block; margin:25px 0 5px 0; float:left; width:100px; text-align:right; border-bottom:solid 1px #babed8; color:#5a5f7f; } .dateBox span.month { text-transform:uppercase; font-size:10px; } .dateBox span.day { font-weight:bold; margin-left:3px; color:#414665; } #rightcontent.internal table.newsTable h5 { display:block; float:left; margin:23px 0 10px 30px; text-transform:none;} #rightcontent.internal table.newsTable h5 a { text-decoration:none; color:red; !important} #rightcontent.internal table.newsTable h5 a:hover { text-decoration:underline; } #rightcontent.internal table.newsTable p { float:left; clear:left; margin:0 0 10px 130px; } /* Contact ------------------------------ */ .contactbox legend { text-indent:-9999px; } .contactbox label { float:left; width:200px; color:#414665; margin:14px 10px 2px 1px; display:block; clear:left; border-bottom:solid 1px #D6D6E2; } .contactbox label.requiredlabel { font-weight:bold; } .contactbox label span.required { float:right; margin:0 0 0 0; color:#f15124; font-weight:normal; font-style:italic; font-family:georgia, "times new roman", "times", serif; } .contactbox label, .contactbox input { line-height:22px; } .contactbox input, .contactbox textarea {font-size:14px; color:#57575c; padding:3px 2px 4px 2px; margin: 12px 0 1px 0; border:1px solid #D6D6E2; } .contactbox input:focus, .contactbox textarea:focus { border-color:#ababc4; color:#2c2c47; } .contactbox input.textbox { width:365px; } .contactbox textarea { display:block; width:365px; height:120px; margin-bottom:20px; overflow:hidden; float:left; font-family:arial, helvetica, sans-serif; } .contactbox a.linkbutton {display:block; clear:both; margin:5px 0 0 204px; width:94px; height:49px; padding:0; text-indent:-9999px; background:#d6d7f2 url(../images/send_button.jpg) no-repeat top left; border:none; } .contactbox a.linkbutton:hover { } .contactbox .errorMessage { color:#414665 !important; font-size:11px; clear:both; width:250px; font-weight:bold; float:left; display:block; margin:5px 0 10px 212px; } .contactbox .errorMessage.textarea {clear:both; display:block; padding:0 0 0 210px;} /* Locations ------------------------------- */ .locationmap { float:right;margin-left:10px; } /* Store Specific ------------------------------- */ a.btn150 {display:block; font-size:11px; font-weight:bold; text-align:center; text-transform:uppercase; color:#425068; text-decoration:none; width:150px; height:22px; line-height:22px; background:url(../images/btn-150.gif) no-repeat;} a.btn150:hover {background-position:left bottom; text-decoration:none;} a.btn60 {display:block; font-size:11px; font-weight:bold; text-align:center; text-transform:uppercase; color:#425068; text-decoration:none; width:60px; height:22px; line-height:22px; background:url(../images/btn-60.gif) no-repeat;} a.btn60:hover {background-position:left bottom; text-decoration:none;} .storeheader {background:url(../images/storeheaderbg.png) repeat-x; height:42px; line-height:42px; position:relative; color:#953f00; font-size:14px;} .storeheader a {color:#d15902; text-decoration:underline;} .storeheader a:hover {color:#953f00;} .storeheader .cartstatus {padding:0 0 0 50px; background:url(../images/store-header-carticon.gif) no-repeat 20px center;} .storeheader .storesearch {display:block; position:absolute; top:0; right:0; height:42px; width:380px; padding:0 0 0 45px; background:url(../images/storeheaderbg-search.png) no-repeat left top;} .storeheader .storesearch label {display:block; font-weight:bold; float:left; height:42px; padding-right:5px;} .storeheader .storesearch .searchtext {position:relative; display:block; float:left; background:#fff; border:1px solid #d16a03; width:270px; height:13px; margin:7px 0; padding:6px 5px;} .storeheader .storesearch .searchbutton {display:block; float:left; padding:9px 5px;} .storecontent {background:#fff url(../images/store-divider.gif) repeat-y 284px 0; padding-top:15px; overflow:auto;} .storecontent .leftcol {position:relative; float:left; width:255px; padding:0 15px 20px 15px; margin:0 0 10px 0;} .storecontent .leftcol h4 {margin-top:0;} .storecontent .leftcol .loginbox {display:inline-block; border:1px solid #b2b8bd; background:#ecf0fb; color:#425068; padding:10px; margin-bottom:10px; position:relative;} .loginbox label {display:block; float:left; clear:left; padding:0 5px 5px 0; width:75px; height:22px; line-height:18px; text-align:right; font-weight:bold;} .loginbox .textbox {border:1px solid #b2b8bd; float:left; width:130px; line-height:16px; padding:3px 8px;} .loginbox a.loginbutton {position:absolute; bottom:33px; right:15px;} .loginbox a.createaccount {position:absolute; bottom:8px; right:15px;} .loginbox a.forgotlogin {display:block; width:80px; margin:0 0 10px 80px; clear:left; font-size:11px; line-height:16px;} .storecontent .leftcol .loggedin {display:inline-block; margin-bottom:10px; position:relative; width:250px; line-height:20px;} a.logout {color:#a85407; padding-right:15px; background:url(../images/store-logout.gif) no-repeat right center;} ul.customernav {display:block; margin:10px 0 0 0; padding:0; list-style:none;} ul.customernav li {display:inline; margin:0; padding:0;} ul.customernav li a {display:block; margin:0 0 2px 0; padding:4px 10px; text-decoration:none; line-height:14px; background:url(../images/store-customernav.gif) no-repeat left center; border:1px solid #b3bff3;} ul.customernav li a:hover, ul.customernav li.active a {background-position:right center; border-color:#8899e5;} .storecontent .leftcol .equipbrowser {border:1px solid #d16a03; background:#ffeede; color:#953f00; padding:10px; margin-bottom:10px;} .storecontent .leftcol .equipbrowser p {margin:0; padding:0;} .storecontent .leftcol .equipbrowser select {margin:10px 0 0 0; width:225px;} ul.eqblist {margin:10px 0 0 10px; padding:0; list-style:none; display:inline-block;} ul.eqblist li {list-style:none; margin:0; padding:0 0 8px 0; line-height:14px;} ul.eqblist li a {display:block; padding-left:18px;} ul.eqblist li a.pdf {background:url(../images/store-eqb-pdf.gif) no-repeat;} ul.eqblist li a.part {background:url(../images/store-eqb-part.gif) no-repeat;} .whaleyexpress {text-align:left; padding-left:82px; height:50px; line-height:16px; font-size:12px; color:#3b475f; background:url(../images/whaleyexpress.gif) no-repeat;} .storecontent .rightcol {float:right; clear:right; width:650px; overflow:hidden; padding-bottom:20px; margin:0 10px 10px 0;} .storewelcome {position:relative; margin:-5px 0 30px 0; width:350px; height:250px; padding:0 275px 0 25px; background:url(../images/store-home-bg.jpg) no-repeat; color:#323f56;} .storewelcome h3 {height:50px; font-size:1px; text-indent:-9999px; margin:0; padding:0;} .storewelcome strong {font-style:italic; font-size:16px;} .storeslider {width:645px; height:75px; background:url(../images/store-home-slider.jpg) no-repeat;} div.pager {position:relative; margin:10px 0; line-height:18px;} div.pager ul {position:absolute; top:0; right:10px; margin:0; padding:0; list-style:none; line-height:16px;} div.pager ul li {display:inline; margin:0; padding:0;} div.pager ul li a {display:block; float:left; border:1px solid #9da4c0; background:#eeeff8; color:#8899e5; text-decoration:none; font-family:courier, "Courier New", fixed; padding:0 5px; margin-left:5px;} div.pager ul li a:hover, div.pager ul li a.active {border-color:#8899e5; background:#cdd7f0; color:#636e94;} table.products {width:640px;} table.products th {border:1px solid #8899e5; border-width:1px 0; padding:3px 5px; background:#cdd7f0; color:#3b475f; text-align:left;} table.products td {vertical-align:top; padding:10px 5px; line-height:16px; border-bottom:1px solid #b3bff3;} table.products tr.even td {background:#eeeff8;} table.products a {color:#960;} table.products a:hover {color:#630;} a.lightbox {display:block; position:relative; outline:none;} a.lightbox br {display:none;} a.lightbox img {border:1px solid #bbc6f4;} a.lightbox:hover img {border-color:#595e7e;} a.lightbox strong {display:block; position:absolute; top:3px; left:3px; width:11px; height:11px; background:url(../images/store-icon-enlarge.gif) no-repeat; opacity:.25; font-size:1px; text-indent:-9999px;} a.lightbox:hover strong {opacity:1;} input.qtybox {position:relative; display:block; float:left; background:#fff; border:1px solid #ccc; width:50px; height:13px; margin:2px 5px 0 0; padding:6px 5px;} strong.status, strong.price, .pname {font-size:14px; clear:left;} .good {color:#063;} .bad {color:#600;} .productdetails {position:relative; padding-left:325px;} .productimagebox {position:absolute; right:325px; top:0; width:325px;} ul#altimages {position:relative; margin:5px 0 0 0; padding:0; list-style:none;} ul#altimages li {display:inline; margin:0; padding:0;} ul#altimages li a {display:block; float:left; margin:0 5px 5px 0; outline:none;} ul#altimages li a img {border:1px solid #bbc6f4;} ul#altimages li a.active img, ul#altimages li a:hover img {border-color:#595e7e;} .purchasebox {border:1px solid #b3bff3; background:#eeeff8; padding:5px 0; width:300px; margin-right:5px; position:relative; clear:both;} .purchasebox .pricebox {float:left; width:165px;} .purchasebox h4 {float:left; margin:0 5px 0 0; padding:5px 0 5px 0; text-align:right; width:180px; text-transform:uppercase; font-size:12px; color:#425068;} .purchasebox .status {display:block; clear:left;} ul.compareprice {display:block; float:right; width:240px; display:block; margin:0 0 10px 0; padding:0;} ul.compareprice li {display:block; margin:0; clear:both; overflow:auto;} ul.compareprice li.yourprice {font-size:14px;} ul.compareprice li.yousave {font-style:italic; color:#425068;} ul.compareprice .pricelabel {display:block; float:left; text-align:right; width:100px; margin-right:5px;} .tabnav {display:block; margin:0; padding:0; list-style:none; border-bottom:1px solid #000; height:25px;} .tabnav li {display:block; float:left; margin:0 3px 0 0; padding:0 3px 0 0; background:red; height:25px; line-height:25px;} .tabnav li a {display:block; float:left; padding:0 10px; height:25px; background:blue; border-bottom:1px solid #fff;} /* Lightbox ------------------------------- */ #lightbox{position:absolute; top:0; left:0; width:100%; z-index:100; text-align:center; line-height:0; color:#222;} #lightbox a img{border:none;} #outerImageContainer{position:relative; background-color:#fff; width:250px; height:250px; margin:0 auto;} #imageContainer{padding: 10px;} #loading{position:absolute; top:40%; left:0%; height:25%; width:100%; text-align:center; line-height:0;} #hoverNav{position:absolute; top:0; left:0; height:100%; width:100%; z-index:10;} #imageContainer>#hoverNav{left:0;} #imageContainer img {float:none; margin:0; padding:0; border:none;} #hoverNav a{outline: none;} #prevLink, #nextLink{width:49%; height:100%; background:transparent url(../images/lightbox/blank.gif) no-repeat; /* Trick IE into showing hover */ display:block;} #prevLink {left:0; float:left;} #nextLink {right:0; float:right;} #prevLink:hover, #prevLink:visited:hover {background:url(../images/lightbox/prev.gif) left 50% no-repeat; } #nextLink:hover, #nextLink:visited:hover {background:url(../images/lightbox/next.gif) right 50% no-repeat; } /*** START : next / previous text links ***/ #nextLinkText, #prevLinkText{color:#043b62; font-weight:bold; text-decoration: none;} #nextLinkText{padding-left:20px;} #prevLinkText{padding-right: 20px;} /*** END : next / previous text links ***/ /*** START : added padding when navbar is on top ***/ .ontop #imageData {padding-top:5px;} /*** END : added padding when navbar is on top ***/ #imageDataContainer{font:10px Verdana, Helvetica, sans-serif; background-color:#fff; margin:0 auto; line-height:1.4em;} #imageData{padding:0 10px;} #imageData #imageDetails{width: 70%; float:left; text-align:left; } #imageData #caption{font-weight:bold;} #imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em; } #imageData #bottomNavClose{ width: 66px; float: right; padding-bottom: 0.7em; } #imageData #helpDisplay {clear: left; float: left; display: block; } #overlay{position: absolute; top:0; left:0; z-index:90; width:100%; height:500px; background-color:#000; filter:alpha(opacity=60); -moz-opacity:0.6; opacity:0.6; display:none;} .clearfix:after {content: "."; display:block; height:0; clear:both; visibility:hidden;} * html>body .clearfix {display:inline-block; width:100%;} * html .clearfix { /* Hides from IE-mac \*/ height: 1%; /* End hide from IE-mac */ }