@charset "UTF-8"; /* CSS Document */ /* Table of Contents: Global Styles (body, paragraphs, lists, etc) Header Page Structure Headings Text Styles */ /* Reset --------------------------------------------------------------------------------------- */ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align:top } body { line-height: 1.5; background: #fff; margin:1.5em 0; } /* Tables still need 'cellspacing="0"' in the markup. */ table { border-collapse: separate; border-spacing: 0; } caption, th, td { text-align: left; font-weight:400; } /* Remove possible quote marks (") from ,
. */ blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } a img { border: none; } /* Global Styles --------------------------------------------------------------------------------------- */ html, body { border:0; margin:0; padding:0; font-family:'Lucida Fax', Lucida Grande, Arial sans-serif; color:#6c5f41; text-align:left; height:100%; font-size:12px; background:url(../images/bDrop_body.gif) repeat-x; } html { background:url(../images/bDrop_body2.gif) ;} /* Page Structure --------------------------------------------------------------------------------------- */ #home, #range, #who, #sizing, #rivet, #stores, #privacy, #contact, #shop4kids, #media {margin:0 auto; width:900px; min-height:100%; position:relative; z-index: 2; } * html #home, * html #range, * html #who, * html #sizing, *html #rivet, *html #stores, *html #privacy, *html #contact, *html #shop4kids, #media { height:100%; } #trike { position: absolute; bottom:0px; right: 0px; width: 232px; height: 450px; background: url(../images/bDrop_icon.gif) bottom no-repeat; z-index: 1; } #header { height:98px; } #banner { background:url(../images/bDrop_banner.gif) left bottom no-repeat; padding-left:332px; margin-top:17px; } #teasers {width: 900px; margin:0 auto; padding-top:15px; } #one {float: left; width: 195px; margin: 0px; padding: 20px 30px; } #two { padding: 20px; margin: 0 280px 0 310px; } #three {float: right; width: 255px; margin: 0; padding: 20px 0px; } #content {padding:25px 0 65px 0;} #col01 {float:left; width:260px; padding:0 15px;} #col02 {margin-left:300px; padding:0 35px;} #col03 {padding:0 15px;} #col03 .one {float: left; width: 265px; margin: 0px; padding-right:25px; } #col03 .two { margin: 0 290px; padding-right:25px; } #col03 .three {float: right; width: 265px; padding-right:25px;} #col01 img, #col03 img {margin-bottom:10px;} .dash {background:url(../images/ic_dash.png) top no-repeat; height:50px; } .clear {clear:both; } .viewcart {float:right; width:253px; margin-bottom:10px; height:183px; } #three ul, #rangebut ul { margin:0; padding:0; list-style-type:none; list-style-image:none; list-style-position:outside; display:block;} #three ul li { margin: 10px 0; padding: 0;} #rangebut ul li { margin: 0; padding: 0;} #three ul li a, #rangebut ul li a { height:40px; display: block; margin:0; padding: 0;} #how ul { margin:0; padding:0; list-style-type:none; list-style-image:none; list-style-position:outside; display:block;} #how ul li { float: left; margin: 0; padding: 0;} #how ul li a { height:52px; display: block; margin: 0; padding: 0;} #season ul { margin:0px; padding:0; list-style-type:none; list-style-image:none; list-style-position:outside; display:block;} #season ul li { float: left; margin: 0; padding: 0;} #season ul li a { height:233px; display: block; margin: 0; padding: 0;} #footer {position:relative; z-index: 2; margin: -56px auto 0 auto; clear:both; background:url(../images/bDrop_footer.gif) repeat-x; height:56px; } #footer #frame { margin:0 auto; width:900px; padding-top:20px; } #footer #frame .col01, #footer #frame .col02 {float:left; width:255px; font-family:'Lucida Fax', Lucida Grande, Arial sans-serif; color:#6c5f41; font-size:10px; font-weight:normal; padding:0 15px 10px 30px; line-height:18px; } #footer #frame .col02 {margin-left:305px; padding:0 15px 10px 25px; float:none; width:535px; } /* Headings --------------------------------------------------------------------------------------- */ h1, h2, h3 {} #header h1 a { height:98px; width:323; background:url(../images/hd_logo.gif) no-repeat; text-indent:-9999px; padding:0; margin:0; display:block; } #home #banner h1 {background:url(../images/hd_hero.gif) no-repeat; height:180px; width:360px; text-indent:-9999px; margin:0; padding:0;} #who #banner h1 {height:235px; background:url(../images/hd_who.gif) no-repeat; height:235px; width:571px; text-indent:-9999px; margin:0; padding:0;} #sizing #banner h1 {height:235px; background:url(../images/hd_sizing.gif) no-repeat; height:235px; width:571px; text-indent:-9999px; margin:0; padding:0;} #rivet #banner h1 {height:235px; background:url(../images/hd_rivet.gif) no-repeat; height:235px; width:571px; text-indent:-9999px; margin:0; padding:0;} #range #banner h1 {background:url(../images/hd_range.gif) no-repeat; height:235px; width:571px; text-indent:-9999px; margin:0; padding:0;} #stores #banner h1 {background:url(../images/hd_stores.gif) no-repeat; height:235px; width:571px; text-indent:-9999px; margin:0; padding:0;} #privacy #banner h1 {background:url(../images/hd_privacy.gif) no-repeat; height:235px; width:571px; text-indent:-9999px; margin:0; padding:0;} #contact #banner h1 {background:url(../images/hd_contact.gif) no-repeat; height:235px; width:571px; text-indent:-9999px; margin:0; padding:0;} #shop4kids #banner h1 {background:url(../images/hd_shop4kids.gif) no-repeat; height:235px; width:571px; text-indent:-9999px; margin:0; padding:0;} #media #banner h1 {background:url(../images/hd_media.png) no-repeat; height:235px; width:571px; text-indent:-9999px; margin:0; padding:0;} #who h2.who {background:url(../images/hd_whois.gif) no-repeat; margin:0; padding:0; text-indent:-9999px; width:448px; height:45px;} h2 { font-size:24px; line-height:32px; color:#5a564c; margin-bottom:16px; } h4 { font-size:24px; line-height:32px; color:#373435; text-transform:uppercase; margin-bottom:16px; } #sizing h2.size {background:url(../images/hd_rivetsizing.gif) no-repeat; margin:0; padding:0; text-indent:-9999px; width:448px; height:45px;} #stores h2.promise, #shop4kids h2.promise {background:url(../images/hd_promise.gif) no-repeat; height:45px; width:351px; text-indent:-9999px; margin:0; padding:0;} #stores h2.purchase, #shop4kids h2.purchase {height:45px; width:266px; background:url(../images/hd_purchase.gif) no-repeat; text-indent:-9999px; margin:0; padding:0;} #stores h2.boys, #range h2.boys, #shop4kids h2.boys {height:45px; width:266px; background:url(../images/hd_boys.gif) no-repeat; text-indent:-9999px; margin:0; padding:0;} #stores h2.girls, #range h2.girls, #shop4kids h2.girls {height:55px; width:266px; background:url(../images/hd_girls.gif) bottom left no-repeat; text-indent:-9999px; margin:0; padding:0;} #stores h2.size, #shop4kids h2.size {height:45px; width:266px; background:url(../images/hd_size.gif) no-repeat; text-indent:-9999px; margin:0; padding:0;} #stores h2.parcel, #shop4kids h2.parcel {height:45px; width:266px; background:url(../images/hd_parcel.gif) no-repeat; text-indent:-9999px; margin:0; padding:0;} #stores h2.popup, #shop4kids h2.popup {height:45px; width:266px; background:url(../images/hd_popup.gif) no-repeat; text-indent:-9999px; margin:0; padding:0;} #stores h2.vouchers {height:45px; width:266px; background:url(../images/hd_vouchers.gif) no-repeat; text-indent:-9999px; margin:0; padding:0;} #stores h1.summer, #sizing h1.summer, #range h1.summer, #shop4kids h1.summer {height:45px; width:266px; background:url(../images/hd_summer.gif) no-repeat; text-indent:-9999px; margin:0; padding:0;} #stores h1.winter, #sizing h1.winter, #range h1.winter, #shop4kids h1.winter {height:45px; width:266px; background:url(../images/hd_winter.gif) no-repeat; text-indent:-9999px; margin:0; padding:0;} #rivet h2.join {height:45px; width:266px; background:url(../images/hd_joinrivet.gif) no-repeat; text-indent:-9999px; margin:0; padding:0;} #privacy h2.priv {height:45px; width:266px; background:url(../images/hd_priv.gif) no-repeat; text-indent:-9999px; margin:0; padding:0;} #privacy h2.ship {height:45px; width:266px; background:url(../images/hd_ship.gif) no-repeat; text-indent:-9999px; margin:0; padding:0;} #privacy h2.cost {height:45px; width:266px; background:url(../images/hd_cost.gif) no-repeat; text-indent:-9999px; margin:0; padding:0;} #privacy h2.polex {height:45px; width:446px; background:url(../images/hd_polex.gif) no-repeat; text-indent:-9999px; margin:0; padding:0;} #privacy h2.ex {height:45px; width:266px; background:url(../images/hd_exchange.gif) no-repeat; text-indent:-9999px; margin:0; padding:0;} #privacy h2.fault {height:45px; width:266px; background:url(../images/hd_fault.gif) no-repeat; text-indent:-9999px; margin:0; padding:0;} #privacy h2.damage {height:45px; width:266px; background:url(../images/hd_damage.gif) no-repeat; text-indent:-9999px; margin:0; padding:0;} #contact h2.con {height:45px; width:366px; background:url(../images/hd_conlr.gif) no-repeat; text-indent:-9999px; margin:0; padding:0;} #media h2.print {height:45px; width:366px; background:url(../images/hd_print.gif) no-repeat; text-indent:-9999px; margin:0; padding:0;} #media h2.web {height:45px; width:366px; background:url(../images/hd_web.gif) no-repeat; text-indent:-9999px; margin:0; padding:0;} #media h2.other {height:45px; width:366px; background:url(../images/hd_other.gif) no-repeat; text-indent:-9999px; margin:0; padding:0;} h3 {color:#373435; line-height:21px; margin-bottom:10px; font-weight:bold; font-size:14px; } /* Text Styles --------------------------------------------------------------------------------------- */ p { line-height:18px; margin-bottom:9px; font-weight:bold; } strong {color:#373435;} /* Links --------------------------------------------------------------------------------------- */ #home a, a:visited, a:hover, #range a, a:visited, a:hover, #who a, a:visited, a:hover, #sizing a, a:visited, a:hover, #rivet a, a:visited, a:hover, #stores a, a:visited, a:hover, #privacy a, a:visited, a:hover, #contact a, a:visited, a:hover, #shop4kids a, a:visited, a:hover, #media a, a:visited, a:hover {text-decoration:none; margin:0; padding:0; color:#910e0e; } #home a:hover, #range a:hover, #who a:hover, #sizing a:hover, #rivet a:hover, #stores a:hover, #privacy a:hover, #contact a:hover, #media a:hover { text-decoration:underline;} #three ul li a.one, #rangebut ul li a.one { width:132px; height:40px; background:url(../images/bt_t1.gif) top no-repeat; text-indent:-9999px; margin:0; padding:0;} #three ul li a.one:hover, #rangebut ul li a.one:hover { background:url(../images/bt_t1.gif) bottom no-repeat; margin:0; padding:0;} #three ul li a.two, #rangebut ul li a.two { width:132px; height:40px; background:url(../images/bt_t2.gif) top no-repeat; text-indent:-9999px; margin:0; padding:0;} #three ul li a.two:hover, #rangebut ul li a.two:hover { background:url(../images/bt_t2.gif) bottom no-repeat; margin:0; padding:0;} #three ul li a.three, #rangebut ul li a.three { width:132px; height:40px; background:url(../images/bt_t3.gif) left top no-repeat; text-indent:-9999px; margin:0; padding:0;} #three ul li a.three:hover, #rangebut ul li a.three:hover { background:url(../images/bt_t3.gif) left bottom no-repeat; margin:0; padding:0;} #cart ul li a.add { width:141px; height:36px; background:url(../images/bt_addcart.gif) left top no-repeat; text-indent:-9999px; margin:0; padding:0;} #cart ul li a.add:hover { background:url(../images/bt_addcart.gif) left bottom no-repeat; margin:0; padding:0;} #cart ul li a.view { width:141px; height:36px; background:url(../images/bt_viewcart.gif) left top no-repeat; text-indent:-9999px; margin:0; padding:0;} #cart ul li a.view:hover { background:url(../images/bt_viewcart.gif) left bottom no-repeat; margin:0; padding:0;} #how ul li a.contact { width:196px; height:52px; background:url(../images/bt_contactus.gif) left top no-repeat; text-indent:-9999px; margin:0; padding:0;} #how ul li a.contact:hover { background:url(../images/bt_contactus.gif) left bottom no-repeat; margin:0; padding:0;} #how ul li a.check { width:196px; height:52px; background:url(../images/bt_check.gif) left top no-repeat; text-indent:-9999px; margin:0; padding:0;} #how ul li a.check:hover { background:url(../images/bt_check.gif) left bottom no-repeat; margin:0; padding:0;} #season ul li a.winter { width:260px; height:233px; background:url(../images/bt_winter10.jpg) left top no-repeat; text-indent:-9999px; margin:0; padding:0;} #season ul li a.winter:hover { background:url(../images/bt_winter10.jpg) left bottom no-repeat; margin:0; padding:0;} #season ul li a.summer { width:260px; height:233px; background:url(../images/bt_summer11.jpg) left top no-repeat; text-indent:-9999px; margin:0; padding:0;} #season ul li a.summer:hover { background:url(../images/bt_summer11.jpg) left bottom no-repeat; margin:0; padding:0;} #season ul li a.summer09 { width:260px; height:233px; background:url(../images/bt_summer09.jpg) left top no-repeat; text-indent:-9999px; margin:0; padding:0;} #season ul li a.summer09:hover { background:url(../images/bt_summer09.jpg) left bottom no-repeat; margin:0; padding:0;} #season ul li a.winter11 { width:260px; height:233px; background:url(../images/bt_winter11.jpg) left top no-repeat; text-indent:-9999px; margin:0; padding:0;} #season ul li a.winter11:hover { background:url(../images/bt_winter11.jpg) left bottom no-repeat; margin:0; padding:0;} #footer #frame .col02 a, a:link, a:visited, a:hover {margin:0 4px; text-decoration:none; color:#504222; } #footer #frame .col02 a:hover {color:#910e0e;} #fancybox-inner a, a:link, a:visited, a:hover {margin:0;} /* Tables --------------------------------------------------------------------------------------- */ #mytable { width: 500px; padding: 0; margin: 0px 0 9px 0px; font-size:12px;} #mytable th { color: #950c14; border-right: 1px dashed #900c0c; border-bottom: 1px dashed #900c0c; border-top: 1px dashed #900c0c; text-align: left; padding: 6px 6px 6px 12px; background: #e8dbc1; font-family:'Lucida Fax', Lucida Grande, Arial sans-serif; text-align:left; line-height:16px; font-size:12px; } #mytable th.nobg { border-top: none; border-left: none; border-right: 1px dashed #900c0c; background: none;} #mytable td { border-right: 1px dashed #900c0c; border-bottom: 1px dashed #900c0c; background: #ebe1cb; padding: 6px 6px 6px 12px; color: #6c5f41;} #mytable th.spec, #mytable th.specalt { border-left: 1px dashed #900c0c; border-top: 0; font-size:12px; font-family:'Lucida Fax', Lucida Grande, Arial sans-serif; background-color:#e8dbc1; color: #950c14;} #mytablesummer { width:900px; } #mytablesummer td { width:300px; } /* Main navigation -------------------------------- */ #nav { float:right; padding:0; list-style:none; height:98px; position:relative; z-index:500; font-family:'Lucida Fax', Lucida Grande, Arial sans-serif; } #nav li { float:left; margin:0; padding:0; } #nav li a { height:98px; display:block; margin:0; padding:0; } #nav li.top { display:block; float:left; height:15px; } #nav li a.top_link span { float:left; display:block; padding:0 24px 0 12px; height:35px; } #nav li a.top_link span.down { float:left; display:block; padding:0 24px 0 12px; height:35px; } #nav li:hover { position:relative; z-index:200; } #nav li:hover ul.sub { left:10px; top:98px; background:#e8e0c9; padding:3px; border:1px solid #d9c7a6; white-space:nowrap; width:145px; height:auto; z-index:900; } #nav li:hover ul.sub li { display:block; height:20px; position:relative; float:left; width:145px; font-weight:500; } #nav li:hover ul.sub li a { display:block; font-size:10px; height:20px; width:145px; line-height:18px; text-indent:5px; color:#76694b; text-decoration:none; } #nav li:hover ul.sub li a:hover { color:#910e0e; } #nav ul, #nav li:hover ul ul, #nav li:hover li:hover ul ul, #nav li:hover li:hover li:hover ul ul, #nav li:hover li:hover li:hover li:hover ul ul { position:absolute; z-index:500; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none; } #nav li a.home { width:65px; height:98px; background: url(../images/bt_home.gif) top no-repeat; text-indent:-9999px; margin:0; padding:0; } #nav li a.range { width:71px; height:98px; background: url(../images/bt_range.gif) top no-repeat; text-indent:-9999px; margin:0; padding:0; } #nav li a.stores { width:72px; height:98px; background: url(../images/bt_shop.gif) top no-repeat; text-indent:-9999px; margin:0; padding:0; } #nav li a.who { width:102px; height:98px; background: url(../images/bt_who.gif) top no-repeat; text-indent:-9999px; margin:0; padding:0; } #nav li a.press { width:65px; height:98px; background: url(../images/bt_press.gif) top no-repeat; text-indent:-9999px; margin:0; padding:0; } #nav li a.sizing { width:69px; height:98px; background: url(../images/bt_sizing.gif) top no-repeat; text-indent:-9999px; margin:0; padding:0; } #nav li a.rivet { width:97px; height:98px; background: url(../images/bt_rivet.gif) top no-repeat; text-indent:-9999px; margin:0; padding:0; } #nav li a.contact { width:101px; height:98px; background: url(../images/bt_contact.gif) top no-repeat; text-indent:-9999px; margin:0; padding:0; } #nav li a.home:hover { background: url(../images/bt_home.gif) bottom no-repeat; margin:0; padding:0; } #nav li a.range:hover { background: url(../images/bt_range.gif) bottom no-repeat; margin:0; padding:0; } #nav li a.stores:hover { background: url(../images/bt_shop.gif) bottom no-repeat; margin:0; padding:0; } #nav li a.who:hover { background: url(../images/bt_who.gif) bottom no-repeat; margin:0; padding:0; } #nav li a.press:hover { background: url(../images/bt_press.gif) bottom no-repeat; margin:0; padding:0; } #nav li a.sizing:hover { background: url(../images/bt_sizing.gif) bottom no-repeat; margin:0; padding:0; } #nav li a.rivet:hover { background: url(../images/bt_rivet.gif) bottom no-repeat; margin:0; padding:0; } #nav li a.contact:hover { background: url(../images/bt_contact.gif) bottom no-repeat; margin:0; padding:0; }