/** * Main CSS Stylesheet * * @package templateSystem * @copyright Copyright 2003-2007 Zen Cart Development Team * @copyright Portions Copyright 2003 osCommerce * @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0 * @version $Id: stylesheet.css 5550 2007-01-06 22:06:17Z drbyte $ */ /* global whitespace reset */ * {margin:0; padding:0} body {font: 62.5% verdana, arial, helvetica, sans-serif; color: #000000; background: #740000 url(../images/bg_body.jpg) repeat-x top} /* links */ a img {border: none; } a:link, #navEZPagesTOC ul li a {color: #333; text-decoration: none} a:visited {color: #f25f21; text-decoration: none} a:hover, #navSupp ul li a:hover {color: #f25f21} a:active {color: #f25f21} a.productImage {display:block} a.productTitle {color:#f25f21; font-size:120%; font-weight:bold; text-shadow: #666 1px 1px 1px; float:left; width:100%} a.productButton {float: left; margin-right:8px; height:18px} a.iphoneButton {float: left; margin-right:4px; height:18px; position: relative; top: -6px;} a.highlight {font-weight:bold} /* headings */ h1 {font-size: 1.5em; color: #f25f21} h2 {font-size: 1.4em} h3 {font-size: 1.3em} h4, h5, h6, LABEL, LEGEND, ADDRESS, .larger {font-size: 1.1em} h1, h2, h3, h4, h5, h6 {margin: 0.3em 0} h1, h2, h3, h4, h5, h6, p {position: relative} h2.centerBoxHeading {margin-bottom: 21px} h3.leftBoxHeading {display: none} h3.rightBoxHeading {margin-top:0} h4.optionName {display:none} h3#attribsOptionsText {display:none} h1#indexCategoriesHeading {color:#f25f21} .biggerText {font-size: 1.2em} .greetUser {font-weight:bold} .highlight {font-weight:bold} .centerColumn {height: 1%} em {color:#f25f21; font-style:normal; font-weight:bold} CODE {font-family: arial, verdana, helvetica, sans-serif; font-size: 1em} FORM, SELECT, INPUT {display: inline; font-size: 1em; margin: 0.1em} TEXTAREA {margin: auto; display: block; width: 95%} FIELDSET {padding: 0.5em; margin: 0.5em 0em; border: 1px solid #cccccc} LEGEND {font-weight: bold; padding: 0.3em} input:focus, select:focus, textarea:focus {background: #fde1d5} .centerBoxContents, .specialsListBoxContents, .centerBoxContentsAlsoPurch, .attribImg {float: left} .categoryListBoxContents {width: 180px; height:38px; float:left; margin:1px; background:url(../images/nav_btn.jpg) no-repeat; margin-right:5px} .categoryListBoxContents a {display:block; padding: 3px 0 0 10px; width: 170px; height:38px; text-align:left; font-weight:bold; font-size:110%} .categoryListBoxContents a, .categoryListBoxContents a:visited {color:white} .categoryListBoxContents a:hover {background:url(../images/nav_btn_over.jpg) no-repeat; color:white} .categoryListBoxContents a img {vertical-align:middle; margin-right:20px} LABEL {line-height: 1.5em; padding: 0.2em} LABEL.checkboxLabel, LABEL.radioButtonLabel {margin: 0.5em 0.3em} LABEL.inputLabel {width: 9em; float: left} LABEL.inputLabelPayment {width: 14em; float: left; padding-left: 2.5em} LABEL.selectLabel, LABEL.switchedLabel, LABEL.uploadsLabel {width: 11em; float: left} LABEL#textAreaReviews {font-weight: normal; margin: 1em 0em} #checkoutPayment LABEL.radioButtonLabel {font-weight: bold} ADDRESS {padding: 0.5em; font-style: normal} p {margin: 0px 0px 5px 0px} .clearBoth {clear: both} HR {height: 1px; margin-top: 0.5em; border: none; border-bottom: 1px solid #9a9a9a} /*warnings, errors, messages*/ .messageStackWarning, .messageStackError, .messageStackSuccess, .messageStackCaution {line-height: 1.8em; padding: 0.2em; border: 1px solid #9a9a9a} .messageStackWarning, .messageStackError {background-color: #ff0000; color: #ffffff} .messageStackSuccess {background-color: #99FF99; color: #000000} .messageStackCaution {background-color: #FFFF66; color: #000000} /*------------- Wrappers - page or section container ------------------ s*/ #mainWrapper {text-align: left; margin: 0 auto} #centeredWrapper {width: 984px; margin: 0 auto} #navColumnOne, #navColumnOneWrapper, .sideboxContent {width: 185px} #navColumnTwo, #navColumnTwoWrapper {width: 211px} #middleColumn {width: 560px; padding:0 8px} #navColumnOne, #middleColumn, #navColumnTwo {float:left} #navColumnTwoWrapper {background: url(../images/bg_rightcolumn_grade.jpg) repeat-x} #mainWrapper, #navColumnOne, #navColumnTwo {vertical-align: top} /*------------- end of Wrappers - page or section container ------------------ s*/ #sendSpendWrapper {border: 1px solid #cacaca; float: right; margin: 0em 0em 1em 1em} .floatingBox, #sendSpendWrapper, #checkoutShipto, #checkoutBillto, #navEZPagesTOCWrapper {width: 47%} .wrapperAttribsOptions {margin: 0.3em 0em} /*navigation*/ .navNextPrevCounter {margin: 0em; font-size: 0.9em} .navNextPrevList {display: inline; white-space: nowrap; padding: 0.5em 0em; list-style-type: none} #footerWrapper {padding-top:46px; background: url(../images/bg_footer_new.gif) no-repeat} #footerContent {margin-bottom:10px; text-align:center; color: white} #footerContent a {color: white} #navSupp ul {padding: 0.5em 0em; list-style-type: none; text-align: center; line-height: 1.5em} #navSupp ul li {display: inline} #navSupp ul li a {text-decoration: none; padding: 0em 0.5em; white-space: nowrap; color: white; text-decoration:underline} #navCategoryIcon, .buttonRow {margin: 0.5em} #indexProductListCatDescription, #categoryDescription {margin: 0.5em 0} #navBreadCrumb {background: url(../images/bg_header.gif) no-repeat; height: 17px; width: 515px; padding: 8px 0 8px 45px; font-weight: normal; font-size: 1.1em} #navBreadCrumb a, #navBreadCrumb a:visited {color: #333} #navBreadCrumb a:hover, #navBreadCrumb a:active {color: #f25f21} /*The main content classes*/ #contentColumnMain, .centerBoxContents, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew, .alert {vertical-align: top} #productDescription, .shippingEstimatorWrapper {padding: 0.5em} .alert {color: #FF0000; margin-left: 0.5em} .important {font-weight: bold} .gvBal {float: right} #bannerOne, #bannerTwo, #bannerThree, #bannerFour, #bannerFive, #bannerSix {padding: 0.8em} .smallText, #siteinfoLegal, #siteinfoCredits, #siteinfoStatus, #siteinfoIP {font-size: 0.9em} /*Shopping Cart Display*/ .tableHeading TH {border-bottom: 1px solid #9a9a9a} .tableHeading, #cartSubTotal {background-color: #e9e9e9} .tableRow, .tableHeading, #cartSubTotal {height: 2.2em} #cartSubTotal {border-top: 1px solid #cccccc; font-weight: bold; text-align: right; line-height: 2.2em; padding-right: 2.5em} .cartProductDisplay, .cartUnitDisplay, .cartTotalDisplay, .cartRemoveItemDisplay, .cartQuantityUpdate, .cartQuantity, #cartInstructionsDisplay, .cartTotalsDisplay {padding: 0.5em 0} .cartUnitDisplay, .cartTotalDisplay {text-align: right; padding-right: 0.2em} #scUpdateQuantity {width: 2em} .cartQuantity {width: 4.7em} .cartNewItem {color: #33CC33; position: relative; /*do not remove-fixes stupid IEbug*/} .cartOldItem {color: #660099; position: relative; /*do not remove-fixes stupid IEbug*/} .cartBoxTotal {text-align: right; font-weight: bold} .cartRemoveItemDisplay {width: 3.5em} .cartAttribsList {margin-left: 1em} td.cartProductDisplay br {display:none} td.cartProductDisplay ul {display:block; list-style:none;} #cartProdTitle {font-size:120%; margin:6px 0} /* Order Info */ ul#orderAttribsList li {list-style:none} .tDate {text-align:center;} .tOrderNumber {text-align:center;} .tAddress {text-align:left;} .tStatus {text-align:center;} .tTotal {text-align:center;} .tView {text-align:center;} #mediaManager {width: 50%; margin: 0.2em; padding: 0.5em; background-color: #E4FEf5; border: 1px solid #003D00} .normalprice, .productSpecialPriceSale {text-decoration: line-through} .productSpecialPrice, .productSalePrice, .productSpecialPriceSale, .productPriceDiscount {color: #ff0000} .productSpecialPrice br, .productSalePrice br, .productSpecialPriceSale br, .productPriceDiscount br {line-height:0} .orderHistList {margin: 1em; padding: 0.2em 0em; list-style-type: none} #cartBoxListWrapper ul, #ezPageBoxList ul {list-style-type: none} #cartBoxListWrapper li, #ezPageBoxList li, .cartBoxTotal {padding: 0.2em 0em} #cartBoxEmpty, #cartBoxVoucherBalance {font-weight: bold} .totalBox {width: 5.5em; text-align: right; padding: 0.2em} .lineTitle, .amount {text-align: right; padding: 0.2em} .amount {width: 5.5em} /*Image Display*/ #reviewsInfoDefaultProductImage, #productReviewsDefaultProductImage, #reviewWriteMainImage {margin: 0em 1em 1em 0em} #cartImage {margin: 0.5em 1em} /*Attributes*/ .attribImg {width: 20%; margin: 0.3em 0em} /*list box contents*/ .centerBoxContents, .specialsListBoxContents, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew {margin: 1em 0em} /* Currency / Prices */ .currencyDisplay {display: inline} .currencyDisplayGBP, .currencyDisplayEUR, .currencyDisplayUSD {float:left; border-left: 1px solid black; padding: 0 4px; margin: 2px 0} .currencyDisplayGBP {border-left:none; padding-left:0} /* Centre Boxes */ .centerBoxWrapper {height:1%} .centerBoxHeading {background: url(../images/bg_header.gif) no-repeat; height: 17px; width: 515px; padding: 8px 0 8px 45px; font-weight: bold; color: black} #featuredProducts {background: url(../images/bg_featurebox.gif) 0 45px no-repeat; width:560px} #featuredProducts .centerBoxHeading {padding-left: 8px; width: 552px} #featuredProducts .centerBoxHeadingIcon {margin-right: 20px; vertical-align:top} #viewAllButton {position: absolute; right:5px; top:5px} .centerBoxContentsFeatured {width:186px; height:271px; position:relative} .featuredProductDetails {display:block; width:145px; text-align:left; line-height:1.5em; position:absolute; bottom:0; left:25px} #scrollingFeaturedProducts {background: url(../images/bg_featurebox.gif) no-repeat; width:560px; height:308px} #jssButtonBar {width:560px; background: url(../images/bg_featured_footer.gif) no-repeat; height:31px; text-align:center; margin-top:20px} #jssButtonBar img {padding-top: 2px} #specialsRow {position:relative; height:308px; width:100%} .specialsListBoxContents {position:absolute; height:294px; width:152px; padding:17px 17px 0 17px; background:url(../images/featurebox_bg.gif) no-repeat; vertical-align:bottom} .specialsListBoxContents a {float:left; width:150px; font-size:1.1em; font-weight:bold; color:#f25f21} .specialsListBoxContents a:visited {color:#f25f21} .specialsListBoxContents a img {width:140px; height:206px} a.cartButton {width:19px; margin-right:5px} a.moreInfoButton {width:65px} .specialsListBoxContents a.cartButton img {height:19px; width:19px} .specialsListBoxContents a.moreInfoButton img {height:19px; width:65px} .specialsListBoxContents br {line-height:0} #specialsDefault h2.centerBoxHeading, #whatsNew h2.centerBoxHeading {margin-bottom:0} .centerBoxContentsSpecials, .centerBoxContentsNew {width:186px; height:308px; position:relative; background:url(../images/featurebox_bg.gif) no-repeat} .specialProductDetails, .newProductDetails {display:block; width:150px; text-align:left; line-height:1.5em; position:absolute; bottom:20px; left:20px} .centerBoxContentsSpecials a.productImage, .centerBoxContentsNew a.productImage {position: absolute; top:20px; left:20px} /* product listings */ .productListing {width:270px; height:80px; margin:5px 2px 0 0; padding-top:5px; border: 4px solid #aeaeae; background: white url(../images/bg_listing_hgrad.gif) repeat-y} a.productListingImage {float:left; padding:5px 5px 0 5px} .productListingInfo {width:200px; float:left; padding-left:15px} /* product info */ #productGeneral {background: url(../images/bg_product_info_top.gif) no-repeat center 10px} #productInfoUpperSection {position: relative; height:277px} #productInfoUpperSection h1 {color: #f25f21; font-weight:bold} #productMainImage {position:absolute; top: 40px; left: 40px} #productInfoSummary {position:absolute; top:27px; left:215px; width:315px; height:125px; padding-left:10px; background: white url(../images/bg_product_info_title.gif) bottom repeat-x} #productInfoCart {position:absolute; top:150px; left:215px; width:315px; height:26px; padding:5px 0 0 10px; background: white url(../images/bg_header.gif) top center no-repeat} #productInfoCart a {margin-left:5px} #productAdditionalImages {position:absolute; top:180px; left:215px; width:315px; height:78px; padding-left:10px; background-color: white; overflow:hidden} .additionalImages {float:left; margin:3px 5px 0 0} #productInfoTabs {margin-left:10px; height:18px} .button {float:left; cursor:pointer; font-family: Verdana, Arial, sans-serif; font-size:11px; font-weight:bold; color:black; position:relative} #productInfoLowerSection {padding:15px 25px 25px 25px; width:510px; background: url(../images/bg_product_info_lower.gif) bottom center no-repeat} #productInfoLowerSection ul {list-style:none; margin-top:3px} #productInfoLowerSection ul li {padding-left:15px; background: url(../images/bullet_non_link.gif) no-repeat 3px} #Overview, #Requirements, #Features, #Downloads {} #overviewLeft {float:left; padding-right:15px; width:330px; border-right: 2px solid #ccc} #overviewRight {float:left; padding-left:12px; width:148px} #overviewRight dt {font-weight:bold; padding-bottom:3px} #overviewRight dd {margin-bottom:10px} #overviewRight dd img {padding-right:1px} #dlTimeBox {padding:10px 20px; width:515px; height:55px; margin-bottom:10px; background-color:#ddd; border:3px dotted #aaa} .dl-link a {margin-right:1px; cursor:pointer; font-weight:bold; position:relative; font-family: Verdana, Arial, sans-serif; font-size: 12px} /*sideboxes*/ .leftBoxContainer {padding: 0px 0px 8px 8px; width:100%} .leftBoxContainer a:visited {color:#333} .leftBoxContainer a:hover {color:#f25f21} .sideBoxContent { font-size: 1.0em} .rightBoxContainer {background: url(../images/rightcolumn_left_border.gif) no-repeat top left} .rightBoxHeading, .rightBoxHeading a {font-weight: bold; width:203px; font-size: 1.1em; color: black; padding: 8px 0 6px 0; height: 25px;} .rightBoxHeading a:visited, .centerBoxHeading a:visited {color: #000000} /* Product Summary Layout for sideboxes */ #whatsnew .sideboxHeadingWrapper, #bestseller .sideboxHeadingWrapper {background: url(../images/rightcolumn_header_left.jpg) no-repeat top left; padding-left:8px} #whatsnew .rightBoxHeading, #bestseller .rightBoxHeading {background: url(../images/rightcolumn_header_right.jpg) no-repeat top right} .whatsNewProductDetails, .bestsellerProductDetails {line-height: 1.5em; text-align:left; width:190px; padding:10px 0 0 8px; margin-bottom:10px} .otherProduct {background: url(../images/rightcolumn_divider.gif) no-repeat 8px top } /* News Scrolling Heading image overrides */ #newsscroller .sideboxHeadingWrapper {background: url(../images/news_scroller_header_left.gif) no-repeat top left; padding-left:8px} #newsscroller .rightBoxHeading {background: url(../images/news_scroller_header_right.gif) no-repeat top right; color: white} #newsscroller .rightBoxHeading a, #newsscroller .rightBoxHeading a:hover, #newsscroller .rightBoxHeading a:visited {color: white} /* banner sidebox image overrides */ #bannerbox .sideboxHeadingWrapper {background: url(../images/news_scroller_header_left.gif) no-repeat top left; padding-left:8px} #bannerbox .rightBoxHeading {background: url(../images/news_scroller_header_right.gif) no-repeat top right; color: white} #bannerbox .rightBoxHeading a, #bannerbox .rightBoxHeading a:hover, #bannerbox .rightBoxHeading a:visited {color: white} /* #bannerboxHeading {background-color: #0000CC} */ .centeredContent, TH, #cartEmptyText, #cartBoxGVButton, #cartBoxEmpty, #cartBoxVoucherBalance, #navCatTabsWrapper, #navEZPageNextPrev, #bannerOne, #bannerTwo, #bannerThree, #bannerFour, #bannerFive, #bannerSix, #siteinfoLegal, #siteinfoCredits, #siteinfoStatus, #siteinfoIP, .center, .cartRemoveItemDisplay, .cartQuantityUpdate, .cartQuantity, .cartTotalsDisplay, #cartBoxGVBalance, .leftBoxHeading, .productListing-data, .accountQuantityDisplay, .ratingRow, LABEL#textAreaReviews, #productMainImage, #reviewsInfoDefaultProductImage, #productReviewsDefaultProductImage, #reviewWriteMainImage, .centerBoxContents, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew, .gvBal, .attribImg {text-align: center} /* News Scroller */ .articleSummary {margin-bottom: 1em} .articleSummary a {color:#f25f21} .articleHeading a {font-size:1.1em; font-weight:bold} h1.newsHeader { color: #f25f21; display: none; } .newsHeadlineText { font-size: 1.1em;} p.articleHeading, span.articleHeading {color: #f25f21; font-size: 1.2em; padding-top: 1.3em; font-weight: bold;} p.articleText a {font-style: italic; } .author {color: #333; font-style: italic;} #newsArticlePage {font-size: 1.1em;} ul.articleLinkList, ul.archiveLinkList {padding: 1.2em 0;} li.articleProductLink {color: #f25f21; padding-left: 2em;} ul.archiveLinkList li, ul.articleLinkList li { list-style: none; color: #f25f21; padding-left: 2em;} ul.articleLinkList li a, ul.archiveLinkList li a {color: #f25f21;} .clearSplit {display: none;} #upProductsHeading {text-align: left} #upDateHeading {text-align: right} /* Login & Greeting */ #greeting {padding-top:20px; padding-bottom: 0.8em; width:158px; clear: both} #loginboxContent input.inputBox {width:145px} #loginBoxList {width:140px; margin-top:1em; padding-top:1em; list-style-type: none; background: url(../images/rightcolumn_divider.gif) no-repeat top center; clear: both} .loginBoxLinks {background: url(../images/bullet_link.gif) no-repeat 0 .4em; padding-left:1em; line-height:2em} #loginButton {display:block} /* My Account */ ul#myAccountGen {list-style: none} ul#myAccountGen li {background: url(../images/bullet_link.gif) no-repeat 0 1em; padding:0.5em 1em; line-height:1.5em; display:block} ul#myAccountGen li a {color:#333} ul#myAccountGen li a:hover {color:#f25f21} ul#myAccountNotify {list-style: none} ul#myAccountNotify li {background: url(../images/bullet_link.gif) no-repeat 0 1em; padding:0.5em 1em; line-height:1.5em; display:block} ul#myAccountNotify li a {color:#333} ul#myAccountNotify li a:hover {color:#f25f21} /*misc*/ .back {float: left} .forward, #shoppingCartDefault #PPECbutton {float: right} .bold {font-weight: bold} .rowOdd {background-color: #E8E8E8; height: 1.5em; vertical-align: top} .rowEven {background-color: #F0F0F0; height: 1.5em; vertical-align: top} .hiddenField {display: none} .visibleField {display: inline} .accountTotalDisplay, .accountTaxDisplay {width: 20%; text-align: right} .accountQuantityDisplay {width: 10%; vertical-align: top} TR.tableHeading {background-color: #cacaca; height: 2em} .productListing-rowheading {background: #abbbd3 url(../images/tile_back.gif); height: 2em; color: #FFFFFF} /* Sitemap */ #siteMapList {float: left; line-height:2em; padding:2em 0 2em 20px} #siteMapList a, #siteMapList a:visited {color:black} #siteMapList a:hover {color:#f25f21} #siteMapList ul {list-style:none} #siteMapList ul li ul li {padding-left:15px; background: url(../images/bullet_link.gif) no-repeat 3px} .ratingRow {margin: 1em 0em 1.5em 0em} #popupShippingEstimator, #popupSearchHelp, #popupImage, #popupCVVHelp, #popupCouponHelp, #popupAtrribsQuantityPricesHelp, #infoShoppingCart {background-color: #ffffff} #popupAdditionalImage a {float:left} #popupAdditionalImage a.popupButton img {padding: 160px 5px} #shoppingcartBody #shippingEstimatorContent {clear: both} #mainbox {background: #FBFBFB url(../images/bg_mainbox.jpg) repeat-x top; border-right: 1px solid #3D3D3D} #contentWrapper {background: url(../images/bg_leftside.jpg) no-repeat left top; width: 984px} /* nav menu in left column */ #nav ul {width:178px; background: url(../images/bg_mainbox.jpg) repeat-x; list-style:none} #nav ul li {float:left; width:178px; height:39px; } #nav ul li a {position:relative; display:block; width:128px; height:31px; background: url(../images/nav_btn.jpg) no-repeat; padding:8px 0 0 50px; color:white; text-decoration:none; font-weight:700; font-size:120%} #nav ul li a:hover {background: url(../images/nav_btn_over.jpg) no-repeat; text-decoration:none} #nav ul li a img {position:absolute; top:8px; left:8px; border:none} #flvplayer {height: 315px; width: 560px; padding-bottom: 15px} #middle_header { background-image: url(../images/bg_header.gif); background-repeat: no-repeat; height: 31px; width: 544px; padding: 8px 8px; font-weight: bold; } /* ------------------ beginning of header styles -------------------------*/ /* logo ID has been applied directly to image, i.e. no wrapping div */ #logo {float:left; margin-top:18px} /* search and cart tabs have an outer (tab) div and an inner (navMain) div */ /* Outer divs are floated for alignment and Inner are relative for positioning of contents if needed */ #searchtab, #tabDivider, #carttab {float:right; margin: 52px 0 0} #searchtab {width:18em; background: #aaa url(../images/bg_searchtab.jpg) repeat-x} #searchtab input.input_box {width:120px} #searchtab input.submit {vertical-align:middle} #carttab {width:33.5em; background: #fff url(../images/bg_carttab.jpg) repeat-x} #navMainSearch, #navMainCartSummary {position:relative} #navMainSearch {height:32px; background: url(../images/searchtab_right.jpg) no-repeat top right; padding:8px 15px 0 0} #navMainCartSummary {height:28px; background: url(../images/carttab_left.jpg) no-repeat top left; padding:12px 0 0 30px} #navMainCartSummary img {vertical-align:middle; margin-right: .5em} /* ------------------ end of header styles -------------------------*/ .iphone_button { left:225px; position:absolute; top:105px; }