* {
    font-family: 'Roboto',sans-serif;
}

body {
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    background-color: #003d4c;
}

body::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    width: 100%;
    height: 75%;
    background: #bee2e9 !important;
    z-index: -1;
    transform: skewY(-12deg);
    transform-origin: top left;
}

main {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    width: 80%;
    max-width: 70rem;
    box-shadow: 0 2px 10px 0 rgb(0 1 0 / 13%);
    padding: 20px;
    max-height: 80%;
    overflow-y: auto;
}

footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    color: #fff;
    text-align: center;
}

p {
    line-height: 25px;
}

h1 {
    text-align: center;
}

.dropdown-menu[data-bs-popper] {
    right: 0;
    left: auto;
    overflow: auto;
    max-height: 500px;
}

nav {
    z-index: 9999;
    box-shadow: 0px 0px 7px 3px #6b6b6b9c;
}

#dropdownMenuButton1 {
    background: #003d4c !important;
    border: #003d4c !important;
}

.navbar-brand {
    font-weight: bold;
    color: #074554 !important;
}

@media only screen and (max-width: 990px) {
    #dropdownMenuButton1 {
        width: 100%;
        margin-top: 10px;
    }

}