/* Main Elements */
* { margin: 0; padding: 0 }
body {font-family: georgia; font-size: 13px; background-image: url(../images/bg.jpg);}
.clear {clear: both;}
img {border: none; margin: 0; padding: 0;}
h1 {font-size: 17px; color: #333; margin-bottom: 5px;}
h2 {font-size: 16px; color: #444; margin-bottom: 5px;}
h3 {font-size: 15px; color: #555; margin-bottom: 5px;}
a {text-decoration: none; color: #B92233;}
a:hover {text-decoration: underline;}
hr {color: #ccc; background-color: #ccc; border: none; height: 1px; margin-bottom: 10px;}

/* Logo */
a.logo {
	display: inline-block; 
	width: 229px; 
	height: 99px;
	position: absolute;
	top: 28px;
	left: 38px;
	z-index: 5;
	background: transparent url(../images/brewer-mama-logo.png) no-repeat;
}
a.logo:hover {background-position: 0 -99px;}
a.logo span {display: none;}

/* Photos */
.photos-left {position: absolute; top: 133px; left: 3px;}
.photos-right {position: absolute; top: 89px; left: 1070px;}
.trees {position: absolute; top: -5px; left: 0; z-index: 1;}

/* Shopping Bag */
#shopping-bag {position: absolute; top: 5px; left: 630px; height: 54px; width: 411px; background-image: url(../images/shopping-bag-bg.png); z-index: 20;}
#shopping-bag-content {margin: 5px 33px 5px 13px; width: 366px; }
#shopping-bag #details {float: left; margin-top: 2px; line-height: 18px; font-size: 12px; color: #60615E;}
#shopping-bag #num-items a {color: #D45D3F; font-weight: bold; text-decoration: none;}
#shopping-bag #num-items a:hover {text-decoration: underline;}
#shopping-bag #price {font-family: times new roman; font-size: 14px;}
#shopping-bag #links {float: right; line-height: 18px; text-align: right;}
#shopping-bag #utility {color: #60615E;}
#shopping-bag #utility a {font-size: 11px; text-decoration: none; color: #977B51;}
#shopping-bag #utility a:hover {text-decoration: underline;}
#shopping-bag #checkout a {font-size: 12px; font-weight: bold; text-decoration: none; color: #BA2334; position: relative; top: -1px;}
#shopping-bag #checkout a:hover {text-decoration: underline;}

a.bag-icon {
	float: left;
	margin: 0 15px;
	display: inline-block; 
	width: 27px; 
	height: 40px;
	background: transparent url(../images/brewer-mama-shopping-bag.png) no-repeat;
}
a.bag-icon:hover {background-position: 0 -40px;}

/* Nav Bar */
#nav-bar {
	width: 798px;
	height: 48px;
	background-image: url(../images/nav-bg.png);
	position: relative;
	top: 5px;
	left: 100px;
	z-index: 3;
}

#nav-links-wrapper {position: relative; top: 10px; left: 20px;}
#nav-bar a {margin-left: 5px;}
#nav-bar a span {display: none;}

a.nav-soaps {
	display: inline-block; 
	width: 91px; 
	height: 31px;
	position: relative;
	background: transparent url(../images/gift-soaps.png) no-repeat;
}
a.nav-soaps:hover {background-position: 0 -31px;}
.soaps-on a.nav-soaps {background-position: 0 -31px;}

a.nav-boxes {
	display: inline-block; 
	width: 132px; 
	height: 32px;
	position: relative;
	top: 2px;
	background: transparent url(../images/handmade-gift-boxes.png) no-repeat;
}
a.nav-boxes:hover {background-position: 0 -30px;}
.gift-boxes-on a.nav-boxes {background-position: 0 -30px;}

a.nav-favors {
	display: inline-block; 
	width: 158px; 
	height: 32px;
	position: relative;
	top: 1px;
	background: transparent url(../images/handmade-party-favors.png) no-repeat;
}
a.nav-favors:hover {background-position: 0 -32px;}
.party-favors-on a.nav-favors {background-position: 0 -32px;}

a.nav-contact {
	display: inline-block; 
	width: 117px; 
	height: 31px;
	position: relative;

	left: 230px;
	background: transparent url(../images/contact-brewer-mama.png) no-repeat;
}
a.nav-contact:hover {background-position: 0 -31px;}
.contact-on a.nav-contact {background-position: 0 -31px;}

#admin-nav {background-color: white; padding: 3px 6px; position: absolute; left: 275px; top: 10px; font-size: 11px;}
#admin-nav a {margin-left: 6px;}

/* Content */
.top-rip {float: left; position: relative; top: 0px; left: 24px; z-index: 3;}
.bottom-rip {float: left; position: relative; top: -4px; left: 20px; z-index: 3;}

#container {
	position: relative;
	top: 66px;
	left: 148px;
	width: 930px;
		float: left;
}

#content-container {
	float: left;
	width: 930px;
	background-image: url(../images/stars-bg.png);
	background-repeat: repeat-y;
}

#content-wrapper {
	float: left;
	width: 890px;
	background-image: url(../images/content-bg.png);
	position: relative;
	left: 18px;
	top: 0px;
	min-height: 480px;
	z-index: 3;
}

#content {float: left; margin: 0 6px; padding: 10px 15px; width: 848px; background-color: white;}

.intro-text {width: 610px; padding: 5px; border: 1px solid #ccc; background-color: #f8f8f8; color: #222;}
.welcome-image {float: left; margin-right: 15px;}

#popular .small-product, #recent .small-product {position: relative; left: -5px;}

/* Flash Messages */
#flash-notice {padding: 10px 15px; border: 1px dashed #87A16A; background-color: #DFEFCE; margin-bottom: 10px;}
#flash-error {padding: 10px 15px; border: 1px dashed #B92233; background-color: #F4DFDF; margin-bottom: 10px;}

/* Headers */
.title {overflow: hidden; background-repeat: no-repeat; height: 0px !important; /* for most browsers */}
h2#collection {padding: 39px 0 0 0; width: 253px; background-image: url("../images/fall-'08-collection.png"); height /**/:39px; /* for IE5.5's bad box model */}

h1#gift-boxes-title {padding: 25px 0 0 0; width: 133px; background-image: url("../images/gift-boxes-title.png"); height /**/:25px; /* for IE5.5's bad box model */}
h1#party-favors-title {padding: 26px 0 0 0; width: 163px; background-image: url("../images/party-favors-title.png"); height /**/:26px; /* for IE5.5's bad box model */}
h1#soaps-title {padding: 26px 0 0 0; width: 66px; background-image: url("../images/soaps-title.png"); height /**/:26px; /* for IE5.5's bad box model */} 
h1#contact-title {padding: 24px 0 0 0; width: 121px; background-image: url("../images/contact-title.png"); height /**/:24px; /* for IE5.5's bad box model */} 

/* Home Page */
#side-col {width: 190px; float: right; position: relative; top: 4px; left: 2px;}
#popular, #recent {width: 180px; float: left; margin-bottom: 10px;}
#past-collections {float: left; width: 100%; margin-top: 10px;}

/* Forms */
.new-product {float: left; margin: 0 60px 30px 0; min-width: 200px; padding: 10px; background-color: #f8f8f8; border: 1px solid #ccc;}
.new-product legend {padding: 3px; font-size: 12px; color: #D45D3F; font-weight: bold;}

/* Previews */
#preview-wrapper {width: 645px;}
#preview-wrapper p {width: 630px;}
.preview-product {float: left; margin: 10px 18px 0 0; width: 196px;}
.preview-product a.product-link {float: left;}
.preview-product a.product-link img {padding: 2px; font-size: 1px; border: 1px dashed #ddd;}
.preview-product span {float: left; padding-right: 4px; border-right: 1px solid #aaa; margin: 2px 4px; font-size: 11px; color: #444;}
.preview-product h2 {float: left; font-size: 11px; margin: 3px 0; width: 136px;}
.preview-image {height: 143px; width: 190px;}

#product-details input {margin: 0; padding: 0;}

#collections {
	float: right;
	width: 180px;
	margin-bottom: 25px;
	height: 200px;
	padding: 4px 8px;
	font-size: 12px;
	color: #444;
}
#collections a {margin-left: 4px;}
.collections-title {height: 46px; width: 221px; background-image: url(../images/collections-tag.png); background-repeat: no-repeat; position: relative; left: -8px; margin-bottom: 5px;}
.collections-title h2 {font-size: 12px; color: #625235; position: relative; top: 15px; left: 12px;}

/* Thumbnails */
.small-product {float: left; margin-right: 10px; margin-bottom: 10px; width: 202px;}

.small-product h2 {margin: 0; padding: 0; font-size: 11px; float: left;}
.small-product p {float: left; font-size: 11px;}
.small-product a {font-size: 11px; color: #8F7D59;}
.small-product a.product-link {float: left; margin-right: 5px;}
.small-product a.product-link:hover img {border: 1px solid #8F7D59;}
.small-product a.product-link img {padding: 2px; font-size: 1px; border: 1px dotted #ddd;}
.sp-description {float: left; width: 138px;}
.small-image {width: 53px; height: 40px;}

a.all-product-link {color: #BA2334;}
a.all-product-link:hover img {border: 1px solid #BA2334;}
a.soaps-product-link {color: #D45D3F;}
a.soaps-product-link:hover img {border: 1px solid #D45D3F;}
a.gift-boxes-product-link {color: #586F3E;}
a.gift-boxes-product-link:hover img {border: 1px solid #586F3E;}
a.party-favors-product-link {color: #BF762F;}
a.party-favors-product-link:hover img {border: 1px solid #BF762F;}

/* My Bag */
.line-item {width: 100%; height: 46px; margin-bottom: 20px; font-size: 12px;}
.update-line h3 {display: inline-block; font-size: 12px; float: left; margin-top: 2px; color: #444;}
.update-line .price-each {float: left; display: inline-block; font-size: 11px; margin: 2px 5px 0 2px;}
.line-item .update-line {float: left; margin-top: 2px;}
.line-item .price-line {float: left; color: #555; position: relative; top: -3px;}
.line-item .price-line a {margin-left: 10px; font-size: 10px; color: #977B51;}
.update-button {font-size: 11px; margin-left: 3px; position: relative; top: -1px;}
.quantity-input {margin-left: 5px; margin-top: 1px; height: 15px;}
.line-item form {float: left;}

.line-item input {float: left; margin: 0 0 0 3px; padding: 0;}
.line-item a.line-item-link {float: left; margin-right: 10px; border: 1px solid #eee; font-size: 1px; padding: 2px;}
.line-item a.line-item-link:hover {border: 1px solid #aaa;}

input.empty {font-size: 9px; margin-top: 100px;}

/* Login & Signup */
#login-box {float: left; margin: 10px 0 0 0;}
#sign-up-box {float: left; margin: 5px 0 0 0;}

/* Form */
fieldset {padding: 10px; background-color: #f9f9f9; border: 1px solid #ccc; margin-bottom: 10px;}
legend {padding: 3px; font-size: 12px; color: #D45D3F; font-weight: bold;}
select, input {margin: 2px 10px 8px 0;}
fieldset p {font-size: 11px; color: #666; margin: -2px 0 8px 0;}

/* Product Page */
.product-photo {}
#product-image {float: left; height: 200px; width: 267px; margin-right: 15px;}
#product-details {float: left; margin-bottom: 15px; width: 343px;}
#product-wrapper {}
#related-products {float: left; width: 100%;}
.small-details {font-size: 11px;}

.by {color: #777; font-size: 10px;}
#product-message {height: 200px; width: 267px; position: absolute; top: 9px; left: 20px; border: 1px solid #ddd; background-color: #F7FF6F; text-align: center;}
#product-message p {margin: 70px 0;}
#subcategories {
	float: right;
	margin-left: 25px;
	width: 180px;
	margin-bottom: 25px;
	height: 200px;
	padding: 4px 8px;
	font-size: 12px;
	color: #444;
}
#subcategories a {margin-left: 4px;}

#soaps-wrapper #subcategories a, #soaps-wrapper #product-wrapper a {color: #BF4E2F;}
#gift-boxes-wrapper #subcategories a, #gift-boxes-wrapper #product-wrapper a {color: #586F3E;}
#party-favors-wrapper #subcategories a, #party-favors-wrapper #product-wrapper a {color: #BF762F;}

/* My Account */
.purchase-history {margin-left: 15px; color: #555; font-size: 12px;}
.logout-link {float: right;}

/* Footer */
#footer {
	float: left;
	height: 53px;
	width: 941px;
	background-image: url(../images/footer-bg.png);
	position: relative;
	left: -8px;
	top: -20px;
}

#footer-content {position: relative; top: 24px; left: 48px; font-size: 11px;}
#footer #message {font-size: 11px; color: #4F4F4F; font-style: italic;}
