Slider 12
Slider 12
/* ===== Slider 12 ===== */
#slider-12 .carousel-item {
padding-top: 100px;
padding-bottom: 140px;
background: rgba(255, 193, 7, 0.3);
-webkit-transition: all .1s;
-o-transition: all .1s;
transition: all .1s;
}
#slider-12 .carousel-item:nth-child(2) {
background: rgba(40, 167, 69, 0.3);
}
#slider-12 .carousel-item:nth-child(3) {
background: rgba(0, 123, 255, 0.3)
}
#slider-12 .carousel-item:nth-child(4) {
background: rgba(111, 66, 193, 0.3)
}
#slider-12 .carousel-item h2 {
font-weight: 900
}
#slider-12 .row .col-12:first-child .card {
-webkit-transform: translatey(100%);
-ms-transform: translatey(100%);
transform: translatey(100%);
-webkit-transition: all 1s;
-o-transition: all 1s;
transition: all 1s;
border: none;
opacity: 0;
background: transparent;
}
#slider-12 .active .row .col-12:first-child .card {
-webkit-transform: translatey(0%);
-ms-transform: translatey(0%);
transform: translatey(0%);
opacity: 1;
}
#slider-12 .row .col-12 img {
-webkit-transform: translatex(100%);
-ms-transform: translatex(100%);
transform: translatex(100%);
-webkit-transition: all 1s;
-o-transition: all 1s;
transition: all 1s;
border: none;
opacity: 0;
background: transparent;
}
#slider-12 .active .row .col-12 img {
-webkit-transform: translatex(0%);
-ms-transform: translatex(0%);
transform: translatex(0%);
opacity: 1;
}
#slider-12 i {
font-size: 24px;
margin-right: .5rem;
}
#slider-12 .icons {
position: absolute;
width: 100%;
z-index: 999;
bottom: 20px;
}