/* CSS Document for the "Out of Focus" CoffeeCup Software E-Commerce Template Copyright 2008 CoffeeCup Software - coffeecup.com */ /*############################################################## Eric Meyer's Latest version of Reset.css (includes Baseline) ##############################################################*/ 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, dd, dl, dt, li, ol, ul, 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%; line-height: 1; font-family: inherit; text-align: left; vertical-align: baseline; } a img, :link img, :visited img {border: 0} table {border-collapse: collapse; border-spacing: 0} ol, ul {list-style: none} q:before, q:after, blockquote:before, blockquote:after {content: ""} /*####################### Element Styles #######################*/ body { color: #262626; font-size: 12px; font-family: Arial, Verdana, Helvetica, sans-serif; background: #cccccb url(../images/body_bg.jpg) no-repeat 50% top } a { color: #0000cd; text-decoration: none; outline: none } a:hover {text-decoration:underline} p {line-height:1.25em} em {font-style:italic} strong {font-weight:bold} h1 {font-size:2.25em} h1 a {text-decoration:none; color:#fff} h2 {margin-bottom:15px; font-size:2em} h3 {clear:both; font-size:1.5em; font-weight:bold; margin-bottom:15px} /*####################### Classes #######################*/ .left {float:left} .hide {text-indent:-999em} /*####################### Layout Styles #######################*/ #wrapper {width:960px; overflow:hidden; margin:0 auto; background-color:#fff} #header { color: #fff; background: #0000cd url(../images/header_bg.jpg) repeat-x left top; display: inline; float: left; padding: 0 17px; border-top: 1px solid #0000cd; border-bottom: 1px solid #c2c3c2; width: 926px; height: 134pt } #store_info { display: inline; float: left; padding-top: 13px; padding-left: 80px; width: 180px } #store_info img { background-image: url(../images/logo_placeholder.jpg); display: inline; float: left } #store_info p { color: #d7f3f4; font-style: italic; font-size: 1.5em; font-family: Georgia, Times, "Times New Roman", serif; margin-top: 13px } #cart_summary { display: inline; float: right; margin-top: 10px } #cart_summary p {float:left; margin-top:5px} #cart_summary .checkout_button { background: #0000cd url(../images/checkout_button.jpg) no-repeat left top; margin: 0 0 0 15px; width: 158px } #cart_summary .checkout_button a {display:block; width:161px; padding:9px 0 8px 0; text-align:center; font-weight:bold; text-decoration:none; color:#fff} #cart_summary.checkout_button a:hover {background:url(../images/checkout_button_hover.jpg) left top no-repeat} #navigation { text-align: center; display: inline; float: right; padding-top: 80px; padding-left: 200px; width: 451px; height: 50px } #navigation li { display: inline; float: left; margin-right: 5px } #navigation #home_link { background: #0000cd url(../images/home_button.jpg) no-repeat 50% top; position: relative; width: 82px } #navigation #home_link a { display: block; padding-top: 13px; width: 82px; height: 26px } #navigation #home_link a:hover { background: #0000cd url(../images/home_button_hover.jpg) no-repeat 50% top } #navigation #shophome_link { background: #0000cd url(../images/viewcart_button.jpg) no-repeat 50% top; position: relative; width: 107px } #navigation #shophome_link a {display:block; width:107px; height:26px; padding-top:13px} #navigation #shophome_link a:hover { background: #0000cd url(../images/viewcart_button_hover.jpg) no-repeat 50% top } #navigation #cart_link { background: #0000cd url(../images/viewcart_button.jpg) no-repeat 50% top; width: 107px } #navigation #cart_link a { display: block; padding-top: 13px; width: 107px; height: 26px } #navigation #cart_link a:hover { background: #0000cd url(../images/viewcart_button_hover.jpg) no-repeat 50% top } #navigation #category_link { background: #0000cd url(../images/categories_button.jpg) no-repeat 50% top; position: relative; width: 135px } #navigation #category_link a {display:block; width:135px; height:26px; padding-top:13px} #navigation #category_link a:hover { background: #0000cd url(../images/categories_button_hover.jpg) no-repeat 50% top } #navigation li a {display:block; width:100%; height:100%; text-align:center; font-size:1.25em; color:#fff; text-decoration:none} /*Active States */ #shophome #navigation #shophome_link a { background: #0000cd url(../images/viewcart_button_hover.jpg) no-repeat 50% top } #cart_page #navigation #cart_link a { background: #0000cd url(../images/viewcart_button_hover.jpg) no-repeat 50% top } #group_page #navigation #category_link a { background: #0000cd url(../images/categories_button_hover.jpg) no-repeat 50% top } /* Drop-Down Category Menu */ #navigation #category_link #group_list { background-color: #0000cd; position: absolute; top: auto; left: -999em; width: 135px } #navigation #category_link:hover #group_list, #navigation #category_link.sfhover #group_list {left:0} #navigation #category_link #group_list li {width:125px; margin:0; padding:5px; text-transform:none; font-size:.8em; background:none} #navigation #category_link #group_list li a {display:block; height:auto; text-align:left; text-decoration:none; color:#fff; background:none} #navigation #category_link #group_list li a:hover {text-decoration:underline; border:none} /* Drop-Down Static Page Menu */ #navigation #shophome_link #staticpage_list, #navigation #home_link #staticpage_list { background-color: #0000cd; position: absolute; top: auto; left: -999em; width: 135px } #navigation #shophome_link:hover #staticpage_list, #navigation #shophome_link.sfhover #staticpage_list, #navigation #home_link:hover #staticpage_list, #navigation #home_link.sfhover #staticpage_list {left:0} #navigation #shophome_link #staticpage_list li, #navigation #home_link #staticpage_list li {width:125px; margin:0; padding:5px; text-transform:none; font-size:.8em; background:none} #navigation #shophome_link #staticpage_list li a, #navigation #home_link #staticpage_list li a {display:block; height:auto; text-align:left; text-decoration:none; color:#fff; background:none} #navigation #shophome_link #staticpage_list li a:hover, #navigation #home_link #staticpage_list li a:hover {text-decoration:underline; border:none} #content {clear:both; float:left; display:inline; padding:18px 17px; width:926px} #content ul {margin:15px 0 15px 25px; list-style-type:bullet} #content .cart_messages { font-weight: bold; font-size: 1.25em; background: #ebf0f1 url(../images/warning_icon.png) no-repeat 15px 45%; clear: both; margin: 15px 0; padding: 15px 15px 15px 45px; border: solid 1px #0000cd } #item_list {clear:both; float:left; display:inline; margin-top:15px; width:926px} #item_list .item {float:left; display:inline; margin-right:35px; width:195px; height:200px} #item_list .item img {float:left; display:inline; width:90px; height:90px; margin:0 5px 5px 0; border:2px solid #c3c3c3} #item_list .item .price {float:left; display:inline; width:80px; margin-bottom:5px; font-weight:bold} #item_list .item .discounted { color: #0000cd } #item_list .buylink input {margin-top:5px; font-size:.85em} #item_list .item .description {clear:both; margin-bottom:27px} #item_list .item .description .title {font-weight:bold; font-size:1.25em} #item_list .item .description .sub_title {font-style:italic} #footer {clear:both; padding:10px 17px; width:926px; margin:60px 0 0 0; line-height:none; font-size:.9em; background-color:#edecec} #footer a {text-decoration:none} #footer a:hover {text-decoration:underline} #footer #footer_links, #footer #footer_links p {margin:5px 0} #footer #footer_links li {display:inline; margin-right:10px} #footer #footer_links li a {text-decoration:underline} #footer #footer_links li a:hover {text-decoration:none} #footer p {margin:10px 0} #footer #copyright {font-style:italic} /*####################### Static Page Styles #######################*/ #content .static_text {clear:both; margin-bottom:15px; line-height:1.5em} #content .static_text h1 {font-size:2em; font-weight:bold} #content .static_text ul {margin:15px 0 15px 25px; line-height:1.5em; list-style-type:disc} #content .static_text ol {margin:15px 0 15px 25px; line-height:1.5em; list-style-type:decimal} #static_text ol li, #static_text ul li {margin:5px 0} #content .static_text dl {margin:15px 0 15px 25px; line-height:1.5em} #content .static_text dt {margin:15px 0} #content .static_text dd {margin:5px 25px} #content .static_text blockquote {margin:15px 25px; font-size:1.25em} #content .static_text cite {font-size:.9em; font-style:italic} #content .static_text img {margin:15px} /*####################### Shopping Cart Styles #######################*/ #cart_list {clear:both; width:100%; margin-bottom:15px} #cart_list .cart_description {width:550px} #cart_list .cart_headlines { color: #fff; background-color: #0000cd; text-transform: uppercase } #cart_list .top_border { border-top: 1px solid #0000cd } #cart_list .cart_headlines td {padding:5px 10px; text-align:left} #cart_list td {padding:10px; width:90px; overflow:hidden; text-align:right} #cart_list td input {width:75px} #cart_list td .recalculate {margin-top:5px; width:auto} #cart_list #delete_button {clear:both; float:left; margin-top:5px; width:auto} #cart_list td img {float:left; display:inline; margin-right:5px; width:53px; height:53px} #cart_list td p {margin-bottom:10px} #cart_list td.right {text-align:right} #cart_list td.center {text-align:center} #cart_list .short_description {font-style:italic} #update_cart {clear:both; float:right; margin-bottom:15px; font-size:.9em} #update_cart input {margin-left:5px; font-size:1.15em} #cart_list select {margin-top:5px; padding:1px} #cart_list option {padding:1px} #cart_list .cart_subtotals, #cart_list .cart_total {text-align:right} #cart_list .cart_total {font-weight:bold; font-size:1.25em; text-transform:uppercase} #content .no_items {clear:both; margin:15px 0; font-size:1.25em; font-weight:bold} /* Checkout Buttons */ #checkout_buttons {float:right; display:inline; margin-top:15px} .checkout {float:right; display:inline; margin:0 0 15px 5px} .credit_cards {clear:both; float:right} .credit_cards img {float:right} /*####################### Paypal Feedback Styles #######################*/ .paypal_feedback {clear:both; /**/ margin:15px 0; padding:15px; border:1px solid #D02117; background:#EBF0F1} .paypal_feedback h2 {width:100%} .paypal_feedback table {margin-bottom:15px} .paypal_feedback table td {padding:5px 5px 5px 0} .return_button {margin-top:15px} .return_button a {display:block; width:253px; height:41px; text-indent:-999em; background:url(../images/return_to_shop_button.png) left top no-repeat} #print {float:right; padding:2px 0 3px 30px; background:url(../images/print_icon.png) left top no-repeat} /*####################### Product Detail Styles #######################*/ #product_images {clear:both; float:left; width:220px} #image_full {padding:4px; border:1px solid #c3c3c3; background-color:#efeeee; width:204px} #content #product_thumbnails {margin:0; list-style-type:none} #product_thumbnails li {float:left; display:inline; padding:3px; width:98px; height:96px; margin:3px 3px 0 0; border:1px solid #c3c3c3; background-color:#efeeee} #product_thumbnails img {width:98px} #product_info {float:right; width:690px; font-size:1em} #product_info p {clear:both; margin-bottom:15px; line-height:1.5em} #product_info ul {clear:both; margin:15px 0 15px 25px; line-height:1.5em; list-style-type:disc} #product_info ol {clear:both; margin:15px 0 15px 25px; line-height:1.5em; list-style-type:decimal} #product_info .pricing dt {clear:both; display:block; float:left; display:inline; margin-bottom:15px; width:20%; text-transform:uppercase; font-weight:bold} #product_info .pricing dd {float:left; display:inline; width:80%; margin-bottom:15px} .list_price {text-decoration:line-through} .your_price { color: #0000cd; font-weight: bold } .discount {padding-left:10px; font-weight:normal; font-style:italic} #product_info .options {clear:both; width:270px; padding-top:20px; border-top:1px solid #c3c3c3} #product_info .options dt {clear:both; display:block; float:left; display:inline; padding:2px 0; margin-bottom:5px; text-transform:uppercase; font-weight:bold} #product_info .options dd {width:100%; float:left; display:inline; padding:2px 0; margin-bottom:15px} #product_info .options select, #product_info .options input {font-size:11px} #product_info .options select {width:100%} #product_info .options input {width:30px} #product_info .buylink {clear:both; float:left; margin-top:15px} #product_info .buylink input {width:120px; font-weight:bold}