@media (max-width: 576px) { 
    /*** Navbar ***/
    .main-navbar .navbar-brand img {width: 210px; margin-top:0.5rem; margin-left:0.8rem}
    /*** Homepage ***/
    #services {margin:20px auto}
 }

@media (max-width: 992px) { 
    /*** Général ***/
    h1, .titre-bleu {font-size:1.8rem}   
    /*** Navbar ***/
    .main-navbar {width:100%;padding: 0;justify-content: space-between;}
    .main-navbar .navbar-brand {height:inherit!important}
    .main-navbar .nav-item .nav-link:after {content:''}
    .main-navbar .buttons {margin-top:2rem}
    .main-navbar .buttons .nav-item.contact, .main-navbar .buttons .nav-item.home {height: 3.5rem;width: 3.5rem;padding: 0.5rem;}
    /*** Homepage ***/
    #homepage, #page-int {padding: 2rem;}
    #homepage #services {margin: 0.5rem 0 0.2rem}
    #homepage #services .item {height:80px; margin-bottom:15px}
    #homepage #services .item.decalage {margin-top: inherit;}
    #homepage #services .item.decalage:hover, #services .item:hover {margin-top:0}
    #homepage #services .item span {font-size: 1.2rem;}
    #homepage #services .item .img-service {position: absolute;bottom: 0;right: 0;left:inherit;height: 70px;}
    #about, #realisations {padding: 1.5rem;}
    #about p {margin:1.2rem 0; }
    #realisations .gallery {margin-top: 1rem;}
    #realisations .gallery .item {margin-top: 0.8rem;}
    #realisations .gallery .item, #realisations .gallery .item img  {height:9rem}
 }
    