File: /home/thuexe247c/public_html/wp-content/plugins/sliderkits/assets/css/widgets/carousel-popup.css
.sk-slick-carousel-popup.slick-slider {
padding-bottom: 50px;
margin-bottom: 0;
}
.sk-slick-carousel-popup .sk-slick-item {
height: 500px;
width: 850px;
margin-right: 50px;
}
.sk-slick-carousel-popup .sk-slick-item .sk-slick-item__container {
z-index: 3;
color: #fff;
position: relative;
}
.sk-slick-carousel-popup .sk-slick-item .sk-heading {
font-size: 2.5em;
}
.sk-slick-carousel-popup .sk-slick-item .sk-content,
.sk-slick-carousel-popup .sk-slick-item .sk-content p {
font-size: 16px;
}
.sk-slick-carousel-popup .sk-slick-item .sk-content {
display: none;
}
.sk-learn-more-circle {
position: absolute;
z-index: 3;
color: #fff;
bottom: 70px;
right: 40px;
font-size: 20px;
transition: transform 0.3s;
}
.sk-learn-more-circle:before {
width: 80px;
height: 80px;
display: block;
background: #8644ef;
color: #fff;
content: '';
border-radius: 100px;
position: absolute;
bottom: -25px;
right: 50px;
z-index: -1;
}
.sk-learn-more-circle:hover {
transform: scale(1.1);
transition: transform 0.3s;
}
.sk-slick-carousel-popup .slick-dots {
bottom: 0;
}
.sk-slick-carousel-popup .sk-slick-item.slick-current .sk-slick-item__bg {
animation: skZoomOut 3s cubic-bezier(0.4, 0, 0.2, 1) 0.1s backwards;
-webkit-animation: skZoomOut 3s cubic-bezier(0.4, 0, 0.2, 1) 0.1s backwards;
transform: scale(1);
-webkit-transform: scale(1);
}
.sk-slick-carousel-popup .sk-slick-item.slick-current .sk-heading{
animation: skFadeInFromLeft 1s cubic-bezier(0.4, 0, 0.2, 1) 0.3s backwards;
-webkit-animation: skFadeInFromLeft 1s cubic-bezier(0.4, 0, 0.2, 1) 0.3s backwards;
}
.sk-slick-carousel-popup .sk-slick-item.slick-current .sk-content{
animation: skFadeInFromLeft 0.5s cubic-bezier(0.4, 0, 0.2, 1) 0.5s backwards;
-webkit-animation: skFadeInFromLeft 0.5s cubic-bezier(0.4, 0, 0.2, 1) 0.5s backwards;
}
.sk-slick-carousel-popup .sk-slick-item.slick-current .sk-learn-more-circle {
animation: skFadeInFromLeft 0.5s linear 0.7s backwards;
-webkit-animation: skFadeInFromLeft 0.5s linear 0.7s backwards;
}
.sk-fullscreen-popup {
width: 100vw;
height: 100vh;
position: fixed;
z-index: 999;
top: 0;
left: 0;
transition: all 0.3s;
}
.sk-fullscreen-popup .sk-slick-item__container {
color: #fff;
}
.sk-fullscreen-popup .sk-slick-item .sk-content {
display: block;
}
.sk-fullscreen-popup .sk-slick-item .sk-slick-item__overlay,
.sk-fullscreen-popup .sk-slick-item .sk-slick-item__bg {
width: 100%;
height: 100vh;
left: 0;
top: 0;
position: absolute;
}
.sk-fullscreen-popup .sk-slick-item .sk-slick-item__overlay {
z-index: 2;
background: rgba(0,0,0, 0.6);
}
.sk-fullscreen-popup .sk-slick-item .sk-slick-item__bg {
z-index: 1;
background-size: cover;
background-position: center;
}
.sk-popup-close {
color: #fff;
font-size: 30px;
position: absolute;
z-index: 3;
top: 50px;
right: 40px;
border: 1px solid #fff;
padding: 20px 22px;
border-radius: 100px;
}
.sk-popup-close:hover {
color: #000;
background: #fff;
border-color: #fff;
}
@media(max-width: 767px) {
.sk-slick-carousel-popup .sk-slick-item {
margin-right: 0;
}
.sk-learn-more-circle {
position: relative;
bottom: auto;
right: auto;
}
.sk-popup-close {
font-size: 2em;
top: 60px;
right: 20px;
padding: 10px 12px;
}
}
@media(max-width: 575px) {
.sk-slick-carousel-popup .sk-slick-item .sk-heading {
font-size: 2em;
}
}
@media(max-width: 480px) {
.sk-slick-carousel-popup .sk-slick-item .sk-heading {
font-size: 1.6em;
}
.sk-learn-more-circle {
font-size: 18px;
margin-bottom: 20px;
}
.sk-learn-more-circle:before {
width: 50px;
height: 50px;
bottom: -12px;
right: auto;
left: 10px;
}
}