/*========================================*/
/*------------- [_Home_Slider] -----------*/
/*========================================*/
.home-carousel .slide-item .image-layer {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
.auto-container {
position: static;
max-width: 1200px;
padding: 0px 15px;
margin: 0 auto;
}
.banner-section{
position: relative;
}
.home-carousel{
position: relative;
}
.home-carousel .slide-item{
position: relative;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
padding: 200px 0px 200px 0px;
z-index: 1;
}
.home-carousel .slide-item:before{
position: absolute;
content: '';
width: 100%;
height: 100%;
top: 0px;
right: 0px;
z-index: 1;
}
.home-carousel .slide-item .image-layer{
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
.home-carousel .content-box{
position: relative;
display: block;
z-index:5;
width: 100%;
}
.home-carousel .content-box h1{
position: relative;
display: block;
color: #fff;
font-size: 68px;
line-height: 92px;
font-weight: 900;
margin-bottom: 30px;
opacity: 0;
@include transform(translateY(100px));
@include transition(all 1000ms ease);
}
.home-carousel .active .content-box h1{
opacity: 1;
@include transform(translateY(0));
-webkit-transition-delay: 1000ms;
-moz-transition-delay: 1000ms;
-ms-transition-delay: 1000ms;
-o-transition-delay: 1000ms;
transition-delay: 1000ms;
}
.home-carousel .content-box p{
position: relative;
display: block;
color: #fff;
margin-bottom: 40px;
font-size: 20px;
line-height: 36px;
opacity: 0;
@include transform(translateY(100px));
@include transition(all 1300ms ease);
}
.home-carousel .active .content-box p{
opacity: 1;
@include transform(translateY(0));
-webkit-transition-delay: 1300ms;
-moz-transition-delay: 1300ms;
-ms-transition-delay: 1300ms;
-o-transition-delay: 1300ms;
transition-delay: 1300ms;
}
.banner-section .home-carousel .content-box a.theme-btn{
padding: 14px 47px;
}
.home-carousel .content-box .btn-box{
position: relative;
opacity: 0;
@include transform(translateY(100px));
@include transition(all 1600ms ease);
}
.home-carousel .active .content-box .btn-box{
opacity: 1;
@include transform(translateY(0));
-webkit-transition-delay: 1600ms;
-moz-transition-delay: 1600ms;
-ms-transition-delay: 1600ms;
-o-transition-delay: 1600ms;
transition-delay: 1600ms;
}