/* Brooklyn Brewery - MAIN CSS (main.css) COPYRIGHT 2009 Brooklyn Brewery. All Rights Reserved. Design & Code by Alpha Multimedia - http://www.alpha-multimedia.com/ Author: Chris King */ /* COLOR PALLETTE ============================================================================ Green - #009b68 Text - #666 Links - #e67108 ===========================================================================*/ /* GLOBAL RESET ---------------------------------------------------------------------------*/ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent;} body {line-height: 1;} ul, ol {list-style: none;} blockquote, q {quotes: none;} /* remember to define focus styles! */ :focus {outline: 0;} /* remember to highlight inserts somehow! */ ins {text-decoration: none;} del {text-decoration: line-through;} /* tables still need 'cellspacing="0"' in the markup */ table {border-collapse: collapse; border-spacing: 0;} /* GENERAL SELCTORS ---------------------------------------------------------------------------*/ html {height: 100%;} body {height: 100%; font: 12px Georgia, Times, serif; color: #000; background-color: #fff;} #black {color: #fff; background-color: #000;} #blue {background: #68CEF6;} p {line-height: 1.5em;} #black p {margin: 0 0 20px 0;} /* HEADINGS */ #privacy {display: block; margin: 0 auto 30px auto; width: 382px; height: 32px; background: url(../images/privacy-heading.png) 0 0 no-repeat;} #terms {display: block; margin: 0 auto 30px auto; width: 487px; height: 32px; background: url(../images/terms-heading.png) 0 0 no-repeat;} #jobs {display: block; margin: 0 auto 30px auto; width: 487px; height: 32px; background: url(../images/jobs-heading.png) 0 0 no-repeat;} #contact {display: block; margin: 0 auto 30px auto; width: 286px; height: 32px; background: url(../images/contact-heading.png) 0 0 no-repeat;} h2 {margin: 0 0 10px 0; font-size: 20px; font-family: Futura, arial, helvetica, sans-serif; font-weight: bold; color: #009b68; text-transform: uppercase;} #black h2 {margin: 0 0 10px 0; font: 12px Georgia, Times, serif; color: #fff; text-transform: none; font-weight: bold;} h3 {margin: 0 0 10px 0; font-family: Futura, arial, helvetica, sans-serif; font-size: 12px; font-weight: bold; color: #000; text-transform: uppercase;} h4 {margin: 0 0 10px 0; font-family: Futura, arial, helvetica, sans-serif; font-size: 12px; font-weight: bold; color: #999; text-transform: uppercase;} /* LINKS */ a:link {color: #009b68; text-decoration: underline;} #black a:link {color: #dfb900; text-decoration: underline;} a:visited {color: #009b68; text-decoration: underline;} a:hover {color: #666; text-decoration: none;} #black a:hover {color: #666; text-decoration: none;} a:active {color: #009b68; text-decoration: underline;} /* BLOCKQUOTE */ blockquote {margin: 10px 0 20px 10px; padding: 0 0 0 10px; border-left: 3px solid #dcf1ff; font-style: italic; color: #0071b9; line-height: 1.5em;} /* UNORDERED LIST */ ul {margin: 10px 0;} ul li {list-style-type: none; padding: 0 0 5px 15px; background: url(../images/arrow.png) 0 2px no-repeat;} /* ORDERED LIST */ ol {margin: 10px 0 10px 15px;} ol li {padding: 0 0 5px 0;} /* HORIZONTAL RULE */ hr {margin: 40px 0; border-top: 3px solid #dcf1ff; border-right: none; border-bottom: none; border-left: none; height: 3px;} /* LAYOUT ---------------------------------------------------------------------------*/ /* MAIN WRAP */ #mainWrap {margin: 0 auto; padding: 0 20px; width: 920px; min-height: 100%; height: auto; background: url(../images/main-bg-white.png) 0 0 repeat-y;} #black #mainWrap {margin: 0 auto; padding: 0 20px; width: 920px; min-height: 100%; height: auto; background: url(../images/main-bg-black.png) 0 0 repeat-y;} #blue #mainWrap {background: url(../images/main-bg-blue.png) 0 0 repeat-y;} /* HEADER */ #header {margin: 0 0 20px 0; width: 920px; height: 190px; background: url(../images/header.png) 0 0 no-repeat;} #black #header {margin: 0 0 20px 0; width: 920px; height: 190px; background: url(../images/black-header.png) 0 0 no-repeat;} /* PAGE HEADING */ #pageHeading {margin: 0 auto 20px auto; padding: 10px 50px; width: 780px; background: #e8e8e8; -webkit-border-radius: 10px; -moz-border-radius: 10px;} /* BREADCRUMB NAVIGATION */ #breadcrumb span {padding: 5px 20px 5px 0; margin: 0 6px 0 0; font-family: Futura, arial, helvetica, sans-serif; font-size: 12px; font-weight: bold; color: #999; text-transform: uppercase; background: url(../images/breadcrumb-arrow.gif) 100% 0 no-repeat;} #breadcrumb span.current {padding: 5px 20px 5px 0; font-family: Futura, arial, helvetica, sans-serif; font-size: 12px; font-weight: bold; color: #009b68; text-transform: uppercase; background: url(../images/breadcrumb-arrow-current.gif) 100% 0 no-repeat;} #breadcrumb span.last {padding: 5px 0; margin: 0; font-family: Futura, arial, helvetica, sans-serif; font-size: 12px; font-weight: bold; color: #999; text-transform: uppercase; background: none;} /* CONTENT */ #content {margin: 0 auto; width: 780px;} /*#black #content {margin: 0 auto; width: 520px; margin-top:15px;}*/ #black #page-left{ float: left; width: 500px; } #black #page-right{ float: left; width: 280px; } /* STORE ---------------------------------------------------------------------------*/ /* COLUMN 1 (STORE FRONT) */ #threeColLayout #column1 {float: left; width: 220px;} #threeColLayout #column1 select {margin: 0 0 20px 0;} #threeColLayout #column1 .thumb {float: left; margin: 0 10px 10px 0; border: 1px solid #ccc;} #threeColLayout #column1 .thumb:hover {border: 1px solid #666;} /* COLUMN 2 (STORE FRONT) */ #threeColLayout #column2 {float: left; margin: 0 20px; padding: 0 25px; width: 250px; text-align: center;} #threeColLayout #column2 .large {border: 1px solid #ccc;} #threeColLayout #column2 .description {margin: 10px 0 0 10px; text-align: left;} #threeColLayout #column2 .price {margin: 10px 0 0 10px; font-size: 14px; font-weight: bold; color: #999; text-align: left;} /* QUANTITY FORM */ #quantity {margin: 0 0 20px 10px;} #quantity legend {display: none;} #quantity label {clear: left; float: left; width: 60px; margin: 10px 20px 0 0; text-align: right; font-family: Futura, arial, helvetica, sans-serif; font-size: 12px; font-weight: bold; color: #009b68; text-transform: uppercase;} #quantity select {float: left; margin: 5px 0 0 0;} #quantity input.add {float: left; margin: 0 5px 0 20px; width: 69px; height: 27px; cursor: pointer; border: none; background: url(../images/add-btn.png) 0 0 no-repeat;} /* COLUMN 3 (STORE FRONT) */ #threeColLayout #column3 {float: left; width: 220px;} #threeColLayout #column3 select {clear: both; margin: 0 0 20px 0;} /* CATERGORIES LISTS */ #threeColLayout #column3 ul {float: left; margin: 0; list-style-type: none;} #threeColLayout #column3 ul li {margin: 0 10px 5px 0; padding: 0;} /* CART BOX */ #threeColLayout #column3 #cartBox {clear: both; padding: 10px; width: 200px; background-color: #e8e8e8; -webkit-border-radius: 10px; -moz-border-radius: 10px; text-align: center;} #threeColLayout #column3 #cartBox h3 {margin: 0;} #threeColLayout #column3 #cartBox .status {margin: 0 0 5px 0;} /* ADD ITEMS BUTTON */ #threeColLayout #column3 .addItemsBtn {margin: 0 auto; width: 80px; height: 20px;} #threeColLayout #column3 .addItemsBtn a {display: block; width: 80px; height: 20px; background: url(../images/add-items-btn.png) 0 0 no-repeat;} /* CART BOX (FULL) */ #threeColLayout #column3 #cartBox #cartItemsHeading {margin: 0 0 10px 0; width: 185px;} #threeColLayout #column3 #cartBox #cartItemsHeading .item {float: left; margin: 0 88px 0 0; font-weight: bold;} #threeColLayout #column3 #cartBox #cartItemsHeading .qty {float: left; margin: 0 10px 0 0; font-weight: bold;} #threeColLayout #column3 #cartBox #cartItemsHeading .price {float: right; margin: 0; font-weight: bold;} #threeColLayout #column3 #cartBox #cartItems {width: 200px;} #threeColLayout #column3 #cartBox #cartItems .item {float: left; margin: 0 0 0 0; width: 120px; text-align: left;} #threeColLayout #column3 #cartBox #cartItems .qty {float: left; margin: 0 15px 0 0; width: 15px; text-align: center;} #threeColLayout #column3 #cartBox #cartItems .price {float: left; margin: 0; text-align: right;} #threeColLayout #column3 #cartBox #cartItems .remove a {float: right; margin: 0; text-decoration: none;} #threeColLayout #column3 #cartBox #cartItems .remove a:hover {color: #000;} /* CHECKOUT BUTTON */ #threeColLayout #column3 .checkoutBtn {clear: both; margin: 10px auto 0 auto; width: 80px; height: 20px;} #threeColLayout #column3 .checkoutBtn a {display: block; width: 80px; height: 20px; background: url(../images/checkout-btn.png) 0 0 no-repeat;} /* COLUMN 1 (USER INFO) */ #twoColLayout #column1 {float: left; margin: 0 20px 0 0; padding: 0 20px 0 0; border-right: 1px solid #ccc; width: 259px;} #twoColLayout #column1 select {margin: 0 0 20px 0;} /* NARROW FORM */ .narrowForm {margin: 0 0 20px 0; width: 259px;} #twoColLayout #column2 .narrowForm {margin: 0 0 20px 0; width: 319px;} .narrowForm legend {display: none;} .narrowForm label {clear: left; float: left; width: 70px; margin: 8px 10px 0 0; text-align: right; font-size: 12px; font-weight: bold; color: #000;} #twoColLayout #column2 .narrowForm label {clear: left; float: left; width: 120px; margin: 8px 10px 0 0; text-align: right; font-size: 12px; font-weight: bold; color: #000;} #twoColLayout #column2 .narrowForm label.right {clear: none; float: left; margin: 0 0 0 10px; width: 150px; text-align: left;} .narrowForm input {float: left; margin: 2px 0 5px 0; padding: 3px; width: 165px; height: 18px; font-family: Georgia, Times, serif; font-size: 14px; color: #2d3133; border: 1px solid #999; background: #fff;} .narrowForm select {float: left; margin: 5px 0 5px 0;} .narrowForm input.phone {float: left; margin: 2px 5px 5px 0; padding: 3px; width: 25px; height: 18px; font-family: Georgia, Times, serif; font-size: 14px; color: #2d3133; border: 1px solid #999; background: #fff;} #twoColLayout #column2 .narrowForm input.checkbox {float: left; margin: 2px 0 5px 130px; padding: 6px; width: 12px; height: 12px; font-family: Georgia, Times, serif; font-size: 14px; color: #2d3133; border: 1px solid #999; background: #fff;} .narrowForm input:hover {border: 1px solid #888;} .narrowForm input.help:hover {border: 1px solid #46afc5;} .narrowForm input.login {float: right; margin: 5px 5px 0 0; border: none; width: 80px; height: 20px; background: url(../images/login-btn.png) 0 0 no-repeat; cursor: pointer;} .narrowForm input.contCheckBtn {float: left; margin: 10px 0 0 0; border: none; width: 142px; height: 20px; background: url(../images/cont-check-btn.png) 0 0 no-repeat; cursor: pointer;} .narrowForm input.remember {float: right; margin: 5px 5px 0 0; border: none; width: 80px; height: 20px; background: url(../images/remember-btn.png) 0 0 no-repeat; cursor: pointer;} /* COLUMN 2 (USER INFO) */ #twoColLayout #column2 {float: left; width: 460px;} /* CART TABLE */ table {margin: 0 0 20px 0; border: none;} th {padding: 5px; font-weight: bold; color: #000; border: none;} tr {border-bottom: 1px solid #ccc;} td {padding: 5px; border: 1px solid #ccc; text-align: center;} .left {text-align: left;} .right {text-align: right;} /* CONTINUE SHOPPING BUTTON */ #twoColLayout #column2 .contShipBtn {float: right; margin: 0 0 0 20px; width: 142px; height: 20px;} #twoColLayout #column2 .contShipBtn a {display: block; width: 142px; height: 20px; background: url(../images/cont-shop-btn.png) 0 0 no-repeat;} /* CONTINUE CHECKOUT BUTTON */ #twoColLayout #column2 .contCheckBtn {float: right; margin: 0 0 0 20px; width: 142px; height: 20px;} #twoColLayout #column2 .contCheckBtn a {display: block; width: 142px; height: 20px; background: url(../images/cont-check-btn.png) 0 0 no-repeat;} /* TOTAL TABLE */ table#total {float: right; border: none;} table#total th {padding: 5px; font-weight: bold; color: #000; border: 1px solid #ccc; text-align: right} table#total tr {border-bottom: 1px solid #ccc;} table#total td {padding: 5px; border: 1px solid #ccc; text-align: right;} /* CATEGORY TABLE */ table#categoryTBL{ table-layout: fixed; width: 100%; } table#categoryTBL tr{ border: 0; } table#categoryTBL td{ padding-left: 20px; border: 0; text-align: left; background: url(../images/starBG.gif) no-repeat center left; } table#categoryTBL td a{ text-decoration: none; color: #666; } table#categoryTBL td a b{ color: #000; font-weight: normal; } table#categoryTBL td a:hover{ color: #000; } /* OTGHER PAGES ---------------------------------------------------------------------------*/ /* COLUMN 1 */ #news #column1, #faq #column1 {float: left; width: 512px; margin: 0 15px 0 0;} #news #column1 h2 {font-family: arial, helvetica, sans-serif;} #faq #column1 h2 {padding: 0 0 0 20px; background: url(../images/star.png) 0 2px no-repeat; font-family: arial, helvetica, sans-serif;} #faq .heading {display: block; clear: both; margin: 0 auto 40px auto;} #news #column1 p {margin: 0 0 10px 0;} #faq #column1 p {margin: 0 0 20px 20px; padding: 0 0 10px 0; border-bottom: 1px solid #999;} /* SUMMARY WRAP */ #news #column1 .summaryWrap {margin: 0 0 20px 0; width: 512px;} #news #column1 .newsLogo {float: left; margin: 0 30px 0 0; width: 200px;} #news #column1 .summary {float: left; width: 282px;} #news #column1 .summary .info {margin: 10px 0 0 0; border-top: 1px solid #999;} #news #column1 .summary .info a {text-decoration: none; text-transform: uppercase; color: #000;} #news #column1 .summary .info a:hover {text-decoration: underline; color: #009b68;} /* COLUMN 2 */ #news #column2 {float: left; padding: 10px 40px; width: 173px; background-color: #e8e8e8; -webkit-border-radius: 10px; -moz-border-radius: 10px;} #faq #column2 {float: left; padding: 160px 0 0 0; width: 253px; background: url(../images/truck.png) 0 0 no-repeat;} #faq #column2 h2 a {text-decoration: none; margin: 0 0 0 30px; padding: 2px 20px 0 0; background: url(../images/forward-arrow.png) 100% 0 no-repeat;} #faq #column2 .box {float: left; margin: 10px 0 0 0; padding: 10px 30px; width: 193px; background-color: #e8e8e8; -webkit-border-radius: 10px; -moz-border-radius: 10px;} #faq #column2 .box h3 {font-family: arial, helvetica, sans-serif; color: #009b68; text-transform: uppercase;} #faq #column2 li {margin: 0 0 10px 0; padding: 0;} #faq #column2 ul {margin: 0 0 20px 0;} #faq #column2 li a {text-decoration: none; text-transform: uppercase; color: #000;} #faq #column2 li a:hover {text-decoration: underline; color: #009b68;} #news #column2 h2, #faq #column2 h2 {font-family: arial, helvetica, sans-serif; color: #999; text-transform: uppercase;} #news #column2 .blurb {margin: 0 0 5px 0; padding: 0 0 5px 0; border-bottom: 1px solid #999; width: 173px;} #news #column2 .blurb a {text-decoration: none; text-transform: uppercase; color: #000;} #news #column2 .blurb a:hover {text-decoration: underline; color: #009b68;} #news #column2 .past {display: block; font-family: arial, helvetica, sans-serif; font-weight: bold; text-decoration: none; text-transform: uppercase; margin: 10px 0 0 0; padding: 1px 0 0 15px; background: url(../images/backarrow.png) 0 0 no-repeat;} #news #column2 .recent {display: block; font-family: arial, helvetica, sans-serif; font-weight: bold; text-decoration: none; text-transform: uppercase; margin: 10px 0 0 0; padding: 1px 15px 0 0px; background: url(../images/forwardarrow.png) 100px 0 no-repeat;} #news #column2 h3 {margin: 20px 0 0 0; font-family: Georgia, Times, serif; font-size: 14px; font-weight: bold; color: #999; text-transform: uppercase;} /* FOOTER */ #footer {clear: both; margin: 0 auto; padding: 40px; width: 900px; text-align: center;} #footer p {margin: 0; color: #000;} #black #footer p {margin: 0; color: #fff;} #blue #footer p {margin: 0; color: #fff;} #footer ul {margin: 0;} #footer li {display: inline; margin: 0 8px 0 0; padding: 0 10px 0 0; border-right: 1px solid #000; color: #7f92b9; background: none;} #black #footer li {border-right: 1px solid #fff;} #footer li.last, #black #footer li.last {border: 0;} #footer li a {color: #009b68;} #black #footer li a {color: #dfb900;} #blue #footer li a{color: #FFCC00; } #footer li a:hover {text-decoration: none;} /* GENERIC CLASSES ---------------------------------------------------------------------------*/ .hide {display: none;} .clear {clear: both;} .smallItallic {margin: 0 0 10px 0; font-size: 12px; font-style: italic; color: #4ba6de;} .center {text-align: center;} .orange {color: #e67108;} /* Shopping cart tax info */ .cart-tax-info, .cart-price { padding-right:20px; } .cart-tax-total { cursor:pointer; } .cart-tax-total { padding-right:20px; background:url(../images/bg_collapse.gif) 100% 5px no-repeat; cursor:pointer; } .cart-tax-total-expanded { background-position:100% -52px; } .shopping-cart-collaterals { float:left; width:512px; padding:25px 0; } .shopping-cart-collaterals .box { margin-bottom:18px; padding:12px 15px; border:1px solid #D0CBC1; background:url(../images/base_mini_head_bg.gif) repeat-x #fff; } .shopping-cart-collaterals .box .form-button { margin-left:5px; } .shopping-cart-collaterals .discount-codes h4, .shopping-cart-collaterals .shipping-estimate h4 { min-height:16px; color:#009B68; background-repeat:no-repeat; background-position:0 0; padding:1px 0 1px 21px; text-transform:uppercase; } .shopping-cart-collaterals .discount-codes h4 { background-image:url(../images/icon_asterick.gif); padding-left:23px; } .shopping-cart-collaterals .shipping-estimate h4 { background-image:url(../images/icon_lorry.gif); padding-left:23px; } .shopping-cart-collaterals .shipping-estimate .input-text { width:214px; } .shopping-cart-collaterals .shipping-estimate select { width:220px; } .shopping-cart-collaterals .upsell { width:42.5%; border:1px solid #cec3b6; padding:12px 15px; background:#fafaec; } .shopping-cart-collaterals .upsell .product-image { float:left; width:75px; border:1px solid #d0cdc9; } .shopping-cart-collaterals .upsell .product-shop { width:170px; } .shopping-cart-collaterals .upsell .product-shop h5 { font-size:1em; } .grand_total { width:auto; margin-top:15px; border:1px solid #BEBCB7; background:#DEE5E8; font-size:1.3em !important; font-weight:bold; text-align:right; } tr.grand_total td, p.grand_total { padding-top:5px; padding-bottom:5px; } /* One-Page checkout ---------------------------------------------------------------------------*/ .one-page-checkout li.section { position:relative; } .one-page-checkout .group-select { margin-right:0; } .one-page-checkout .box { border:1px solid #bbb6a5; border-top:0; padding:15px 20px; background:#faf7ee; } .one-page-checkout .head { margin-bottom:0; padding:4px 8px 6px 8px; background:url(../images/opc_off_head_bg.gif) repeat-x 0 100% #eee; border-width:0 1px 0 1px; border-color:#D9DDE3; border-style:solid; border-top:1px solid #fff; } .one-page-checkout .tool-tip { right:8px; } .one-page-checkout .head a { display:none; } /* Hide Edit button in step header */ .one-page-checkout h3 { color:#999; font-size:1.05em; } .one-page-checkout h4 { border-bottom:1px solid #E4E4E4; padding-bottom:2px; text-transform:uppercase; } .one-page-checkout h4.title { border-bottom:0; text-transform:none; } .one-page-checkout .step-count { background:#fff; font-size:.9em; padding:0 4px; line-height:1em; } .one-page-checkout .content { padding:10px 20px; } .one-page-checkout label.label { font-size:1.05em; color:#2f2f2f; } .one-page-checkout .allow .head { background:#d0dce1; border-color:#a3aeb3; border-width:1px 1px 0 1px; cursor:pointer; } .one-page-checkout .active .head { margin-bottom:0; border:1px solid #454545; background:#000000; padding-bottom:5px; cursor:default; } .one-page-checkout .alloq .head a { display:block; } /* Display Edit button in active selection */ .one-page-checkout .group-select { margin-top:0; border:0; background:none; padding:0; } .one-page-checkout .allow h3 { color:#a4b3b9; } .one-page-checkout .active h3 { color:#009B68; } .one-page-checkout .allow .step-count { background:#dbe6eb; } .one-page-checkout .active .step-count { color:#fff; border:1px solid #009B68; background:#009B68; } .one-page-checkout .active .box { display:block; border-color:#BBAFA0; background: url(../images/multi_address_box_bg.gif) 0 0 repeat-x; } .one-page-checkout dd .form-list ul { margin:5px 17px 15px 17px; } .one-page-checkout .checkmo-mailing-address { padding-left:20px; } .one-page-checkout-progress .page-head { margin-bottom:1em; } .one-page-checkout-progress li { border:1px solid #A3AEB3; background:#eee; margin-bottom:6px; } .one-page-checkout-progress h4 { margin:0; color:#999; padding:2px 8px; background:#eee; text-transform:none; } .one-page-checkout-progress h4.complete { border-bottom:1px solid #A3AEB3; background:#D0DCE1; color:#5e8ab4; } .one-page-checkout-progress h4 a { text-transform:none; } .one-page-checkout-progress .content { padding:8px 13px; } #opc-login .button-set { border-top:0; } #opc-review .box { border:0; padding:0; } #opc-review .content { border:1px solid #d9dde3; border-top:0; } #opc-review .data-table { border-top:0; } .opc-please-wait { padding-right:7px; } .one-page-checkout a.back { background:url(../images/icon_opc_back.gif) no-repeat; padding-left:16px; line-height:13px; } .one-page-checkout .payment-methods dd { padding:0; } .one-page-checkout .button-set { margin-top:0; padding-top:2em; } #checkoutSteps{ width: 500px; float: left; margin-right: 15px;} /* Form Messages */ .validation-advice, .required { color:#EB340A; } .validation-advice { clear:both; min-height:15px; margin-top:3px; background:url(../images/validation_advice_bg.gif) no-repeat 2px 1px; padding-left:17px; font-size:.95em; font-weight:bold; line-height:1.25em; } .validation-failed { border:1px dashed #EB340A !important; background:#faebe7 !important; } /* Expiration date and cvv number validation fix */ .v-fix { float:left; } .v-fix .validation-advice { display:block; margin-right:-12em; width:12em; position:relative; } /* Data Table */ .data-table { border:1px solid #bebcb7; width:100%; } .data-table tr { background:#fff; } .data-table .odd { background:#f8f7f5 } .data-table .even { background:#eeeded !important; } .data-table td.last, .data-table th.last { border-right:0; } .data-table tr.last th, .data-table tr.last td { border-bottom:0 !important; } .data-table th { border-right:1px solid #c2d3e0; padding:2px 8px; color:#0a263c; white-space:nowrap; } .data-table th.wrap { white-space:normal; } .data-table th a, .data-table th a:hover { color:#fff; } .data-table td { padding:3px 8px; } .data-table thead tr th { background:url(../images/data_table_th_bg.gif) repeat-x 0 100% #E8E8E8; } .data-table tfoot { border-bottom:1px solid #d9dde3; } .data-table tfoot tr.first { background:url(../images/base_mini_actions_bg.gif) 0 0 repeat-x; } .data-table tfoot tr { background-color:#DEE5E8 !important; } .data-table tfoot td { padding-top:1px; padding-bottom:1px; border-bottom:0; border-right:1px solid #d9dde3; } .data-table tbody td { border-bottom:1px solid #d9dde3; border-right:1px solid #d9dde3; } /* Bundle Products */ .data-table tbody.odd tr { background:#f8f7f5 !important; } .data-table tbody.even tr { background:#f6f6f6 !important; } .data-table tbody.odd tr td, .data-table tbody.even tr td { border-bottom:0; } .data-table tbody.odd tr.border td, .data-table tbody.even tr.border td { border-bottom:1px solid #d9dde3; } .data-table tbody td h5.title { margin:0; padding:0; font-size:1em; font-weight:bold; color:#2f2f2f; } .data-table tbody td .option-label { font-weight:bold; font-style:italic; } .data-table tbody td .option-value { padding-left:10px; } .box-table td { padding:10px; } .box-table tfoot td { padding-top:5px; padding-bottom:5px; } .box-table select { width:100%; } .nested-data-table th, .nested-data-table td { padding-top:2px; padding-bottom:2px; } .generic-table td { padding:0 8px} .generic-table td.first { padding-left:0; white-space:nowrap; } .shipping-tracking .button-set { margin-top:0; border:none; border-top:0; padding-top:0; } /* Shopping Cart */ .shopping-cart { margin-bottom:0; } .shopping-cart th, .shopping-cart td { padding-left:13px; padding-right:13px; } .shopping-cart th .tax-flag {font-size:0.9em; font-weight:normal; display:block; } .shopping-cart tr.error { background:#FDE6E0 !important; } .shopping-cart .continue-shopping { float:left; } .shopping-cart-item-message {margin-bottom:5px;font-size:95%;margin-top:6px; } td.attributes-col { line-height:1.4em; } td.attributes-col ul { margin:5px 0; font-size:.95em; } td.attributes-col dt { margin-top:.5em; } td.attributes-col dd ul { margin:0 0 5px 0; list-style:disc; } td.attributes-col dd ul li { margin-left:15px; } td.attributes-col h4.title { padding:0; margin:0; font-size:1em; color:#2f2f2f; width:100%; overflow:hidden; } td.attributes-col h4.title a { font-weight:bold; } .shopping-cart-totals { width:248px; float:right; margin-top:25px; border:1px solid #BEBCB7; background:#DEE5E8; text-align:right; } .shopping-cart-totals table { width:100%; margin:7px 0; } .shopping-cart-totals td { padding:0 15px; } .shopping-cart-totals tr.last td {} .shopping-cart-totals tfoot td { padding-top:10px; font-size:1.3em; border:none!important; } .shopping-cart-totals .checkout-types { padding:8px 15px 15px; } .shopping-cart-totals .checkout-types li { clear:both; margin:10px 0; } /* Page heading */ .page-head { margin:0 0 25px 0; border-bottom:1px solid #ccc; } .page-head-alt { margin:0 0 12px 0; } .page-head, .page-head-alt { text-align:right; } .page-head h3, .page-head-alt h3 { margin:0; font-size:1.7em !important; font-weight:normal !important; text-transform:none !important; text-align:left; } .button-level h3 { /* heading level with buttons */ float:left; width:55%; } .page-head .link-feed {float:right; margin-top:9px; } .button-level .link-feed {float:none!important; font-size:1em!important; } .button-set { /* Container for form buttons*/ clear:both; margin-top:4em; border-top:1px solid #e4e4e4; padding-top:8px; text-align:right; } .form-button, .form-button-alt { overflow:visible; width:auto; border:0; padding:1px 8px; background:#fff; color:#009B68; border:1px solid #E8E8E8; font:bold 12px arial, sans-serif !important; cursor:pointer; text-align:center; vertical-align:middle; text-transform: uppercase; font-weight: bold; } .form-button span, .form-button-alt span { white-space:nowrap; } a.form-button-alt { padding:2px 9px; text-decoration:none; } .form-button-alt:hover { color:#fff; text-decoration:none; } .btn-checkout { display:block; float:right; background:transparent url(../images/btn_proceed_to_checkout_rad.gif) no-repeat 100% 0; font-size:15px; font-weight:bold; padding-right:8px; } .btn-checkout, .btn-checkout:hover { color:#fef5e5; text-decoration:none; } .btn-checkout span { display:block; padding:0 17px 0 25px; background:transparent url(../images/btn_proceed_to_checkout_bg.gif) no-repeat; line-height:40px; } .group-select { margin:28px 0; border:1px solid #bbafa0; padding:22px 25px 12px 25px; background:#E8E8E8; width: 480px; } .group-select .legend { margin-top:-33px; float:left; border:1px solid #bbafa0; background:#dedede; padding:0 8px; color:#009B68; font-weight:bold; font-size:1.1em; } .group-select li { padding:4px 8px; clear: both;} .group-select li .input-box { float:left; width:230px; } .group-select li .input-text, .group-select li select, .group-select li textarea { width:450px; } .group-select li .input-box .input-text, .group-select li .input-box textarea { width:200px; } .group-select li .input-box select { width:200px; } /* Customer Name */ .customer-name-prefix .name-prefix { width:60px !important; } .customer-name-prefix .name-prefix input { width:45px !important; } .customer-name-prefix .name-prefix select { width:51px !important; } .customer-name-prefix .name-firstname { width:215px !important; } .customer-name-prefix .name-firstname input { width:190px !important; } .customer-name-middlename .name-firstname { width:215px !important; } .customer-name-middlename .name-firstname input { width:200px !important; } .customer-name-middlename .name-middlename { width:60px !important; } .customer-name-middlename .name-middlename input { width:35px !important; } .customer-name-suffix .name-lastname { width:205px !important; } .customer-name-suffix .name-lastname input { width:190px !important; } .customer-name-suffix .name-suffix { width:50px !important; } .customer-name-suffix .name-suffix input { width:45px !important; } .customer-name-suffix .name-suffix select { width:51px !important; } .customer-name-prefix-middlename .name-prefix { width:60px !important; } .customer-name-prefix-middlename .name-prefix input { width:45px !important; } .customer-name-prefix-middlename .name-prefix select { width:51px !important; } .customer-name-prefix-middlename .name-firstname { width:215px !important; } .customer-name-prefix-middlename .name-firstname input { width:190px !important; } .customer-name-prefix-middlename .name-middlename { width:50px !important; } .customer-name-prefix-middlename .name-middlename input { width:35px !important; } .customer-name-prefix-middlename .name-lastname { width:200px !important; } .customer-name-prefix-middlename .name-lastname input { width:200px !important; } .customer-name-prefix-suffix .name-prefix { width:60px !important; } .customer-name-prefix-suffix .name-prefix input { width:45px !important; } .customer-name-prefix-suffix .name-prefix select { width:51px !important; } .customer-name-prefix-suffix .name-firstname { width:215px !important; } .customer-name-prefix-suffix .name-firstname input { width:190px !important; } .customer-name-prefix-suffix .name-lastname { width:205px !important; } .customer-name-prefix-suffix .name-lastname input { width:190px !important; } .customer-name-prefix-suffix .name-suffix { width:50px !important; } .customer-name-prefix-suffix .name-suffix input { width:45px !important; } .customer-name-prefix-suffix .name-suffix select { width:51px !important; } .customer-name-middlename-suffix .name-firstname { width:215px !important; } .customer-name-middlename-suffix .name-firstname input { width:200px !important; } .customer-name-middlename-suffix .name-middlename { width:60px !important; } .customer-name-middlename-suffix .name-middlename input { width:35px !important; } .customer-name-middlename-suffix .name-lastname { width:205px !important; } .customer-name-middlename-suffix .name-lastname input { width:190px !important; } .customer-name-middlename-suffix .name-suffix { width:50px !important; } .customer-name-middlename-suffix .name-suffix input { width:45px !important; } .customer-name-middlename-suffix .name-suffix select { width:51px !important; } .customer-name-prefix-middlename-suffix .name-prefix { width:60px !important; } .customer-name-prefix-middlename-suffix .name-prefix input { width:45px !important; } .customer-name-prefix-middlename-suffix .name-prefix select { width:51px !important; } .customer-name-prefix-middlename-suffix .name-firstname { width:155px !important; } .customer-name-prefix-middlename-suffix .name-firstname input { width:140px !important; } .customer-name-prefix-middlename-suffix .name-middlename { width:60px !important; } .customer-name-prefix-middlename-suffix .name-middlename input { width:35px !important; } .customer-name-prefix-middlename-suffix .name-lastname { width:205px !important; } .customer-name-prefix-middlename-suffix .name-lastname input { width:190px !important; } .customer-name-prefix-middlename-suffix .name-suffix { width:50px !important; } .customer-name-prefix-middlename-suffix .name-suffix input { width:45px !important; } .customer-name-prefix-middlename-suffix .name-suffix select { width:51px !important; } .customer-dob .input-box { float:left; width:60px !important; } .customer-dob input { width:50px !important; } .customer-dob label.label-dob { font-weight:normal; color:#888; font-size:10px; } fieldset.product-options p.required{ display: none;}