// Some useful Less Mixins https://github.com/dmitryf/elements
@import "elements.less";


//
// Mixins
// --------------------------------------------------

.prevent-from-transition-flickr() {
  -webkit-backface-visibility: hidden;
  -webkit-transform-style: preserve-3d;
}

.prevent-user-select() {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.resetTransition() {
  -webkit-transition: none;
  -moz-transition: none;
  transition: none;
}


//
// Touch-Carousel styles
// --------------------------------------------------

.touch-carousel {
  position: relative;
  overflow: hidden;
  width: 100%;

  -webkit-transform: translate3d(0,0,0) scale3d(1,1,1);
  .prevent-from-transition-flickr();
  .prevent-user-select();

  .carousel-control {
    display: none !important;
  }

  // #3: Touch optimized indicator pills
  .carousel-indicators {

    bottom: 10px;

    li {
      width: 16px;
      height: 16px;
      margin: 1px 5px;
      &.active {
        margin: 0px 5px;
        width: 18px;
        height: 18px;
      }
    }
  }
}

.touch-carousel .carousel-inner {
  overflow: hidden;
  .transform( translate3d(0%,0,0) scale3d(1,1,1) );
  .prevent-from-transition-flickr();
  .prevent-user-select();

  > .item {
    position: relative;
    float: left;
    display: block;

    .resetTransition();
    .prevent-from-transition-flickr();

    * { .resetTransition(); }
  }

  &.animate {
    .transition(all, .3s, linear);
  }

}

// Hide/rearrange for smaller screens
@media screen and (max-width: 767px) {

  // Hide captions
  .carousel-caption {
    display: none
  }
}
