@media only screen and (min-width: 641px) and (max-width: 768px) {
   
    #titre {
        top:30px;
        font-size:30px;
    }
    #ecrire {
        position:fixed;
        top:22px;right:140px;
        width:60px;height:60px;
    }
    

    a:link, a:visited { text-decoration: underline; }
    a:hover, a:active { text-decoration: underline; }


    #apropos {
        left:-100%;
        width:100%;
     }
     #connexion, #inscription, #contribution {
        right:-100%;
        width:100%;
     }

     #poeme { width:100%; }

     #poeme #liste_poemes { display:table; }
     #poeme #liste_poemes_resp { display:none; }
    


}


@media only screen and (max-width: 640px) {
   
    #titre {
        width:100%;
        top:15px;left:0;
        font-size:24px;
        text-align:center;
    }
    #ecrire {
        position:fixed;
        top:50px;right:60%;
        width:50px;height:50px;
    }
    #membres {
        top:50px;right:0;
        width:90%;
        font-size:18px;
        text-align:center;
    }
    

    a:link, a:visited { text-decoration: underline; }
    a:hover, a:active { text-decoration: underline; }


    #apropos {
        left:-100%;
        width:100%;
     }
     #connexion, #inscription, #contribution {
        right:-100%;
        width:100%;
     }

     #poeme { width:100%; }
     #poeme-fermer { top:1rem;right:1rem;width:30px;height:30px; }

     #poeme #liste_poemes { display:none; }
     #poeme #liste_poemes_resp { display:block; }


}