body {
    background-color: #0579ab;
}

.container {
    background-color: #055b80;
    box-shadow: 1px -1px 10px -1px rgba(0,0,0,0.53);
    -webkit-box-shadow: 1px -1px 10px -1px rgba(0,0,0,0.53);
    -moz-box-shadow: 1px -1px 10px -1px rgba(0,0,0,0.53);
}

.color-header {
    background-color: #055b80;
    z-index: 1;
}

/* XS */
@media (max-width:575px) {
    /* couleurs taille offcanvas */
    .offcanvas-header {
        background-color: #054561;
        width: 300px;
    }

    .offcanvas-body {
        background-color: #076791;
        width: 300px;
    }

    .footer-logo {
        height: 25px;
    }

    /* taille hamburger */
    .bi-list {
        width: 2em;
    }
}

/* SM */
@media (min-width:576px) and (max-width:767px) {
    /* couleurs taille offcanvas */
    .offcanvas-header {
        background-color: #054561;
        width: 300px;
    }

    .offcanvas-body {
        background-color: #076791;
        width: 300px;
    }

    .footer-logo {
        height: 25px;
    }

    /* taille hamburger */
    .bi-list {
        width: 2em;
    }
}

/* MD */
@media (min-width:768px) and (max-width:991px) {
    /* couleurs taille offcanvas */
    .offcanvas-header {
        background-color: #054561;
        width: 300px;
    }

    .offcanvas-body {
        background-color: #076791;
        width: 300px;
    }

    .footer-logo {
        height: 30px;
    }

    /* taille hamburger */
    .bi-list {
        width: 2em;
    }
}

/* LG */
@media (min-width:992px) and (max-width:1199px) {
    /* couleurs taille offcanvas */
    .offcanvas-header {
        background-color: #054561;
        width: 300px;
    }

    .offcanvas-body {
        background-color: #076791;
        width: 300px;
    }

    .footer-logo {
        height: 30px;
    }

    /* taille hamburger */
    .bi-list {
        width: 2.5em;
    }
}

/* XL */
@media (min-width:1200px) and (max-width:1399px) {
    /* couleurs taille offcanvas */
    .offcanvas-header {
        background-color: #054561;
        width: 300px;
    }

    .offcanvas-body {
        background-color: #076791;
        width: 300px;
    }

    .footer-logo {
        height: 30px;
    }

    /* taille hamburger */
    .bi-list {
        width: 2.5em;
    }
}

/* XXL */
@media (min-width:1400px) {
    /* couleurs taille offcanvas */
    .offcanvas-header {
        background-color: #054561;
        width: 300px;
    }

    .offcanvas-body {
        background-color: #076791;
        width: 300px;
    }

    .footer-logo {
        height: 30px;
    }

    /* taille hamburger */
    .bi-list {
        width: 2.5em;
    }
}
