h2,
h3 {
    font-weight: 700
}

#home,
.about-vision {
    background-image: url(../assets/SVGs/mainbg.svg)
}

#footer,
#home {
    background-repeat: no-repeat;
    background-size: cover
}

:root {
    --primary-purble: #662292;
    --lightest: #ECECEC;
    --dark: #676767;
    --darkest: #252525;
    --light: #CDCDCD
}

html {
    direction: ltr
}

.text-primary-purble {
    color: var(--primary-purble) !important
}

.bg-primary-purble {
    background-color: var(--primary-purble) !important
}

.text-lightest {
    color: var(--lightest) !important
}

.cursor-pointer {
    cursor: pointer
}

.text-dark {
    color: var(--dark) !important
}

.text-darkest {
    color: var(--darkest) !important
}

#home {
    min-height: 100vh;
    background-position: top
}

.home-img {
    margin-bottom: -100px
}

#home h1 {
    font-size: 64px
}

body {
    background-color: #f5f2f8
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'DM Sans', sans-serif
}

h2 {
    font-size: 28px;
    line-height: 150%
}

h3 {
    font-size: 20px;
    line-height: 30px;
    letter-spacing: 0
}

.fw-400 {
    font-weight: 400 !important
}

.body {
    font-size: 13px;
    font-weight: 400;
    line-height: 16px;
    letter-spacing: .05em;
    color: var(--dark)
}

.py-12 {
    padding-top: 12px;
    padding-bottom: 12px
}

.landing-header {
    font-size: 64px;
    font-weight: 700;
    font-family: Raleway, sans-serif
}

#footer .label,
.title {
    font-weight: 500;
    letter-spacing: 0
}

.change-auto::after {
    margin-right: auto !important;
    margin-left: 0
}

nav .nav-link {
    font-family: DM Sans;
    font-size: 16px;
    font-weight: 700;
    line-height: 21px;
    letter-spacing: 0
}

.category {
    box-shadow: 0 4px 8px 0 #25252533
}

.title {
    font-size: 16px;
    line-height: 20.83px
}

.dark-p {
    font-size: 20px;
    font-weight: 400;
    line-height: 30px;
    letter-spacing: 0
}

.slick-dots {
    color: red
}

.slick-dots li button:before {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: var(--light);
    content: "" !important
}

.slick-dots li.slick-active button:before {
    background-color: var(--primary-purble)
}

.form input,
.form textarea {
    border-bottom: 1px solid rgba(37, 37, 37, .5) !important
}

.form input:focus,
.form textarea:focus {
    box-shadow: 0 0 0 2px rgba(37, 37, 37, .109)
}

.form textarea {
    resize: none
}

label.text-darkest {
    opacity: .6
}

#get-in-touch p.title {
    opacity: .8
}

.accordion-button {
    box-shadow: none !important
}

.accordion-button,
.accordion-header,
.accordion-item {
    background-color: transparent !important
}

.accordion-item {
    border: none !important;
    border-bottom: 1px solid var(--light) !important;
    border-radius: 0 !important
}

#footer {
    background-image: url(../assets/SVGs/footer.svg);
    margin-top: 200px
}

#footer .label {
    font-size: 12px;
    line-height: 16px
}

#footer .position-absolute {
    right: 50px;
    top: -150px
}

.footer {
    margin-top: 146px
}

#get-in-touch .img.h-100 {
    background-image: url(../assets/Imgs/Free.png);
    background-size: cover;
    background-position: center
}

@media (max-width:1100px) {
    #features .col-md-4 {
        width: 50%
    }

    #features .splash-col {
        order: -1;
        width: 100%;
        text-align: center
    }
}

@media (max-width:777px) {
    #features .col-md-4 {
        width: 100%
    }
}

@media (min-width:992px) {

    .container,
    .container-lg,
    .container-md,
    .container-sm {
        max-width: 95%
    }
}

@media (max-width:992px) {
    .login-btn {
        display: inline-block
    }
}

@media (max-width:1380px) {
    #footer .w-75 {
        width: 50% !important
    }
}

@media (max-width:1050px) {
    #footer .position-absolute {
        width: 50% !important
    }

    #footer .w-75 {
        width: 75% !important
    }

    #get-in-touch .form {
        margin: 0 !important;
        padding: 0 !important
    }

    nav .nav-item {
        padding-left: 10px !important;
        padding-right: 10px !important
    }
}

@media (min-width:1050px) and (max-width:1300px) {
    #footer .landing-header {
        margin-top: 169px !important
    }
}

@media (max-width:834px) {

    #home h1,
    .landing-header {
        font-family: DM Sans;
        font-size: 38px;
        font-weight: 700;
        line-height: 57px;
        letter-spacing: 0
    }

    #people .w-75 {
        width: 100% !important
    }
}

@media (max-width:776px) {
    #footer .w-75 {
        width: 100% !important
    }

    .stors img {
        width: 33.33%
    }

    #about-us .text-center.mx-5 {
        margin: 0 !important
    }

    #home .home-img {
        width: 50%;
        margin: auto
    }

    #home .stors .w-25 {
        width: 33.33% !important;
        margin: 20px 0
    }
}

@media (max-width:600px) {

    #features h3,
    #people .text-center.mx-5 {
        margin: 0 !important
    }

    #footer .position-absolute {
        top: -50px
    }

    .landing-header {
        font-family: DM Sans;
        font-size: 28px;
        font-weight: 700;
        line-height: 30px;
        letter-spacing: 0
    }

    .footer {
        margin-top: 0
    }

    .stors img {
        width: 33.33%
    }

    .stors a {
        position: relative;
        z-index: -1000;
    }
    
    #home .home-img {
        margin-bottom: -50px
    }

    #features h3 {
        padding: 0 !important
    }
}

@media screen and (min-width:1000px) {
    #questions .container {
        width: 75%
    }
}