.cookiesplease-shown{ margin-top: 80px;}
#cookiesplease{ min-height:80px;}
#cookiesplease p{ max-width:70%}

#cookiesplease a{color:#fa7a01;}
#cookiesplease .cookiesplease-accept {
    background: #888888;
    text-align: center;
    color: white;
    line-height: 25px;
    padding: 3px 8px;
    margin: 0px;
    height: auto;
}
.cookiesplease.cookiesplease-hidden{ display: none;}

#global{
    position: relative;
    width: 100%;
    height: 100%;

}

#blockContent{
    position: relative;
    z-index:100;
    width: 100%;
}


#blockContent,
#blockMenu{
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}



#blockPage #blockMenu{ left: -380px;}
#blockPage #blockContent{ left: 0px;}
/***


#blockPage.close #blockMenu{ left: -300px;}

#blockPage.open #blockContent{ left: 300px; }

***/


#blockPage.open{ overflow-x: hidden;}
#topWrapper{ position:relative;}


#btnMenu{
    background: url(../images/picto_menu.png) center center no-repeat;
    position: absolute;
    top:50px;
    left:100px;


    display: block;
    width: 50px;
    height: 50px;
    font-size: 0px;
    z-index: 500;

    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

a.booknow-btn{
    position: absolute;
    top:50px;
    left:160px;
    height: 50px;
    z-index: 10;
    background-color: transparent !important;
    color: white !important;
    border: 1px solid white !important;
}




#global #header{
    position: relative;
    z-index:2000;
    width: 100%;
}

#global #header .bg{
    position: fixed;
    left:0px;
    background-image:url(../images/bg_header.png);
    background-repeat: no-repeat;
    background-size:cover;
    height: 99px;
    width: 100%;

}

.catHostel #global #header .bg{
    background-image:url(../images/fond_hostel.jpg);
    background-repeat: no-repeat;
    background-size:cover;
}

.catMeeting #global #header .bg{
    background-image:url(../images/fond_meeting.jpg);
    background-repeat: no-repeat;
    background-size:cover;
}
.catSelf #global #header .bg{
    background-image:url(../images/fond_self.jpg);
    background-repeat: no-repeat;
    background-size:cover;
}






#global #header #logo{
    padding-top: 10px;
    width:160px;
    margin: auto;
}

#global #header #logo a img{
    height: auto;
    width: 100%;
}


#global #header #btnReservez{
    background: url(../images/bg_reservez.png) center center no-repeat;
    position: absolute;
    top:24px;
    left: 140px;

    padding-top:11px;
    padding-left: 50px;

    display: block;
    width: 227px;
    height: 50px;

    color:#ffffff;

    z-index: 500;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}



.de-de #global #header #btnReservez{
     background: url(../images/bg_reservez_de.png) center center no-repeat;
     width: 270px;
}



#global #header #btnMenu{

    position: absolute;
    top:24px;
    left:50px;


}


#global #header .breadcrumbs{
    padding-left: 50px;
    padding-top: 134px;
}



/**********ZONE MENU**********/
#blockMenu{
    position: fixed;
    top: 0px;
    left: 0px;
    width: 380px;
    height: 100%;
    float:left;
    z-index: 400;
}

#blockMenu #menu{
    background-image:url(../images/bg_menu.jpg);
    background-repeat: no-repeat;
    background-size:cover;
    width: 380px;
    float: left;
    height: 100%;
}

#blockMenu #menu .slide{
}

#blockPage.close #menu .slide{ margin-left: -380px;}
#blockPage.open #menu .slide{ }





#blockMenu .titre{
    font-family:OpenSans-Light, sans-serif;
    font-size: 36px;
    font-weight:normal;
    color:#ffffff;
    text-transform: uppercase;
    line-height: 36px;
    padding-top: 23px;
    padding-left: 50px;
    padding-bottom: 45px;
}
#displayM{
    display:none;
    float: right;
    margin-right: 40px;
    opacity:0.5;
}

/**********MENU - LANGUE*********/
#blockMenu .mod-languages{
    background: rgba(255,255,255,0.1);
    border-top: 1px solid rgba(0,0,0,0.2);
    border-bottom: 1px solid rgba(255,255,255,0.3);
    padding: 35px 0px 35px 50px ;
}

#blockMenu .mod-languages a{ opacity: 0.5;}
#blockMenu .mod-languages .lang-active a{ opacity: 1;}


#blockMenu a{ color: #ffffff;}

#blockMenu ul.menu li{ margin: 0px;}
#blockMenu .menu ul{ list-style: none; display: none; padding: 10px 0;}
#blockMenu .menu .active ul{ display: block}

#blockMenu .menu  .show{ display: block;}

#blockMenu .menu > li{
    line-height: 45px;
}

#blockMenu .menu > li ul li{
    line-height: inherit;
}

#blockMenu .menu  li > a,
#blockMenu .menu  li > .separator{
    background: rgba(255,255,255,0.1);
    border-top: 1px solid rgba(255,255,255,0.2);
    margin: 0px;
    min-height: 50px;
    padding:0px 0px  0px 50px !important;
    cursor:pointer;
}

#blockMenu .menu ul li .separator,
#blockMenu .menu ul li a{
    background: none;
    border:none;
    min-height: inherit;
    font-size: 14px;
    line-height: 14px;
    padding:10px 0px 10px 70px !important;
}
.item-576>span{
    font-weight: bold;
    color: #faaf68;
    padding:20px 0px 20px 70px !important;
}

#blockMenu .menu ul li{
    background: none;
    border-top: none;
    margin: 0px;
    min-height: auto;
}

#blockMenu .menu li .separator,
#blockMenu .menu li a{
    display: block;
    color:#ffffff;
}




#blockMenu ul li .separator:hover,
#blockMenu ul li a:hover{
    color:#c0c0c0;
}


#blockMenu  .menu  > li.parent > a:after ,
#blockMenu  .menu  > li.parent > .separator:after{
    content: "+";
    display: block;
    float: right;
    margin-right: 50px;
}

#blockMenu  .menu >  li.parent.active > a:after,
#blockMenu  .menu >  li.parent.active > .separator:after{ content: "-"; }


#blockMenu .item-497,
#blockMenu .item-498,
#blockMenu .item-496,
#blockMenu .item-495,
#blockMenu .item-345,
#blockMenu .item-344,
#blockMenu .item-343,
#blockMenu .item-172,
#blockMenu .item-140,
#blockMenu .item-139,
#blockMenu .item-157,
#blockMenu .item-229,
#blockMenu .item-230,
#blockMenu .item-271,
#blockMenu .item-272,
#blockMenu .item-492,
#blockMenu .item-493,
#blockMenu .item-494{ display: none;}

#blockMenu .menusecondaire{ padding: 40px 0px;}
#blockMenu .menusecondaire li{ padding-bottom: 10px;}
#blockMenu .menusecondaire span,
#blockMenu .menusecondaire a{ padding-left: 50px; color: #ffffff; font-size: 14px;}



#blockMenu  .blockSearch{ padding: 33px 50px;}
#blockMenu .search{
    background: rgba(255,255,255,0.15);
    border-radius:5px;
    font-family: "Open Sans";
    border: 1px solid rgba(255,255,255,0.2);
    color: #ffffff;
    font-size: 16px;
    height: 50px;
    white-space : nowrap;
    padding: 0px 0px 0 25px;
}

#blockMenu .search input{
    background: none;
    font-family: "Open Sans";
    border: none;
    padding: 0px 0px;
    color: #ffffff;
    font-size: 16px;
    height: 50px;
    float: left;
}

#blockMenu .search input[type=text]{

    width: 80%;
}

#blockMenu .search input.button{
    background: url(../images/picto_recherche.png) center center no-repeat;
    height:50px;
    width:20%;
    padding: 0px;
    font-size: 0px;

}


/**********PANEL**********/


#panelSocial{
    background: rgba(202,199,198,0.7);
    position: fixed;
    left:0px;
    top: 50%;
    margin-top: -120px;
    z-index: 100;
    height: 240px;
    width: 50px;
    text-align: center;
    padding-top: 14px;
    border-top-right-radius:5px;
    border-bottom-right-radius: 5px;
}


#panelSocial .titre{
    position: absolute;
    bottom: 50px;
    right: -18px;
    display: inline-block;
    color: #ffffff;
    transform: rotate(-90deg);
    font-size: 18px;
    width: 86px;
   text-transform: uppercase;


}

#panelSocial a{ display: inline-block; margin-bottom: 6px;}

#panelSocial a.gp{
    margin-bottom:100px;
}

#panelContact{
    position: fixed;
    right:0px;
    top: 150px;
    z-index: 100;
}


#panelContact .onglet{
    background:  rgba(250,122,1,0.75);
    width:53px;
    height:200px;
    z-index: 200;
    border-top-left-radius:5px;
    border-bottom-left-radius: 5px;
}

#panelContact .onglet a{
    background: url(../images/picto_reserver.png) center 149px no-repeat;
    display: block;
    width:53px;
    height:200px;
    overflow: hidden;
   }

#panelContact .onglet a span{
    display: block;
    font-family: 'OpenSans-Light';
    font-size: 22px;
    color:#ffffff;
    width:200px;
    height:53px;
    text-align: center;
    -webkit-transform: translate(-32%,73px) rotate(-90deg);
    transform:translate(-32%,73px) rotate(-90deg);

}

#panelFAQ{
    position: fixed;
    right:0px;
    top: 50%;
    margin-top:-65px;
    z-index: 1000;

}


#panelFAQ .onglet{
    background: rgba(250,122,1,0.75);
    width:53px;
    height:130px;
    z-index: 200;
    border-top-left-radius:5px;
    border-bottom-left-radius: 5px;
}


#panelFAQ .onglet a{
    background: url(../images/picto_faq.png) center 90px no-repeat;
    display: block;
    width:53px;
    height:130px;
    overflow: hidden;
   }

#panelFAQ .onglet a span{
    display: block;
    font-family: 'OpenSans-Light';
    font-size: 22px;
    color:#ffffff;
    width:130px;
    height:53px;
    text-align: center;

    -webkit-transform: translate(-22%,27px) rotate(-90deg);
    transform:translate(-22%,27px) rotate(-90deg);

}





/**********GOOGLE MAP**********/
#googleMap{ position: relative; clear: both}

#googleMap #map-canvas{
    background: url(../images/bg_footer.jpg) center bottom no-repeat;
    width : 100% !important;
    height: 419px !important;
}

#googleMap .info{
    position: absolute;
    left: 50%;
    top:129px;
    margin-left: -392px;
    max-width:785px;
}

#googleMap .visuel,
#googleMap .adresse{
    border-radius:5px;
    width: 390px;
    height: 247px;
    float: left;
}

#googleMap .visuel{  background: url(../images/visuel_google_map.png) center bottom no-repeat; margin-right: 5px;}
#googleMap .visuel a{ display: block; height: 100%; width: 100%;}

#googleMap .adresse{ background: rgba(255,255,255,0.85);}

#googleMap .adresse .position{
    padding-top: 30px;
    width: 145px;
    margin: auto;

}

#googleMap .adresse .titre{
    background: url(../images/picto_adresse.png)top left no-repeat;
    padding-left: 50px;
    padding-bottom: 30px;
    color: #222222;
}
#googleMap .adresse .titre a{ color: #222222;}

#googleMap .adresse h4{
    text-align: center;
    color:#fa7a01;
    font-size: 24px;
    font-weight: normal;
    text-transform:  uppercase;
}

#googleMap .adresse p{
    font-family: 'OpenSans-Light';
    text-align: center;
    color: #222222;
    font-size: 16px;}

/**********FOOTER************/
#footer{
    background: #ffffff;
    height:100px;
    padding-top: 25px;
}



#footer #blockSocial{  padding-top: 8px; float:right}

#footer #blockSocial a{
    margin-left: 5px;
    display: inline-block;
}


#footer .acymailing_module div.titre{
    background: url(../images/picto_titre_news.png) center left no-repeat;
    padding-left: 50px !important;
    width: 250px;
    float: left;
    font-family: 'OpenSans-Light';
    font-size: 24px;
    line-height: 24px;
}


.de-de #footer .acymailing_module div.titre{ width:280px;}

#footer .acymailing_module .acysubbuttons,
#footer .acymailing_module .fieldacyemail{
    text-align: left;
    width: 260px;
    float: left;
}

#footer .acymailing_module .acysubbuttons{ margin-left:22px;}

#footer .acymailing_module .inputbox{
    border:1px solid #55b128;
    width: 100%;
    height: 50px;
    color:#999999;
}

#footer .acymailing_module .btn-primary{
    background: url(../images/picto_valider.png) 75px 12px no-repeat  #55b128;
    border-radius: 5px;
    border:1px solid #55b128;
    width: 100%;
    height: 50px;
    color: #ffffff;
    font-size: 16px;
    text-align: left;
    padding-left: 110px;
}


#footer #blockSocial .titre{
    float: left;
    font-family: 'OpenSans-Light';
    font-size: 20px;
    line-height: 32px;
}