/*html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {box-sizing: border-box;margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;}
 HTML5 display-role reset for older browsers * /
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}

/* deb */
body {min-width:320px;color:#303030;}
a {color:#303030;text-decoration:none;}
a:hover, a:active, a:focus {text-decoration:none;}
a[name] {padding-top: 100px;}
img {max-width:100%}


body, button,input, textarea, select {font-family: 'Nunito', sans-serif;font-weight:300;color:#707070;}


header {position:relative;background:url(images/top_accueil.jpg) no-repeat scroll center center transparent;height:80vh;background-size:cover;}
header .logo {display: block;width:300px;padding-top:20px;padding-left:20px;}
header nav{transition:all 0.2s ease 0.2s;z-index:1000;overflow:hidden;position:relative;font-size: 18px;font-weight:300;display:flex;padding:0 20px;line-height: 60px;height: 60px;position:absolute;bottom:0;left:0;width:100%;background:#eee;border:1px solid #707070;border-left:0 none;border-right:0 none;}
header nav > a {transition:opacity 0.2s ease 0s,max-height 0.2s ease 0s;margin:0 20px;}

h1, .h1 {font-size: 30px;font-weight:800;text-align:center;margin:60px 0;}
h2, .h2 {font-size: 20px;font-weight:800;margin-bottom:16px;margin-top:0;}
p {font-size: 16px;font-weight:300;margin:0 0 10px 0;text-align:justify;line-height: 20px;}
strong {font-weight:600;}
.content {padding: 0 20px;max-width:1280px;margin:0 auto;}
.col2{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin:40px 0;}

.z3 {overflow:hidden;display: flex;flex-wrap: wrap;justify-content: space-around;max-width:1280px;margin: 0 auto;align-items:center;}
.plan {font-size:16px;margin: 60px 20px 20px;position:relative;display: inline-block;}
.plan a {text-align: center;position:absolute;display: inline-grid;align-content: center;justify-content: center;}
.plan a strong {font-size: 3.375em;text-align: center;line-height: 0.9em;}
.plan a:hover {color:#909090}
.plan .leg {white-space: nowrap;position: absolute;left: -50px;top: -30px;right: -50px;text-align: center;font-size: 20px;font-weight: 400;}

.plan.rdj {max-width:31%}
.plan.etage {max-width:70%}

.plan a.a0 {top: 40%;bottom: 42%;left: 75%;right: 17.5%;}
.plan a.a1 {top: 41%;bottom: 39%;left: 28%;right: 57%;}
.plan a.a2 {top: 41%;bottom: 39%;left: 4%;right: 72.5%;}
.plan a.a3 {top: 16%;bottom: 68%;left: 4%;right: 72.5%;}
.plan a.a4 {top: 16%;bottom: 68%;left: 28%;right: 48%;}
.plan a.a9 {top: 2%;bottom: 68%;left: 53%;right: 33%;}
.plan a.a10 {top: 2%;bottom: 68%;left: 68%;right: 1%;}
.plan a.a11 {top: 46%;bottom: 2%;left: 44%;right: 30%;}
.plan.etage a.a11 {top: 2%;bottom: 2%;left: 63%;right: 1%;}
.plan a.detente {top: 33%;bottom: 39%;left: 57%;right: 30.5%;font-size: 1.25em;font-weight: 400;}
.plan a.accueil {top: 59%;bottom: 26%;left: 75%;right: 17.5%;font-size: 1.25em;font-weight: 400;}
.plan a.pizza {top: 24%;bottom: 68%;left: 67.5%;right: 26.5%;font-size: 1.25em;font-weight: 400;}

.plan a.a5 {top: 35%;bottom: 38%;left: 44%;right: 37.5%;}
.plan a.a6 {top: 35%;bottom: 38%;left: 15%;right: 56.5%;}
.plan a.a7 {top: 2%;bottom: 77%;left: 44%;right: 26.5%;}
.plan a.a8 {top: 2%;bottom: 77%;left: 15%;right: 56.5%;}

.plan a.terrasse {top: 23.5%;bottom: 36%;left: 0.5%;right: 86%;}

.plan a.ski {top: 68.5%;bottom: 17%;left: 3%;right: 57.5%;font-size: 1.25em;font-weight: 400;}
.plan a.activite {top: 38%;bottom: 17%;left: 46%;right: 15.5%;font-size: 1.25em;font-weight: 400;}
.plan a.sauna {top: 21%;bottom: 63%;left: 58%;right: 15.5%;font-size: 1.25em;font-weight: 400;}
.plan a.laverie {top: 36%;bottom: 51%;left: 24%;right: 57.5%;font-size: 1.12em;font-weight: 400;}

.content.appartement {display: grid;grid-template-columns: 1fr 1fr;}
.content.resa {min-height:600px;}

.content.appartement .mini{display: flex;flex-direction: row;align-items: start;}
.content.appartement .mini img {padding: 2px 0 0 2px;max-height:150px;}
.content.appartement .mini .first img {padding-left:0;}
.content.appartement .large {text-align: center;}   
.content.appartement .large img {max-height: 480px;}
.zoneHead {padding:0 20px}
.zoneHead h1 {margin: 40px 0;}
/*.zoneHead .icons {display: grid;grid-template-columns: 1fr 1fr 1fr;align-items: center;text-align: center;margin: 20px;}  */
.zoneHead .plan_appt {text-align: center;display: block;margin: 20px;}

.btnm{display:none;top: 0;right: 0;position:absolute;}
.btn_mobile{padding-left: 45px;position:relative;padding-right: 10px;padding-bottom: 10px;padding-top: 8px;}
.picto_menu{position:absolute;width:35px;height:22px;top: 10px;left: 10px;}
.menuOpen .picto_menu .img1{background-color: #000;top:8px;transform: rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);-webkit-transform:rotate(45deg);}
.menuOpen .picto_menu .img2{background-color: #000;top:8px; transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg);opacity:0;}
.menuOpen .picto_menu .img3{background-color: #000;top:8px; transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); }
.picto_menu span{width:auto;position:absolute;left: 0;right: 0;top: 0;margin: 0 auto;height: 4px;display: block;background-color: #000;}
.picto_menu .img1{top:0;}
.picto_menu .img2{top:9px;opacity:1;}
.picto_menu .img3{top:18px;}
.picto_menu span,header
{transition:all 0.2s ease 0s;}

.menuOpen header nav > a 
{transition:opacity 0.2s ease 0.4s,max-height 0.2s ease 0.4s;}
.menu .liens {transition: all .5s;}  
.menuFixed header nav {position:fixed;bottom:auto;top:0;}

#planning_data {text-align: center;min-height: 400px;}
.content table.planning_tb {margin: 10px;}
.zoneReservation .pager {margin: 0px auto;padding: 0 20px;}
.zoneReservation .planning_venir {text-align:center; margin:30px 0 10px;font-weight:600;font-size: 18px;}

.pager li > a:focus, .pager li > a:hover {text-decoration: none;background-color: #eee;}
.pager li > a, .pager li > span {display: inline-block;padding: 5px 14px;background-color: #fff;border: 1px solid #ddd;border-radius: 15px;}
.pager .disabled > a, .pager .disabled > a:focus, .pager .disabled > a:hover, .pager .disabled > span {background-color: #fff;color: #777;cursor: not-allowed;}

#zform {position:relative;}
#zform .zhi {display:none;margin: 0;position: absolute;background:#fff;border: 1px solid #303030;border-top: 0 none;border-radius: 0 0 10px 10px;padding: 10px 0;right: 0;left: 0;}
#zform.active .zhi {display:block;}
#zform h3 {border: 1px solid #303030;cursor: pointer;margin: 0;padding: 10px;border-radius: 10px;}
#zform.active h3 {border-radius:10px 10px 0 0;}
#zform h3:after {float: right;content: "\e259";font-family: 'Glyphicons Halflings';font-size: 24px;font-style: normal;font-weight: 400;line-height: 1;}
#zform.active h3:after {content: "\e260";}

.lstappartements {max-width: 1080px;margin: 0 auto;display: flex;flex-direction: row;flex-wrap: wrap;padding:10px;justify-content: center;}
.lstappartements .appt {margin: 10px;height: 200px;width: 300px;display: inline-block;background: none no-repeat scroll center center transparent;position: relative;background-size:cover;
display: grid;grid-template-columns: 1fr;grid-template-rows: auto 85px;} /*auto max-content*/
.lstappartements .appt u {text-rendering: auto;text-align:center;text-decoration:none;color:#fff;font-size:20px;font-weight:300;text-shadow: 0 0 2px #000;}
.lstappartements .appt u strong{font-size:40px;font-weight:600;}

.lstappartements .appt a {position:absolute;left:0;top:0;right:0;bottom:0;}
.lstappartements .appt .lsticons {margin: 0;}
.appt .icons {text-shadow: 0 0 1px #000;position:relative;color:#fff;font-size:30px;font-weight:600;padding-bottom: 56px;}
.appt.bl .icons {color:#000;text-shadow:none;}
.appt .icons i {display:block;font-size:12px;font-style: normal;}
.appt .icons u {font-size:12px;text-decoration: none;}
.appt .icons:before {position: absolute;bottom: 0;left: 0;height: 56px;width: 90px;padding-top: 0;}

.zonePhoto{margin-top: 20px;}

.lsticons {margin-top: 20px;display: flex;flex-direction: row;justify-content: space-around;flex-wrap: wrap;}
.icons {display:inline-block;text-align: center;min-width:90px;font-size: 14px;line-height: 16px;}
.icons:before {display: block;content:'';padding-top:56px;background:url(images/icones.png) no-repeat scroll 0 0 transparent;background-size:80px}

.icons.wifi:before {background-position:center  -1098px;}
.icons.animaux:before {background-position:center  0px;}
.icons.parking:before {background-position:center  -661px;}
.icons.sauna:before {background-position:center  -1037px;}
.icons.epicerie:before {background-position:center  -523px;}
.icons.commande:before {background-position:center  -451px;}
.icons.pizza:before {background-position:center  -852px;}
.icons.pain:before {background-position:center  -595px;}
.icons.pingpong:before {background-position:center  -791px;}
.icons.bbq:before {background-position:center  -66px;}
.icons.piquenique:before {background-position:center  -723px;}
.icons.billard:before {background-position:center  -124px;}
.icons.ve:before {background-position:center  -867px;    background-size: 60px}
.icons.personnes_w:before {background-position:center  -186px;}  
.icons.personnes:before {background-position:center  -251px;}  
.icons.chambres_w:before {background-position:center  -315px;}  
.icons.chambres:before {background-position:center  -383px;}  
.icons.salle_eau_w:before {background-position:center  -917px;}  
.icons.salle_eau:before {background-position:center  -981px;}  
.icons.surface:before {background-position:center  -1235px;}  
.icons.boulodrome:before {background-position:center  -1289px;}
  
/* LOADER */    
.sk-folding-cube {margin: 20px auto;width: 40px;height: 40px;position: relative;-webkit-transform: rotateZ(45deg);transform: rotateZ(45deg);}
.sk-folding-cube .sk-cube {float: left;width: 50%;height: 50%;position: relative;-webkit-transform: scale(1.1);-ms-transform: scale(1.1);transform: scale(1.1); }
.sk-folding-cube .sk-cube:before {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: #333;-webkit-animation: sk-foldCubeAngle 2.4s infinite linear both;animation: sk-foldCubeAngle 2.4s infinite linear both;-webkit-transform-origin: 100% 100%;-ms-transform-origin: 100% 100%;transform-origin: 100% 100%;}
.sk-folding-cube .sk-cube2 {-webkit-transform: scale(1.1) rotateZ(90deg);transform: scale(1.1) rotateZ(90deg);}
.sk-folding-cube .sk-cube3 {-webkit-transform: scale(1.1) rotateZ(180deg);transform: scale(1.1) rotateZ(180deg);}
.sk-folding-cube .sk-cube4 {-webkit-transform: scale(1.1) rotateZ(270deg);transform: scale(1.1) rotateZ(270deg);}
.sk-folding-cube .sk-cube2:before {-webkit-animation-delay: 0.3s;animation-delay: 0.3s;}
.sk-folding-cube .sk-cube3:before {-webkit-animation-delay: 0.6s;animation-delay: 0.6s; }
.sk-folding-cube .sk-cube4:before {-webkit-animation-delay: 0.9s;animation-delay: 0.9s;}
@-webkit-keyframes sk-foldCubeAngle {0%, 10% {-webkit-transform: perspective(140px) rotateX(-180deg);transform: perspective(140px) rotateX(-180deg);opacity: 0; } 25%, 75% {-webkit-transform: perspective(140px) rotateX(0deg);transform: perspective(140px) rotateX(0deg);opacity: 1; } 90%, 100% {-webkit-transform: perspective(140px) rotateY(180deg);transform: perspective(140px) rotateY(180deg);opacity: 0; } }
@keyframes sk-foldCubeAngle {0%, 10% {-webkit-transform: perspective(140px) rotateX(-180deg);transform: perspective(140px) rotateX(-180deg);opacity: 0; } 25%, 75% {-webkit-transform: perspective(140px) rotateX(0deg);transform: perspective(140px) rotateX(0deg);opacity: 1; } 90%, 100% {-webkit-transform: perspective(140px) rotateY(180deg);transform: perspective(140px) rotateY(180deg);opacity: 0; }}
/* EOF LOADER */ 
  /* Calendars */ 
.daterangepicker {position: absolute;color: inherit;background-color: #fff;border-radius: 4px;width: 278px;padding: 4px;margin-top: 1px;top: 100px;left: 20px;}
.daterangepicker:before, .daterangepicker:after {position: absolute;display: inline-block;border-bottom-color: rgba(0, 0, 0, 0.2);content: ''; }
.daterangepicker:before {top: -7px;border-right: 7px solid transparent;border-left: 7px solid transparent;border-bottom: 7px solid #ccc; }
.daterangepicker:after {top: -6px;border-right: 6px solid transparent;border-bottom: 6px solid #fff;border-left: 6px solid transparent; }            
.daterangepicker.opensleft:before {right: 9px; }
.daterangepicker.opensleft:after {right: 10px; }
.daterangepicker.openscenter:before {left: 0;right: 0;width: 0;margin-left: auto;margin-right: auto; }
.daterangepicker.openscenter:after {left: 0;right: 0;width: 0;margin-left: auto;margin-right: auto; }
.daterangepicker.opensright:before {left: 9px; }
.daterangepicker.opensright:after {left: 10px; }
.daterangepicker.dropup {margin-top: -5px; }
.daterangepicker.dropup:before {top: initial;bottom: -7px;border-bottom: initial;border-top: 7px solid #ccc; }
.daterangepicker.dropup:after {top: initial;bottom: -6px;border-bottom: initial;border-top: 6px solid #fff; }
.daterangepicker.dropdown-menu {max-width: none;z-index: 3001; }
.daterangepicker.single .ranges, .daterangepicker.single .calendar {float: none; }
.daterangepicker.show-calendar .calendar {display: block; }
.daterangepicker .calendar {display: none;max-width: 270px;margin: 4px; }
.daterangepicker .calendar.single .calendar-table {border: none; }
.daterangepicker .calendar th, .daterangepicker .calendar td {white-space: nowrap;text-align: center;min-width: 32px; }
.daterangepicker .calendar-table {border: 1px solid #fff;padding: 4px;border-radius: 4px;background-color: #fff; }
.daterangepicker table {width: 100%;margin: 0; }
.daterangepicker td, .daterangepicker th {text-align: center;width: 20px;height: 20px;border-radius: 4px;border: 1px solid transparent;white-space: nowrap;cursor: pointer; }
.daterangepicker td.available:hover, .daterangepicker th.available:hover {background-color: #eee;border-color: transparent;color: inherit; }
.daterangepicker td.week, .daterangepicker th.week {font-size: 80%;color: #ccc; }
.daterangepicker td.off, .daterangepicker td.off.in-range, .daterangepicker td.off.start-date, .daterangepicker td.off.end-date {background-color: #fff;border-color: transparent;color: #999; }
.daterangepicker td.in-range {background-color: #ebf4f8;border-color: transparent;color: #000;border-radius: 0; }
.daterangepicker td.start-date {border-radius: 4px 0 0 4px; }
.daterangepicker td.end-date {border-radius: 0 4px 4px 0; }
.daterangepicker td.start-date.end-date {border-radius: 4px; }
.daterangepicker td.active, .daterangepicker td.active:hover {background-color: #357ebd;border-color: transparent;color: #fff; }
.daterangepicker th.month {width: auto; }
.daterangepicker td.disabled, .daterangepicker option.disabled {color: #999;cursor: not-allowed;text-decoration: line-through; }
.daterangepicker select.monthselect, .daterangepicker select.yearselect {font-size: 12px;padding: 1px;height: auto;margin: 0;cursor: default; }
.daterangepicker select.monthselect {margin-right: 2%;width: 56%; }
.daterangepicker select.yearselect {width: 40%; }
.daterangepicker select.hourselect, .daterangepicker select.minuteselect, .daterangepicker select.secondselect, .daterangepicker select.ampmselect {width: 50px;margin-bottom: 0; }
.daterangepicker .input-mini {border: 1px solid #ccc;border-radius: 4px;color: #555;height: 30px;line-height: 30px;display: block;vertical-align: middle;margin: 0 0 5px 0;padding: 0 6px 0 28px;width: 100%; }
.daterangepicker .input-mini.active {border: 1px solid #08c;border-radius: 4px; }
.daterangepicker .daterangepicker_input {position: relative; }
.daterangepicker .daterangepicker_input i {position: absolute;left: 8px;top: 8px; }
.daterangepicker.rtl .input-mini {padding-right: 28px;padding-left: 6px; }
.daterangepicker.rtl .daterangepicker_input i {left: auto;right: 8px; }
.daterangepicker .calendar-time {text-align: center;margin: 5px auto;line-height: 30px;position: relative;padding-left: 28px; }
.daterangepicker .calendar-time select.disabled {color: #ccc;cursor: not-allowed; }

.ranges {font-size: 11px;float: none;margin: 4px;text-align: left; }
.ranges ul {list-style: none;margin: 0 auto;padding: 0;width: 100%; }
.ranges li {font-size: 13px;background-color: #f5f5f5;border: 1px solid #f5f5f5;border-radius: 4px;color: #08c;padding: 3px 12px;margin-bottom: 8px;cursor: pointer; }
.ranges li:hover {background-color: #08c;border: 1px solid #08c;color: #fff; }
.ranges li.active {background-color: #08c;border: 1px solid #08c;color: #fff; }

/*  Larger Screen Styling */
@media (min-width: 564px) {
  .daterangepicker {width: auto; }
  .daterangepicker .ranges ul {width: 160px; }
  .daterangepicker.single .ranges ul {width: 100%; }
  .daterangepicker.single .calendar.left {clear: none; }
  .daterangepicker.single.ltr .ranges, .daterangepicker.single.ltr .calendar {float: left; }
  .daterangepicker.single.rtl .ranges, .daterangepicker.single.rtl .calendar {float: right; }
  .daterangepicker.ltr {direction: ltr;text-align: left; }
  .daterangepicker.ltr .calendar.left {clear: left;margin-right: 0; }
  .daterangepicker.ltr .calendar.left .calendar-table {border-right: none;border-top-right-radius: 0;border-bottom-right-radius: 0; }
  .daterangepicker.ltr .calendar.right {margin-left: 0; }
  .daterangepicker.ltr .calendar.right .calendar-table {border-left: none;border-top-left-radius: 0;border-bottom-left-radius: 0; }
  .daterangepicker.ltr .left .daterangepicker_input {padding-right: 12px; }
  .daterangepicker.ltr .calendar.left .calendar-table {padding-right: 12px; }
  .daterangepicker.ltr .ranges, .daterangepicker.ltr .calendar {float: left; }
  .daterangepicker.rtl {direction: rtl;text-align: right; }
  .daterangepicker.rtl .calendar.left {clear: right;margin-left: 0; }
  .daterangepicker.rtl .calendar.left .calendar-table {border-left: none;border-top-left-radius: 0;border-bottom-left-radius: 0; }
  .daterangepicker.rtl .calendar.right {margin-right: 0; }
  .daterangepicker.rtl .calendar.right .calendar-table {border-right: none;border-top-right-radius: 0;border-bottom-right-radius: 0; }
  .daterangepicker.rtl .left .daterangepicker_input {padding-left: 12px; }
  .daterangepicker.rtl .calendar.left .calendar-table {padding-left: 12px; }
  .daterangepicker.rtl .ranges, .daterangepicker.rtl .calendar {text-align: right;float: right; } 
}
@media (min-width: 730px) {
  .daterangepicker .ranges {width: auto; }
  .daterangepicker.ltr .ranges {float: left; }
  .daterangepicker.rtl .ranges {float: right; }
  .daterangepicker .calendar.left {clear: none !important; } 
}
#DRdaterange {position:relative;cursor: pointer;}       
#DRdaterange span {white-space: nowrap;display: block;overflow: hidden;text-overflow: ellipsis;}

@media (max-width:980px) {
  .plan {font-size:15px;}
  .col2{display:grid;grid-template-columns:1fr;gap:40px;margin:40px 0;}
  .col2 .img{order:1}  
  .col2 .texte{order:2}
  header nav {font-size: 16px;}
  
  .content.appartement {grid-template-columns:1fr;}
  .content.appartement .zoneHead{order:0}  
  .content.appartement .zonePhoto{order:1;margin: 0;}
  .content.appartement .zoneEquipement{order:2}
  .content.appartement .zoneReservation{order:3}
  #zform .zhi {display: block;position: static;border: 0 none; }
  #zform h3 {box-shadow:none;text-shadow:none;background:transparent;color:#303030;cursor:default;border: 0px none;border-bottom: 1px solid #303030;border-radius: 0;}
  #zform h3:after {content:'';}
  .zoneHead {padding:0;}
  .zoneHead .plan_appt {margin: 20px 0;}
  h1 {font-size: 30px;}
}
@media (max-width:790px) {.plan {font-size:13px;}header nav {padding: 0 10px;}header nav > a{margin: 0px 10px;}}
@media (max-width:680px) {.plan {font-size:11px;}}
@media (max-width:640px) {.plan {font-size:9px;}}
@media (max-width:600px) { 
  .plan {font-size:8px;}
  .col2{display:grid;grid-template-columns:1fr;gap:40px;margin:40px 0;}
  .col2 .img{order:1}  
  .col2 .texte{order:2}
  header {height: 100vh;}
  header .btnm {display:block;}  
  .menuOpen header nav {height:100%;position:fixed;}
  header nav {flex-direction: column;font-size: 18px;line-height: 60px;height: 60px;}
  header nav > a {visibility:hidden;opacity:0;max-height:0;margin:0}
  .menuOpen header nav > a {visibility:visible;opacity:1;max-height:60px;}     
  header nav > a.selected {opacity: 1;visibility: visible;max-height:60px;} 
  
}
@media (max-width:480px) {.plan {font-size:7px;}}
@media (max-width:380px) {.plan {font-size:6px;}}