.banner-wrap{
    padding:0;
    position:relative;
    
}
.bgslide{
width: 100%;
    height: 80vh;
    position: relative;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    border-bottom-left-radius: 20px;
    border-top-left-radius: 20px;
    overflow: hidden;

}
.bgslide:after{
    width:100%;
    height:100%;
    position:absolute;
    left:0;
    top:0;
    content:'';
    background-color: rgba(0, 0, 0,0.0);
}

.slide1{
    background-image:url(../images/slider1.jpg)
}
.slide2{
    background-image:url(../images/slider1.jpg)
}
.slide3{
    background-image:url(../images/slider1.jpg)
}
.slide4{
    background-image:url(../images/4.jpg)
}
.slide5{
    background-image:url(../images/5.jpg)
}
.slide6{
    background-image:url(../images/6.jpg)
}
.slide7{
    background-image:url(../images/7.jpg)
}
.slide8{
    background-image:url(../images/8.jpg)
}
.slide9{
    background-image:url(../images/9.jpg)
}

.caption-outer{
    display:inline-block;
    background-image: linear-gradient(to left,   rgba(217,10,140,0), rgba(217,10,140,1)); /* Standard syntax (must be last) */
    padding:20px;
}
.carousel-caption{
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
    display:table;
    text-align:center;
    z-index:1;
    padding: 0 8%;
    color:#fff;
}
.parent{
    width:100%;
    height:100%;
    display:table
}
.child{
    display:table-cell;
    vertical-align:middle
}
.caption-right{
    text-align: left;
    width: 50%;
}
.carousel-caption h2{
 
font-weight: 400;
 
margin: 0 0 20px 0;
 
padding:0;
 
font-size: 71px;
 
line-height: 72px;
 
color: var(--black);
}
.carousel-caption p{
    font-size: 26px;
    line-height:normal;
    color: var(--black);
}
.carousel-caption p span{
    font-size:18px;
    background-color:#5D5F31;
    padding:10px 25px;
}
.animset{
    animation-duration:1s;
    animation-delay:1s
}
.animset2{
    animation-duration:1.9s;
    animation-delay:1.9s
}
.animset3{
    animation-duration:2.5s;
    animation-delay:2.5s
}
.carousel-inner>.item>a>img,.carousel-inner>.item>img,.img-responsive,.thumbnail a>img,.thumbnail>img{
    display:block;
    max-width:100%;
    height:auto
}
.carousel{
    position:relative;
}
.carousel-inner{
    position:relative;
    width:100%;
    overflow:hidden;
      border-bottom-left-radius: 20px;
    border-top-left-radius: 20px;
    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
}
.carousel-inner>.item>a>img,.carousel-inner>.item>img{
    line-height:1
}
@media all and (transform-3d),(-webkit-transform-3d){
    .carousel-inner>.item{
        backface-visibility:visible;
        perspective:1000px;
        transition:opacity .7s ease-in-out 0s;
        background-color:#fff;
            
    }
    .carousel-inner>.item.active.right,.carousel-inner>.item.next{
      /* left: 0;
    -webkit-transition: opacity 0.7s ease-in-out;
    -moz-transition: opacity 0.7s ease-in-out;
    -ms-transition: opacity 0.7s ease-in-out;
    -o-transition: opacity 0.7s ease-in-out;
    transition: opacity 0.7s ease-in-out;
    opacity:0;*/
    left: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    }
    .carousel-inner>.item.active.left,.carousel-inner>.item.prev{
      /*left: 0;
    -webkit-transition: opacity 0.7s ease-in-out;
    -moz-transition: opacity 0.7s ease-in-out;
    -ms-transition: opacity 0.7s ease-in-out;
    -o-transition: opacity 0.7s ease-in-out;
    transition: opacity 0.7s ease-in-out;
    opacity:0;*/
    left: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0)
    }
    .carousel-inner>.item.active,.carousel-inner>.item.next.left,.carousel-inner>.item.prev.right{
        /*left: 0;
    opacity:1;*/
    left: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
    }
    .carousel-inner .item .zoom-img{
       transform:scale(1.2);
         transition:all 4s ease 0s 
    }
    .carousel-inner .item.active .zoom-img{
        transform:scale(1)
    }


    @media all and (transform-3d),(-webkit-transform-3d){
        .carousel-inner>.item{
            -webkit-transition:-webkit-transform .6s ease-in-out
        }
        .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:auto;
            font-size:20px;
            color:#fff;
            text-align:center;
            z-index:2;
            display: none;
            
        }
        .carousel-control.left{
            left:0
        }
        .carousel-control.right{
            right:0;
            left:auto
        }
        .carousel-control .glyphicon-chevron-left,.carousel-control .glyphicon-chevron-right{
            position:absolute;
            top:50%;
            z-index:2;
            display:inline-block;
            margin-top:-30px;
            background-color:rgba(0,0,0,0.5);
            background-repeat:no-repeat;
            background-position:center center!important;
            width:60px!important;
            height:60px!important;
            background-size:50%!important;
            position:relative;
            -webkit-transition:all .3s ease-in-out;
            -moz-transition:all .3s ease-in-out;
            transition:all .3s ease-in-out
        }
        .carousel-control .glyphicon-chevron-left{
            left:0;
            background-image:url(../images/icons/prev.png)
        }
        .carousel-control .glyphicon-chevron-right{
            right:0;
            background-image:url(../images/icons/next.png)
        }
        .carousel-control .glyphicon-chevron-left:hover,.carousel-control .glyphicon-chevron-right:hover{
            background-size:50%!important;
            background-color:#AFAB51;
        }
        .carousel-indicators{
            position:absolute;
            bottom: 30px;
            left: 40px;
            z-index:3;
            width: auto;
            padding-left:0;
            text-align:center;
            list-style:none;
            font-size: 0;
        }
        .carousel-indicators li{
            display:inline-block;
            width: 9px;
            height: 9px;
            margin: 1px 8px;
            text-indent:-999px;
            cursor:pointer;
            border-radius:100%;
            background: #fff;
        }
        .carousel-indicators .active{
            width:10px;
            height:10px;
            margin:1px 5px;
            background-color: #000;
        }
        @media screen and (max-width:640px){
            .banner-wrap:before{
                display:none
            }
            .banner-wrap{
                top:0
            }
            .bgslide{
                height:250px
            }
            .carousel-caption{
           
                padding:0 15px;
          
            }
            .carousel-control .glyphicon-chevron-left,.carousel-control .glyphicon-chevron-right{
                width:40px!important;
                height:40px!important;
                margin-top:-20px;
                font-size:30px
            }
            .carousel-indicators{
                bottom:10px
            }
            .carousel-caption h2{
                font-size:25px;
                line-height:25px;
                margin:0 0 10px 0
            }
            .carousel-caption p{
              font-size: 16px;
                margin-bottom: 10px;
            }
        }
    }
}
