.ct-testimonial {
    .item-star {
        margin-top: 10px;
        display: inline-block;
        i {
            display: inline-block;
            font-size: 15px;
            color: rgba($third_color,0.5);
            margin: 0 1px;
        }
        &.one-star {
            i:nth-child(1) {
                color: #f6b91c;
            }
        }
        &.two-star {
            i:nth-child(1), i:nth-child(2) {
                color: #f6b91c;
            }
        }
        &.three-star {
            i:nth-child(1), i:nth-child(2), i:nth-child(3) {
                color: #f6b91c;
            }
        }
        &.four-star {
            i:nth-child(1), i:nth-child(2), i:nth-child(3), i:nth-child(4) {
                color: #f6b91c;
            }
        }
        &.five-star {
            i {
                color: #f6b91c;
            }
        }
    }
}
.ct-testimonial-grid1 {
	.item--icon {
		position: absolute;
		top: 30px;
		right: 25px;
		img {
			max-height: 60px;
		}
	}
	.item--image {
		width: 80px;
		min-width: 80px;
		max-height: 80px;
		border: 3px solid $primary_color;
		border-radius: 80px;
		margin-right: 22px;
		img {
			border-radius: 80px;
		}
		@media #{$max-lg} {
			margin-right: 18px;
		}
		@media #{$max-sm} {
			width: 60px;
			min-width: 60px;
			max-height: 60px;
		}
	}
	.item--title {
		margin-bottom: 3px;
		font-size: 20px;
		@media #{$max-sm} {
			font-size: 18px;
		}
	}
	.item--position {
		font-size: 15px;
		color: #081f47;
	}
	.item--description {
		color: #888;
		line-height: 1.5;
	}
	.item--star {
		font-size: 14px;
		color: #ffd40b;
		i {
			transform: rotate(-7deg);
		}
	}
	.item--holder {
		display: flex;
		flex-wrap: nowrap;
		margin-bottom: 22px;
		padding-right: 50px;
	}
	.item--inner {
		background-color: #fff;
		padding: 30px 30px 26px 25px;
		@include box-shadow(0 17px 50px rgba(#000a50, 0.05));
		margin-bottom: 30px;
		position: relative;
		&:hover .item--icon {
			animation: icon-bounce 800ms ease-out infinite;
        	-webkit-animation: icon-bounce 800ms ease-out infinite;
		}
	}
}
.ct-testimonial-carousel1 {
	position: relative;
	.item--icon {
		line-height: 1;
		font-size: 45px;
		margin-right: 20px;
		position: relative;
		i {
			@extend .text-gradient;
		}
		@media #{$max-sm} {
			font-size: 34px;
			margin-right: 16px;
		}
	}
	.item--description {
		font-size: 30px;
		line-height: 1.6;
		color: #081f47;
		margin-top: 10px;
		margin-bottom: 30px;
		@media #{$max-lg} {
			font-size: 26px;
			line-height: 1.4;
		}
		@media #{$max-sm} {
			font-size: 18px;
		}
	}
	.item--title {
		margin-bottom: 9px;
		font-size: 20px;
	}
	.item--position {
		font-size: 14px;
		color: $primary_color;
		@media #{$max-sm} {
			font-size: 13px;
		}
	}
	.ct-carousel-primary {
		.item--inner {
			display: flex;
			flex-wrap: nowrap;
		}
		.slick-dots {
			display: none !important;
		}
	}
	.ct-slick-nav {
		margin-top: 30px;
		.slick-prev, .slick-next {
			display: none !important;
		}
		.slick-list {
			padding: 0 !important;
		}
		.slick-track {
			width: auto !important;
			transform: translate(0) !important;
			padding: 0 !important;
			display: flex;
			align-items: center;
			.slick-slide {
				width: auto !important;
			}
		}
		.item--image {
			width: 18px;
			height: 70px;
			position: relative;
			cursor: pointer;
			@include transition(.3s cubic-bezier(.24,.74,.58,1));
			margin: 7px;
			&:before {
				content: '';
				width: 18px;
				height: 18px;
				position: absolute;
				top: 50%;
				left: 50%;
				@include border-radius(100%);
				background-color: $primary_color;
				@include transform(translate(-50%, -50%));
				border: 2px solid $primary_color;
			}
			img {
				width: 52px;
				height: 52px;
				min-width: 52px;
				min-height: 52px;
				position: absolute;
				top: 50%;
				left: 50%;
				transform: translate(-50%, -50%) scale(0);
				@include transition(.3s cubic-bezier(.24,.74,.58,1));
				@include border-radius(100%);
			}
		}
		.slick-current {
			.item--image {
				width: 70px;
				height: 70px;
				img {
					transform: translate(-50%, -50%) scale(1);
				}
				&:before {
					width: 100%;
					height: 100%;
					background-color: transparent;
				}
			}
		}
		@media #{$min-md} {
			margin: 0;
			position: absolute;
			bottom: 22px;
			right: 0;
			.item--image {
				width: 70px;
				height: 18px;
			}
			.slick-track {
				display: grid;
			}
			.slick-current {
				.item--image {
					height: 70px;
				}
			}
		}
	}
	.ct-slick-carousel[data-dots="true"] {
		padding-right: 120px;
		@media #{$max-lg} {
			padding-right: 100px;
		}
		@media #{$max-sm} {
			padding-right: 0;
		}
	}
}
.ct-testimonial-carousel2 {
	.item--icon {
		font-size: 122px;
		font-weight: 700;
		@extend .text-gradient;
		@include background-horizontal($gradient_color_to, $gradient_color_from);
		position: absolute;
		top: -103px;
		right: -8px;
		line-height: 1;
		transform: rotate(180deg);
	}
	.item--image {
		width: 114px;
		min-width: 114px;
		height: 114px;
		margin-right: 20px;
		padding: 13px;
		z-index: 1;
		position: relative;
		margin-top: 22px;
		@media #{$max-md} {
			padding: 10px;
			width: 90px;
			min-width: 90px;
			height: 90px;
		}
		&:before {
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			@include background-horizontal($gradient_color_from, $gradient_color_to);
			@include border-radius(114px);
			z-index: -2;
		}
		&:after {
			content: '';
			position: absolute;
			top: 2px;
			left: 2px;
			bottom: 2px;
			right: 2px;
			background-color: #f6f7f8;
			@include border-radius(114px);
			z-index: -1;
		}
		img {
			@include border-radius(114px);
		}
	}
	.item--description {
		color: #666;
		font-size: 17px;
		line-height: 1.764;
		margin-bottom: 21px;
		@media #{$max-xs} {
			font-size: 16px;
		}
	}
	.item--title {
		margin-bottom: 0;
		font-size: 20px;
	}
	.item--position {
		span {
			font-size: 15px;
			font-weight: 500;
			@extend .text-gradient;
		}
	}
	.item--inner {
		background-color: #f6f7f8;
		padding: 40px 30px 38px 40px;
		position: relative;
		display: flex;
		flex-wrap: nowrap;
		@media #{$max-lg} {
			padding-left: 30px;
			padding-right: 20px;
		}
		@media #{$max-xs} {
			padding-left: 20px;
		}
	}
}
.ct-testimonial-carousel3 {
    display: block !important;
    .item--description {
        font-weight: 500;
        color: #888888;
        margin-bottom: 27px;
        line-height: 1.625;
    }
    .item--image {
        width: 80px;
        min-width: 80px;
        margin-right: 16px;
        @media #{$max-xs} {
            width: 60px;
            min-width: 60px;
        }
        img {
            @include border-radius(80px);
            @include box-shadow(0 7px 18px rgba(#020033, 0.26));
        }
    }
    .item--title {
        font-size: 16px;
        margin-bottom: 4px;
    }
    .item--position {
        font-size: 15px;
        color: #6e6e6e;
    }
    .item--holder {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        padding-bottom: 25px;
    }
    .item--inner {
        margin-bottom: 30px;
    }
    .slick-dots {
        margin: 0;
        position: absolute;
        bottom: 60px;
        right: 30px;
        display: block !important;
        li {
            margin: 9px 0;
        }
    }
}
.ct-testimonial-carousel4 {
	.item--title {
		margin-bottom: 5px;
		font-size: 18px;
		color: #fff;
		font-weight: bold;
	}
	.item--position {
		color: #fff;
		font-weight: 500;
	}
	.item--image {
		border-radius: 50%;
		overflow: hidden;
		width: 52px;
		min-width: 52px;
		max-width: 52px;
		height: 52px;
		margin-right: 20px;
		@media #{ $max-lg } {
			margin-bottom: 24px;
			margin-right: 0;
		}
	}
	.item--holder {
		padding: 15px 20px;
		@include border-radius(7px);
		background-color: $secondary_color;
		@media #{ $min-xl } {
			position: absolute;
			top: -32px;
			left: 30px;
			right: 55px;
			display: flex;
			align-items:center;
		}
		@media #{ $max-lg } {
			margin-bottom: 20px;
		}
	}
	.item--description {
		font-size: 16px;
		line-height: 1.875;
		color: $third_color;
	}
	.item--inner {
		background-color: #f4f4f4;
		@include transition(all 300ms linear 100ms);
		padding: 30px 20px;
		@media #{ $min-xl } {
			position: relative;
			padding: 75px 20px 30px 30px;
			margin-top: 35px;
			margin-bottom: 35px;
		}
		@media #{ $max-sm } {
			padding: 30px 15px;
		}
		&:hover {
			background-color: #fff;
			@media #{ $min-xxl } {
				@include box-shadow(0 8px 35px rgba(#0c0c0c, 0.09));
			}
		}
	}
	.slick-dots {
		margin-top: 25px;
	}
	.slick-list {
		@media #{ $min-xxl } {
			margin: 0 -40px;
			padding: 0 40px;
			.slick-slide {
				opacity: 0;
				&.slick-active {
					opacity: 1;
				}
			}
		}
	}
}
.ct-testimonial-carousel5 {
	.item--icon {
		width: 40px;
		height: 40px;
		@include border-radius(40px);
		font-size: 22px;
		line-height: 40px;
		font-weight: 700;
		text-align: center;
		background-color: rgba(#0a69f9, 0.2);
		margin-bottom: 18px;
		i {
			color: #0a69f9;
		}
	}
	.item--image {
		width: 108px;
		min-width: 108px;
		height: 108px;
		margin-left: 20px;
		padding: 8px;
		z-index: 1;
		position: relative;
		margin-top: 22px;
		border: 2px dashed #0a69f9;
		@include border-radius(108px);
		@media #{$max-md} {
			padding: 10px;
			width: 90px;
			min-width: 90px;
			height: 90px;
		}
		img {
			@include border-radius(108px);
		}
	}
	.item--description {
		color: #666;
		font-size: 16px;
		font-weight: 500;
		line-height: 1.764;
		margin-bottom: 21px;
		@media #{$max-xs} {
			font-size: 16px;
		}
	}
	.meta-star {
		label {
			font-size: 16px;
			font-weight: bold;
			color: $secondary_color;
			@include font-family-heading($heading_default_font);
		}
	}
	.item--title {
		margin-bottom: 0;
		font-size: 24px;
		@media #{ $max-sm } {
			font-size: 18px;
		}
	}
	.item--position {
		span {
			font-size: 15px;
			font-weight: 500;
			@extend .text-gradient;
		}
	}
	.item--meta-top {
		position: relative;
		display: flex;
		align-items: center;
		flex-wrap: nowrap;	
		justify-content: space-between;
	}
	.item--meta-bottom {
		position: relative;
		display: flex;
		flex-wrap: nowrap;
		align-items: center;
		justify-content: space-between;
	}
	.item--inner {
		margin: 10px 0;
		padding: 20px 20px 20px 23px;
		background-color: #fff;
		@include border-radius(7px);
		@include box-shadow(0 4px 10px rgba(#0c0c0c, 0.09));
	}
	.slick-list {
		overflow: hidden;
		padding: 0 30px;
		margin: 0 -30px;
	}
	.ct-slick-carousel {
		position: relative;
	}
	.slick-dots {
		@media #{ $min-md } {
			flex-direction: column;
			margin: 0;
			position: absolute;
			top: 13px;
			left: -15px;
		}
		li {
			button {
			    @include border-radius(7px);
			    background-color: #0a69f9;
				@media #{ $min-md } {
				    height: 14px;
				    width: 7px;
				}
				@media #{ $max-sm } {
				    height: 7px;
				    width: 14px;	
				}
				&:after {
					display: none;
				}
			}
			&.slick-active {
				button {
					@media #{ $min-md } {
					    height: 40px;
					    width: 7px;
					}
					@media #{ $max-sm } {
					    height: 7px;
					    width: 40px;	
					}
				    background-color: #00d09b;
				    @include border-radius(7px);
				}
			}
			+ li {
				margin-top: 7px;
				margin-bottom: 0;
			}
		}
	}
}
.ct-testimonial-carousel6 {
	position: relative;
	z-index: 1;
	.img-bg {
		z-index: -1;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-position: center center;
		background-size: cover;
		background-repeat: no-repeat;
		&:before {
			position: absolute;
			top: 0;
			left: 0;
			content: "";
			display: block;
			width: 100%;
			height: 100%;
			background-color: rgba(#000, 0.7);
		}
	}	
	.ct-carousel-inner {
		overflow: hidden;
		padding: 0 45px 30px;
		margin-left: 0;
		margin-right: 0;
		@media #{ $max-md } {
			padding-left: 20px;
			padding-right: 20px;
		}
		.slick-dots {
		  margin: 42px 0 0px;
		  list-style: none;
		  display: flex;
		  justify-content: end;
		  padding-right: 20px;
		  align-items: center;
		  li {
		    display: flex;
		    margin: 0 3px;
		    line-height: 1;
		    button {
		      height: 13px;
		      width: 13px;
		      background-color: $primary_color;
		      padding: 0;
		      @include border-radius(0px);
		      &:before {
		      	display: none;
		      }
		      &:after {
		      	display: none;
		      }
		    }
		    &.slick-active {
		      button {
		        background: #fff;
		      }
		    }
		  }
		}
	}
	.item--image {
		max-width: 150px;
		max-height: 150px;
		min-height: 150px;
		min-width: 150px;
		overflow: hidden;
		@include border-radius(50%);
		margin: 0 auto 15px;
		img {
			@include border-radius(108px);
		}
	}
	.item--title {
		font-size: 28px;
		font-weight: 400;
		text-transform: uppercase;
		margin-bottom: 20px;
	}
	.item--position {
		font-size: 13px;
		text-transform: uppercase;
	}
	.item--description {
		font-size: 18px;
		.item--icon {
			display: inline-block;
			height: 15px;
			width: 15px;
			font-size: 55px;
			color: #fff;
			line-height: 0;
			color: $primary_color;
		}
		.icon-after {
			position: relative;
			top: -15px;
			left: 25px;
			@include transform( rotate(-180deg) );
		}
	}
	.item--inner {
		text-align: center;
		padding: 110px 0px 0px;
	}
}
.ct-testimonial-carousel7 {
	.ct-slick-carousel[data-centermode="true"] {
		.slick-list {
			padding-left: 0!important;
			padding-right: 0!important;
		}
	}
	.wp-meta {
		padding-left: 15px;
		padding-right: 15px;
		margin-bottom: 55px;
		display: flex;
		align-items: center;
		justify-content: space-between;
		@media #{ $max-xs } {
			flex-wrap: wrap;
			margin-bottom: 35px;
		}
	}
	.wp-titles {
		.el--sub-title {
			font-size: 18px;
			font-weight: 500;
			color: #29beef;
			margin-bottom: 10px;
		}
		.el--title {
			font-size: 40px;
			margin-bottom: 0;
			@media #{ $max-xs } {
				margin-bottom: 25px;
				font-size: 30px;
			}
			cite {
				font-style: normal;
				color: #faa80a;
			}
		}
	}
	.btn-readmore {
		line-height: 53px;
		padding-left: 32px;
		padding-right: 32px;
		background-color: #141414;
		font-size: 14px;
		font-weight: bold;
		color: #fff;
		display: inline-block;
		position: relative;
		@include transition(.3s cubic-bezier(.24,.74,.58,1));
		margin-right: 10px;
		margin-bottom: 10px;
		&:before {
			content: "";
			width: 100%;
			height: 100%;
			background-color: transparent;
			border: 2px solid #faa80a;
			position: absolute;
			opacity: 1;
			top: 10px;
			left: 10px;
			@include transition(.2s cubic-bezier(.24,.74,.58,1));
		}
		&:hover {
			margin-right: 0;
			margin-bottom: 0;
			color: #fff;
			&:before {
				border-color: #141414;
				top: 0;
				left: 0;
			}
		}
	}
	.item--image {
		z-index: 1;
		overflow: hidden;
		padding: 8px;
		background-color: #fff;
		max-width: 88px;
		display: inline-block;
		margin: 0  auto 20px;
		position: absolute;
		top: -44px;
		left: 50%;
		@include transform(translateX(-50%));
	}
	.item--title {
		font-size: 22px;
		margin-bottom: 0;
	}
	.item--position {
		font-size: 14px;
		color: #48c8f2;
	}
	.item-main {
		.item--title {
			margin-bottom: 15px;
		}
		.item--description {
			color: #595959;
			padding-left: 20px;
			padding-right: 20px;
		}
	}
	.item-star {
		margin-bottom: 15px;
	}
	.item--meta {
		display: flex;
		align-items: flex-end;
		justify-content: center;
		margin-bottom: 10px;
		.item--title {
			color: #fff;
		}
		.item--position {
			color: #48c8f2;
			&:before {
				content: "/";
				display: inline-block;
				margin-left: 5px;
				margin-right: 5px;
			}
		}
	}
	.item--holder {
		padding: 70px 25px 45px 25px;
		background-color: #000000;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		width: 100%;
		opacity: 0;
		@include transform(scaleY(0));
		transform-origin: top center;
		-webkit-transform-origin: top center;
		@include transition(.3s cubic-bezier(.24,.74,.58,1));
		&:after {
			-webkit-transition-delay: 500ms;
			content: "";
			display: inline-block;
			bottom: -15px;
			height: 15px;
			background-color: #faa80a;
			position: absolute;
			left: 50%;
			width: 85%;
			@include transform(translateX(-50%) scaleX(0));
			opacity: 0;
			@include transition(.3s cubic-bezier(.24,.74,.58,1));
			-webkit-transition-delay: 0.42s;
            -moz-transition-delay: 0.42s;
            transition-delay: 0.42s;
		}
		.item--description {
			color: #ccc;
			padding-left: 20px;
			padding-right: 20px;
		}		
	}
	.item-icon {
		line-height: 1;
		position: absolute;
		top: 0;
		left: 40px;
		top: -15px;
		font-weight: 400;
		width: 31px;
		height: 24px;
		text-align: center;
		svg {
			fill: #faad18;
			overflow: visible;
		}
	}
	.item--inner {
		margin-top: 45px;
		text-align: center;
		padding: 70px 25px 45px 25px;
		background-color: #f3f3f3;
		position: relative;
		margin-bottom: 60px;
		&:hover {
			.item--holder {
				@include transform(scaleY(1));
				opacity: 1;
				-webkit-transition-delay: 0.12s;
                -moz-transition-delay: 0.12s;
                transition-delay: 0.12s;
				&:after {
					@include transform(translateX(-50%) scaleX(1));
					opacity: 1;
				}
			}
		}
	}
	.slick-slide {
		&.slick-center {
			.item--inner {
				// .item--holder {
				// 	@include transform(scaleY(1));
				// 	opacity: 1;
				// 	-webkit-transition-delay: 0.12s;
	   //              -moz-transition-delay: 0.12s;
	   //              transition-delay: 0.12s;
				// 	&:after {
				// 		@include transform(translateX(-50%) scaleX(1));
				// 		opacity: 1;
				// 	}
				// }
			}
		}
	}
}
