@media screen and (max-width: 1632px) {
    .navbar-nav {
        margin: auto;

    }

}



@media screen and (max-width: 1280px) {
    .navbar-nav {
        margin: 0 auto;

    }

    #vasu {
        font-size: 1.5rem;
    }

}

@media (min-width: 840px) and (max-width: 1036px) {
    #vasu {
        font-size: 2.5rem;
        /* Adjust to fit on one line */
        white-space: nowrap;
        /* Ensure it doesn't break into two lines */
    }
}



@media screen and (max-width: 995px) {
    #iamgrid {
        grid-template-columns: repeat(2, minmax(175px, 1fr));
        padding: 0% 4% 4% 4%;

    }




}

@media screen and (max-width: 980px) {

    body {
        width: 106vw;
    }

    .navbar,
    footer {
        width: 106vw;
    }

    #navbarNavDropdown {
        width: 106vw;
    }

}

@media screen and (max-width: 900px) {
    body {
        width: 107vw;
    }

    .navbar {
        width: 106vw;
        margin: 0 0 0 15px;
    }

    #navbarNavDropdown {
        width: 106vw;
    }

    footer {
        width: 107vw;
    }

    #navbarNavDropdown {
        width: 107vw;
    }


    #text {
        font-size: 14px;
    }

    section {
        margin: auto;
    }





}

@media screen and (max-width: 835px) {
    section {
        margin: auto;
    }

    body {
        width: 109vw;
    }

    .navbar {

        margin: 0 0 0 15px;
    }

    footer {
        width: 108.5vw;
    }

    #navbarNavDropdown {
        width: 108.5vw;
    }

    #text {
        font-size: 13px;
    }



    .navbar-brand {
        max-width: 8%;
        margin: 0;
    }

}

@media screen and (max-width: 806px) {
    body {
        width: 110vw;
    }

    .navbar {
        width: 109vw;
        margin: 0 0 0 15px;
    }

    #navbarNavDropdown {
        width: 109vw;
    }



    footer {
        width: 109vw;

    }

    section {
        margin: auto;
    }



}


@media screen and (max-width: 768px) {
    #iamgrid {
        grid-template-columns: repeat(2, minmax(225px, 1fr));
    }

    body {
        width: 106.5vw;
        margin: none;
        padding: none;
    }

    .navbar {
        width: 105.5vw;
        margin: 0 0 0 15px;
    }

    #navbarNavDropdown {
        width: 106.5vw;
    }

    footer {
        width: 106.5vw;
    }

    .navbar .navbar-brand {
        order: -1;
        /* Move .navbar-brand to the top */
    }

    #text {
        font-size: 11.5px;
    }

    section {
        margin: auto;
    }


}


@media screen and (max-width: 615px) {
    #iamgrid {
        grid-template-columns: repeat(1, minmax(170px, 1fr));
    }

    section {
        margin: auto;
    }

}




@media screen and (max-width: 562px) {
    body {
        width: 103.5vw;
    }

    .navbar,
    #navbarNavDropdown {
        width: 104vw;
        margin: 0 0 0 15;
    }



    #text {
        font-size: 10px;
    }

    .navbar-brand {
        max-width: 10%;
        margin: 0;
    }

    footer {
        width: 103.5vw;
    }

}

@media screen and (max-width: 498px) {
    .register-button {
        width: auto;
        /* Let buttons shrink to their content size */
        margin-bottom: 0;
        font-size: 15px;
        /* Remove bottom margin for horizontal layout */
    }


    #days,
    #minutes,
    #hours,
    #seconds {
        font-size: 2rem;
        font-weight: 500;
        text-align: center;

    }

    .unit {
        font-size: 1rem;
        margin-top: 10px;
        color: #333;
    }

}

@media screen and (max-width: 478px) {

    body,
    .navbar,
    footer {
        width: 108.75vw;

    }

    #navbarNavDropdown {
        width: 108.5vw;
    }
}



@media screen and (max-width: 452px) {




    body,
    footer {
        width: 112.7vw;
    }

    #navbarNavDropdown {
        width: 112vw;
    }

    .navbar {
        width: 112.3vw;

    }

    #text {
        font-size: 9px;
    }

}

@media screen and (max-width: 430px) {

    body,
    footer {
        width: 130vw;
    }

    .navbar {
        width: 126vw;

    }

    #navbarNavDropdown {
        width: 130vw;
    }
}

@media screen and (max-width: 395px) {

    body,
    footer {
        width: 127vw;
    }

    .navbar {
        width: 127vw;

    }

    #navbarNavDropdown {
        width: 127vw;
    }

    #text {
        font-size: 8px;
    }

    .navbar-brand {
        max-width: 12%;
        margin: 0;
    }

    section {
        margin: auto;
    }
}



@media screen and (max-width: 390px) {

    body,
    footer {
        width: 130vw;
        padding: none;
        margin: none;
    }

    .navbar {
        width: 130vw;

    }

    #navbarNavDropdown {
        width: 130vw;
    }

    section {
        margin: auto;
    }
}

@media screen and (max-width: 375px) {

    body,
    footer {
        width: 142vw;
    }

    .navbar {
        width: 138vw;

    }

    #text {
        font-size: 7px;
    }

    section {
        margin: auto;
    }

    #navbarNavDropdown {
        width: 140vw;
    }
}

@media screen and (max-width: 355px) {

    body,
    footer {
        width: 152vw;
    }

    .navbar {
        width: 152vw;

    }

    #navbarNavDropdown {
        width: 152vw;
        height: 100vh;
    }
}

@media screen and (max-width: 325px) {


    body,
    footer {
        width: 165vw;
        margin: 0 auto;
    }


    .navbar {
        width: 164vw;

    }

    #navbarNavDropdown {
        width: 165vw;
    }

    section {
        margin: auto;
    }
}