/*
Coder: klp
Date: 2022-05-23
File: siteStyles.css
App: AppShell-BS5-JS2022-05-23


Overall site styles
*/
/*--------- navbar styles ----------*/
img#mastheadIcon{
    width: 60px;
    height: auto;
    margin-right: 10px;
}


/*--------- footer styles ----------*/
footer{
    font-size: .8em;
}

/*--------- MEDIA QUERIES ----------*/
/*showing the BS5 breakpoints: https://getbootstrap.com/docs/5.0/layout/breakpoints/*/
@media (max-width: 576px) {
    nav {
        border-bottom: 4px gray solid;
    }
    
}

@media (min-width: 577px) {
    /*400px or less*/
    nav {
        border-bottom: 4px red solid;
    }
}

@media (min-width: 768px) {
    nav {
        border-bottom: 4px orange solid;
    }
}

@media (min-width: 992px) {
    nav {
        border-bottom: 4px yellow solid;
    }

    div#jumbotron{
        background-position: center;
    }

    div#jumbotron2{
        background-position: 0px -150px;
    }
}

/*begin to show inline navigation and remove burger menu icon*/
@media (min-width: 1200px) {
    nav {
        border-bottom: 4px green solid;
    }
}

@media (min-width: 1400px) {
    nav {
        border-bottom: 4px blue solid;
    }
    div#jumbotron2{
        background-position: 0px -200px;
    }
}