* {
    padding: 0px;
    margin: 0px;
    font-family: 'Poppins', sans-serif;
}


body {
    background-color: #D1D1D1;
    position: relative;
}

#navbar {
    width: 250px;
    height: 100vh;
    position: absolute;
}


#body {
    width: 100vw;
}

main {
    padding: 2rem;
}

.box-text {
    display: grid;
    gap: .3rem;
}

input.form-box {
    border: none;
    padding: .5rem;
    border-radius: 10px;
    outline: none;
}

input {
    border: none;
    outline: none;
}


input:focus,
input:active {
    border: none;
    outline: none;
}

button {
    border: none;
    padding: .5rem;
    border-radius: 10px;
    cursor: pointer;
}

.btn-primary {
    background-color: #DB0032;
    color: white;
}

.btn-excel {
    background-color: #448b28;
    color: white;
}

button.btn-primary:hover {
    background-color: #b41439;
}

button.btn-excel:hover {
    background-color: #387420;
}

a {
    text-align: right;
    text-decoration: none;
}

h1,
span {
    cursor: default;
}


#main {
    min-height: calc(100vh - 82px);
    max-height: calc(100vh - 82px);
}

.nav-min {
    display: none;
}


@media only screen and (max-width: 841px) {
    #navbar {
        display: none;
    }

    .nav-min {
        width: 50px;
        height: 50px;
        position: absolute;
        background-color: #DB0032;
        margin: 1rem;
        border-radius: 50%;

        display: flex;
        align-items: center;
        justify-content: center;

        color: white;
        font-size: 20px;
    }
}