﻿body {
	font-family: sans-serif;
}



/**************************************************************************************************
 * Video Widget
 *************************************************************************************************/

.widget {
	display: block;

	font-size: 16px;
	font-weight: 400;
	font-family: 'Droid Sans', 'Myriad Pro', sans-serif;
	text-align: center;

	color: #999999;
	text-shadow: 0 0 1px rgba(51,51,51,0.3);
}

.widget .centered {
	display: inline-block;
	margin: 0 autp;
}

.widget * {
	margin: 0;
	padding: 0;
	-webkit-text-size-adjust: 100%;
	font-smooth: always;
	-webkit-font-smoothing: subpixel-antialiased;
	-webkit-text-size-adjust: 100%;
} 

.widget img {
	border: 0;
	-ms-interpolation-mode: bicubic;
	vertical-align: middle;
}

.widget noscript {
	position: absolute;
	display: block;
	top: 20px;
	bottom: 20px;
	left: 20px;
	right: 20px;
	color: #D4F;
	text-align: center;
	font-size: 30px;
	color: white;
	background: #db3242;
	text-shadow: none;
}

.widget .nowrap {
	white-space: nowrap;
}




/**************************************************************************************************
 * Images and video preview of products.
 *************************************************************************************************/

.widget ::-moz-selection {background-color: transparent}
.widget ::selection {background-color: transparent}


.widget hr {
	border: none;
}


.widget .large, 
.widget .large img {
	width: 700px;
	height: 394px;
}

.widget .large {
	position: relative;
}
.widget .large img {
	position: absolute;
	top: 0;
	left: 0;
}


.widget .small {
	text-align: left;
}
.widget .small a {
	position: relative;
	display: block;
	width: 100px;
	height: 92px;
	outline: none;
	text-decoration: none;
	background: url("//lib.store.yahoo.net/lib/americanpearl/border.png") no-repeat;
	background-position: 0 0;
	margin: 10px 0;
}
.widget .small a.active {
	background-position: 0 -92px;
}
.widget .small a img {
	position: absolute;
	display: block;
	left: 1px;
	top: 18px;
	width: 90px;
	height: 56px;
	border: none;
}


/**
 * Scroll controls for thumbnails.
 */

.widget .small,
.widget .small .scroll-contents {
	width: 100px;
}
.widget .scroll-contents {
	position: relative;
	overflow: hidden;
	height: 314px;
	margin-left: 14px;
}

.widget .scroll-up, 
.widget .scroll-down {
	display: block;
	width: 122px;
	height: 12px;
	cursor: default;
}

.widget .scroll-up.scrollable, 
.widget .scroll-down.scrollable {
	cursor: pointer;
	background: url("//lib.store.yahoo.net/lib/americanpearl/scroll.png") no-repeat;
}
.widget .scroll-up.scrollable {
	background-position: 0 0;
}
.widget .scroll-up.scrollable:hover {
	background-position: 0 -24px;
}
.widget .scroll-down.scrollable {
	background-position: 0 -12px;
}
.widget .scroll-down.scrollable:hover {
	background-position: 0 -36px;
}

.widget .scroll-up.scrollable.disabled, 
.widget .scroll-down.scrollable.disabled {
	background: none;
	cursor: default;
}

/**
 * Simulate vertical centering when there aren't enough images.
 */
.widget .scroll-contents.only-1 a {
	top: 100px !important;
}
.widget .scroll-contents.only-2 a {
	top: 60px !important;
}


/**************************************************************************************************
 * Configuration options.
 *************************************************************************************************/

.widget .configuration {
	text-align: left;
	display: table;
	margin: 0 auto;
	width: 960px;
	text-align: left;
}

.widget .configuration th {
	vertical-align: baseline;
	font-weight: normal;
	padding: 0 0 10px;
	line-height: 40px;
	border-bottom: 1px solid #C3C3C3;
}

.widget .configuration td {
	padding: 5px 0;
}

.widget .configuration .description {
	font-size: 14px;
	text-align: left;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.widget .configuration .description b {
	font-weight: 700;
	color: #333333;
}

.widget .configuration .price {
	text-align: right;
}

.widget .configuration .label {
	width: 120px;
	text-align: right;
	padding-right: 10px;
}
.widget .configuration .label.valid {
	color: #3EADEA;
}


.widget .configuration img {
	width: 40px;
	vertical-align: middle;
	border: 1px solid #6D6D6D;

	-moz-transition: -moz-opacity .3s ease;
	-webkit-transition: -webkit-opacity .3s ease;
	transition: opacity .3s ease;

	filter: alpha(opacity=25);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=25)";
	-moz-opacity: 0.25;
	-webkit-opacity: 0.25;
	opacity: 0.25
}

.widget .configuration img.enabled {
	border-color: #DBDBDB;
	cursor: pointer;
	filter: alpha(opacity=100);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	-moz-opacity: 1;
	-webkit-opacity: 1;
	opacity: 1;
}
.widget .configuration img.enabled:hover,
.widget .configuration img.enabled.hover {
	border-color: #555555;
}
.widget .configuration img.enabled.selected {
	border-color: #3eadea;
}

.widget .configuration span span {
	padding-right: 20px;
	color: #777777;
}


/**************************************************************************************************
 * "Buy now" button
 *************************************************************************************************/

.widget .buy {
	display: inline-block;
	vertical-align: baseline;
	padding: 0 20px;

	color: #d9eef7;
	text-align: center;
	text-shadow: 0 1px 1px rgba(0,0,0,.3);
	border: solid 1px #2e83b0;
	cursor: pointer;

	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	border-radius: 20px;

	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);

	background: #3eadea;
	background: -webkit-gradient(linear, left top, left bottom, from(#3eadea), to(#3276cb));
	background: -moz-linear-gradient(top, #3eadea,  #3276cb);
}?

.widget .buy:hover,
.widget .buy.hover {
	background: #3ec1ea;
	background: -webkit-gradient(linear, left top, left bottom, from(#3ec1ea), to(#3287cb));
	background: -moz-linear-gradient(top, #3ec1ea,  #3287cb);
}
.widget .buy:active {
	background: #3287cb;
	background: -webkit-gradient(linear, left top, left bottom, from(#0078a5), to(#00adee));
	background: -moz-linear-gradient(top, #0078a5,  #00adee);
}

.widget .buy b {
	margin-left: 5px;
	padding-left: 10px;
	border-left: 1px solid #2e83b0;
}


/**
 * Internet Explorer styles.
 */

.internet-explorer .widget .buy {
	box-shadow: inset 0 -8px 10px rgba(0,0,0,0.15), 0 1px 0 rgba(255,255,255, 0.3), inset 0 1px 0 rgba(255,255,255, 0.3);
}


/**************************************************************************************************
 * Enable-disable parts depending on the state of the preview.
 *************************************************************************************************/

.widget.loading .video *,
.widget.no-preview .video *,
.widget.images .video * {
	width: 1px;
	height: 1px;
	opacity: 0.01;
}

.widget.loading .images,
.widget.no-preview .images,
.widget.video .images,
.widget.loading .configuration {
	display: none;
}


.widget.loading, 
.widget.no-preview {
	padding-top: 400px;
}
.widget.no-preview {
	background: url("//lib.store.yahoo.net/lib/americanpearl/no-preview.png") no-repeat center 150px;
}
.widget.loading {
	background: url("//lib.store.yahoo.net/lib/americanpearl/loading.gif") no-repeat center 100px;
}
