@import url(https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap);


:root {
    --textPrimary: #283739;
    --textSecondary: #26222B;
    --textPrimaryColor: #A760FF;
    --textNavbar: #959AA5;
    --textFooter: #FFFFFFA6;
    --grey: #E5E5E5;
    --indigo-2: #f3edff;
    --grey-2: #686D76;
}

.textPrimary {
    color: var(--textPrimary);
}

.textPrimaryColor {
    color: var(--textPrimaryColor) !important
}

.textFooter {
    color: var(--textFooter) !important
}

.title {
    font-weight: 700;
    margin: auto;
}

.title2 {
    font-weight: 600;
    margin: auto;
}

.subtitle {
    color: var(--grey-2);
    line-height: 24px;
    font-weight: 400
}

.bg-secondary {
    background-color: var(--textSecondary) !important
}

.section2 {
    background-color: #E6E8E6
}

.section2,
.section3,
.section4,
.section5,
.section6 {
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    width: 100%;
}

.section2 .borders,
.section3 .borders,
.section5 .borders,
.section4 .borders,
.section6 .borders {
    height: 1px;
    width: 100%;
    margin: .5rem 0;
}

.section2 .borders,
.section3 .borders,
.section5 .borders,
.section6 .borders {
    background-color: #283739;
}

.section4 .borders {
    background-color: white;

}

.section3 {
    background-color: #DEDEDE
}

.section4 {
    background-color: var(--textPrimary)
}

.section5 {
    background-color: #F8BFF6
}

.section6 {
    background-color: #E8CEFD
}

.section7 .bg-secondary {
    border-radius: 20px;
}


@media (max-width:575.98px) {

    .title,
    .title2 {
        line-height: 40px !important;
    }
}


@media (min-width:576px) {

    .title,
    .title2 {
        width: 80%;
        line-height: 47.24px;
    }

    .subtitle {
        width: 80%;
        margin: auto;
    }

}

@media (min-width:576px) and (max-width:767.98px) {
    .w-sm-75 {
        width: 75% !important;
    }
}


@media (max-width:767.98px) {}



@media (min-width:768px) and (max-width:991.98px) {

    .title,
    .title2,
    .subtitle {
        width: 70% !important;
    }
}

@media (min-width:768px) {}

@media (max-width:991.98px) {
    .h-min-lg {
        height: 300px;
    }

    .section1,
    .section2,
    .section3,
    .section4,
    .section5,
    .section7,
    .section6 {
        padding-left: 1.5rem !important;
        padding-right: 1.5rem !important
    }
}

@media (min-width:992px) {

    .title {
        font-size: 40px;
    }

    .title2 {
        font-size: 36px;

    }

    .title,
    .title2,
    .subtitle {
        width: 60% !important;
    }


    .section1,
    .section2,
    .section3,
    .section4,
    .section5,
    .section7,
    .section6 {
        padding-left: 5rem !important;
        padding-right: 5rem !important
    }

    .w-lg-50 {
        width: 50% !important;
    }

    .w-lg-75 {
        width: 75% !important;
    }

    .w-lg-80 {
        width: 80% !important;
    }
}
