:root {
    --BG-COLOR: #eef5f1;
    --ERROR_COLOR: #8b1821;
    --SUCCESS_COLOR: #17603a;
    --NAV_BORDER_COLOR: #b8cec1;
    --NAV_BG_COLOR: #153a32;
    --NAV_A_COLOR: #fff;
    --NAV_A_BG_COLOR: #286251;
    --SNAV_BG_COLOR: #eef5f1;
    --SNAV_A_COLOR: #153a32;
    --SNAV_A_BG_COLOR: #cce4d6;
    --NAV_A_FOCUS_COLOR: #a76500;
}

nav.a3-nav ul {
    display: flex;
    list-style-type: none;
}

.a3-nav {
    display: flex;
    flex-wrap: wrap;
    gap: .3rem;
    padding: .6rem max(1rem, calc((100% - 1100px)/2));
}

.a3-nav {
    background: var(--NAV_BG_COLOR);
}

.a3-nav a {
    text-decoration: none;
    padding: .45rem .7rem;
    border-radius: .3rem;
    color: var(--NAV_A_COLOR);
}

.a3-nav a:hover,
.a3-nav a[aria-current=page] {
    background: var(--NAV_A_BG_COLOR);
}

.a3-nav:focus-visible {
    outline: 3px solid var(--NAV_A_FOCUS_COLOR);
    outline-offset: 2px;
}


body {
    margin: 0;
    font: 1rem/1.5 system-ui, sans-serif;
}

main {
    max-width: 1100px;
    margin: 2rem auto;
    padding: 0 1rem;
}

body {
    background-color: #eef5f1;
    color: #153a32;
    font-family: Arial, sans-serif;
    line-height: 1.6;
    margin: 0;
}

main {
    max-width: 850px;
    margin: 32px auto;
    padding: 28px;
    background: #fff;
    border-radius: 10px;
}

a {
    color: #b8cec1;
}

table {
    border-collapse: collapse;
    width: 100%;
}

th,
td {
    border: 1px solid #bac9be;
    padding: 10px;
    text-align: left;
}