

.home-container {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-around;
}

.home-container >div:nth-child(1) {
    background-color:rgb(240, 235, 183);
}
.home-container >div:nth-child(2) {
    background-color:lightcyan;
}
.home-container >div:nth-child(3) {
    background-color:powderblue;
}
.home-container >div:nth-child(4) {
    background-color:seashell;
}
.home-container >div:nth-child(5) {
    background-color:lightsalmon;
}
.home-container >div:nth-child(5) {
    background-color:lightgreen;
}
.home-container >div:nth-child(6) {
    background-color:honeydew;
}
.home-container p {
    border: 1px solid gray;
    width:500px;
    padding:5px;
}
.home-container > div {
    border: 1px solid gray;
    width:500px;
    padding:5px;
    flex-grow:1;
}
.home-container > div > header {
    width: 100%;
    display: flex;
    align-items: center;
    font-family: verdana;
    justify-content: center;
    margin-bottom:5px;
    height:2em;
}



.home-container > div > header a {
    text-decoration: none;
}


.home-container > div > footer {
    text-align: center;
    width: 100%;
    display: inline-block;
}

.home-container > div > a {
    display: flex;
    flex-direction:column;

    align-items: center;
    justify-content: center;
    text-decoration: none;
    margin-bottom: 0.5em;
}

.home-container > div > a > span  {
    padding-bottom:0.5em;
    margin:1em;
    font-size:1.8em;
    border-bottom: 4px orange solid;
    text-align: center;
}

.home-container > div > a  > img {
    cursor: pointer;
    height:auto;
    margin: auto;
    max-width: 100%;
    max-height: 100%;

    height: 300px;
}
/*
.picture-container {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-around;
}

.picture-container > p {
    border: 1px solid gray;
    width:500px;
    padding:5px;
}

.picture-container > p > a {
    display: block;
    width:500px;
}

.picture-container > p > a  > img {
    cursor: pointer;
    height:auto;
    margin: auto;
    width:500px;
}

.picture-container > p > span {
    text-align: center;
    width: 100%;
    display: inline-block;
}
*/
.imghome {
    cursor: pointer;
    height:auto;
    margin: auto;
    display: block;
}

.imgyoga {
    width:300px;
}
.imgclass {
    width:500px;
}
.imgclass2 {
    height:300px;
}
.go {
    text-align: center;
    width: 100%;
    display: inline-block;
}
.go a {
    font-family: verdana;
}
.description {
    text-align: center;
    width: 100%;
    display: inline-block;
}
.background {
    opacity:0.2;
    position:absolute;
    top: 95px;
    left:25%;
    max-width:75%;
}
.background-right {
    opacity:0.2;
    position:absolute;
    top: 95px;
    left:635px;
}
.background2 {
    opacity:0.2;
    position:absolute;
    top: 75px;
    left:0%;
    z-index:0;
}

.bruyere {
    width:350px;
    position:absolute;
    top: 58px;
    right:5%;
    z-index:0;
}

thead td {
    font-weight: bold;
}
.align-right {
    text-align: right;
}
.align-center {
    text-align: center;
    padding-left: 10px;
}
body {
    font-family: verdana;
} 

.contactcontainer {
    float:right;
}
.contact {
    list-style-type: none;
    margin:1px 5px;
    padding: 0;
    overflow: hidden; 
}

ul.contact > li {float: left;}

ul.contact li a {
    display: inline-block;
    color: black;
    text-align: center;
    padding: 3px 10px;
    text-decoration: none;
    transition: 0.3s;
    font-size: 15px;
    font-family: verdana;
}
body {
    overflow-x: hidden;
    margin:0px;      
}



.tdpad {
    padding-left:10px;
}


form div {
    margin-top:1em;
}

form span {
    display:block;
    font-size:4vw;
    margin-bottom:0.5em;
}
form input[type='text'] {
    margin-left:1em;
    min-width:500px;
    max-width: 1000px;
    width:90%;
}

form textarea {
    margin-left:1em;
    width:90%;
    min-width:500px;
    max-width: 1000px;
    min-height:200px;
}

.facebook {
    vertical-align: middle;
    margin-left:10px;
    margin-right:5px;
}

.bio-pictures {
    display:flex;
    flex-flow:row wrap;
    justify-content: center;
}
.bio-pictures img {
    height:300px;
}

h1 {
    cursor: pointer;
}
#hamburger {
    background-image: url("../images/menu-alt-32.png");
    background-size:contain;
    position: absolute;
    top: 15px;
    left: 15px;
    z-index: 2;
    cursor:pointer;
}

.li-lng {
    position:fixed;
    bottom: 10px;
    text-align:right;
}

form {
    background-color:lightcyan;
}
form .buttons {
    margin:3px;
    padding:0.5em;
}

.footer {
    background-color:#111;
    padding:0.5em 0.5em;
    margin-top:5px;
    height:6em;
    color:white;
 }
 .footer div {
     width:100%;
 }
 .footer a {
     display:block;
     color:white;
     display: table-cell; 
 }
 .footer img {
     width:1em;
     height:1em;
     margin-right:5px;
     vertical-align: middle;
 }
 .map-container {
     display: flex;
     flex-flow: row wrap;
     justify-content: space-around;
 }
 
 .map-container p {
     border: 1px solid gray;
     padding:5px;
 }
 

.nav-trigger {
    position: absolute;
    clip: rect(0, 0, 0, 0);
    width: 30px;
    height: 30px;
}


.navigation li ul {
    padding-left:1em;
}

/* Navigation Menu - List items */
.navigation li {
    padding: 0.1em;
    border-top: 1px solid #111;
    border-bottom: 1px solid #000;
    display: block;
}

.navigation {
    list-style: none;
    background: #111;
    height: 100%;
    position: fixed;
    right: 2%;
    bottom: 0;
    left: 0;
    z-index: 0;
}
        
.navigation li span {
    color: white;
}
.navigation li a {
    text-decoration: none;
    color: white;
    background: linear-gradient(135deg, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%);
    transition: color 0.2s, background 0.5s;
}

.navigation li a:hover {
    color: #c74438;
    background: linear-gradient(135deg, rgba(0,0,0,0) 0%,rgba(75,20,20,0.65) 100%);
}

.nav-trigger + label, .site-wrap {
    transition: left 0.2s;
}

#close-sidebar-nav {
    position: fixed;
    visibility: hidden;
    opacity: 0;
    text-decoration: none;
    top: 0;
    left: 0;
    font-size: 1.4em;
    color: #313131;
    padding: 10px;
    height: 100%;
    background: rgba(0, 0, 0, .8);
    right: 0;
    z-index: 100000;
    cursor: pointer;
    transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
}

.nav-trigger:checked + #close-sidebar-nav {
    opacity: 0.8;
    visibility: visible;
}

.site-wrap {
    min-width: 100%;
    min-height: 100%;
    background-color: #fff;
    position: relative;
    top: 0;
    bottom: 100%;
    left: 0;
    z-index: 1;
    display:flex;
    flex-direction: column;
}
.site-wrap > div:first-child {
    padding-left: 10px;
    flex-grow:1;
}

@media only screen and (max-device-width: 799px)   {
    .footer {
        font-size:3.5vw;
    }
    #hamburger {
        width: 70px;
        height: 70px;
    }
    .site-wrap {
        background-color:beige;        /*ghostwhite;*/
    }
    .home-container {
        font-size:2em;
    }
    .nav-trigger:checked ~ .site-wrap {
        left: 700px;
    }
    .nav-trigger:checked + label {
        left: 700px;
    }
    .navigation {
        width: 700px;
        top: -80px;
        font-size:4em;
        padding-top:1em;
        padding-left:0.2em;
    }    
    .nav-trigger:checked + #close-sidebar-nav {
        left: 700px;
    }

    .li-lng {
        width:670px;
    }
   

    .navigation li {
        padding: 0.1em;
    }
    .navigation li ul {
        padding-left:0.1em;
    }
    
  
    h1 {
        font-size:3.5em;
        margin:0px 0px 5px 100px;
        padding-top:10px;
    }
    h2 {
        font-size:3em;
    }
    .flag {
        width:70px;
        height: 50px;
    }
    form input {
        font-size:3em;
    }
    form .buttons input {
        font-size:3em;
        padding:0.2em;
    }

    .map-container p {
        width:90%;
        padding:5px;
        font-size:3em;
    }
    .map-container iframe {
        width:100%;
        height:500px;
    }
    .map-container img {
        width:100%;
    }
    .tarif {
        font-size:2em;
    }

}

@media all and (min-device-width: 800px)  {
    .footer {
        font-size:2vw;
    }
    .site-wrap {
        background-color:ghostwhite;
        /*ghostwhite;*/
    }
    #hamburger {
        width: 30px;
        height: 30px;
    }

    h1 {
        margin:0px 0px 5px 60px;
        padding-top:10px;
    }
    .nav-trigger:checked ~ .site-wrap {
        left: 280px;
    }
    .nav-trigger:checked + label {
        left: 280px;
    }
    .nav-trigger:checked + #close-sidebar-nav {
        left: 280px;
    }
    
    .navigation {
        width: 260px;
        top: -25px;
        font-size:1.5em;
        padding-top:1em;
        padding-left:1em;
    }    
    .navigation li ul {
        padding-left:1em;
    }
    
    /* Navigation Menu - List items */
    .navigation li {
        width: 250px;
        padding: 0.1em;
    }
    form input {
        font-size:2em;
    }

    .map-container p {
        width:600px;
        padding:5px;
    }
    .map-container img {
        width:600px;
    }
    .map-container iframe {
        width:600px;
        height:450px;
    }
}



  .flag {
      position: absolute;
      right:15px;
      top:20px;
  }

