/*
 * Swiper 2.6.1
 * Mobile touch slider and framework with hardware accelerated transitions
 *
 * http://www.idangero.us/sliders/swiper/
 *
 * Copyright 2010-2014, Vladimir Kharlampidi
 * The iDangero.us
 * http://www.idangero.us/
 *
 * Licensed under GPL & MIT
 *
 * Released on: May 6, 2014
*/
.swiper-container {
	margin:0 auto;
	position:relative;
	overflow:hidden;
	-webkit-backface-visibility:hidden;
	-moz-backface-visibility:hidden;
	-ms-backface-visibility:hidden;
	-o-backface-visibility:hidden;
	backface-visibility:hidden;
	/* Fix of Webkit flickering */
	z-index:1;
}
.swiper-wrapper {
	position:relative;
	width:100%;
	-webkit-transition-property:-webkit-transform, left, top;
	-webkit-transition-duration:0s;
	-webkit-transform:translate3d(0px,0,0);
	-webkit-transition-timing-function:ease;
	
	-moz-transition-property:-moz-transform, left, top;
	-moz-transition-duration:0s;
	-moz-transform:translate3d(0px,0,0);
	-moz-transition-timing-function:ease;
	
	-o-transition-property:-o-transform, left, top;
	-o-transition-duration:0s;
	-o-transform:translate3d(0px,0,0);
	-o-transition-timing-function:ease;
	-o-transform:translate(0px,0px);
	
	-ms-transition-property:-ms-transform, left, top;
	-ms-transition-duration:0s;
	-ms-transform:translate3d(0px,0,0);
	-ms-transition-timing-function:ease;
	
	transition-property:transform, left, top;
	transition-duration:0s;
	transform:translate3d(0px,0,0);
	transition-timing-function:ease;

	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}
.swiper-free-mode > .swiper-wrapper {
	-webkit-transition-timing-function: ease-out;
	-moz-transition-timing-function: ease-out;
	-ms-transition-timing-function: ease-out;
	-o-transition-timing-function: ease-out;
	transition-timing-function: ease-out;
	margin: 0 auto;
}
.swiper-slide {
	float: left;
/*    display: inline-block;*/
}

/* IE10 Windows Phone 8 Fixes */
.swiper-wp8-horizontal {
	-ms-touch-action: pan-y;
}
.swiper-wp8-vertical {
	-ms-touch-action: pan-x;
}

/* ===============================================================
Your custom styles, here you need to specify container's and slide's
sizes, pagination, etc.
================================================================*/
.swiper-container {
	/* Specify Swiper's Size: */
/*    white-space:nowrap;*/
	width:100%;
    display:inline-block;
    vertical-align:middle;
	height: 14em;
}
.swiper-slide {
	/* Specify Slides's Size: */
	cursor: hand;
    cursor: pointer;
	width: 200px;
	height: 100%;
    border: 1px solid transparent;
    position: relative;
}
.swiper-slide .slider-img{
    height: 10em;
    padding: 2px;
}
.swiper-slide .slide-info{
/*    background: #38C;
    color:white;
    border-radius: 25px;*/
    position:absolute;
    top: 5px;
    right: 5px;
/*    width: 18px;
    height: 18px;*/
/*    font-weight:bold;*/
/*    text-indent: -1px;
    font-family: "Candara", "Calibri", "Lucida Console", Monaco, monospace;*/
}
.swiper-slide .text{
    white-space:normal;
    position:relative;
    text-align: left;
    min-height: 3.5em;
    margin: 5px;
}
.swiper-slide .slider-price-placeholder{
    position: relative;
    visibility: none;
    display: none;
    bottom:0px;
    right: 0px;
}

.swiper-slide .slider-price{
    position: absolute;
    bottom:0px;
    right: 0px;
}
.swiper-slide .slider-price span{
    color: #FF800F;
    display:inline;
    font-weight: bold;
}
.swiper-slide .check-mark{
    position:relative;
    top:-1px;
    left: -1px;
    color: #FFFFFF;
    width: 2.5em;
    height: 2em;
    background: white;            
    font-size:1.3em;
}
.swiper-slide .check-mark img{
    width: 2em;
    position:absolute;
    left:0px;
    top:0px;
}
.swiper-slide.slider-selected .check-mark{
    position:absolute;
}
.swiper-slide img {
    max-height: 10em;
}

.swiper-topseller-tabs{
   height: 3em;
}
.topseller-tabs-slide{
/*   border: 3px solid #009fe3;*/
   height: 1.1em!important;
   vertical-align: middle;
/*   margin: 0 0.5em;*/
   display: inline-block;
   padding: 0.25em 0em;
   text-align:center;
/*   position:absolute; 
   top:50%; 
   height: 1em; 
   margin-top:-0.5em*/
}
.swiper-slide.topseller-tabs{
/*   width: auto!important;*/
   width: 160px;
   text-shadow: none;
   text-align:center;
   font-size: 1.5em;
   vertical-align: middle;
   position:relative;
   transform: scale(0.8);
   color: #009fe3;
   font-weight: bold;
   border: 2px solid #009fe3;
}
.swiper-slide-visible.topseller-tabs {
	/* Specific visible slide styling: */	
   transform: scale(0.8);
}
.swiper-slide-middle.topseller-tabs {
         transform: scale(0.8);
}
.swiper-slide-active.topseller-tabs {
	/* Specific active slide styling: */
   transform: scale(1);
   background-color:  #009fe3;
   color: white;
}

.slider-selected{
   border: 1px solid #31c46c;
}
#swiper-topseller, .swiper-slide.topseller{
   height:430px;
   width:100%;
}
#swiper-topseller .swiper-wrapper{
   width:100%;
/*   height:300px;*/
}
@media (max-width: 1140px) {
   #swiper-topseller, .swiper-slide.topseller{
      height:532px;
   }
}
@media (max-width: 780px) {
   #swiper-topseller, .swiper-slide.topseller{
      height:1184px;
   }
}


/* ===============================================================
Pagination Styles
================================================================*/
.swiper-pagination-switch {
	/* Stylize pagination button: */	
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 10px;
  background: #999;
  box-shadow: 0px 1px 2px #555 inset;
  margin: 0 3px;
  cursor: pointer;
}
.swiper-active-switch {
	/* Specific active button style: */	
	background: #fff;
}
.swiper-visible-switch {
	/* Specific visible button style: */	
	
}

.arrow-left, .arrow-right{
    vertical-align: middle;
    width:30px;
    font-size:3em;
    display:inline-block;
    cursor: hand;
    cursor: pointer;
}
.arrow-left.disabled, .arrow-right.disabled{
   cursor: normal;
   color: grey;
   visibility: hidden;
}
.kategorie-header{
    font-weight: bold;
    text-align: left;
    border-top:1px black solid;
    cursor: hand;
    cursor: pointer;
    display:block;
    font-size: 1.1em;
}

.swiper-top-container{
    width:100%;
    white-space:nowrap;
    padding: 2px 0;
}
.kategorie-header .dropsymbol{
    float:right;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    margin-right: 1em;
}
.options-switch{
   font-size: 1.6em;   
}
.options-switch span.dropsymbol{
    display:inline-block;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    margin: 0 5px;
}
.options-switch span.dropsymbol:first-letter{
   display: relative;
   top: -2px;
}
span.kategorie-header span.selector{
   display:none;
   width: 2em;
   height:2em;
}
.kategorie-header .selector img{
   height: 1.5em;
}

.white-to-transparent, .transparent-to-white{
   position: absolute;
   z-index: 2;
   height: 100%;
   width: 20px;
   background-color:transparent;
   background-repeat:repeat;
   top:0px;
}
.white-to-transparent{
   left: -1px;
   background-image:url("/img/white-to-transparent.png");
}
.transparent-to-white{
   right: -1px;
   background-image:url("/img/transparent-to-white.png");
}