﻿

/*轮播图组件*/

.wqdCarousel{position: relative;width: 100%;height:100%;overflow: hidden;}

.wqdCarousel .carousel-control{z-index: 99;}

.wqdCarousel .carousel-inner, .wqdCarousel .carousel-inner .item{width: 100%;height: 100%;}

.wqdCarousel .carousel-inner .item{position:absolute;}

.wqdCarousel .carousel-inner .item .bannerContainer{position: relative;width: 100%;height: 100%;background:no-repeat center center / cover;}

.wqdCarousel .carousel-control{display:none;position: absolute;z-index:50; opacity: 0.5; width: 50px;height: 50px;line-height: 50px;text-align: center;padding: 5px;top: 50%;margin-top: -25px;/* background-color: #ccc; */cursor: pointer;}

.wqdCarousel:hover .carousel-control{display: block;}

.wqdCarousel .carousel-control.left{left: 1%;}

.wqdCarousel .carousel-control.right{right: 1%;}

.wqdCarousel .carousel-indicators{position: absolute;z-index: 50;width: 90%;left: 50%;margin-left: -45%;text-align: center;font-size: 0;bottom: 8px;}

/*数量下标*/

.wqdCarousel .carousel-indicators.left{text-align: left}

.wqdCarousel .carousel-indicators.center{text-align: center}

.wqdCarousel .carousel-indicators.right{text-align: right}

.wqdCarousel .carousel-indicators.del{display:none;}

/*按钮切换*/

/*.wqdCarousel .carousel-control.btn1{border-radius:200px;}

.wqdCarousel .carousel-control.btn2{border-radius:0px;}

.wqdCarousel .carousel-control.btn3{top:83%;border-radius:200px;}

.wqdCarousel .carousel-control.btn4{top:83%;border-radius:0px;}

.wqdCarousel .carousel-control.btn5{display:none!important;}*/



.wqdCarousel .carousel-control.btn1{top:50%;}

.wqdCarousel .carousel-control.btn2{top:83%;}

.wqdCarousel .carousel-control.btn3{display:none!important;}

.wqdCarousel .carousel-control path {fill: #fff; }

.wqdCarousel .carousel-control:hover path {fill: #fff; }

.wqdelementEditBox .carousel-indicators li{display: inline-block;width: 20px;height: 20px;background-color: rgba(0,0,0,0); border-radius: 100px;cursor: pointer;margin: 3px;}

.wqdCarousel .carousel-indicators li.active{width: 20px;height: 20px;background-color: #9BDCFF;border:2px solid #9BDCFF;}

.wqdCarousel .carousel-indicators li:first-child{margin-left: 0;}

.wqdCarousel .indicator_7 li:first-child{margin-left: 3px;}



.wqdCarousel .indicator_6 li,.wqdCarousel .indicator_7 li{border:1px solid #ccc;}

.wqdCarousel .indicator_6 li.active,.wqdCarousel .indicator_7 li.active{border:1px solid #9bdcff;}

/* 轮播图动画：*/

.carousel-inner>.item{-moz-backface-visibility: hidden;-o-backface-visibility: hidden;backface-visibility: hidden;-webkit-transition: -webkit-transform .6s ease-in-out;-moz-transition: -moz-transform .6s ease-in-out;-o-transition: -o-transform .6s ease-in-out;transition: transform .6s ease-in-out;}

.carousel-inner>.item.active, .carousel-inner>.item.next.left, .carousel-inner>.item.prev.right{left: 0;-webkit-transform: translate3d(0,0,0);-moz-transform: translate3d(0,0,0);-o-transform: translate3d(0,0,0);transform: translate3d(0,0,0);}

.carousel-inner>.item.active.left, .carousel-inner>.item.prev{left: 0;-webkit-transform: translate3d(-100%,0,0);-o-transform: translate3d(-100%,0,0);-moz-transform: translate3d(-100%,0,0);transform: translate3d(-100%,0,0);}

.carousel-inner>.item.active.right, .carousel-inner>.item.next{left: 0;-webkit-transform: translate3d(100%,0,0);-o-transform: translate3d(100%,0,0);-moz-transform: translate3d(100%,0,0);transform: translate3d(100%,0,0);}



.wqdCarousel .wqdSwitch1, .wqdCarousel .wqdSwitch2, .wqdCarousel .wqdSwitch3, .wqdCarousel .wqdSwitch4, .wqdCarousel .wqdSwitch5{-webkit-transition-property: -webkit-transform!important;-moz-transition-property: -moz-transform!important;-o-transition-property: -o-transform!important;transition-property: transform!important;}

.wqdCarousel .wqdDisappear{-webkit-transition-property: opacity!important;-moz-transition-property: opacity!important;-o-transition-property: opacity!important;transition-property: opacity!important;}

/* 动画1 */

.wqdCarousel .wqdSwitch1.active.left, .wqdCarousel .wqdSwitch1.prev {-webkit-transform: translate3d(-100%,0,0);-moz-transform: translate3d(-100%,0,0);-o-transform: translate3d(-100%,0,0);transform: translate3d(-100%,0,0);}

.wqdCarousel .wqdSwitch1.active.right, .wqdCarousel .wqdSwitch1.next{-webkit-transform: translate3d(100%,0,0);-moz-transform: translate3d(100%,0,0);-o-transform: translate3d(100%,0,0);transform: translate3d(100%,0,0);}

/* 动画2 */

.wqdCarousel .wqdSwitch2.active.left, .wqdCarousel .wqdSwitch2.prev {-webkit-transform: translate3d(0,-100%,0);-moz-transform: translate3d(0,-100%,0);-o-transform: translate3d(0,-100%,0);transform: translate3d(0,-100%,0);}

.wqdCarousel .wqdSwitch2.active.right, .wqdCarousel .wqdSwitch2.next{-webkit-transform: translate3d(0,100%,0);-moz-transform: translate3d(0,100%,0);-o-transform: translate3d(0,100%,0);transform: translate3d(0,100%,0);}

/* 动画3 */

.wqdCarousel .wqdSwitch3.active.left, .wqdCarousel .wqdSwitch3.prev {-webkit-transform: translate3d(0,-100%,0);-moz-transform: translate3d(0,-100%,0);-o-transform: translate3d(0,-100%,0);transform: translate3d(0,-100%,0);}

.wqdCarousel .wqdSwitch3.active.right, .wqdCarousel .wqdSwitch3.next{-webkit-transform: translate3d(100%,0,0);-moz-transform: translate3d(100%,0,0);-o-transform: translate3d(100%,0,0);transform: translate3d(100%,0,0);}

/* 动画4 */

.wqdCarousel .wqdSwitch4.active.left, .wqdCarousel .wqdSwitch4.prev {-webkit-transform: translate3d(100%,0,0);-moz-transform: translate3d(100%,0,0);-o-transform: translate3d(100%,0,0);transform: translate3d(100%,0,0);}

.wqdCarousel .wqdSwitch4.active.right, .wqdCarousel .wqdSwitch4.next{-webkit-transform: translate3d(100%,0,0);-moz-transform: translate3d(100%,0,0);-o-transform: translate3d(100%,0,0);transform: translate3d(100%,0,0);}

/* 动画5 */

.wqdCarousel .wqdSwitch5.active.left, .wqdCarousel .wqdSwitch5.prev {-webkit-transform: translate3d(0,-100%,0);-moz-transform: translate3d(0,-100%,0);-o-transform: translate3d(0,-100%,0);transform: translate3d(0,-100%,0);}

.wqdCarousel .wqdSwitch5.active.right, .wqdCarousel .wqdSwitch5.next{-webkit-transform: translate3d(0,-100%,0);-moz-transform: translate3d(0,-100%,0);-o-transform: translate3d(0,-100%,0);transform: translate3d(0,-100%,0);}

@media (max-width: 767px){

	.wqdCarousel .carousel-control{display: none !important;}

}

























