/* ==============================================
File: format.css
Updated: 2/18/09
Description: Contains site formatting
Contents:

1.	General
2. 	Header
	2a. Messages
3. 	Content
	3a.	Home
	3b.	Products
	3c.	Productslist
	3d.	ProductFocus
	3e.	UserReviews
	3f.	Cart
	3g.	Contact
4. 	Footer
5.	Buttons

============================================== */

/* --------------------------------------------------------
1.	General
-------------------------------------------------------- */
html {overflow-y: scroll;}
body {text-align: center; font-size:90%;
	 font-family: "Tahoma", "Lucida Grande", Arial, Helvetica, sans-serif;}
a {}
a:focus, a:active {outline: none;}
.hidden {display: none;}
.container {width: auto;}


/* --------------------------------------------------------
2.	Header
-------------------------------------------------------- */
.header {width: 980px; margin: 0 auto; text-align: left;}
.left_upper_nav {margin-top: 4px; font-size: 12px; float: left; height: 36px;}
	.left_upper_nav a {}
	.left_upper_nav a:hover {}
.right_upper_nav {margin-top: 4px; font-size: 12px; float: right;}
	.right_upper_nav a {margin: 0 4px;}
	.right_upper_nav a:hover {}
		.header h1 a:hover {cursor: pointer;}
		
.header_main {height: 110px; clear: both; padding: 0 15px;}
.header_main h1 {margin: 0; float: left;}
	.header_main h1 a {text-indent: -100em; overflow: hidden; display: block;}
.cart_itemsView {margin: 17px 0 0 3px; float: left; font-size: 12px;}
.quick_contact {float: right; text-align: right; margin: 15px 0 0 0;}
	.quick_contact .address {margin: 0 0 7px 0; line-height: 16px;}
	.quick_contact .phone {}
	.quick_contact .email {}
		.quick_contact .email a, .quick_contact .email a:hover {}

.lower_header {margin: 0; padding: 0; overflow: hidden; height: 100%;}
.lower_header ul {list-style: none; margin: 0; font-size: 14px; margin-left: 13px; font-weight: bold;}
	.lower_header ul li {float: left;}
		.lower_header ul li a {display: block; padding: 7px 20px 3px 20px; 
						   margin: 8px 2px 0 2px; text-decoration: none;
						   -moz-border-radius-topright: 10px;  -moz-border-radius-topleft: 10px;
						   -webkit-border-top-right-radius: 10px;  -webkit-border-top-left-radius: 10px;}		
		.lower_header ul li a:hover {}
			.home .nav_home, .home .nav_home:hover {}
			.products .nav_products, .products .nav_products:hover {}
			.product .nav_products, .product .nav_products:hover {}
			.productslist .nav_products, .productslist .nav_products:hover {;}
			.cart .nav_cart, .cart .nav_cart:hover {}
		
.searchbox {margin: 9px 15px 0 0; padding: 0; width:270px; float: right;}
.search {height: 17px; padding: 10px 5px 3px 8px; width: 222px; border: none; margin: 0; float: left;}
.find {border: none;	height: 30px; width: 35px; margin: 0; float: right;}
.find:hover {cursor: pointer;}
.slideout {text-align: left; width: 980px; margin: 0 auto;}

.styleswitch img {}

/* 2a.	Messages
-------------------------------------------------------- */
.slideout_message p {margin: 0;}
/*.error, .notice, .success {padding: 5px 20px 5px 45px; border-left: none; border-right: none;}*/
.error {}
.notice {}
.success {}
.message_close {float: right;}


/* --------------------------------------------------------
3.	Content
-------------------------------------------------------- */
.content {width: 980px; text-align: left; margin: 0 auto;}
.content_main {padding: 15px; overflow: hidden; height: 100%;}


/* 3a.	Home
-------------------------------------------------------- */
.product_blocks {font-size: 18px; overflow: hidden; height: 100%; border-left: none; border-right: none;}
	.product_blocks h2 {font-size: 22px; font-weight: bold; margin: 15px 0 0 15px;}
	.product_blocks p {margin: 0 0 0 15px;}
.product_block {display: block; width: 285px; float: left; margin: 15px 0 0 16px; text-decoration: none; 
			   padding: 9px; font-size: 15px; -moz-border-radius: 5px; -webkit-border-top-radius: 5px;}
	.product_block_hover {}
	.product_block img {margin: -3px 0 0 -3px;}
	.product_block h3 {margin: 10px 0 0 0;}
	p.product_block_desc {margin: 5px 0 10px 0;}
	p.product_block_price {margin: 0; float: right; line-height: 24px; font-weight: bold;}
	a.product_block_more {margin: 0 0 0 15px; float: right; 
						 padding: 0px 10px; line-height: 22px; text-decoration: none;}
		a.product_block_more:hover {cursor: pointer;}
.featured_viewMore {float: right; font-size: 16px; text-decoration: underline; margin: 15px;}


/* 3b.	Products
-------------------------------------------------------- */
.productsFocus {margin: 0; overflow: hidden; height: auto; padding-bottom: 15px; 
			   border-left: none; border-right: none; height: 100%;}
.productsFocus_tabs {margin: 15px 0 0 10px; padding: 0; list-style: none;}
	.productsFocus_tabs li {margin: 0 5px; padding: 0; float: left;}
		.productsFocus_tabs li a {padding: 7px 17px; display: block;
							   -moz-border-radius: 5px; -webkit-border-top-radius: 5px;}
		.productsFocus_tabs li a:hover {}
		.productsFocus_tabs li a.current {font-weight: bold; text-decoration: none;}
#featured, #popular {clear: both;}
.categories_column {float: left; width: 190px;}


/* 3c.	Productslist
-------------------------------------------------------- */
.viewing {margin: 0; overflow: hidden; height: auto; 
		 padding-bottom: 15px; padding: 10px 15px;
 		 border-left: none; border-right: none; height: 100%;}
.viewing p {margin: 0; float: left;}
#viewAllCategories {float: right;}
#viewCategories {clear: both; padding-top: 10px;}
.productsList {clear: both; list-style: none; margin: 0; padding: 0;}
.productsList li {overflow: hidden; height: 100%; padding: 15px;}
	.productsList li img {float: left; margin-right: 15px;}
	.productsList li h3 {}
	.item_desc {margin: 0;}
	.item_more {margin: 0 0 0 15px; float: right; padding: 0px 10px; line-height: 22px; text-decoration: none;}
		a.item_more:hover {cursor: pointer;}
	p.item_price {float: right; line-height: 24px; font-weight: bold;}
.blockview {margin: 0px -15px 0px -16px; width: 980px; overflow: hidden; height: 100%; clear: both;}
.blockview .product_block {}
.viewstyle {float: right; line-height: 23px;}
	.viewstyle ul {margin: 0; padding: 0;}
	.viewstyle ul li {margin: 0; padding: 0; list-style: none; float: left;}
	.viewstyle ul li.viewTitle {margin-right: 10px;}
	.viewstyle ul li a {display: block; width: 30px; text-indent: -9999px;}
		.viewstyle ul li a.listviewButton {background-position: 0px 0;}
		.viewstyle ul li a.listviewButton:hover {background-position: -60px 0;}
		.viewstyle ul li a.blockviewButton {background-position: -30px 0;}
		.viewstyle ul li a.blockviewButton:hover {background-position: -90px 0;}
.pagination {float: right; margin-top: 15px;}
	.pagination ul {border: 0; margin: 0; padding: 0;}
	.pagination li {border: 0; margin: 5px 6px 0 0; padding: 0; list-style: none; float: left;}
	.pagination a {padding: 1px 8px;}
	.pagination .previous-off, .pagination .next-off {
		display: block; font-weight: bold; padding: 1px 8px;}
	.pagination .next a, .pagination .previous a {font-weight: bold;}
	.pagination .active {font-weight: bold; display :block; padding: 2px 9px;}
	.pagination a:link, .pagination a:visited {display: block; text-decoration: none;}
	.pagination a:hover {}
	
/* 3d.	ProductFocus
-------------------------------------------------------- */
.productFocus {margin: 0; padding: 15px; overflow: hidden; height: auto; 
			  border-left: none; border-right: none; height: 100%;}
.picShow {float: left;}
.productFocus_description {float: right; width: 360px;}
.productFocus_description h2 {font-weight: bold;}

.addToCart {margin: 0; padding: 5px 15px; overflow: hidden; height: 100%; position: relative;}
.productTabs {list-style: none; margin: 0; position: absolute; bottom: 0;}
	.productTabs li {float: left; margin-right: 4px;}
		.productTabs li a {display: block; padding: 7px 20px 3px 20px; text-decoration: none; font-size: 13px; font-weight: bold;
						-moz-border-radius-topright: 10px;  -moz-border-radius-topleft: 10px;
						-webkit-border-top-right-radius: 10px;  -webkit-border-top-left-radius: 10px;}
		.productTabs li a:hover {}
		.productTabs li a.current {}
.addToCart_price {float: right; padding: 5px 20px; margin: 0; font-size: 16px; font-weight: bold;}
.addToCart_submit {float: right; display: block; padding: 5px 20px 5px 45px;
				  font-size: 16px; font-weight: bold; text-decoration: none;}
.addToCart_submit:hover {text-decoration: underline;}
#description {clear: both;}


/* 3e.	User Reviews
-------------------------------------------------------- */
#userreviews {clear: both;}
.review {margin-bottom: 15px; overflow: hidden; height: 100%;}
.review_title {width: 930px; padding: 10px 10px 2px 10px;}
	.review_title h3 {}
.review_stars {font-size: 5px; height: 15px; 
			  text-indent:-100em; float: left; display: block; width: 75px; margin-right: 15px;}
	.one {background-position: 0px -60px}
	.two {background-position: 0px -45px}
	.three {background-position: 0px -30px}
	.four {background-position: 0px -15px}
	.five {background-position: 0px 0px}
.review_body {width: 930px; padding: 0 10px 2px 10px;}
	.review_body p {}
.review_author {width: 870px; padding: 40px 80px 0 0; text-align: right;}


/* 3f.	Cart
-------------------------------------------------------- */
.cart h2 {float: left; line-height: 30px; float: left; padding-right: 10px;}
.cart_items {float: left; margin: 0; padding: 0; line-height: 30px;}
.cart_update {float: right; font-size: 13px; margin: 0 0 7px 0;}
.cart_table {border-collapse: collapse; margin: 0; width: 950px; font-size: 13px; clear: both;}
.cart_table th {font-weight:bold;}
.cart_table thead th {}
.cart_table tbody {}
.cart_table tr {}
.cart_table td, .cart_table th {text-align: center;}
th.cart_table_headContents {text-align: left; text-indent: 10px;}
.cart_table_headEdit {}
td.cart_table_productDesc {text-align: left; font-weight: bold;}
.cart_table_productDesc img {margin: 5px 10px 5px 10px; padding: 0; vertical-align: middle; height: 40px}
.cart_table_productDesc ul {list-style: none; margin: 0; padding: 0; display: inline; margin-left: 10px; font-weight: normal;}
	.cart_table_productDesc ul li {display: inline; padding: 0 10px;}
.cart_table_editrow {}
	.cart_table_editrow td {text-align: left;}
.remove {font-size: 12px; margin: 0 6px;}
	
.total_table {border-collapse: collapse; margin: 0 0 10px 0; width: 950px;}
.total_table td {text-align: center; font-weight: bold; font-size: 13px;}
td.total_title {text-align: right; font-weight: bold; border: none; background: none; font-size: 14px; padding-right: 5px;}
td.total_clear {border: none; font-weight: normal; background: none; font-size: 12px; padding: 5px 7px 0 8px;}

.cart_continue {text-decoration: none; float: left;}
.cart_checkout {text-decoration: none; float: right;}


/* 3g.	Contact
-------------------------------------------------------- */
.contact_message {float: left;}
.contact_message h2, .contact_direct h2 {line-height: 30px;}
.contact_message form div, .contact_message form input, .contact_message form textarea {margin: 10px 0;}
.contact_message form div {text-align: right; font-weight: bold; padding-right: 10px; clear: both;}
.contact_direct {float: left;}
.contact_direct a {text-decoration: none;}
.contact_message input:focus, .contact_message textarea:focus {}
.contact .error {background: #fff; margin: 10px 0; padding: 0;}
.contact p.error {padding: 0; color: #c00; margin: 0 0 0 160px; border: none; background: none;}


/* --------------------------------------------------------
4.	Footer
-------------------------------------------------------- */
.footer {width: 970px; text-align: left; margin: 10px auto 10px auto;}
.footer a {margin: 0 3px;}
.footer a:hover {}
.copyright {float: right;}


/* --------------------------------------------------------
5.	Buttons adapted from: http://particletree.com/features/rediscovering-the-button-element/
-------------------------------------------------------- */
a.button, button.button {display:block; padding:5px 10px 6px 7px;
    line-height:130%; text-decoration:none; font-weight:bold; cursor:pointer;}
button.button {width:auto; overflow:visible; padding:4px 10px 3px 7px;}
button[type].button {padding:5px 10px 5px 7px; line-height:17px;}
*:first-child+html button[type]{padding:4px 10px 3px 7px;}
button.button img, a.button img{margin:0 6px -3px 0 !important;
    padding:0; border:none; width:16px; height:16px;}

/* Neutral */
button.button:hover, a.button:hover{}
a.button:active{}

/* Positive */
button.positive, a.positive{}
a.positive:hover, button.positive:hover{}
a.positive:active{}

/* Negative */
a.negative, button.negative{}
a.negative:hover, button.negative:hover{}
a.negative:active{}