/* large screens */
/* ------------- */
@media (min-width: 1280px) {
    .main {
        margin: 0 auto;
        width:1280px;
    }

    #photoune{
        background:url(../mep/fond.jpg) no-repeat center;
        height:950px;
        background-size: cover; 
    }

    #photoune figure{
        width:750px; 
        margin-left: auto;
        margin-right: auto;
        margin-top:0px;
    }

    #photoune img{
        margin-top:100px;
    }

    header h2 {
        margin:10px 0 0 0;  
        font-size: 3.6rem;
        letter-spacing:0.4rem;
    }

    header h3 {
        margin:0;  
        font-weight: 300;
        font-size: 2rem;
        letter-spacing:0.5rem;
    }

    .contacthead{
        float:right;
    }

    #tel, #mail {margin-right:60px;}

    .logoheader{
        float:left;
        width: 40%;
        margin-bottom: 10px;
    }

   

    #facebook2{
        display: none;
    }
    
    
    

    #insta2{
        display: none;
    }
    
    #photounebis{
        background:url(../mep/fondlauris.jpg) no-repeat center;
        height:600px;
        background-size: cover; 
        text-align: center;
        margin-top:60px;
    }

    #photounebis h2{
        color:#fff;
        border: 2px solid #fff;
        padding: 10px 25px;
        display:inline-block;
        margin-top: 200px;
        font-weight: 400; 
        font-size:3.6rem;
        background:rgba(0, 0, 0, 0.4)
    }

    #photounebis p{
        color:#000;
        background: #fff;
        padding: 10px 25px;
        display:inline-block;
        margin-top: 15px; 
    }


    header nav li{
        display:inline-block;
        position:relative;
        padding:0px 25px 5px;
        vertical-align: top;
        border-right: 1px solid #fff;
        margin-top: 3px;
        margin-bottom: 0px;
        text-align: center;
    }
    header nav li:first-child{
        padding-left: 0;
    }

    header nav li:last-child{
        border-right: none;
        padding-right: 0;
    }



    .nav{
        padding: 25px 0 2px;
        position: -webkit-sticky;
        background-color: rgba(112, 128, 144, 0.98);
    }

    .sticky {
        position: fixed;
        width: 100%;
        left: 0;
        top: 0;
        z-index: 100;
        border-top: 0;
    }

    .home H1 {
        margin:80px 0;   
    }

    .cartouche {
        width: 309px;
        margin: 0 auto;
    }


    .tarifs h3 {
        min-height: 80px;
    }

    .tarifs1 {
        padding-top: 22px;  

    }

    .tarifs2 {
        padding-top: 10px;   
    }


    .chambres  h2 {
        display:none;   
    }

    .maison, .gaelle {
        margin-bottom: 50px;
    }

    .maison blockquote {
        margin:20px 55px 30px 0;
        width: 35%;
        float: right;
        text-align: right;}

    .maison p{
        margin-bottom: 35px; 
        width: 62%;
    }

    .gaelle p{
        margin-bottom: 45px; 
        width: 37%;
    }



    .boutongalerie a:link, .boutongalerie a:visited {
        border: 1px solid #ccc;
        padding: 15px;
        text-align: center;
        display:block;
        margin: 20px;
        background: #edf4fb;
        font-size: 1.8rem;
    }

    .boutongalerie a:hover { background-color: #a7bdd3;}

    .footcontact{
        float:left;
        width:25%;
        margin-right: 25px;
    }

    .gal {
        margin-bottom: 90px;   
    }

    .gal h2 {
        margin-bottom: 25px;
    }

    .gal h3 {
        color:#737373;
        margin-top: 0;
        font-weight: 700;

    }

    .myls aside {
        float: left;
        width:23%;
        margin-right: 15px;
    }

    .myls img {
        margin-left: 8px;
    }



    footer ul{
        margin:5px 0 35px 10px;   
        font-weight: 300;
    }

    footer li{
        margin-bottom: 8px;
    }
}


/* medium screens */
/* -------------- */
@media (min-width: 960px) and (max-width: 1279px) {

    .main {
        margin: 0 auto;
        padding:0 20px;
    }

    #photoune figure{
        width:750px; 
        margin-left: auto;
        margin-right: auto;
        margin-top:0px;
    }

    #photoune img{
        margin-top:70px;
    }

    #photoune{
        background:url(../mep/fond.jpg) no-repeat center;
        height:650px;
        background-size: cover; 
    }

    header h2 {
        margin:10px 0 0 0;  
        font-size: 3rem;
        letter-spacing:0.4rem;
    }

    header h3 {
        margin:0;  
        font-weight: 300;
        font-size: 2rem;
        letter-spacing:0.3rem;
    }

    #tel, #mail {margin-right:20px;}

    .logoheader{
        margin: 0 auto;
        width: 350px;
    }

    #facebook2:before {
        content: "\ea91";  
        font-family: 'icomoon';
        color:#bdc4d3;
        margin-right: 5px;
    }

    #facebook1{
        display: none;
    }
    
     #insta2:before {
        content: "\ea92";  
        font-family: 'icomoon';
        color:#bdc4d3;
        margin-right: 5px;
    }

    #insta1{
        display: none;
    }
    
    
    header nav li{
        display:inline-block;
        position:relative;
        padding:0px 25px 5px;
        vertical-align: top;
        border-right: 1px solid #fff;
        margin-top: 3px;
        margin-bottom: 0px;
        text-align: center;
    }
    header nav li:first-child{
        padding-left: 0;
    }

    header nav li:last-child{
        border-right: none;
        padding-right: 0;
    }

    #photounebis{
        background:url(../mep/fondlauris.jpg) no-repeat center;
        height:600px;
        background-size: cover; 
        text-align: center;
        margin-top:60px;
    }

    #photounebis h2{
        color:#fff;
        border: 1px solid #fff;
        padding: 10px 25px;
        display:inline-block;
        margin-top: 200px;
        text-shadow: 0 0 7px rgba(0,0,0, 2); 
        font-size:3.6rem;
    }

    #photounebis p{
        color:#000;
        background: #fff;
        padding: 10px 25px;
        display:inline-block;
        margin-top: 15px; 
    }


    .nav{
        padding: 25px 0 0;
        text-align: center;
        position: -webkit-sticky;
        background-color: rgba(112, 128, 144, 0.98);
    }

    .sticky {
        position: fixed;
        width: 100%;
        left: 0;
        top: 0;
        z-index: 100;
        border-top: 0;
    }

    .cartouche {
        width: 309px;
        margin: 0 auto;
    }
    
    .chambres h2 {
        display: none;
    }

    .maison p{
        width: 55%;
    }

    .gaelle figure {
        width:70%;
        margin-left: 25px;
    }
    
    .myls aside{
        width:25%;
        float: left;
    }
    
    .myls article{
        width:70%;
        float: right;
    }
    
    .myls figure{
        margin-top: 0;
    }

    .tarifs h3 {
        min-height: 80px;
    }

    .tarifs1 {
        padding-top: 22px;  

    }

    .tarifs2 {
        padding-top: 10px;   
    }

    .footcontact{
        float:left;
        width:25%;
        margin-right: 15px;
    }

}


/* small screens */
/* ------------- */
@media (min-width: 640px) and (max-width: 959px) {
    .main {
        margin: 0 auto;
        padding:0 20px;
    }

    #photoune figure{
        width:750px; 
        margin-left: auto;
        margin-right: auto;
        margin-top:0px;
    }

    #photoune img{
        margin-top:70px;
    }

    #photoune{
        background:url(../mep/fond.jpg) no-repeat center;
        height:650px;
        background-size: cover; 
    }

    #photounebis{
        background:url(../mep/fondlauris.jpg) no-repeat center;
        height:600px;
        background-size: cover; 
        text-align: center;
        margin-top:60px;
    }

    #photounebis h2{
        color:#fff;
        border: 1px solid #fff;
        padding: 10px 25px;
        display:inline-block;
        margin-top: 200px;
        text-shadow: 0 0 7px rgba(0,0,0, 2); 
        font-size:3.6rem;
    }

    #photounebis p{
        color:#000;
        background: #fff;
        padding: 10px 25px;
        display:inline-block;
        margin-top: 15px; 
    }

    #facebook2:before {
        content: "\ea91";  
        font-family: 'icomoon';
        color:#bdc4d3;
        margin-right: 5px;
    }
    
    #insta2:before {
        content: "\ea92";  
        font-family: 'icomoon';
        color:#bdc4d3;
        margin-right: 5px;
    }
    
    header span {
        margin-right: 20px;
    }

    #insta1{
        display: none;
    }

    .logoheader{
        margin: 0 auto;
        width: 350px;
    }

    header nav li{
        display:inline-block;
        position:relative;
        padding:0px 25px 5px;
        vertical-align: top;
        border-right: 1px solid #fff;
        margin-top: 3px;
        margin-bottom: 0px;
        text-align: center;
    }
    header nav li:first-child{
        padding-left: 0;
    }

    header nav li:last-child{
        border-right: none;
        padding-right: 0;
    }

    .nav{
        padding: 25px 0 0;
        position: -webkit-sticky;
        background-color: rgba(112, 128, 144, 0.98);
    }

    .sticky {
        position: fixed;
        width: 100%;
        left: 0;
        top: 0;
        z-index: 100;
        border-top: 0;
    }


    .maison p{
        width: 45%;
    }
    
    .maison figure{
        width: 53%;
    }


    .cartouche {
        margin: 0 auto;
    }
    
    .chambres h2 {
        display: none;
    }
    
    .tarifs h3 {
        min-height: 135px;
    }

    .tarifs1 {
        padding-top: 50px;  

    }

    .tarifs2 {
        padding-top: 10px;   
    }

    .footcontact{
        float:left;
        width:25%;
        margin-right: 15px;
    }

}

/* tiny screens */
/* ------------ */
@media (max-width: 639px) {
    #photoune{
        display: none;
    }
    
    .main {
        margin: 0 auto;
        padding:0 10px;
    }

    .logoheader{
        margin: 0 auto;
        width: 350px;
    }
    
    .nav{
        padding: 25px 0 0;
        position: -webkit-sticky;
        background-color: rgba(112, 128, 144, 0.98);
    }
    
    .nav ul{
     list-style: none;   
    }
    
    .nav li{
     text-align: center;
        padding-bottom: 5px;
        border-bottom: 1px dashed #CCC;
    }
    
    
    #tel, #mail, #facebook2, #insta2 {
        display: block;
    }
    
    #facebook2:before {
        content: "\ea91";  
        font-family: 'icomoon';
        color:#bdc4d3;
        margin-right: 5px;
    }

    #facebook1{
        display: none;
    }
    
    #insta2:before {
        content: "\ea92";  
        font-family: 'icomoon';
        color:#bdc4d3;
        margin-right: 5px;
    }

    #insta1{
        display: none;
    }
    
    .cartouche {
        margin: 0 auto;
    }
    
    .prechambre {
        display: none;
    }
    
    
}


/* ----------------------------- */
/* ==Styles généraux             */
/* ----------------------------- */

p, ul {
    font-size:1.8rem;
    margin: 0 0 15Px 0;
}
header{
    padding: 25px 0;
    color:#FFF;
}

header h2 { 
    font-weight: 400;
    color:#FFF;
}



blockquote
{
    font-style:italic;
    font-size:2rem;
    margin-left:32px;
    padding-left: 48px;
    min-height: 30px; 
    font-weight: 300;
    margin-bottom: 30px;
}

header ul a{
    color:#cdd6de;
}

#contact a,   #contacthome a, footer a{
    color:#FFF;
}

#contacthome{font-size:1.6rem; padding-top:25px; text-align: center;}
#contact{font-size:1.6rem; padding-top:15px;text-align: center;}

#tel:before {
    content: "\e958";  
    font-family: 'icomoon';
    color:#bdc4d3;  
    margin-right: 5px;
}
#mail:before {
    content: "\e945";  
    font-family: 'icomoon';
    color:#bdc4d3;
    margin-right: 5px;
}

header ul {
    border-top: 1px solid #fff;
    padding-left: 0;
}


.frise {
    margin-bottom: 50px;    
}

.cartouche {
    background: #708090;
    color:#fff;
    text-align: center;
    padding: 20px 0;
    font-size: 2rem;
    font-weight: 300;
}

.gal img {
    box-shadow: 0 0 15px 5px rgba(30, 30, 30, 0.1);
}

.chambres article {
    border-right:1px solid #ccc;
    padding: 0 20px;
}

.chambres article h2 {
    text-align: center;   
}

.prechambre h2 {
    text-align: center;   
}
.chambres article:last-child {
    border-right:none;   
}

figcaption {
    margin: 5px 0 35px 0;
    text-align: center;
    font-size: 1.7rem;
}

.lauris {
    margin-top: 30px;
}
.lauris figcaption{
    font-size: 1.4rem;   
}


#inside a{
    color:#fff;  
}

.tarifs article
{
    border:1px solid #cdd6de;   
}

.tarifs article p
{
    text-align: center;
}

.tarifs h3 {
    text-align: center;
    background: #627688;
    margin-top: 0;
    color:#fff;
    font-size: 2.2rem;
}

.sstarifs{
    font-size: 1.8rem;
    font-weight: 300;
    display: block;
}


.prix {
    font-weight: 700; 
    color:#708090;
    margin:10px 0;
    font-size: 2.2rem;
}

.reservation {
    float:right;
    width: 30%;
    border: 1px solid #ccc;
}

.reservation h3{
    background: #e7eef4;
    min-height:  auto;
}

.reservation p {
    padding: 0 20px;
}


.bouton {
    display: inline-block;
    margin: 40px auto;
    text-align: center;
    border: 1px solid #000;
    padding: 15px 25px;
}


footer  {
    background-color: rgba(112, 128, 144, 0.98);
    color:#fff;
    padding-top: 30px;   
}

footer h3{
    margin: 0;   
}

footer p{
    padding:10px 0;
    margin: 0;
    font-weight: 300;
    font-size: 1.6rem;
}

footer ul{
    font-weight: 300;
    font-size: 1.6rem;
}

#EmplacementDeMaCarte {
    height: 320px;
    margin: 0;
}