9B534B8686E580E0E01768F00155B461

at path：ROOT / wp-content / themes / kadu / assets / scss / components / _cta.scss

run：R W Run

_about.scss

11.46 KB

2024-06-07 08:38:52

R W Run

_animation.scss

3.86 KB

2024-06-02 09:44:42

R W Run

_back-to-top.scss

1.11 KB

2024-04-25 09:34:42

R W Run

_blog-page.scss

26.83 KB

2024-06-11 06:51:22

R W Run

_blog.scss

11.77 KB

2024-06-06 04:16:02

R W Run

_breadcrumb.scss

2.53 KB

2024-06-12 03:56:04

R W Run

_button.scss

10.66 KB

2024-06-06 11:59:28

R W Run

_choose-us.scss

7.76 KB

2024-06-06 11:53:36

R W Run

_client.scss

4.37 KB

2024-05-28 11:54:48

R W Run

_contact-us.scss

3.81 KB

2024-06-11 08:55:10

R W Run

_counter.scss

3.1 KB

2024-05-30 05:51:10

R W Run

_course-details.scss

29.48 KB

2024-06-09 06:18:52

R W Run

_course.scss

34.5 KB

2024-06-04 06:49:00

R W Run

_cta.scss

6.27 KB

2024-06-06 05:12:08

R W Run

_error.scss

2.65 KB

2024-06-11 10:20:46

R W Run

_event-details.scss

9.96 KB

2024-06-10 05:05:32

R W Run

_event.scss

7.68 KB

2024-06-09 11:06:54

R W Run

_faq.scss

1.27 KB

2024-05-26 10:40:32

R W Run

_footer.scss

18.39 KB

2024-06-06 08:53:18

R W Run

_full-page-nav.scss

4.43 KB

2024-06-11 12:42:00

R W Run

_gallery.scss

3.55 KB

2024-06-10 06:49:40

R W Run

_header.scss

17.28 KB

2024-06-11 11:02:34

R W Run

_hero.scss

18.73 KB

2024-06-11 10:40:22

R W Run

_instructor-details.scss

5.15 KB

2024-06-09 09:15:04

R W Run

_popular-category.scss

12.24 KB

2024-06-06 09:59:08

R W Run

_preloader.scss

621 By

2024-05-28 04:48:48

R W Run

_price.scss

9.83 KB

2024-05-30 05:52:22

R W Run

_privacy-page.scss

1.33 KB

2024-06-11 09:15:36

R W Run

_search.scss

3.03 KB

2024-06-11 10:42:44

R W Run

_services.scss

10.43 KB

2024-06-03 04:06:10

R W Run

_team.scss

9.23 KB

2024-06-09 06:56:08

R W Run

_testimonial.scss

12.14 KB

2024-06-06 10:34:22

R W Run

_title.scss

2.9 KB

2024-06-02 12:32:10

R W Run

_video-course.scss

4.96 KB

2024-05-30 10:54:24

R W Run

error_log

📄_cta.scss

/* 
    cta-1-start
*/

.kd-cta-1 {

&-area {
        margin-top: -130px;
        position: relative;
        z-index: 1;
    }

&-wrap {
        border-radius: 20px;
        overflow: hidden;
        background: #282568;
        display: grid;
        grid-template-columns: 1fr 1fr .8fr;
        gap: 50px;
        align-items: center;
        padding-left: 60px;

@media #{$xl} {
            padding-left: 30px;
        }

@media #{$lg} {
            padding-left: 30px;
            gap: 30px;
        }

@media #{$md,$xs} {
            grid-template-columns: 1fr;
            padding-left: 0px;
            padding: 50px 30px;
            gap:  30px;
        }

.title {
            font-size: 36px;
            line-height: 1.11;
            margin-bottom: 23px;

@media #{$xl,$lg,$md} {
                font-size: 30px; 
            }

@media #{$xs} {
                font-size: 26px; 
            }
        }
        .main-img {
            -webkit-clip-path: polygon(10% 0%, 100% 0, 100% 100%, 0% 100%);
                    clip-path: polygon(10% 0%, 100% 0, 100% 100%, 0% 100%);
            height: 250px;
        }
    }

&-action {
        display: flex;
        align-items: center;
        gap: 10px;

.icon {
            width: 54px;
            height: 54px;
            border-radius: 50%;
            background: var(--kd-clr-sd-1);
            color: #fff;
            font-size: 18px;
        }

.title {
            font-size: 15px;
            line-height: 1;
            margin-bottom: 5px;

}

.action-link {
            font-size: 25px;
            line-height: 1;
            transition: .2s var(--cube-1);

&:hover {
                color: var(--kd-clr-sd-1);
                letter-spacing: .5px;
            }
        }

&:hover {
            .icon {
                animation: 1s kd-jello;
            }
        }
        
    }

}

.kd-counter-1 {
    &-item-wrap {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 30px;
        flex-wrap: wrap;

position: relative;
        z-index: 1;

@media #{$md,$xs} {
            max-width: 400px;
        }

&::after {
            content: "";
            width: 2px;
            height: 100%;
            background-color: #7874fe;
            position: absolute;
            top: 0;
            left: 50%;
            transform: translateX(-50%);

@media #{$xs} {
                display: none;
            }

@media #{$sm} {
                display: block;
            }
        }
    }

&-item {
        .item-number {
            font-size: 60px;
            line-height: 1;
            margin-bottom: 3px;

@media #{$lg,$md,$xs} {
                font-size: 40px;
            }
        }

.disc {
            font-size: 16px;
            line-height: 27px;
        }
        
    }
    
}

/* 
    cta-1-end
*/

/* 
    cta-2-start
*/
.kd-cta-2 {
    &-content {
        @media #{$md,$xs} {
            margin-bottom: 50px;
        }

.kd-list-1 {
            grid-template-columns: 1fr;
            margin-bottom: 40px;
        }

.contact-item-flex {
            gap: 40px;
        }
    }

&-form {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 14px;
        padding: 60px 55px;
        border-radius: 20px;
        align-items: flex-start;

@media #{$lg} {
            grid-template-columns: 1fr;
        }

@media #{$xs} {
            grid-template-columns: 1fr;
            padding: 60px 25px;
        }

&-input {
            font-family: var(--kd-font-pr-1);
            font-weight: 700;
            font-size: 15px;
            color: #fff;
            background: #00625c;
            border-radius: 30px;
            border: none;
            outline: none;
            height: 58px;
            padding: 0 33px;
            width: 100%;

}

input[type="number"]::-webkit-inner-spin-button {
            -webkit-appearance: none;
            appearance: none;
            margin: 0;
        }

&-btn {
            background: #191717;
            height: 58px;
        }

.has-full-width {
            grid-column: 1 / -1;
        }
    }
}

/* 
    cta-2-end
*/

/* 
    cta-4-start
*/

.kd-cta-4-wrap {
    padding: 75px 15px;
    border-radius: 20px;

.title {
        font-size: 48px;
        line-height: 1.20;
        margin-bottom: 20px;

@media #{$lg} {
            font-size: 42px;
        }

@media #{$md} {
            font-size: 36px;
        }

@media #{$xs} {
            font-size: 32px;
        }
    }
    
    .disc {
        font-weight: 500;
        opacity: 100%;
        margin-bottom: 42px;
        max-width: 795px;
        margin-left: auto;
        margin-right: auto;
    }

.btn-wrap {
        gap: 35px;
    }
}

.kd-cta-btn-1 {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: var(--kd-font-barlow);
    text-transform: uppercase;
    font-weight: 700;
    color: #fff;
    font-size: 16px;
    line-height: 22px;
    background: var(--kd-clr-pr-4);
    border-radius: 5px;
    padding: 17px 30px;
    transition: .4s ease-in-out;

i {
        width: 22px;
        height: 22px;
        display: flex;
        justify-content: center;
        align-items: center;
        background: #fff;
        border-radius: 50%;
        color: var(--kd-clr-pr-4);
        font-size: 12px;
        transition: .4s ease-in-out;
    }
    &:hover {
        background: #fff;
        color: var(--kd-clr-pr-4);
        i {
            background: var(--kd-clr-pr-4);
            color: #fff;
        }
    }

&:is(.has-border) {
        background: transparent;
        border: 2px solid;
        border-color: #fff ;
        padding: 16px 29px;

&:hover {
            background: #fff;
        }
    }
}

/* 
    cta-4-end
*/