@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Ysabeau+Office:wght@1;100;200;300;400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Babylonica&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Tangerine:wght@700&display=swap');

* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    font-family: 'Ysabeau Office', 'sans-serif';
    font-weight: 400;
}

nav>ul>li {
    display: block;
    width: 20vw;
    text-align: center;
    float: left;
    height: 100%;
    background-color: rgb(49, 49, 49);
}

nav>ul>li:not(:first-child):hover {
    background-color: rgb(73, 73, 73);
}

nav>ul>li:first-child>a {
    font-family: 'Babylonica', 'sans-serif';
    font-size: 2em;
    padding-top: .15em;
}

ul {
    list-style-type: none;
    height: 100%;
    float: left;
    /* border:2px solid orange; */
}

nav>ul {
    /* border:2px solid blue; */
    height: 3em;
    background-color: rgb(49, 49, 49);
    color: rgb(237, 237, 237);
}

.burger {
    display: block;
    appearance: none;
    height: 100%;
    width: 3.5em;
    float: left;
    background: url(../img/burger.svg);
    background-size: 2em;
    background-repeat: no-repeat;
    background-position: center;
}

.burger:checked {
    background: url(../img/burger_close.svg);
    background-size: 2em;
    background-position: center;
    background-repeat: no-repeat;
}

.burger-dropdown {
    display: none;
    color: rgb(49, 49, 49);
    background-color: rgb(237, 237, 237);
}

nav {
    background-color: rgb(49, 49, 49);
    height: 3em;
}
.container{
    display: flex;
    justify-content: center;
    align-items: center;
    height:100vh;
}
.erreur404{
    display: block;
    width:320px;
}
.erreur404 p{
    text-align: justify;
}
.erreur404 img{
    display:block;
    width:320px;
}
.erreur404 h2{
    text-align: center;
}

footer {
    background-color: rgb(49, 49, 49);
    color: rgb(237, 237, 237);
    text-align: center;
    padding: .75em 0;
    position: sticky;
    display: block;
    width: 100%;
    bottom:0;
    font-size: .8em;
    z-index:1000000;
}

.gal1 {
    background-image: url(../img/OeilSmooky2.jpg);
    background-position: center;
}

.gal2 {
    background-image: url(../img/Raisins.jpg);
    background-position: center;
}

.gal3 {
    background-image: url(../img/Altea.jpg);
    background-position: left;
}

.gal1 .lien {
    background-color: #6F3F35;
}

.gal2 .lien {
    background-color: #8C8956;
}

.gal3 .lien {
    background-color: #8C4332;
}

.conteneur {
    display: block;
}

body {
    background-color: white;
}

#presence {
    background-image:url(../img/Présence.jpg);
}

#altea {
    background-image: url(../img/Altea.jpg);
}

#divine {
    background-image: url(../img/Divine.jpg);
}

#deface {
    background-image: url(../img/De\ face.jpg);
}

#charly {
    background-image: url(../img/Charly_.jpg);
}

#oeilsmooky {
    background-image: url(../img/OeilSmooky2.jpg);
}

#divineoeil {
    background-image: url(../img/DivineOeil.jpg);
}

#rosita {
    background-image: url(../img/Rosita.jpg);
}

#dosrosita {
    background-image: url(../img/DosRosita.jpg);
}

#first {
    background-image: url(../img/First.jpg);
}

#flexion {
    background-image: url(../img/flexion.jpg);
}

#otanais {
    background-image: url(../img/Otanais.jpg);
}

#quietude {
    background-image: url(../img/Quietude.jpg);
}

#ali {
    background-image: url(../img/Ali.jpg);
}

#apso {
    background-image: url(../img/Apso.jpg);
}

#barbizon1 {
    background-image: url(../img/Barbizon1.jpg);
}

#barbizon2 {
    background-image: url(../img/Barbizon2.jpg);
}

#barbizon3 {
    background-image: url(../img/Barbizon3.jpg);
}

#barbizon4 {
    background-image: url(../img/Barbizon4.jpg);
}

#barbizon5 {
    background-image: url(../img/Barbizon5.jpg);
}

#barbizon6 {
    background-image: url(../img/Barbizon6.jpg);
}

#barbizon7 {
    background-image: url(../img/Barbizon7.jpg);
}

#barbizon8 {
    background-image: url(../img/Barbizon8.jpg);
}

#cali {
    background-image: url(../img/Migou.jpg);
}

#echecs {
    background-image: url(../img/Echecs.jpg);
}

#heidi {
    background-image: url(../img/Heidi.jpg);
}

#houra {
    background-image: url(../img/Houra.jpg);
}

#isabelle {
    background-image: url(../img/Isabelle.jpg);
}

#narkos {
    background-image: url(../img/Narkos.jpg);
}

#narkos2 {
    background-image: url(../img/Narkos2.jpg);
}

#odessa {
    background-image: url(../img/Odessa.jpg);
}

#okapik {
    background-image: url(../img/Okapik.jpg);
}

#raisins {
    background-image: url(../img/Raisins.jpg);
}

#rio {
    background-image: url(../img/Rio.jpg);
}

#rosi2 {
    background-image: url(../img/Rosi2.jpg);
}

#smooky {
    background-image: url(../img/Smooky.jpg);
}

#tresor {
    background-image: url(../img/Trésor.jpg);
}

#tulipes {
    background-image: url(../img/Tulipes.jpg);
}

#tyto {
    background-image: url(../img/Tyto.jpg);
}

#tomates {
    background-image: url(../img/tomates.jpg);
}

#daisy {
    background-image: url(../img/Daisy.jpg);
}

#aurore {
    background-image: url(../img/Aurore2.jpg);
}
#adham{
    background-image: url(../img/Adham.jpg);
}
#ariella{
    background-image: url(../img/Ariella.jpg);
}
#bandreano{
    background-image: url(../img/Bandreano.jpg);
}
#caraibes{
    background-image:url(../img/Caraibes.jpg) ;
}
#shams{
    background-image: url(../img/Shams.jpg);
}
#baraq{
    background-image: url(../img/Baraq.jpg);
}
#rufia{
    background-image: url(../img/Rufia.jpg);
}
#aleya{
    background-image: url(../img/Aleya.jpg);
}
#adnan{
    background-image: url(../img/Adnan.jpg);
}
#saphir{
    background-image: url(../img/Saphir.jpg);
}
#kenz{
    background-image: url(../img/Kenz.jpg);
}
#kaskade{
    background-image: url(../img/kaskade.jpg);
}
#emperador{
    background-image: url(../img/Emperador.jpg);
}
#appolo{
    background-image: url(../img/Appolo.jpg);
}
#chat{
    background-image: url(../img/Chat.jpg);
}
#doudou{
    background-image: url(../img/Doudou.jpg);
}
#barbizon9{
    background-image: url(../img/barbizon9.jpg);
}
#barbizon10{
    background-image: url(../img/Barbizon10.jpg);
}
#barbizon11{
    background-image: url(../img/Barbizon11.jpg);
}
#barbizon12{
    background-image: url(../img/Barbizon12.jpg);
}
#barbizon13{
    background-image: url(../img/Barbizon13.jpg);
}
#barbizon14{
    background-image: url(../img/Barbizon14.jpg);
}
#barbizon15{
    background-image: url(../img/Barbizon15.jpg);
}
#barbizon16{
    background-image: url(../img/Barbizon16.jpg);
}
#barbizon17{
    background-image: url(../img/Barbizon17.jpg);
}
#nahaar{
    background-image: url(../img/Nahaar.jpg);
}
#markajev{
    background-image: url(../img/Markajev.jpg);
}
#img0590{
    background-image: url(../img/IMG_0590.jpg);
}
#danseur{
    background-image: url(../img/Danseur.jpg);
}
#cerf{
    background-image: url(../img/Cerf.jpg);
}
#busteAizelin{
    background-image: url(../img/BusteAizelin.jpg);
}
#vache{
    background-image: url(../img/IMG_0638.jpg);
}
#goya{
    background-image: url(../img/Goya.jpg);
}
#oeil2{
    background-image: url(../img/Oeil2.jpg);
}
#pommes{
    background-image: url(../img/Pommes.jpg);
}
#regnier{
    background-image: url(../img/Regnier.jpg);
}
li>a {
    display: block;
    text-decoration: none;
    color: rgb(237, 237, 237);
    height: 100%;
    padding-top: .75em;
}

article {
    min-height: calc(100vh - 5.3em);
}

.barresup {
    height: 5em;
    background-color: rgb(0, 0, 0);
}

.barresup p {
    font-family: 'Babylonica', 'sans-serif';
    text-align: center;
    font-size: 3.5em;
    color: rgb(237, 237, 237);
    padding-top: .1em;
    user-select: none;
}

.image-slideshow {
    position: relative;
    margin: auto;
    display: block;
}
.image-slideshow-tel {
    position: relative;
    margin: auto;
    display: block;
}
.image img {
    /* height:calc(100vh - 7.3em); */
    display: block;
    margin:auto;
}

.fade {
    animation-name: fade;
    animation-duration: 3s;
}

@keyframes fade {
    from {
        opacity: .4
    }

    to {
        opacity: 1
    }
}

.icone{
    width:4.5em;
    height:4.5em;
    padding:1em;
    display: inline-block;
    margin:auto;
}
.icone img{
    width:100%;
}
.colonne{
    width:50%;
    float:left;
    color:white;
    text-align: center;
}
.colonne h2,.colonne p{
    margin:1em;
    color:white;
}
.contenu{
    background-color: #ccb667;
    display: flex;
    padding-bottom:1em;
}
.icones{
    margin:auto;
    display:inline;
}
.contenublanc{
    background-color: rgb(237, 237, 237);
}
.contenublanc h2{
    color:#ccb667;
    font-weight: 700;
    text-transform: uppercase;
    text-align: center;
    padding-bottom:.5em;
    padding-top:1em
}
.liengalerie{
    margin:auto;
    display: flex;
    align-items: center;
    justify-content: center;
}
.liengalerie img{
    width:100%;
}
.lien2{
    color: #ccb667;
    
    text-align: center;
    background-color: rgb(49, 49, 49);
    position:absolute;
    text-transform: uppercase;

    font-weight: 600;
    z-index:5;
}
.jaune{
    position:relative;
    margin:auto;
    display: flex;
    margin:auto;
}
.jaune2{
    z-index:4;
    background-color: #ccb66700;
    width:100%;
    height:100%;
    position:absolute;
}
.jaune2:hover{
    animation-name:jaunissement;
    animation-duration:2s;
    animation-fill-mode: forwards;
}
@keyframes jaunissement{
    from{
        background-color: #ccb66700;
    }
    to{
        background-color: #ccb6678d;
    }
}
.grandconteneur{
    display:block;
    margin-top:1em;
}
.contenugris{
    background-color:rgb(237, 237, 237);
    color:#ac9235;
    text-align: center;
}
.contenugris h2{
    font-family: 'Babylonica', 'sans-serif';
    padding-top:1em;
}
.contenugris p{
    padding-bottom: 1em;
}
.contenugris hr{
    width:70vw;
    color: #ac9235;
    margin:auto;
    margin-bottom: 3em;
}
#grossissement:hover{
    font-size:1.7em;
    margin:.8em;
}
.colonne a{
    color:white;
    text-decoration: none;
}

.imgfond{
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    margin:auto;
    box-shadow: 3px 3px 3px rgb(73, 73, 73);
}
.infos{
    padding:1em;
}
.gras{
    font-weight:700;
}
.tuile{
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    float:left;
    border:2px solid rgb(73, 73, 73);
}
.tuile a{
    width:100%;
    height:100%;
    display:block;
}
.images{
    margin: auto;
    margin-top:0;
}
.form{
    display: block;
    padding-top:2em;
    float:left;
}
input[type="submit"]{
    cursor: pointer;
    background-color: rgb(49,49,49);
    border: none;
    text-transform: uppercase;
    color: #ccb667;
    padding: 1em;
    text-decoration: none;
}
input[type="email"],input[type="text"],textarea{
    margin-top:.5em;
    margin-bottom: .5em;
    padding:.5em;
    font-size:1em;
}
.contact{
    float:left;
    padding:4em 3em 0 3em;
}
.contact h2{
    font-size:3em;
    color: #ccb667;
    font-weight:600;
}
.contact p{
    display: block;
    height:1.5em;
    padding:1em 0 1em 0;
}
.contact a{
    color: black;
    text-decoration:none;
}
.contact a:hover{
    color: #ccb667;
}
.icone_contact{
    display: inline-block;
    height:1.5em;
    width:1.5em;
    float:left;
    padding:1em 0 1em 0;
    margin-right:.5em;
}
.icone_contact img{
    width:100%;
}
.bandeau{
    height:10em;
    border:2px solid red;
    clear:both
}
.galerie_infos{
    padding-top:1.5em;
}
.galerie_infos a{
    text-decoration: none;
    color:black
}
.galerie_infos:hover{
    background-color: rgb(219, 219, 219);
}

.cross{
    background-image: url(../img/cross.svg);
}
.check{
    background-image: url(../img/check.svg);
}
#floue{
    background-image: url(../img/photo_floue.jpg); 
}
#lumiere_ok{
    background-image: url(../img/lumiere_ok.jpg);
}
#basse_res{
    background-image: url(../img/resolution.jpg);
}
#lumiere_moche{
    background-image: url(../img/lumiere_moche.jpg);
}
#contreplongee{
    background-image: url(../img/contreplongee.jpg);
}
#cadrage_moche{
    background-image: url(../img/cadrage_moche.JPG);
}
#net{
    background-image: url(../img/nettete.jpg);
}
#hd{
    background-image: url(../img/resolution_ok.jpg);
}
#angle_ok{
    background-image: url(../img/angle_ok.jpg);
}
#cadrage_ok{
    background-image: url(../img/cadrage_ok.jpg);
}
.lien2>a{
    text-decoration: none;
    color: #ccb667;
}
fieldset{
    border: 1px solid #ac9235;
    margin:auto;
    padding:1em;
}
fieldset>div>p{
    text-indent: 1em;
}
legend{
    color:#ac9235;
    text-transform: uppercase;
    font-size: 1.5em;
    font-weight: 600;
    padding:0 .5em 0 .5em;
}

blockquote p{
    color:#ccb667;
    font-size: 2.5em;
    font-family: 'Tangerine','sans-serif';
}
blockquote cite{
    position: relative;
    font-size:.7em;
}
fieldset img{
    width:50%;
    display: block;
}
.caption{
    display: grid;
    grid-template-columns: repeat(6, 16.6666666%);
}
.galerie_encadrement{
    grid-row: 1;
    grid-column: 1 / span 6;
    background-size: cover;
}
.galerie_encadrement img{
    width: 80%;
    margin: auto;
}
#icone1,#icone2,#icone3,#icone4,#icone5,#icone6{
    grid-row:2;
    height:6vw;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    margin:0.5vw;
    margin-top:2vw;
}
#icone1{
    grid-column:1;
    background-image: url(../img/croquis.png);
}
#icone2{
    grid-column:2;
    background-image: url(../img/RosiEncadre.jpg);
}
#icone3{
    grid-column:3;
    background-image: url(../img/OtanaisEncadre.jpg);
}
#icone4{
    grid-column:4;
    background-image: url(../img/HeidiEncadre.jpg);
}
#icone5{
    grid-column:5;
    background-image: url(../img/IsabelleEncadre.jpg);
}
#icone6{
    grid-column:6;
    background-image: url(../img/SmookyEncadre.jpg);
}
@media screen and (min-width:768.5px) {
    .avendre{
        padding:2em 6em 0 6em
    }
    blockquote{
        display: flex;
    }
    blockquote cite{
        margin-top: 2em;
    }
    .choix_photos{
        width:60%;
        display: flex;
        background-color: rgb(237, 237, 237);
        margin: auto;
    }
    .txt{
        width:60%;
        float:left;
        padding:1vw;
    }
    .photo{
        width:20%;
        height:12vw;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        float:left;
        margin:1vw;
    }
    .svg{
        width:4vw;
        height:4vw;
        margin-top:9vw;
        margin-left:9vw;
        border-radius:2vw;
        background-color: rgb(237, 237, 237);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }
}
@media screen and (min-width: 1024.5px) {
    .disparition{
        display: none;
    }
}
@media screen and (max-width: 1024.5px) {
    .disparition{
        display: flex;
    }
}
@media screen and (min-width: 1499.5px) {
    .contact{
        width:35%;
    }
    textarea{
        width:80%;
    }
    .form input[type="text"], .form input[type="email"]{
        width:40%
    }
    .form{
        width:50%;
    }
    .form{
        padding:3em;
        padding-top:1.5em;
    }
    .image-slideshow-tel{
        display: none;
    }
    .colonne{
        font-size:1em
    }
    .lien2{
        padding: 1em;
        font-size: 1.2em;
    }
    .contenublanc h2{
        font-size: 2em;
    }
    .contenugris p{
        font-size:1.2em;
    }
    .contenugris h2{
        font-size:6em;
    }
    .souscontenu{
        margin:auto;
        width:70vw
    }
    .liengalerie{
        width: 70vw;
    }
    .jaune{
        width:70vw;
    }
    .grandetuile{
        width:29.99vw;
        height:29.99vw;
    }
    .petitetuile{
        width:14.99vw;
        height:14.999999vw;
    }
    .petitetuile2{
        width:100%;
        height:14.999999vw;
    }
    .petitetuile3{
        width:50%;
        height:14.999999vw;
    }
    .largetuile2{
        width:100%;
        height:14.999999vw;
    }
    .largetuile{
        width:29.99vw;
        height:14.999999vw;
    }
    .hautetuile{
        width:14.999999vw;
        height:29.99vw;
    }
    .imgfond{
        width:13vw;
        height:13vw;
    }
    .galerie_infos{
        width:16.66666666%;
        text-align: center;
        float:left
    }   
    .text{
        width:50%;
        margin:auto;
        color:rgb(49,49,49);
        padding-bottom:0em;
    }
    .images-tablette {
        display: none;
    }

    .conteneur {
        overflow-x: hidden;
        background-color: rgb(49, 49, 49);
    }

    .burger {
        display: none;
    }

    .galerie {
        width: 33.33%;
        filter: grayscale(.5);
        background-size: cover;
        background-repeat: no-repeat;
        justify-content: center;
        display: flex;
        align-items: center;
        float: left;
        transition: width .2s;
        height: calc(100vh - 5.3em);
    }

    .galerie:hover {
        width: 50%;
    }

    .conteneur:hover .galerie:not(:hover) {
        width: 25%;
    }

    .lien {
        display: none;
        color: rgb(237, 237, 237);
        padding: 1em;
        text-align: center;
    }

    .galerie:hover {
        filter: none;
    }

    .galerie:hover .lien {
        display: inline-block;
    }

    .images {
        width: 90vw;
    }

    table {
        table-layout: fixed;
        column-width: 16.666666%;
        width: 100%;
        background-color: rgb(49, 49, 49);
    }

    td,
    th {
        height: 14.999999vw;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        border: 1px solid rgb(49, 49, 49)
    }

    td {
        filter: grayscale(.5);
    }

    td:hover {
        filter: none;
    }
}
@media screen and (max-width: 1499.5px){
    .contact{
        width:50%;
    }
}
@media screen and (max-width:1199.5px){
    blockquote p{
        font-size:2em;
    }
}
@media screen and (max-width:949.5px){
    blockquote p{
        font-size:1.7em;
    }
}
@media screen and (max-width:849.5px){
    blockquote p{
        font-size:1.5em;
    }
    blockquote cite{
        font-size:.6em;
    }
}
@media screen and (max-width: 1499.5px) and (min-width: 1024.5px) {
    .form{
        width:50%;
    }
    .form{
        padding:3em;
        padding-top:1.5em;
    }
    .form input[type="text"], .form input[type="email"]{
        width:60%;
    }
    textarea{
        width:100%;
    }
}
@media screen and (max-width: 1024.5px) and (min-width: 768.5px) {
    .contact{
        display: none;
    }
    .form{
        width:60%;
        margin:auto;
    }
    .form input[type="text"], .form input[type="email"]{
        width:70%;
    }
    textarea{
        width:100%;
    }
}
@media screen and (max-width: 1499.5px) and (min-width: 768.5px) {
    .image-slideshow-tel{
        display: none;
    }
    .colonne{
        font-size:1em
    }
    .lien2{
        padding: 1em;
        font-size: 1.2em;
    }
    .contenublanc h2{
        font-size: 2em;
    }
    .contenugris p{
        font-size:1.2em;
    }
    .contenugris h2{
        font-size:6em;
    }
    .souscontenu{
        margin:auto;
        width:70vw
    }
    .liengalerie{
        width: 70vw;
    }
    .jaune{
        width:70vw;
    }
    .grandetuile{
        width:29.99vw;
        height:29.99vw;
    }
    .petitetuile{
        width:14.99vw;
        height:14.999999vw;
    }
    .petitetuile2{
        width:100%;
        height:14.999999vw;
    }
    .petitetuile3{
        width:50%;
        height:14.999999vw;
    }
    .largetuile2{
        width:100%;
        height:14.999999vw;
    }
    .largetuile{
        width:29.99vw;
        height:14.999999vw;
    }
    .hautetuile{
        width:14.999999vw;
        height:29.99vw;
    }
    .imgfond{
        width:18vw;
        height:18vw;
    }
    .galerie_infos{
        width:25%;
        text-align: center;
        float:left
    }
    .text{
        width:50%;
        margin:auto;
        color:rgb(49,49,49);
        padding-bottom:0em
    }
    .images-tablette {
        display: none;
    }

    .conteneur {
        overflow-x: hidden;
        background-color: rgb(49, 49, 49);
    }

    .burger {
        display: none;
    }

    .galerie {
        width: 33.33%;
        filter: grayscale(.5);
        background-size: cover;
        background-repeat: no-repeat;
        justify-content: center;
        display: flex;
        align-items: center;
        float: left;
        transition: width .2s;
        height: calc(100vh - 5.3em);
    }

    .galerie:hover {
        width: 50%;
    }

    .conteneur:hover .galerie:not(:hover) {
        width: 25%;
    }

    .lien {
        display: none;
        color: rgb(237, 237, 237);
        padding: 1em;
        text-align: center;
    }

    .galerie:hover {
        filter: none;
    }

    .galerie:hover .lien {
        display: inline-block;
    }

    .images {
        width: 90vw;
    }

    table {
        table-layout: fixed;
        column-width: 16.666666%;
        width: 100%;
        background-color: rgb(49, 49, 49);
    }

    td,
    th {
        height: 14.999999vw;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        border: 1px solid rgb(49, 49, 49)
    }

    td {
        filter: grayscale(.5);
    }

    td:hover {
        filter: none;
    }
}

@media screen and (max-width: 768.5px) {
    .avendre{
        padding:2em 2em 0 2em
    }
    blockquote cite{
        margin:0;
        padding:0;
        text-align:right;
        display: inline-block;
        width:100%;
    }
    blockquote p{
        padding-bottom: 0;
        margin-bottom:0;
    }
    .choix_photos{
        width:60%;
        display: grid;
        grid-template-columns: repeat(2, 50%);
        background-color: rgb(237, 237, 237);
        margin: auto;
    }
    .txt{
        grid-row: 1;
        grid-column: 1 / span 2;
        padding:1vw;
    }
    .txt p, fieldset>div>p{
        font-size: 0.9em;
    }
    .txt h2{
        font-size:1.4em;
    }
    .photo{
        height:26vw;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        float: left;
    }
    .photog{
        grid-column: 1 / 2;
        grid-row: 2;
        margin:2vw;
    }
    .photod{
        grid-column: 2 / 2;
        grid-row: 2;
        margin:2vw;
    }
    .svg{
        width:8vw;
        height:8vw;
        margin-top:20vw;
        margin-left:19vw;
        border-radius:4vw;
        background-color: rgb(237, 237, 237);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }
    .contact{
        display: none;
    }
    .form input[type="text"], .form input[type="email"]{
        width:70%;
    }
    textarea{
        width:95%;
    }
    .form{
        width:100vw;
        margin:auto;
    }
    .colonne{
        font-size:1em
    }
    .lien2{
        padding: 1em;
        font-size: 1.2em;
    }
    .contenublanc h2{
        font-size: 2em;
    }
    .contenugris p{
        font-size:1.2em;
    }
    .contenugris h2{
        font-size:6em;
    }
    .souscontenu{
        margin:auto;
        width:70vw
    }
    .liengalerie{
        width: 100vw;
    }
    .jaune{
        width:100vw;
    }
    .grandetuile{
        width:59.999998vw;
        height:59.99vw;
    }
    .petitetuile{
        width:29.999999vw;
        height:29.999999vw;
    }
    .petitetuile2{
        width:100%;
        height:29.999999vw;
    }
    .petitetuile3{
        width:50%;
        height:29.999999vw;
    }
    .largetuile2{
        width:100%;
        height:29.999999vw;
    }
    .largetuile{
        width:59.99vw;
        height:29.999999vw;
    }
    .hautetuile{
        width:29.999999vw;
        height:59.99vw;
    }
    .imgfond{
        width:25vw;
        height:25vw
    }
    .galerie_infos{
        width:33.33333333%;
        text-align: center;
        float:left
    }
    .text{
        width:70%;
        margin:auto;
        color:rgb(49,49,49);
        padding-bottom:0em
    }

    .images{
        width: 90vw;
    }

    table {
        table-layout: fixed;
        column-width: 33.3333333%;
        width: 100%;
    }

    td,
    th {
        height: 29.999999vw;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        border: 1px solid rgb(49, 49, 49)
    }

    nav ul {
        display: none;
    }

    .burger:checked+.burger-dropdown {
        display: block;
        height: 12em;
        max-width: 300px;
        width: 100%;
        position: absolute;
        margin-top: 3em;
        z-index: 1000;
    }

    .burger-dropdown a {
        height: 3em;
        width: 100%;
        display: block;
        text-decoration: none;
        text-align: center;
        color: rgb(49, 49, 49);
        padding-top: .75em;
    }

    .burger-dropdown a:hover {
        background-color: rgb(219, 219, 219);
    }

    .galerie {
        height: calc(33.3333vh - 1.7666em);
        width: 100%;
        filter: grayscale(.5);
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
        justify-content: center;
        display: flex;
        align-items: center;
        float: left;
        transition: width .2s;
    }

    .lien {
        display: inline-block;
        color: rgb(237, 237, 237);
        padding: .7em;
        font-size: .7em;
        text-align: center;
    }

    .galerie:hover {
        filter: none;
    }

    .conteneur {
        overflow-x: hidden;
        width: 70%;
        margin: auto;
    }

    body {
        background-color: white;
    }
}
@media screen and (max-width: 768.5px) and (min-width: 599.5px){
    .image-slideshow-tel{
        display: none;
    }
}
@media screen and (max-width: 599.5px) {
    .image-slideshow{
        display: none;
    }
    .colonne{
        font-size:1em
    }
    .lien2{
        padding: 1em;
        font-size: 1.2em;
    }
    .contenublanc h2{
        font-size: 2em;
    }
    .contenugris p{
        font-size:1.2em;
    }
    .contenugris h2{
        font-size:6em;
    }
    .souscontenu{
        margin:auto;
        width:100vw
    }
    .imgfond{
        width:35vw;
        height:35vw
    }
    .galerie_infos{
        width:50%;
        text-align: center;
        float:left
    }
}
@media screen and (min-width:425.5px){
    fieldset{
        width:60%;
    }
}
@media screen and (max-width: 425.5px) {
    fieldset{
        width:90%;
    }
    .choix_photos{
        width:90%;
    }
    .photo{
        height:41vw;
    }
    .svg{
        width:12vw;
        height:12vw;
        border-radius: 6vw;
        margin-top:31vw;
        margin-left:30vw;
    }
    .txt p, fieldset>div>p{
        font-size: 0.8em;
    }
    .txt h2{
        font-size:1.2em;
    }
    .form input[type="text"], .form input[type="email"]{
        width:100%;
    }
    textarea{
        width:100%;
    }
    .form{
        width:100vw;
        margin:auto;
    }
    .colonne{
        font-size:.8em;
    }
    .text{
        font-size:.8em;
    }
    .lien2{
        padding: .7em;
        font-size: .8em;
    }
    .contenublanc h2{
        font-size: 1.5em;
    }
    .contenugris p{
        font-size:1em;
    }
    .contenugris h2{
        font-size:4em;
    }
    .images{
        width:100vw;
    }
    .grandetuile{
        width:66.666666%;
        height:66.66vw;
    }
    .petitetuile{
        width:33.333333%;
        height:33.333333vw;
    }
    .petitetuile2{
        width:100%;
        height:33.333333vw;
    }
    .petitetuile3{
        width:50%;
        height:33.333333vw;
    }
    .largetuile2{
        width:100%;
        height:33.333333vw;
    }
    .largetuile{
        width:66.66%;
        height:33.333333vw;
    }
    .hautetuile{
        width:33.333333%;
        height:66.66vw;
    }
    .conteneur {
        width: 100%;
    }
    .imgfond{
        width:65vw;
        height:65vw
    }
    .galerie_infos{
        width:100%;
        text-align: center;
        float:left
    }
}