body {
    --bs-body-font-family: RobotoRegular, Arial, sans-serif;
    --bs-body-font-size: .875rem;
}

img {
    max-width: 100%;
}

.st-wrapper {
    margin-top: 1.2rem;
    background-color: #f5f5f5;
    border: solid 1px #e1e1e1;
}

header {
    margin: 1rem 1rem 0;
    border-bottom: 1px solid #e1e1e1;
}

header a {
    color: #000;
    text-decoration: none;
}

header a:not(:last-child) {
    margin-right: 1rem;
}

header a:hover {
    color: #fbc02d;
}

header img {
    height: 2rem;
}

main {
    padding: 1.5rem 1rem;
}

main a {
    color: #fbc02d;
    text-decoration: none;
}

main h1 {
    font-size: 1.5rem;
    margin-bottom: 1.5rem;
}

main table {
    border-color: #e1e1e1;
}

main table td {
    padding: .3125rem .625rem .3125rem .625rem;
    background: #fff;
    color: #5390cc;
}

main table tr:nth-child(2n) td {
    background: #f5f5f5;
}

.table-scroller {
    overflow-x: auto;
}

aside {
    background-color: #bfbfbf;
    padding: 3rem 2rem;

    display: grid;
    gap: 30px 30px;
    align-items: center;
    grid-template-columns: 1fr 1fr;

}

@media (min-width: 576px) {
    aside {
        grid-template-columns: 1fr 1fr 1fr;
    }
}

@media (min-width: 768px) {
    aside {
        grid-template-columns: 1fr 1fr 1fr 1fr;
    }
}

@media (min-width: 992px) {
    aside {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    }
}

aside .logo img {
    max-width: 100%;
    max-height: 100%;
    height: auto;
}

footer {
    background-color: #0b2431;
    color: #fff;
}

footer a {
    color: #fbc02d;
    text-decoration: none;
}

footer a:hover {
    color: #fff;
}

footer img {
    height: 2rem;
}

.footer-inner {
    padding: 1rem;
}

@media (min-width: 768px) {
    header {
        margin-left: 1.5rem;
        margin-right: 1.5rem;
    }

    main, .footer-inner {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
}
