/*responsive next :*/


@media (min-width : 2000px){
    html{
        font-size: 28px;
    }
    article{
        max-width: 1600px;
        max-height: 1200px;
    }
}

/* iPad mini -> iPad Pro 9.7" */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation: portrait) {

    html{
        font-size: 18px;
    }

    .column{
        float: none;
        width: 100%;
    }
}

@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation: landscape) {

    html{
        font-size: 16px;
    }

    .column{
        float: none;
        width: 100%;
    }
}

@media only screen and (max-width : 850px){
    html{
        font-size: 17px;
    }
    .column{
        float: none;
        width: 100%;
    }
}
@media only screen and (max-width : 750px){
    html{
        font-size: 16px;
    }
}



/*iPhone 4.7" & 5.5" L*/
@media only screen
and (min-device-width : 375px)
and (max-device-width : 736px)
and (orientation : landscape) {

    html{
        font-size: 13px;
    }

    .titre{
        font-size: 3rem;
    }
    .credits{
        font-size: 1rem;
    }
    .column{
        float: none;
        width: 100%;
    }
}

/*iPhone 4.7" & 5.5" P*/
@media only screen
and (min-width : 375px)
and (max-width : 820px)
and (orientation : portrait) {

    html{
    font-size: 13px;
    }

    article{
        /* max-width: 1600px; */
        height: 540px;
    }
    .gallerybutton{
        /* top:85%; */
    }

    .titre{
        font-size: 3rem;
    }
    .credits{
        font-size: 1rem;
    }

    .column{
        float: none;
        width: 100%;
    }

}



/*iPhone 5S*/
@media only screen
and (max-device-width : 320px)
and (orientation : portrait){

    html{
        font-size: 10px;
    }

    .titre{
        font-size: 3rem;
    }
    .credits{
        font-size: 1rem;
    }

    .column{
        float: none;
        width: 100%;
    }
}

@media only screen
and (orientation : landscape)
and (max-device-width: 320px) {

    html{
        font-size: 10px;
    }
    .titre{
        font-size: 3rem;
    }
    .credits{
        font-size: 1rem;
    }

    .column{
        float: none;
        width: 100%;
    }
}