.ct-tabs .ct-grid {
	.grid-item {
		position: static !important;
	}
	.ct-grid-masonry {
		height: auto !important;
	}
}
.ct-tabs1 {
	.ct-tab-content {
        display: none;
    }
    .ct-tabs-title {
    	border-bottom: 3px solid #ebebeb;
    	display: flex;
		flex-wrap: wrap;
    	.ct-tab-title {
    		font-size: 17px;
			color: #1a1a1a;
			font-weight: 700;
			line-height: 47px;
			padding: 0 15px;
			margin-right: 12px;
			position: relative;
			cursor: pointer;
			@include transition(.3s cubic-bezier(.24,.74,.58,1));
			@media #{$max-lg} {
				margin-right: 0;
			}
			@media #{$max-sm} {
				font-size: 15px;
				padding: 0 10px;
			}
			&:before {
				content: '';
				width: 0;
				left: 0;
				right: 0;
				margin: auto;;
				bottom: -3px;
				height: 3px;
				position: absolute;
				background-color: $primary_color;
				@include transition(.3s cubic-bezier(.24,.74,.58,1));
			}
    		&:hover, &.active {
    			color: $primary_color;
    			&:before {
    				width: 100%;
    			}
    		}
    	}
    }
    .ct-tabs-content {
    	font-size: 17px;
		color: #888;
		line-height: 1.588;
		padding-top: 20px;
		padding-right: 5%;
		@media #{$max-lg} {
			padding-right: 0px;
		}
    }
}
.ct-tabs2 {
	.ct-widget-title {
		color: #333;
		font-size: 42px;
		line-height: 1.4;
		margin-bottom: 23px;
		@media #{$max-lg} {
			font-size: 36px;
		}
		@media #{$max-sm} {
			font-size: 30px;
		}
	}
	.ct-widget-desc {
		line-height: 1.5;
		color: #666666;
		margin-bottom: 20px;
	}
	.ct-tab-content {
        display: none;
    }
    .ct-tabs--main {
    	margin: 0 -25px;
    	display: flex;
		flex-wrap: wrap;
		@media #{$max-lg} {
			margin: 0 -15px;
		}
    	> div {
    		padding: 0 25px;
    		width: 50%;
    		@media #{$max-lg} {
				padding: 0 15px;
			}
			@media #{$max-sm} {
				width: 100%;
			}
    	}
    }
    .ct-tabs-title {
    	list-style: none;
    	margin-bottom: 0;
    	@media #{$max-sm} {
			margin-bottom: 24px;
		}
    	span {
    		font-size: 18px;
    		color: #333333;
    		@include font-family-heading($heading_default_font);
    		font-weight: 700;
    		display: inline-block;
    		padding-left: 60px;
    		position: relative;
    		cursor: pointer;
    		@include transition(.3s cubic-bezier(.24,.74,.58,1));
    		&:before {
    			content: '';
    			width: 50px;
    			height: 3px;
    			background-color: #333333;
    			@include transition(.3s cubic-bezier(.24,.74,.58,1));
    			position: absolute;
    			top: 50%;
    			@include transform(translate(0, -50%));
    			left: 0;
    		}
    		&.active {
    			color: $primary_color;
    			&:before {
    				background-color: $primary_color;
    			}
    		}
    	}
    	li + li {
    		margin-top: 9px;
    	}
    }
}
.ct-tabs3 {
    .ct-tabs-content {
        position: relative;
    }
	.ct-tab-content {
        position: absolute;
        top: 0;
        left: 15px;
        right: 15px;
        display: block!important;
        opacity: 0;
        height: auto !important;
        overflow: visible !important;
        &.active {
            opacity: 1;
            position: static;
        }
    }
    .ct-tabs--main {
    	@media #{ $min-lg } {
	    	display: flex;
			flex-wrap: wrap;
			margin: 0 -15px;
    	}
    	> div {
    		@media #{ $min-lg } {
    			padding: 0 15px;
	    		&.ct-tabs-meta {
	    			width: 33%;	
	    		}
	    		&.ct-tabs-content {
	    			width: 67%;
	    		}
    		}
			@media #{$max-sm} {
				width: 100%;
			}
    	}
    }
    .ct-tabs-title {
    	list-style: none;
    	margin-bottom: 0;
    	@media #{$max-sm} {
			margin-bottom: 24px;
		}
    	span {
    		font-size: 18px;
    		color: $third_color;
    		@include font-family-heading($heading_default_font);
    		font-weight: 600;
    		display: inline-block;
    		cursor: pointer;
    		@include transition(.3s cubic-bezier(.24,.74,.58,1));
    		padding: 7px 9px;
    		width: 100%;
    		background-color: #fff;
    		@include border-radius(7px);
    		@include box-shadow(0 8px 33px rgba(#0c0c0c, 0.06));
		    display: flex;
		    align-items: center;
    		i {
    			width: 40px;
    			height: 40px;
    			font-size: 25px;
    			@include border-radius(50%);
    			color: #f30736;
    			line-height: 40px;
    			text-align: center;
    			margin-right: 10px;
    			background-color: rgba( #ffbcd3, 0.3 );
    			display: inline-block;
    		}
    		&.active {
    			background-color: #f20030;
    			color: #fff;
    			@include box-shadow(0 8px 33px rgba(#f20030, 0.06));
    			i {
    				color: #fff;
    			}
    		}
    	}
    	li {
    		+ li {
				margin-top: 20px;
    		}
    	}
    }
}
.ct-tabs4 {
    .ct-tabs-content {
        position: relative;
    }
    .ct-tab-content {
        position: absolute;
        top: 0;
        left: 15px;
        right: 15px;
        display: block!important;
        opacity: 0;
        z-index: 0;
        height: auto!important;
        overflow: visible!important;
        &.active {
            z-index: 1;
            opacity: 1;
            position: static;
        }
    }
    .ct-tabs-title {
        display: flex;
        flex-wrap: wrap;
        .ct-tab-title {
            font-size: 24px;
            color: #1a1a1a;
            font-weight: 700;
            line-height: 27px;
            padding: 0px;
            margin-right: 40px;
            position: relative;
            cursor: pointer;
            text-transform: uppercase;
            cursor: pointer;
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            @media #{$max-lg} {
                margin-right: 15px;
            }
            @media #{$max-sm} {
                font-size: 15px;
                padding: 0 10px;
            }
            &:before {
                content: '';
                width: 0;
                left: 0;
                right: 0;
                margin: auto;;
                bottom: 0px;
                height: 3px;
                @include border-radius(3px);
                position: absolute;
                background-color: $primary_color;
                @include transition(.3s cubic-bezier(.24,.74,.58,1));
            }
            &:hover, &.active {
                &:before {
                    width: 100%;
                }
            }
        }
    }
    .ct-tabs-content {
        font-size: 17px;
        color: #888;
        line-height: 1.588;
        padding-top: 20px;
        padding-right: 5%;
        @media #{$max-lg} {
            padding-right: 0px;
        }
    }
}
.ct-tabs5 {
    .ct-tab-title {
        flex-grow: 1;
        text-align: center;
        position: relative;
        @include box-shadow(-5px 0 13px rgba(#0c0c0c, 0.06));
        cursor: pointer;
        @media #{ $min-xl } {
            padding: 45px 20px 25px;
            min-width: 20%;
            max-width: 20%;
        }
        @media #{ $max-lg } {
            padding: 40px 15px 20px;
        }
        .item-number {
            position: absolute;
            top: 30px;
            font-size: 18px;
            font-weight: bold;
            color: #000;
            right: 35px;
            @media #{ $max-lg } {
                top: 20px;
                right: 20px;
            }
        }
        .text-title {
            font-size: 18px;
            color: #000;
            font-weight: bold;
            @media #{ $max-sm } {
                font-size: 16px;
            }
        }
        i {
            font-size: 65px;
            display: block;
            line-height: 1;
            margin-bottom: 5px;
            color: #f18301;
            @media #{ $max-lg } {
                font-size: 45px;
            }
            @media #{ $max-xs } {
                font-size: 40px;
            }
        }
        &.active {
            background-color: #2fbdec;
            color: #fff;
            .item-number {
                color: #fff;
            }
            .text-title {
                color: #fff;
            }
            i {
                color: #fff;
            }
        }
        &:nth-child(2) {
            z-index: 2;
        }
        &:nth-child(3) {
            z-index: 3;
        }
        &:nth-child(4) {
            z-index: 4;
        }
        &:nth-child(5) {
            z-index: 5;
        }
    }
    .ct-tabs-title {
        display: flex;
        justify-content: center;
        @media #{ $max-lg } {
            flex-wrap: wrap;
        }
    }
    .ct-tab-content {
        display: none;
        &.active {
            display: block;
        }
    }
}
.ct-tabs6 {
    .ct-tab-title {
        text-align: center;
        position: relative;
        @include box-shadow(-5px 0 13px rgba(#0c0c0c, 0.06));
        cursor: pointer;
        background-color: #fff;
        margin-left: 10px;
        margin-right: 10px;
        @include border-radius(35px);
        @media #{ $min-xl } {
            padding: 20px 25px;
            display: flex;
            align-items: center;
        }
        @media #{ $max-lg } {
            padding: 10px 15px;
        }
        .text-title {
            font-size: 18px;
            color: #000;
            font-weight: 400;
            @media #{ $max-sm } {
                font-size: 16px;
            }
        }
        i {
            font-size: 18px;
            display: block;
            line-height: 1;
            margin-right: 10px;
            color: #f94f5a;
        }
        &.active {
            color: #fff;
            @include background-horizontal($gradient_color_from, $gradient_color_to);
            .text-title {
                color: #fff;
            }
            i {
                color: #fff;
            }
        }
        &:nth-child(2) {
            z-index: 2;
        }
        &:nth-child(3) {
            z-index: 3;
        }
        &:nth-child(4) {
            z-index: 4;
        }
        &:nth-child(5) {
            z-index: 5;
        }
    }
    .ct-tabs-title {
        display: flex;
        justify-content: center;
        @media #{ $max-lg } {
            flex-wrap: wrap;
        }
    }
    .ct-tab-content {
        display: none;
        &.active {
            display: block;
        }
    }
}