@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Lato:400,300,300italic,400italic,700,700italic,900,900italic,100italic,100|Playfair+Display:400,400italic,700,700italic,900,900italic);
/*---  HTML5 READY ---*/
html { font-size: 62.5%; }
body { background: #F4F4F0; color: #333; font-family: 'Lato', sans-serif; overflow-x: hidden; }
article, footer, header, main, aside, nav{ -webkit-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; }
.cycle-slideshow, .cycle-slide, .gmap div { transition: none !important; -webkit-transition: none !important; -ms-transition: none !important; -o-transition: none !important; }
main:after, section:after, header:after, aside:after, footer:after, nav:after, form:after, article:after, ul:after, div:after { clear: both; content: ""; display: block; font-size: 0; height: 0; line-height: 0; visibility: hidden; width: 0; }
h2 { font-family: 'Playfair Display', serif; font-weight: 500; font-size: 5.8rem; line-height: 6rem; text-align: center; letter-spacing: 1px; max-width: 780px; margin: 0 auto; }
h2 span { font-family: 'Lato', sans-serif; font-weight: 700; font-size: 1.2rem; text-transform: uppercase; display: block; clear: both; }
h3 { font-family: 'Lato', sans-serif; font-weight: 500; font-size: 1.4rem; letter-spacing: 1px; text-align: center; max-width: 460px; margin: 15px auto 75px auto; }
h3 p { font-family: 'Lato', sans-serif; font-weight: 500; font-size: 1.4rem; }
p { color: #333; font-size: 1.6rem; font-family: "Times New Roman", Times, serif; }
a { text-decoration: none; color: #333; }
a:hover { color: #005086; }
/*---------------*/
/* GEN */
/*---------------*/
main { margin: 0 auto; width: 100%; position: relative; }
main > section:first-child { margin: 70px 0 0 0; padding: 0; }
main > section { padding: 70px 0 0 0; }
.home main .col_2 { padding: 0, }
.restaurant .col_2{ padding: 100px 0 0 0;}
.ontop { color: #FFF; }
.ontop:hover { color: #FFF; }
.services #section1 { padding: 70px 0 0 0; }
.presse h1{ font-family: 'Playfair Display', serif; font-weight: 500; font-size: 5.8rem; line-height: 6rem; text-align: center; letter-spacing: 1px; max-width: 780px; margin: 0 auto; }
/**/
.nivo-lightbox-close{ background:#FFF; padding:5px 10px; border-radius:20px;}
.nivo-lightbox-close:hover{ background:rgba(0,80,134,0.5); color:#FFF;}
.nivo-lightbox-overlay{ background:rgba(0, 32, 62,0.98);}
.nivo-lightbox-nav{ background:rgba(0,80,134,1);}
.nivo-lightbox-nav:hover{ background:rgba(0,80,134,0.5);}
/**/
.sitemap h2{ padding:40px 0;}
.sitemap ul li { list-style: none; font-size: 1.8rem; margin: 0 10px; padding: 10px; text-align: center; text-transform: uppercase; }
.adresses, .resto { margin: 0 auto; max-width: 960px; width: 100%; }
.contact h2 { font-size: 2.2rem; }
/**/
.treeview{ margin:40px;}
.presse .treeview li{color:#666; list-style:none; padding:5px 0;}
.treeview li a{ font-size:1.6rem; text-transform:uppercase; text-decoration:none;}
.treeview li span{ font-style:italic; color:#666;}
/**/
#scrollmouse { bottom: 2%; left: 50%; position: absolute; transform: translate(-50%, 0px); z-index: 8000; }
#scrollmouse .m { border: 2px solid #fff; border-radius: 25px; height: 45px; margin: 20px auto 0; position: relative; -webkit-transition: transform 0.3s ease-out 0.9s, opacity 0.3s ease-out 0.9s; -ms-transition: transform 0.3s ease-out 0.9s, opacity 0.3s ease-out 0.9s; -o-transition: transform 0.3s ease-out 0.9s, opacity 0.3s ease-out 0.9s; transition: transform 0.3s ease-out 0.9s, opacity 0.3s ease-out 0.9s; width: 28px; z-index: 8000; }
#scrollmouse .m::before { animation-duration: 2s; animation-iteration-count: infinite; animation-name: mouseScroll; border: 2px solid white; border-radius: 10px; content: ""; height: 10px; left: 50%; margin: 0 0 0 -3px; position: absolute; top: 8px; width: 6px; }
@keyframes mouseScroll {
0%, 50% {
 opacity: 1;
 transform: translateY(0px);
}
90% {
 opacity: 0;
 transform: translateY(20px);
}
91% {
 opacity: 0;
 transform: translateY(0px);
}
}
.confirm{ text-align:center; font-size:1.8rem;}
/*---------------*/
/* WYSI */
/*---------------*/
main > section.wysi { margin: 130px auto 0 auto; max-width: 960px; width: 100%; }
.wysi p { font-size: 14px; margin: 15px 0; }
.wysi ul li { color: #fff; font-size: 14px; list-style-image: url("../images/dot.png"); margin: 0 0 0 30px; }
.wysi a { text-decoration: underline; }
.wysi h2 {  font-size: 2.2rem; line-height:normal;}
/*---------------*/
/* MODULES */
/*---------------*/
/*slider*/
.slider img { width: 100%; }
.home .slider { margin: 0 !important; }
.tour .slider, .spa .slider { padding: 100px 0 0 0; }
/* timelpase */
.timelapse { border-top: 1px solid #dfdfdf; margin: 80px auto; }
.timelapse .container_vid { border: 2px solid #DFDFDF; width: 70%; padding: 15px; max-width: 860px; margin: 30px auto; }
.video iframe, .video object, .video embed, .video video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; max-width: auto; max-height: auto; }
/**/
/* 2 colones */
.col_2 { text-align: center; }
.col_2 article { -moz-column-count: 2; -webkit-column-count: 2; -o-column-count: 2; column-count: 2; -moz-column-gap: 41px; -webkit-column-gap: 41px; -o-column-gap: 41px; column-gap: 41px; -webkit-column-rule-width: 1px; -webkit-column-rule-color: #E0E0E0; -webkit-column-rule-style: solid; -moz-column-rule-width: 1px; -moz-column-rule-color: #E0E0E0; -moz-column-rule-style: solid; -o-column-rule-width: 1px; -o-column-rule-color: #E0E0E0; -o-column-rule-style: solid; column-rule-width: 1px; column-rule-color: #E0E0E0; column-rule-style: solid; max-width: 640px; margin: 0 auto; text-align: justify; }
.spa .col_2 article { margin: 0 auto 100px; }
.spa_btn { display: block; width: 220px; line-height: 40px; color: #FFF; background: #353230; margin: 0 auto; text-align: center; font-size: 1.6rem; border-radius: 5px; }
.spa_btn:hover { color: #FFF; background: #6B5644; }
.entete { position: relative; margin: 0 0 70px 0; }
.entete h1 { position: absolute; top: 50%; left: 50%; color: #FFF; font-family: 'Playfair Display', serif; font-weight: 500; font-size: 6.2rem; text-transform: uppercase; }
.entete img { width: 100%; }
.services .col_2 { padding: 0 0 80px 0 !important; }
/* gallery*/

.gallery {  max-width: 1008px; width: calc(100% - 20px); padding: 0; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap;  margin: 80px auto 60px auto; position: relative; text-align: center;} 
.gallery figure {  -webkit-box-flex: 0;  -webkit-flex: 0 0 auto;  -ms-flex: 0 0 auto;  flex: 0 0 auto; overflow: hidden; position: relative; text-align: center; cursor: pointer; border:5px solid rgb(244, 244, 240);}
.gallery figure img { position: relative; width: 100%;}
.gallery figure figcaption { backface-visibility: hidden; color: #fff; font-size: 1.25em; padding: 2em; text-transform: uppercase; display:block;}
.gallery figure figcaption::before, .grid figure figcaption::after { pointer-events: none; }
.gallery figure figcaption, .grid figure figcaption > a { height: 100%; left: 0; position: absolute; top: 0; width: 100%; }
.gallery figure figcaption > a { font-size: 0; opacity: 0; text-indent: 200%; white-space: nowrap; z-index: 1000; position:absolute; top:0; left:0; width:100%; height:100%;}
.gallery figure figcaption p { font-family: 'Lato', sans-serif; font-size: 2rem; text-transform: uppercase; color: #FFF; position: absolute; top: 45%; }
/* gallery monaco */
.monaco .gallery figure:nth-child(1) { width:100%; }
.monaco .gallery figure:nth-child(2) { width:50%; }
.monaco .gallery figure:nth-child(3) { width:50%; }
.monaco .gallery figure:nth-child(4) { width:33.3334%; }
.monaco .gallery figure:nth-child(5) { width:66.6666%; }
.monaco .gallery figure:nth-child(6) { width:50%; }
.monaco .gallery figure:nth-child(7) { width:50%; }
.monaco .gallery figure:nth-child(8) { width:66.6666%; }
.monaco .gallery figure:nth-child(9) { width:33.3334%; }
.monaco .gallery figure:nth-child(10) { width:50%; }
.monaco .gallery figure:nth-child(11) { width:50%; }
/* gallery residences */
.residences .gallery { padding: 0; }
.residences .gallery figure:nth-child(3) { width:100%;}
.residences .gallery figure:nth-child(4) { width:66.6666%;}
.residences .gallery figure:nth-child(5) { width:33.3334%;}
.residences .gallery figure:nth-child(6) { width:33.3334%; }
.residences .gallery figure:nth-child(7) { width:66.6666%; }
.residences .gallery figure:nth-child(8) { width:66.6666%; }
.residences .gallery figure:nth-child(9) { width:33.3334%; }
.residences .gallery figure:nth-child(10) { width:33.3334%; }
.residences .gallery figure:nth-child(11) { width:66.6666%; }
.residences .gallery figure:nth-child(12) { width:50%; }
.residences .gallery figure:nth-child(13) { width:50%; }
.residences .gallery figure:nth-child(14) { width:100%;}
.residences .gallery figure:nth-child(15) { width:66.6666%; }
.residences .gallery figure:nth-child(16) { width:33.3334%; }
.residences .gallery header{ padding:0 10px; margin:0 auto;}
.residences .gallery article{ margin:0 auto 60px auto; padding:0 10px;}
/* gallery services */
.services .gallery{ width:auto; max-width:685px;}
.services .gallery figure { border:5px solid rgb(255, 255, 255);}
.services .gallery figure:nth-child(1) { width:50%;}
.services .gallery figure:nth-child(2) { clear: both; width:50%;}
.services .gallery figure:nth-child(3) { padding: -246px 10px 0 5px; width:50%;}
.services .gallery figure:nth-child(4) { padding: -246px 0 0 0; width:50%;}
/* gallery spa */
.spa .gallery figure:nth-child(1) { width:50%; }
.spa .gallery figure:nth-child(2) { width:50%; }
.spa .gallery figure:nth-child(3) { width:66.6666%; }
.spa .gallery figure:nth-child(4) { width:33.3334%; }
/* gallery restaurant café */
.restaurant .gallery figure:nth-child(1) { width:50%; }
.restaurant .gallery figure:nth-child(2) { width:50%; }
.restaurant .gallery figure:nth-child(3) { width:50%; }
.infoxx{ padding:40px 0 0 0;  margin:0 0 50px; font-weight: 700; font-size: 1.8rem;}
.cafe_btns { text-align:center; margin:0 0 30px;}
.cafe_btns a{ font-size:2rem; text-transform:uppercase; border:1px solid #979797; color:#32332F; padding:20px 40px; margin:0 15px; width:50%; max-width:320px; display:inline-block; position:relative; font-family: 'Playfair Display', serif;}
.cafe_btns a:hover{ color: #005086; border:1px solid #005086; }
/* windows */
.window { max-width: 1034px; width: calc(100% - 20px); margin: 0 auto 60px auto; position: relative; text-align: center; }
.window figure { display: inline-block; float: left; margin: 5px; overflow: hidden; position: relative; text-align: center; cursor: pointer; }
.window figcaption h2 { color: #FFF; line-height: 4rem; position: absolute; top: 70px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); width: 80%; }
.window figcaption > a { color: #FFF; font-size: 12px; font-weight: 600; letter-spacing: 1px; position: absolute; bottom: 100px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }
.window figcaption > a:before { content: ''; background: url(../images/picto_plus.png) top center no-repeat; height: 35px; width: 35px; position: absolute; top: -40px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }
.window .txt { background: rgba(0,0,0,0.85); border: 4px solid rgba(255,255,255,0.8); position: absolute; top: 0; left: 0; bottom: 0; margin: 30px; opacity: 0; -webkit-transition: all 1.5s; transition: all 1.5s; }
.window .txt p { color: #FFF; font-size: 16px; padding: 70px; text-align: justify; }
/*.window figure:hover .txt { opacity: 1; }*/
.window .txt a.close { color: #FFFFFF; font-size: 14px; font-weight: 600; position: absolute; top: 20px; right: 20px; display: block; width: 20px; height: 20px; }
/* business */
.services .business { background: url(../images/business_pattern.png) left top repeat; padding: 100px 0 !important; margin: 60px 0 0 0; border: none !important; }
/* contact */
#form_contact { width: 90%; max-width: 1024px; margin: 0 auto; }
.contact_obligatoire { margin: 0 auto; font-size: 11px; color: #CCC; width: 200px; }
/*---------------*/
/* CUSTOM FORM */
/*---------------*/
input, textarea, select { border-radius: 0; background: #F4F4F0; border: 2px solid #D5D5D2; text-transform: uppercase; }
input[type="submit"] { background: #CCC; margin: 10px 0; }
input[type="submit"]:hover { background: #BB3B32; }
input:hover, textarea:hover, select:hover, file:hover { border-color: #BB3B32; }
input:focus, textarea:focus, select:focus, file:focus { border-color: #BB3B32; }
label span { background: #000; }
.selectElem:hover i, .selectElem:focus i { color: #BB3B32; }
input:hover + .checkbox, input:hover + .radio { border-color: #BB3B32; }
input:focus + .checkbox, input:focus + .radio { border-color: #BB3B32; }
input:focus + .radio::before { background: #BB3B32; }
input:focus + .checkbox::before { border-color: #BB3B32; }
input:checked + .checkbox, input:checked + .radio { border: 3px solid #BB3B32; }
.checkbox:before { border-color: #BB3B32; }
.radio::before { background: #BB3B32; }
.radioElem { float: left; margin: 0 10px; }
.form_authent input[type="submit"]:hover { background: #FFF; }
/*---------------*/
/*  POPUP ACTU */
/*---------------*/

/*---------------*/
/*  CARTE ODEON CAFE */
/*---------------*/
#cafe_actus{ background:#F4F4F0; color: #333;}
#cafe_actus h2{ font-size:4rem;}
#cafe_actus a{ color:#333; cursor:pointer; transition:all .5s;}
#btn_close{ position:fixed; top:10px; right:10px;}
/**/
#carte{ position:relative; width:80%; margin:0 auto; font-family: 'Lato', sans-serif; padding:0; transform:translateY(-70px); z-index:3000;}
.container_carte{ padding:40px 0 0; display:flex; position:relative;}
a.change_carte{ display:block; background:#FFF; height:44px; line-height:44px; padding:0 20px; color:#00355F; font-size:1.6rem; font-weight:600; position:absolute; top:20px; right:35px; z-index:100; transition:all .5s;}
a.change_carte:hover{ background:#00355F; color:#FFF;}
/**/
.nav_carte { background:#FFF; color:#00355F; width:40%; position:relative; padding:40px 50px; z-index:100; transform:translateY(-40px);}
.nav_carte h2{ font-family: 'Lato', sans-serif; text-align:left; font-size: 2.8rem; font-weight: 600; letter-spacing:1px;}
.nav_carte ul li{ list-style:none; position:relative;}
.nav_carte ul li:after{ content:''; background:#00355F; height:3px; width:0; position:absolute; top:14px; left:calc(100% + 10px); transition:all .5s; }
.nav_carte ul li.selected:after, .nav_carte ul li:hover:after{ width:40px; }
.nav_carte a{ font-size:1.4rem; font-weight:600;  color:#00355F; height:30px; line-height:30px; padding:0 0 0 10px; letter-spacing:1px; cursor:pointer; width:100%;}
.nav_carte .submenu{ display: flex; flex-direction: column;}
.nav_carte .submenu a{ padding: 0 0 0 20px; font-size: 1.2rem; color: #666; transition: all .5s; height: 0; overflow: hidden; transition: all .5s;}
.nav_carte .submenu.active a{ height: 30px;}
.nav_carte .submenu a:hover{ padding: 0 0 0 25px;}
.nav_carte .submenu a.selected{}
/**/
.content_carte { background:#002C4F; width:60%; position:relative; z-index:10; padding:40px;}
.content_carte:before{ content:''; background:url(../images/bg_carte_after.png) top left no-repeat; position:absolute; bottom:-115px; left:-20%; width:549px; height:75px;}
.content_carte:after{ content:''; ; position:absolute;  background:#002C4F; width:130%; bottom:-40px; left:-30%;  height:80px; visibility:visible;}
.content_carte h2{ font-family: 'Lato', sans-serif; text-align:left; font-size: 2.4rem; text-transform: uppercase; color:#FFF; letter-spacing:2px;}
.content_carte > div{ position: relative; margin:20px 0;}
.content_carte p{ font-family: 'Lato', sans-serif; font-size:1.5rem; color:#FFF; font-weight:300; letter-spacing:2px;}
.content_carte .plat_name{ position: relative; display: block; overflow: hidden; padding:0 70px 0 0;}
.content_carte .plat_price{ position: absolute; top:0; right: 0; padding: 0 0 0 10px; color:#FFF;}
.content_carte .plat_descr{ font-size:1.3rem; font-style:italic;}
/**/
.filter{ background: -moz-linear-gradient(top, rgba(0,101,153,1) 0%, rgba(0,53,95,0) 100%);
background: -webkit-linear-gradient(top, rgba(0,101,153,1) 0%,rgba(0,53,95,0) 100%);
background: linear-gradient(to bottom, rgba(0,101,153,1) 0%,rgba(0,53,95,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#006599', endColorstr='#0000355f',GradientType=0 ); position:absolute; width:100vw; height:100%; z-index:1000; opacity:.4;}
/*---------------*/
/* FOOTER */
/*---------------*/
footer { padding: 40px 0; margin: 80px 0 0 0; }
footer nav, footer section { text-align: center; }
footer ul li { display: inline-block; }
footer a, footer li, footer p { font-size: 1.1rem; text-transform: uppercase; color: #4C4C4B; font-weight: 700; padding: 0 5px; }
footer .marzocco { width: 100%; border-top: 1px solid #DFDFDF; text-align: center; height: 35px; }
footer .marzocco a { display: inline-block; width: 187px; height: 46px; text-indent: -999em; -webkit-transform: translateY(-58%); -ms-transform: translateY(-58%); -o-transform: translateY(-58%); transform: translateY(-58%); background: url('../images/groupe_marzocco.svg') no-repeat 50% 50% / contain rgba(244, 244, 240, 1); }
footer a:hover { color: #BB3B32; }

/*---------------*/
/* MEDIA QUERIES */
/*---------------*/
/* 800 galaxy note & tab - nexus 10 768 ipad, 720 surface pro */
@media all and (max-width: 1024px) {
    .gallery { overflow: hidden; }
}
@media all and (max-width: 800px) {
    .window figure { float: none; }
    .container_carte { display: flex; flex-direction:column;}
    .content_carte{ width:100%;}
    .nav_carte{ width:100%; transform:none;}
    .content_carte::after{ display:none;}
    .nav_carte h2{ display:block; position:relative; cursor:pointer;}
    .nav_carte h2:after{ content:'+'; font-size:4rem; font-weight:700; position:absolute; top:0; right:0; width:20px; height:20px;}
    .nav_carte ul{ height: 0; transition:all .5s; visibility: hidden; opacity: 0;}
    .nav_carte.open ul{ height: 100%; visibility: visible; opacity:1;}
}
@media all and (max-width: 640px) {
    html { font-size: 50%; }
    p { font-size: 1.8rem; }
    #anchor_nav { display: none; }
    .gallery { padding: 0 0 60px 0; }
    .cafe_btns a{ margin:0 0 20px;}
}
/* 480 galaxy s - 414 iphone 6s */
@media all and (max-width: 480px) {
    main > section { padding: 70px 20px 0 20px; }
    main > section.slider { padding: 0; }
    main > section.col_2 { padding: 30px 20px 0 20px; }
    main > section.wysi{ padding: 30px 20px 0 20px; }
    .tour .slider, .spa .slider, .restaurant .col_2{padding: 100px 20px 0 20px;}
    h3 { margin: 15px auto 25px; }
    .col_2 article { -moz-column-count: 1; -webkit-column-count: 1; -o-column-count: 1; column-count: 1; }
    .window { width: 100%; }
    .window figure { width: 90%; }
    .services .col_2 article { padding: 0 20px; }
    .window { padding: 40px 0; }
    .window .txt p { padding: 30px; }
    .services .business { padding: 40px 20px !important; margin: 0; }
    .horizontal-timeline, .timelapse{ padding:70px 0 0 0;}
    .gallery figure figcaption p{ display:none;}
}
@media all and (max-width: 320px) {
	main > section.col_2 { padding: 30px 10px 0 10px; }
	.tour .slider, .spa .slider{padding: 100px 10px 0 10px;}
}