p /*texte principal*/ {
    color: green;
    font-size: medium;
    font-family: "arial", serif;
}

h2 /*Titre*/ {
    color: green;
    text-align: center;
    font-family: "arial", serif;
}

body /*Fond*/ {
    background-image: url(Images/fond.jpg);
    margin: 0;
    background-attachment: fixed;
}




.divTable {
    display: table;
    width: 100%;
    text-align: center;
    position: absolute;
    top: 40%;
}

.divTableRow {
    display: table-row;
}

.divTableHeading {
    background-color: #EEE;
    display: table-header-group;
}

.divTableCell, .divTableHead {
    border: 0px solid #999999;
    display: table-cell;
}

.divTableHeading {
    background-color: #EEE;
    display: table-header-group;
    font-weight: bold;
}

.divTableFoot {
    background-color: #EEE;
    display: table-footer-group;
    font-weight: bold;
}

.divTableBody {
    display: table-row-group;
}






















.img-container {
    float: left;
    width: 30%;
    padding: 5px;
    text-align: center;
}









div.gallery {
    border: 0px solid #ccc;
}

    div.gallery:hover {
        border: 1px solid #777;
    }

    div.gallery img {
        width: 100%;
        height: auto;
        position: relative;
        padding: 50px 50px;
    }

@media only screen and (max-width: 700px) {
    div.gallery img {
        padding: 25px 25px;
    }
}


* {
    box-sizing: border-box;
}

.responsive {
    padding: 0 6px;
    float: left;
    width: 32%;
}


@media only screen and (max-width: 700px) {
    .responsive {
        width: 49.9%;
        margin: 6px 0;
    }
}

@media only screen and (max-width: 500px) {
    .responsive {
        width: 100%;
        padding: 0px 0px;
    }
}

.avant_header {
    text-align: center;
    width: 100%;
    height: auto;
}

.header {
    padding: 5px 5px;
    text-align: center;
    width: 100%;
    height: auto;
    margin: 0 auto;
}

@media only screen and (max-width: 3400px) {
    .header {
        width: 49.9%;
    }
}

@media only screen and (max-width: 1400px) {
    .header {
        width: 49.9%;
    }
}

@media only screen and (max-width: 600px) {
    .header {
        width: 100%;
    }
}

.clearfix:after {
    content: "";
    display: table;
    clear: both;
}