html, body{
    height: 100%;
}

body{
    display: block;
    height: 100%;
    width : 100%;
    
}

.header{
    position: fixed;
    height: 28px;
    margin-top : -8px;
    background: linear-gradient(180deg, orange, white);
    width: 100%;
    margin-left: -8px;
    margin-right: -8px;
}

.header_content{
    font-size: 17px;
    text-align: right;
    margin-right: 3em;
    margin-top: 4px;
}

.img_accueil {
    position: absolute;
    margin-top:0px;
    left: -10px;
    width: 100%;
    z-index: -1;
}

.centre{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: -60px;
}

.img_under_construction{
    margin-top: 20px;
    z-index: 1;
    padding: 10px;
}

#un{
    width: 54%;
    rotate: 2deg;
}

#deux{
    width: 40%;
    rotate: 0deg;
}

#trois{
    width: 100%;
    padding: 10px;
}

#quatre{
    width: 4%;
    rotate: 6deg;
}

#cinq{
    width: 4%;
    rotate: -6deg;
}

#six{
    width: 50%;
    padding: 0px;
}

#sept{
    width: 10%;
    padding: 0px;
}

#huit{
    width: 3%;
    padding: 2px;"
}

#neuf{
    width: 25%;
    padding: 2px;
    margin-top: -10px;
}

#dix{
    width: 10%;
    rotate: 6deg;
    padding: 30px;
}

#onze{
    width: 8%;
    rotate: -6deg;
}

#douze{
    width: 8%;
    rotate: 0deg;
}

#treize{
width: 8%;
rotate: 0deg;
}

#quatorze{
    width: 30%;
    rotate: 0deg;
    z-index: -1;
    position: absolute;
    right:10px;
    top: 105px;
}

#quinze{
    width: 30%;
    rotate: 0deg;
    z-index: -1;
    position: absolute;
    left: 200px;
    top: 300px;"
}


footer{
    position: fixed;
    height: 23px;
    width: 100%;
    bottom: 0;
    margin-left: -8px;
    margin-right: -8px;
    background: linear-gradient(180deg, white, orange);
}

.footer_content{
    font-size: 17px;
    text-align: left;
    margin-left: 12em;
}

.footer_content_2{
    font-size: 17px;
    text-align: left;
    margin-left: 70em;
}

.footer_content_telephone{
    display: none;
}

p {
    display: block;
    margin-block-start: 0.3em;
    margin-block-end: 1em;
}

h1{
    padding: 10px;
    font-family:'Franklin Gothic Medium', 'Arial Narrow', 'Arial', sans-serif;
    color: black;
    z-index: 10;
}


@media only screen and (max-width: 600px){
    body{
        /*background-color: rgb(47, 200, 255);*/
    }
    p{
        max-width: 100%;
        font-size: 1em;
    }
h1{
    font-size: 3em ;
}
    h3{
        font-size: 2em;
    }

    .centre{
        display: block;
        text-align: center;
    }

    img{    
        max-width: 100%;
    }

    .header{
        position: fixed;
        height: 70px;
        margin-top : -8px;
        background: linear-gradient(180deg, orange, white);
        width: 100%;
    }

    .header_content{
        font-size: 23px;
        text-align: center;
        margin-left: 2.5em;
    }

    .img_under_construction{
        
    }

    #un{
        width: 90%;
        padding-top: 3em;
    }

    #deux{
        display: none;
        width: 70%;
        margin-top: -0.5em;
    }

    /* PB */
    #trois{
        width: 90%;
        margin-top: -1em;
        margin-left: -1em;
    }
    /* PB */

    #quatre{
        display: none;
        position: absolute;
        width: 20%;
        rotate: 6deg;
    }

    #cinq{
        position: absolute;
        width: 30%;
        rotate: -6deg;
        margin-left: -5em;
        margin-top: 4.5em;
    }
    
    #six{
        display: none;
    }
    
    #sept{
        width: 35%;
        margin-top: 2em;
        margin-left: 10em;
    } 
    
    #huit{
       display: none;
    }

    #neuf{
        width: 95%;
        padding: 0px;
        margin-top: -4em;
    }

    #dix{
        display: none;
        width: 100%;
        rotate: 6deg;
        padding: 30px;
    }

    #onze{
        display: none;
        width: 60%;
        rotate: -6deg;
    }

    #douze{
        display: none;
        width: 100%;
        rotate: 0deg;
    }
    
    #treize{
        position: absolute;
    width: 30%;
    rotate: 0deg;
    }
    
    #quatorze{
        width: 0%;
        rotate: 0deg;
        z-index: -1;
        position: absolute;
        right:10px;
        top: 105px;
    }
    
    #quinze{
        position:absolute;
        width: 80%;
        rotate: 0deg;
        z-index: -1;
        margin-top: 21em;
        margin-left: -9em;
        padding-bottom: 5em;
    }

    .footer_content{
        /*display: flex;*/
        display: none;
        font-size: 23px;
        margin-left: -0.5em;
        text-align: center;
    }
    
    .footer_content_2{
        display: none;
        /*display: flex;*/
        flex-direction: column;
    }

    .footer_content_telephone{
        display: flex;
        flex-direction: column;
        font-size: 23px;
        margin-left: -0.5em;
        text-align: center;
    }

    footer{
        position: fixed;
        height: 70px;
        width: 100%;
    }
}