/*Feuille de style CSS du blog pour mobile*/

/*Général*/

@media screen and (max-width: 1000px) {
    .conteneur {
        width: 100%;
    }
}

@media screen and (max-width: 900px) {
    #colonne {
        width: 100%;
    }
}

@media screen and (max-width: 650px) {
    .conteneur {
        width: 99%;
        padding: 0;
        margin: 0;
    }

    #page,
    #pleinepage,
    #colonne,
    nav ul li;
        {

        width: 100%;
    }
    .logo a, #entete1 p{
        
        animation: none;
    }
}


/*Accueil*/

@media screen and (max-width: 1050px) {
    .apropos {
        width: 100%;
    }
}

@media screen and (max-width: 1050px) {
    #presentation {
        display: block;
        margin: auto;
    }
}

@media screen and (max-width: 500px) {
    #presentation {
        display: none;
        margin: auto;
    }
}

@media screen and (max-width: 650px) {
    .index {
        width: 100%;
        display: block;
        margin: auto;
    }
}

@media screen and (max-width: 550px) {

    .icones,
    .icones:hover {
        display: block;
        margin: auto;
        padding: 10px;
    }

    .social {

        text-align: center;
        margin: 10px;
    }
}


/*Menu*/



@media screen and (max-width: 550px) {

    #menu {

        display: none;
    }

    .menu-mobile {

        display: block;
    }

    #entete1 .logo {

        padding-top: 45px;

    }
}

/*Porfolio*/

@media screen and (max-width: 650px) {
    .alsa {
        width: 100%;
        display: block;
        margin: auto;
    }
}

/*Article de blog*/

@media screen and (max-width: 1200px) {
    .postdate {

        position: relative;
        top: 5px;
        left: 5px;
    }
}

/*Footer*/

@media screen and (max-width: 650px) {

    #pied .credits,
    .liens {

        display: block;
        margin: auto;
    }
}