.carousel {position:relative;float:left;}
.carousel-inner {position:relative;width:100%;overflow:hidden;}
.carousel-inner>.item {position:relative;display:none;-webkit-transition:.6s ease-in-out left;-o-transition:.6s ease-in-out left;transition:.6s ease-in-out left}

@media all and (transform-3d),(-webkit-transform-3d){
	.carousel-inner>.item {-webkit-transition:-webkit-transform .6s ease-in-out;-o-transition:-o-transform .6s ease-in-out;transition:transform .6s ease-in-out;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-perspective:1000px;perspective:1000px}
	.carousel-inner>.item.active,.carousel-inner>.item.next.left,.carousel-inner>.item.prev.right {left:0;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
	.carousel-12>.item.active.right,.carousel-12>.item.next {left:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}
	.carousel-12>.item.active.left,.carousel-12>.item.prev {left:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}
	
}
.carousel-inner>.active,.carousel-inner>.next,.carousel-inner>.prev {display:block}
.carousel-inner>.active {left:0}
.carousel-inner>.next,.carousel-inner>.prev{position:absolute;top:0;width:100%}
/*	
.carousel-inner>.next{left:100%}
.carousel-inner>.prev{left:-100%}
.carousel-inner>.next.left,.carousel-inner>.prev.right{left:0}
.carousel-inner>.active.left{left:-100%}
.carousel-inner>.active.right{left:100%}
*/
.carousel-control {position:absolute;top:0;bottom:0;left:0;width:150px;font-size:20px;color:#fff;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,.6);background-color:rgba(0,0,0,0);filter:alpha(opacity=50);opacity:.5}
.carousel-control img {height:100%;}
.carousel-control.right {right:0;left:auto;}
.shadow.carousel-control.left {background-image:-webkit-linear-gradient(left,rgba(0,0,0,.5) 0,rgba(0,0,0,.0001) 100%);background-image:-o-linear-gradient(left,rgba(0,0,0,.5) 0,rgba(0,0,0,.0001) 100%);background-image:-webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,.0001)));background-image:linear-gradient(to right,rgba(0,0,0,.5) 0,rgba(0,0,0,.0001) 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);background-repeat:repeat-x}
.shadow.carousel-control.right {right:0;left:auto;background-image:-webkit-linear-gradient(left,rgba(0,0,0,.0001) 0,rgba(0,0,0,.5) 100%);background-image:-o-linear-gradient(left,rgba(0,0,0,.0001) 0,rgba(0,0,0,.5) 100%);background-image:-webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.0001)),to(rgba(0,0,0,.5)));background-image:linear-gradient(to right,rgba(0,0,0,.0001) 0,rgba(0,0,0,.5) 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1);background-repeat:repeat-x}
.carousel-control:focus,.carousel-control:hover {color:#fff;text-decoration:none;filter:alpha(opacity=90);outline:0;opacity:.9}
.carousel-control span {display:block;height:100px;position:relative;top:50%;transform:translateY(-50%);left:0;}

.carousel-indicators {position:absolute;bottom:10px;left:50%;z-index:15;width:60%;padding-left:0;transform:translateX(-50%);text-align:center;list-style:none}
.carousel-indicators li {display:inline-block;width:10px;height:10px;margin:1px;text-indent:-999px;cursor:pointer;background-color:#000\9;background-color:rgba(0,0,0,0);border:1px solid #fff;border-radius:10px}
.carousel-indicators .active {width:12px;height:12px;margin:0;background-color:#fff}
.carousel-caption {position:absolute;right:15%;bottom:20px;left:15%;z-index:10;padding-top:20px;padding-bottom:20px;color:#fff;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,.6)}
.carousel-caption .btn{text-shadow:none}



 .active > div { display:none; }
 .active > div:first-child { display:block; }

/*xs*/
@media (max-width: 767px) {
  	.carousel-2 .active.left { left: -100%; }
  	.carousel-2 .active.right { left: 100%; }
	.carousel-2 .next        { left:  100%; }
	.carousel-2 .prev		     { left: -100%; }
  	.carousel-2 .carousel-col     { width: 100%; }
        
        .carousel-4 .active.left { left: -100%; }
  	.carousel-4 .active.right { left: 100%; }
	.carousel-4 .next        { left:  100%; }
	.carousel-4 .prev		     { left: -100%; }
  	.carousel-4 .carousel-col     { width: 100%; }
        
	.active > div:first-child + div { display:block; }
	
	@media all and (transform-3d),(-webkit-transform-3d){
	  .carousel-2>.item.active.right,.carousel-2>.item.next {left:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}
	  .carousel-2>.item.active.left,.carousel-2>.item.prev {left:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}
	}
	
}

/*sm*/
@media (min-width: 768px) and (max-width: 991px) {
  	.carousel-2 .active.left { left: -50%; }
  	.carousel-2 .active.right { left: 50%; }
	.carousel-2 .next        { left:  50%; }
	.carousel-2 .prev		     { left: -50%; }
  	.carousel-2 .carousel-col                { width: 50%; }
        
        .carousel-4 .active.left { left: -50%; }
  	.carousel-4 .active.right { left: 50%; }
	.carousel-4 .next        { left:  50%; }
	.carousel-4 .prev		     { left: -50%; }
  	.carousel-4 .carousel-col                { width: 50%; }
        
	.active > div:first-child + div {display:block;}
  	.active > div:first-child + div + div {display:block;}
	.active > div:first-child + div + div + div {display:block;}
	.active > div:first-child + div + div + div + div {display:block;}
	.active > div:first-child + div + div + div + div + div {display:block;}
	
	@media all and (transform-3d),(-webkit-transform-3d){
	  .carousel-2>.item.active.right,.carousel-2>.item.next {left:0;-webkit-transform:translate3d(50%,0,0);transform:translate3d(50%,0,0)}
	  .carousel-2>.item.active.left,.carousel-2>.item.prev {left:0;-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0)}
	}
}

/*md*/
@media (min-width: 992px) and (max-width: 1199px) {
  	.carousel-2 .active.left { left: -33.33%; }
  	.carousel-2 .active.right { left: 33.33%; }
	.carousel-2 .next        { left:  33.33%; }
	.carousel-2 .prev		     { left: -33.33%; }
  	.carousel-2 .carousel-col    { width: 33.33%; }
        
        .carousel-4 .active.left {left: -33.333%;}
  	.carousel-4 .active.right {left: 33.333%;}
	.carousel-4 .next {left:33.333%;}
	.carousel-4 .prev {left: -33.333%;}
	.carousel-4 .carousel-col { width: 33.333%;}
        
	.active > div:first-child + div {display:block;}
  	.active > div:first-child + div + div {display:block;}
	.active > div:first-child + div + div + div {display:block;}
	.active > div:first-child + div + div + div + div {display:block;}
	.active > div:first-child + div + div + div + div + div {display:block;}
  
  @media all and (transform-3d),(-webkit-transform-3d){
	  .carousel-2>.item.active.right,.carousel-2>.item.next {left:0;-webkit-transform:translate3d(33.33%,0,0);transform:translate3d(33.33%,0,0)}
	  .carousel-2>.item.active.left,.carousel-2>.item.prev {left:0;-webkit-transform:translate3d(-33.33%,0,0);transform:translate3d(-33.33%,0,0)}
          
          .carousel-4>.item.active.right,.carousel-4>.item.next {left:0;-webkit-transform:translate3d(33.33%,0,0);transform:translate3d(33.33%,0,0)}
	  .carousel-4>.item.active.left,.carousel-4>.item.prev {left:0;-webkit-transform:translate3d(-33.33%,0,0);transform:translate3d(-33.33%,0,0)}
	}
}

/*lg*/
@media (min-width: 1200px) {
  	.carousel-2 .active.left {left: -16.666%;}
  	.carousel-2 .active.right {left: 16.666%;}
	.carousel-2 .next {left:16.666%;}
	.carousel-2 .prev {left: -16.666%;}
	.carousel-2 .carousel-col { width: 16.666%;}
        
        .carousel-4 .active.left {left: -33.333%;}
  	.carousel-4 .active.right {left: 33.333%;}
	.carousel-4 .next {left:33.333%;}
	.carousel-4 .prev {left: -33.333%;}
	.carousel-4 .carousel-col { width: 33.333%;}
        
	.active > div:first-child + div {display:block;}
  	.active > div:first-child + div + div {display:block;}
	.active > div:first-child + div + div + div {display:block;}
	.active > div:first-child + div + div + div + div {display:block;}
	.active > div:first-child + div + div + div + div + div {display:block;}
	
	@media all and (transform-3d),(-webkit-transform-3d){
	  .carousel-2>.item.active.right,.carousel-2>.item.next {left:0;-webkit-transform:translate3d(16.666%,0,0);transform:translate3d(16.666%,0,0)}
	  .carousel-2>.item.active.left,.carousel-2>.item.prev {left:0;-webkit-transform:translate3d(-16.666%,0,0);transform:translate3d(-16.666%,0,0)}
          
          .carousel-4>.item.active.right,.carousel-4>.item.next {left:0;-webkit-transform:translate3d(33.333%,0,0);transform:translate3d(33.333%,0,0)}
	  .carousel-4>.item.active.left,.carousel-4>.item.prev {left:0;-webkit-transform:translate3d(-33.333%,0,0);transform:translate3d(-33.333%,0,0)}
	}
}


