/** * * * Fine Line Imports' Modernized Zen-Cart Stylesheet * * @copyright Copyright 2006 FLI Development Team * @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0 */ /* general-purpose stylistic premonitions */ body { font: 11px Helvetica, Geneva, Arial, Verdana, Sans-Serif; background:black; color:green; } p, a, a:visited, label, h1,h2,h3,h4, ul, td, .content, .forward, .back, .tableHeading, th, .instructions, .productListing-data, .navSplitPagesResult, #checkoutSuccess { color:white } .center, .centeredContent { text-align:center } #trash, .hide { display:none } .smallText { font-size:smaller !important } .bigText { font-size:larger !important } .clearBoth { clear:both } form { margin:0; padding:0; } img { border:0; behavior:url("pngbehavior.htc"); } p { margin: 0 16px 1em 0; padding:0 } hr { color:white; background-color:white; height:1px; border:0; } h1 { font-size: 14px; font-weight:bold; margin-top:1em; } h2 { font-size: 12px; font-weight:bold; } h3 { font-size: 11px; font-weight:bold; } .alert { font-style:italic } .bordered { border: 1px solid white } .f_c1, a:hover, .messageStackError, #addressBookDefaultPrimary { color:rgb(213,1,51) } .f_c2, .messageStackSuccess, #addressBookDefaultHeading { color:rgb(0,115,204) } .f_c3, .important, .advisory, #cartSubTotal, legend { color:rgb(132,190,238) } .f_c4 { color:rgb(236,0,140) } .f_c5 { color:rgb(150,150,150) } .messageStackCaution, .messageStackWarning { color:yellow } .caption { color:rgb(127,194,239) } /* primary layout devices */ body { margin:16px 0 0 0; padding:0; text-align:center; } #mainWrapper { margin:0 auto; padding:0 0 5em 0; text-align:left; width:784px; position:relative; } .columnLeft, .back, .back a { float:left } .columnRight, .forward, .forward a { float:right } div.forward {width:200px} .forward a { margin-left:.5em } .leftBoxContainer { padding:0 6px 0 0 } .rightBoxContainer { border: 1px solid rgb(102,102,102); margin-bottom:1em; padding:0; } .sideBoxContent { padding:5px } #navColumnOne { width: 98px } #navColumnTwo { width: 174px; position:absolute;top:0; right:0 } #bigColumn { float:left; width:512px } #navColumnTwoWrapper { padding:15px 0 0 15px } .centerColumn { margin: 15px 0; padding:15px; border:1px solid white; } .centerColumn, .centerColumnShowroom { font-size:12px; line-height:14px; } .left50 { float:left; width:50%; } #bigColumn .centerColumn .left50 { width:248px; margin-bottom:2em; } #bigColumn .centerColumn p { margin-right:0 } #bigColumn .centerColumn .left50 p { margin-right:16px } .greybox { background:#141414; border-bottom:1px solid white; } .centerColumn .expandedBox { margin:-16px -16px 1em -16px } hr.expandedBox { margin-top:1em; margin-bottom:1em; } /* 1px border + 15 margin + 232 + 16 margin + 232 + 15 + 1 = 512px bigColumn */ /* wide body modifications */ .catWideBodyeg #mainWrapper { width:949px } .catWideBodyeg #bigColumn { width:677px } .catWideBodyeg #FliProductListing { width:660px; } .catWideBodyeg #bigColumn .centerColumn .left50 { width:51% } /* forms with fieldsets */ fieldset { color:white; border:0; margin:0; padding:0; font-size:12px; } fieldset legend { display:block; font-size:14px; font-weight:bold; margin:0; padding:12px 0 4px 0; } fieldset label { float:left; clear:left; width:128px; text-align:right; margin:.5em 0 1em 0; padding-right:4px; } fieldset .alert { font-size: 11px } fieldset label.checkboxLabel, fieldset label.radioButtonLabel { float:none; } fieldset input { border: 1px solid rgb(102,102,102); padding:2px; background:black; color:white; } fieldset input:focus { border-color: white } #accountNotifications input { float:left; clear:both; } #accountNotifications label { float:left; width:60%; clear:none; text-align:left; } /* main menu */ #mainMenu { position:absolute; left: 98px; top:0px;width:695px; z-index:1; } #mainMenu, #mainMenu li { margin:0; padding:0; list-style:none; } #mainMenu li { display:inline } #mainMenu a { float:left; padding: 0 0 0 7px; margin: 0 9px 0 0; color:black; background: rgb(196,196,196) url(../images/nav_bullet.gif) no-repeat; } #mainMenu a:hover, #mainMenu a:focus { background-position: 0px -7px; background-color:white; outline:none; } #mainMenu a:active { background-color: white } /* on state for main menu */ body.cat221eg #mainMenu li#parts a, /* parts and services */ body.cat155eg #mainMenu li#parts a, body.cat1eg #mainMenu li#parts a, body.cat2eg #mainMenu li#parts a, body.cat3eg #mainMenu li#parts a, body.ch2 #mainMenu li#dynotuning a, /* dyno tuning */ body.cat290eg #mainMenu li#showroom a, /* showroom */ body.cat238eg #mainMenu li#dynographs a, /* dyno graphs */ body.cat337eg #mainMenu li#articles a, /* articles */ body.ch1 #mainMenu li#policy a, /* policy */ body.ch5 #mainMenu li#contact a /* about */ { border-bottom:2px solid rgb(213,1,51); } /* main page */ div.centerColumn#indexDefault { padding:16px; border:0; } #indexDefault h1 { float:left; color:rgb(214,0,48); margin: 0 1em 0 0; font-size:14px; font-weight:100; } #indexDefault h3 { margin:0 } #newsPosts { width:786px; margin-top:2em; font-size:12px; line-height:14px; position:relative } #newsPosts .newsPost { width:178px; margin-right:12px; float:left; } .newsPost p.datestamp { font-size:9px; margin-top:1px; color:grey; } /* product listing module */ #FliProductListing { width:495px; } #FliProductListing .productListing-rowheading, #FliProductListing hr { display:none } #FliProductListing div.productListing-even, #FliProductListing div.productListing-odd { width:165px; float:left; padding:0; margin:0; overflow:hidden; } #FliProductListing div.c_wrap { margin:0 15px 15px 0; } #FliProductListing div.col0 { order:1px solid rgb(196,196,196); margin:0 0 2px 0;} #FliProductListing div.col0 img { width:150px; height:100px; } #FliProductListing h3.itemTitle { margin:0; padding:0; font-size:12px; height:16px; width:150px; overflow:hidden; } #FliProductListing h3.itemTitle a { display:block; line-height:14px; padding:2px; background:white; color:black; text-decoration:none; } #FliProductListing div.col2 { background:rgb(194,194,194); margin:2px 0 0 0; padding:1px 1px 2px 1px; } #FliProductListing div.col2 { text-align:right } #FliProductListing div.col2 a.browserDetails:hover, #FliProductListing div.col2 a.browserDetails:focus { background:rgb(213,1,51); outline:none; } #FliProductListing div.col2 a.browserDetails:active { background:white; outline:none; } #FliProductListing div.col2 a.browserConfigure, #FliProductListing div.col2 a.browserAddCart { background: white; } #FliProductListing div.col2 a.browserConfigure:hover, #FliProductListing div.col2 a.browserConfigure:focus, #FliProductListing div.col2 a.browserAddCart:hover, #FliProductListing div.col2 a.browserAddCart:focus { background:black; outline:none; } #FliProductListing div.col2 a.browserConfigure:active, #FliProductListing div.col2 a.browserAddCart:active { background:white } #productsListingListingBottomLinks { margin-right:15px } div.navNextPrevList { margin:3px 0 0 -1px; float:left; } div.navNextPrevList a { background:white; float:left; margin-right:3px; } div.navNextPrevList a:hover { background:rgb(214,0,48) } p.navNextPrevCounter { display:none } /* product info page */ body#productinfoBody div.expandedBox img { padding:1em 0 } .wrapperAttribsOptions select { font-size:12px; padding:1px; margin:0; border:1px solid red; background:black; color:white; max-width:480px; } .wrapperAttribsOptions input { clear:both } #productAttributes h3, #productAttributes h4 { color:white; margin:1em 0 2px 0; padding:0; } #span_1, #span_2, #span_3 { display:none } /* policy pages */ body.ch1 #ezPagesTOCHeading { display:none } body.ch1 #navEZPagesTOCWrapper { position:absolute; left:0; top:60px; width:92px; font-size:10px; } body.ch1 #navEZPagesTOCWrapper ul, body.ch1 #navEZPagesTOCWrapper ul li { margin:10px 0; padding:0; list-style:none; font-weight:bold; font-size:10px; } #ezPageDefault ul { color:white; background:black; } body.ch1 #navEZPagesTOCWrapper a { text-decoration:none; font-weight:normal; } /* dinosaur tuning */ #awdDynoPageBox h1 { font-size:18px; font-weight:bold; margin:0; padding:0; } #awdDynoPageBox p { margin-top:0; margin-bottom:1em; } .centerColumn #awdDynoPageBox .greybox { margin:3px; padding:34px; font-size:13px; } .centerColumn #awdDynoPageBox .lowerPart { margin:0; padding:20px 0px 20px 34px; width: 299px; float:left; } .centerColumn #awdDynoPageBox .lowerPart h2 { margin:0; font-size:11px } .centerColumn #awdDynoPageBox .lowerPart ul { padding:0 0 0 7px; margin-left:1.25em; margin-top:0; } .centerColumn #awdDynoPageBox .lowerPart ul.plain { list-style:none; margin:0; } .centerColumn #awdDynoPageBox .lowerPart ul.plain li {margin-bottom:1em} #awdDynoPageBox .dummyBox { width:156px; height:104px; margin:9px 9px 0px 9px; float:right; clear:right; } /* ezPageBigBox style (based on old dinosaur tuning page) */ #ezPageBigBox h1 { font-size:18px; font-weight:bold; margin-bottom:0; } #ezPageBigBox p { margin-top:0; margin-bottom:1em; } .centerColumn #ezPageBigBox .greybox { margin:1px; padding:15px; } xx.centerColumn #ezPageBigBox .lowerPart { margin:0; padding:15px; width: 299px; float:left; } xx.centerColumn #ezPageBigBox .lowerPart h2 { margin:0; font-size:11px } /* dinosaur tuning page specifics */ .centerColumn .awdDynoPageBox#ezPageBigBox .lowerPart { margin:0; padding:20px 0px 20px 34px; width: 299px; float:left; } .centerColumn .awdDynoPageBox#ezPageBigBox .lowerPart h2 { margin:0; font-size:11px } .centerColumn .awdDynoPageBox .lowerPart ul { padding:0 0 0 7px; margin-left:1.25em; margin-top:0; } .centerColumn .awdDynoPageBox .lowerPart ul.plain { list-style:none; margin:0; } .centerColumn .awdDynoPageBox .lowerPart ul.plain li {margin-bottom:1em} .awdDynoPageBox .dummyBox { width:156px; height:104px; margin:9px 9px 0px 9px; float:right; clear:right; } /* sidebox setup */ h3.rightBoxHeading { padding:4px; margin:0; border-bottom:1px solid rgb(102,102,102); } .rightBoxContainer { font-size:10px; } #search input, #loginbox input { width:100%; border:0; padding:0; margin:0 0 5px 0; background-color:rgb(45,45,45); color:white; font-size:10px; line-height:10px; } /* search sidebox */ div#search { text-align:right; } div#search div#searchContent { xxheight:32px } div#search h3 { display:none } div#search a { background:rgb(196,196,196); } div#search a:hover { background:white } /* login sidebox */ #loginbox { padding:0 } #loginbox h3 { margin:0; padding:10px 0 0 0; height:0px; background:url(../images/login_header.gif); } #loginbox label { margin:3px; display:block; text-align:right; } #loginbox h3 span { display:none; } #loginbox .submitWrapper { float:right; background:rgb(196,196,196); } #loginbox .submitWrapper input { margin:0; background:rgb(196,196,196); width:33px; height:7px; } #loginbox .submitWrapper input:hover { background:white } /* loggedin sidebox */ #loggedinbox { padding:0 } #loggedinbox .sideBoxContent { padding:3px } #loggedinbox h3 { margin:0; padding:10px 0 0 0; height:0px; background:url(../images/members_header.gif); } #loggedinbox h3 span { display:none; } .accountLinksWrapper p { margin:5px 0 5px 0 } .accountLinksWrapper ul { list-style:none; margin:0; padding:0; } .accountLinksWrapper ul li { margin:0 0 2px 0; padding:0; } .accountLinksWrapper ul li a { color:black; background:rgb(196,196,196); display:block; width:151px; } .accountLinksWrapper ul li a:focus, .accountLinksWrapper ul li a:hover { background:white; outline:none } .accountLinksWrapper ul li a:active { background:rgb(214,0,48); } /* shoppingcart sidebox */ div#shoppingcart { font-size:10px; line-height:15px; padding:0; } div#shoppingcart .sideBoxContent { padding:0 } #shoppingcart h3 { height:0px; background:url(../images/cart_header.gif); margin:0; padding:10px 0 0 0; } #shoppingcart h3 a { display:none } #shoppingcart ul { list-style:none; margin:2px 3px; padding:0; width:151px; overflow:hidden; } #shoppingcart li { color:white; height:15px; width:200px; overflow:hidden; padding:0; margin:0; position:relative; } #shoppingcart li .fadeOutAgain img { position:absolute; left:-4px; top:0px; height:15px; } #shoppingcart a { text-decoration:none } #shoppingcart a:active, #shoppingcart a:hover { text-decoration:underline; outline:none; } #shoppingcart div.cartBoxTotal { color:white; margin:3px; padding:12px 0 0 1px; border-top:1px solid white; background:url(../images/cart_total.gif) 0px 5px no-repeat; } /* button row should contain images that require a light bg */ div.buttonRow { margin: 3px } div.buttonRow input, div.buttonRow a { background:rgb(196,196,196); color:black; } div.buttonRow input:focus, div.buttonRow input:hover, div.buttonRow a:focus, div.buttonRow a:hover { background:white; outline:none; } div.buttonRow input:active, div.buttonRow a:active { background:rgb(214,0,48); } /* banner sideboxes */ #bannerboxallHeading, #bannerboxHeading { display:none } div.rightBoxContainer#bannerboxall { border:0 } div.sideBoxContent#bannerboxallContent { padding:0 } div#bannerboxallContent br { line-height:10px } /* category tree sidebox */ #logo { padding-bottom:11px } #categoriesHeading { display:none } .sideBoxContent#categBox { padding:0 } #categBox ul, #categBox li { margin:0; padding:0; list-style:none; } #categBox ul.level1 { margin-top: 2px; border-top:1px solid rgb(194,194,194); } #categBox ul.level2 { padding: 4px 0; border-bottom:1px solid rgb(194,194,194); } #categBox li.level0 { margin-bottom: 1em } #categBox a { display:block; text-decoration:none; font-size:11px; line-height:13px; color: rgb(194,194,194); margin:0; padding:0; } #categBox a.level0 { width: 92px; height:12px; color:black; background-color:rgb(194,194,194); background-position: 0px 12px; } #categBox a.level0 span, #categBox a.level1 span { display:none } #categBox a.level1 { width: 90px; height:10px; border:1px solid rgb(194,194,194); color:black; background-color:white; border-top:0; line-height:10px; } #categBox ul.level2 a { padding: 2px 1px 0px 3px; margin-bottom:1px; } #categBox a.level2 { font-weight:bold; color:white; } #categBox a.level4 { color:rgb(132,190,238) } /* category box hover states */ #categBox a:hover, #categBox a:focus { background-color:white; color:black; outline:none; } #categBox a.level0:hover, #categBox a.level0:focus { background-color: white } #categBox a.level1:hover, #categBox a.level1:focus { background-color: rgb(214,0,48) } /* active states */ #categBox a.level0:active { background-color: rgb(0,116,204) } #categBox a.level1:active { background-color: white } /* disable extra bottom border for last car model in each make's category (change this if the category sort order changes) */ #categBox #li_cat15eg ul.level2, #categBox #li_cat16eg ul.level2, #categBox #li_cat19eg ul.level2 { border-bottom:0 } /* image replacement urls for category menu */ a#a_subaru_1 { background-image: url(../images/category/category_subaru.gif) } a#a_nissan_2 { background-image: url(../images/category/category_nissan.gif) } a#a_mitsubishi_3 { background-image: url(../images/category/category_mitsubishi.gif) } a#a_93_97_impreza_1_10 { background-image: url(../images/subcategory/subcategory_impreza9397.gif) } a#a_98_01_impreza_1_11 { background-image: url(../images/subcategory/subcategory_impreza9801.gif) } a#a_rs_ts_impreza_1_12 { background-image: url(../images/subcategory/subcategory_imprezarsts.gif) } a#a_impreza_wrx_1_6 { background-image: url(../images/subcategory/subcategory_imprezawrx.gif) } a#a_impreza_sti_1_4 { background-image: url(../images/subcategory/subcategory_imprezasti.gif) } a#a_legacy_1_13 { background-image: url(../images/subcategory/subcategory_legacy.gif) } a#a_legacy_gt_1_14 { background-image: url(../images/subcategory/subcategory_legacygt.gif) } a#a_forester_xt_1_15 { background-image: url(../images/subcategory/subcategory_foresterxt.gif) } a#a_180sx_2_16 { background-image: url(../images/subcategory/subcategory_180sx.gif) } a#a_350z_2_17 { background-image: url(../images/subcategory/subcategory_350z.gif) } a#a_evo_8_9_3_18 { background-image: url(../images/subcategory/subcategory_evo89.gif) } a#a_evo_8_9_mr_3_19 { background-image: url(../images/subcategory/subcategory_evo89mr.gif) } #cartAdd { position:relative; text-align:right; background:white; color:black; line-height:16px; font-size:12px; font-weight:bold; height:15px; overflow:hidden; } #cartAdd dl { display:inline; list-style:none; margin:0; padding:0; } #cartAdd dt { position:absolute; top:0; left:0px; margin:0; padding: 0 0 0 2px; } #cartAdd dd { position:absolute; top:0; right:98px; margin:0; padding: 0 5px 0 5px; background:rgb(195,195,195); border:2px solid black; border-top:0; border-bottom:0; } #cartAdd input { border-top:1px solid rgb(0,116,204); border-bottom:1px solid rgb(0,116,204); } #cartAdd input:hover { background:black } #cartAdd input:active { background:white } /* showroom */ #flishowroominfoBody #bigColumn { width:426px; } #flishowroominfoBody .centerColumnShowroom { border:1px solid white; position:relative; margin-top:4px } #flishowroominfoBody .centerColumnShowroom .columnRight { position:absolute; top:0px; left:440px; width: 245px; } /* 98 + 426 + 15 + 245 = same 784px */ #flishowroominfoBody #productMainImage { border:1px solid white; border-bottom:0; margin-top:15px; } #flishowroominfoBody #productMainImage img { width:424px; height:283px; } #flishowroominfoBody hr { margin:0 } #flishowroominfoBody .centerColumnShowroom p { margin: 0 10px 1em 10px } #flishowroominfoBody .centerColumnShowroom .columnRight p { margin:1em 0 } #flishowroominfoBody #bigColumn .centerColumnShowroom .left50 { width:222px; margin-bottom:1em; } #flishowroominfoBody #bigColumn .centerColumnShowroom .left50 p { margin-right:20px } #flishowroominfoBody h1, #flishowroominfoBody h2, #flishowroominfoBody h3 { margin:2px 0 10px 0; padding:3px 7px; font-size:11px; } #flishowroominfoBody h1 { background:rgb(213,1,51); color:black; } #flishowroominfoBody h2 { background:rgb(0,115,204); color:black; } #flishowroominfoBody h3 { color:rgb(132,190,238); padding:5px 0;} #flishowroominfoBody h3 { padding:5px 0;} #showroomMenu { position:absolute; left:444px; top:-284px; width:255px } #showroomMenu ul { display:block; clear:both; list-style:none; margin:0; padding:0; } #showroomMenu ul li { list-style:none; margin:0; padding:0; display:inline; } #showroomMenu a { float:left; margin:0 16px 16px 0; padding:0; border:1px solid rgb(102,102,102); } #showroomMenu a img { width:64px; height:43px; } #showroomMenu img.numeral { display:none; } /* TODO */ /* hide details button on index page */ body.cat154eg#indexBody .col2, body.cat290eg#indexBody .col2 { display:none } /* hide dynographMenu list from cat154 (showroom proper) body.cat154eg#flishowroominfoBody #dynographMenu, body.cat290eg#flishowroominfoBody #dynographMenu { display:none } */ /* dyno graphs menu ... */ #flishowroominfoBody #dynographMenu { position:absolute; border:1px solid #666; top:15px; left:545px; width:227px; font-size:9px; } #dynographMenu h1 { color:black; background:rgb(213,1,51); margin:2px 0; } #dynographMenu ul { margin:0; padding:0; list-style:none; } #dynographMenu ul.level0 { margin:1px 1px 8px 1px } #dynographMenu ul li a { display:block; padding:2px 7px; margin:0 } #dynographMenu ul.level1 li.li_odd { background:#141414 } #dynographMenu ul.level1 li.li_even { background:#666 } #dynographMenu ul li.level1 a { color:white; text-decoration:none; } #dynographMenu ul li.level1 a:hover { color:white; text-decoration:underline; } /* visibility toggle */ #flishowroominfoBody #dynographMenu li ul { display:none } .cat282eg #dynographMenu li#li_cat282eg ul.level1, .cat288eg #dynographMenu li#li_cat288eg ul.level1, .cat281eg #dynographMenu li#li_cat281eg ul.level1, .cat283eg #dynographMenu li#li_cat283eg ul.level1, .cat284eg #dynographMenu li#li_cat284eg ul.level1, .cat285eg #dynographMenu li#li_cat285eg ul.level1, .cat286eg #dynographMenu li#li_cat286eg ul.level1, .cat287eg #dynographMenu li#li_cat287eg ul.level1 { display:block } /* image replacement */ #dynographMenu a.level0 { height:14px; width:150px; margin:2px 7px; background-repeat:no-repeat; background-position:0px 10px } #dynographMenu a.level0 span { display:none } #dynographMenu a#a_impreza_wrx_02_05_238_282 { background-image: url(../../../../images/clientcars/clienthead_wrx_0205.gif) } #dynographMenu a#a_impreza_wrx_06_238_288 { background-image: url(../../../../images/clientcars/clienthead_wrx_06.gif) } #dynographMenu a#a_impreza_sti_238_281 { background-image: url(../../../../images/clientcars/clienthead_sti.gif) } #dynographMenu a#a_forester_238_283 { background-image: url(../../../../images/clientcars/clienthead_forester.gif) } #dynographMenu a#a_350z_238_284 { background-image: url(../../../../images/clientcars/clienthead_350Z.gif) } #dynographMenu a#a_g35_238_285 { background-image: url(../../../../images/clientcars/clienthead_g35.gif) } #dynographMenu a#a_s13_238_286 { background-image: url(../../../../images/clientcars/clienthead_s13.gif) } #dynographMenu a#a_evo_238_287 { background-image: url(../../../../images/clientcars/clienthead_evo.gif) } /* articles menu ON state */ body.cat339eg li#li_cat339eg, body.cat338eg li#li_cat338eg { font-weight: bold } /* shopping_cart page */ .cartAttribsList ul { margin-top:0; padding-left:2em; } #cartSubTotal { margin-top:1em } #cartContentsDisplay tr.rowOdd { background:#222 } #cartContentsDisplay tr.rowEven { background:#333 } #cartContentsDisplay td { padding:4px; vertical-align:top; } #cartContentsDisplay td.cartQuantity input { width:20px; border:0; padding:0px; margin:0; background:#666; color:white; text-align:center; } #cartContentsDisplay td.cartRemoveItemDisplay { width:40px } #cartContentsDisplay a { font-weight:bold } /* popup boxes */ body#popupShippingEstimator, body#infoShoppingCart, body#popupSearchHelp { text-align:left; padding:1em; color:white; background:black; } body#popupShippingEstimator label { float:left; width:128px; padding-top:5px; } body#popupShippingEstimator #zoneLabel, body#popupShippingEstimator #stateZone, body#popupShippingEstimator #stateLabel, body#popupShippingEstimator #state { display:none } #addressBookDefault div.instructions { clear:left; padding-top:1em; } /* visibility control (in the auto-generated file) #categBox li ul { display: none } ... */ /* debug div { border: 1px dotted green } table, tr, td { border:1px dotted yellow } */