@charset "UTF-8";
/* CSS Document */
/*
 *
 *  @Id: product_ajax.css
 *  @Description: CSS used for the Product Detail ajax pop up on Attitude, Hot + New and Product category pages
 *  @Author: Tony Collings
 *  @Version: 1.0
 * 	@Date: June 2009
 *  
 */
/*	AJAX Content
	------------------------------------------------------------------------------------- */
	
	/* Category Popup (CLEAN) */
	#ajaxContent{ width: 728px; text-align: left; margin: 0px auto; background-color: #fff; }
	#popupWrapper {width: 728px; padding: 3px; background-color: #fff;  }
	/* CALC : Width = 728 - (6px padding(inherited) + 2px margin) = 8) = 720px. Remember your box model !!(http://www.w3.org/TR/CSS2/box.html) !! */
	#popupContent {width: 720px; border: 3px solid #2f2b2b; margin: 1px; background-color: #fff; } 
	#logo_close_container { float:left; width:720px; height:57px; background:url('../images/popup/right_bdr_top.gif') no-repeat top right; margin:0px; padding:0px;}
		.logo { width:160px; height:57px; margin:0px; padding:0px; float:left;}
		.close_btn { width:52px; height:16px; margin:15px 20px 0px 0px; display:block; float:right;}
	
	/* CALC : Width = 720 - (border-left 13px + border-right 10px) = 23) = 697px.
	/* NOTE : IE doesn't include borders in the box model so no need to add these ... why? because it's stupid ! */
	.main_content_container,
	#zoomedProductImage { width:697px; border-left:#BCBDC1 13px solid; border-right:#BCBDC1 10px solid; height:auto; float:left; margin:0px; padding:0px 0px -20px 0px; clear: both; }
	
	.bottom_corners { 
		_width: 707px;
		_margin-top:-5px;
		clear: both; 
		border-left:#BCBDC1 13px solid; 
		height:11px; 
		line-height:11px; 
		background:url('../images/popup/right_bdr_corner.gif') no-repeat bottom right;
	}
	.page_title { color: #882949; text-transform: uppercase; padding: 10px; font-weight: bolder;  }
	.description_sm {  font:12px Arial, Helvetica, sans-serif; padding: 10px; }
	.description_sm p { }
	div.ajaxLoading {text-align: center; font-size: 12px; padding: 20px; padding-top: 50px; }
	
	
	
	/* Product Detail Page (CLEAN) */
	
	/* CALC : 697px (inherited : .main_content_container ) / 2 = 348.5px (round down) */
	
	.content_left{width: 348px; float: left; text-align: left; font-size: 12px;   }
		.product_category {color: #882949; text-transform: uppercase; font-weight: bolder; font-size: 16px; margin: 10px 0px 5px 10px; }
		.product_title { background-color: #ebecee; border: 1px solid #bdbec0; border-left: none; padding: 10px 12px;   }
		.product_price { padding: 10px 0px 0px 10px; }
		.product_description {border: 1px solid #f2f2f2; padding: 5px; height: 200px; overflow: auto; /*margin: 30px 0px 0px 10px; Gap for pricing - will not be in Phase 1*/ margin: 10px 0px 0px 10px; width: 323px; }
		
	
		span.sizes {display: block; clear: both; padding: 7px 0px; line-height: 14.5px; }
		span.selected {display: block; clear: both; }	
		span.wtb { display: block; padding-top: 7px; clear: both; }
		
		ul#files {margin: 0px; padding: 7px 0px; list-style-type: none;  }
		ul#files li {margin: 2px 0px; }
	.content_right{ width: 348px; _width: auto; float: left; text-align: left; font-size: 12px; }
	
	div#product_preview { margin: 50px 0px 0px 0px; }
	div#product_preview img {clear: both; }
	div#product_preview	div#zoomBtn { text-align: right; clear: both; margin: 20px 25px 0px 0px;  }
	
	#product_insets {margin-left: 10px; width: 338px; margin-top: 10px; margin-bottom: 10px; }
	.product_inset_image {float: left; margin-right: 5px; }
	
	/* Accordion elements */
	div#productAccordion { margin-top: 10px; }
	h3.toggler { border: 1px solid #bdbec0; border-left: none; text-transform: uppercase; font-size: 12px; display: block; letter-spacing: .8px;  padding: 6px 12px 4px 12px; _padding-top: 4px;
	background: #fefefe url('img/main_stage/accordianToggleGradient.jpg') bottom left repeat-x; margin: 0px; }
	div.element { padding: 0px 10px; font-size: 11px;  }
	.mt_icon { padding-top: 2px; _margin-top: 4px; }

	
	
	/* Zoom DIV */
	div.zoomedImageContent {padding: 10px; width: 677px; }
	  .zoomedImageContent .zoom_title {color: #882949; text-transform: uppercase; font-weight: bolder; font-size: 16px; margin: 20px auto; etxt-align: center; }
	div#zoomImage {text-align: center; }
	p.loadingtext {text-align: center; font-size: 12px; padding: 30px 0px; }