body {
    padding: 0 0.5rem;
    background: url(img/Cardinal-in-Snow-web-page.png) no-repeat center;
    background-size: cover;
}

:root {
    --black: #333;
    --white: #eee;
    --gray: #49545f;
    --lightgray: #bbb;
    --shadow: hsla(0, 0%, 0%, 0.5);
    --clr-primary:  #218BC4;
    --clr-secondary: #0055a5;
    --clr-tertiary: #03325f;
    --clr-quarternary: #456e97;
    font-family: 'Inter', sans-serif;
}

main {
    color: var(--gray);
}

.page {
    max-width: 1200px;
    box-shadow: 0 0 4px 2px var(--shadow);
}

.cs-title {
    font-size: 1.75rem;
    font-weight: 900;
}

.cs-title-sm {
    font-size: 1.25rem;
    font-weight: 700;
}

.cs-title-xs {
    font-size: 1rem;
    font-weight: 700;
}

.header-content {
    background: var(--clr-secondary) url(img/back_swoosh.png) no-repeat top;
    background-position: cover;
}

.header-content,
.header-content a,
footer,
footer a {
    color: var(--white);
    text-decoration: none;
}

.header-main {
    justify-content: space-around;
}

.header-item {
    a:hover {
        color: var(--bs-red);
    }
}

.header-nav {
    padding: 0 0.5rem;
    text-align: center;
    a {
        padding: 0.25rem;
        flex-grow: 1;
    }
    a:hover {
        background-color: var(--shadow);
    }
}

.header-logo > a {
    > img {
        width: 119px;
        height: 119px;
    }
}

.home-widget {
    background: rgb(255,255,255);
    background: linear-gradient(0deg, var(--clr-secondary) 50%, rgb(255,255,255) 50%); 
}

.home-widget > *{
    flex-grow: 1;
    align-items: flex-end;
}

.home-card {
    display: flex;
    flex-direction: column;
}

.home-cardbody {
    width: 100%;
    flex-grow: 1;
    padding: 0.25rem 1rem 0.75rem 1rem;
    background-color: var(--white);
    :first-child {
        width: 100%;
        color: var(--gray);
        font-weight: 700;
        text-align: center;
    }
}

.home-cardbody > * {
    display: block;
    padding-block: 4px;
    width: fit-content;
    font-size: smaller;
    text-decoration: none;
}

footer {
    text-align: center;
    background-color: var(--clr-quarternary);
}

.footer-nav {
    text-align: center;
    a {
        display: inline-block;
        padding: 0 0.5rem;
        margin-block: 0.25rem;
    }
    a:hover {
        color: var(--bs-info);
        text-decoration: underline;
    }
}

.carousel-control-next,
.carousel-control-prev,
.carousel-indicators {
    filter: invert(80%);
}

.list-custom {
    padding-left: 2rem;
    list-style-type: square;
}

aside {
    height: min-content;
    color: var(--white);
    background-color: var(--clr-secondary);
    a {
        padding: 0.25rem 0.5rem;
        color: var(--white);
        text-decoration: none;
    }
    a:hover {
        background-color: var(--shadow);
    }
}

@media only screen and (min-width: 768px) {
    .header-main {
        justify-content: space-between;
    }
    .header-nav {
        padding: 0;
        :not(:last-child) {
            border-right: 2px solid var(--white);
        }
    }

    .footer-nav {
        :not(:last-child) {
            border-right: 2px solid var(--white);
        }
    }

    .home-cardbody > * {
        font-size: 1em;
    }
    
}