@import url("bootstrap.min.css");

:root {
    --dc-footer-text-color: #ffffff;
    --dc-primary-color: #041e42;
    --dc-primary-contrast-color: #ffffff;
    --dc-secondary-color: #1e3555;
}

/* General Styles */
    .app-title:focus-visible {
        outline: solid !important;
        outline-color: #041E42 !important;
        outline-offset: 1px !important;
    }
.footer-link{
        color:white;
        font-weight:normal;
}
    .footer-link:focus-visible {
    outline: solid !important;
    outline-color: white !important;
    outline-offset: 1px !important; 
    color:white;
    }
    .footer-link:hover{
        color:white;
    }

    @media (min-width: 768px) {
        html {
            font-size: 16px;
        }
    }

    html {
        font-size: 14px;
        position: relative;
        min-height: 100%;
    }

    body {
        font-family: "Open Sans", sans-serif;
        margin-bottom: 60px;
    }

    h1 {
        font-family: Montserrat, sans-serif;
    }

    /* Modify BootStrap classes */

    .nav-item a:hover {
        text-decoration: underline;
    }

    .nav-link:focus-visible {
        outline-width: 3px;
        outline-style: solid;
        text-decoration: underline;
    }

    /* Header, Footer, and Nav */
    #usability-links {
        font-size: .8em;
    }

        #usability-links a {
            color: var(--bs-dark);
            min-height: 24px;
            padding: 0px;
            padding-top: .2em;
            vertical-align: middle;
        }

            #usability-links a:focus-visible {
                outline-color: var(--bs-dark);
            }

    header > div:first-child {
        background-color: var(--dc-primary-color);
    }

        header > div:first-child a {
            background-color: var(--dc-primary-color);
            color: var(--dc-primary-contrast-color);
            text-decoration: none;
        }

            header > div:first-child a:focus-visible {
                outline-color: var(--dc-primary-contrast-color);
                text-decoration: underline;
            }

            header > div:first-child a:hover {
                text-decoration: underline;
            }

    header div span {
        color: var(--dc-primary-color);
    }

    header a:focus-visible {
        outline: 3px solid var(--dc-primary-color);
    }

    header .navbar-toggler {
        border: 0;
    }

        header .navbar-toggler:focus,
        header .navbar-toggler:focus-visible {
            outline: 3px solid var(--dc-primary-color);
        }

    header .navbar-toggler-icon {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(4, 30, 66, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    }


    #main-navigation .nav-link {
        color: var(--bs-dark);
    }

    footer {
        background-color: var(--dc-primary-color);
        color: var(--dc-primary-contrast-color);
    }

        footer a:focus-visible {
            outline: 3px solid var(--dc-primary-contrast-color);
        }

        footer nav {
            background-color: inherit;
        }

        footer .nav-link {
            color: var(--dc-primary-contrast-color);
        }

            footer .nav-link:focus,
            footer .nav-link:hover {
                color: var(--dc-primary-contrast-color);
            }

    #maintenance-message {
        font-size: .8em;
    }

        #maintenance-message a {
            color: var(--dc-header-footer-link-foreground);
            text-decoration: underline;
        }