div#CustomImageForThisProductOverlay
{
	position:absolute;
	top:0;
	background:transparent url('/images/layout/transparent.png') no-repeat center top; 
		background-size:contain;
		-moz-background-size:contain;
		-webkit-background-size:contain;
	width:100%;
	z-index:9999;
}

/*
Start of Products Area, it is place in dynamic css on the products page
This css is also used to set the majority of settings on Products, Productcartdisplay(Ecart), Productcartdeliveryform, Myorderslist
*/

div.ProductDetailsImagePanel, div.ProductDetailsDetailsPanel,
div.IndividualProductCategoryWrapper,
div.IndividualProductWrapper
{
/*    background-color:#333;*/
    outline: 2px solid rgba(155,129,88,0.9);
}

img#CurrentCategoryHeaderImage
{
	float:right;
	width:10%;
	height:auto;
	margin-left:2%;
	margin-bottom:15px;
}

form#ProductFormSearch
{
    float:right;
}    

div#OverallProductCategoryWrapper
{
    padding:0;
    width:100%;
    text-align:center;
}    

div#OverallProductWrapper
{
/*
    padding:10px 1% 10px 1%;
    width:98%;
*/
    text-align:center;
}    


div.IndividualProductCategoryWrapper,
div.IndividualProductWrapper
{
    padding-top:5px;
    padding-bottom:5px;
    margin-bottom:10px;
/* fixed - height */
/*
    min-height:500px;
    overflow-y:auto;
*/    
 }
 
div#OverallProductCategoryWrapper > div.IndividualProductCategoryWrapper > div.ProductCategoryTitle,
div#OverallProductWrapper > div.IndividualProductWrapper > div.ProductTitle
{
    font-size:1.4em;
    margin-bottom:10px;
}    

div#OverallProductCategoryWrapper > div.IndividualProductCategoryWrapper > div.ProductCategoryImage,
div#OverallProductWrapper > div.IndividualProductWrapper > div.ProductImage
{
/*
	overflow:hidden; 
	max-height:120px;
*/
    text-align:center;
    margin-bottom:10px;
}    
 
div#OverallProductCategoryWrapper > div.IndividualProductCategoryWrapper > div.ProductCategoryImage > a.navlink > img,
div#OverallProductWrapper > div.IndividualProductWrapper > div.ProductImage > a.navlink > img
{
/*
    width:100%;
    height:auto;
*/
    max-width:100%;
    max-height:100px; /*This will stop the boxes expanding to the height of the image */
    width:auto;
    margin-bottom:10px;
}    

div#OverallProductCategoryWrapper > div.IndividualProductCategoryWrapper > div.ProductCategoryDescription,
div#OverallProductWrapper > div.IndividualProductWrapper > div.ProductDescription
{
/*
	overflow:hidden; 
*/
	max-height:200px;
	overflow-y:auto;
}

div#OverallProductWrapper > div.IndividualProductWrapper > div.ProductPrices
{
/*
    overflow-y:scroll
    height:80px;
*/
}

@media screen and (max-width: 768px) 
{
	div#OverallProductWrapper > div.IndividualProductWrapper, div#OverallProductCategoryWrapper div.IndividualProductCategoryWrapper
	{
		width:44% !important; /* This overides the inline style */
		padding-left:1% !important; 
		margin-left:2% !important;
		padding-right:1% !important;
		margin-right:2% !important;
		height:inherit !important;
		float:left !important;
		overflow-y:inherit;
	}
	fieldset.ProductsFormAddtoCartButton, fieldset.ProductsFormAddButton
	{
		padding-left: 25%;
		padding-right:25%;
		width: 50%;
	}
}

@media screen and (max-width: 360px) 
{
	div#OverallProductWrapper > div.IndividualProductWrapper, div#OverallProductCategoryWrapper div.IndividualProductCategoryWrapper
	{
		width:94% !important; /* This overides the inline style */
		padding-left:1% !important; 
		margin-left:2% !important;
		padding-right:1% !important;
		margin-right:2% !important;
		clear:both !important;
		height:inherit !important;
		overflow-y:auto;
	}
	fieldset.ProductsFormAddtoCartButton, fieldset.ProductsFormAddButton
	{
		padding-left: 25%;
		padding-right:25%;
		width: 50%;
	}
}

/* -----------------End of Product and Product category CSS----------------------------------------------------------------------------------- */

/*
This is the productdetail section
*/
span.VarianceColumns
{
	float:left;
	width:33%;
}


div.targetarea
{
	position:relative;
	z-index:0;	
}

.magnifyarea
{
	margin-left:10%;
	margin-top:240px;
}

.ProductDetailsPanel
{
	width: 100%;
}

.ProductDetailsImagePanel
{
	width: 46%;
	padding:10px 1% 10px 1%;
	float: left;
	margin-right:2%;
}

div.ProductDetailsPanel > div.ProductDetailsImagePanel > div.targetarea.fixedta > img
{
	width:100% !important;
	height:auto !important;
}

.ProductDetailsDetailsPanel
{
	width: 48%;
	padding:10px 1% 10px 1%;
	float: left;
}

.ProductDetailsDetailsPanel h2
{
	padding-left:3%;	
}

.ProductDetailsDetailsPanel p
{
	width:96%;
	padding-left:2%;	
	text-align: justify;
}

.ProductDetailsDetailsPanel table
{
	width: 100%;
	margin-top: 20px;
	margin-left: 2%;
}

.ProductDetailsDetailsPanel table th
{
	text-align: left;
	width: 60%;
}
	

div.multizoom1.thumbs img
{
	width:22%;
	margin-right:2%;
	height:auto;
	float:left;
}
		
@media screen and (max-width: 360px) 
{
	img#multizoom1
	{
		width:100px;
		height:auto;
	}
	.ProductDetailsDetailsPanel
	{
		width:100%;
		clear:both;
	}
	.ProductDetailsImagePanel
	{
		width:100%;
		clear:both;
	}
}




/* **************** Product Variants **************** */

.VariantForm
{
	margin-top: 10px;
}

.VariantTypeForm
{
	display: none;
	padding:10%;
}

.VariantTypeForm h2
{
	margin: 0;
	font-size: 12px;
}

div.VariantTypeFormButtonsLeft, div.VariantTypeFormButtonsRight, div.VariantTypeFormButtonsCenter
{
	width:45%;
	margin-top:15px;
}

div.VariantTypeFormButtonsLeft
{
	float:left;
}

div.VariantTypeFormButtonsRight 
{
	float:right;
}

div.VariantTypeFormButtonsCenter
{
}

.VariantForm textarea#VariantFormComment
{
	width:96%;
	min-height:100px;
	margin-bottom:10px;
}
.VariantForm select
{
	margin-top:10px;
	clear:both;
}



/* ************ End of Product Variants ************* */

p#AdminDynamicCSSAlert
{
         display:none;
}
