.iq-slider-with-text .slider-nav .slick-list {
overflow: visible;
}
.iq-slider-with-text .slider-nav {
overflow: hidden;
margin: 75px 0 60px;
width: 100%;
}
.iq-slider-with-text .slider-nav li img {
display: block;
width: auto;
height: 70px;
margin: 0 auto;
-webkit-transition: -webkit-transform .5s ease;
transition: -webkit-transform .5s ease;
transition: transform .5s ease;
transition: transform .5s ease, -webkit-transform .5s ease;
}
.iq-slider-with-text .slider-nav li {
display: inline-block;
vertical-align: middle;
margin: 0 30px;
height: 70px;
-webkit-transform: translateY(0px);
-ms-transform: translateY(0px);
transform: translateY(0px);
outline: none;
width: 150px;
-webkit-transition: -webkit-transform .5s ease;
transition: -webkit-transform .5s ease;
transition: transform .5s ease;
transition: transform .5s ease, -webkit-transform .5s ease;
}
.iq-slider-with-text .slider-for {
margin-top: -25px
}
.iq-slider-with-text .slider-for .slider-text {
padding-top: 25px
}
.iq-slider-with-text .slider-for .slider-text .slider-title {
margin-bottom: 30px;
}
.iq-slider-with-text .slider-for .slider-text.slick-active .slider-title,
.iq-slider-with-text .slider-for .slider-text.slick-active .iq-button,
.iq-slider-with-text .slider-for .slider-text.slick-active .slider-desc {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0)
}
.iq-slider-with-text .slider-for .slider-text.slick-active .slider-title {
-webkit-transition-delay: .2s;
transition-delay: .2s
}
.iq-slider-with-text .slider-for .slider-text.slick-active .slider-desc {
-webkit-transition-delay: .375s;
transition-delay: .375s
}
.iq-slider-with-text .slider-for .slider-text.slick-active .iq-button {
-webkit-transition-delay: .55s;
transition-delay: .55s
}
.iq-slider-with-text .slider-for .slider-text div {
max-width: 590px;
margin: 0 auto
}
.iq-slider-with-text .slider-for .slider-text .slider-title,
.iq-slider-with-text .slider-for .slider-text .iq-button,
.iq-slider-with-text .slider-for .slider-text .slider-desc {
opacity: 0;
-webkit-transform: translateY(-25px);
-ms-transform: translateY(-25px);
transform: translateY(-25px);
-webkit-transition: opacity .35s, -webkit-transform .5s ease;
transition: opacity .35s, -webkit-transform .5s ease;
transition: opacity .35s, transform .5s ease;
transition: opacity .35s, transform .5s ease, -webkit-transform .5s ease
}
.iq-slider-with-text .slider-nav .slick-arrow {
-webkit-transform: translateY(-62%);
-ms-transform: translateY(-62%);
transform: translateY(-62%);
}
.iq-slider-with-text .slider-nav .slick-arrow.slick-prev {
left: 25px;
}
.iq-slider-with-text .slider-nav .slick-arrow.slick-next {
right: 25px;
}
.iq-slider-with-text .slider-nav .slick-arrow {
position: absolute;
color: var(--color-theme-primary);
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
width: 50px;
height: 50px;
padding-top: 14px;
cursor: pointer;
font-size: 0;
}
.iq-slider-with-text .slider-nav .slick-arrow .slick-prev:before,
.iq-slider-with-text .slider-nav .slick-arrow .slick-next:before {
font-family: 'Roboto', sans-serif;
}
.iq-slider-with-text .slider-nav .slick-arrow.slick-prev:before,
.iq-slider-with-text .slider-nav .slick-arrow.slick-next:before {
color: var(--color-theme-primary);
} .iq-slider-with-text-2.swiper-container .consulting-project .project-details {
text-align: left;
}
.iq-slider-with-text-2.swiper-container .project-year {
position: relative;
margin-bottom: 15px;
}
.iq-slider-with-text-2.swiper-container .swiper-slide {
border-top: 1px solid rgba(0, 0, 0, 0.05);
padding-top: 30px;
margin-top: 10px;
}
.iq-slider-with-text-2.swiper-container .project-year:before {
position: absolute;
content: "";
left: 0;
top: -40px;
right: 0;
width: 20px;
height: 20px;
background: var(--color-theme-primary);
margin: 0 auto;
border-radius: 90px;
}
.iq-slider-with-text-2.swiper-container .consulting-project {
position: relative;
margin: 30px 15px;
padding: 10px;
background: var(--color-theme-white);
transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
display: inline-block;
-webkit-box-shadow: var(--primary-box-shadow);
-moz-box-shadow: var(--primary-box-shadow);
box-shadow: var(--primary-box-shadow);
border-radius: 5px;
}
.swiper-scrollbar {
background: #f7f7f9;
}
.iq-slider-with-text-2.swiper-container .consulting-project .project-details {
text-align: center;
padding: 15px;
}
.iq-slider-with-text-2.swiper-container .consulting-project .project-details span {
font-weight: normal;
color: #6f73f0;
font-family: 'Poppins', sans-serif;
margin-bottom: 10px;
} .iq-screenshots {
overflow: hidden;
position: relative;
}
@keyframes heartbeat {
0% {
transform: scale(0);
}
25% {
transform: scale(1.2);
}
50% {
transform: scale(1);
}
75% {
transform: scale(1.2);
}
100% {
transform: scale(1);
}
}
.screenshots-slider {
display: inline-block;
width: 100%;
min-height: 580px;
}
.slider-container {
position: absolute;
left: 50%;
top: 50%;
width: 780px;
height: 580px;
margin: -300px 0 0 -390px;
}
.slider-container .slider-content {
position: relative;
left: 50%;
top: 50%;
width: 100%;
height: 100%;
transform: translate(-50%, -50%);
}
.slider-container .slider-content .slider-single {
background: #ffffff;
position: absolute;
z-index: 0;
left: 0;
top: 0;
width: 100%;
height: 100%;
transition: z-index 0ms 250ms;
}
.slider-container .slider-content .slider-single .slider-single-image {
position: relative;
left: 0;
top: 0;
width: 100%;
height: 100%;
box-shadow: var(--primary-box-shadow);
transition: 500ms cubic-bezier(0.17, 0.67, 0.55, 1.43);
transform: scale(0);
opacity: 0;
}
.slider-container .slider-content .slider-single.preactivede .slider-single-image {
transform: translateX(-50%) scale(0);
}
.slider-container .slider-content .slider-single.preactive {
z-index: 1;
}
.slider-container .slider-content .slider-single.preactive .slider-single-image {
opacity: .3;
transform: translateX(-25%) scale(0.8);
}
.slider-container .slider-content .slider-single.proactive {
z-index: 1;
}
.slider-container .slider-content .slider-single.proactive .slider-single-image {
opacity: .3;
transform: translateX(25%) scale(0.8);
}
.slider-container .slider-content .slider-single.proactivede .slider-single-image {
transform: translateX(50%) scale(0);
}
.slider-container .slider-content .slider-single.active {
z-index: 2;
}
.slider-container .slider-content .slider-single.active .slider-single-image {
opacity: 1;
transform: translateX(0%) scale(1);
}
.slider-container .slider-left {
position: absolute;
z-index: 3;
display: block;
right: 110%;
top: 50%;
color: var(--color-theme-primary);
transform: translateY(-50%);
padding: 20px 15px;
font-size: 60px;
}
.slider-container .slider-right {
position: absolute;
z-index: 3;
display: block;
left: 110%;
top: 50%;
color: var(--color-theme-primary);
transform: translateY(-50%);
padding: 20px 15px;
font-size: 60px;
} .no-shadow .slider-container .slider-content .slider-single .slider-single-image {
box-shadow: none;
}
.no-shadow .slider-container .slider-content .slider-single.preactive .slider-single-image {
opacity: 0;
}
.no-shadow .slider-container .slider-content .slider-single.proactive .slider-single-image {
opacity: 0;
}
@media (min-width:768px) {
.iq-slider-with-text .slider-nav {
padding-top: 150px;
}
.iq-slider-with-text .slider-nav li.slick-current {
-webkit-transform: translateY(-75px) scale(2.5) !important;
-ms-transform: translateY(-75px) scale(2.5) !important;
transform: translateY(-75px) scale(2.5) !important;
}
}
@media (min-width:1280px) {
.iq-slider-with-text .slider-nav li.near-item {
-webkit-transition: -webkit-transform .5s ease;
transition: -webkit-transform .5s ease;
transition: transform .5s ease;
transition: transform .5s ease, -webkit-transform .5s ease;
-webkit-transform: scale(1.2) !important;
-ms-transform: translateY(-35px) scale(1.2) !important;
transform: translateY(-35px) scale(1.2) !important;
}
}
@media(max-width:1024px) {
.slider-container .slider-content {
width: 85%;
height: 85%;
}
.slider-container .slider-left {
right: 100%;
}
.slider-container .slider-right {
left: 100%;
}
}
@media(max-width:767px) {
.iq-slider-with-text .slider-nav {
margin: 35px 0
}
.slider-container .slider-content {
width: 40%;
height: 40%;
}
.slider-container .slider-left {
right: 74%;
}
.slider-container .slider-right {
left: 74%;
}
.screenshots-slider {
min-height: 250px;
}
}
@media(max-width:479px) {
.slider-container .slider-content {
width: 26%;
height: 26%;
}
.slider-container .slider-left {
right: 63%;
}
.slider-container .slider-right {
left: 63%;
}
.screenshots-slider {
min-height: 180px;
}
}