/*******************
CONTENTS

1. BODY GARMENTS CSS
2. BODY PRODUCTS CSS
3. CART CSS
4. CONTACT FORM CSS
5. CONTENT CSS
6. FOOTER CSS
7. GALLERY CSS
8. HEADER CSS
9. HTML CSS
10. MENU CSS
11. PRODUCT DETAILS CSS
12. PRODUCT PREVIEW CSS
13. PRODUCTS CSS
14. SIDEBAR CSS
15. THICKBOX CSS
*******************/

/*******************
* 1. BODY GARMENTS CSS*
*******************/

#body-garments #sidebar h2 {
	color: #fff;
	display: block;
}

#body-garments #sidebar {
	padding-top: 0;
	border: 0;
	background-color: transparent;
}

#body-garments #sidebar a {
	color: #fff;
}

/*******************
* 2. BODY PRODUCTS CSS*
*******************/

body#body-products #content {
	width: 90%;
}

/*******************
* 3. CART CSS      *
*******************/

#cart img {
	border: 1px solid #000;
	vertical-align: middle;
}

#cart table {
	border-collapse: collapse;
	color: #000;
	width: 100%;
}

#cart th {
	background-color: #ccc;
	border: 1px solid #666;
}

#cart td {
	background-color: #fff;
	border: 1px solid #666;
	padding: .2em;
}

#cart td.quantity {
	width: 5em;
}

#cart td.quantity a img {
	border: 0;
}

#cart td.price {
	width: 15em;
}

#cart td.price_confirm {
	width: 10em;
}

#cart td.price .itemName {
	width: 3em;
}

#cart p#checkout {
	text-align: right;
}

#cart td .itemName {
	background-color: #fff;
	border: 0;
	color: #000;
	font-size: 1em;
	width: 90%;
}

#cart td .itemPrice {
	background-color: #fff;
	border: 0;
	color: #000;
	font-size: 1em;
	width: 5em;
}

/*******************
* 4. CONTACT FORM CSS*
*******************/

#contact-form, #details {
	float: left;
	width: 45%;
}

#details {
	margin-left: 5%;
}

#details a {
	color: #fff;
}

form#contact input[type=text], form#contact select, textarea {
	font-family: Arial, sans-serif;
	font-size: 1em;
	width: 20em;
}

form#contact p {
	margin: .5em 0;
}


/*******************
* 5. CONTENT CSS   *
*******************/

#content {
	color: #fff;
	float: left;
	margin: 0 1em;
	width: 65%;
}

#content p {
	margin-bottom: 1em;
}

#content .button {
	float: left;
	margin: 0 1em 0 0;
	text-align: center;
	width: 8em;
}

#content .button a {
	color: #fff;
	font-weight: bold;
}

#content .button a:hover {
	color: #f60;
}

#content .button a img {
	display: block;
	margin: 0 auto;
}

/*******************
* 6. FOOTER CSS    *
*******************/

#footer {
	clear: both;
	color: #ccc;
	font-size: smaller;
	text-align: center;
}

/*******************
* 7. GALLERY CSS   *
*******************/

ul#gallery {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

ul#gallery li {
	background-color: #f60;
	float: left;
	padding: .5em;
	margin: .5em;
}

ul#gallery a img {
	border: 0;
	width: 160px;
}

/*******************
* 8. HEADER CSS    *
*******************/

#header {
	background: #fff url('/images/header-bg.jpg') scroll no-repeat center center;
	clear: both;
	margin: 0 0 1em 0;
}

#header h1 {
	font-family: Georgia, serif;
	font-size: 2em;
	margin: 0;
}

#header h1 img {
	margin: 0 .5em 0 0;
	vertical-align: middle;
}

/*******************
* 9. HTML CSS      *
*******************/

body, html {
	background-color: #208020;
	font-family: Arial, sans-serif;
	margin: 0;
	padding: 0;
}

a img {
	border: 0;
}

h1, h2, h3, h4, h5, h6 {
	color: #fff;
	font-weight: normal;
	margin: 0 0 .5em 0;
}

ul {
	list-style-type: square;
	margin: 0 0 0 1em;
	padding: 0;
}

label {
	float: left;
	width: 12em;
}

/*******************
* 10. MENU CSS     *
*******************/

ul#menu {
	background-color: #f60;
	list-style-type: none;
	line-height: 2em;
	margin: 0;
	padding: 0;
}

ul#menu li {
	display: inline;
	padding: 0;
	margin: 0;
	text-align: center;
}

ul#menu li a {
	border: 1px solid #f60;
	color: #fff;
	padding: .4em 1.5em;
	text-decoration: none;
}

ul#menu li a:hover {
	border: 1px solid #fff;
	background-color: #fff;
	color: #000;
}

/*******************
* 11. PRODUCT DETAILS CSS*
*******************/

body#product-details {
	padding: 1em;
}

body#product-details p {
	margin-bottom: 1em;
}

body#product-details #size-info {
	position: relative;
	top: -1em;
	font-size: .9em;
	margin: 0;
}

body#product-details #description {
	background-color: #fff;
	float: right;
	padding: 1em;
	width: 386px;
}

body#product-details #description ul {
	list-style-type: square;
	margin: 0 0 1em 1em;
}

body#product-details label {
	display: inline;
	margin-left: 1em;
	float: none;
}

body#product-details h2 {
	color: #000;
	font-size: 1em;
	font-style: italic;
	font-weight: bold;
	margin-bottom: .25em;
}

/*******************
* 12. PRODUCT PREVIEW CSS*
*******************/

.product_preview {
	float: left;
	text-align: center;
	margin-top: 1em;
	width: 8em;
}

.product_preview img {
	display: block;
	margin: 0 auto;
}

.product_preview a {
	color: #fff;
	font-weight: bold;
	text-decoration: none;
}

.product_preview a:hover {
	color: #f60;
}

/*******************
* 13. PRODUCTS CSS *
*******************/

#products .product_preview img {
	margin: 0 auto .2em auto;
}

#products .product_preview {
	margin: 0 .25em;
	padding: .5em;
	width: 10em;
}


#products .product_preview p {
	margin-bottom: 0;
}

#products .product_row {
	clear: both;
}

/*******************
* 14. SIDEBAR CSS  *
*******************/

#sidebar {
	background-color: #fff;
	border: 1px solid #f60;
	border-top: .5em solid #f60;
	border-bottom: .5em solid #f60;
	color: #000;
	float: right;
	padding: 1em .5em;
	margin: .5em 1em;
	width: 16em;
}

#sidebar h2 {
	display: none;
}

#sidebar ul#alpacas {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#sidebar ul#alpacas li {
	clear: both;
	font-size: .8em;
	line-height: 2em;
}

#sidebar ul#alpacas img {
	background: transparent url('/images/alpaca_placeholder.png') no-repeat scroll top left;
	float: left;
	display: block;
	margin: 0 .5em .5em 0;
	vertical-align: middle;
	width: 100px;
	height: 75px;
}

/*******************
* 15. THICKBOX CSS *
*******************/

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> global settings needed for thickbox <<<-----------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
*{padding: 0; margin: 0;}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox specific link and font settings <<<------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_window {
	font: 12px Arial, Helvetica, sans-serif;
	color: #333333;
}

#TB_secondLine {
	font: 10px Arial, Helvetica, sans-serif;
	color:#666666;
}

#TB_window a:link {color: #fff;}
#TB_window a:visited {color: #fff;}
#TB_window a:hover {color: #fff;}
#TB_window a:active {color: #fff;}
#TB_window a:focus{color: #fff;}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox settings <<<-----------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_overlay {
	position: fixed;
	z-index:100;
	top: 0px;
	left: 0px;
	height:100%;
	width:100%;
}

.TB_overlayMacFFBGHack {background: url(macFFBgHack.png) repeat;}
.TB_overlayBG {
	background-color:#000;
	filter:alpha(opacity=75);
	-moz-opacity: 0.75;
	opacity: 0.75;
}

* html #TB_overlay { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

#TB_window {
	position: fixed;
	background: #f60;
	z-index: 102;
	color:#000000;
	display:none;
	border: 4px solid #f60;
	text-align:left;
	top:50%;
	left:50%;
}

* html #TB_window { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}

#TB_window img#TB_Image {
	display:block;
	margin: 15px 0 0 15px;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #666;
	border-left: 1px solid #666;
}

#TB_caption{
	height:25px;
	padding:7px 30px 10px 25px;
	float:left;
}

#TB_closeWindow{
	height:25px;
	padding:11px 25px 10px 0;
	float:right;
}

#TB_closeAjaxWindow{
	color: #fff;
	padding:7px 10px 5px 0;
	margin-bottom:1px;
	text-align:right;
	float:right;
}

#TB_ajaxWindowTitle{
	float:left;
	padding:7px 0 5px 10px;
	margin-bottom:1px;
}

#TB_title{
	background-color:#f60;
	height:27px;
}

#TB_ajaxContent{
	clear:both;
	padding:2px 15px 15px 15px;
	overflow:auto;
	text-align:left;
	line-height:1.4em;
}

#TB_ajaxContent.TB_modal{
	padding:15px;
}

#TB_ajaxContent p{
	padding:5px 0px 5px 0px;
}

#TB_load{
	position: fixed;
	display:none;
	height:13px;
	width:208px;
	z-index:103;
	top: 50%;
	left: 50%;
	margin: -6px 0 0 -104px; /* -height/2 0 0 -width/2 */
}

* html #TB_load { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}

#TB_HideSelect{
	z-index:99;
	position:fixed;
	top: 0;
	left: 0;
	background-color:#fff;
	border:none;
	filter:alpha(opacity=0);
	-moz-opacity: 0;
	opacity: 0;
	height:100%;
	width:100%;
}

* html #TB_HideSelect { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

#TB_iframeContent{
	clear:both;
	border:none;
	margin-bottom:-1px;
	margin-top:1px;
	_margin-bottom:1px;
}



