/*********************************************************/
/******************** MAIN IMAGE *************************/
/*********************************************************/

#Main-Image-Box{
	float: left; 
	position: relative;
	width: 100%;
	margin: 0 0 15px;
	text-align: center;
	overflow: hidden;
}

#Quick-Image{
	float: left;
	width: 100%;
	position: relative;
}

/* 
 * Main Image Box height needs to be static, and should be equal to width to create a rectangle
 * to ensure proper image display. Line height (-6px of height) vertically centers the image. 
 * This needs to be set manually for each customer.
 */

#Main-Image-Box{
	height: 558px;
	line-height:554px;
}

@media only screen and (min-width: 1176px) {
	#Main-Image-Box{
		height: 676px;
		line-height:672px;
	}
}
@media only screen and (min-width: 784px) and (max-width: 1023px) {
	#Main-Image-Box{
		height: 754px;
		line-height:750px;
	}
}
@media only screen and (min-width: 588px) and (max-width: 783px) {
	#Main-Image-Box{
		height: 558px;
		line-height:552px;
	}
}
@media only screen and (min-width: 420px) and (max-width: 587px) {
	#Main-Image-Box{
		height: auto;
		line-height: normal;
	}	
}

/*** Main Image ***/

#Main-Image{
	display: inline-block;
	line-height: 0;
	text-align: center;
	vertical-align: middle;
	max-width: 100%;
	max-height: 100%;
	overflow: hidden;
}

#Main-Image img{
	float: left;
	max-width: 100%;
	max-height: 100%;
}

#Main-Image img.zoomImg{
	cursor: crosshair;
}

/*** ZOOM INFO TEXT ***/

#Main-Image-Box:after {
	content:'';
	width: 39px;
	height: 39px;
	position:absolute; 
	bottom: 15px;
	right: 15px;
	background-image: url('//images.esellerpro.com/2189/198797/images/obj/zoom.png');
}

/*** NEXT / PREV ***/

#Next,#Prev{
	top: 50%;
	margin-top: -24px;
	position: absolute;
	width: 48px;
	height: 48px;
	cursor: pointer;
	z-index: 110;
}

#Next{
	right: 0px;
	background:url('//images.esellerpro.com/2189/198797/images/elem/arrow-right.png') no-repeat center center;
}

#Prev{
	left: 0px;
	background:url('//images.esellerpro.com/2189/198797/images/elem/arrow-left.png') no-repeat center center;
}

/*********************************************************/
/******************** THUMBNAILS *************************/
/*********************************************************/

#Thumbnails{
	float: left;
	width: 100%;
	margin-bottom: 15px;
}

#Thumbnails .Thumbnail{
	float: left;
	width: 16.66%;
	margin: 0 0 15px;
	padding: 0 15px 0 0;
	line-height: 0;
	text-align: center;
}

#Thumbnails a{
	width: 100%;
	height: 100%;
	display: inline-block;
	background-color: #ffffff;
	padding: 4px;
	border: 1px solid #cfdbe4;
	vertical-align: middle;
}

#Thumbnails a.Selected{
	border: 2px solid #229FE7;
	padding: 3px;
}

#Thumbnails a div{
	display: inline-block;
	line-height: 0;
	text-align: center;
	vertical-align: middle;
	max-width: 100%;
	max-height: 100%;
	overflow: hidden;
}

#Thumbnails a div img{
	float: left;
	max-width: 100%;
	max-height: 100%;
}

/* 
 * Thumbnails a automatically centers images horizontally and vertically, but has to have the height set manually to create a cool rectangle. 
 */

#Thumbnails .Thumbnail{
	height: 78px;
	line-height: 64px;
}

@media only screen and (min-width: 1176px) {
	#Thumbnails .Thumbnail{
		height: 98px;
		line-height: 84px;
	}
}
@media only screen and (min-width: 784px) and (max-width: 1023px) {
	#Thumbnails .Thumbnail{
		height: 111px;
		line-height: 97px;
	}
}
@media only screen and (min-width: 588px) and (max-width: 783px) {
	#Thumbnails .Thumbnail{
		height: 78px;
		line-height: 64px;
	}
}
@media only screen and (max-width: 587px) {
	#Thumbnails .Thumbnail{
		width: 20%;
		height: auto;
		line-height: normal;
	}
}

/*********************************************************/
/******************** SPECIFICS **************************/
/*********************************************************/

#SKU-Container{
	float: right;
	border: 1px solid #e2e2e2;
	border-radius: 8px;
	font-family: "Roboto";
	text-transform: uppercase;
	color: #686868;
	font-size: 0.7em;
	font-weight: bold;
	padding: 3px 8px 4px;
	margin: 0 0 15px;
}

#SKU-Container #SKU{
	color: #dd2d1e;
}

#Brand{
	float: left;
}

#Title{
	color: #282828;
	font-weight: 300;
	font-size: 1.5em;
}

#Stock{
	font-weight: bold;
	font-family: "Roboto";
	color: #7ab41e;
	text-transform: uppercase;
	font-size: 0.8em;
	margin-bottom: 25px;
	padding-left: 18px;
	background-image: url('//images.esellerpro.com/2189/198797/images/elem/tick-green.png');
	background-repeat: no-repeat;
	background-position: left;
	line-height: 13px;
}

#Availability{
	font-weight: bold;
	font-family: "Roboto";
	color: #f79d00;
	text-transform: uppercase;
	font-size: 0.8em;
	margin-bottom: 25px;
	padding-left: 18px;
	background-image: url('//images.esellerpro.com/2189/198797/images/elem/info.png');
	background-repeat: no-repeat;
	background-position: left;
	line-height: 13px;
}

#Out-Of-Stock{
	font-weight: bold;
	font-family: "Roboto";
	color: #DC2C1D;
	text-transform: uppercase;
	font-size: 0.75em;
	margin-bottom: 25px;
	padding-left: 18px;
	background-image: url('//images.esellerpro.com/2189/198797/images/elem/remove.png');
	background-repeat: no-repeat;
	background-position: left;
	line-height: 12px;
}

#Description{
	float: left;
	width: 100%;
	height: 210px;
	overflow: hidden;
	margin-bottom: 1em;
}

#Add-To-Basket{
	width: 100%;
	text-align: center;
}

/*** Normal Price in Sale ***/

#Price{
	float: left;
	width: 100%;
	margin-bottom: 25px;
	line-height: 1.2;
}

/*** Current Price ***/

#Price .Now{
	float: left;
	margin-right: 15px;
}

#Price .Now .Label{
	color: #666;
	font-size: 0.8em;
	font-family: "Roboto";
}

#Price .Now .Value{
	font-family: "Roboto";
	font-size: 1.6em;
	font-weight: bold;
	color: #dd2d1e;
	margin-right: 10px;
}

/*** Old Price ***/

#Price .Old{
	margin-bottom: 6px;
}

#Price .Old .Label{
	color: #666;
	font-size: 0.8em;
	font-family: "Roboto";
}

#Price .Old .Value{
	color: #000;
	font-size: 0.9em;
	font-family: "Roboto";
	margin-right: 10px;
}

/*** Save Price ***/

#Price .Save{
	
}

#Price .Save .Label{
	font-size: 0.8em;
	font-family: "Roboto";
	color: #666;
}

#Price .Save .Value{
	font-family: "Roboto";
	font-size: 1.05em;
	font-weight: bold;
	color: #229FE7;
}

/*********************************************************/
/******************* PRICE BREAKS ************************/
/*********************************************************/

.Discount-Table tr { border-bottom: 1px solid #dedede; }
.Discount-Table td { vertical-align: top; }
.Discount-Table td img { 
	width: 45px;
}

.Bracket-Table tr { border: 0; }
.Bracket-Table th { padding: 0 0 5px; }
.Bracket-Table td { 
	padding: 0; 
	width: 25%; 
}

.Assoc{
	float: left;
	width: 100%;
	padding: 20px;
	border: 6px solid #e9e9e9;
	margin-bottom: 25px;
} 

.Assoc img{
	float: left;
	margin-right: 20px;
}

/*********************************************************/
/******************* RELATED *****************************/
/*********************************************************/

#Related{
	padding: 10px 10px 0;
}

.Related{
	border: 1px solid #ebebeb;
	float: left;
	width: 100%;
	margin-bottom: 10px;
	padding: 10px 10px 5px;
}

.Related button{
	float: right;
	margin: 10px 5px 10px 0;
}

.Related .Title{
	font-family: "Roboto";
	font-size: 0.8em;
	margin-top: 10px;
	margin-bottom: 2px;
}

.Related .Title a{
	color: #454545;
}

.Related .Price{
	float: left;
	color: #dc2c1d;
	font-family: "Roboto";
	font-size: 0.95em;
	font-weight: bold;
}

.Related .Image{
	float: left;
	height: 60px;
	margin-right: 15px;
}

.Related fieldset{
	margin-left: 100px !important;
	padding-top: 10px;
}

.Related label{
	left: -100px !important;
}

/*********************************************************/
/******************* BRAND *******************************/
/*********************************************************/

#Brand-Container{
	position: relative;
	float: left;
	width: 100%;
	padding-left: 170px;
	min-height: 130px;
	padding-top: 30px;
	padding-bottom: 15px;
}

#Brand-Container p{
	font-size: 0.7em;
	font-weight: normal;
	margin-bottom: 20px;
}

#Brand-Container .Brand-Logo{
	position: absolute;
	left: 15px;
	top: 35px;
	width: 140px;
	text-align: center;
}

/*********************************************************/
/******************* REVIEWS *****************************/
/*********************************************************/

#Reviews-Container{
	float: left;
	width: 100%;
	background-color: #e6e6e6;
	margin-bottom: 30px;
	padding: 0 30px;
	position: relative;
}

#Reviews-Left,
#Reviews-Right{
	position: absolute;
	width: 38px;
	height: 39px;
	top: 50%;
	margin-top: -20px;
	cursor: pointer;
}

#Reviews-Left{
	left: 15px;
	background-image: url('//images.esellerpro.com/2189/198797/images/buttons/reviews-left.png');
}

#Reviews-Right{
	right: 15px;
	background-image: url('//images.esellerpro.com/2189/198797/images/buttons/reviews-right.png');
}

#Reviews-Left.Inactive,
#Reviews-Right.Inactive{
	cursor: default;
	opacity: 0.2;
}

#Reviews-Span{
	float: left;
	width: 100%;
	padding: 0 38px;
}

#Reviews{
	width: 100%;
	float: left;
	position: relative;
	overflow: hidden;
	height: 274px;
	margin-bottom: 35px;
}

#Reviews-List{
	position: absolute;
	width: 10000em;
}

#Reviews-Container .Heading{
	font-family: "Roboto";
	font-weight: 300;
	color: #5c5c5c;
	line-height: 60px;
}

#Reviews-Container .Heading span{
	font-weight: bold;
	font-size: 0.7em;
	margin-left: 5px;
}

#Reviews-Container .Review-Item{
	float: left;
	width: 266px;
	background-image: url('//images.esellerpro.com/2189/198797/images/obj/shadow.png');
	background-repeat: no-repeat;
	background-position: bottom;
	padding-bottom: 18px;
	margin: 0 15px 0 0;
}

#Reviews-Container .Review-Item .Content{
	float: left;
	width: 100%;
	background-color: #ffffff;
	margin: 0;
	padding: 25px 25px;
}

#Reviews-Container .Review-Item .Reviews{
	text-align: left;
	margin-bottom: 15px;
}

#Reviews-Container .Review-Item .Reviews span{
	color: #282828;
	font-size: 0.6em;
	font-family: "Roboto";
	margin-left: 10px;
}

#Reviews-Container .Review-Item p{
	font-size: 0.8em;
	font-weight: 300;
	margin-bottom: 20px;
	height: 152px;
	overflow-y: scroll;
	overflow-x: hidden;
}

#Reviews-Container .Review-Item .Author{
	color: #282828;
	font-weight: bold;
	font-family: "Roboto";
	font-size: 0.75em;
}










