body {
    img.mfp-img {
        padding: 0 !important;
    }
    .mfp-fade.mfp-bg.mfp-ready {
        opacity: 0.9;
    }
    .mfp-iframe-scaler .mfp-close {
        line-height: 40px;
        padding: 0;
        right: 0;
        text-align: center;
        top: -44px;
        width: 40px;
        @include border-radius(2px 2px 0 0);
        background-color: #000;
        &:hover {
            background-color: $primary_color;
        }
    }
    .mfp-bottom-bar {
        margin-top: 0;
    }
    .mfp-wrap .mfp-container .mfp-arrow {
        background-color: $primary_color;
        width: 60px;
        height: 120px;
        opacity: 1;
        &:before, &:after {
            border: none;
        }
        &:before {
            font-family: "Material-Design-Iconic-Font";
            font-size: 20px;
            color: #fff;
            margin: 0;
            padding: 0;
            line-height: normal;
            position: absolute;
            top: 50%;
            display: block;
            @include transform(translate(-50%, -50%));
            opacity: 1;
            left: 50%;
            width: auto;
            height: auto;
        }
        &.mfp-arrow-left:before {
            content: "\f2ea";
        }
        &.mfp-arrow-right:before {
            content: "\f2ee";
        }
    }

    @media #{$min-xl} {
        .mfp-wrap .mfp-container {
            padding: 0 120px;
        }
    }
}

.ct-section-maxwidth-slider {
    z-index: 1;
    &:before {
        content: '';
        z-index: -1;
        position: absolute;
        top: 0;
        left: 0;
        height: 274px;
        right: 0;
        background-color: #000921;
    }
    > .elementor-container {
        max-width: 1510px;
    }
}

.ct-text-editor mark {
    padding: 0;
    background-color: transparent;
    color: $primary_color;
}

.ct-icon-slider i {
    margin-right: 8px;
}

.revslider-initialised {
    margin-bottom: 0 !important;
    .rs-layer {
        cite {
            font-style: normal;
            color: $third_color !important;
        }
        b.h6-title-slider {
            font-weight: inherit;
            color: $fifth_color;
        }
    }
    .letter-10 {
        letter-spacing: -0.01em !important;
    }
    .letter-25 {
        letter-spacing: -0.025em !important;
    }
    .letter-20 {
        letter-spacing: -0.02em !important;
    }
    .ct-slider-line {
        display: inline-block;
        padding-left: 78px;
        position: relative;
        &:before {
            content: '';
            width: 64px;
            height: 3px;
            background-color: $primary_color;
            position: absolute;
            top: 50%;
            left: 0;
            @include transform(translate(0, -50%));
        }
    }
    .btn {
        @media #{$min-lg} {
            &.btn-plus {
                line-height: 60px;
                &.icon-right {
                    padding-left: 24px;
                    padding-right: 68px;
                    .icon-abs {
                        width: 40px;
                        height: 40px;
                        font-size: 24px;
                    }
                }
            }
        }
        &.btn-icon-slider1 {
            line-height: 54px;
            @include border-radius(54px);
            padding-left: 28px;
            padding-right: 54px;
            font-size: 16px;
            @include font-family-heading($heading_default_font);
            i {
                width: 34px;
                height: 34px;
                background-color: #fff;
                line-height: 34px;
                border-radius: 34px;
                position: absolute;
                top: 10px;
                right: 10px;
                color: #000;
                font-size: 15px;
            }
        }
    }
    @media #{$max-sm} {
        .btn.btn-slider {
            padding-right: 56px;
            padding-left: 20px;
        }
    }
    .rev-btn {
        .space-left {
            margin-left: 8px;
        }
    }
    .btn-slider-shadow {
        @include box-shadow(0 9px 21px rgba(#000000, 0.22));
    }
    .shap-slider-bottom {
        transform:skew(-29deg) !important;
        -webkit-transform:skew(-29deg) !important;
        transform-origin: left bottom !important;
        -webkit-transform-origin: left bottom !important;
    }
    .title-box-shadow {
        text-shadow: 0px 3px 4px rgba(#000000, 0.29);
        -webkit-text-shadow: 0px 3px 4px rgba(#000000, 0.29);
        -ms-text-shadow: 0px 3px 4px rgba(#000000, 0.29);
        -o-text-shadow: 0px 3px 4px rgba(#000000, 0.29);
    }
    .arrow-hidden {
        opacity: 0 !important;
        visibility: hidden !important;
    }
    .tp-leftarrow.custom, .tp-rightarrow.custom {
        width: 54px !important;
        height: 54px !important;
        @include border-radius(0px !important);
        background-color: #fff !important;
        @include transition(all 300ms linear 0ms);
        opacity: 1 !important;
        &:before {
            font-size: 19px !important;
            color: $dark_color  !important;
            font-family: "Flaticon" !important;
            position: absolute !important;
            top: 50%  !important;
            left: 50% !important;
            @include transform(translate(-50%, -50%) !important);
            font-weight: 400 !important;
        }
        &:hover {
            background-color: $dark_color !important;
            &:before  {
                color: #fff !important;
            }
        }
        @media #{$max-xl} {
            width: 44px !important;
            height: 44px !important;
            &:before {
                font-size: 16px !important;
            }
        }
        @media #{$max-sm} {
            display: none !important;
        }
    }
    .tp-leftarrow.custom:before {
        content: '\f118' !important;
        @include transform(translate(-50%, -50%) scaleX(-1) !important);
    }
    .tp-rightarrow.custom:before {
        content: '\f118' !important;
    }
    .bixol-bullet-number {
        .tp-bullet {
            width: 34px;
            height: 34px;
            font-size: 16px;
            font-weight: 700;
            color: $dark_color;
            line-height: 34px;
            text-align: center;
            @include border-radius(34px);
            @include font-family-heading($heading_default_font);
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            background-color: rgba(#fff, 0.45) !important;
            @media #{$max-xl} {
                width: 30px;
                height: 30px;
                line-height: 30px;
                font-size: 14px;
            }
            &.selected {
                color: #fff;
                background-color: $secondary_color !important;
            }
            &:nth-child(1):before {
                content: '01';
            }
            &:nth-child(2):before {
                content: '02';
            }
            &:nth-child(3):before {
                content: '03';
            }
            &:nth-child(4):before {
                content: '04';
            }
            &:nth-child(5):before {
                content: '05';
            }
            &:nth-child(6):before {
                content: '06';
            }
            &:nth-child(7):before {
                content: '07';
            }
            &:nth-child(8):before {
                content: '08';
            }
            &:nth-child(9):before {
                content: '09';
            }
            &:nth-child(10):before {
                content: '10';
            }
        }
        @media #{$max-xl} {
            &.nav-pos-hor-leftnav-pos-ver-centernav-dir-vertical {
                left: -15px !important;
            }
        }
    }

    .bixol-bullet-round-one {
        .tp-bullet {
            width: 18px;
            height: 18px;
            background-color: $primary_color !important;
            @include border-radius(18px);
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            &:before {
                content: '';
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                @include border-radius(18px);
                @include box-shadow(0 0 0 6px #fff);
                @include transition(.3s cubic-bezier(.24,.74,.58,1));
            }
            &.selected:before {
                @include box-shadow(0 0 0 6px #fff);
            }
            &:not(.selected) {
                @include transform(scale(0.8));
                &:before {
                    opacity: 0;
                }
            }
        }
    }

    .bixol-bullet-round-two {
        .tp-bullet {
            width: 9px;
            height: 9px;
            background-color: #000 !important;
            @include border-radius(9px);
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            &:before {
                content: '';
                position: absolute;
                top: -5px;
                left: -5px;
                width: 19px;
                height: 19px;
                border: 3px solid #000;
                @include border-radius(19px);
                @include transition(.3s cubic-bezier(.24,.74,.58,1));
                opacity: 0;
                @include transform(translate(1.2));
            }
            &.selected {
                background-color: $fifth_color !important;
                &:before {
                    opacity: 1;
                    @include transform(translate(1));
                }
            }
        }
    }

    .bixol-bullet-round-three {
        .tp-bullet {
            width: 29px;
            height: 3px;
            background-color: #bdbfc9 !important;
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            &.selected {
                background-color: $secondary_color !important;
            }
        }
    }

    @media #{$max-lg2} {
        .bixol-bullet-number, .bixol-bullet-round-one, .bixol-bullet-round-two {
            display: none;
        }
    }

    .ct-video-shortcode .ct-video-item {
        border: none;
    }
    .ct-video-button {
        width: 80px;
        height: 80px;
        background-color: rgba(#fff, 0.18);
        font-size: 18px;
        @media #{$max-md} {
            width: 60px;
            height: 60px;
            font-size: 16px;
        }
        &.video-primary {
            height: 57px;
            width: 57px;
            background-color: $primary_color;
            @include border-radius(57px);
            text-align: center;
            line-height: 57px;
            display: inline-block;
            color: #fff;
            font-size: 16px;
        }
        &.border-effect {
            &:before {
                content: "";
                position: absolute;
                z-index: 0;
                left: 0;
                top: 0;
                display: block;
                width: 100%;
                height: 100%;
                background-color: rgba(#fff, 0.63);
                border-radius: 50%;
                animation: pulse-border2 1500ms ease-out infinite;
                -webkit-animation: pulse-border2 1500ms ease-out infinite;
                z-index: -2;
            }
            &:after {
                display: block;
                content: '';
                background-color: inherit;
                background-image: inherit;
                @include border-radius(inherit);
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                z-index: -1;
            }
            &:hover, &:focus {
                &:before {
                    -webkit-animation-play-state: paused;
                    -moz-animation-play-state: paused;
                    -o-animation-play-state: paused;
                    animation-play-state: paused;
                }
            }
        }
        &.style2 {
            border: 3px solid #fff;
            @include box-shadow(0 3px 7px rgba(#000000, 0.35));
            background-position: center;
            background-repeat: no-repeat;
            background-size: cover;
            position: static;
            transform: translate(0%, 0%);
            &:before {
                display: none;
            }
            &:after {
                content: '';
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                background-color: rgba(#000724, 0.67);
                background-image: none;
            }
            i {
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
            }
        }
    }
    .ct-video-item.ct-style2 {
        width: 56px;
        height: 56px;
        z-index: 1;
        &:before {
            content: '';
            height: 72px;
            width: 36px;
            @include border-radius(72px 0 0 72px);
            position: absolute;
            top: -8px;
            left: -8px;
            background-color: $primary_color;
            z-index: -1;
        }
    }
    .nav-number {
        @include transform(rotate(-450deg));
        display: inline-block;
        position: relative;
        &:before {
            content: '';
            width: 132px;
            height: 1px;
            background-color: #e2e2e2;
            position: absolute;
            top: 50%;
            @include transform(translate(0, -50%));
            right: 100%;
            margin-right: 20px;
        }
        span {
            color: $secondary_color;
        }
    }

    .tparrows.custom-bixol1 {
        width: 80px;
        height: 80px;
        text-align: center;
        background-color: $secondary_color;
        border-radius: 100%;
        @include transition(all .25s cubic-bezier(.3,.3,0,.8));
        &:before {
            content: '\f108';
            font-family: "Flaticon-V3";
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            font-size: 28px;
        }
        @media #{$max-xxl} {
            width: 60px;
            height: 60px;
            &:before {
                font-size: 22px;
            }
        }
        &.tp-leftarrow:before {
            transform: translate(-50%, -50%) scaleX(-1);
        }
        &:hover {
            background-color: $primary_color;
        }
    }
}

.ct-latest-news1 {
    .item--title {
        margin-top: -6px;
        margin-bottom: 8px;
        font-size: 16px;
        line-height: 24px;
        color: #ffffff;
        a {
            color: inherit;
        }
    }
    .item--featured {
        width: 80px;
        margin-right: 16px;
        min-width: 80px;
        position: relative;
        overflow: hidden;
        @include border-radius(3px);
        a {
            display: block;
            position: relative;
            overflow: hidden;
            @include border-radius(3px);
        }
        img {
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
        }
    }
    .item--meta {
        list-style: none;
        display: flex;
        flex-wrap: wrap;
        font-size: 10px;
        color: #fff;
        margin: 0;
        font-family: 'Roboto', sans-serif;
        li {
            margin-right: 8px;
            i {
                margin-right: 4px;
            }
            &:last-child {
                margin-right: 0;
            }
        }
    }
    .grid--item {
        display: flex;
        flex-wrap: nowrap;
        &:hover {
            .item--featured img {
                @include transform(scale(1.14));
            }
        }
        + .grid--item {
            margin-top: 19px;
        }
    }
    &.style2 {
        .item--featured {
            width: 100px;
            min-width: 100px;
            @include border-radius(4px);
            margin-right: 22px;
            @media #{$max-sm} {
                width: 80px;
                min-width: 80px;
                margin-right: 15px;
            }
        }
        .item--title {
            font-size: 18px;
            color: #001c8f;
            line-height: 24px;
            @media #{$max-sm} {
                margin-top: -4px;
                font-size: 16px;
            }
            &:hover {
                color: $primary_color;
            }
        }
        .item--meta {
            font-size: 14px;
            color: #5a6079;
            @media #{$max-sm} {
                font-size: 12px;
            }
            li {
                margin-right: 20px;
                @media #{$max-sm} {
                    margin-right: 10px;
                }
                &:last-child {
                    margin-right: 0;
                }
            }
        }
        .grid--item + .grid--item {
            margin-top: 23px;
        }
    }
}

.ct-testimonial-carousel5 {
    .item--image {
        width: 108px;
        height: 108px;
        border: 5px solid #fff;
        border-radius: 108px;
        overflow: hidden;
        margin: -80px auto 24px auto;
        @include box-shadow(0 13px 35px rgba(#0547f1, 0.2));
    }
    .item--description {
        font-size: 16px;
        line-height: 24px;
        color: #666666;
        margin-bottom: 22px;
    }
    .item--title {
        font-size: 18px;
        margin-bottom: 7px;
    }
    .item--position {
        font-size: 15px;
        color: #666666;
    }
    .item--inner {
        margin: 60px 20px 20px 20px;
        background-color: #fff;
        @include border-radius(5px);
        @include box-shadow(0 10px 30px rgba(#001c8f, 0.05));
        text-align: center;
        padding: 30px 30px 24px;
        position: relative;
        @media #{$max-sm} {
            padding-left: 15px;
            padding-right: 15px;
        }
        &:before {
            content: '';
            position: absolute;
            right: 0;
            left: -20px;
            width: calc(100% + 40px);
            bottom: -20px;
            background-color: rgba(255, 255, 255, 0.9);
            z-index: -1;
            height: calc(100% + 20px);
            border-radius: 5px;
        }
    }
}

.ct-blog-carousel-layout4 {
    .item--featured {
        position: relative;
        .item--overlay {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 80%;
            @include background-gradient-bottom(rgba(#001c8f, 0.85), rgba(#001c8f, 0));
            z-index: 9;
        }
        img {
            width: 100%;
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
        }
    }
    .item--body {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        padding: 30px 24px 26px;
        z-index: 10;
        @media #{$max-lg} {
            padding-left: 15px;
            padding-right: 15px;
            padding-bottom: 20px;
        }
    }
    .item--title {
        font-size: 20px;
        line-height: 24px;
        color: #ffffff;
        @media #{$max-lg} {
            font-size: 18px;
        }
        a {
            color: inherit;
            &:hover {
                color: inherit;
            }
        }
    }
    .item--meta {
        margin: 0;
        display: flex;
        list-style: none;
        flex-wrap: wrap;
        font-size: 14px;
        line-height: 24px;
        color: #fff;
        font-family: 'Roboto', sans-serif;
        i {
            margin-right: 8px;
        }
        li {
            margin-right: 30px;
            &:last-child {
                margin-right: 0;
            }
        }
    }
    .grid-item-inner {
        position: relative;
        overflow: hidden;
        @include border-radius(5px);
        &:hover {
            .item--featured img {
                @include transform(scale(1.18) rotate(6deg));
            }
        }
    }
}

.ct-image-single {
    img {
        width: auto;
    }
    .ct-image-bg {
        min-height: 300px;
        display: inline-block;
        width: 100%;
    }
}

.ct-col-line1 {
    &:before {
        content: '';
        width: 0;
        height: 70px;
        border-right: 2px dashed #c3ceee;
        position: absolute;
        top: 50%;
        right: 0;
        @include transform(translate(0, -50%));
        @media #{$max-lg} {
            display: none;
        }
    }
}

.ct-step-1, .ct-step-2 {
    > .elementor-column-wrap:before {
        content: '';
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        position: absolute;
        @media #{$max-sm} {
            display: none;
        }
    }
}
.ct-step-1 > .elementor-column-wrap:before {
    top: 66px;
    width: 70px;
    height: 10px;
    right: -35px;
    background-image: url(../images/step-img1.png);
}
.ct-step-2 > .elementor-column-wrap:before {
    top: 63px;
    width: 46px;
    height: 16px;
    right: -23px;
    background-image: url(../images/step-img2.png);
}

.ct-pricing-single1 {
    padding: 32px 40px;
    position: relative;
    z-index: 1;
    text-align: center;
    @media #{$max-lg} {
        padding-left: 30px;
        padding-right: 30px;
    }
    @media #{$max-md} {
        padding-left: 20px;
        padding-right: 20px;
    }
    &:before {
        content: '';
        background-color: #fff;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        @include border-radius(8px);
        @include box-shadow(0 13px 35px rgba(#2e69ff, 0.1));
        z-index: -1;
    }
    .pricing--icon {
        height: 102px;
        width: 102px;
        line-height: 102px;
        margin: 0 auto 38px auto;
        font-size: 60px;
        color: #fff;
        background-color: $primary_color;
        border-radius: 100px;
    }
    .pricing--title {
        margin-bottom: 25px;
        font-size: 24px;
        color: #001c8f;
        font-weight: 700;
    }
    .pricing--feature {
        list-style: none;
        margin: 0 20px 38px 20px;
        font-size: 16px;
        font-weight: 500;
        color: #001c8f;
        @media #{$max-lg} {
            margin-left: 0;
            margin-right: 0;
        }
        li {
            border-top: 1px solid #ccd2e9;
            padding: 6px 0;
            &:last-child {
                border-bottom: 1px solid #ccd2e9;
            }
            &.active {
                text-decoration: line-through;
            }
        }
    }
    .pricing--price {
        line-height: 1;
        font-size: 48px;
        font-weight: 700;
        @include font-family-heading($heading_default_font);
        color: #001c8f;
        margin-bottom: 42px;
        @media #{$max-lg} {
            font-size: 32px;
        }
        span {
            font-size: 16px;
            font-weight: 500;
        }
    }
    .pricing--button .btn {
        background-color: transparent;
        border: 1px solid #001c8f;
        color: #001c8f;
        line-height: 50px;
        padding: 0 34px;
        border-radius: 5px;
        &:hover, &:focus {
            border-color: $primary_color;
            background-color: $primary_color;
            color: #fff;
        }
    }
    &.item--highlight {
        z-index: 99;
        &:before {
            background-color: $primary_color;
            height: calc(100% + 34px);
            top: -17px;
            @media #{$max-sm} {
                height: 100%;
                top: 0;
            }
        }
        .pricing--icon {
            background-color: #fff;
            color: #001c8f;
        }
        .pricing--title, .pricing--price {
            color: #fff;
        }
        .pricing--feature {
            color: #fff;
            li {
                border-color: rgba(#fff, 0.2);
            }
        }
        .pricing--button .btn {
            border-color: $secondary_color;
            background-color: $secondary_color;
            color: #fff;
            &:hover, &:focus {
                border-color: #fff;
                background-color: #fff;
                color: #001c8f;
            }
        }
    }
}

.ct-team-grid2 {
    text-align: center;
    .item--image {
        position: relative;
        margin: 0 auto 19px auto;
        display: inline-block;
        @include border-radius(255px);
        overflow: hidden;
        @include box-shadow(0 1px 30px rgba(#001c8f, 0.1));
        border: 5px solid #fff;
        &:before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            @include border-radius(255px);
            background-color: rgba(#000000, 0.5);
            z-index: 1;
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            opacity: 0;
        }
        &:after {
            z-index: 2;
            content: '';
            width: 260px;
            height: 176px;
            background-image: url(../images/bg-item-team.png);
            position: absolute;
            bottom: -25px;
            right: -68px;
            transform: rotate(19deg);
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            opacity: 0;
        }
        img {
            @include border-radius(255px);
        }
    }
    .item--title {
        font-size: 24px;
        color: #001c8f;
        margin-bottom: 5px;
    }
    .item--position {
        color: #628dfb;
    }
    .item--social {
        position: absolute;
        bottom: 42px;
        left: 0;
        width: 100%;
        z-index: 3;
        padding-left: 50px;
        opacity: 0;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        @include transform(translateY(40px));
        a {
            color: #001c8f;
            width: 30px;
            height: 30px;
            line-height: 30px;
            @include border-radius(30px);
            background-color: #fff;
            display: inline-block;
            font-size: 14px;
            margin-left: 6px;
            &:hover {
                @include transform(translateY(-4px));
            }
        }
    }
    .item--inner {
        margin-bottom: 50px;
        &:hover {
            .item--image {
                &:before, &:after {
                    opacity: 1;
                }
            }
            .item--social {
                @include transform(translateY(0px));
                opacity: 1;
            }
        }
    }
}

// Start Heading
//--------------------------------------------------
.ct-heading {
    .ct-heading--inner {
        display: inline-block;
        position: relative;
    }
    .item--sub-title {
        font-size: 18px;
        font-weight: 500;
        margin-bottom: 9px;
        &.st-line-right {
            .item--sub-title-inner {
                display: inline-block;
                padding-right: 41px;
                position: relative;
                &:before {
                    content: '';
                    width: 30px;
                    height: 2px;
                    background-color: $primary_color;
                    position: absolute;
                    top: 50%;
                    right: 0;
                    @include transform(translate(0, -50%));
                }
            }
        }
        &.st-line-right2 {
            .item--sub-title-inner {
                display: inline-block;
                padding-right: 102px;
                position: relative;
                &:before {
                    content: '';
                    width: 80px;
                    height: 3px;
                    background-color: $primary_color;
                    position: absolute;
                    top: 50%;
                    right: 0;
                    @include transform(translate(0, -50%));
                }
            }
        }
        &.st-line-center {
            .item--sub-title-inner {
                display: inline-block;
                padding-left: 41px;
                padding-right: 41px;
                position: relative;
                &:before, &:after {
                    content: '';
                    width: 30px;
                    height: 2px;
                    background-color: $primary_color;
                    position: absolute;
                    top: 50%;
                    @include transform(translate(0, -50%));
                }
                &:before {
                    left: 0;
                }
                &:after {
                    right: 0;
                }
            }
        }
        &.st-line-center2 {
            .item--sub-title-inner {
                display: inline-block;
                padding-left: 71px;
                padding-right: 71px;
                position: relative;
                &:before, &:after {
                    content: '';
                    width: 53px;
                    height: 3px;
                    background-color: $primary_color;
                    position: absolute;
                    top: 50%;
                    @include transform(translate(0, -50%));
                }
                &:before {
                    left: 0;
                }
                &:after {
                    right: 0;
                }
            }
        }
        &.st-primary-color {
            color: $primary_color;
            font-size: 18px;
            font-weight: 500;
        }
    }
    .item--sub-title-inner {
        display: inline-flex;
        flex-wrap: nowrap;
        align-items: center;
        i {
            @extend .text-gradient;
            @include background-gradient-bottom($secondary_color, $primary_color);
        }
        i, img {
            margin-right: 6px;
        }
    }
    .item--title {
        cite {
            font-style: normal;
            color: $primary_color;
        }
        small {
            font-size: inherit;
        }
        &.st-line-right {
            span {
                position: relative;
                display: inline-block;
                padding-right: 100px;
                @media #{$max-md} {
                    padding-right: 60px;
                }
                &:before {
                    content: '';
                    width: 82px;
                    height: 3px;
                    background-color: $primary_color;
                    position: absolute;
                    top: 50%;
                    right: 0;
                    @include transform(translate(0, -50%));
                    @media #{$max-md} {
                        width: 44px;
                        height: 2px;
                    }
                }
            }
        }
    }
    h3.item--title {
        font-size: 36px;
        line-height: 1.3;
    }
    .icon-sub-title {
        width: 34px;
        height: 27px;
        position: relative;
        margin-right: 10px;
        svg:nth-child(1) {
            height: 11px;
            top: 0;
            right: 8px;
        }
        svg:nth-child(2) {
            height: 17px;
            bottom: 5px;
            left: 0;
        }
        svg:nth-child(3) {
            height: 17px;
            bottom: 0;
            right: 0;
        }
        svg {
            position: absolute;
        }
    }
    .ct-text-highlight {
        position: relative;
        &:before {
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            width: 180%;
            height: 180%;
            z-index: -1;
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
            @include transform(translate(-50%, -50%));
        }
    }
}
.cite-color .ct-heading .item--title cite {
    color: $fifth_color;
}
// End Heading
//--------------------------------------------------


// Start Editor
//--------------------------------------------------
.ct-text-editor {
    .first-letter {
        font-weight: 600;
        display: inline-block;
        float: left;
        margin: 5px 20px 0 0;
        width: 45px;
        height: 45px;
        text-align: center;
        color: #282828;
        font-size: 40px;
        line-height: 45px;
    }
    .first-letter.style2 {
        font-size: 25px;
        @include border-radius(100%);
        background-color: $secondary_color;
        color: #fff;
    }
    .first-letter.style3 {
        background-color: $primary_color;
        color: #fff;
        font-size: 25px;
    }
}
// End Editor
//--------------------------------------------------

// Start Mailchimp
//--------------------------------------------------
.ct-mailchimp1 {
    &.style1 {
        .mc4wp-form {
            .mc4wp-response {
                font-size: 14px;
                line-height: 24px;
                margin-top: 15px;
                color: #999;
                p {
                    margin-bottom: 0;
                }
            }
            .mc4wp-form-fields {
                position: relative;
                overflow: hidden;
                input[type="email"], input[type="text"] {
                    border: none;
                    background-color: #1e294a;
                    @include border-radius(0px);
                    height: 46px;
                    font-size: 14px;
                    font-weight: 400;
                    color: #fff;
                    padding-left: 20px;
                    padding-right: 70px;
                }
                .fac-envelope {
                    position: absolute;
                    top: 50%;
                    left: 20px;
                    @include transform(translate(0, -50%));
                    color: #646464;
                }
                input[type="submit"] {
                    @include border-radius(0px);
                    position: absolute;
                    bottom: 0;
                    right: 0;
                    height: 46px;
                    width: 62px;
                    padding: 0;
                    opacity: 0;
                    z-index: 3;
                }
                &:before, &:after {
                    font-weight: 400;
                    font-family: "Font Awesome 5 Pro";
                    height: 46px;
                    width: 62px;
                    font-size: 15px;
                    position: absolute;
                    bottom: 0;
                    right: 0;
                    color: #fff;
                    text-align: center;
                    line-height: 46px;
                    z-index: 1;
                    overflow: hidden;
                    @media #{$max-md} {
                        width: 46px;
                    }
                }
                &:before {
                    content: '';
                    background-color: $primary_color;
                }
                &:after {
                    z-index: 2;
                    content: '\f1d8';
                }
                &:hover:after {
                    -o-animation: toTopFromBottom 0.3s forwards;
                    -ms-animation: toTopFromBottom 0.3s forwards;
                    -webkit-animation: toTopFromBottom 0.3s forwards;
                    animation: toTopFromBottom 0.3s forwards;
                }
            }
        }
    }
    &.style2 {
        .mc4wp-form {
            max-width: 770px;
            margin: 0 auto;
            position: relative;
        }
        .field-group {
            display: flex;
            flex-wrap: wrap;
            .field-input {
                width: 100%;
            }
        }
        [type="email"] {
            background-color: #eef2f7;
            height: 60px;
            padding: 0 40px;
            @include border-radius(60px);
            font-size: 20px;
            color: #082680;
            border: none;
        }
        [type="submit"] {
            position: absolute;
            top: 0;
            right: 0;
            line-height: 60px;
            @include border-radius(0 60px 60px 0);
            padding: 0 42px;
            font-weight: 500;
            font-size: 16px;
            background-color: $primary_color;
            @media #{$max-sm} {
                position: static;
                width: 100%;
                margin-top: 10px;
                @include border-radius(60px);
            }
            &:hover, &:focus {
                background-color: $secondary_color;
            }
        }
        .mc4wp-error {
            margin-top: 10px;
            font-size: 15px;
            text-align: center;
        }
    }
    &.style3 {
        .mc4wp-form {
            max-width: 770px;
            margin: 0 auto;
            position: relative;
        }
        .field-group {
            display: flex;
            flex-wrap: wrap;
            .field-input {
                width: 100%;
            }
        }
        [type="email"] {
            background-color: #171739;
            height: 50px;
            padding: 0 15px;
            @include border-radius(5px);
            font-size: 16px;
            color: #a3a3a3;
            font-weight: 500;
            border: none;
        }
        [type="submit"] {
            position: absolute;
            top: 0;
            right: 0;
            line-height: 50px;
            @include border-radius(0 5px 5px 0);
            padding: 0 20px;
            font-size: 18px;
            @include background-gradient-button(90deg, $primary_color 0%, $secondary_color 50%, $primary_color);
            background-size: 300%, 1px;
            background-position: 0%;
            @media #{$max-sm} {
                position: static;
                width: 100%;
                margin-top: 10px;
                @include border-radius(5px);
            }
            &:hover, &:focus {
                background-position: 100%;
            }
        }
        .mc4wp-error {
            margin-top: 10px;
            font-size: 15px;
            text-align: center;
        }
    }
    &.style4 {
        .mc4wp-form {
            .mc4wp-response {
                font-size: 14px;
                line-height: 24px;
                margin-top: 15px;
                color: #999;
                p {
                    margin-bottom: 0;
                }
            }
            .mc4wp-form-fields {
                position: relative;
                overflow: hidden;
                input[type="email"], input[type="text"] {
                    border: none;
                    background-color: #fff;
                    @include border-radius(47px);
                    height: 46px;
                    font-size: 14px;
                    font-weight: 400;
                    color: rgba(#4D5864, 0.7);
                    padding-left: 20px;
                    padding-right: 70px;
                    box-shadow: 0 4px 20px rgba(#000000, 0.05);
                }
                .fac-envelope {
                    position: absolute;
                    top: 50%;
                    left: 20px;
                    @include transform(translate(0, -50%));
                    color: #646464;
                }
                input[type="submit"] {
                    @include border-radius(0 46px 46px 0);
                    position: absolute;
                    bottom: 0;
                    right: 0;
                    height: 46px;
                    width: 46px;
                    padding: 0;
                    opacity: 0;
                    z-index: 3;
                }
                &:before, &:after {
                    font-weight: 400;
                    font-family: "Font Awesome 5 Pro";
                    height: 46px;
                    width: 46px;
                    font-size: 15px;
                    position: absolute;
                    bottom: 0;
                    right: 0;
                    color: #fff;
                    text-align: center;
                    line-height: 46px;
                    z-index: 1;
                    overflow: hidden;
                    @media #{$max-md} {
                        width: 46px;
                    }
                }
                &:before {
                    content: '';
                    background-color: $primary_color;
                    @include border-radius(0 46px 46px 0);
                }
                &:after {
                    z-index: 2;
                    content: '\f1d8';
                }
                &:hover:after {
                    -o-animation: toTopFromBottom 0.3s forwards;
                    -ms-animation: toTopFromBottom 0.3s forwards;
                    -webkit-animation: toTopFromBottom 0.3s forwards;
                    animation: toTopFromBottom 0.3s forwards;
                }
            }
        }
    }
    &.style5 {
        .mc4wp-form {
            .mc4wp-response {
                font-size: 14px;
                line-height: 24px;
                margin-top: 15px;
                color: #fff;
                p {
                    margin-bottom: 0;
                }
            }
            .mc4wp-form-fields {
                position: relative;
                input[type="email"], input[type="text"] {
                    height: 60px;
                    border-radius: 60px;
                    font-size: 16px;
                    color: #4D5864;
                    border: none;
                    margin-right: 10px;
                }
                input[type="submit"] {
                    line-height: 60px;
                    padding: 0 34px;
                    font-size: 16px;
                    text-transform: uppercase;
                    font-weight: 600;
                    border-radius: 60px;
                    &:hover, &:focus {
                        background-color: $secondary_color;
                    }
                }
                .field-group {
                    display: flex;
                    flex-wrap: wrap;
                    margin: 0 -10px;
                    .field-input {
                        padding: 5px 10px;
                        &.field-first {
                            flex-grow: 1;
                        }
                    }
                }
            }
        }
    }
}
// End Mailchimp
//--------------------------------------------------


// Start Icons
//--------------------------------------------------
.ct-icon1 {
    &.style1 {
        margin-left: -10px;
        a {
            font-size: 16px;
            color: $primary_color;
            display: inline-block;
            width: 30px;
            height: 30px;
            line-height: 30px;
            text-align: center;
            margin-right: 4px;
            &:hover {
                color: inherit;
                @include transform(translate(0, -4px));
            }
        }
    }
    &.style2 {
        margin: 0 -12px;
        @media #{$max-sm} {
            margin: 0 -6px;
        }
        a i {
            width: 56px;
            height: 56px;
            font-size: 20px;
            line-height: 56px;
            @include border-radius(56px);
            text-align: center;
            color: #fff;
            background-color: $primary_color;
            margin: 0 12px;
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            &:hover {
                opacity: 0.8;
            }
            @media #{$max-sm} {
                margin: 0 6px;
            }
            &.fa-facebook-f {
                background-color: #5067ae;
            }
            &.fa-twitter {
                background-color: #6da9de;
            }
            &.fa-instagram {
                background-color: #c31a34;
            }
            &.fa-linkedin-in {
                background-color: #526ae0;
            }
        }
    }
    &.style3 {
        a {
            color: #fff;
            height: 35px;
            width: 35px;
            line-height: 35px;
            @include border-radius(35px);
            background-color: rgba(#fff, 0.15);
            text-align: center;
            margin-right: 11px;
            display: inline-block;
            font-size: 15px;
            i {
                color: inherit !important;
            }
            &:hover, &:focus {
                background-color: $fifth_color;
            }
        }
    }
    &.style4 {
        margin: 0 -4px;
        a {
            display: inline-flex;
            width: 30px;
            height: 30px;
            align-items: center;
            justify-content: center;
            color: rgba(#16285C, 0.5);
            border: 1px solid rgba(#16285C, 0.5);
            border-radius: 30px;
            margin: 0 4px;
            font-size: 14px;
            &:hover {
                color: #fff;
                border-color: $primary_color;
                background-color: $primary_color;
            }
        }
    }
    &.style5 {
        margin: 0 -2px;
        a {
            display: inline-flex;
            width: 22px;
            height: 22px;
            align-items: center;
            justify-content: center;
            color: rgba(#fff, 0.8);
            border: 1px solid rgba(#fff, 0.8);
            border-radius: 22px;
            margin: 0 2px;
            font-size: 10px;
            &:hover {
                color: $primary_color;
                border-color: #fff;
                background-color: #fff;
            }
        }
    }
    &.style6 {
        margin: 0 -6px;
        a {
            display: inline-flex;
            width: 30px;
            height: 30px;
            align-items: center;
            justify-content: center;
            color: #FBF9FA;
            border: 1px solid #FBF9FA;
            border-radius: 30px;
            margin: 0 6px;
            font-size: 13px;
            &:hover {
                color: #fff;
                border-color: $primary_color;
                background-color: $primary_color;
            }
        }
    }
}
// End Icons
//--------------------------------------------------


// Start Contact Info
//--------------------------------------------------
.ct-contact-info1 {
    list-style: none;
    margin-bottom: 0;
    font-size: 14px;
    line-height: 24px;
    color: #333;
    i {
        color: $primary_color;
    }
    li {
        display: flex;
        flex-wrap: nowrap;
        + li {
            margin-top: 14px;
        }
        a {
            color: inherit;
            &:hover {
                color: inherit;
            }
        }
    }
    .ct-contact-icon {
        display: inline-block;
        margin-right: 10px;
    }
}
// End Contact Info
//--------------------------------------------------

// Start Fancy Box
//--------------------------------------------------
.ct-fancy-box-layout1 {
    &.style1 {
        border: 1px solid #e9eaf6;
        padding: 30px 20px 30px 36px;
        display: flex;
        flex-wrap: nowrap;
        position: relative;
        @include transition(all 240ms linear 0ms);
        background-color: #fff;
        @media #{$max-lg} {
            padding-left: 15px;
            padding-right: 15px;
            .item--description {
                font-size: 14px;
            }
        }
        @media #{$max-md} {
            display: block;
        }
        .item--description {
            word-break: break-word;
        }
        .item--icon {
            line-height: 1;
            margin-right: 16px;
            @include transition(all 240ms linear 0ms);
            @media #{$max-md} {
                margin-bottom: 16px;
            }
            i {
                font-size: 48px;
                color: $primary_color;
                &.flaticon-pin {
                    margin-left: -6px;
                    margin-right: -6px;
                }
            }
            svg {
                height: 48px;
                width: 48px;
                fill: $primary_color;
            }
        }
        .item--title {
            margin-bottom: 6px;
            @media #{$max-md} {
                font-size: 18px;
            }
        }
        .item--link {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 99;
        }
        &:hover {
            @include box-shadow(0 13px 29px rgba(#02154e, 0.17));
            .item--icon {
                animation: icon-bounce 800ms ease-out infinite;
                -webkit-animation: icon-bounce 800ms ease-out infinite;
            }
        }
    }
    &.style2 {
        display: flex;
        flex-wrap: nowrap;
        .item--icon {
            height: 63px;
            min-width: 63px;
            width: 63px;
            background-color: $four_color;
            position: relative;
            @include border-radius(63px);
            margin-right: 36px;
            @media #{$max-lg} {
                margin-right: 30px;
            }
            @media #{$max-md} {
                margin-right: 20px;
            }
            * {
                position: absolute;
                top: 50%;
                left: 50%;
                @include transform(translate(-50%, -50%));
            }
            i {
                font-size: 24px;
                color: #fff;
            }
        }
        .item--title {
            margin-top: 3px;
            font-size: 24px;
            font-weight: 600;
            margin-bottom: 8px;
            @media #{$max-md} {
                font-size: 20px;
            }
        }
        &:hover {
            .item--icon {
                animation: icon-bounce 800ms ease-out infinite;
                -webkit-animation: icon-bounce 800ms ease-out infinite;
            }
        }
    }
    &.style3 {
        display: flex;
        flex-wrap: nowrap;
        @media #{$max-md} {
            display: block;
        }
        .item--title {
            margin-bottom: 14px;
            font-size: 20px;
            color: #000;
        }
        .item--icon {
            line-height: 1;
            min-width: 55px;
            padding-right: 10px;
            @media #{$max-md} {
                margin-bottom: 12px;
            }
            i {
                font-size: 32px;
                color: $fifth_color;
            }
            svg {
                height: 36px;
                fill: $fifth_color;
                width: auto;
                path {
                    fill: $fifth_color !important;
                }
            }
        }
        .item--description {
            font-size: 16px;
            line-height: 27px;
            color: #666666;
            @media #{$max-md} {
                font-size: 14px;
                line-height: 25px;
            }
            b {
                color: #000;
            }
        }
    }
}
.ct-fancy-box-layout2 {
    padding-left: 35px;
    position: relative;
    @include transition(.3s cubic-bezier(.24,.74,.58,1));
    @media #{$max-md} {
        padding-left: 0;  
        text-align: center;
        margin-top: 32px;      
    }
    .item--icon {
        position: absolute;
        top: 50%;
        left: 4px;
        @include transform(translate(0, -50%));
        height: 64px;
        width: 64px;
        @include border-radius(100%);
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        color: #fff;
        z-index: 100;
        &:before, &:after {
            content: '';
            @include border-radius(100%);
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }
        &:before {
            background-color: $dark_color;
        }
        &:after {
            background-color: $primary_color;
            z-index: -1;
            top: 6px;
            left: -4px;
        }
        * {
            position: absolute;
            top: 50%;
            left: 50%;
            @include transform(translate(-50%, -50%));
            font-size: 38px;
        }
        @media #{$max-md} {
            left: 0;
            right: 0;
            top: -32px;
            transform: translate(0,0);
            margin: auto;
        }
    }
    .item--title {
        font-size: 22px;
        margin-bottom: 10px;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        @media #{$max-lg} {
            font-size: 20px;
        }
        @media #{$max-md} {
            font-size: 18px;
        }
    }
    .item--description {
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        @media #{$max-md} {
            font-size: 14px;
            line-height: 24px;
        }
    }
    .item--holder {
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        padding: 30px 30px 30px 50px;
        position: relative;
        z-index: 1;
        @media #{$max-lg} {
            padding-right: 18px;
        }
        @media #{$max-md} {
            padding-left: 15px;
            padding-right: 15px;
            padding-top: 55px;
        }
        .item--link {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 99;
        }
        &:before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: -1;
            @include box-shadow(0 4px 33px rgba(#000925, 0.18));
            background-color: #fff;
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
        }
    }
    .item--link i {
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        color: $secondary_color;
        position: absolute;
        bottom: 15px;
        right: 15px;
        transform: rotate(45deg);
    }
    &:hover {
        @include transform(translateY(-10px));
        .item--holder {
            .item--title {
                color: #fff;
            }
            .item--description {
                color: #aabcf3;
            }
            &:before {
                background-color: $dark_color;
                @include box-shadow(none);
                background-image: url(../images/bg-line.png);
                background-repeat: no-repeat;
                background-position: center right;
                background-size: cover;
            }
        }
        .item--icon {
            color: $secondary_color;
            &:before {
                background-color: #fff;
            }
        }
        .item--link i {
            color: #fff;
        }
    }
}
.ct-fancy-box-layout3 {
    text-align: center;
    &.style1 {
        .item--icon {
            height: 116px;
            width: 116px;
            color: $secondary_color;
            position: relative;
            margin: 0 auto 32px auto;
            z-index: 1;
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            i {
                font-size: 40px;
                display: inline-block;
                @include transition(.3s cubic-bezier(.24,.74,.58,1));
            }
            &:before, &:after {
                content: '';
                @include transition(.3s cubic-bezier(.24,.74,.58,1));
                position: absolute;
                bottom: 0;
                left: 0;
                right: 0;
                height: 100%;
                @include border-radius(100%);
            }
            &:before {
                background-color: #f1f3f8;
                z-index: -1;
            }
            &:after {
                background-color: $primary_color;
                z-index: -2;
                bottom: -13px;
                right: -2px;
            }
        }
        .item--title {
            font-weight: 20px;
        }
        &:hover .item--icon {
            color: #fff;
            &:before {
                background-color: $secondary_color;
            }
        }
    }
    &.style2 {
        .item--icon {
            height: 90px;
            width: 90px;
            color: $primary_color;
            position: relative;
            margin: 0 auto 21px auto;
            z-index: 1;
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            @include box-shadow(0 13px 25px rgba(#2e69ff, 0.2));
            @include border-radius(90px);
            background-color: #fff;
            i {
                font-size: 46px;
                display: inline-block;
                @include transition(.3s cubic-bezier(.24,.74,.58,1));
                &.flaticonv2-appointment {
                    font-size: 42px;
                }
            }
            &:before {
                background-color: #f1f3f8;
                z-index: -1;
            }
            &:after {
                background-color: $primary_color;
                z-index: -2;
                bottom: -13px;
                right: -2px;
            }
        }
        .item--number {
            top: 40px;
            right: -9px;
            transform: translate(0,0);
            left: auto;
            height: 20px;
            width: 20px;
            @include border-radius(20px);
            background-color: $fifth_color;
            color: #fff;
            font-size: 15px;
            line-height: 20px;
            font-weight: 700;
            font-family: 'Roboto', sans-serif;
        }
        .item--title {
            font-size: 22px;
            margin: 0 0 10px;
            color: #001c8f;
        }
        .ct-title-line::before {
            @include border-radius(2px);
        }
        .item--description {
            font-size: 15px;
            line-height: 24px;
            color: #666;
            padding: 0 17%;
            @media #{$max-lg} {
                padding: 0;
            }
        }
        &:hover .item--icon i {
            @include transform(translate(-50%, -50%) scale(1.12));
        }
    }
}
.ct-fancy-box-layout4 {
    @include transition(.3s cubic-bezier(.24,.74,.58,1));
    text-align: center;
    background-color: #fff;
    padding: 50px 30px;
    min-height: 285px;
    @include box-shadow(0 1px 29px rgba(#000000, 0.09));
    .item--icon {
        margin-bottom: 13px;
        i {
            font-weight: 50px;
            color: $primary_color;
        }
    }
    .item--title {
        font-size: 20px;
    }
    &:hover {
        @include box-shadow(0 1px 29px rgba($dark_color_hex, 0.14));
        @include transform(translateY(-6px));
    }
}
.ct-fancy-box-layout5 {
    background-color: #fff;
    border: 1px solid #eaebf0;
    @include border-radius(4px);
    padding: 28px 27px;
    position: relative;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    @include transition(.3s cubic-bezier(.24,.74,.58,1));
    @media #{$max-lg} {
        display: block;
        padding: 25px 20px;
    }
    &:before {
        content: '';
        @include border-radius(2px);
        height: 4px;
        width: 0;
        left: 0;
        opacity: 0;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        background-color: $primary_color;
        position: absolute;
        bottom: 0;
    }
    .item--title {
        font-size: 20px;
        margin-bottom: 7px;
    }
    .item--description {
        font-size: 15px;
        line-height: 24px;
    }
    .item--icon {
        margin-right: 15px;
        height: 92px;
        width: 92px;
        min-width: 92px;
        @include border-radius(100%);
        background-color: #f0f1f3;
        position: relative;
        @media #{$max-lg} {
            margin-bottom: 16px;
            margin-right: 0;
        }
        img {
            max-height: 52px;
            width: auto;
        }
        i {
            font-size: 48px;
            color: $primary_color;
        }
        svg {
            height: 52px;
        }
    }
    .item--link {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 99;
    }
    &:hover {
        @include transform(translateY(-17px));
        @include box-shadow(0 0 36px rgba(#0c0c0c, 0.12));
        &:before {
            width: 100%;
            opacity: 1;
        }
    }
}

.ct-fancy-box-layout6 {
    @include transition(.3s cubic-bezier(.24,.74,.58,1));
    position: relative;
    .item--order {
        font-size: 80px;
        line-height: 1;
        font-weight: 700;
        @include font-family-heading($heading_default_font);
    }
    .ct-fancy-main {
        background-color: #fff;
        padding: 54px 38px 50px;
        @include box-shadow(0 0 40px rgba(#0c0c0c, 0.1));
        .item--title {
            font-size: 22px;
            margin-bottom: 18px;
            color: #000;
        }
        .item--description {
            color: #666666;
        }
        .item--icon {
            height: 86px;
            width: 86px;
            @include border-radius(86px);
            background-color: $fifth_color;
            line-height: 86px;
            text-align: center;
            margin-bottom: 24px;
            display: inline-flex;
            justify-content: center;
            align-items: center;
            i {
                font-size: 51px;
                color: #fff;
            }
        }
        .item--order {
            color: #f5f3f0;
            top: 26px;
            right: 40px;
            position: absolute;
        }
    }
    .ct-fancy-hover {
        padding: 40px;
        background-color: #000;
        border-top: 7px solid $fifth_color;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 99;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        @include transform(scaleY(0));
        transform-origin: 0 0 0;
        -webkit-transform-origin: 0 0 0;
        -ms-transform-origin: 0 0 0;
        -o-transform-origin: 0 0 0;
        &:before {
            z-index: -1;
            background-color: rgba(#000, 0.8);
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            content: '';
        }
        .bg-image {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: -2;
            -webkit-filter: grayscale(100%);
            filter: grayscale(100%);
        }
        .item--title {
            margin-bottom: 19px;
            font-size: 22px;
            color: #fff;
        }
        .item--description {
            color: #e1e1e1;
        }
        .item--link {
            font-size: 15px;
            font-weight: 700;
            flex-grow: 1;
            margin-right: 30px;
            i {
                margin-left: 10px;
                @include transition(margin-left .3s cubic-bezier(.24,.74,.58,1));
            }
            a {
                color: $fifth_color;
                &:hover {
                    color: $fifth_color;
                    i {
                        margin-left: 14px;
                    }
                }
            }
        }
        .item--order {
            color: #fff;
        }
        .item--meta {
            display: flex;
            flex-wrap: nowrap;
            align-items: center;
        }
    }
    &:hover {
        @include transform(translateY(-20px));
        .ct-fancy-hover {
            @include transform(scaleY(1));
        }
    }
}
// End Fancy Box
//--------------------------------------------------

// Start Contact Form
//--------------------------------------------------
.ct-contact-form-layout1 {
    .ct-contact-meta {
        margin-bottom: 22px;
        h3 {
            margin-bottom: 0;
            font-size: 30px;
            @media #{$max-sm} {
                font-size: 24px;
            }
            span {
                position: relative;
                display: inline-block;
                padding-right: 80px;
                @media #{$max-md} {
                    padding-right: 60px;
                }
                &:before {
                    content: '';
                    width: 64px;
                    height: 3px;
                    background-color: $primary_color;
                    position: absolute;
                    top: 50%;
                    right: 0;
                    @include transform(translate(0, -50%));
                    @media #{$max-md} {
                        width: 44px;
                        height: 2px;
                    }
                }
            }
        }
        p {
            margin-bottom: 0;
            margin-top: 10px;
        }
    }
    &.style9 {
        .row {
            margin-left: -10px;
            margin-right: -10px;
            > div {
                padding: 0 10px;
            }
            .wpcf7-form-control-wrap {
                margin-bottom: 15px;
            }
        }
        .wpcf7-form-control {
            &:not(.wpcf7-submit) {
                height: 60px;
                background-color: #F2F6F7;
                border-radius: 30px;
                border-color: transparent;
                color: #505455;
                font-size: 16px;
                padding-left: 26px;
                padding-right: 26px;
                &:focus, &:hover {
                    border-color: $primary_color;
                }
            }
            &.wpcf7-textarea {
                height: 175px;
            }
        }
        .nice-select {
            span.current {
                line-height: 46px;
            }
            &.open {
                border-radius: 30px 30px 0px 0;
            }
        }
    }
    &.style1 {
        .row {
            margin-left: -10px;
            margin-right: -10px;
            > div {
                padding: 0 10px;
            }
            .wpcf7-form-control-wrap {
                margin-bottom: 15px;
            }
        }
        .wpcf7-form-control {
            &:not(.wpcf7-submit) {
                height: 46px;
                background-color: rgba(#fff, 0.1);
                border-color: transparent;
                color: #c3c4e1;
                &:focus, &:hover {
                    border-color: rgba(#fff, 0.2);
                }
            }
            &.wpcf7-textarea {
                height: 120px;
            }
        }
        .btn-plus {
            padding-left: 32px;
            padding-right: 66px;
        }
        .nice-select span.current {
            line-height: 32px;
        }
        .nice-select.open .list {
            color: #3a4268;
        }
    }
    &.style2 {
        .row {
            margin-left: -14px;
            margin-right: -14px;
            > div {
                padding: 0 14px;
            }
            .wpcf7-form-control-wrap {
                margin-bottom: 35px;
            }
        }
        .wpcf7-form-control {
            &:not(.wpcf7-submit) {
                height: 51px;
                border-color: #d1d8e6;
                color: #3a4268;
                @include border-radius(5px);
                &:focus, &:hover {
                    border-color: $primary_color
                }
            }
            &.wpcf7-textarea {
                height: 175px;
            }
        }
        .input-filled > label {
            font-size: 16px;
            font-weight: 500;
            color: $dark_color;
            margin-bottom: 8px;
        }
        .btn {
            padding-left: 48px;
            padding-right: 48px;
            @include border-radius(5px);
            line-height: 51px;
        }
    }
    &.style3 {
        background-color: #02154e;
        padding: 63px 45px 70px;
        @include border-radius(0 0 8px 8px);
        background-image: url(../images/bg-contact-form.png);
        background-repeat: no-repeat;
        background-position: top center;
        background-size: cover;
        @media #{$max-lg} {
            padding: 55px 30px 65px;
        }
        .ct-contact-meta {
            display: flex;
            flex-wrap: wrap;
            flex-direction: column-reverse;
            margin-bottom: 25px;
            span {
                padding: 0;
                &:before {
                    display: none;
                }
            }
            h3 {
                color: #fff;
                font-size: 24px;
                width: 100%;
            }
            p {
                margin: 0 0 9px;
                font-size: 15px;
                color: #d3d4eb;
            }
        }
        .wpcf7-form-control {
            &:not(.wpcf7-submit) {
                height: 46px;
                border-color: #22356f;
                background-color: #22356f;
                color: #c3c4e1;
                @include border-radius(0px);
                &:focus, &:hover {
                    border-color: $primary_color
                }
            }
            &.wpcf7-textarea {
                height: 185px;
            }
        }
        .wpcf7-form-control-wrap {
            margin-bottom: 18px;
        }
        .nice-select::after {
            color: #c3c4e1;
        }
        .nice-select span.current {
            line-height: 32px;
        }
        .nice-select .list {
            color: #3a4268;
        }
        .nice-select .list .selected {
            color: $dark_color;
        }
    }
    &.style4 {
        .row {
            margin-left: -11px;
            margin-right: -11px;
            > div {
                padding: 0 11px;
            }
            .wpcf7-form-control-wrap {
                margin-bottom: 26px;
            }
        }
        .wpcf7-form-control {
            &:not(.wpcf7-submit) {
                height: 46px;
                border-width: 2px;
                border-color: #f9f9f8;
                background-color: #f9f9f8;
                color: #666666;
                @include border-radius(0px);
                &:focus, &:hover {
                    border-color: $primary_color
                }
            }
            &.wpcf7-textarea {
                height: 120px;
            }
        }
        .btn {
            padding-left: 48px;
            padding-right: 48px;
            @include border-radius(0px);
            line-height: 53px;
            width: 100%;
            background-color: $primary_color;
            font-weight: 500;
            &:before {
                position: absolute;
                left: 0;
                top: 0;
                height: 100%;
                width: 100%;
                content: "";
                -webkit-transform: scale(0, 1);
                -ms-transform: scale(0, 1);
                transform: scale(0, 1);
                -webkit-transform-origin: top right;
                -ms-transform-origin: top right;
                transform-origin: top right;
                -webkit-transition: transform .3s cubic-bezier(.24,.74,.58,1);
                -o-transition: transform .3s cubic-bezier(.24,.74,.58,1);
                -webkit-transition: -webkit-transform .3s cubic-bezier(.24,.74,.58,1);
                transition: -webkit-transform .3s cubic-bezier(.24,.74,.58,1);
                transition: transform .3s cubic-bezier(.24,.74,.58,1);
                transition: transform .3s cubic-bezier(.24,.74,.58,1), -webkit-transform .3s cubic-bezier(.24,.74,.58,1);
                    transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1), cubic-bezier(0.86, 0, 0.07, 1);
                -webkit-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
                -o-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
                transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
                background-color: $fifth_color;
                z-index: -1;
            }
            &:after {
                display: none;
            }
            &:hover {
                color: #fff;
                &:before {
                    -webkit-transform: scale(1, 1);
                    -ms-transform: scale(1, 1);
                    transform: scale(1, 1);
                    -webkit-transform-origin: bottom left;
                    -ms-transform-origin: bottom left;
                    transform-origin: bottom left;
                }
            }
            i {
                display: none;
            }
        }
        .nice-select span.current {
            line-height: 32px;
        }
    }
    &.style5 {
        .wpcf7-form {
            .wpcf7-form-control-wrap {
                margin-bottom: 30px;
                > i {
                    position: absolute;
                    top: 50%;
                    right: 21px;
                    color: #bababa;
                    @include transform(translate(0, -50%));
                    z-index: 9;
                }
            }
            .wpcf7-form-control {
                &:not(.wpcf7-submit) {
                    height: 60px;
                    border: none;
                    color: #9b9b9b;
                    font-size: 16px;
                    font-weight: 500;
                    @include font-family-heading($heading_default_font);
                    @include border-radius(5px);
                }
                &.wpcf7-textarea {
                    height: 120px;
                }
            }
            .wpcf7-submit {
                background-color: $secondary_color;
                line-height: 60px;
                width: 100%;
                @include border-radius(5px);
                margin-bottom: 30px;
            }
            .nice-select {
                span.current {
                    line-height: 48px;
                }
                &:after {
                    font-size: 20px;
                    font-weight: 400;
                }
            }
        }
    }
    &.style6 {
        .row {
            margin-left: -4px;
            margin-right: -4px;
            > div {
                padding: 0 4px;
            }
        }
        .wpcf7-form {
            .wpcf7-form-control-wrap {
                margin-bottom: 8px;
            }
            .wpcf7-form-control {
                &:not(.wpcf7-submit) {
                    height: 52px;
                    border: none;
                    color: #666666;
                    font-size: 15px;
                    @include border-radius(5px);
                }
                &.wpcf7-textarea {
                    height: 120px;
                }
            }
            .wpcf7-submit {
                font-size: 15px;
                line-height: 52px;
                width: 100%;
                @include border-radius(5px);
                display: inline-flex;
                align-items: center;
                justify-content: center;
                i {
                    margin-left: 14px;
                    font-size: 18px;
                }
                &:before {
                    background-color: rgba(#fff, 0.2);
                }
                &:after {
                    background-color: #fff;
                }
                &:hover, &:focus {
                    color: #000;
                }
            }
            .nice-select {
                span.current {
                    line-height: 40px;
                }
                &:after {
                    font-size: 18px;
                    font-weight: 400;
                    color: #666;
                }
            }
        }
    }
    &.style7 {
        .row {
            margin-left: -14px;
            margin-right: -14px;
            > div {
                padding: 0 14px;
            }
            .wpcf7-form-control-wrap {
                margin-bottom: 20px;
            }
        }
        .wpcf7-form-control {
            font-family: 'Barlow', sans-serif;
            font-weight: 500;
            font-size: 16px;
            &:not(.wpcf7-submit) {
                height: 50px;
                border-color: #e9e9e8;
                color: #666;
                @include border-radius(3px);
                background-color: transparent;
                &:focus, &:hover {
                    border-color: $primary_color
                }
            }
            &.wpcf7-textarea {
                height: 100px;
            }
        }
        .nice-select span.current {
            line-height: 35px;
        }
        .input-filled > label {
            font-size: 16px;
            font-weight: 500;
            color: $dark_color;
            margin-bottom: 8px;
        }
        .btn {
            padding: 0 30px;
            margin-top: 20px;
            line-height: 56px;
            font-size: 16px;
            font-family: 'Outfit-Semibold';
            @include background-horizontal($primary_color, $secondary_color);
            font-weight: 400;
            box-shadow: 0px 8px 24px 0px rgba($primary_color_hex, 0.3);
            @include border-radius(5px);
            &:before {
                content: "";
                background: #fff;
                -webkit-transition: all .8s;
                -ms-transition: all .8s;
                transition: all .8s;
                position: absolute;
                height: 120%;
                width: 15px;
                opacity: .2;
                left: -35%;
                top: -10%;
                transform: rotate(15deg);
                -moz-transform: rotate(15deg);
                -webkit-transform: rotate(15deg);
                -o-transform: rotate(15deg);
                z-index: -1;
              }
              &:hover, &:focus {
                &:before {
                  left: 130%;
                }
              }
              &:after {
                display: none;
            }
            i {
                transform: rotate(-45deg);
                display: inline-block;
                @include transition(.3s cubic-bezier(.24,.74,.58,1));
            }
            &:hover i {
                transform: rotate(0deg);
            }
            &.icon-right i {
                margin-left: 20px;
                margin-right: 0;
            }
        }
    }
    &.style8 {
        .row {
            margin-left: -10px;
            margin-right: -10px;
            > div {
                padding: 0 10px;
            }
            .wpcf7-form-control-wrap {
                margin-bottom: 15px;
            }
        }
        .wpcf7-form-control {
            &:not(.wpcf7-submit) {
                height: 50px;
                background-color: rgba(#fff, 0.1);
                border-color: transparent;
                color: #fff;
                &:focus, &:hover {
                    border-color: rgba(#fff, 0.2);
                }
            }
            &.wpcf7-textarea {
                height: 120px;
            }
        }
        .wpcf7-submit {
            width: 100%;
            line-height: 50px;
            text-transform: uppercase;
            font-size: 15px;
            font-weight: 500;
            border-radius: 0px;
            @include font-family-heading($heading_default_font);
            &:hover {
                background-color: #fff;
                color: #000;
            }
        }
        .nice-select {
            &:after {
                color: #fff;
            }
            span.current {
                line-height: 34px;
            }
        }
        .nice-select.open .list {
            color: #000;
        }
    }
    .fr-label {
        display: block;
        color: #00162f;
        font-family: 'Outfit-Semibold';
        margin-bottom: 9px;
    }
}
.elementor-editor-active .wpcf7-form .input-icon {
    display: none;
}
// End Contact Form
//--------------------------------------------------

// Start Portfolio Grid
//--------------------------------------------------
.ct-portfolio-grid1 {
    .item--featured {
        position: relative;
        img {
            width: 100%;
        }
        &:before {
            content: '';
            position: absolute;
            top: 30px;
            left: 30px;
            right: 30px;
            bottom: 30px;
            background-color: rgba(#001e79, 0.79);
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            opacity: 0;
        }
    }
    .item--title {
        margin-bottom: 20px;
        color: #fff;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        @include transform(translateY(40px));
        opacity: 0;
        a {
            color: inherit;
        }
    }
    .item--holder {
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
        padding: 20px;
        @include transform(translate(0, -50%));
        text-align: center;
        z-index: 1;
    }
    .item--readmore {
        margin-bottom: 24px;
        a {
            font-size: 20px;
            font-weight: 600;
            width: 50px;
            height: 50px;
            background-color: $primary_color;
            @include border-radius(50px);
            display: inline-block;
            line-height: 50px;
            color: #fff;
            @include font-family-heading($heading_default_font);
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            opacity: 0;
            @include transform(scale(0));
            &:hover {
                @include box-shadow(0 0 0 10px rgba(#fff, 0.2));
            }
        }
    }
    .item--divider {
        height: 3px;
        position: relative;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        @include transform(translateY(40px));
        opacity: 0;
        &:before {
            content: '';
            height: 3px;
            width: 64px;
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            margin: auto;
            background-color: $primary_color;
        }
    }
    .grid-item-inner {
        margin-bottom: 30px;
        &:hover {
            .item--featured:before {
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                opacity: 1;
            }
            .item--readmore a {
                @include transform(scale(1));
                opacity: 1;
                -webkit-transition-delay: 0.05s;
                -moz-transtion-delay: 0.05s;
                transition-deilay: 0.05s;
            }
            .item--title {
                -webkit-transition-delay: 0.1s;
                -moz-transition-delay: 0.1s;
                transition-delay: 0.1s;
                opacity: 1;
                @include transform(translateY(0px));
            }
            .item--divider {
                opacity: 1;
                @include transform(translateY(0px));
                -webkit-transition-delay: 0.2s;
                -moz-transition-delay: 0.2s;
                transition-delay: 0.2s;
            }
        }
    }
}

.ct-portfolio-grid2 {
    .item--featured {
        img {
            width: 100%;
        }
        a {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(#000826, 0.9);
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            opacity: 0;
        }
    }
    .item--meta {
        padding: 30px 20px 30px 30px;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
    }
    .item--title {
        margin-bottom: 10px;
        font-size: 22px;
        color: #fff;
        opacity: 0;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        transform: translateX(30px);
        -webkit-transition-delay: 0.1s;
        -moz-transtion-delay: 0.1s;
        transition-deilay: 0.1s;
        a {
            color: inherit;
            &:hover {
                color: inherit;
            }
        }
    }
    .item--category {
        font-family: 'Roboto', sans-serif;
        font-size: 15px;
        color: $primary_color;
        opacity: 0;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        transform: translateX(30px);
        -webkit-transition-delay: 0.2s;
        -moz-transtion-delay: 0.2s;
        transition-deilay: 0.2s;
        a {
            color: inherit;
        }
    }
    @media #{$min-lg} {
        .grid-item.col-xl-6 .item--meta {
            padding-left: 40px;
            padding-bottom: 34px;
        }
    }
    .grid-item-inner {
        overflow: hidden;
        @include border-radius(5px);
        margin-bottom: 30px;
        &:hover {
            .item--featured a {
                opacity: 1;
            }
            .item--title, .item--category { 
                opacity: 1;
                transform: translateX(0px);
            }
        }
    }
}

// End Portfolio Grid
//--------------------------------------------------

// Start Portfolio Details
//--------------------------------------------------
.ct-portfolio-detail {
    overflow: hidden;
    @include border-radius(5px);
    .wg-title {
        margin: 0;
        color: #fff;
        background-color: $secondary_color;
        font-size: 22px;
        font-weight: 600;
        padding: 16px 20px;
        text-align: center;
        @include border-radius(5px 5px 0 0);
    }
    ul {
        margin: 0;
        background-color: #fff;
        padding: 20px 17px 29px;
        border-bottom: 1px solid #e8ebf5;
        list-style: none;
        font-size: 15px;
        color: $dark_color;
        label {
            font-weight: 500;
            min-width: 55px;
            margin-right: 5px;
        }
        li + li {
            margin-top: 12px;
        }
    }
    .ct-portfolio-value {
        background-color: #fff;
        @include border-radius(0 0 5px 5px);
        padding: 18px 17px 20px;
        .ct-portfolio-cost {
            font-size: 15px;
            color: $dark_color;
            margin-bottom: 2px;
            span {
                display: inline-block;
                font-weight: 500;
                min-width: 55px;
                margin-right: 5px;
            }
        }
        .ct-portfolio-rating {
            font-size: 14px;
            color: #ffc601;
            letter-spacing: -0.04em;
        }
    }
}
// End Portfolio Details
//--------------------------------------------------

// Start Navigation Menu
//--------------------------------------------------
.ct-navigation-menu1 {
    &.default {
        background-color: #fff;
        @include border-radius(5px);
        overflow: hidden;
        li {
            a {
                color: $dark_color;
                display: block;
                font-size: 16px;
                font-weight: 600;
                @include font-family-heading($heading_default_font);
                line-height: normal;
                padding: 14px 40px 14px 22px;
                position: relative;
                position: relative;
                z-index: 1;
                border-bottom: 2px solid #e5eaef;
                &:after {
                    content: '\f105';
                    font-family: "Font Awesome 5 Pro";
                    font-weight: 900;
                    color: #fff;
                    @include transition(all 240ms linear 0ms);
                    position: absolute;
                    top: 50%;
                    right: 32px;
                    opacity: 0;
                    @include transform(translate(0, -50%));
                }
            }
            &.current-menu-item > a, &.current-cat > a, &.current-cat-parent > a, > a:hover {
                background-color: $secondary_color;
                color: #fff;
                &:after {
                    right: 22px;
                    opacity: 1;
                }
            }
            &:last-child > a {
                border-bottom: none;
            }
        }
    }
}
// End Navigation Menu
//--------------------------------------------------

// Start List
//--------------------------------------------------
.ct-list {
    font-size: 15px;
    line-height: 26px;
    .ct-list-icon {
        margin-right: 10px;
        display: flex;
        i {
            color: $secondary_color;
        }
    }
    .ct-list-item  {
        display: flex;
        flex-wrap: nowrap;
        + .ct-list-item  {
            margin-top: 16px;
        }
    }
}


// Start Portfolio Carousel
//--------------------------------------------------
.ct-portfolio-carousel1, .ct-service-carousel1 {
    .item--icon {
        position: absolute;
        top: 50%;
        left: 4px;
        @include transform(translate(0, -50%));
        height: 64px;
        width: 64px;
        @include border-radius(100%);
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        color: #fff;
        z-index: 100;
        &:before, &:after {
            content: '';
            @include border-radius(100%);
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }
        &:before {
            background-color: $dark_color;
        }
        &:after {
            background-color: $primary_color;
            z-index: -1;
            top: 6px;
            left: -4px;
        }
        * {
            position: absolute;
            top: 50%;
            left: 50%;
            @include transform(translate(-50%, -50%));
            font-size: 38px;
        }
    }
    .item--title {
        font-size: 22px;
        margin-bottom: 10px;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        @media #{$max-md} {
            font-size: 20px;
        }
    }
    .item--description {
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        @media #{$max-md} {
            font-size: 14px;
            line-height: 24px;
        }
    }
    .item--holder {
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        padding: 30px 30px 30px 50px;
        position: relative;
        margin: 40px 0;
        z-index: 1;
        .item-link {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 99;
        }
        &:before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: -1;
            @include box-shadow(0 4px 33px rgba(#000925, 0.18));
            background-color: #fff;
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
        }
        &:after {
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            content: '';
            position: absolute;
            bottom: 0;
            right: 0px;
            background-color: $primary_color;
            z-index: -2;
            opacity: 0;
            width: 100%;
            height: 100%;
            -webkit-transition-delay: 0.05s;
            -moz-transtion-delay: 0.05s;
            transition-deilay: 0.05s;
        }
    }
    .grid-item-inner {
        padding-left: 35px;
        position: relative;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        &:hover {
            @include transform(translateY(-10px));
            .item--holder {
                .item--title {
                    color: #fff;
                }
                .item--description {
                    color: #aabcf3;
                }
                &:before {
                    background-color: $dark_color;
                    @include box-shadow(none);
                    background-image: url(../images/bg-line.png);
                    background-repeat: no-repeat;
                    background-position: center right;
                    background-size: cover;
                }
                &:after {
                    opacity: 1;
                    bottom: -10px;
                    right: -10px;
                }
            }
            .item--icon {
                color: $secondary_color;
                &:before {
                    background-color: #fff;
                }
            }
        }
    }
    @media #{$min-xl} {
        .ct-slick-carousel[data-arrows="true"] {
            padding: 0 39px;
            .slick-arrow {
                margin: 0;
                top: 50%;
                bottom: auto;
                @include transform(translate(0, -50%));
                &.slick-prev {
                    left: 0px;
                    right: auto;
                }
                &.slick-next {
                    right: 0px;
                    left: auto;
                }
            }
        }
    }
    @media #{$max-lg} {
        .ct-slick-carousel[data-arrows="true"] {
            padding-bottom: 45px;
        }
    }
    .ct-slick-carousel {
        margin: 0 -30px 0 -30px;
        padding-left: 30px;
        padding-right: 30px;
        overflow: hidden;
        .slick-list {
            overflow: visible;
        }
    }
    .slick-slide {
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        opacity: 0;
        &.slick-active {
            opacity: 1;
        }
    }
    .slick-dots {
        margin-top: 0;
    }
}

.ct-portfolio-carousel2 {
    .item--image img {
        width: 100%;
    }
    .item--title {
        font-size: 22px;
        margin-bottom: 3px;
    }
    .item--category {
        font-size: 15px;
        font-weight: 500;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        a {
            color: inherit;
            &:hover {
                color: $primary_color;
            }
        }
    }
    .item-readmore {
        position: absolute;
        bottom: 13px;
        opacity: 0;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        visibility: hidden;
        a {
            font-size: 16px;
            font-weight: 700;
            color: $primary_color;
            display: inline-flex;
            align-items: center;
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            i {
                width: 24px;
                height: 24px;
                color: #fff;
                @include border-radius(24px);
                line-height: 24px;
                text-align: center;
                background-color: $primary_color;
                margin-right: 10px;
            }
            &:hover {
                color: $secondary_color;
            }
        }
    }
    .item--holder {
        padding: 28px 28px;
        @include border-radius(4px);
        border: 1px solid #eaebf0;
        background-color: #fff;
        position: relative;
    }
    .item--image {
        position: relative;
        &:before {
            content: '';
            z-index: 1;
            background-color: rgba(#000000, 0.41);
            position: absolute;
            bottom: 0;
            right: 0;
            left: 0;
            height: 0;
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
        }
        a {
            height: 60px;
            width: 60px;
            @include border-radius(60px);
            background-color: $primary_color;
            font-size: 30px;
            color: #fff;
            line-height: 60px;
            text-align: center;
            position: absolute;
            left: 0;
            top: 0;
            right: 0;
            bottom: 0;
            margin: auto;
            z-index: 2;
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            @include transform(translateY(-60px));
            opacity: 0;
            &:hover {
                @include box-shadow(0 0 0 10px rgba(#fff, 0.32));
            }
        }
        img {
            @include border-radius(4px 4px 0 0); 
        }
        + .item--holder {
            border-top: none;
            @include border-radius(0 0 4px 4px); 
        }
    }
    .grid-item-inner {
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        margin-top: 30px;
        margin-bottom: 50px;
        &:hover {
            @include transform(translate(0, -15px));
            @include box-shadow(0 27px 32px rgba(#0c0c0c, 0.16));
            .item--image {
                &:before {
                    height: 100%;
                }
                a {
                    @include transform(translateY(0px));
                    opacity: 1;
                }
            }
            .item--category {
                @include transform(translateY(-10px));
                opacity: 0;
                visibility: hidden;
            }
            .item-readmore {
                bottom: 23px;
                opacity: 1;
                visibility: visible;
            }
        }
    }
    .ct-slick-carousel {
        margin: 0 -30px 0 -30px;
        padding-left: 30px;
        padding-right: 30px;
        overflow: hidden;
        .slick-list {
            overflow: visible;
        }
    }
    .slick-slide {
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        opacity: 0;
        &.slick-active {
            opacity: 1;
        }
    }
}

.ct-portfolio-carousel3 {
    .item-readmore {
        margin-bottom: 32px;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        
        a {
            font-size: 30px;
            color: #fff;
            width: 57px;
            height: 57px;
            background-color: $primary_color;
            @include border-radius(57px);
            @include font-family-heading($heading_default_font);
            line-height: 57px;
            text-align: center;
            display: inline-block;
            &:hover {
                @include box-shadow(0 0 0 10px rgba(#fff, 0.32));
            }
        }
    }
    .item--title {
        font-size: 22px;
        margin-bottom: 8px;
        color: #fff;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        a {
            color: inherit;
            &:hover {
                color: inherit;
            }
        }
    }
    .item--category {
        font-size: 15px;
        color: $fifth_color;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        
        a {
            color: inherit;
            &:hover {
                color: inherit;
            }
        }
    }
    .item--image {
        position: relative;
        img {
            width: 100%;
        }
        &:before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(#000, 0.66);
            opacity: 0;
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
        }
    }
    .item--meta {
        position: absolute;
        width: 100%;
    }
    .item--meta-top {
        top: 0;
        left: 0;
        padding: 30px 20px 30px 35px;
        .item-readmore, .item--title, .item--category {
            @include transform(translateY(-60px));
            opacity: 0;
        }
    }
    .item--meta-botom {
        left: 0;
        bottom: 0;
        padding: 70px 20px 32px 35px;
        z-index: 1;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        &:before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            @include background-gradient-bottom(rgba(#000, 0.85) 60%, rgba(#000, 0));
            z-index: -1;
        }
    }
    .grid-item-inner {
        position: relative;
        overflow: hidden;
        &:hover {
            .item--meta-botom {
                @include transform(translateY(100%));
                opacity: 0;
            }
            .item--image:before {
                opacity: 1;
            }
            .item--meta-top {
                .item-readmore {
                    -webkit-transition-delay: 0.2s;
                    -moz-transtion-delay: 0.2s;
                    transition-deilay: 0.2s;
                }
                .item--title {
                    -webkit-transition-delay: 0.15s;
                    -moz-transtion-delay: 0.15s;
                    transition-deilay: 0.15s;

                }
                .item--category {
                    -webkit-transition-delay: 0.1s;
                    -moz-transtion-delay: 0.1s;
                    transition-deilay: 0.1s;
                }
                .item-readmore, .item--title, .item--category {
                    @include transform(translateY(0px));
                    opacity: 1;
                }
            }
        }
    }
}

.dots-slider {
    .slick-dots {
        display: flex;
        max-width: 310px;
        min-width: 260px;
        background-color: #f5f3f0;
        margin-bottom: 0;
        height: 16px;
        margin: 40px auto 0 auto;
        @include border-radius(16px);
        flex-wrap: nowrap;
        li {
            width: 50%;
            margin: 0;
            button {
                height: 16px;
                width: 100%;
                @include border-radius(16px);
                background-color: transparent;
                &:before, &:after {
                    display: none;
                }
            }
            &.slick-active button {
                background-color: $primary_color;
            }
        }
    }
}

.ct-service-carousel3, .ct-service-grid2 {
    .item--image {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: -1;
        @include border-radius(8px);
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        opacity: 0;
        &:before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba($dark_color_hex, 0.86);
            @include border-radius(8px);
        }
    }
    .item--icon {
        height: 92px;
        width: 92px;
        position: relative;
        display: inline-block;
        margin: 0 auto 14px auto;
        i {
            font-size: 48px;
            color: $dark_color;
        }
        img {
            max-height: 48px;
            width: auto;
        }
        &:before {
            content: '';
            @include border-radius(92px);
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            border: 2px dashed $secondary_color;
            position: absolute;
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
        }
        &:after {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            @include border-radius(92px);
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            background-color: $primary_color;
            opacity: 0;
            z-index: -1;
            @include transform(scale(1.2));
        }
    }
    .item--title {
        margin-bottom: 14px;
        a {
            color: inherit;
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            &:hover {
                color: inherit;
            }
        }
    }
    .item--content {
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
    }
    .item-readmore {
        line-height: normal;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        opacity: 0;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        a {
            font-size: 14px;
            color: #fff;
            font-weight: 700;
            @include font-family-heading($heading_default_font);
            display: inline-flex;
            flex-wrap: wrap;
            align-items: center;
            i {
                @include transition(.3s cubic-bezier(.24,.74,.58,1));
                color: $primary_color;
                margin-left: 4px;
            }
            &:hover {
                color: $primary_color;
                i {
                    margin-left: 8px;
                }
            }
        }
    }
    .grid-item-inner {
        position: relative;
        padding: 34px 24px 38px 24px;
        z-index: 1;
        text-align: center;
        margin: 30px 0;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        &:before {
            content: '';
            background-color: #fff;
            @include border-radius(8px);
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: -1;
            @include box-shadow(0 0 20px rgba(#0c0c0c, 0.06));
        }
        &:hover {
            padding-top: 22px;
            padding-bottom: 50px;
            .item--icon {
                &:before {
                    opacity: 0;
                }
                &:after {
                    opacity: 1;
                    @include transform(scale(1));
                }
            }
            .item--title, .item--title a, .item--content {
                color: #fff;
            }
            .item--image { 
                opacity: 1;
                top: -18px;
                bottom: -18px;
            }
            .item-readmore {
                opacity: 1;
                bottom: 16px;
            }
        }
    }
    .ct-carousel-inner {
        margin: 0 -25px;
        .slick-slide {
            padding: 0 25px;
        }
    }
    @media #{$min-xl} {
        .ct-slick-carousel[data-arrows="true"] {
            padding: 0 25px;
            .slick-arrow {
                margin: 0;
                top: 50%;
                bottom: auto;
                @include transform(translate(0, -50%));
                &.slick-prev {
                    left: -30px;
                    right: auto;
                }
                &.slick-next {
                    right: -30px;
                    left: auto;
                }
            }
        }
    }
}

.ct-service-grid3 {
    .item--image {
        position: relative;
        overflow: hidden;
        @include border-radius(5px);
        img {
            width: 100%;
        }
    }
    .ct-load-more .btn {
        line-height: 55px;
        padding: 0 45px;
        @include border-radius(5px);
        background-color: $primary_color;
        @include font-family-heading($heading_default_font);
        font-weight: 600;
        &:hover, &:focus {
            background-color: $secondary_color;
        }
    }
    .item--title {
        font-size: 22px;
        color: #001c8f;
        margin-bottom: 0px;
        @media #{$max-lg} {
            font-size: 18px;
        }
        a {
            color: inherit;
            &:hover {
                color: inherit;
            }
        }
    }
    .item--content {
        padding: 0 10px;
        color: #5a6079;
        font-size: 16px;
        line-height: 24px;
        display: none;
        padding-top: 14px;
        @media #{$max-lg} {
            padding-left: 0;
            padding-right: 0;
        }
    }
    .item--icon {
        position: absolute;
        background-color: $secondary_color;
        top: -38px;
        left: 0;
        right: 0;
        margin: auto;
        width: 75px;
        height: 75px;
        border-radius: 75px;
        line-height: 75px;
        color: #fff;
        font-size: 42px;
        @include box-shadow(0 13px 20px rgba(#628dfb, 0.3));
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
    }
    .item--holder {
        text-align: center;
        padding: 60px 20px 32px;
        position: relative;
        @media #{$max-lg} {
            padding-left: 15px;
            padding-right: 15px;
        }
    }
    .grid-item-inner {
        background-color: #fff;
        @include border-radius(5px);
        @include box-shadow(0 13px 35px rgba(#2e69ff, 0.1));
        margin-bottom: 60px;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        &:hover {
            @include box-shadow(0 13px 35px rgba(#2e69ff, 0.15));
            .item--icon {
                background-color: $primary_color;
            }
        }
    }
    .grid-item:hover {
        z-index: 99;
    }
}

.ct-service-carousel4 {
    .item--image {
        img {
            @include border-radius(4px 4px 0 0);
            width: 100%;
        }
    }
    .item--holder {
        padding: 30px 23px;
        display: flex;
        flex-wrap: nowrap;
    }
    .item--icon {
        line-height: 1;
        margin-right: 24px;
        i {
            font-size: 58px;
            color: $primary_color;
        }
    }
    .item--title {
        font-size: 22px;
        margin-top: -6px;
        margin-bottom: 8px;
        a {
            color: inherit;
            &:hover {
                color: $primary_color;
            }
        }
    }
    .item--content {
        font-size: 15px;
        line-height: 24px;
        margin-bottom: 17px;
    }
    .item-readmore {
        a {
            font-size: 16px;
            font-weight: 700;
            color: $dark_color;
            display: inline-flex;
            align-items: center;
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            i {
                width: 24px;
                height: 24px;
                color: #fff;
                @include border-radius(24px);
                line-height: 24px;
                text-align: center;
                background-color: $primary_color;
                margin-right: 10px;
            }
        }
    }
    .grid-item-inner {
        margin-top: 30px;
        margin-bottom: 50px;
        background-color: #fff;
        border: 1px solid #eaebf0;
        @include border-radius(4px);
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        &:hover {
            @include transform(translateY(-15px));
            @include box-shadow(0 19px 32px rgba(#0c0c0c, 0.16));
            .item-readmore a {
                color: $primary_color;
            }
        }
    }
    .ct-slick-carousel {
        margin: 0 -30px 0 -30px;
        padding-left: 30px;
        padding-right: 30px;
        overflow: hidden;
        .slick-list {
            overflow: visible;
        }
    }
    .slick-slide {
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        opacity: 0;
        &.slick-active {
            opacity: 1;
        }
    }
    .slick-dots {
        margin-top: 0;
        li {
            button {
                background-color: #d4d4d4;
                &:before {
                    border-color: $primary_color;
                }
            }
            &.slick-active button {
                background-color: $primary_color;
            }
        }
    }
}

.ct-service-carousel5 {
    .item--image {
        position: relative;
        margin-bottom: 26px;
        &:before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(#000, 0.88);
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            opacity: 0;
        }
        img {
            width: 100%;
        }
    }
    .item-readmore a {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        @include border-radius(39px);
        line-height: 39px;
        background-color: $primary_color;
        z-index: 9;
        opacity: 0;
        margin-top: -40px;
    }
    .item--icon {
        position: absolute;
        bottom: 0;
        left: 0;
        z-index: 99;
        width: 100px;
        text-align: center;
        height: 58px;
        background-color: #f0f0f0;
        font-size: 40px;
        color: $secondary_color;
        border-top: 6px solid $secondary_color;
        border-right: 6px solid $secondary_color;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        img {
            max-height: 40px;
            width: auto;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
        }
    }
    .item--title {
        font-size: 20px;
        color: #000;
        a {
            color: inherit;
            &:hover {
                color: $secondary_color;
            }
        }
    }
    .item--content {
        font-family: 'Roboto', sans-serif;
        color: #666;
        font-size: 16px;
        line-height: 24px;
    }
    .grid-item-inner {
        &:hover {
            .item--image:before {
                opacity: 1;
            }
            .item-readmore a {
                margin-top: 0;
                opacity: 1;
            }
            .item--icon {
                border-color: $primary_color;
            }
        }
    }
}

// Start Counter
//--------------------------------------------------
.ct-counter-layout1 {
    .item--icon {
        margin-right: 18px;
        i {
            font-size: 60px;
            color: #ced4e6;
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            display: inline-block;
            @media #{$max-md} {
                font-size: 54px;
            }
        }
        img {
            max-height: 54px;
            width: auto;
        }
    }
    .ct-counter-title {
        margin-bottom: 0px;
        font-weight: 500;
    }
    .ct-counter-number-value {
        @include font-family-heading($heading_default_font);
        font-size: 36px;
        line-height: 1;
        color: $dark_color;
        font-weight: 700;
        margin-bottom: 4px;
        @media #{$max-md} {
            font-size: 30px;
        }
    }
    .ct-counter-number {
        display: flex;
        flex-wrap: nowrap;
        align-items: flex-start;
    }
    .ct-counter-number-prefix, .ct-counter-number-suffix {
        font-size: 20px;
        color: $primary_color;
        font-weight: 700;
        @include font-family-heading($heading_default_font);
        line-height: 1;
        margin: 0 4px;
        @media #{$max-md} {
            font-size: 18px;
        }
    }
    @media #{$min-lg} {
        .ct-counter-holder {
            min-width: 135px;
        }
    }
    .ct-counter-inner {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: center;
        &:hover .item--icon i {
            color: $primary_color;
            animation: icon-bounce 800ms ease-out infinite;
            -webkit-animation: icon-bounce 800ms ease-out infinite;
        }
    }
}

.ct-counter-layout2 {
    text-align: left;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    .ct-counter-number {
        font-size: 150px;
        color: #00144e;
        font-weight: 700;
        line-height: 1;
        @include font-family-heading($heading_default_font);
        display: inline-flex;
        align-items: flex-start;
        @media #{$max-xs} {
            font-size: 100px;
        }
    }
    .ct-counter-title {
        margin-top: 0px;
        margin-bottom: 0;
        font-size: 22px;
        font-family: inherit;
        color: inherit;
        font-weight: 400;
    }
    .ct-counter-number-suffix {
        font-size: 60px;
        color: $secondary_color;
        font-weight: 700;
        @include font-family-heading($heading_default_font);
        position: relative;
        top: -17px;
    }
}

.ct-counter.ct-counter-layout3 {
    max-width: 260px;
    background-color: #fff;
    @include border-radius(7px);
    @include box-shadow(0 8px 35px rgba(#000000, 0.06));
    .ct-counter-title {
        font-size: 16px;
        font-weight: 700;
        @include font-family-heading($heading_default_font);
        color: #000;
        padding: 14px 10px 16px;
        text-align: center;
    }
    .ct-counter-number {
        line-height: 1;
        font-weight: 700;
        @include font-family-heading($heading_default_font);
        font-size: 48px;
        color: #000;
        display: inline-flex;
        margin-left: 10px;
    }
    .item--icon {
        width: 73px;
        height: 73px;
        line-height: 73px;
        background-color: $primary_color;
        color: #fff;
        @include border-radius(7px 0 7px 0);
        text-align: center;
        i {
            font-size: 36px;
        }
    }
    .item--meta {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
    }
}

.ct-counter-landing .ct-counter-layout2 {
    .item--icon, .ct-counter-number-prefix {
        display: none;
    }
    .ct-counter-number {
        font-size: 72px;
        @extend .text-gradient;
        @include background-horizontal(#488bf9, $primary_color);
        line-height: 1;
        margin-right: 16px;
        display: initial;
        .ct-counter-number-suffix {
            font-size: inherit;
            top: 0;
            position: static;
            margin-left: -10px;
        }
    }
    .ct-counter-title {
        color: #fff;
        font-size: 24px;
        font-weight: 600;
        @include font-family-heading($heading_default_font);
        text-transform: uppercase;
        line-height: 1;
    }
    .ct-counter-inner {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
    }
}

.rm-align-center .ct-counter-layout1 .ct-counter-inner {
    justify-content: flex-start;
}

.ct-counter-layout5 {
    .item--icon {
        line-height: 1;
        font-size: 98px;
        color: $primary_color;
        margin-right: 26px;
        @media #{$max-lg} {
            font-size: 68px;
            margin-right: 20px;
        }
        i {
            display: flex;
        }
    }
    .ct-counter-title {
        font-size: 20px;
        font-weight: 600;
        color: #fff;
        margin-bottom: 0;
        @media #{$max-lg} {
            font-size: 18px;
        }
    }
    .ct-counter-number  {
        font-size: 52px;
        line-height: 1;
        font-weight: 600;
        color: #fff;
        @include font-family-heading($heading_default_font);
        margin-bottom: 17px;
        @media #{$max-lg} {
            font-size: 42px;
            margin-bottom: 10px;
        }
    }
    .ct-counter-number-suffix {
        font-size: 20px;
    }
    .ct-counter-inner {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
    }
}

// Start Client Grid
//--------------------------------------------------
.ct-client-grid1 {
    overflow: hidden;
    padding: 0 15px;
    .client-image {
        padding: 41px 20px;
        text-align: center;
        @media #{$max-sm} {
            padding: 30px 15px;
        }
        img {
            @include transition(all 300ms linear 0ms);
        }
        &:hover img {
            @include transform(scale(1.1));
        }
    }
    .client-item-inner {
        padding: 22px 22px 22px;
        background-color: $dark_color;
        @media #{$max-sm} {
            padding-left: 15px;
            padding-right: 15px;
        }
        .btn {
            line-height: 30px;
            padding: 0 10px;
            font-size: 13px;
            @include border-radius(3px);
            background-color: lighten($secondary_color_hex, 0.12);
            @include box-shadow(none !important);
            &:hover {
                background-color: $primary_color;
            }
        }
    }
    .client-desc {
        font-size: 15px;
        line-height: 20px;
        color: #c3c4e1;
        margin-bottom: 11px;
        @media #{$max-sm} {
            font-size: 13px;
            line-height: 22px;
        }
    }
    .ct-grid-inner {
        margin: 0 -2px -1px 0;
        .grid-item {
            padding: 0;
            border-right: 1px solid #d1d4dc;
            border-bottom: 1px solid #d1d4dc;
            display: flex;
            flex-wrap: wrap;
            align-items: center;
        }
    }
}
.elementor-widget-ct_client_grid {
    position: relative;
    overflow: hidden;
    > .elementor-widget-container {
        width: calc(100% + 1px);
    }
}

.ct-client1 {
    .client-image {
        text-align: center;
        a {
            display: inline-block;
            vertical-align: top;
            @include transition(all 0.3s cubic-bezier(0, 0, 0.2, 1) 0s);
        }
    }
    .slick-track {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
    }
    .ct-clients-list-inner {
        margin: 0 -15px;
        .slick-slide {
            padding: 0 15px;
        }
    }
    &.style1 {
        .client-image {
            text-align: center;
            padding: 0 15px;
            @media #{$max-sm} {
                padding: 0;
            }
            img {
                @include transition(all 0.3s cubic-bezier(0, 0, 0.2, 1) 0s);
                position: relative;
                &:nth-child(2) {
                    position: absolute;
                    top: 50%;
                    left: 50%;
                    @include transform(translate(-50%, -150%));
                    opacity: 0;
                }
            }
            a {
                display: inline-block;
                vertical-align: top;
                @include transition(all 0.3s cubic-bezier(0, 0, 0.2, 1) 0s);
                position: relative;
                overflow: hidden;
                -webkit-filter: grayscale(100%);
                filter: grayscale(100%);
                opacity: 0.8;
                &:hover {
                    opacity: 1;
                    -webkit-filter: grayscale(0%);
                    filter: grayscale(0%);
                    img {
                        &:nth-child(1) {
                            @include transform(translateY(100%));
                            opacity: 0;
                        }
                        &:nth-child(2) {
                            @include transform(translate(-50%, -50%));
                            opacity: 1;
                        }
                    }
                }
            }
        }
    }
    &.style2 {
        .client-image {
            text-align: center;
            padding: 0 15px;
            margin: 20px 0;
            @media #{$max-sm} {
                padding: 0;
            }
            img {
                @include transition(all 0.3s cubic-bezier(0, 0, 0.2, 1) 0s);
            }
            a {
                display: inline-block;
                vertical-align: top;
                &:hover {
                    img {
                        @include transform(scale(1.12));
                    }
                }
            }
        }
    }
}

// Start Services Grid
//--------------------------------------------------
.ct-service-grid1, .ct-service-carousel2 {
    overflow: hidden;
    .item--icon {
        height: 92px;
        width: 92px;
        position: relative;
        margin-bottom: 31px;
        z-index: 1;
        &:before, &:after {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            @include border-radius(92px);
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
        }
        &:before {
            background-color: #fff;
            z-index: -1;
            @include box-shadow(0 0 48px rgba(#0431b8, 0.22));
        }
        &:after {
            background-color: $secondary_color;
            z-index: -2;
            opacity: 0;
            bottom: -9px;
            top: auto;
        }
        i {
            font-size: 48px;
        }
        img {
            max-height: 48px;
            width: auto;
        }
        * {
            @include transition(.6s cubic-bezier(.24,.74,.58,1));
            position: absolute;
            top: 50%;
            left: 50%;
            @include transform(translate(-50%, -50%));
        }
    }
    .item--title {
        font-size: 22px;
        padding-bottom: 14px;
        position: relative;
        @media #{$max-md} {
            font-size: 18px;
        }
        &:before {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            width: 35px;
            height: 3px;
            background-color: $primary_color;
        }
        a {
            color: inherit;
        }
    }
    .item-readmore {
        margin-top: 24px;
        a {
            padding: 0 22px;
            line-height: 46px;
            &:hover {
                background-color: $primary_color;
            }
        }
    }
    .item--image {
        position: relative;
        > img {
            width: 100%;
        }
        svg {
            position: absolute;
            left: 0;
            right: 0;
            bottom: -1px;
            width: 100%;
            &.svg-white {
                fill: #fff;
                bottom: 0px;
            }
            &.svg-gray {
                fill: #dee5eb;
            }
            &:before {
                content: '';
                color: #fff;
            }
        }
        .item--icon {
            position: absolute;
            bottom: 38px;
            left: 0;
            right: 0;
            margin: auto;
            @include box-shadow(none);
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            opacity: 0;
            -webkit-transition-delay: 0.05s;
            -moz-transtion-delay: 0.05s;
            transition-deilay: 0.05s;
            &:after {
                opacity: 1;
            }
        }
    }
    .item--holder {
        padding: 0 40px;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        position: relative;
        margin-right: -6px;
        @media #{$max-lg} {
            padding-left: 30px;
            padding-right: 30px;
        }
        @media #{$max-md} {
            padding-left: 20px;
            padding-right: 15px;
        }
        &:before {
            content: '';
            position: absolute;
            top: 50%;
            width: 0;
            @include transform(translate(0, -50%));
            border-right: 2px dashed #d9d9d9;
            height: 65%;
            left: -5px;
            z-index: -1;
        }
    }
    .item--holder-hover {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 99;
        opacity: 0;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        .item--meta {
            padding: 25px 40px 40px;
            background-color: #dee5eb;
            @media #{$max-lg} {
                padding-left: 30px;
                padding-right: 30px;
            }
            @media #{$max-md} {
                padding-left: 20px;
                padding-right: 15px;
            }
        }
        .item--title, .item--content, .item-readmore {
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            @include transform(translateY(30px));
            opacity: 0;
        }
        .item--title {
            -webkit-transition-delay: 0.1s;
            -moz-transtion-delay: 0.1s;
            transition-deilay: 0.1s;
        }
        .item--content {
            -webkit-transition-delay: 0.15s;
            -moz-transtion-delay: 0.15s;
            transition-deilay: 0.15s;
        }
        .item--readmore {
            -webkit-transition-delay: 0.2s;
            -moz-transtion-delay: 0.2s;
            transition-deilay: 0.2s;
        }
    }
    .grid-item-inner {
        margin-top: 167px;
        position: relative;
        &:hover {
            .item--holder {
                opacity: 0;
            }
            .item--holder-hover {
                opacity: 1;
            }
            .item--image .item--icon {
                bottom: 8px;
                opacity: 1;
            }
            .item--title, .item--content, .item-readmore {
                @include transform(translateY(0px));
                opacity: 1;
            }
        }
    }
    @media #{$max-md} {
        .item--content {
            font-size: 14px;
            line-height: 25px;
        }
    }
    &.ct-grid {
        &.style1 {
            margin: 0;
            .grid-item {
                padding: 0;
            }
        }
        &.style2 .grid-item {
            .grid-item-inner {
                margin-bottom: 40px;
            }
        }
    }
    &.style2 {
        .item--holder {
            &:before {
                display: none;
            }
        }
        .grid-item-inner {
            background-color: #dee5eb;
            margin-top: 20px;
            padding: 60px 0;
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            &:hover {
                @include transform(translateY(-18px));
            }
        }
    }
}

.ct-service-carousel2 {
    overflow: visible;
    &:not(.style2) .ct-carousel-inner {
        margin: 0;
        .carousel-item {
            padding: 0;
            &:hover {
                z-index: 99;
            }
        }
    }
    .slick-slide {
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        opacity: 0;
        &.slick-active {
            opacity: 1;
        }
    }
    @media #{$min-xl} {
        .ct-slick-carousel.ct-slick-arrow-center .slick-arrow.slick-prev {
            left: -75px;
        }
        .ct-slick-carousel.ct-slick-arrow-center .slick-arrow.slick-next {
            right: -75px;
        }
        &.style2 {
            .ct-slick-carousel.ct-slick-arrow-center .slick-arrow.slick-prev {
                left: -65px;
            }
            .ct-slick-carousel.ct-slick-arrow-center .slick-arrow.slick-next {
                right: -65px;
            }
        }
    }
    @media #{$max-lg} {
        .ct-slick-carousel[data-arrows="true"] {
            padding-bottom: 105px;
        }
    }
}

// Start Tab Banner
//--------------------------------------------------
.ct-tabs {
    .ct-tab-content {
        display: none;
    }
}
.ct-tab-banner1 {
    .ct-tabs-title {
        margin-bottom: 33px;
        border-bottom: 1px solid #eaebec;
        display: flex;
        flex-wrap: nowrap;
        @media #{$max-sm} {
            flex-wrap: wrap;
        }
    }
    .ct-tab-title {
        font-weight: 600;
        font-size: 20px;
        color: rgba($dark_color_hex, 0.54);
        @include font-family-heading($heading_default_font);
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        width: 33.33%;
        text-align: center;
        position: relative;
        cursor: pointer;
        padding-bottom: 10px;
        padding-left: 20px;
        padding-right: 20px;
        @media #{$max-sm} {
            width: 100%;
            padding-top: 10px;
        }
        &:before {
            content: '';
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            width: 0;
            position: absolute;
            bottom: -1px;
            left: 0;
            background-color: $primary_color;
            height: 4px;
        }
        &.active, &:hover {
            color: $dark_color;
            &:before {
                width: 100%;
            }
        }
    }
    .ct-tab-content {
        background-color: #fff;
    }
    .ct-tab-box {
        display: flex;
        flex-wrap: wrap;
        @media #{$max-xs} {
            flex-direction: column-reverse;
        }
        > div {
            width: 50%;
            @media #{$max-xs} {
                width: 100%;
            }
        }
    }
    .ct-tab-box-holder {
        padding: 51px 30px 60px 40px;
        background-image: url(../images/bg-tab-section.png);
        background-color: #edf1f4;
        @media #{$max-md} {
            padding-left: 30px;
            padding-right: 30px;
        }
        @media #{$max-md} {
            padding-top: 40px;
            padding-bottom: 40px;
        }
    }
    .ct-tab-box-title {
        font-size: 29px;
        margin-bottom: 10px;
        line-height: 1.3333;
        font-weight: 700;
        @media #{$max-md} {
            font-size: 24px;
        }
    }
    .ct-tab-box-content {
        margin-bottom: 36px;
    }
    .ct-box-button .btn {
        @include border-radius(50px);
        padding: 0 26px;
    }
    @media #{$max-xs} {
        .ct-tab-image {
            height: 300px;
        }
    }
}

// Start Pie Chart
//-------------------------------------------------
.ct-title-line {
    font-size: 22px;
    margin-bottom: 10px;
    padding-bottom: 17px;
    position: relative;
    &:before {
        content: '';
        width: 28px;
        height: 3px;
        background-color: $primary_color;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
    }
}
.ct-piechart-layout1 {
    text-align: center;
    .ct-piechart-counter {
        position: absolute;
        z-index: 99;
        top: -14px;
        right: -14px;
        height: 33px;
        width: 33px;
        border: 3px solid $secondary_color;
        border-radius: 33px;
        background-color: $primary_color;
        color: #fff;
        font-size: 11px;
        line-height: 27px;
        font-weight: 700;
    }
    .item--value {
        position: relative;
        margin-bottom: 3px;
    }
    .item--icon {
        position: absolute;
        top: 50%;
        left: 50%;
        @include transform(translate(-50%, -50%));
        * {
            @include transition(.6s cubic-bezier(.24,.74,.58,1));
        }
        img {
            max-height: 58px;
            width: auto;
        }
        i {
            font-size: 48px;
            color: $primary_color;
        }
    }
    .item--desc {
        padding: 0 26px;
        @media #{$max-lg} {
            padding: 0;
        }
        @media #{$max-md} {
            font-size: 14px;
            line-height: 25px;
        }
    }
    .item--meta {
        display: inline-block;
        position: relative;
    }
    &:hover .item--icon * {
        animation: icon-bounce 800ms ease-out infinite;
        -webkit-animation: icon-bounce 800ms ease-out infinite;
    }
}

// Start Pricing
//-------------------------------------------------
.ct-pricing-layout1 {
    .ct-pricing-body {
        display: flex;
        flex-wrap: wrap;
        margin: 0 -15px;
        &.ct-pricing-hide {
            display: none;
        }
    }
    .ct-pricing-item {
        margin-bottom: 30px;
    }
    .pricing-1-column .ct-pricing-item {
        width: 100%;
        padding: 0 15px;
    }
    .pricing-2-column .ct-pricing-item {
        width: 50%;
        padding: 0 15px;
    }
    .pricing-3-column .ct-pricing-item {
        width: 33.33%;
        padding: 0 15px;
        @media #{$max-md} {
            width: 50%;
        }
        @media #{$max-xs} {
            width: 100%;
        }
    }
    .pricing-4-column .ct-pricing-item {
        width: 25%;
        padding: 0 15px;
        @media #{$max-md} {
            width: 50%;
        }
        @media #{$max-xs} {
            width: 100%;
        }
    }
    .pricing-5-column .ct-pricing-item {
        width: 20%;
        padding: 0 15px;
        @media #{$max-md} {
            width: 50%;
        }
        @media #{$max-xs} {
            width: 100%;
        }
    }
    &.style1 {
        .ct-pricing-tab-title {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: center;
            margin-bottom: 35px;
            .ct-pricing-tab-item {
                font-size: 18px;
                line-height: 28px;
                color: #1a1e66;
                @include font-family-heading($heading_default_font);
                margin: 0 8px;
                position: relative;
                display: flex;
                flex-wrap: wrap;
                align-items: center;
                cursor: pointer;
                padding-left: 29px;
                font-weight: 700;
                @media #{$max-xs} {
                    font-size: 16px;
                    padding-left: 24px;
                }
                &:before, &:after {
                    content: '';
                    position: absolute;
                    top: 50%;
                    @include transform(translate(0, -50%));
                    @include transition(all 300ms linear 0ms);
                }
                &:before {
                    left: 0;
                    width: 18px;
                    height: 18px;
                    @include border-radius(18px);
                    border: 2px solid #b8b5b5;
                }
                &:after {
                    width: 6px;
                    height: 6px;
                    opacity: 0;
                    @include border-radius(6px);
                    left: 6px;
                    background-color: $primary_color;
                }
                &.active {
                    color: #0e0e0e;
                    &:before {
                        border-color: $primary_color;
                    }
                    &:after {
                        opacity: 1;
                    }
                }
                cite {
                    font-size: 12px;
                    font-weight: 700;
                    color: #1a1e66;
                    padding: 0 14px;
                    background-color: #def8fc;
                    border-radius: 2px;
                    line-height: 27px;
                    font-style: normal;
                    display: inline-block;
                    margin-left: 10px;
                    @media #{$max-xs} {
                        padding: 0 8px;
                    }
                }
            }
        }
        .ct-pricing-features-list {
            list-style: none;
            li {
                display: flex;
                justify-content: center;
                align-items: center;
                i {
                    color: $primary_color;
                    font-size: 12px;
                    margin-right: 10px;
                }
                + li {
                    margin-top: 8px;
                }
            }
        }
        .item-popular {
            @include font-family-default($body_default_font);
            font-size: 14px;
            font-weight: 700;
            color: $fifth_color;
            min-height: 27px;
            margin-bottom: 5px;
        }
        .ct-pricing-title {
            font-size: 25px;
            margin: 0 0 6px;
            @media #{$max-lg} {
                font-size: 20px;
            }
        }
        .ct-pricing-subtitle {
            color: #666;
            margin-bottom: 14px;
        }
        .ct-pricing-price1 {
            font-size: 48px;
            line-height: 1;
            font-weight: 700;
            @include font-family-heading($heading_default_font);
            margin-bottom: 18px;
            color: $dark_color;
            @media #{$max-lg} {
                font-size: 36px;
            }
        }
        .ct-pricing-desc {
            font-size: 13px;
            line-height: 22px;
            @media #{$min-xl} {
                padding: 0 30px;
            }
        }
        .ct-pricing-price2 {
            font-size: 18px;
            font-weight: 700;
            margin-bottom: 19px;
        }
        .ct-pricing-button {
            .btn {
                line-height: 40px;
                padding: 0 28px;
                color: #fff;
                &:hover {
                    @include transform(translateY(-3px));
                    color: #fff;
                }
            }
        }
        .ct-pricing-icon {
            line-height: 1;
            margin-bottom: 27px;
            i {
                font-size: 60px;
                color: $primary_color;
            }
        }
        .ct-pricing-item-inner {
            background-color: #fff;
            padding: 34px 20px 40px;
            text-align: center;
            @include box-shadow(0 0px 32px rgba(#041445, 0.1));
            @media #{$max-lg} {
                padding-left: 15px;
                padding-right: 15px;
            }
            &.ct-pricing-featured {
                background-color: #15287d;
                @include box-shadow(none);
                .ct-pricing-title, .ct-pricing-price1, .ct-pricing-price2 {
                    color: #fff;
                }
                .ct-pricing-subtitle, .ct-pricing-desc {
                    color: #faf7f0;
                }
                .ct-pricing-button .btn {
                    background-color: $primary_color;
                    color: #fff;
                }
                .ct-pricing-features-list {
                    color: #fff;
                }
            }
        }
    }
    &.style2 {
        .ct-pricing-tab-title-wrap {
            display: flex;
            justify-content: flex-end;
            margin-bottom: 100px;
            @media #{$max-sm} {
                justify-content: flex-start;
                margin-bottom: 60px;
            }
        }
        @media #{$min-xl} {
            .ct-pricing-tab-content {
                padding: 0 55px;
            }
        }
        .ct-pricing-tab-title {
            display: inline-flex;
            background-color: $secondary_color;
            padding: 7px;
            border-radius: 58px;
            .ct-pricing-tab-item {
                cursor: pointer;
                line-height: 44px;
                font-size: 15px;
                font-weight: 600;
                @include font-family-heading($heading_default_font);
                color: #fff;
                padding: 0 18px;
                @include border-radius(43px);
                @include transition(.3s cubic-bezier(.24,.74,.58,1));
                &.active {
                    background-color: $primary_color;
                }
            }
        }
        .ct-pricing-price1 {
            background-color: #5675e8;
            position: absolute;
            top: -16px;
            right: 24px;
            font-size: 40px;
            font-weight: 700;
            color: #fff;
            width: 130px;
            height: 80px;
            line-height: 1;
            @include font-family-heading($heading_default_font);
            text-align: center;
            padding-top: 26px;
            z-index: 1;
            &:before {
                content: '';
                z-index: -1;
                position: absolute;
                top: 0%;
                left: -16px;
                border-width: 8px;
                border-style: solid;
                border-color: transparent #0e2270 #0e2270 transparent;
            }
            &:after {
                content: '';
                z-index: -1;
                position: absolute;
                top: 100%;
                left: 0;
                right: 0;
                border-width: 65px;
                border-style: solid;
                border-color: #5675e8 transparent transparent;
            }
            span {
                font-size: 20px;
                font-weight: 500;
                display: block;
                color: #c7cee7;
                margin-top: 4px;
            }
        }
        .ct-pricing-icon {
            position: absolute;
            left: 26px;
            top: 34px;
            i {
                font-size: 42px;
                color: $primary_color;
            }
        }
        .ct-pricing-title {
            font-size: 38px;
            font-weight: 600;
            color: #000;
            margin-bottom: 32px;
            @media #{$max-sm} {
                font-size: 32px;
            }
        }
        .ct-pricing-features-list {
            font-size: 18px;
            line-height: 28px;
            color: #000;
            margin: 0 0 30px;
            list-style: none;
            font-family: 'Roboto', sans-serif;
            i {
                margin-right: 14px;
                color: $primary_color;
                position: absolute;
                top: 0;
                left: 0;
            }
            li {
                padding-left: 35px;
                position: relative;
                + li {
                    margin-top: 24px;
                }
            }
        }
        .ct-pricing-button {
            text-align: center;
            a {
                text-align: center;
                font-size: 15px;
                font-weight: 700;
                @include font-family-heading($heading_default_font);
                color: #000000;
                display: inline-flex;
                align-items: center;
                i {
                    font-size: 12px;
                    margin-left: 6px;
                    @include transition(.3s cubic-bezier(.24,.74,.58,1));
                }
                &:hover, &:focus {
                    color: $secondary_color;
                    i {
                        @include transform(translateX(6px));
                    }
                }
            }
        }
        .ct-pricing-item-inner  {
            padding: 92px 24px 30px;
            background-color: #f6f8fa;
            @include border-radius(12px);
            position: relative;
            @media #{$max-sm} {
                padding-top: 142px;
            }
            &.ct-pricing-featured {
                margin-top: -28px;
                @media #{$max-sm} {
                    margin-top: 0;
                }
                .ct-pricing-price1 {
                    background-color: $primary_color;
                    &:before {
                        border-color: transparent darken($primary_color_hex, 0.2) darken($primary_color_hex, 0.2) transparent;
                    }
                    &:after {
                        border-color: $primary_color transparent transparent;
                    }
                }
            }
        }
    }
}

// Start Download
//-------------------------------------------------
.ct-download {
    a {
        font-size: 16px;
        font-weight: 600;
        @include font-family-heading($heading_default_font);
        background-color: #fff;
        padding: 10px 18px 10px 22px;
        color: $dark_color;
        display: block;
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        span {
            flex-grow: 1;
        }
        i {
            font-size: 22px;
            margin-left: 20px;
            @include transition(all 240ms linear 0ms);
        }
        &:hover {
            background-color: $primary_color;
            color: #fff;
        }
    }
    .item--download + .item--download {
        margin-top: 25px;
    }
}


// Start Cccordion
//-------------------------------------------------
.ct-accordion {
    .ct-ac-content {
        display: none;
    }
    &.layout1.style1 {
        .ct-ac-title {
            font-size: 18px;
            color: $dark_color;
            @include transition(all 300ms linear 0ms);
            font-weight: 700;
            position: relative;
            cursor: pointer;
            @include font-family-heading($heading_default_font);
            a {
                padding: 25px 65px 23px 25px;
                display: block;
                color: inherit;
                &:before {
                    content: '\f107';
                    font-family: 'Font Awesome 5 Pro';
                    font-size: 16px;
                    position: absolute;
                    top: 50%;
                    @include transform(translate(0, -50%));
                    right: 35px;
                    color: #9ba2aa;
                    @include transition(all 300ms linear 0ms);
                }
                &:after {
                    content: '\f136';
                    font-family: 'Material-Design-Iconic-Font';
                    top: 50%;
                    @include transform(translate(0, -50%));
                    right: 30px;
                    height: 21px;
                    width: 21px;
                    line-height: 21px;
                    background-color: #cacfdf;
                    color: #fff;
                    text-align: center;
                    position: absolute;
                    @include border-radius(21px);
                    font-size: 12px;
                    @include transition(all 300ms linear 0ms);
                    opacity: 0;
                }
            }
        }
        .ct-ac-content {
            padding: 0 65px 23px 25px;
        }
        .ct-accordion-item {
            border: 1px solid #e6e6e6;
            @include transition(all 300ms linear 0ms);
            @include border-radius(0px);
            background-color: #fff;
            position: relative;
            &:before {
                content: '';
                height: 0;
                width: 6px;
                position: absolute;
                top: -1px;
                bottom: -1px;
                left: -1px;
                margin: auto;
                background-color: $four_color;
                @include transition(all 300ms linear 0ms);
                opacity: 0;
            }
            + .ct-accordion-item {
                margin-top: 19px;
            }
            &.active {
                border-color: #fff;
                @include box-shadow(0 0 25px rgba(#000000, 0.15));
                &:before {
                    height: 100%;
                    opacity: 1;
                }
                .ct-ac-title a {
                    padding-bottom: 4px;
                    &:before {
                        opacity: 0;
                    }
                    &:after {
                        opacity: 1;
                    }
                }
            }
        }
    }
}

// Start Team Grid
//-------------------------------------------------
.ct-team-grid1, .ct-team-carousel1 {
    .item--image {
        position: relative;
        svg {
            position: absolute;
            fill: #fff;
            bottom: 0;
            left: 0;
            right: 0;
            z-index: 99;
            &.svg-line {
                bottom: 10px;
                fill: $primary_color;
            }
        }
    }
    .item--title {
        font-size: 22px;
        margin-bottom: 3px;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        @media #{$max-lg} {
            font-size: 18px;
        }
    }
    .item--position {
        font-size: 14px;
    }
    .item--holder {
        padding: 0 20px 23px 20px;
        @media #{$max-lg} {
            padding-left: 15px;
            padding-right: 15px;
        }
    }
    .item--social-btn {
        font-size: 22px;
        width: 48px;
        height: 48px;
        background-color: $secondary_color;
        line-height: 48px;
        text-align: center;
        display: inline-block;
        border-radius: 0 0 48px 48px;
        color: #fff;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
    }
    .item--social-link {
        position: absolute;
        bottom: 68px;
        right: 0;
        width: 48px;
        padding-top: 26px;
        padding-bottom: 13px;
        background-color: $secondary_color;
        border-radius: 48px 48px 0 0;
        z-index: 100;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        opacity: 0;
        a {
            display: block;
            width: 48px;
            height: 34px;
            text-align: center;
            color: #fff;
            font-size: 16px;
            &:hover {
                @include transform(translateX(4px));
            }
        }
    }
    .item--social {
        margin-left: 20px;
        height: 48px;
        position: relative;
    }
    .item--holder {
        display: flex;
        flex-wrap: nowrap;
    }
    .item--meta {
        flex-grow: 1;
    }
    .item--inner {
        background-color: #fff;
        margin-bottom: 55px;
        @include box-shadow(0 22px 18px rgba(#041445, 0.06));
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        &:hover {
            @include box-shadow(0 22px 32px rgba(#041445, 0.15));
            @include transform(translateY(-10px));
            .item--social-btn {
                color: $primary_color;
                background-color: transparent;
            }
            .item--social-link {
                bottom: 48px;
                opacity: 1;
            }
            .item--title {
                color: $primary_color;
            }
        }
    }
    .slick-dots {
        margin-top: -10px;
    }
}

.ct-team-carousel2 {
    text-align: center;
    .item--image {
        position: relative;
        img {
            width: 100%;
        }
    }
    .item--meta {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        padding: 20px;
        background-color: rgba(#00092a, 0.9);
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        font-size: 15px;
        line-height: 26px;
        color: #ffffff;
        font-family: 'Roboto', sans-serif;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        opacity: 0;
        .item--meta-inner {
            width: 100%;
        }
    }
    .item--desc {
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        transform: translateY(30px);
    }
    .item--readmore {
        margin-top: 23px;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        transform: translateY(30px);
        .btn {
            border-radius: 39px;
            line-height: 39px;
            background-color: $primary_color;
        }
    }
    .item--title {
        font-size: 18px;
        margin-bottom: 0px;
        color: #000;
    }
    .item--position {
        font-size: 15px;
        color: #666;
        font-family: 'Roboto', sans-serif;
    }
    .item--holder {
        border: 2px solid #eeeeee;
        padding: 18px 20px 35px 20px;
        background-color: #fff;
        position: relative;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
    }
    .item--social {
        position: absolute;
        bottom: -21px;
        left: 0;
        right: 0;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        a {
            width: 38px;
            height: 41px;
            border: 2px solid #eee;
            font-size: 14px;
            color: #b7b7b7;
            line-height: 37px;
            background-color: #fff;
            + a {
                margin-left: -2px;
            }
            &:hover, &:focus {
                border-color: $secondary_color;
                background-color: $secondary_color;
                color: #fff;
                position: relative;
                z-index: 9;
            }
        }
    }
    .item--image + .item--holder {
        border-top: none;
    }
    .item--inner {
        margin-bottom: 31px;
        &:hover {
            .item--meta {
                opacity: 1;
            }
            .item--desc, .item--readmore {
                transform: translateY(0px);
            }
            .item--holder {
                border-color: $secondary_color;
            }
        }
    }
}

// Start Testimonial Grid
//-------------------------------------------------
.ct-testimonial-grid1, .ct-testimonial-carousel2 {
    .item--title {
        margin-bottom: 2px;
        font-size: 22px;
    }
    .item--description {
        margin-bottom: 17px;
    }
    .item--image {
        margin-right: 30px;
        position: relative;
        z-index: 1;
        @media #{$max-sm} {
            margin-right: 20px;
        }
        &:before, &:after {
            content: '';
            position: absolute;
            @include border-radius(100%);
        }
        &:before {
            height: 88px;
            width: 88px;
            @include background-gradient-bottom($primary_color, #fff);
            top: -9px;
            left: -9px;
            z-index: -2;
        }
        &:after {
            height: 82px;
            width: 82px;
            background-color: #fff;
            top: -6px;
            left: -6px;
            z-index: -1;
        }
        img {
            @include border-radius(69px);
        }
    }
    .item--holder {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
    }
    .item--inner {
        background-color: #fff;
        @include border-radius(8px);
        @include box-shadow(0 2px 25px rgba(#051c31, 0.07));
        margin-bottom: 47px;
        padding: 37px 30px 40px 33px;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        border-top: 6px solid #fff;
        @media #{$max-sm} {
            padding-left: 30px;
            padding-right: 20px;
        }
        &:hover {
            border-color: $secondary_color;
            @include transform(translateY(-28px));
            @include box-shadow(0 25px 25px rgba(#051c31, 0.14));
        }
    }
}

.ct-testimonial-carousel2 {
    .item-rating {
        font-size: 14px;
        color: #ffc601;
        margin-right: 10px;
        margin-bottom: 12px;
    }
    .item--inner {
        margin-top: 30px;
    }
    .slick-dots {
        position: relative;
        top: -5px;
    }
}

.dot-style-light {
    .slick-dots li {
        button {
            background-color: #fff;
        }
        &.slick-active button {
            background-color: $primary_color;
        }
    }
}

.ct-testimonial-carousel3 {
    .item--image {
        margin-right: 22px;
        img {
            @include border-radius(75px);
        }
    }
    .item--description {
        font-size: 15px;
        line-height: 26px;
        margin-bottom: 24px;
    }
    .item--title {
        font-size: 17px;
        margin-bottom: 01px;
        color: $primary_color;
    }
    .item--position {
        font-size: 14px;
        font-weight: 500;
        margin-bottom: 5px;
    }
    .item-rating {
        font-size: 14px;
        color: #ffc601;
    }
    .item--holder {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
    }
    .item--inner {
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        background-color: #fff;
        @include border-radius(4px);
        border: 1px solid #eaebf0;
        padding: 30px 32px 38px;
        margin-top: 30px;
        margin-bottom: 50px;
        &:hover {
            @include transform(translate(0, -15px));
            @include box-shadow(0 27px 32px rgba(#0c0c0c, 0.16));
        }
    }
    .ct-slick-carousel {
        margin: 0 -30px 0 -30px;
        padding-left: 30px;
        padding-right: 30px;
        overflow: hidden;
        .slick-list {
            overflow: visible;
        }
    }
    .slick-slide {
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        opacity: 0;
        &.slick-active {
            opacity: 1;
        }
    }
    .slick-dots {
        margin-top: 0;
        li {
            button {
                background-color: #d4d4d4;
                &:before {
                    border-color: $primary_color;
                }
            }
            &.slick-active button {
                background-color: $primary_color;
            }
        }
    }
}

.ct-testimonial-carousel4 {
    .sub-title {
        font-size: 18px;
        font-weight: 500;
        font-family: inherit;
        color: $primary_color;
        margin-bottom: 14px;
    }
    .item--title {
        margin-bottom: 2px;
        font-size: 14px;
        font-weight: 500;
        font-family: inherit;
        color: #000;
    }
    .item--position {
        font-size: 14px;
        color: #888888;
    }
    .item--description {
        font-size: 15px;
        line-height: 25px;
        color: #666;
        margin-bottom: 18px;
    }
    .item--image {
        width: 64px;
        min-width: 64px;
        padding: 5px;
        border: 2px solid $primary_color;
        margin-right: 13px;
        @include border-radius(64px);
        img {
            @include border-radius(51px);
        }
    }
    .item--holder {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
    }
    .item--icon {
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        font-size: 82px;
        line-height: 1;
        color: #efefef;
        font-weight: 700;
        font-family: 'Playfair Display';
        position: absolute;
        top: -29px;
        right: 10px;
        @include transform(rotate(180deg));
    }
    .item--inner {
        padding: 40px 20px 27px 26px;
        background-color: #fff;
        @include border-radius(8px);
        @include box-shadow(0 12px 35px rgba(#0c0c0c, 0.06));
        margin-top: 30px;
        margin-bottom: 50px;
        position: relative;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        &:hover {
            @include transform(translateY(-20px));
            @include box-shadow(0 20px 30px rgba(#0c0c0c, 0.2));
            .item--icon {
                color: $fifth_color;
            }
        }
    }
    &.dots-slider .slick-dots {
        margin-top: -10px;
        background-color: #fff;
        @include box-shadow(0 9px 21px rgba(#0c0c0c, 0.05));
    }
    .ct-slick-carousel {
        margin: 0 -30px 0 -30px;
        padding-left: 30px;
        padding-right: 30px;
        overflow: hidden;
        .slick-list {
            overflow: visible;
        }
    }
    .slick-slide {
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        opacity: 0;
        &.slick-active {
            opacity: 1;
        }
    }
}

// Start Banner
//-------------------------------------------------
.ct-banner1 {
    &.style1 {
        text-align: center;
        .ct-banner-inner {
            display: inline-block;
            position: relative;
            margin: auto;
        }
        .ct-banner-holder {
            min-height: 105px;
            position: absolute;
            z-index: 1;
            top: -22px;
            right: -45px;
            text-align: center;
            display: flex;
            flex-wrap: nowrap;
            align-items: center;
            @media #{$max-lg} {
                right: 0;
            }
            svg {
                height: 110px;
                position: absolute;
                bottom: 0;
                left: 0;
                z-index: -1;
                &.svg-primary {
                    fill: $primary_color;
                    bottom: -6px;
                    left: -4px;
                }
                &.svg-secondary {
                    fill: $secondary_color;
                }
            }
        }
        .ct-banner-meta {
            max-width: 120px;
            .ct-banner-number {
                font-size: 36px;
                font-weight: 700;
                color: #fff;
                @include font-family-heading($heading_default_font);
                line-height: 1;
                margin-bottom: 2px;
            }
            .ct-banner-title {
                margin-bottom: 8px;
                font-size: 13px;
                font-family: inherit;
                color: #fff;
                font-weight: normal;
                line-height: 17px;
            }
        }
        &.ps-left .ct-banner-holder {
            left: 42px;
            right: auto;
            top: -12px;
        }
    }
    &.style2 {
        position: relative;
        .ct-banner-holder {
            background-color: $primary_color;
            padding: 24px 23px 20px;
            position: absolute;
            top: 38px;
            right: 0;
            max-width: 232px;
            @include border-radius(6px);
            display: flex;
            flex-wrap: nowrap;
            @include box-shadow(0 12px 32px rgba(#0c0c0c, 0.19));
            @media #{$max-md} {
                display: block;
            }
        }
        .item--icon {
            width: 62px;
            min-width: 62px;
            height: 62px;
            background-color: #fff;
            border-radius: 62px;
            position: relative;
            margin-right: 12px;
            @media #{$max-md} {
                margin-right: 0;
                margin-bottom: 12px;
            }
            i {
                font-size: 32px;
                color: $primary_color;
            }
            img {
                max-height: 40px;
                width: auto;
            }
            svg {
                height: 32px;
            }
        }
        .ct-banner-title {
            margin-bottom: 0;
            font-size: 18px;
            line-height: 24px;
            font-weight: 400;
            font-family: inherit;
            color: #fff;
            @media #{$max-md} {
                font-size: 16px;
            }
        }
        .ct-banner-number {
            font-size: 36px;
            font-weight: 700;
            @include font-family-heading($heading_default_font);
            color: #fff;
            line-height: 1;
            margin-bottom: 4px;
        }
        .ct-banner-inner {
            padding-right: 78px;
            @media #{$max-md} {
                padding-right: 40px;
            }
            > img {
                width: 100%;
                @include border-radius(9px);
            }
        }
    }
    &.style3 {
        .ct-banner-image1 {
            border: 15px solid #fff;
        }
        .ct-banner-image2 {
            z-index: -1;
            position: absolute;
            bottom: 0;
            right: 0;
            @media #{$max-lg} {
                max-width: 65%;
            }
        }
        .ct-banner-holder {
            position: absolute;
            top: -16px;
            left: -65px;
            background-color: #000;
            @include border-radius(150px);
            width: 150px;
            height: 150px;
            border: 15px solid #fff;
            display: flex;
            flex-wrap: nowrap;
            align-items: center;
            justify-content: center;
            text-align: center;
            @media #{$max-sm} {
                top: -15px;
                left: -15px;
            }
            .ct-banner-title {
                margin-bottom: 0;
                font-family: inherit;
                font-size: 16px;
                color: $fifth_color;
            }
            .ct-banner-number {
                font-size: 36px;
                font-weight: 700;
                @include font-family-heading($heading_default_font);
                color: #fff;
                line-height: 1;
                margin-bottom: 2px;
            }
        }
        .ct-banner-inner {
            position: relative;
            padding-bottom: 70px;
            padding-right: 80px;
            z-index: 1;
            @media #{$max-lg} {
                padding-bottom: 30px;
                padding-right: 30px;
            }
        }
    }
    &.style4 {
        img {
            width: 100%;
            @include border-radius(8px);
            position: relative;
            z-index: -2;
        }
        .ct-banner-holder {
            width: 100%;
            max-width: 180px;
            position: absolute;
            top: 43px;
            right: 0px;
            background-color: #fff;
            padding: 20px 0 20px 30px;
            @media #{$max-lg} {
                padding-left: 20px;
            }
            &:before {
                content: '';
                position: absolute;
                top: -8px;
                left: -8px;
                width: 100%;
                height: 100%;
                background-color: $primary_color;
                z-index: -1;
            }
        }
        .ct-banner-number {
            @include font-family-heading($heading_default_font);
            font-size: 90px;
            line-height: 1;
            font-weight: 700;
            color: $secondary_color;
            display: flex;
            flex-wrap: nowrap;
            align-items: flex-start;
            @media #{$max-lg} {
                font-size: 70px;
            }
        }
        .ct-counter-number-suffix {
            font-size: 34px;
            font-weight: normal;
            color: $primary_color;
            margin-top: 4px;
        }
        .ct-banner-title {
            margin: 0;
            font-size: 18px;
            color: #000;
            font-family: 'Roboto', sans-serif;
        }
    }
}

// Start Video
//-------------------------------------------------
.ct-video-button {
    display: flex;
    position: relative;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    &.img-active {
        position: absolute;
        top: 50%;
        left: 50%;
        @include transform(translate(-50%, -50%));
    }
    &.style1 {
        height: 44px;
        width: 44px;
        background-color: rgba(#051b5d, 0.78);
        @include border-radius(100%);
        color: #fff;
        text-align: center;
        line-height: 44px;
        @include box-shadow(0 0 0 3px rgba(#fff, 0.78));
        font-size: 15px;
        &:hover {
            background-color: rgba($primary_color_hex, 0.78);
        }
    }
    &.style2 {
        width: 80px;
        height: 80px;
        line-height: 80px;
        text-align: center;
        background-color: rgba(#fff, 1);
        font-size: 18px;
        color: $dark_color;
        @include border-radius(100%);
        z-index: 1;
        &:before {
            content: "";
            position: absolute;
            z-index: 0;
            left: 0;
            top: 0;
            display: block;
            width: 100%;
            height: 100%;
            background-color: rgba(#fff, 0.63);
            border-radius: 50%;
            animation: pulse-border2 1500ms ease-out infinite;
            -webkit-animation: pulse-border2 1500ms ease-out infinite;
            z-index: -2;
        }
        &:hover, &:focus {
            &:before {
                -webkit-animation-play-state: paused;
                -moz-animation-play-state: paused;
                -o-animation-play-state: paused;
                animation-play-state: paused;
            }
        }
    }
    &.style3 {
        width: 60px;
        height: 60px;
        line-height: 60px;
        text-align: center;
        background-color: rgba(#001c8f, 1);
        font-size: 17px;
        color: #fff;
        @include border-radius(100%);
        z-index: 1;
        &:before {
            content: "";
            position: absolute;
            z-index: 0;
            left: 0;
            top: 0;
            display: block;
            width: 100%;
            height: 100%;
            background-color: rgba(#001c8f, 0.6);
            border-radius: 50%;
            animation: pulse-border2 1500ms ease-out infinite;
            -webkit-animation: pulse-border2 1500ms ease-out infinite;
            z-index: -2;
        }
        &:hover, &:focus {
            &:before {
                -webkit-animation-play-state: paused;
                -moz-animation-play-state: paused;
                -o-animation-play-state: paused;
                animation-play-state: paused;
            }
        }
    }
    &.style4 {
        width: 56px;
        height: 56px;
        line-height: 56px;
        text-align: center;
        font-size: 16px;
        color: #fff;
        @include border-radius(100%);
        z-index: 1;
        background-color: $primary_color;
        i {
            position: absolute;
            top: 50%;
            left: 50%;
            @include transform(translate(-50%, -50%));
        }
        &:before, &:after {
            content: '';
            @include border-radius(100%);
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: -1;
        }
        &:before {
            background: inherit;
        }
        &:after {
            z-index: -2;
            background-color: #fff;
            transform: scale(1.34);
            @include box-shadow(0 4px 50px rgba(#999999, 0.25));
        }
    }
    &.slider-style1 {
        height: 50px;
        width: 50px;
        @include border-radius(50px);
        background-color: #fff;
        display: inline-block;
        color: $dark_color;
        text-align: center;
        font-size: 15px;
        position: relative;
        @include box-shadow(0 0 0 20px rgba(#fff, 0.24));
        * {
            position: absolute;
            top: 50%;
            left: 50%;
            @include transform(translate(-50%, -50%));
        }
        &:hover {
            background-color: $primary_color;
            color: #fff;
            @include box-shadow(none);
        }
    }
}
.ct-video-player {
    .ct-video-box {
        position: relative;
    }
    .ct-video-holder {
        position: relative;
        overflow: hidden;
        @include border-radius(4px);
        &:before {
            content: '';
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            background-color: rgba(#082680, 0.1);
            position: absolute;
        }
    }
    &.meta-active {
        display: flex;
        flex-wrap: nowrap;
        align-items: flex-start;
        @media #{$max-xs} {
            display: block;
        }
        .ct-video-box {
            width: 150px;
            min-width: 150px;
            margin-right: 24px;
            @media #{$max-xs} {
                margin-right: 0;
                width: 100%;
                margin-bottom: 24px;
            }
        }
    }
    .ct-video-meta {
        h4 {
            margin-top: 13px;
            margin-bottom: 7px;
            font-size: 16px;
            @media #{$max-lg} {
                margin-top: 0;
            }
        }
        p {
            margin-bottom: 0;
            font-size: 15px;
            line-height: 24px;
            @media #{$max-lg} {
                font-size: 14px;
            }
        }
        .btn {
            margin-top: 11px;
            line-height: 46px;
            padding: 0 24px;
        }
    }
    &.btn-video-style3 {
        .ct-video-button {
            left: 7px;
            bottom: 20%;
            top: auto;
            @include transform(translate(0,0));
        }
        .ct-video-holder {
            &:before {
                display: none;
            }
            img {
                border-radius: 530px;
            }
        }
    }
}

// Start History
//-------------------------------------------------
.ct-history-carousel1 {
    .item--title {
        font-size: 30px;
        line-height: 1.3333;
        margin-bottom: 19px;
        font-weight: 600;
        padding: 0 10%;
        @media #{$max-sm} {
            padding: 0;
            font-size: 24px;
        }
    }
    .item--holder {
        max-width: 645px;
        margin: auto;
        text-align: center;
    }
    .item--year {
        font-size: 20px;
        color: #8f9ec9;
        font-weight: 700;
        padding-bottom: 31px;
        text-align: center;
        position: relative;
        cursor: pointer;
        &:before {
            content: '';
            width: 19px;
            height: 19px;
            border: 3px solid #8f9ec9;
            background-color: #8f9ec9;
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            margin: auto;
            @include border-radius(18px);
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
        }
        &:hover:before {
            background-color: $primary_color;
            border-color: $secondary_color;
        }
    }
    .ct-slick-nav {
        padding: 0 16px;
        .slick-list {
            z-index: 1;
            &:before {
                content: '';
                position: absolute;
                bottom: 9px;
                left: 0;
                right: 0;
                height: 1px;
                background-color: #dfe3ef;
            }
        }
        .slick-slide.slick-current .item--year {
            color: $secondary_color;
            &:before {
                background-color: $primary_color;
                border-color: $secondary_color;
            }
        }
        .slick-arrow {
            height: 30px;
            width: 30px;
            line-height: 30px;
            text-align: center;
            color: $secondary_color;
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            font-size: 18px;
            cursor: pointer;
            position: absolute;
            bottom: -6px;
            &.slick-prev {
                left: 0px;
            }
            &.slick-next {
                right: 0px;
            }
        }
    }
    .ct-slick-primary {
        padding-top: 65px;
    }
}

// Start Image Before After
//-------------------------------------------------
.ct-image-before-after1 {
    img {
        width: 100%;
    }
}
@media #{$min-md} {
    .ct-column-width-auto .elementor-element.elementor-widget {
        width: auto !important;
    }
}
.ct-image-before-after2 {
    display: inline-block;
    position: relative;
    z-index: 1;
    @media #{$max-sm} {
        margin-left: 28px;
    }
    &:before {
        content: '';
        z-index: -1;
        position: absolute;
        bottom: -3px;
        left: -5px;
        width: 100%;
        height: 100%;
        @include border-radius(284px);
        background-color: #fff;
    }
    &:after {
        content: '';
        z-index: -2;
        position: absolute;
        bottom: 0px;
        width: 100%;
        height: 100%;
        @include border-radius(284px);
        background-color: lighten($dark_color_hex, 0.04);
        @include transform(scale(1.11));
        left: -17px;
    }
    .twentytwenty-before-label, .twentytwenty-after-label {
        display: none;
    }
    .twentytwenty-wrapper {
        height: 284px;
        width: 284px;
        @include border-radius(284px);
        overflow: hidden;
        .twentytwenty-container {
            @include border-radius(284px);
            overflow: hidden;
        }
        @media #{$max-sm} {
            height: 264px;
            width: 264px;
            @include border-radius(264px);
            .twentytwenty-container {
                @include border-radius(264px);
            }
        }
    }
    .twentytwenty-horizontal .twentytwenty-handle {
        margin-left: -12px;
        margin-top: -12px;
        width: 24px;
        height: 24px;
        border: none;
        background-color: #fff;
        &:before {
            margin-bottom: 10px;
            @include box-shadow(none);
        }
        &:after {
            margin-top: 10px;
            @include box-shadow(none);
        }
        .twentytwenty-left-arrow {
            margin-left: -14px;
            &:before {
                content: '\f104';
                font-family: "Font Awesome 5 Pro";
                color: $dark_color;
                position: absolute;
                top: 50%;
                left: 0;
                @include transform(translate(0, -50%));
                font-weight: 14px;
            }
        }
        .twentytwenty-right-arrow {
            margin-right: -14px;
            &:before {
                content: '\f105';
                font-family: "Font Awesome 5 Pro";
                color: $dark_color;
                right: 0;
                @include transform(translate(0, -50%));
                position: absolute;
                font-weight: 14px;
            }
        }
    }
    .item--holder {
        position: absolute;
        width: 94px;
        height: 94px;
        background-color: $secondary_color;
        border-radius: 94px;
        top: -78px;
        right: 20px;
        z-index: 99;
        color: #ffffff;
        text-align: center;
        display: flex;
        align-items: center;
        justify-content: center;
        &:before {
            content: '';
            position: absolute;
            bottom: -2px;
            left: 9px;
            border-width: 10px;
            border-style: solid;
            border-color: transparent $secondary_color $secondary_color transparent;
            transform: rotate(-28deg);
            z-index: -1;
        }
        .item--icon {
            line-height: 1;
            margin-bottom: 2px;
            i {
                font-size: 29px;
                color: $primary_color;
            }
        }
        .item--title {
            font-size: 12px;
            line-height: 1;
            margin-bottom: 4px;
        }
        .item--year {
            line-height: 1;
            font-size: 19px;
            font-weight: 700;
            @include font-family-heading($heading_default_font);
        }
        .item--meta {
            margin-top: -2px;
        }
    }
}

// Start Testimonial Carousel
//-------------------------------------------------
.ct-hexagon {
  width: 100px;
  height: 55px;
  position: relative;
}

.ct-hexagon, 
.ct-hexagon:before {
    background: #fff;
    z-index: -2; 
}
.ct-hexagon:before {
    content: "";
    position: absolute;
    right: 23px;
    width: 65px;
    height: 65px;
    transform: rotate(152deg) skew(22.5deg);
    top: -39px;
}
.ct-hexagon span {
    position: absolute;
    top: 0;
    right: 0;
    width: 180px;
    height: 55px;
    background: #fff;
    z-index: 1;
}
.ct-testimonial-carousel1 {
    .item--content {
        position: relative;
        padding: 45px 20px 36px 26px;
        z-index: 1;
        @media #{$max-lg} {
            padding-left: 20px;
        }
        &:before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            background-color: #fff;
            z-index: -1;
            right: 54px;
        }
        &:after {
            content: '';
            position: absolute;
            width: 85px;
            top: 48px;
            right: 0;
            bottom: 0;
            background-color: #fff;
            z-index: -1;
        }
    }
    .ct-hexagon {
        position: absolute;
        top: 44px;
        right: 0;
    }
    .item-icon {
        font-family: 'Playfair Display';
        font-weight: 700;
        font-size: 144px;
        line-height: 0;
        color: #adb0b4;
        position: absolute;
        top: -27px;
        left: 24px;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        @include transform(rotate(180deg));
        i {
            font-style: normal;
        }
    }
    .item--description {
        font-size: 16px;
        line-height: 25px;
        margin-bottom: 20px;
    }
    .item-rating {
        font-size: 14px;
        text-align: right;
        color: #ffc601;
        margin-right: 10px;
    }
    .item--holder {
        padding: 0 33px;
        display: flex;
        flex-wrap: nowrap;
        z-index: 100;
        position: relative;
        @media #{$max-lg} {
            padding-left: 20px;
            padding-right: 15px;
        }
        .item--image {
            position: relative;
            z-index: 1;
        }
        .item--image-inner {
            margin-right: 15px;
            @include border-radius(90px);
            border: 5px solid #fff;
            width: 100px;
            min-width: 100px;
            position: relative;
            top: -52px;
            img {
                width: 100%;
                @include border-radius(90px);
            }
        }
        .item--title {
            margin-top: 12px;
            margin-bottom: 2px;
            font-size: 20px;
            color: #3a4268;
        }
        .item--position {
            font-size: 14px;
        }
        .item--svg {
            position: absolute;
            top: 50%;
            left: 6px;
            @include transform(translate(0%, -50%));
            z-index: -1;
            margin-top: -47px;
            svg {
                height: 120px;
            }
            .ct-path1 {
                fill: #dfe6e7;
                @include transition(.3s cubic-bezier(.24,.74,.58,1));
            }
            .ct-path2 {
                fill: #adb0b4;
                @include transition(.3s cubic-bezier(.24,.74,.58,1));
            }
        }
    }
    .slick-dots {
        margin-top: 0;
    }
    .item--inner {
        margin-top: 30px;
        &:hover {
            .item-icon {
                color: $dark_color;
            }
            .item--holder .item--svg {
                .ct-path1 {
                    fill: $primary_color;
                }
                .ct-path2 {
                    fill: $secondary_color;
                }
            }
        }
    }
    &.style2 {
        .item-icon {
            color: #394267;
        }
        .item--content {
            &:before, &:after, .ct-hexagon, .ct-hexagon::before, .ct-hexagon span {
                background-color: #1a1f35;
            }
        }
        .item--holder {
            padding-left: 26px;
            padding-right: 26px;
            @media #{$max-lg} {
                padding-left: 20px;
                padding-right: 15px;
            }
            .item--title {
                color: #fff;
            }
            .item--position {
                color: $primary_color;
            }
            .item--svg .ct-path1 {
                fill: #b3a987;
            }
            .item--svg .ct-path2 {
                fill: #3f4e64;
            }
        }
        .item--description {
            color: #e4e4e4;
            font-family: 'Roboto', sans-serif;
        }
        .slick-dots li {
            button {
                background-color: rgba(#5a6079, 0.4);
            }
            &.slick-active button {
                background-color: $primary_color;
            }
        }
        .item--inner:hover {
            .item-icon {
                color: $primary_color;
            }
        }
    }
}

.ct-testimonial-landing .ct-testimonial-carousel1 {
    .item--content {
        @include box-shadow(0 1px 29px rgba(0,0,0,.09));
        background-color: #fff;
    }
    .ct-slick-carousel {
        margin: 0 -30px 0 -30px;
        padding-left: 30px;
        padding-right: 30px;
        overflow: hidden;
        .slick-list {
            overflow: visible;
        }
    }
    .slick-slide {
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        opacity: 0;
        &.slick-active {
            opacity: 1;
        }
    }
}

// Start Blog Carousel & Grid
//-------------------------------------------------
.ct-blog-carousel-layout1, .ct-blog-grid-layout1 {
    .item--featured {
        width: 47%;
        position: relative;
        overflow: hidden;
        @media #{$max-md} {
            width: 100%;
            min-height: 280px;
        }
        a {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            @include transition(all 500ms ease-out 0s);
        }
    }
    .item--title {
        margin-bottom: 12px;
        font-size: 22px;
        line-height: 1.45;
        @media #{$max-lg} {
            font-size: 18px;
        }
        a {
            color: inherit;
            &:hover {
                color: $primary_color;
            }
        }
    }
    .item--meta {
        list-style: none;
        margin-bottom: 5px;
        display: flex;
        font-size: 14px;
        font-weight: 500;
        color: #676f95;
        text-transform: uppercase;
        a {
            color: inherit;
            &:hover {
                color: $primary_color;
            }
        }
        i {
            margin-right: 7px;
            color: $secondary_color;
            &.fac-folder-open {
                margin-right: 3px;
            }
        }
        li {
            margin-right: 20px;
            &:last-child {
                margin-right: 0;
            }
        }
    }
    .item--content {
        margin-bottom: 23px;
    }
    .item--readmore a:hover {
        color: #fff;
        .icon-abs {
            background-color: #fff;
            .ct-icon-plus {
                &:before, &:after {
                    background-color: $secondary_color;
                }
            }
        }
    }
    .item--date {
        position: absolute;
        z-index: 1;
        height: 62px;
        width: 62px;
        background-color: $secondary_color;
        @include border-radius(3px);
        top: 16px;
        left: 16px;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        span {
            display: block;
            line-height: 1;
            font-size: 22px;
            font-weight: 700;
            color: #fff;
            text-align: center;
            @include font-family-heading($heading_default_font);
            + span {
                font-size: 14px;
                text-transform: uppercase;
                letter-spacing: -0.02em;
                margin-top: 4px;
            }
        }
    }
    .item--body {
        width: 53%;
        padding: 30px;
        @media #{$max-md} {
            width: 100%;
        }
    }
    .grid-item-inner {
        display: flex;
        flex-wrap: wrap;
        background-color: #fff;
        @include box-shadow(0 2px 30px rgba(#041445, 0.1));
        margin-top: 30px;
        margin-bottom: 45px;
        &:hover {
            .item--featured a {
                @include transform(scale3d(1.1, 1.1, 1.1));
            }
        }
    }
    .ct-slick-carousel {
        margin: 0 -30px 0 -30px;
        padding-left: 30px;
        padding-right: 30px;
        overflow: hidden;
        .slick-list {
            overflow: visible;
        }
    }
    .slick-slide {
        @include transition(all 200ms linear 0ms);
        opacity: 0;
        &.slick-active {
            opacity: 1;
        }
    }
    .slick-dots {
        margin-top: 0;
    }
}

.ct-blog-carousel-layout2, .ct-blog-grid-layout2 {
    .item--featured {
        img {
            @include border-radius(8px);
            @include transition(all 300ms linear 0ms);
            width: 100%;
        }
        + .item--body {
            position: relative;
            z-index: 1;
            margin-top: -60px;
            padding: 0 30px;
            @media #{$max-lg} {
                padding-left: 20px;
                padding-right: 20px;
            }
        }
    }
    .item--title {
        margin-bottom: 2px;
        font-size: 20px;
        line-height: 26px;
        a {
            color: inherit;
        }
    }
    .item--readmore {
        display: none;
        margin-top: 3px;
        a {
            font-size: 15px;
            line-height: 28px;
            font-weight: 700;
            @include font-family-heading($heading_default_font);
            i {
                display: initial;
                @include transition(.3s cubic-bezier(.24,.74,.58,1));
            }
            &:hover i {
                margin-left: 6px;
            }
        }
    }
    .item--meta {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        list-style: none;
        font-size: 14px;
        color: #72799a;
        text-transform: capitalize;
        margin-bottom: 5px;
        i {
            margin-right: 4px;
        }
        li {
            margin-right: 22px;
            @media #{$max-sm} {
                margin-right: 16px;
            }
            &:last-child {
                margin-right: 0;
            }
        }
        a {
            color: inherit;
        }
    }
    .item--holder {
        background-color: #fff;
        @include border-radius(5px);
        @include box-shadow(0 13px 29px rgba(#000000, 0.1));
        padding: 23px 20px 27px 30px;
        @include transition(all 300ms linear 0ms);
        @media #{$max-sm} {
            padding-left: 20px;
        }
    }
    .grid-item-inner {
        margin-bottom: 60px;
        &:hover {
            .item--holder {
                @include box-shadow(0 20px 29px rgba(#051648, 0.2));
            }
        }
    }
    .slick-dots {
        margin-top: -18px;
    }
}
.ct-blog-grid-layout2 .ct-grid-pagination {
    margin-top: -15px;
}

.ct-blog-carousel-layout3 {
    .item--date {
        width: 80px;
        height: 80px;
        background-color: $primary_color;
        color: #fff;
        line-height: 1;
        text-align: center;
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: center;
        position: absolute;
        left: 27px;
        bottom: -24px;
        span:nth-child(1) {
            display: block;
            font-size: 30px;
            font-weight: 700;
            @include font-family-heading($heading_default_font);
            margin-bottom: 5px;
        }
    }
    .item--meta {
        list-style: none;
        margin-bottom: 7px;
        display: flex;
        font-size: 14px;
        font-weight: 500;
        color: #676f95;
        text-transform: uppercase;
        a {
            color: inherit;
            &:hover {
                color: $primary_color;
            }
        }
        i {
            margin-right: 7px;
            color: $secondary_color;
            &.fac-folder-open {
                margin-right: 3px;
            }
        }
        li {
            margin-right: 20px;
            &:last-child {
                margin-right: 0;
            }
        }
    }
    .item--title {
        margin-bottom: 14px;
        font-size: 24px;
        line-height: 32px;
        border-bottom: 1px solid #eaeaea;
        position: relative;
        padding-bottom: 12px;
        &:before {
            content: '';
            width: 37px;
            height: 3px;
            bottom: -1px;
            left: 0;
            background-color: $primary_color;
            position: absolute;
        }
        a {
            color: inherit;
            &:hover {
                color: $primary_color;
            }
        }
    }
    .item--content {
        font-size: 15px;
        line-height: 26px;
    }
    .item--body {
        background-color: #fff;
        @include border-radius(4px);
        border: 1px solid #eaebf0;
        padding: 45px 27px 36px;
    }
    .item--readmore {
        a {
            font-size: 14px;
            font-weight: 700;
            color: $dark_color;
            text-transform: uppercase;
            @include transition(.3s cubic-bezier(.24,.74,.58,1));
            i {
                font-style: normal;
                font-size: 18px;
                margin-left: 4px;
            }
            span {
                border-bottom: 1px solid rgba($dark_color_hex, 0.42);
                @include transition(.3s cubic-bezier(.24,.74,.58,1));
            }
            &:hover {
                color: $primary_color;
                span {
                    border-color: rgba($primary_color_hex, 0.42);
                }
            }
        }
    }
    .item--featured {
        position: relative;
        img {
            @include border-radius(4px 4px 0 0);
            width: 100%;
        }
        + .item--body {
            @include border-radius(0 0 4px 4px);
        }
    }
    .grid-item-inner {
        margin-top: 30px;
        margin-bottom: 50px;
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        &:hover {
            @include transform(translate(0, -15px));
            @include box-shadow(0 27px 32px rgba(#0c0c0c, 0.16));
        }
    }
    .ct-slick-carousel {
        margin: 0 -30px 0 -30px;
        padding-left: 30px;
        padding-right: 30px;
        overflow: hidden;
        .slick-list {
            overflow: visible;
        }
    }
    .slick-slide {
        @include transition(.3s cubic-bezier(.24,.74,.58,1));
        opacity: 0;
        &.slick-active {
            opacity: 1;
        }
    }
    &.style2 {
        .item--featured {
            position: relative;
            a:after {
                content: '';
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background-color: rgba(#191919, 0.21);
                z-index: 1;
                @include transition(.3s cubic-bezier(.24,.74,.58,1));
            }
            a:before {
                display: none;
            }
            img {
                @include border-radius(0px);
                @include box-shadow(0 12px 35px rgba(#0c0c0c, 0.06));
                @include transition(.3s cubic-bezier(.24,.74,.58,1));
            }
        }
        .item--body {
            border: none !important;
            @include border-radius(0px !important);
        }
        .item--date {
            background-color: #000;
            z-index: 2;
        }
        .item--meta {
            font-size: 13px;
            color: $primary_color;
            line-height: 19px;
            font-weight: 400;
            letter-spacing: 0.075em;
            margin-bottom: 10px;
            i {
                display: none;
            }
            a:hover {
                color: $fifth_color;
            }
            li {
                border-right: 1px solid $primary_color;
                margin-right: 16px;
                padding-right: 17px;
                &:last-child {
                    border-right: none;
                    margin-right: 0;
                    padding-right: 0;
                }
            }
        }
        .item--title {
            color: #000;
            margin-top: -3px;
            &:before {
                background-color: $fifth_color;
            }
            a:hover {
                color: $fifth_color;
            }
        }
        .item--content {
            color: #666;
        }
        .item--readmore {
            display: none;
            position: relative;
            bottom: -5px;
            a {
                color: $primary_color;
                span {
                    border-color: rgba($primary_color_hex, 0.67);
                }
                &:hover {
                    color: $fifth_color;
                    span {
                        border-color: rgba($fifth_color_hex, 0.67);
                    }
                }
            }
        }
        .grid-item-inner {
            @include box-shadow(0 12px 35px rgba(#0c0c0c, 0.06));
            &:hover {
                @include transform(translate(0, 0px));
                @include box-shadow(0 23px 29px rgba(#000000, 0.18));
                .item--featured {
                    a:after {
                        opacity: 0;
                    }
                    img {
                        -webkit-filter: grayscale(90%);
                        filter: grayscale(90%);
                    }
                }
                .item--title {
                    color: $primary_color;
                }
            }
        }
    }
}
// Start Contact Box
//-------------------------------------------------
.ct-cta1 {
    background-color: #03164f;
    padding: 0 55px 0 70px;
    position: relative;
    background-image: url(../images/bg-cta.png);
    display: flex;
    flex-wrap: wrap;
    @media #{$max-lg} {
        padding-right: 30px;
        padding-left: 30px;
    }
    @media #{$max-xs} {
        flex-direction: column-reverse;
        padding-left: 20px;
        padding-right: 20px;
    }
    .item--title {
        color: #fff;
        font-weight: 400;
        font-size: 36px;
        line-height: 42px;
        @media #{$max-md} {
            font-size: 30px;
        }
        @media #{$max-xs} {
            font-size: 28px;
            line-height: 1.3;
        }
        b {
            font-weight: 700;
        }
    }
    .ct-cta-holder {
        margin-top: 42px;
        display: flex;
        flex-wrap: wrap;
        font-family: "Nunito Sans";
        font-weight: 700;
        color: #fff;
        align-items: center;
        @media #{$max-md} {
            margin-top: 32px;
        }
        .ct-cta-text {
            width: 40px;
            height: 40px;
            line-height: 40px;
            text-align: center;
            position: relative;
            margin: 0 25px;
            z-index: 1;
            font-size: 18px;
            @media #{$max-md} {
                display: none;
            }
            &:before {
                content: '';
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                @include border-radius(9px);
                @include background-gradient-bottom($secondary_color, $primary_color);
                @include transform(rotate(45deg));
                z-index: -1;
            }
            span {
                height: 140px;
                width: 3px;
                border-right: 3px dashed $primary_color;
                position: absolute;
                top: 50%;
                left: 18px;
                @include transform(translate(0, -50%));
                z-index: -2;
                &:before , &:after {
                    content: '';
                    height: 40px;
                    width: 3px;
                    position: absolute;
                }
                &:before {
                    top: 0;
                    @include background-gradient-bottom(rgba(#0e2a47, 0), #0e2a47);
                }
                &:after {
                    bottom: 0;
                    @include background-gradient-bottom(#0e2a47, rgba(#0e2a47, 0));
                }
            }
        }
        .ct-cta-label {
            display: block;
            font-size: 18px;
            margin-bottom: 4px;
            span {
                border-bottom: 1px solid rgba(#fff, 0.4);
                line-height: 1;
                display: inline-block;
            }
        }
        a {
            font-size: 24px;
            line-height: 1.2;
            color: inherit;
            i {
                color: $primary_color;
                margin-right: 10px;
                display: inline-block;
            }
            &:hover i {
                animation: icon-bounce 800ms ease-out infinite;
                -webkit-animation: icon-bounce 800ms ease-out infinite;
            }
        }
    }
    @media #{$max-md} {
        .ct-cta-info {
            width: 100%;
            + .ct-cta-text + .ct-cta-info {
                margin-top: 22px;
            }
        }
    }
    .ct-cta-content {
        width: 65%;
        padding-top: 68px;
        @media #{$max-lg} {
            padding-bottom: 60px;
        }
        @media #{$max-xs} {
            width: 100%;
            padding-top: 32px;
        }
    }
    .ct-cta-image {
        width: 35%;
        margin-top: -65px;
        text-align: right;
        margin-bottom: 16px;
        @media #{$max-xs} {
            width: 100%;
            text-align: center;
        }
    }
}

// Start Showcase
//-------------------------------------------------
.ct-showcase1 {
    max-width: 1665px;
    padding: 0 15px;
    margin: auto;
    text-align: center;
    @media #{$max-lg} {
        padding: 0;
    }
    @media #{$max-md} {
        .ct-grid-inner.row {
            margin-left: -15px;
            margin-right: -15px;
        }
    }
    .item--inner {
        margin-bottom: 60px;
        @include transition(all 300ms linear 0ms);
        position: relative;
        .ct-showcase-image {
            @include box-shadow(0 0 15px rgba(#0a32e5, 0.19));
            @include transition(all 300ms linear 0ms);
            overflow: hidden;
            position: relative;
            label {
                @include box-shadow(0 6px 18px rgba(#000, 0.15));
                line-height: 33px;
                height: 33px;
                font-size: 13px;
                font-weight: 700;
                color: #14287b;
                background-color: #ffd532;
                position: absolute;
                width: 180px;
                padding: 0 10px;
                @include transform(rotate(-45deg));
                top: 25px;
                left: -48px;
                @include font-family-heading($heading_default_font);
                text-align: center;
                text-transform: uppercase;
            }
        }
        .ct-showcase-meta {
            text-align: center;
            h3 {
                margin-top: 42px;
                margin-bottom: 0;
                font-size: 18px;
                font-weight: 600;
                @media #{$max-md} {
                    font-size: 17px;
                }
                cite {
                    color: $primary_color;
                    font-style: normal;
                }
            }
        }
        .ct-showcase-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(#00010a, 0.49);
            z-index: 2;
            @include transition(all 300ms linear 0ms);
            opacity: 0;
        }
        .ct-showcase-button {
            position: absolute;
            top: 50%;
            left: 50%;
            @include transform(translate(-50%, -50%));
            @include transition(.22s cubic-bezier(.24,.74,.58,1));
            opacity: 0;
            z-index: 101;
            display: flex;
            flex-wrap: nowrap;
            align-items: center;
            .btn {
                @include border-radius(50px);
                padding: 0 32px;
                margin: 0 10px;
                @media #{$max-lg} {
                    padding: 0 22px;
                    font-size: 14px;
                    line-height: 44px;
                    margin: 0 7px;
                }
                &:nth-child(1) {
                    transform: translateX(-30px);
                }
                &:nth-child(2) {
                    transform: translateX(30px);
                }
            }
        }
        &:hover {
            @include transform(translateY(-15px));
            .ct-showcase-overlay, .ct-showcase-button {
                opacity: 1;
            }
            .ct-showcase-button .btn {
                &:nth-child(1), &:nth-child(2) {
                    transform: translateX(0px);
                }
            }
        }
    }
}

#ct-header .ct-showcase1, #ct-header-elementor .ct-showcase1 {
    @media #{$max-md} {
        .ct-grid-inner.row {
            margin-left: 0px;
            margin-right: 0px;
        }
    }
    .item--inner {
        margin-bottom: 30px;
        .ct-showcase-meta h3 {
            margin-top: 32px;
            font-size: 16px;
        }
        .ct-showcase-button {
            display: block;
            a {
                background-color: $primary_color;
                color: #fff !important;
                line-height: 39px;
                font-weight: 700;
                padding: 0 14px;
                margin: 10px 5px;
            }
        }
    }
    padding: 0;
    @media #{$max-lg} {
        .ct-grid-inner  {
            height: auto !important;
        }
        .grid-item {
            position: static !important;
            padding: 0;
        }
    }
}

.ct-love-case {color: #22d3ee;}

.ct-video-shortcode {
    .ct-video-item {
        border: 10px solid #fff;
        position: relative;
    }
    .ct-video-button {
        position: absolute;
        top: 50%;
        left: 50%;
        @include transform(translate(-50%, -50%));
        display: inline-block;
        width: 56px;
        height: 56px;
        background-color: $primary_color;
        @include border-radius(56px);
        line-height: 56px;
        text-align: center;
        color: #fff;
        font-size: 16px;
    }
}

.ct-countdown-wrap {
    text-align: center;
}
.ct-countdown {
    max-width: 830px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    > div {
        padding: 0 15px;
        width: 25%;
        @media #{$max-md} {
            width: 50%;
            margin-bottom: 42px;
        }
        @media #{$max-xs} {
            width: 100%;
        }
    }
    .countdown-amount {
        font-weight: 600;
        color: $dark_color;
        font-size: 100px;
        @include font-family-heading($heading_default_font);
        line-height: 1;
        margin-bottom: 10px;
        @media #{$max-xs} {
            font-size: 80px;
        }
    }
    .countdown-period {
        font-size: 19px;
        text-transform: uppercase;
        font-weight: 500;
        @include font-family-heading($heading_default_font);
        color: #384e92;
    }
}

.ct-menu-item {
    list-style: none;
    margin-bottom: 0;
    a {
        cite {
            background-color: $primary_color;
            color: #fff;
            @include border-radius(18px);
            text-transform: capitalize;
            font-style: normal;
            font-size: 10px;
            padding: 0 5px;
            font-weight: 700;
            line-height: 16px;
            display: inline-block;
            margin-left: 4px;
            position: relative;
            top: -8px;
        }
    }
    i {
        font-size: 94%;
        margin-right: 4px;
        display: inline-block;
        min-width: 14px;
    }
}

.elementor-widget-progress .elementor-title {
    margin-bottom: 6px;
    display: block;
}

.ct-user {
    .ct-user-inner {
        max-width: 430px;
        margin: auto;
    }
    .ct-user-holder {
        background-color: #fff;
        @include border-radius(5px);
        position: relative;
        overflow: hidden;
        box-shadow: 0 3px 6px rgba(0, 0, 0, 0.05);
    }
    .ct-user-meta {
        padding: 30px;
    }
    .ct-user-title {
        text-align: center;
        margin-bottom: 32px;
        font-size: 22px;
        text-transform: capitalize;
    }
    .ct-user-bottom {
        border-top: 1px solid #efefef;
        padding: 18px 30px;
        background-color: #f8f8f8;
        text-align: center;
        font-size: 15px;
        @include border-radius(0 0 5px 5px);
        a {
            text-decoration: underline;
        }
    }
    .ct-user-form {
        .field-group {
            position: relative;
            margin-bottom: 15px;
            &:last-child {
                margin-bottom: 0;
            }
        }
        .button {
            width: 100%;
            line-height: 54px;
        }
        input {
            border-radius: 0;
            padding-left: 75px;
        }
        i {
            width: 55px;
            height: 32px;
            font-size: 24px;
            color: $primary_color;
            text-align: center;
            line-height: 32px;
            position: absolute;
            top: 50%;
            left: 0;
            border-right: 1px solid #efefef;
            @include transform(translate(0, -50%));
        }
        span {
            color: #fff;
            background-color: rgba(255, 0, 0, 0.8);
            display: inline-block;
            @include border-radius(3px);
            font-size: 10px;
            line-height: 18px;
            padding: 0 8px;
            position: absolute;
            top: 50%;
            @include transform(translate(0, -50%));
            right: 10px;
        }
    }
    .ct-user-footer {
        padding: 25px 15px 0 15px;
        text-align: center;
        a {
            color: rgba(255, 255, 255, 0.66);
            text-decoration: underline;
        }
    }
    .ct-user-form-profile {
        text-align: center;
        .user-avatar img {
            border: 1px solid #ebebeb;
            padding: 5px;
        }
        .user-name {
            font-size: 15px;
            font-weight: 700;
            margin-top: 8px;
            margin-bottom: 18px;
        }
    }
}
.logged-in .ct-user {
    .ct-user-bottom, .ct-user-title {
        display: none;
    }
}

.ct-effect1 {
    animation: ct_effect_top_bottom 10s infinite linear alternate;
}

.ct-effect2 {
    animation: ct_effect_left_right 10s infinite linear alternate;
}

.ct-particle-animate {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    @media #{$max-md} {
        display: none;
    }
    &.img-above-content {
        z-index: 99;
    }
    img {
        width: 100% !important;
        height: auto;
    }
    div {
        position: absolute;
        &.top-left {
            top: 0;
            left: 0;
        }
        &.top-right {
            top: 0;
            right: 0;
        }
    }
    .shape-animate1 {
        animation: animationFramesTwo 12s infinite linear alternate;
    }
    .shape-animate2 {
        animation: animationFramesOne 12s infinite linear alternate;
    }
    .shape-animate3 {
        animation: animationFramesFour 12s infinite linear alternate;
    }
    .shape-animate4 {
        animation: animationFramesThree 12s infinite linear alternate;
    }
    .shape-animate5 {
        animation: animationFramesFive 12s infinite linear alternate;
    }
    .shape-animate6 {
        animation: particleToptoBottom 10s infinite linear alternate;
    }
}
@media screen and (min-width: 721px) {
    .timeslot .button .timeslot-mobile-title {
        display: none !important;
    }
}
@media screen and (max-width: 720px) {
    body .booked-calendar .booked-appt-list .timeslot {
        margin-bottom: 10px;
    }
    body .booked-appt-list .timeslot .spots-available {
        color: rgba(#fff, 0.67);
    }
    body div.booked-calendar-wrap div.booked-calendar .bc-body .bc-row.week .bc-col .date .number {
        font-size: 15px;
        height: 40px;
        width: 40px;
        line-height: 40px !important;
        margin: 0;
        transform: translate(-50%, -50%);
    }
}