/**
 * Forms
 */

/* All elements */
.field { margin-bottom: 30px; position:relative; }
.field label { display: inline-block; margin:0; }

[data-validate-for] { display:none; font-size:10px; line-height:10px; position:absolute; right:0; bottom:-1.2em; }
[data-validate-for].visible { display:block; }

/* Textfields & textareas */
.field.textfield input,
.field.textarea textarea { display: block; width: 100%; padding: 10px; border: 1px solid #ccc; }

/* Checkbox & Radio */
.field.checkbox label,
.field.radio label { display:flex; flex-direction:row; align-items:center; justify-content:flex-start; position:relative; margin-bottom:10px; cursor: pointer; }

.field.checkbox input,
.field.radio input,
.field.checkbox span:before,
.field.radio span:before { width:20px; height:20px; margin-right:10px; }

.field.checkbox span:before,
.field.radio span:before { content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); border:1px solid #ccc; background:#fff; }

.field.checkbox span:after,
.field.radio span:after { content:''; position:absolute; left:3px; top:50%; transform:translateY(-50%); width: 14px; height:14px; background:#ccc; opacity:0; transition:all 0.5s ease 0s; }

.field.checkbox input:checked+span:after,
.field.radio input:checked+span:after { opacity: 1; }

.field.checkbox span:before,
.field.checkbox span:after { border-radius: 0; }

.field.radio span:before,
.field.radio span:after { border-radius: 50%; }

.field.radio.inline,
.field.checkbox.inline { display:flex; flex-direction:row; align-items:center; justify-content:flex-start; }
.field.radio.inline label,
.field.checkbox.inline label { margin-right:15px; margin-bottom:0; }

/* Select */
.field.select select { display:block; width:100%; padding:10px; border:1px solid #ccc; }

/* Captcha */
.field.captcha { display:flex; flex-direction:row; justify-content:center; }

/**
 * Navigation
 **/
 
/* Frontend editor */
.ct-widget.ct-ignition { position:fixed; left:auto; top:auto; right:20px; bottom:20px; z-index:10000; transition:all 0.5s ease 0s; }
.ct-widget.ct-ignition .ct-ignition__button { position:static; margin-top:10px;}

.ce-element { outline:2px dashed rgba(243, 156, 18, 0.5); }
.ce-element--focused, .ce-element:focus { outline:2px dashed rgba(243, 156, 18, 1); }

/**
 * Legal
 **/
.legal { margin:60px 0; }
.legal h1 { font-size:4rem; margin:0 0 1em 0; }
.legal h2 { font-size:3rem; margin:1em 0; }
.legal h3 { font-size:2.5rem; margin:1em 0; }
.legal h4 { font-size:2rem; margin:1em 0; }
.legal h5 { font-size:1.5rem; margin:1em 0; }
.legal table { width:100%; margin:2em 0; }
.legal table th,
.legal table td { padding:1em; border:1px solid rgba(0,0,0,0.25); }
/**
 * General Elements
 **/

html { font-size:10px; }
body { font-size:1.6rem; font-family:'Roboto', sans-serif; font-size:2rem; font-weight:400; }
:focus, button:focus { outline:none; }

/* Images */
img, svg { max-width:100%; height:auto; }
img[data-sizes] { display:block; width:100%; }

/* Paragraphs */
p { margin-bottom:1em; line-height:1.8em; letter-spacing:1px; }
p:last-child { margin-bottom:0; }

/* Link */
a { color:inherit; }
a:hover { text-decoration:none; }

/* Lists */
ul, ol { margin-bottom:0; padding:0; list-style:none; }

/* Titles */
h1, h2 { font-size:6rem; font-weight:bold; color:#6A1027; line-height:1.2em; margin-bottom:1em; }
h2.lax { margin-left:75vw; font-size:20rem; font-family:'Glysa'; color:rgba(164, 137, 113, 0.2); white-space:nowrap; margin-bottom:0.25em; font-weight:normal; }

/**
 * Components
 **/

/* Alert */
.alert { position: relative; padding: .75rem 1.25rem; margin-bottom: 1rem; border: 1px solid transparent; border-radius: .25rem; }
.alert .close { display:none; }
.alert-success { color: #155724; background-color: #d4edda; border-color: #c3e6cb; }
.alert-primary { color: #004085; background-color: #cce5ff; border-color: #b8daff; }
.alert-secondary { color: #383d41; background-color: #e2e3e5; border-color: #d6d8db; }
.alert-danger { color: #721c24; background-color: #f8d7da; border-color: #f5c6cb; }
.alert-warning { color: #856404; background-color: #fff3cd; border-color: #ffeeba; }
.alert-info { color: #0c5460; background-color: #d1ecf1; border-color: #bee5eb; }

/* Hamburger */
.hamburger { padding:20px 40px; background:#fff; opacity:1 !important; position:relative; z-index:5; }
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after { background:#A48971; border-radius:0; height:2px; }
.hamburger .hamburger-inner::before { transition:all 0.5s ease 0s; }
.hamburger:hover {  }
.hamburger:hover .hamburger-inner::before { width:30px; }

.hamburger.is-active .hamburger-inner::before { width:40px; }
.hamburger.is-active .hamburger-inner, .hamburger.is-active .hamburger-inner::before, .hamburger.is-active .hamburger-inner::after { background:#A48971; }

/* Buttons */
.btn { display:inline-flex; text-align:center; flex-direction:row; align-items:center; justify-content: center; color:#fff; text-transform:uppercase; font-size:1.2rem; padding:20px 40px; background:#A48971; border:2px solid #A48971; transition:all 0.5s ease 0s; }
.btn svg { margin-left:10px; }
.btn:hover { background:#9A7656; color:#A48971; background:#fff; }
.btn:hover svg { fill:#A48971; }

.btn.red { background-color:#6A1027; color:#fff; border-color:#6A1027; }
.btn.red:hover { background-color:transparent; color:#6A1027; }

#accueil .btn.line {  position:relative; display:inline-flex; flex-direction:column; align-items:flex-start; background:none; padding:0; border:none; color:#000; margin-top:50px; font-size:1.8rem; }
#accueil .btn.line:after { content:''; display:block; width:100%; height:2px; background:#000; margin:5px 0 0 0; transition:all 0.5s ease 0s; }
#accueil .btn.line:hover:after { width:calc(100% + 30px); }

.btn.outline { background:transparent; border:1px solid #A48971; color:#A48971; border-radius:50px; }
.btn.outline:hover { background:#A48971; color:#fff; }

.btn.outline.big { padding:30px 50px; font-size:2.5rem; font-family:'Glysa'; text-transform:none; border-radius:100px; }



/**
 * Layout
 **/

#page { position:relative; width:100%; overflow:hidden; }

#bars { position:fixed; left:0; top:0; width:100%; height:100%; z-index:-1; pointer-events:none; }
#bars .row { justify-content:center; }
#bars .bar { height:100vh; border-right:1px solid #E2E2E2;}
#bars .bar:last-child { border:none; }

/* Header */
#header { position:fixed; left:0; top:0; width:100%; z-index:5; transition:all 0.5s ease 0s; }
#header .mainrow { padding-top:50px; align-items:center; transition:all 0.5s ease 0s; }
#header .navigation { display:flex; flex-direction:row; align-items:center; justify-content:flex-end; text-transform:uppercase; }
#header .navigation .item { font-size:1.4rem; color:#fff; margin-left:50px; display:flex; flex-direction:row; align-items:center; position:relative; z-index: 10000;}
#header .navigation .item a { letter-spacing:1px; position:relative; display:flex; flex-direction:row; align-items:center; justify-content:center; }
#header .navigation .item a:hover { color:#fff; }
#header .navigation .item svg { width:20px; max-height:20px; margin-left:10px; }
#header .navigation .item .btn { align-self:stretch; }
#header .navigation .item .btn:hover { background:#d0aa88; border-color:#d0aa88; color:#fff; }
#header .navigation .item .btn:hover svg { fill:#fff; }
#header .languages .trigger svg { width:8px; }
#header .socials li { margin-left:15px; }
#header .socials svg { margin-left:0 !important; }
#header .socials a { position:relative; display:block; }
#header .socials a:before { content:''; position:absolute; left:50%; top:50%; width:0; height:0; border-radius:100%; background:#A48971; transform:translate(-50%, -50%); transition:all 0.5s ease 0s; z-index:-1; }
#header .socials a:hover:before { width:40px; height:40px; }
#header .book { box-shadow: 1px 13px 15px 0px rgba(0,0,0,0.3); }

#header .dropdown { opacity:0; pointer-events:none; position:absolute; left:0; top:45px; background:#A48971; transition:all 0.5s ease 0s; }
#header .dropdown a { padding:15px 30px; display:block; }
#header .dropdown.open { opacity:1; pointer-events:auto; }

#header #header-booking { top:70px; left:auto; right:120px; padding:30px; color:#fff; min-width:300px; max-width:500px; width:30vw; }
#header #header-booking .title { font-size:2rem; font-family:'Glysa'; text-align:center; text-transform:none; margin-bottom:2vh; }
#header #header-booking .field { display:flex; flex-direction:row; align-items:center; justify-content: flex-start; }
#header #header-booking .field label { margin-right:30px; min-width:100px; }
#header #header-booking .field .group { flex-grow:1; }
#header #header-booking .field select { width:auto; }
#header #header-booking .field input,
#header #header-booking .field select { border:1px solid #fff; background:transparent; color:#fff; font-weight:bold; }
#header #header-booking .field option { color:#000; }
#header #header-booking [data-validate-for] { color:#fff; }
#header #header-booking #header-booking-submit { text-align:center; margin-top:50px;}
#header #header-booking .btn { background:#fff; color:#6A1027; font-size:2rem; border:none; display:inline-block; font-family:'Glysa'; text-transform:none; padding:20px 40px; }
#header #header-booking .btn svg { display:none; }
#header #header-booking .btn:hover { color:#fff; background:#6A1027; }

.meilleure_prix {width: 100%; text-align: center; margin-bottom: 4vh;}
.meilleure_prix img {width: 50%;}


#overlay { position:fixed; left:0; top:0; width:100%; height:100%; min-height: 100%; background:#fff; z-index:2; transform:translateY(-100%); overflow-y: scroll; transition:all 0.5s ease 0s; }
#overlay .image, #overlay .text { height:100vh; height: 100%; }
#overlay .image img { height:100%; width:100%; object-fit:cover; object-position:center center; }
#overlay .text { text-align:center; display:flex; flex-direction:column; align-items:center; justify-content:center; height: 100%; }
#overlay .text .logo { margin-bottom:60px; }
#overlay .text .logo svg { fill:#6A1027; max-height:200px; }
#overlay .text .menu { font-size:2.6rem; font-family:'Glysa'; color:#6A1027; text-transform:none;  }
#overlay .text .menu li:after { content:"\2605"; display:block; margin:5px auto; line-height:1em; font-size:1.6rem; }
#overlay .text .menu li:last-child:after { content:none; }
#overlay .text .menu a:hover,
#overlay .text .menu li.active a { color:#A48971; }

#header .logo a,
#header .contact,
#header .socials,
#header .languages { transition:all 0.5s ease 0s; }
#header.not-top .logo a,
#header.not-top .contact,
#header.not-top .socials,
#header.not-top .cadeaux,
#header.not-top .languages { opacity:0; pointer-events:none; }


body.open #overlay { transform:translateY(0); }
body.open #header  .mainrow { padding-top:0;  }

#footer { background:#fcfaf9; position:relative; z-index:2 }
#footer:before { content:''; position:absolute; left:50%; top:0; width:1px; height:100px; background:#A48971; transform:translateY(-50%); }
#footer .row { align-items:center; }
#footer .menu { display:flex; flex-direction:row; align-items:center; justify-content:flex-start; }
#footer .menu li { margin-bottom:10px; }
#footer .menu li:last-child { margin-bottom:0; }
#footer .menu a { color:#A48971; font-size:2.4rem; }
#footer .menu a:hover { color:#6a1027; }
#footer .left img { margin-left:30px; }
#footer .right { text-align:right; justify-content:flex-end; }
#footer .logo { text-align:center; }
#footer .bottomrow { align-items:center; margin-top:50px; }
#footer .bottom { display:flex; flex-direction:row; align-items:center; justify-content: flex-start; }
#footer .bottom ul { display:flex; flex-direction:row; align-items:center; justify-content: flex-start; font-size:1.6rem; font-weight:300; }
#footer .bottom ul li:after { content:'-'; margin:0 5px; }
#footer .bottom ul li:last-child:after { content:none; }
#footer .bottom a:hover { color:#6A1027; }
#footer .button { text-align:right; display: flex; justify-content: space-between; align-items:center; }
#footer .button .btn { align-self:flex-end; }
#footer .button .img { display:inline-block; max-width:80px; max-height:60px; object-fit:contain; margin-left:10px; }
#footer .button .img img {  }
#footer .socials { margin-left:50px; }
#footer .socials li:after { content:none !important; }
#footer .socials svg { fill:#6A1027; }

/* General elements */
[data-bg] { background-repeat:no-repeat; background-size:cover; background-position:center center; }
[data-validate-for] { color:#A48971; }
.container-fluid { padding-left:150px; padding-right:150px; }
.padding { padding-top:100px; padding-bottom:100px; }
.noptop { padding-top:0; }
.nopbottom { padding-bottom:0; }
.op20, .op20:before { opacity:0.2; }
.op40, .op40:before { opacity:0.4; }
.op60, .op60:before { opacity:0.6; }
.op80, .op80:before { opacity:0.8; }
.text-center { text-align:center; }
.justify-center { justify-content:center; }
.hide { display:none; }

.legal { margin-top:150px; }

.socials { display:flex; flex-direction:row; align-items:center; }
.socials li { margin-right:10px; }
.socials li:last-child { margin-right:0; }

#heading { position:relative; color:#fff; }
#heading:before { content:''; position:absolute; z-index:2; width:100%; height:100%; background:#6A1027; opacity:0.6; pointer-events:none; }
#heading .bgslider .swiper-slide img { height:100vh; min-height:700px; max-height:1200px; object-fit:cover; object-position:center center; pointer-events: none; }
#heading .caption { position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); z-index:3; text-align:center; }
#heading .caption p { margin-top:30px; font-family:'Glysa'; font-size:3rem; }
#heading .pagination { position:absolute; width:100%; bottom:100px; z-index:3; display:flex; flex-direction:row; align-items:center; justify-content:center; }
#heading .pagination .swiper-pagination-bullet { width:15px; height:15px; background:#fff; opacity:0.8; margin:0 10px; }
#heading .pagination .swiper-pagination-bullet-active { width:20px; height:20px; opacity:1; }

#heading .prix {width: 250px; }

#booking  label { font-size:1.2rem; font-weight:bold; text-transform:uppercase; letter-spacing:1px; margin-bottom:15px; }
#booking .col-md-3 { padding-left:40px; padding-right:40px; border-right:1px solid #707070; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-end; }
#booking .col-md-3:first-child { padding-left:0; }
#booking .col-md-3:last-child { border-right:none; }
#booking .field { margin-bottom:0; }
#booking .field input,
#booking .field select { border:none; padding:0; font-family:'Glysa'; font-size:1.8rem; background:none; }
#booking .field .placeholder { position:absolute; left:0; bottom:0; width:100%; display:flex; flex-direction:row; align-items:center;  justify-content:space-between; pointer-events:none; font-family:'Glysa'; font-size:1.8rem; }
#booking .field .placeholder .text { display:flex; flex-direction:row; align-items:center; }
#booking .field .placeholder .text svg { fill:#000; width:12px; margin-left:15px; }
#booking .field .placeholder .carret svg { fill:#A48971; }
#booking .fields { display:flex; flex-direction:row; align-items:center; justify-content: flex-start; width:100%; }
#booking .fields .field { flex-grow:1; }
#booking .fields svg { margin-left:15px; }
#booking .field.filled .placeholder { display:none; }
/*#booking .flatpickr-mobile + div + .placeholder { display:none; }*/
#booking .col:last-child { justify-content:center; }

#intro .row { align-items:center; }
#intro .image img,
#velo .image img { width:50vw; max-width:none; }
#velo .text {text-align: left; float:right; display: flex; align-items: center; flex-direction:column !important;}

#next .row { align-items:center; }
#next .image img { width:50vw; max-width:none; float: right;}

#services .row { background:#fff; }
#services li { display:flex; flex-direction:column; align-items:center; justify-content:center; padding:50px; color:#fff; text-align:center; }
#services li span { margin-top:30px;  position:relative; z-index:1; }
#services li span strong {text-transform: uppercase; font-size:2rem; letter-spacing:1px;}
#services li svg { position:relative; z-index:1; fill:#fff; height:120px; }
#services li:before { content:''; position:absolute; left:0; bottom:0; width:100%; height:100%; background:#6A1027; z-index:0; }
#services li:last-child { background:#E1CFD3; }

#services-2 .column { padding:80px 120px; display:flex; align-items:center; justify-content:center; }
#services-2 .left { background:#A48971; color:#fff;  }
#services-2 .right { background:#ded4cc; color:#A48971; }
#services-2 .item { display:flex; flex-direction:row; align-items:center; justify-content:center; }
#services-2 .item div { display:flex; flex-direction:column; align-items:flex-start; justify-content: flex-start; }
#services-2 .item svg { margin-right:50px; min-width:100px; max-height:100px;  }
#services-2 .item h3 { font-size:2rem; font-weight:bold; text-transform:uppercase; }
#services-2 .item p { font-size:1.4rem; }

#places .swiper-wrapper { align-items:stretch; }
#places .swiper-slide { height:auto; padding-left:0; padding-right:0; }
#places .swiper-slide .content { height:100%; }
#places li { display:flex; flex-direction:column; padding-left:30px; padding-right:30px; }
#places li .content { padding:30px; background:#fff; }

.evenement { background:#fcfaf9; }
.evenement li .content { padding:30px; background:#fff; flex-grow:1; height:100%; }
.evenement li .content { flex-direction: column; justify-content: space-between;display: flex;}
.evenement .swiper-slide { height:auto; display:flex; flex-direction:column; align-items:stretch; justify-content:flex-start; }

#places li .content h3 { font-size:2rem; font-weight:bold; text-transform:uppercase; margin-bottom:1em; }
#places li .content p { font-size:1.4rem; font-weight:350; color:#8F8F8F; }
#places li .content .more { font-size:1.4rem; color:#6A1027; }

#suites li { overflow:hidden; }
#suites li:before { content:''; position:absolute; left:0; top:0; width:100%; height:100%; z-index:1; pointer-events:none; }
#suites li:nth-child(1):before { background:#fff; opacity:0.4; }
#suites li:nth-child(2):before { background:#A48971; opacity:0.4; }
#suites li:nth-child(3):before { background:#6A1027; opacity:0.4; }
#suites li:nth-child(4):before { background:#6A1027; opacity:0.6; }
#suites li .bg { transition:all 0.5s ease 0s; }
#suites .caption { position:absolute; left:50%; bottom:150px; background:#fff; padding:30px 60px; z-index:2; transform:translateX(-50%); text-align:center; width:100%; max-width:60%; }
#suites .caption h3 { font-size:1.4rem; font-weight:bold; text-transform:uppercase; }
#suites .caption p { font-size:1.4rem; color:#8F8F8F; }
#suites .bottom .row { align-items:center; }
#suites .bottom .text { font-weight:300; }
#suites li:hover img { transform:scale(1.1); }

#chambres li { display:flex; flex-direction:column; padding-left:30px; padding-right:30px; margin-bottom:50px;}
#chambres li .content { padding:40px; background:#fff; flex-grow:1; }
#chambres li .content h3 { font-size:2rem; font-weight:bold; text-transform:uppercase; margin-bottom:1em; }
#chambres li .content p { font-size:1.4rem; font-weight:350; color:#313131; }
#chambres .swiper-pagination-bullet-active { background:#fff; }

#end .row { align-items:center; }
#end .text { color:#A48971; font-family:'Glysa'; font-size:3rem; }

#facebook .widget { position:relative; overflow:hidden; }

#embed { margin:100px 0; background-size:contain; background-position:center center; background-repeat:no-repeat; text-align:center; color:#6A1027; font-size:3rem; font-family:'Glysa'; }

#parallax { height:700px; overflow:hidden; position:relative; }
#parallax .lax { height:100%; }
#parallax .bg { object-fit:cover; object-position:center center; width:100%; height:calc(100% + 100px); }

#reveil .right { color:#6A1027; }

#hotel #suites .caption { bottom:auto; top:30%; opacity: 0.9; }

#la-cite-des-princes #places li { margin-bottom:50px; }
.evenement .lieuxdate {display: flex; justify-content: space-between; align-items:center; padding-bottom: 15px;}
.evenement .lieuxdate p {margin-bottom: 0;}
.evenement .lieux {font-weight: bold; color:#6A1027; text-transform: uppercase; }
.evenement .date {background-color :#E5E5E5; border-radius: 100px; font-size: 1rem; padding:5px 15px; color: #848484;}
.evenement .btn,
.popup .btn {text-align: left; justify-content: flex-start;  font-size: 1.2rem; font-weight: 300; justify-content: space-between; display: flex;}
.evenement a.btn {color: white; margin: 15px 0;}
.evenement a:hover {color: #A48971; }
.evenement .swiper-slide .swiper-slide{margin-right: 0;}
a.share { width: 100%; display: flex; justify-content: space-evenly;}

#popup { text-align: center; width:350px; position: absolute; top:calc(50% + 120px); transform:translateY(-50%); right: 50px; z-index: 4;}

#popup .swiper-container { padding-bottom:40px; }
#popup .record { display:flex; flex-direction:column; align-item:stretch; justify-content:flex-start; position:relative; height:auto; }
#popup .image { position: relative; }
#popup .image .entete { position: absolute; top: 30px; left: 0;font-size:1.6rem; text-transform:uppercase;font-weight: bold; color: #6A1027; background-color: white; padding: 5px 20px; border-radius:0 20px 20px 0; }
#popup .date,
#popup .lieux { font-size: 1.6rem; color: #585858;}
#popup h2 {font-size: 2rem;}
#popup .alltxt {padding: 15px 10px 45px 10px; background-color: white;}
#popup .btn { width: auto; position: absolute; bottom:0; left: 10%; right: 10%; z-index: 20; text-align:left; transform:translateY(50%); padding:10px 20px; }
#popup .close { position: absolute; top: 15px; background-color: gray; right: 15px; border-radius: 20px; height: 30px; width: 20px; font-weight: 300; opacity: 0.8; border: none; display: flex; align-items: center; justify-content: center;}

.heading-evenement .background { margin: 0 auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1;}
.heading-evenement{height: 100vh; min-height: 700px; background-size: cover; background-position: center center; display: flex; justify-content: content; align-items: center;}
.heading-evenement:before {content: '';position: absolute;z-index: 2;width: 100%;height: 100%;background: #6A1027;opacity: 0.6;pointer-events: none;}
.heading-evenement h1{ font-size: 6.9rem; color: white;}
.heading-evenement p {font-size: 1.8rem; color: white;}
.heading-evenement .index {z-index: 4;}
.heading-evenement .index img{width: 100%;}
.heading-evenement .txt {text-align: right;}
.heading-evenement .entete {font-size: 4rem; color: #A48971; font-size: 2rem;}
.heading-evenement .date {font-size: 2rem; background-color: #A48971; border-radius: 100px; padding: 5px 20px; display: inline-block;}
.heading-evenement a {color: white; text-decoration: underline;}
.heading-evenement a:hover {color: #A48971;}

#form .field label { position:absolute; left:30px; top:50%; transform:translateY(-50%); font-size:2.5rem; font-family:'Glysa'; transition:all 0.5s ease 0s; color:#6A1027; z-index:2; }
#form .field.textfield input { background:#fff; padding:30px 30px 5px 30px; border:none; }
#form .field.textarea label { transform:translateY(0); top:30px; }
#form .field.textarea textarea { background:#fff; padding:30px; border:none; }
#form .field.active label,
#form .field.filled label { top:5px; transform:translateY(0); font-size:1.8rem; }
#form .field.submit { text-align:center; }
#form .ap-input, #form .ap-hint { height:auto; }
#form .ap-input-icon svg { min-width:20px; }

.blog { background: #fcfaf9;}
.blog .swiper-slide {background-color: #fff;}
.blog .allbutton {padding-top: 1vh;}
.blog .allbutton svg {margin-right: 15px;}
.blog .content {padding: 30px;}
.blog a:hover {color: #6A1027;}
.blog p {font-size: 1.4rem;}
.blogdetail li {position: relative; padding: 7px 0; padding-left: 20px; }
.blogdetail li:last-child {margin-bottom: 3vh;}
.blogdetail li:before {content:""; position: absolute; left: 5px; top: 17px; height: 7px; width: 7px; border-radius:50%; background-color:#6A1027 ;}
.blogdetail a {text-decoration: underline;} 
.blogdetail a:hover {color: #6A1027;}
 
.blogdetail {padding: 20vh 0;}
.blogdetail h1 {text-align: center;}
#blogdetail header{background-color: #6A1027; position: relative;}
#blogdetail #header .mainrow {padding:25px 0;}

#intro li {position: relative; padding-left: 15px;}
#intro li:before { content:''; position:absolute;top:0; left:0; bottom:0; width:7px; height:7px; border-radius: 100%; background:#6A1027; z-index:0; margin: auto; }
#intro .legend {padding-top: 10px; font-style: italic;}
#intro .legend span {color: #6A1027;}

#accordion {max-width: 1200px; margin: auto; padding: 5vh 0px;}
#accordion .title {align-items: center;display: flex; flex-direction:row; justify-content: space-between; cursor: pointer;}
#accordion .title .titre {padding-right: 100px;}
#accordion .unaccordion {margin-bottom: 3vh;}
#accordion h2 { font-size: 3rem; margin-bottom: 0em;}
#accordion .desc .content { padding: 1.5vh 0;}

#accordion img {transition: all .4s ease;}
#accordion .open img {transform: rotate(180deg);}
#accordion li {position: relative; padding-left: 15px;}
#accordion li:before { content:''; position:absolute;top:10px; left:0; width:7px; height:7px; border-radius: 100%; background:#6A1027; z-index:0; margin: auto; }


#bons-cadeaux #header .item {display: none;}
#bons-cadeaux #header .item.book {display: flex;}



/**
 * Extra large
 **/
@media (min-width: 1600px) {
    .container { max-width:1350px; }
}

/**
 * Extra large
 **/
@media (max-width: 1599px) {
    html { font-size:9px; }
    h2.lax { font-size:16rem; }
    
    .btn { padding:15px 20px; }
    .hamburger { padding:15px; }
    .container-fluid { padding-left:100px; padding-right:100px; }
    .padding { padding-top:80px; padding-bottom:80px; }
    
    
    #header .navigation .item { margin-left:30px; }
    #header .socials li { margin-left:0; }
    
    #parallax { height:600px; }
    
    
    
    #popup { width: 500px; top:auto; bottom:0; right:0; transform:none; }
    #popup .swiper-container { padding-bottom:0; }
    #popup .record { flex-direction:row; }
    #popup .image { position:static; }
    #popup .image img { object-fit: cover; min-width: 200px; height:100%; }
    #popup .alltxt { width:100%; text-align:left; padding-bottom:70px; }
    #popup .close {right: 10px; top: 10px;}
    #popup .btn { position:absolute; right:0; bottom:0; transform:none; left:200px;}
    /*
    body.popup #heading .caption {top: 35%;}
    body.popup #heading .pagination {top: 38%;}
    */
    
}

/**
 * Large devices
 **/
@media (max-width: 1199px) {
    html { font-size:8px; }
    h1, h2 { font-size:5rem; }
    h2.lax { font-size:12rem; }
    
    .container-fluid { padding-left:50px; padding-right:50px; }
    .padding { padding-top:60px; padding-bottom:60px; }
    .btn { font-size:1.4rem; }
    
    #header .socials { display:none; }
    #header .navigation .item { margin-left:15px; }
    #header .navigation .item.contact { display:none; }
    #header .mainrow { padding-top:30px; }
    #heading .pagination { bottom:50px; }
    
    
    #heading .caption img { max-width:400px; }
    #heading .caption p { font-size:2rem; }
    
    #overlay .text .logo { margin-bottom:30px; }
    #overlay .text .logo svg { max-width:350px; }
    #overlay .text .menu { font-size:2.2rem; }
    
    #heading .bgslider .swiper-slide img { height:100vh; min-height:500px; max-height:700px; }
    
    #booking .fields svg { display:none; }
    #booking .col-md-3 { padding-left:20px; padding-right:20px; }
    
    #suites .caption { padding:15px 30px; bottom:100px; max-width:70%; }
    #parallax  { height:500px; }
    
    #services-2 .column { padding:60px 80px; }
    
    #la-cite-des-princes #places li { padding-left:15px; padding-right:15px; margin-bottom:30px; }
    /*
    #popup {width: 450px;}
    #popup .alltxt {padding: 10px 10px 40px 10px;}
    #popup .close {right: 5px; top: 5px;}
    */
    #popup .alltxt { padding-bottom:50px; }
    #popup p,  { margin-bottom:0.5em; }
    
    .evenement li{padding: 20px;}
    
    
}

/**
 * Medium devices
 **/
@media (max-width: 991px) {
    html { font-size:7px; }
    h2.lax { font-size:8rem; }
    
    .padding { padding-top:40px; padding-bottom:40px; }
    #heading .bgslider .swiper-slide img { height:100vh; min-height:400px; max-height:600px; }
    
    #booking .col-md-3 { padding-left:10px; padding-right:10px; }
    
    #services li { padding:30px; }
    #services li span { margin-top:15px; }
    
    .btn.line { margin-top:30px; }
    .btn.outline.big { padding:20px 40px; }
    
    #places li .content { padding:20px; }
    #places li .content p { font-size:1.6rem; }
    
    
    #footer:before { height:50px; }
    #parallax { height:400px; }
    
    #services-2 .column { padding:40px 60px; }
    #services-2 .item svg { margin-right:30px; }
    /*
    #popup {width: 450px; transform: translateY(-90%);}
    #popup .image img {width: 150px;}
    */
    #chambres li .content {padding: 25px;}
    
    #header #header-booking {min-width: 500px; position: fixed; left: 0; right: 0; margin: auto;}
    
    #bons-cadeaux #header {background-color: #fff; }
    #header .item.cadeaux {display: none;}
    
}

/**
 * Small devices
 **/
@media (max-width: 767px) {
    .hamburger { padding:10px; }
    .btn { padding:10px 15px; }
    .container-fluid { padding-left:30px; padding-right:30px; }
    h2.lax { font-size:12rem; }
    .btn.outline.big { padding:15px 30px; } 
    
    #header .navigation .item { margin-left:5px; }
    #header .book .trigger span { display:none; }
    #header .book .trigger svg { margin-left:0; }
    #header .mainrow { padding-top:15px; }
    #heading .pagination { bottom:30px; }
    
    #overlay .image { display:none; }
    
    #heading .bgslider .swiper-slide img { height:100vh; min-height:350px; max-height:550px; }
    body.popup #heading .swiper-slide img { max-height:750px; }
    #heading .caption img { max-width:250px; }
    
    #booking .col-md-3 { margin-bottom:15px; border:none;}
    #booking .col-md-3:first-child { padding-left:15px; border-right:none; }
    #booking .col-md-3:nth-child(3) { border-right:none; }
    #booking #booking-submit { margin-top:15px; text-align:center;  }
    /* #booking .carret { display:none; } */
    
    #services li svg { max-height:50px; }
    
    #suites .caption { padding:10px 20px; bottom:50px; max-width:80%; } 
    #suites .bottom .text { text-align:center; margin-bottom:30px; }
    #suites .bottom .button { text-align:center; }
    
    #hotel #suites .caption { top:20%; }
    
    #footer .left img { display:none; }
    #footer .bottom { margin-top:40px; justify-content:center; }
    #footer .button { display:none; }
    
    #histoire #intro .text { margin-bottom:30px; }
    #histoire #intro .image img { width:auto; max-width:100%; }
    
    #histoire #next .image { order:2; }
    #histoire #next .text { order:1; margin-bottom:30px; }
    #histoire #next .image img { width:auto; max-width:100%; float:none; }
    #histoire #end .image { text-align:center; }
    #histoire #end .image img { max-width:200px; margin:15px auto 0 auto; }
    
    #parallax { height:300px; }
    #services-2 .column { padding:20px 40px; }
    
     
     
     .heading-evenement .txt {text-align: center;}
     
     #accordion .title .titre {padding-right: 40px;}
     #accordion h2 {font-size: 2.5rem;}


    
}

/**
 * Extra small devices
 **/
@media (max-width: 575px) {
    h2.lax { font-size:8rem; }
    .padding { padding-top:20px; padding-bottom:20px; }
    /* #header .navigation .item .trigger { display:none; } */
    #header .logo a { opacity:0 !important; pointer-events:none; }
    #blogdetail header {background-color: transparent;}
    .blogdetail {padding: 7vh 0;}
    
    
    #heading .bgslider .swiper-slide img { height:100vh; min-height:300px; max-height:500px; }
    body.popup #heading .swiper-slide img { max-height:650px; }
    
    #intro .text { margin-bottom:30px; }
    #intro .image img,
    #velo .image img{ width:auto; max-width:100%; }
    
    #next .image { order:2; }
    #next .text { order:1; margin-bottom:30px; }
    #next .image img { width:auto; max-width:100%; float:none; }
    
    #suites .caption { padding:15px 30px; bottom:50px; max-width:70%; }
    #suites .caption p { font-size:1.8rem; }
    #footer .left, #footer .right { display:none; }
    #footer .logo { margin-top:20px; }
    #footer .bottom { flex-direction:column; }
    #footer .bottom ul { flex-direction:column; align-items:center; justify-content:center;}
    #footer .bottom ul li { margin:5px 0; font-size:1.6rem;  }
    #footer .bottom ul li:after { content:none; }
    #footer .bottom .socials { margin-left:0; margin-top:30px; flex-direction:row; }
    #footer .bottom .socials li { margin:0 15px; }
    
    #reveil img { display:none; }
    #reveil .right { margin-top:30px; }
    
    #hotel #suites .caption { top:30%; }
    #popup{ right:0; width: 100%;}
    #popup .btn { left:0; }
    
    .evenement li{padding: 0;}
    
    #heading .caption { top:40%; }
    #heading .caption p { display:none; }
    #booking .row > div { display:flex; }
    #booking .fields { flex-direction:column; align-items:flex-start; }
    #booking .fields .field { margin-bottom:2rem; }
    #booking .field input, #booking .field select { font-size:2.5rem; }
    #booking .field .placeholder { font-size:2.5rem; }
    #booking label { font-size:1.6rem; }
    #header #header-booking {min-width: 90%; position: fixed; left: 0; right: 0; margin: auto;}
    #header .navigation .item svg {max-height: inherit;}
    #header .navigation .item { font-size: 2rem;}
    #header #header-booking .title {font-size: 3rem;}
    .meilleure_prix img {width : 70%;}
    .field.textfield input, .field.textarea textarea {padding: 15px 10px;}
    #header #header-booking .field label { margin-right: 0;}
    
    #heading .prix {transform: translateY(30px); }
    #popup { display:none; }
    
    
    

}

@media (max-height: 550px) {
    #overlay .text .logo { display:none; }
}