* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
    body {
        font-size: 20px;
        font-family: var(--theme-font);
        font-weight: 400;
        --theme-color: #eeeeee;
        --secondary-color: #32e0c4;
        --theme-font: 'Lato';
        --theme-font-color: #000;
        --secondary-font: 'Piazzolla';
        --white-color: #fff;
        --special-font-color: #000;
        --secondary-font-color: #282828;
        --video-section: #ffffff;
        --features-link: url("https://utemplates.net/wp-content/uploads/2017/07/White-Textured-Background.jpg");
        position: relative;
    }

    body::-webkit-scrollbar {
        width: 13px;
        background-color: var(--theme-color);
        /* display: none; */
    }

    body::-webkit-scrollbar-thumb {
        background-color: var(--special-font-color);
        border-radius: 0;
    }

    body::-webkit-scrollbar-thumb:hover {
        border-radius: 10px;
    }

    body::-webkit-scrollbar-track:hover {
        box-shadow: inset 0 0 4px 0 #000;
    }

        .loading-screen {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-color: var(--secondary-color);
            z-index: 11;
            display: flex;
            justify-content: center;
            align-items: center;
        }

            .outer-loading-ring {
                width: 90px;
                height: 90px;
                content: "";
                border-radius: 50%;
                border-top: 10px solid #e4e4e4;
                border-bottom: 10px solid var(--special-font-color);
                display: flex;
                justify-content: center;
                align-items: center;
                animation: outer-loading-ring infinite 3s;
            }

                .loading-ring {
                    width: 50px;
                    height: 50px;
                    content: "";
                    border-radius: 50%;
                    border-left: 10px solid #e4e4e4;
                    border-right: 10px solid var(--special-font-color);
                    animation: inner-loading-ring infinite 3s;
                }

        /* ---------------- Settings Modal ---------------- */

        .settings-outer-modal {
            position: fixed;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            z-index: 13;
            background: rgba(0, 0, 0, 40%);
            display: flex;
            justify-content: center;
            align-items: center;
            opacity: 0;
            pointer-events: none;
            transition: opacity 0.3s;
        }

        .settings-outer-modal.show-settings {
            opacity: 100%;
            pointer-events: all;
        }

            .settings-inner-modal {
                background-color: var(--theme-color);
                padding: 30px;
                border-radius: 15px;
                position: relative;
                width: 50%;
                transform: scale(0.7);
                opacity: 0;
                transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
                transition-delay: 0.3s;
            }

            .settings-outer-modal.show-settings .settings-inner-modal {
                transform: scale(1);
                opacity: 100%;
            }
            
                .settings-close-btn {
                    color: #fff;
                    background-color: #f00;
                    width: 30px;
                    height: 30px;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    border-radius: 50%;
                    line-height: 10px;
                    padding: 10px;
                    font-size: 130%;
                    position: absolute;
                    right: 10px;
                    top: 10px;
                    cursor: pointer;
                }

                .settings-title {
                    font-size: 150%;
                    text-align: center;
                    color: var(--special-font-color);
                    margin-bottom: 10px;
                }

                    .settings-title-underline {
                        background-color: var(--special-font-color);
                        content: "";
                        height: 2px;
                        margin-top: 10px;
                    }

                .setting {
                    padding: 10px;
                }

                    .dark-theme-form {
                        display: grid;
                        grid-template-columns: repeat(2, 1fr);
                        justify-items: center;
                    }

                        .setting-label {
                            color: var(--theme-font-color);
                        }

                        #dark-theme-toggle {
                            display: none;
                        }

                        .dark-theme-toggle-btn {
                            background-color: var(--secondary-color);
                            height: 30px;
                            width: 100px;
                            border-radius: 7px;
                            cursor: pointer;
                            display: inline-block;
                            padding-top: 5px;
                            padding-left: 5px;
                            transition: 0.5s;
                        }

                            .dark-theme-toggle-indicator {
                                background-color: white;
                                content: "on";
                                color: #fff;
                                width: 40px;
                                height: 20px;
                                border-radius: 5px;
                                display: flex;
                                justify-content: center;
                                align-items: center;
                            }

                            #dark-theme-toggle:checked ~ .dark-theme-toggle-btn {
                                padding-left: 55px;
                            }

        /* ------------------------------------------------ */ 
    
        header {
            background-color: var(--theme-color);
            padding: 30px;
            display: flex;
            width: 100%;
            font-weight: 600;
            font-size: 150%;
            position: fixed;
            top: 0;
            right: 0;
            left: 0;
            justify-content: center;
            align-items: center;
            transition: all 0.3s;
            letter-spacing: 6px;
            z-index: 10;
        }

            .page-title:link,
            .page-title:visited {
                color: var(--theme-font-color);
                text-decoration: none;
            }

            .settings-icon {
                position: absolute;
                height: 40px;
                width: 40px;
                left: 20px;
                display: flex;
                justify-content: center;
                align-items: center;
                border-radius: 50%;
                transition: all 0.3s ease-in-out;
                top: 30px;
                color: rgb(255,140,0);
            }

            .settings-icon:hover {
                background-color: rgba(204, 204, 204, 0.5);
                cursor: pointer;
            }

            .settings-icon.down {
                background-color: var(--theme-color);
                height: 60px;
                width: 60px;
                border-radius: 0;
                border-bottom-left-radius: 10px;
                border-bottom-right-radius: 10px;
                left: 0;
                top: 100px;
            }

            .header-logo {
                height: 40px;
                width: auto;
                display: inline-block;
                margin-right: 10px;
                transition: all 0.3s;
            }

        header.small {
            padding: 20px;
            font-weight: 500;
            font-size: 120%;
        }

            header.small .header-logo {
                height: 30px;
            }

            header.small .settings-icon {
                top: 15px;
            }

            header.small .settings-icon.down {
                top: 70px;
            }

            /* ---------------- Front Section ---------------- */

            .front-section {
                background-color: var(--secondary-color);
                display: flex;
                justify-content: left;
                background-image: url(../Images/background_image_front_page.png);
                background-position: 120% 130%;
                /* background-image: url("https://uploads-ssl.webflow.com/5f21d1ffffa8639e7606ea49/5f2b404f067d60455228538c_hero%20(1).png"), url("https://uploads-ssl.webflow.com/5f21d1ffffa8639e7606ea49/5f299f2d48dfb0046a188e8b_hero_scribs.png"); */
                padding-bottom: 250px;
                background-size: 1000px, auto;
                background-repeat: no-repeat, no-repeat;
                object-fit: fill;
                padding-top: 0;
            }

                .front-section-content {
                    font-weight: 500;
                    width: 80%;
                    padding: 10px;
                    user-select: none;
                    padding-left: 35px;
                }
                
                    .hero-text {
                        color: var(--theme-font-color);
                        font-size: 200%;
                        margin-bottom: 10px;
                    }

                    .hero-sub-text {
                        color: var(--theme-font-color);
                        font-family: var(--secondary-font);
                        width: 60%;
                    }

                    .sign-up-btn:link,
                    .sign-up-btn:visited {
                        background: var(--theme-color);
                        color: var(--theme-font-color);
                        font-size: 95%;
                        padding: 19px;
                        border-radius: 10px;
                        height: 50px;
                        display: block;
                        width: 200px;
                        line-height: 10px;
                        text-decoration: none;
                        margin-top: 30px;
                        transition: transform 0.3s, box-shadow 0.3s;
                    }

                    .sign-up-btn:hover,
                    .sign-up-btn:active {
                        transform: scale(1.05);
                        box-shadow: 0 0 7px 2px #000;
                    }

            /* ------------------------------------------------ */

            /* ---------------- Video Section ---------------- */

            .video-section {
                background-color: var(--video-section);
                padding: 80px;
            }

                .video-section-content {
                    display: grid;
                    grid-template-columns: 1fr 1fr;
                    width: 100%;
                    grid-gap: 20px;
                }

                    .list {
                        background-color: var(--theme-color);
                        list-style: none;
                        border-radius: 20px;
                        padding: 20px;
                        display: grid;
                        padding-top: 35px;
                    }

                        .list-heading {
                            font-size: 120%;
                            color: black;
                            text-align: center;
                            margin-bottom: 20px;
                            letter-spacing: 3px;
                        }

                        .list-item {
                            display: grid;
                            grid-template-columns: 50px auto;
                            font-family: var(--secondary-font);
                            color: black;
                        }

                    iframe {
                        height: 400px;
                        width: 100%;
                        margin-right: 30px;
                        border-radius: 10px;
                    }

            /* ------------------------------------------------ */

            /* ---------------- Features Section ---------------- */

            .features-section {
                padding-top: 80px;
                padding-bottom: 0px;
                background-image: var(--features-link);
                background-position: 50% 50%;
                /* background-size: 1041px; */
                background-attachment: fixed;
                display: flex;
                justify-content: center;
                align-items: center;
                flex-direction: column;
            }

                .features-title {
                    font-size: 170%;
                    text-align: center;
                    color: var(--special-font-color);
                    display: flex;
                    align-items: center;
                    flex-direction: column;
                }

                    .features-title-underline {
                        background-color: var(--special-font-color);
                        content: "";
                        height: 2px;
                        width: 50px;
                        margin-top: 10px;
                    }

                .features-grid {
                    display: grid;
                    padding: 40px;
                    grid-gap: 25px;
                    grid-template-columns: 1fr;
                    width: 80%;
                }

                    .feature {
                        display: grid;
                        grid-gap: 20px;
                    }
                    
                    .feature.media-on-right {
                        grid-template-columns: 1fr 2fr;
                    }

                    .feature.media-on-left {
                        grid-template-columns: 2fr 1fr;
                    }

                        .feature-content-block {
                            background-image: var(--secondary-color);
                            padding: 20px;
                            border-radius: 20px;
                            transition: all 0.5s;
                            background-color: #212121;
                            color: #fff;
                        }

                        .feature-content-block:hover {
                            transform: translateY(-10px) scale(1.02);
                            box-shadow: 0 2px 30px 0 #000;
                        }

                            .feature-heading {
                                display: grid;
                                grid-template-columns: 0.5fr 3fr;
                                border-bottom: 2px solid var(--special-font-color);
                                padding-bottom: 10px;
                            }

                                .feature-icon {
                                    color: #fff;
                                    font-size: 120%;
                                    padding: 10px;
                                    z-index: 0;
                                }

                                .feature-heading-text {
                                    color: #fff;
                                    letter-spacing: 2px;
                                    display: flex;
                                    align-items: center;
                                }

                            .feature-content {
                                color: #fff;
                                font-family: var(--secondary-font);
                                font-size: 90%;
                                margin-top: 10px;
                            }

                        .feature-media {
                            background-color: var(--secondary-color);
                            border-radius: 20px;
                            display: flex;
                            justify-content: center;
                            align-items: center;
                        }

                            .feature-media-content {
                                width: 100%;
                            }

            /* ------------------------------------------------ */
            /* ---------------- Feedback Section ---------------- */

            .feedback-section {
                background-color: var(--secondary-color);
                padding: 40px;
            }

                .feedback-heading {
                    font-family: var(--theme-font);
                    text-align: center;
                    color: var(--theme-font-color);
                }

                .feedback-grid {
                    display: grid;
                    grid-template-columns: repeat(3, 1fr);
                    margin-top: 70px;
                    grid-gap: 15px;
                }

                    .feedback {
                        border-radius: 20px;
                        background-color: var(--theme-color);
                        position: relative;
                        padding-top: 50px;
                        padding-bottom: 20px;
                    }

                        .feedback-person-photo {
                            content: "";
                            border-radius: 50%;
                            height: 100px;
                            width: 100px;
                            background-color: #fff;
                            position: absolute;
                            top: -50px;
                            left: 50%;
                            transform: translateX(-50%);
                            background-position: center;
                            background-size: 100%, 100%;
                            background-repeat: no-repeat;
                        }

                        .first-person {
                            background-image: url(../Images/feedback-person-img-one.png);
                        }
                        .second-person {
                            background-image: url(../Images/feedback-person-img-two.png);
                            background-size: 140%;
                        }
                        .third-person {
                            background-image: url(../Images/feedback-person-img-three.png);
                        }

                        .feedback-content {
                            font-family: var(--secondary-font);
                            color: var(--secondary-font-color);
                            padding: 20px 25px 30px 25px;
                            text-align: center;
                            height: 200px;
                            overflow: hidden;
                            text-overflow: ellipsis;
                            line-height: 30px;
                            display: flex;
                            justify-content: center;
                            align-items: center;
                        }

                        .feedback-person-name {
                            color: var(--theme-font-color);
                            text-align: center;
                        }

            /* ------------------------------------------------ */

    /* ---------------- Dark Theme ---------------- */

    body.dark-theme {
        --theme-color: #000;
        --secondary-color: #1a1a2e;
        --theme-font: 'Lato';
        --theme-font-color: #ffffff;
        --secondary-font: 'Piazzolla';
        --white-color: #fff;
        --special-font-color: #41aea9;
        --secondary-font-color: #ccc;
        --video-section: #3282b8;
        --features-link: url("data:image/jpeg;base64,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");
    }

        body.dark-theme .list {
            background-color: #222831;
        }

            .list-heading {
                color: var(--special-font-color);
            }

            .list-item {
                color: var(--theme-font-color);
            }

    /* ------------------------------------------------ */


/* ---------------- Keyframes ---------------- */

@keyframes outer-loading-ring {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}
@keyframes inner-loading-ring {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(720deg);
    }
}

/* ------------------------------------------------ */

/* ---------------- Media Queries ---------------- */

@media screen and (max-width: 647px) {
    .front-page {
        padding-bottom: 70px;
        padding-top: 70px;
    }
}

@media screen and (max-width: 891px) {
    .video-section-content {
        grid-template-columns: 1fr;
    }
}

@media screen and (max-width: 975px) {
    .features-grid {
        grid-template-columns: 1fr;
    }
    .feature{
        width: 100%;
    }
}

@media screen and (max-width: 537px) {
    .video-section,
    .features-section {
        padding: 40px;
        padding-bottom: 60px;
    }
    .front-section{
        background-position: 50% 110%;
        background-size: 100%;
    }
}

@media screen and (max-width: 420px) {
    .video-section,
    .features-section {
        padding: 20px;
        padding-bottom: 40px;
    }
}

@media screen and (max-width: 450px) {
    .features-grid {
        padding: 10px;
    }
}

@media screen and (max-width: 1120px) {
    .front-section {
        background-position: 100% 150%;
        background-size: 900px, auto;
        padding-top: 150px !important;
    }
}

@media screen and (max-width: 1010px) {
    .features-grid {
        width: 90%;
    }
}

@media screen and (max-width: 1000px) {
    .front-section {
        background-position: 150% 110%;
        background-size: 800px, auto;
        padding-top: 150px !important;
    }
}

@media screen and (max-width: 940px) {
    .feature.media-on-left,
    .feature.media-on-right {
        grid-template-columns: 1fr;
    }
}

@media screen and (max-width: 870px) {
    .front-section {
        background-size: 100%, auto;
        background-position: 100px 120%;
    }
}

@media screen and (max-width: 850px) {
    .feedback-grid {
        grid-template-columns: 1fr;
    }

        .feedback:not(:first-child) {
            margin-top: 70px;
        }

            .feedback-content {
                height: auto;
            }
}

@media screen and (max-width: 790px) {
    .hero-sub-text {
        width: auto;
    }
    .front-section {
        background-position: 30px 120%;
        background-size: 110%;
    }
}

@media screen and (max-width: 720px) {
    .settings-inner-modal {
        width: 80%;
    }
}

@media screen and (max-width: 670px) {
    .front-section {
        background-position: 20px 100%;
    }
}

@media screen and (max-width: 630px) {
    .front-section {
        background-position: 10px 100%;
    }
}

@media screen and (max-width: 500px) {
    .front-section {
        background-size: 120%;
        background-position: -10px 100%;
    }
}

@media screen and (max-width: 360px) {
    .settings-inner-modal {
        width: 90%;
    }
}

@media screen and (max-width: 350px) {
    .features-grid {
        width: 90%;
        margin: 0;
        padding: 0;
    }
    .features-section {
        padding: 0 !important;
    }
}

@media screen and (max-width: 330px) {
    .dark-theme-form {
        grid-template-columns: 1fr;
        grid-gap: 10px;
    }
}

/* ------------------------------------------------ */


  main {
    font-family: "Heebo", sans-serif;
  }
  
  .intro {
    background: black;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .slider {
    background: rgb(97, 105, 109);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform: translateY(100%);
  }
  
  .intro-text {
    color: rgb(233, 233, 233);
    font-family: "Heebo", sans-serif;
    font-size: 2rem;
  }
  
  .hide {
    background: black;
    overflow: hidden;
  }
  
  .hide span {
    transform: translateY(100%);
    display: inline-block;
  }
  

.footer {
    position: static;
    left: 0%;
    top: auto;
    right: 0%;
    bottom: 0%;
    margin-top: auto;
    padding-top: 32px;
    padding-bottom: 32px;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    background-color: #151515;
    text-align: center;
    color: white;
}

.logo{
    display: flex;
    width: 5rem;
    height: auto;
    padding: 10px;
}

.footer-para{
    text-align: center;
}