/*
 * Title: jQuery Etalage plugin CSS
 * Author: Berend de Jong, Frique
 * Author URI: http://www.frique.me/
 * Version: 1.3.1 (20120705.1)
 *
 * ------------------------------------ STYLE ------------------------------------
 * Edit this section to style your thumbnails, zoom area, magnifier etc.
 * If the id of your Etalage instance is different, do a find/replace on #etalage.
 * -------------------------------------------------------------------------------
 */

/* Etalage container (large thumb + small thumbs): */
#etalage{
	display: none;
	margin-bottom: 50px;
}

/* Large thumbnail: */
#etalage .etalage_thumb{
	background: white url(images/loading.gif) center no-repeat;
	border: 1px solid #ddd;
	padding: 6px;
	/*-webkit-box-shadow: 0 0 10px #ddd;
	-moz-box-shadow: 0 0 10px #ddd;
	box-shadow: 0 0 10px #ddd;*/
}
/* Large thumbnail - image (in case you want to add a border around the image within the frame) */
#etalage .etalage_thumb_image{ }

/* Small thumbnails: */
#etalage .etalage_small_thumbs li{
	background: white;
	border: 1px solid #ddd;
	margin: 10px;
	padding: 3px;
}
/* The one on the left that makes them slide */
#etalage ul li.etalage_smallthumb_first{ }
/* The one on the right that makes them slide */
#etalage ul li.etalage_smallthumb_last{ }
/* The currently active one */
#etalage ul li.etalage_smallthumb_active{
	-webkit-box-shadow: 0 0 10px #ddd;
	-moz-box-shadow: 0 0 10px #ddd;
	box-shadow: 0 0 10px #ddd;
}

/* Zoomed image area: */
#etalage .etalage_zoom_area,
.etalage_zoom_area{
	background: white url(images/loading.gif) center no-repeat;
	border: 1px solid #ddd;
	padding: 6px;
	-webkit-box-shadow: 0 0 10px #ddd;
	-moz-box-shadow: 0 0 10px #ddd;
	box-shadow: 0 0 10px #ddd;
}

/* Magnifier area (thumbnail hovering rectangle): */
#etalage .etalage_magnifier{
	background: white;
	border: 1px solid #bbb;
}

/* Icon that will apear at the left bottom of the large thumbnail (optional): */
#etalage .etalage_icon{
    background: url(images/zoom.png) no-repeat;
    width: 14px;
    height: 14px;
    z-index: 100;
    top: auto;
    left: auto;
    bottom: 10px;
    right: 10px;
    /*display: block;*/
}

/* Hint that will apear at the top right of the large thumbnail (optional): */
#etalage .etalage_hint{
	background: url(images/hint.gif) no-repeat;
	width: 130px;
	height: 57px;
}

/* Description area (optional) */
#etalage .etalage_description{
	background: white;
	font-style: italic;
	margin: 10px;
	padding: 6px 10px;
}

/*
 * ------------------------------------ FUNCTIONALITY --------------------------------------
 * The following CSS serves to make Etalage function properly. Don't edit or edit carefully.
 * -----------------------------------------------------------------------------------------
 */

.etalage, .etalage_thumb, .etalage_thumb_image, .etalage_source_image, .etalage_zoom_preview, .etalage_icon, .etalage_hint{ display:none }
.etalage, .etalage ul, .etalage li, .etalage img, .etalage_hint, .etalage_icon, .etalage_description{ margin:0; padding:0; border:0; list-style:none }
.etalage, .etalage_magnifier div, .etalage_magnifier div img, .etalage_small_thumbs ul, ul .etalage_small_thumbs li, .etalage_zoom_area div, .etalage_zoom_img{ position:relative }
.etalage img, .etalage li{ -webkit-user-select:none; -khtml-user-select:none; -moz-user-select:none; -o-user-select:none; user-select:none; -webkit-user-drag:none; -moz-user-drag:none; user-drag:none }
.etalage, .etalage_small_thumbs li{ float:left }
.etalage_right{ float:right }
.etalage li{ position:absolute }
.etalage img{ vertical-align:bottom; max-width:none }
.etalage_magnifier{ cursor:default }
.etalage_magnifier div, .etalage_small_thumbs{ overflow:hidden }
.etalage_magnifier div img{ display:none }
.etalage_icon, .etalage_hint{ cursor:default; width:0; height:0; overflow:hidden }
.etalage_small_thumbs li.vertical{ float:none }
.etalage_zoom_area{ z-index:996 }
.etalage_zoom_area div{ overflow:hidden; z-index:997 }
.etalage_zoom_preview{ position:absolute; z-index:998 }
.etalage_zoom_img, .etalage_hint{ z-index:999 }
.etalage{ direction:ltr }
div.etalage_description{ position:absolute; bottom:0; left:0; z-index:999 }
div.etalage_description.rtl{ direction:rtl; text-align:right }


/* Product Images */
/*
 * ------------------------------------ FUNCTIONALITY --------------------------------------
 * The following CSS serves to make Etalage function properly. Don't edit or edit carefully.
 * -----------------------------------------------------------------------------------------
 */

.etalage, .etalage_thumb, .etalage_thumb_image, .etalage_source_image, .etalage_zoom_preview, .etalage_icon, .etalage_hint{ display:none }
.etalage, .etalage ul, .etalage li, .etalage img, .etalage_hint, .etalage_icon, .etalage_description{ margin:0; padding:0; border:0; list-style:none }
.etalage, .etalage_magnifier div, .etalage_magnifier div img, .etalage_small_thumbs ul, ul .etalage_small_thumbs li, .etalage_zoom_area div, .etalage_zoom_img{ position:relative }
.etalage img, .etalage li{ -webkit-user-select:none; -khtml-user-select:none; -moz-user-select:none; -o-user-select:none; user-select:none; -webkit-user-drag:none; -moz-user-drag:none; user-drag:none }
.etalage, .etalage_small_thumbs li{ float:left }
.etalage_right{ float:right }
.etalage li{ position:absolute }
.etalage img{ vertical-align:bottom; max-width:none }
.etalage_magnifier{ cursor:default }
.etalage_magnifier div, .etalage_small_thumbs{ overflow:hidden }
.etalage_magnifier div img{ display:none }
.etalage_icon, .etalage_hint{ cursor:default; width:0; height:0; overflow:hidden }
.etalage_small_thumbs li.vertical{ float:none }
.etalage_zoom_area{ z-index:996 }
.etalage_zoom_area div{ overflow:hidden; z-index:997 }
.etalage_zoom_preview{ position:absolute; z-index:998 }
.etalage_zoom_img, .etalage_hint{ z-index:999 }
.etalage{ direction:ltr; float: none; }
div.etalage_description{ position:absolute; bottom:0; left:0; z-index:999 }
div.etalage_description.rtl{ direction:rtl; text-align:right }

li.etalage_small_thumbs{margin-top:8px;top:100%}
.etalage.vertical li.etalage_small_thumbs{margin-top:0}
.product-view .product-img-box{margin-bottom:150px}
.product-view .product-img-box img.zoomImg{background-color:#fff;z-index:2}
.product-view .product-img-box li.etalage_thumb,.product-view .product-img-box li.etalage_small_thumbs li{ padding:3px;border:1px solid #ddd;/*border-radius:7px;*/background:#fff;max-width:100%}
.product-view .product-img-box .etalage_small_thumbs li{cursor:pointer;margin-top:10px}
.product-view .product-img-box .etalage-control{position:absolute;width:100%;height:0;left:0;top:50%;margin-top:-20px;visibility:hidden;transition:all 0.3s;z-index:2}
.product-view .product-img-box:hover .etalage-control{visibility:visible}
.product-view .product-img-box .etalage-control a{display:block;position:absolute;font-size:40px;left:auto;right:auto;top:0}
.product-view .product-img-box .etalage-control a.etalage-prev{margin:0;left:0;top:0}
.product-view .product-img-box .etalage.vertical+.etalage-control a.etalage-prev{left:20%}
.product-view .product-img-box .etalage-control a.etalage-next{margin:0;right:0;top:0}
.product-view .product-img-box a.fancy-images{display:none}
.product-view .product-img-box .etalage a.fancy-images{position:absolute;right:10px;bottom:10px;z-index:99;display:none}
.product-view .product-img-box .etalage .etalage_thumb_active a.fancy-images{display:block}
.col3-layout .product-view .product-img-box{float:none;margin:0 auto}
.product-view .product-img-box .product-image{margin:0 0 13px}
.product-view .product-img-box .product-image-zoom{position:relative;width:265px;height:265px;overflow:hidden;z-index:9}
.product-view .product-img-box .product-image-zoom img{position:absolute;left:0;top:0;cursor:move}
.product-view .product-img-box .zoom-notice{font-size:11px;margin:0 0 5px;text-align:center}
.product-view .product-img-box .zoom{position:relative;z-index:9;height:18px;margin:0 auto 13px;padding:0 28px;background:url(images/slider_bg.gif) 50% 50% no-repeat;cursor:pointer}
.product-view .product-img-box .zoom.disabled{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";opacity:.3}
.product-view .product-img-box .zoom #track{position:relative;height:18px}
.product-view .product-img-box .zoom #handle{position:absolute;left:0;top:-1px;width:9px;height:22px;background:url(images/magnifier_handle.gif) 0 0 no-repeat}
.product-view .product-img-box .zoom .btn-zoom-out{position:absolute;left:2px;top:0}
.product-view .product-img-box .zoom .btn-zoom-in{position:absolute;right:2px;top:0}
.product-view .product-img-box .more-views h2{font-size:11px;border-bottom:1px solid #ccc;margin:0 0 8px;text-transform:uppercase}
.product-view .product-img-box .more-views ul{margin-left:-9px}
.product-view .product-img-box .more-views li{float:left;margin:0 0 8px 9px}
.product-view .product-img-box .more-views li a{float:left;width:56px;height:56px;border:2px solid #ddd;overflow:hidden}

.product-image-popup{margin:0 auto}
.product-image-popup .buttons-set{float:right;clear:none;border:0;margin:0;padding:0}
.product-image-popup .nav{font-weight:bold;margin:0 100px;text-align:center}
.product-image-popup .image{display:block;margin:10px 0}
.product-image-popup .image-label{font-size:13px;font-weight:bold;margin:0 0 10px;color:#2f2f2f}

#product-slider [class^="icon-"]:before, #product-slider [class*=" icon-"]:before, #product-slider .fa-shopping-cart:before {
	margin-left: 0;
	margin-right: 0;
}