Slider 7

Home » Components » Slider » Slider 7

Slider 7


/* ===== Slider 7 ===== */

#slider-7 .carousel-inner .carousel-item.carousel-item-next, 
#slider-7 .carousel-inner .carousel-item.active.carousel-item-right {
	transform: translate3d(0, 100%, 0);
	-webkit-transform: translate3d(0, 100%, 0);
	-ms-transform: translate3d(0, 100%, 0);
	-moz-transform: translate3d(0, 100%, 0);
	-o-transform: translate3d(0, 100%, 0);
	top: 0;
}

#slider-7 .carousel-inner .carousel-item.carousel-item-prev, 
#slider-7 .carousel-inner .carousel-item.active.carousel-item-left {
	transform: translate3d(0, -100%, 0);
	-webkit-transform: translate3d(0, -100%, 0);
	-moz-transform: translate3d(0, -100%, 0);
	-ms-transform: translate3d(0, -100%, 0);
	-o-transform: translate3d(0, -100%, 0);
	top: 0;
}

#slider-7 .carousel-inner .carousel-item.next.carousel-item-left, 
#slider-7 .carousel-inner .carousel-item.carousel-item-prev.carousel-item-right, 
#slider-7 .carousel-inner .carousel-item.active {
	transform: translate3d(0, 0, 0);
	-webkit-transform: translate3d(0, 0, 0);
	-ms-transform: translate3d(0, 0, 0);
	-moz-transform: translate3d(0, 0, 0);
	-o-transform: translate3d(0, 0, 0);
	top: 0;
	-webkit-transition: all .8s;
	-o-transition: all .8s;
	transition: all .8s;
}

#slider-7 .carousel-indicators {
	display: initial;
	position: absolute;
	margin: 0;
	display: block;
	bottom: initial;
	right: 10px;
	top: 50%;
	-webkit-transform: translatey(-50%);
	-ms-transform: translatey(-50%);
	transform: translatey(-50%);
	left: initial;
}

#slider-7 .carousel-indicators li {
	height: 8px;
	border-radius: 50px;
	padding: 5px;
	-webkit-transform: scale(.6);
	-ms-transform: scale(.6);
	transform: scale(.6);
	width: 8px;
	display: block;
	border: none;
	background-color: #000;
}

#slider-7 .carousel-item:nth-child(1) .col-lg-7 {
	background-image: -o-linear-gradient(330deg, #d4fc79 0%, #96e6a1 100%);
	background-image: linear-gradient(120deg, #d4fc79 0%, #96e6a1 100%);
}

#slider-7 .carousel-item:nth-child(2) .col-lg-7 {
	background-image: -o-linear-gradient(330deg, #84fab0 0%, #8fd3f4 100%);
	background-image: linear-gradient(120deg, #84fab0 0%, #8fd3f4 100%);
}

#slider-7 .carousel-item:nth-child(3) .col-lg-7 {
	background-image: -webkit-gradient(linear, left top, left bottom, from(#2af598), to(#009efd));
	background-image: -o-linear-gradient(top, #2af598 0%, #009efd 100%);
	background-image: linear-gradient(180deg, #2af598 0%, #009efd 100%);
}

#slider-7 .carousel-item:nth-child(4) .col-lg-7 {
	background-image: -webkit-gradient(linear, left top, right top, from(#6a11cb), to(#2575fc));
	background-image: -o-linear-gradient(left, #6a11cb 0%, #2575fc 100%);
	background-image: linear-gradient(to right, #6a11cb 0%, #2575fc 100%);
}

#slider-7 .card-body {
	height: 300px;
	overflow: auto
}

@media(max-width: 992px) {
	
	#slider-7 .carousel-indicators {
		top: initial;
		bottom: 20px;
		-webkit-transform: translatey(0%);
		-ms-transform: translatey(0%);
		transform: translatey(0%);
	}

	#slider-7 .card-body {
		height: 300px;
		overflow: auto
	}

	#slider-7 .col-lg-5 {
		height: 300px;
	}
}