/*************************************************************
SITE: 				ShuttersBeachStyle.com


xHTML/CSS AUTHORS: 	Christopher PallŽ for HotelsAtHome.com
Web sites:			www.chrispalle.com


productViews.css
This stylesheet is for the multi-page navigation bar, 
product listings, product detail page, add to bag form,
and related products. 

*************************************************************/	


@import url(base.css);

/*====================================================================== 
				New CSS for ART - by: Kenia G
====================================================================== */
ul.contentSubnav { margin: 10px 0 20px 0;}
ul.contentSubnav li {display: inline; margin: 0 0 0 65px;}
ul.contentSubnav li a {font-weight: bold; font-size: 1em; text-transform: uppercase}

#pgArt #prodPgNav {display: none;} /* Disables the page numbers */
#pgArt #listingContainer li.itemPrice {font-size: 1.1em;}

#pgArt #listingContainer { font-size: 11px; font-family: Arial}
#pgArt #listingContainer h3 a {font-family: Georgia; font-size: 11px; display:block; /*edited by steve*/ }
#pgArt #listingContainer li a { font-size: .9em;} /* controls the size item title */

#pgArt #ProdList { overflow: hidden;}
#pgArt #ProdList li { width: 200px;  padding: 0; margin: 0 0 30px 0}

#pgArt #ProdList #last {width:250px; height: 520px; float: right; left:-10px}
#pgArt #ProdList #last img { /*height: 420px; width: 165px;*/}

#pgArt #ProdList-horz li { margin-bottom: 30px}
#pgArt #ProdList-horz img { /*width: 450px; height: 100px; */}

#pgArt #ProdList-vert li { float: left; margin:0 35px 30px 0;}
#pgArt #ProdList-vert img { /*width:135px; height: 300px; */}
#pgArt #ProdList-vert h3 a {width:135px;}

/*================= Item Info ==================*/
#products-content-vert {overflow: hidden; margin: 0 0 25px 0}
#products-content-vert li { }
#products-content-vert h3,
#products-content-horz h3 {
	font: bolder .95em Georgia, "Times New Roman", Times, serif;
	color:#575781; margin: 0 0 1em 0;}
#products-content-vert p,
#products-content-horz p { font:normal .8em/1.3em Arial; color:#2b304e; padding: 20px 0}	
#products-content-vert .itemPrice,
#products-content-horz .itemPrice,
#products-content-vert span.salePrice,
#products-content-horz span.salePrice { font-size: .8em; font-weight: bold;}

#products-content-vert .itemPrice,
#products-content-horz .itemPrice {color:#6c6c91;}

#products-content-vert .products-img { width: 165px; }
#products-content-vert .products-img img { /*width: 165px;height: 580px; */}

#products-content-vert .products-decr { width: 555px; margin:17px 35px 0 20px; }
.column { float: left;}

#pgArt #products-content-vert #itemTable { width: 550px; padding: 0; margin: 30px 0 10px 0;}
#pgArt #products-content-vert #itemTable .itemContainer { width:260px;/* width:200px; edited by steve*?}

#products-content-horz { margin:  0 0 25px 0}
#products-content-horz .products-img { width: 760px; }
#products-content-horz .products-img img { /*width: 758px;height: 163px; */}
#products-content-horz .products-decr { width:730px; margin:17px 65px 0 15px;}

#pgArt #products-content-horz #itemTable {  width:730px; padding: 0; margin: 30px 0 15px 0;}
/* #pgArt #products-content-horz #itemTable .itemContainer { width:220px;} edited by steve*/
#pgArt #itemTable .itemContainer {width:415px; /*edited by steve*/}

/*------------- Styles for Shopping Utilities ----------------*/
#pgArt #detailUtilities {
	font: normal .7em Georgia,"Times New Roman",Times,serif;
	position: relative;
	color: #262B4A;
	line-height: 2em;
	clear:both;
}

#pgArt #detailUtilities a,
#pgArt #detailUtilities a:hover  { text-decoration:  none; }

#pgArt #detailUtilities li#contShopping {
	padding-left: 20px;
	background: url(../../images/icons/icon-continueshoping.gif) no-repeat 0 50%;
}

#pgArt #detailUtilities li#fwdToFriend {
	padding-left: 20px;
	background: url(../../images/icons/icon-emailafriend.gif) no-repeat 0 50%;
}


#pgArt #detailUtilities li#printPage {
	padding-left: 20px;
	background: url(../../images/icons/icon-printpage.gif) no-repeat 0 50%;
	
}

#pgArt #detailUtilities li#viewAtHotel {
	padding-left: 20px;
	background: url(../../images/icons/icon-viewathotel.gif) no-repeat 0 50%;
}


/*====================== End of new CSS for ART ======================*/
.alt-views {height:108px;}
.alt-views li{ display:block; width:100px; height:106px; float:left; margin: 5px 5px 0 0;}

ul.list { margin:10px 20px;}
ul.list li{list-style: disc; margin: 2px; font-size:10px; font-family: arial; }

/*********************** CATEGORY LISTING ***************/

#categoryImage {
	float: left;
	width: 203px;
	height: 574px;
}

#pgBeach #categoryImage {
	background: white url(../../images/categories/category_001.jpg) no-repeat;
}

#pgLiving #categoryImage {
	background: white url(../../images/categories/category_005.jpg) no-repeat;
}

#pgBed #categoryImage {
	background: white url(../../images/categories/category_002.jpg) no-repeat;
}

#pgBath #categoryImage {
	background: white url(../../images/categories/category_003.jpg) no-repeat;
}

#pgGifts #categoryImage {
	background: white url(../../images/categories/category_004.jpg) no-repeat;
}

#pgArt #categoryImage {
	background: white url(../../images/categories/category_007.jpg) no-repeat;
}
#pgSale #categoryImage {
	background: white url(../../images/categories/category_006.jpg) no-repeat;
}


/*------------- Styles for multipage listing Nav --------*/

#prodPgNav {
	height: 2em;
	padding: 15px 30px 0px 0px;
	float: right;
	text-align:right;
	font-family: "Times New Roman",Times,serif;
}


#prodPgNav h3 {
	float: left;
	padding-right: 1em;
	font-weight:lighter;
	display:inline;
	font-size: 1.1em;
}

#prodPgNav ul {
	font-size: 1.1em;
	display:inline;
}

#prodPgNav ul li {
	float:left;
}

#prodPgNav span {
	display:none;
}

#prodPgNav span.pipe { 
	display: inline;
	margin: 0px .8em;
}

#prodPgNav a { 
	color:black;
	text-decoration:underline; 
}

#prodPgNav a:hover { 
	text-decoration: none;
}

/*------------- Styles for item boxes ----------------*/
/*------ with help from George http://www.gunlaug.no ---*/

#listingContainer {
	position: relative;
	width: 517px;
	float: right;
	z-index: 1;
}

div.item {
	text-align: left;
	font-size: 90%;
	position: relative;
	float: left;
	width: 195px;
	margin-top: 15px;
	margin-right: 60px;
	margin-left: 0;
	padding: 0;
	display: inline;  /* IE Fix */
	min-height: 240px;
}

div.item h3.itemName {
	font-size: 90%;
	position: static;
	margin:0;padding:0;
	/*width:193px;
	display:block;*/
}

#pgArt div.item h3.itemName {
	font-size: 120%;
}

div.item ul li.itemPrice {
	font-family: arial, verdana, sans-serif;
	font-size: 90%; 
}

.salePrice {
	color: #ff0000;
}

div.item ul li.itemSalePrice {
	font-family: arial, verdana, sans-serif;
	font-size: 90%;
}

div.item img {
	position: relative;
	top: 0px;
	left: 0;
	width:193px;height:177px;margin:0;padding:0;
}


/*********************** PRODUCT DETAIL ***************/

div#prodDetail {
	float: right;
	color:#575781;
	width: 372px;
	margin-top:16px;
	margin-right: 21px;
	display:inline; /*IE 6 Float Fix */
}

div#prodLarge,img#prodLarge {
	display:block;
	float: left;
}

div#prodDetail h3 {
	color: #575781;
	font-weight: bolder;
	font-size: .9em;
	margin-bottom: .7em;
}

ul#prodSpecs {
	font: bold .8em Georgia,"Times New Roman",Times,serif;
	color: #6C6C91;
	margin-bottom: 2.1em;
}

ul#prodSpecs #itemPrice {
}

ul#prodSpecs #itemSalePrice {
	color:  #6C6C91;
}


div#prodDetail p.itemDesc {
	font: normal .8em Arial,Helvetica,sans-serif;
	line-height: 140%;
	margin-right: 20px;
	margin-bottom: 2.1em;
	color: #262B4A;
}

ul#recipe {
padding:0;margin:0;
}

ul#recipe li {
font: normal .8em Arial,Helvetica,sans-serif;
color: #262B4A;
float:left;
padding-right:25px;
padding-top:10px;
}

#detailUtilities {
	font: normal .7em Georgia,"Times New Roman",Times,serif;
	position: relative;
	color: #262B4A;
	line-height: 2em;
	clear:both;
}

#detailUtilities a {
	text-decoration:  none;
}

#detailUtilities a:hover {
	text-decoration:  none;
}

/*------------- Styles for Shopping Utilities ----------------*/

#prodDetail #detailUtilities li#contShopping {
	padding-left: 20px;
	background: url(../../images/icons/icon-continueshoping.gif) no-repeat 0 50%;
}

#prodDetail #detailUtilities li#fwdToFriend {
	padding-left: 20px;
	background: url(../../images/icons/icon-emailafriend.gif) no-repeat 0 50%;
}


#prodDetail #detailUtilities li#printPage {
	padding-left: 20px;
	background: url(../../images/icons/icon-printpage.gif) no-repeat 0 50%;
	
}

#prodDetail #detailUtilities li#viewAtHotel {
	padding-left: 20px;
	background: url(../../images/icons/icon-viewathotel.gif) no-repeat 0 50%;
}

#prodDetail ul#viewAtHotel-detail {
 	display:none;
}

#viewAtHotel-detail {
	position:absolute;
	top:-50px;
	left:0;
	background-color: white;
	text-align: center;
	border: solid 1px #000000;
	padding: 0 .5em;
	z-index:105;
}

#viewAtHotel-detail .closeDetail {
	position: absolute;
	top:-15px;
	right:-1px;
	font-size: .9em;
	background:white url(../../images/misc/hover-top-tab-right.gif) 100% -1px no-repeat;
	border-top: solid 1px #000000;
	z-index:15;
	padding: 0px 6px 3px 0px;
}

#viewAtHotel-detail .closeDetail a {
	display: block;
	background:white url(../../images/misc/hover-top-tab-left.gif) 0 -12px no-repeat;
	padding-left: 6px;
	padding-top: 3px;
}

#viewAtHotel-detail h6 {
	font-size: 1em;
	margin-top: .8em;
	text-align: left;
}

#viewAtHotel-detail img.closeUp {
	padding: .5em 1em 1em 1em;
}



/*--------------------- ADD TO SHOPPING BAG FORM --------*/

#addToBag {
	clear: both;
	color: #262B4A;

}

#addToBag h4 {
	display: none;
}

#itemTable {
	position:relative;
	border-collapse: collapse;
	font: normal .8em Arial,Helvetica,sans-serif;
	width: 742px;
	margin: 20px 20px 0px 10px;
}

#itemTable td, #itemTable tr, #itemTable th   {
	position:relative;
	border-bottom: 1px solid #C4C4D3;
	z-index:10;
}

#itemTable td {
	padding: 1em 0em;
	position: relative;
}

#itemTable th {
	font-weight:lighter;
	color: #8989A7;
	text-transform: uppercase;
	text-align: left;
}

#itemTable tr.itemRow h5 {
	font: bolder 1em Georgia, "Times New Roman", Times, serif;
	margin-bottom: 10px;

}

#itemTable tr.itemRow {
	color:#25255B;
}

#itemTable tr.itemRow td input {
	/*margin-left: 2em;*/
	border: 1px solid #C4C4D3;
	text-align: center;
}

#itemTable tr.total, #itemTable tr.total td {
	border-bottom: 0 none;
	font-size: 1em;
}

#itemTable tr.total td input {
	margin-left: 2em;
}

span#autoTotal {
	font-weight: bold;
	margin-left: 2em;
}

#itemTable .itemContainer {
	width: 320px;
	position:relative;
}

#itemTable tr.itemRow ul.itemDesc_A {
	display:block !important;
}


/*-----------related items ("you may also like") links -------*/
#relatedItems h4 {
	font: bold .8em Arial,Helvetica,sans-serif;
}


#relatedItems ul {
	margin: 10px; 
	height: 150px;
}

#relatedItems ul li {
	float: left;
	width: 240px;
	position: relative;
}

#relatedItems ul li h5 {
	font: normal .7em Georgia, "Times New Roman", Times, serif;
	position: relative;
	top: 130px;
	font-weight: lighter;
}

#relatedItems ul li img {
	position: absolute;
	top: 0px;
	left: 0px;
}

/*--------------------- Pop-up Detail View Styles --------*/

#itemTable tr.itemRow ul {
 	display:none;
}

.prodCloseupView {
	position:absolute;
	top:-200px;
	left:0;
	background-color: white;
	text-align: center;
	border: solid 1px #000000;
	padding: 0 .5em;
	z-index:105;
}

.prodCloseupView .closeDetail {
	position: absolute;
	top:-15px;
	right:-1px;
	font-size: .9em;
	background:white url(../../images/misc/hover-top-tab-right.gif) 100% -1px no-repeat;
	border-top: solid 1px #000000;
	z-index:15;
	padding: 0px 6px 3px 0px;
}

.prodCloseupView .closeDetail a {
	display: block;
	background:white url(../../images/misc/hover-top-tab-left.gif) 0 -12px no-repeat;
	padding-left: 6px;
	padding-top: 3px;
}

.prodCloseupView h6 {
	font-size: 1em;
	margin-top: .8em;
	text-align: left;
}

.prodCloseupView img.closeUp {
	padding: .5em 1em 1em 1em;
}

/**************************** Search Styles ******************/

/*------------- Styles for multipage listing Nav --------*/

#prodPgNav {
	height: 2em;
	padding: 15px 30px 0px 0px;
	float: right;
	text-align:right;
}


#prodPgNav h3 {
	float: left;
	padding-right: 1em;
	font-weight:lighter;
	display:inline;
	font-size: 1em;
}

#prodPgNav ul {
	font-size: 1em;
	display:inline;
}

#prodPgNav ul li {
	float:left;
}

#prodPgNav span {
	display:none;
}

#prodPgNav span.pipe { 
	display: inline;
	margin: 0px .8em;
}


#prodPgNav a:hover { 
	color:black;
	text-decoration:underline; 
}

/*------------- Styles for item boxes ----------------*/
/*------ with help from George http://www.gunlaug.no ---*/

#pgSearch #mainContent h2 {
	display: block !important;
	color: #575781;
	font: normal lighter 1.5em Georgia,"Times New Roman",Times,serif;
	margin-top: 30px;
	margin-left: 10px; 
}

#pgSearch #mainContent p#resultsCount {
	font-family: arial, verdana, sans-serif;
	color: grey;
	margin-left: 10px;
}

#pgSearch #listingContainer {
	float: none !important;
	width: 745px;
	padding: 10px 13px;
	margin-top: 20px; clear:both; overflow:hidden;
}

#pgSearch div.resultsItem {
	padding: 10px 0;
	font: normal .9em arial, verdana, sans-serif;
	text-align: left;
	line-height: 120%;
	border-top: 1px solid #C4C4D3; 
	float:none; clear:both;overflow:hidden;
}

#pgSearch .itemName  { padding:0 5px; }

#pgSearch .itemName a  {
	font: bolder 1.1em Georgia, "Times New Roman", Times, serif;
	display:block;}

#pgSearch div.resultsItem ul li.itemPrice {
	padding: 2px; float:right !important;}


.resultsItem ul li {float:left;}
.itemSKU  {display:block; color:#666}

