:root 
{
    --mygreen: #A6C34B;
    --myred: #E2001A;
    --myblue: #269DD7;
}

body 
{
    background-color: lightgray;
    font-family: 'Roboto Slab',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
}

h1, h2, h3, h4, h5, h6
{
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
}

.btn-outline-success 
{
    color: var(--mygreen);
    border-color: var(--mygreen);
}

nav 
{
    border-left: 5px solid var(--myred);
}

.navbar-dark .navbar-brand
{
    color: var(--myblue);
}
.navbar-dark .navbar-nav .nav-link
{
    color: var(--light);
}

#content 
{
    padding-top: 5rem;
    background-color: var(--light);
    overflow:auto;
}

footer 
{
    background-color: var(--myblue);
    overflow:auto;
    margin-top: 10px;
    margin-left: -15px;
    margin-right: -15px;
    color: var(--light);
    padding: 15px;
    font-size: 85%;
}

footer a 
{
    color: var(--light);
}

footer ul
{
    list-style-type: none;
}

a:hover, a:focus,
.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus,
.navbar-dark .navbar-brand:hover,
.navbar-dark .navbar-brand:focus
{
    color: var(--myred);
    text-decoration: none;
}