@media (min-device-aspect-ratio: 16/11) and (max-device-aspect-ratio: 16/10) { /*MACBOOK*/
    #contact ul{ font-size: 0.88em; }
    #activity article{ padding: 2em 3em; }
}


@media (min-width: 1200px) { /* Desktop */

}

/* Tablette */
/*@media (min-width: 768px) and (max-width: 1024px) {*/
@media (min-width: 768px) and (max-width: 1199.98px) {

    #bulle .left{ width: 15em; }
    #bulle .right{ width: 10em; margin-right: 0; }

    .vimeo iframe{ width: 75%; }

    #activity article{ padding: 2em 3em; }

    #contact ul{ flex-wrap: wrap; }
    #contact ul li{ width: 45%; }
}

/* Mobile */
@media (max-width: 767px) {

    #enFooter{ flex-direction: column; }

    #bulle{ position: relative; }
    #bulle .left{ width: 10em; margin-right: -8em; background-position: left bottom; }
    #bulle .right{ width: 5em; margin-left: -5em; margin-right: 0; }
    #bulle .main{ flex: none; width: 98%; padding: 0 6em 0 1em; z-index: 2;  }
    #bulle .main .p2{ padding: 0 0 8em 5em; }

    .vimeo{ margin: 0; }
    .vimeo iframe{ width: 100%; }

    #activity{ padding-right: 6em; }
    #activity in{ flex-direction: column; }
    #activity article{ width: 96%; padding: 2em; }

    #contact{ padding: 2em; }
    #contact ul{ flex-direction: column; }
    #contact ul li{ width: 88%; }


    #faire in{ flex-direction: column; }
    #faire in span{ width: 100%; }
    #faire in span div{ font-size: 1.25em; }  
    #faire .faireBas{ aspect-ratio: 4/3; }
}