input[type=range] {
  width: 300px;
}

ul[rn-carousel] {
  overflow-y: hidden;
  padding: 0;
  white-space: nowrap;
  position: relative;
  perspective: 1000px;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
}
ul[rn-carousel] > li {
  color: black;
/*  backface-visibility: hidden;*/
  overflow: visible ;
  vertical-align: top;
  position: absolute;
  left: 0;
  right: 0;
  white-space: normal;
  padding: 0;
  margin: 0;
  list-style-type: none;
  width: 100%;
  height: 100%;
  display: inline-block;
}

/* prevent flickering when moving buffer */
ul[rn-carousel-buffered] > li {
  display: none;
}

ul[rn-carousel-transition="hexagon"] {
  overflow: visible;
}

/* indicators */
div.rn-carousel-indicator span {
  cursor: pointer;
  color: #666;
}
div.rn-carousel-indicator span.active {
  color: white;
}

/* prev/next controls */
.rn-carousel-control {
  transition: opacity 0.2s ease-out;
  font-size: 2rem;
  position: absolute;
  top: 50%; /* 40% original */ 
  opacity: 1; /* 0.75 original*/
  cursor: pointer;
}
.rn-carousel-control:hover {
  opacity: 1;
}
.rn-carousel-control.rn-carousel-control-prev {
  left: 0.5em;
  background: url('/img/paddle_prev_999.png');
  padding: 50px;
  background-repeat: no-repeat;
}
.rn-carousel-control.rn-carousel-control-prev:hover {
  left: 0.5em;
  background: url('/img/paddle_prev_fff.png');
  padding: 50px;
  background-repeat: no-repeat;
}
.rn-carousel-control.rn-carousel-control-prev:before {
 
/*content: url(img/paddle_prev_999.png);*/
display: block;
position: absolute;
z-index: 99999;

}
.rn-carousel-control.rn-carousel-control-next {
  right: 0.5em;
  background: url('/img/paddle_next_999.png');
  right: -40px;
  padding:50px;
   background-repeat: no-repeat;
}
.rn-carousel-control.rn-carousel-control-next:hover {
  right: 0.5em;
  background: url('/img/paddle_next_fff.png');
  right: -40px;
  padding:50px;
   background-repeat: no-repeat;
}
.rn-carousel-control.rn-carousel-control-next:before {

/* content: url(img/paddle_next_999.png);*/
display: block;

}

@media (max-width: 767px) {
    .rn-carousel-control.rn-carousel-control-prev {
        top:15%;
    }

     .rn-carousel-control.rn-carousel-control-next {
        top:15%;
    }
}

@media (max-width: 480px) {
    .rn-carousel-control.rn-carousel-control-prev {
        top:15%;
    }

     .rn-carousel-control.rn-carousel-control-next {
        top:15%;
    }
}

@media only screen and (max-device-width : 768px) 
  { .rn-carousel-control.rn-carousel-control-prev {
        top:25%;
    }

     .rn-carousel-control.rn-carousel-control-next {
        top:25%;
    }
}