/*
Coder:
Date:
Site:
File: bs5-breakpointMediaQueries.css
Comments/TODO:

ROYGBV = x-small, small, medium, large, x-large, xx-large

*/

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

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

@media (min-width: 768px) {/*medium*/
    nav {
        border-bottom: 4px yellow solid;
    }
}

@media (min-width: 992px) {/*large*/
    nav {
        border-bottom: 4px green solid;
    }
}

@media (min-width: 1200px) {/*extra large*/
    nav {
        border-bottom: 4px blue solid;
    }
}

@media (min-width: 1400px) {/*extra extra large*/
    nav {
        border-bottom: 4px violet solid;
    }
}