
.carousel-outher
{
}

.carousel img {
-webkit-user-drag: none;
-khtml-user-drag: none;
-moz-user-drag: none;
-o-user-drag: none;
user-drag: none;
}

.carousel {
  padding: 20px;
  perspective: 500px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.carousel > * {
  flex: 0 0 auto;
}
.carousel figure {
  margin: 0;
  width: 40%;
  transform-style: preserve-3d;
  transition: transform 0.5s;

margin-top:-40px;
margin-bottom:-40px;

}

.carousel nav {
margin-top:-30px;
margin-bottom:0.5rem;
}

.carousel figure span.item {
display:table-cell;
}

.carousel figure span.item {
  width: 100%;
  box-sizing: border-box;
  padding: 0 0px;
/*border:1px solid #ddd;*/
cursor:pointer;
}
.carousel figure span.item:not(:first-of-type) {
  position: absolute;
  left: 0;
  top: 0;
}

.carousel .prev, .carousel .next  {position:relative; z-index:10;}


/* reflection - pp - resene duplikovanim obrazku v html */
.carousel .item {
display: inline-block;
position:relative;
}

.carousel .reflection {
position:relative;
width:100%;
height:0px;
top:100%;
left:0;
 opacity: 0.75;
 opacity: 0.5;
}

.carousel .reflection img {
  transform: scaleY(-1);
   width: 100%;
    height: 50px;
}

.carousel .reflection:after {
content:"";
  background: linear-gradient(to bottom, rgba(200,200,200,0.25), #ddd);
  background: linear-gradient(to bottom, rgba(0,0,0,0.33), #000);
  z-index: 1;
position:absolute;
width:100%;
height:50px;
top:185%;
margin-top:-50px;
left:0;
/*border:1px solid #f00;*/
}


