:root {
    --red: #cc1a1a;
    --orange: #f9951d;
    --green: #009933;
    --nav: #aad9df;
    --blue: #4fb3c0;
    --hovblue: #dceef1;
    --hovblue2: #e8f4f6;
    --darkblue: #0d3b66;
    --font: #6a6a6a;
    --back: #466ecd;
    --abu: #f3f3f3;
}

*,
body,
html {
    font-family: "Poppins", sans-serif;
    font-size: 15px;

    color: var(--font);

    margin: 0px;
    padding: 0px;

    overflow: hidden;
}

body {
    background: #e1e1e1;
}

.wrap-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    width: 100vw;
    height: 100vh;
    gap: 0px;

    overflow: hidden;

    position: relative;
}

.wrap {
    width: 100vw;
    max-width: 480px !important;
    height: 100vh;
    background-color: #f2f2f2;

    position: relative;

    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;

    gap: 20px;

    overflow-y: scroll;
    justify-content: flex-start;
}

.wrap::-webkit-scrollbar {
    display: none;
}


@media only screen and (max-width: 800px) {
    .wrap-container {
        display: flex;
        flex-direction: column;
        align-content: center;
        justify-content: center;

        width: 100vw;
        height: 100vh;
    }

    .wrap {
        width: 100vw;
        height: 100vh;
    }
}