@media all and (min-width: 767px){

    @font-face {
        font-family: Helvetica_Neue;
        src: url(Fonts/Helvetica_neue.woff);
    }

    html, body, #legende, #titre, #contact, #contacts, #bio, #langue{
        font-family: Helvetica_Neue;
    }

    body{
        position: absolute;
        margin: 0;
        width: 100vw;
        height: 100vh;
        overflow: hidden;
        cursor: default;
    }

    /*EFFET AU SURVOL*/
    #titre:hover,#contact:hover{

    }

    /*VICTOR MAÇON*/
    #titre{
        position: absolute;
        top: 2vh;
        z-index: 2000;
        text-align: left;
        left: 1.5vw;
        color: black;
        cursor: pointer;
    }
    /*BIO*/
    #bio{
        z-index: 3;
        display: none;
        position: absolute;
        margin: 0;
        width: 16vw;
        left: 1.5vw;
        top: 8vh;
        cursor: pointer;
        
    }
    /*CONTACT*/
    #contact{
        position: absolute;
        top: 2vh;
        z-index: 3;
        text-align: right;
        right: 1.5vw;
        color: black;
        cursor: pointer;
    }

    /*NUMERO MAIL ETC*/
    #contacts{
        z-index: 3;
        display: none;
        position: absolute;
        text-align: right;
        margin: 0;
        width: 16vw;
        right: 1.5vw;
        top: 8vh;
    }
    a, a:active, a:visited{
        text-decoration: none;
        color: black;
    }
    /*EN-FR*/
    #langue{
        position: absolute;
        bottom: 2vh;
        z-index: 3;
        text-align: right;
        right: 1.5vw;
        color: black;
    }
    #en, #fr{
        cursor: pointer;
    }
    #fr{
        opacity: 0.5;
    }
    .en{
        display: block;
    }
    .fr{
        display: none;
    }

    /*PHOTOS*/
    #image{
        position: absolute;
        z-index: 1;
        margin: 0;
        left: 20vw;
        /*    transform: translateX(-50%);*/
        top: 8vh;
        width: 60vw;
        height: 81%;
        -webkit-backface-visibility: hidden;
    }
    /*ZONES CLIQUABLES*/
    #gauche{
        position: absolute;
        height: 90vh;
        top: 4vh;
        width: 50vw;
        left: 0px;
        z-index:2;
        opacity: 0.5;
/*        cursor: w-resize;*/
        cursor: url('l.png'), w-resize;     
    }
    #droite{
        position: absolute;
        height: 90vh;
        top: 4vh;
        width: 50vw;
        right: 0px;
        z-index:2;
        opacity: 0.5;
        cursor: url('r.png'), e-resize;
    }
    /*LEGENDES*/
    #index_legende{
        position: absolute;
        z-index: 3;
        left: 1.5vw;
        bottom: 7vh;
    }
    #legende_en, #legende_fr{
        position: absolute;
        bottom: 2vh;
        z-index: 3;
        width: 90vw;
        text-align: left;
        left: 1.5vw;
        color: black;
    }
    #legende_fr{
        display: none;
    }

}