@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;1,300&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css");

@font-face {
    font-family: "Butler";
    src: url(/assets/fonts/butler.otf) format('opentype');
    font-weight: normal;
}
@font-face {
    font-family: "Butler Light";
    src: url(/assets/fonts/butler-light.otf) format('opentype');
    font-weight: normal;
}
@font-face {
    font-family: "Butler Medium";
    src: url(/assets/fonts/butler-medium.otf) format('opentype');
    font-weight: normal;
}

@font-face {
    font-family: "Arcamajora";
    src: url(/assets/fonts/arcamajora.otf) format('opentype');
    font-weight: normal;
}

@font-face {
    font-family: "EyeCatching";
    src: url(/assets/fonts/eyecatching.ttf) format('truetype');
    font-weight: normal;
}

:root {

    --white:#fff;
    --green:#3a504c;
    --orange:#B4A082;
    --light-green:#fafcfa;
    --brd-green:rgba(131,138,124,.3);
    --brd-light-green:rgba(131,138,124,.20);
    --btn-green:#3a504c;
    --btn-orange:#B4A082;

}

#wrapper {padding:80px 0}

.dnone {display:none}
.dblock {display:block}
.mblock {display:none}
.clear {clear:both}

.mt10 {margin-top:10px !important}
.mt20 {margin-top:20px !important}
.mt40 {margin-top:40px !important}
.mt50 {margin-top:50px !important}
.mt80 {margin-top:80px !important}
.mt100 {margin-top:100px !important}

.mb20 {margin-bottom:20px !important}
.mb40 {margin-bottom:40px !important}
.mb50 {margin-bottom:50px !important}
.mb80 {margin-bottom:80px !important}

.pt20 {padding-top:20px !important}

.pr100 {padding-right:100px}

.separator {border-bottom:1px solid var(--brd-light-green);margin:15px 10%}
.separator_full {border-bottom:1px solid var(--brd-light-green);margin:25px 0}

.green {color:var(--green) !important}
.orange {color:var(--orange) !important}
.italic {font-style:italic !important}

.txt-right {text-align:right !important}

.butler-bold {font-family:"Butler" !important;letter-spacing:0 !important}

h1 {font-family:"EyeCatching",serif;font-style:normal;color:var(--green);font-size:60px}
h2 {font-family:"Butler",serif;font-weight:300;font-style:normal;color:var(--orange);font-size:24px}
h2.room_ttl {margin:30px 0 -20px 0;font-family:"Butler";letter-spacing:1px}
.room_box_ttl {letter-spacing:0 !important;color:var(--green);}
p {font-family:"Cormorant Garamond",serif;font-weight:400;color:var(--green);font-size:16px}
a {font-family:"Arcamajora",serif;font-weight:300;color:var(--green);font-style:normal;text-decoration:none;transition:all .5s linear;
    border:0 !important;font-size:10px;text-transform:uppercase;letter-spacing:1px}
a:hover {color:var(--orange);border-bottom:1px solid var(--green);}
a.lnk {border:0 !important}

.box {background:var(--light-green);padding:30px 50px}
.box p {font-style:italic;line-height:2.5em;font-size:16px}

.title {font-size:27px}
.room_title {font-size:21px !important}
.title_room {font-size:27px;font-family:"Butler",serif;}
.ttl {font-size:24px;font-style:normal !important}

.data {border:1px solid #f5f5f5;margin:0}
.data div {padding:20px 0}
.data_ttl {font-family:"Butler",serif;font-weight:500;color:var(--orange);font-size:13px;letter-spacing:1px;text-transform:uppercase;display:inline-block}
.data_txt {font-family:"Butler",serif;font-weight:500;color:var(--green);font-size:13px;display:inline-block;text-transform:uppercase;padding-left:0}
.brd {border-right:1px solid #f5f5f5}

.room {background:var(--light-green);padding:0 0 40px 0}
.room .data_ttl{padding:20px 0 10px 0}
.room p {font-style:italic;line-height:1.4em;font-size:18px;text-align:center;padding:0}
.room-slk .room {margin:0 10px}

.room_txt {font-style:normal !important;font-size:16px !important;padding:0 50px !important}
.room-det-btn {margin:0 auto 20px auto;display:inline-block}
.room_keys {margin-bottom:0}

a, .slick-slide {outline: none !important}
.slk-container {position:relative}
.slk-arrow div {position:absolute;top:45%;cursor:pointer;background:rgba(255,255,255,0);color:var(--green);font-size:30px;padding:10px;transition:all .7s;}
.slk-arw {display:flex;justify-content: space-between;}
.slk-arw div {cursor:pointer;background:rgba(255,255,255,.8);color:var(--green);font-size:30px;padding:10px;transition:all .7s;width:50px}
.slk-arrow div:hover, .slk-arw div:hover {opacity:.6}
.slk-arrow .arw-left{left:-50px}
.slk-arrow .arw-right{right:-50px}

.tariffa {font-weight:300;font-style:normal !important;margin-bottom:0}
.tariffa strong {font-weight:600 !important}
.price_ttl {text-transform:uppercase;font-size:12px !important;font-style:normal !important;font-weight:400;letter-spacing:1px}
.price_total {margin-bottom:5px}
.price {font-size:26px !important;color:var(--orange);font-style:normal !important;font-weight:600 !important;margin:10px auto;font-family:"Butler"}

._btn {background:var(--btn-green) !important;padding:15px 30px;font-size:12px;text-transform:uppercase;color:var(--white) !important;
    letter-spacing:2px;font-style:normal !important;transition:all .7s;margin-top:10px;border:0 !important;display:inline-block}
.btn-green, .swal-button, .btn-orange {background:var(--btn-green) !important;padding:15px 30px;font-size:12px;text-transform:uppercase;color:var(--white) !important;
    letter-spacing:2px;font-style:normal !important;transition:all .7s;margin-top:10px;border:0 !important}
.swal-button--delete {background:var(--orange)}
.btn-green:hover, .swal-button:hover {background:var(--orange) !important}
.btn-orange {background:var(--btn-orange) !important}
.btn-orange:hover {background:var(--green) !important}
.btn-green {background:var(--btn-green) !important}
.btn-green:hover {background:var(--orange) !important}
.btn-big {padding:15px 40px;font-size:13px}
.btn-small {padding:10px 20px;font-size:11px}

.btn-disp, .btn-disp-picker, .btn-disp-picker_date {background:var(--green) !important;color:#fff !important;transition:all .5s linear;cursor:pointer}
.btn-disp:hover, .btn-disp-picker:hover, .btn-disp-picker_date:hover {opacity:.7}
.btn-disp .data_ttl, .btn-disp-picker .data_ttl, .btn-disp-picker_date .data_ttl {color:#fff}

.selezione {text-transform:none;color:var(--orange);font-style:bold !important;font-size:22px;letter-spacing:1px}

.recap {text-align:left !important}
.recap .data_ttl{padding:0 !important}
.recap_fixed {position:fixed;top:20px;width:auto}

.frm p {font-size:16px}

select {appearance: none;-webkit-appearance: none;border-radius:0 !important}
input, textarea, select {font-family:"Cormorant Garamond",serif;font-weight:400;color:#222;font-size:22px;outline:none !important}
input, select {border:1px solid var(--brd-light-green);width:100%;margin:8px 0;padding:15px 20px}
textarea {border:1px solid var(--brd-light-green);width:100%;height:100px;margin:10px 0;padding:20px} 
input:focus, textarea:focus, select:focus {border:1px solid var(--green)}

.mfrm select{display:block;padding:20px !important;max-width:100%;width:100%;height:auto!important;border:1px solid var(--brd-light-green);border-radius:0;
    background-color:#fff;color:var(--gold);font-size:22px;line-height:22px!important;appearance:none;-webkit-appearance:none;-moz-appearance:none;outline:none !important}
.mfrm select option{padding:0 4px}
.mfrm select::-ms-expand{display:none}

.form-radio{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-block;position:relative;
	background-color:#ddd;color:#fff;top:-10px;height:40px;width:20px;border:0;border-radius:50px;cursor:pointer;margin-right:0;outline:none}
.form-radio:checked::before{position:absolute;font:30px/1 sans-serif;left:10px;top:1px;content:'\02143';transform:rotate(40deg)}
.form-radio:hover{background-color:var(--btn-green)}
.form-radio:checked{background-color:var(--btn-green)}
.form-radio{border-radius:50px}
.form-checkbox{border-radius:3px !important}
.form-radio {transform:scale(0.6) !important}

.selRoom:not(.selected) i, .selExtra:not(.selected) i, .selExp:not(.selected) i, .addRoom:not(.selected) i {display:none}

.modroom {margin-top:30px;margin-bottom:-20px}

._extra, ._roomsel {font-family:"Cormorant Garamond",serif;font-weight:500;color:var(--green);font-size:16px;text-align:left}
._extra strong, ._roomsel strong {font-family:"Cormorant Garamond",serif;font-weight:500;color:var(--orange);font-size:18px;letter-spacing:1px;text-transform:uppercase}

#mobile_recap {position:fixed;bottom:0;left:0;width:100%;background:var(--light-green);border-top:1px solid var(--brd-green);margin:0;z-index:9999}
#mobile_recap .price_ttl {padding:0;margin:10px 0 -5px 0 !important}
#mobile_recap .price {margin:0 0 10px 0;font-size:30px !important}

#mex_box {margin:60px 10px 0 10px}

.swal-modal {border-radius:0}
.swal-text {font-family:"Cormorant Garamond",serif;font-weight:500;color:var(--green);font-size:18px;text-align:center}
.swal-footer {text-align:center}
.swal-button {font-family:"Cormorant Garamond",serif;font-weight:500;border-radius:0}

.alert-green {border-radius:0;background:var(--light-green)}
.alert-green p {font-size:20px !important}

span.d-sm-block {display:inline-block !important}

.modal-content {border-radius:0;position:relative}
#modalcnt {padding:0}
.closebtn {position:absolute;top:20px;right:20px;z-index:99999}

.img-slk div {background:#f5f5f5}

label {font-weight:400;font-style:normal !important;margin-bottom:0;font-family:"Cormorant Garamond",serif;margin:-6px 0 0 15px;display:block;background:#fff;
    position:absolute;z-index:999;padding:0 5px;color:var(--green)}

._dets, ._dets_ {cursor:pointer}
#detbox {font-size:16px !important}

.alert {border-radius:0;font-family:"Cormorant Garamond",serif;font-size:20px;text-align:center}

.pointer {cursor:pointer !important}

.slick-dotted.slick-slider{margin-bottom:80px}
.slick-dots{position:absolute;bottom:-75px;display:block;width:100%;padding:0;margin:40px 0;list-style:none;text-align:center}
.slick-dots li{position:relative;display:inline-block;width:20px;height:20px;margin:0 5px;padding:0;cursor:pointer}
.slick-dots li button{font-size:0;line-height:0;display:block;width:20px;height:20px;padding:5px;cursor:pointer;color:transparent;border:0;outline:none;background:transparent}
.slick-dots li button:hover,.slick-dots li button:focus{outline:none}
.slick-dots li button:hover:before,.slick-dots li button:focus:before{opacity:1}
.slick-dots li button:before{font-family:'slick';font-size:20px;line-height:20px;position:absolute;top:0;left:0;width:20px;height:20px;content:'•';text-align:center;opacity:.25;color:var(--green);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.slick-dots li.slick-active button:before{opacity:1;color:var(--green)}

.recapBtn {display:inline-block;margin-top:20px}

.thank-you {font-size:60px;line-height:50px}

.offer_det {display:none}
.offer_det_active {display:block}
._accordion_title {cursor:pointer}
._accordion_exp {display:none}

small.detbox {font-family: "Butler",serif;font-weight: 300;color:var(--green);font-size:14px;display:block;margin-top:-10px;white-space: nowrap;}

/*Calendar*/
.daterangepicker {border-radius:0;border:1px solid #f5f5f5 !important;margin-top:0 !important}
.daterangepicker .drp-calendar {width:430px !important;max-width:1000px !important;padding:40px !important;
    font-family: "Cormorant Garamond",serif;font-weight:300 !important;}
.daterangepicker td {padding:10px !important;font-size:14px !important;height:28px !important;line-height:28px !important;font-family:"Butler" !important}
.daterangepicker th {font-weight:normal !important;font-size:16px !important}
.daterangepicker th.month {padding-bottom:30px !important;font-size:18px !important;font-weight:normal}
.daterangepicker th.next, .daterangepicker th.prev {padding-bottom:30px !important} 
.daterangepicker th:hover, .daterangepicker th:hover {background:none !important}
.daterangepicker td.active, .daterangepicker td.active:hover {background:var(--green) !important;border-radius:50% !important}
.daterangepicker td.available:hover {background:#eee !important;border-radius:50% !important}
.daterangepicker:before, .daterangepicker:after {display:none !important}

.dpick, .dpicker, .dpick_checkout {cursor:pointer}
.dpdown {padding:0 !important;cursor:pointer}
.dropdown-menu.show {width:215px;margin-top:18px !important;border-radius:0;border:1px solid #f5f5f5;padding:20px;text-align:center}
.dropdown-item {padding:10px 5px;font-family: "Butler",serif;font-weight: 500;font-size:15px}
.dropdown-item:active {background-color:#fff;}

.form-error {border:1px solid #ed193a !important}

#_lang {position:absolute;top:40px;left:30px;font-size:16px;cursor:pointer}
#_account {position:absolute;top:40px;right:30px;font-size:20px;cursor:pointer}
.lnr-user {font-size:20px;display:inline-block;margin:0 0 -8px 10px}
.dropdown-account li {text-align:right}
.dropdown-account li a{font-size:15px;text-transform:none}

.lang_sel a {font-size:13px;display:inline-block;margin:0 5px;border:1px solid #ddd;padding:8px;width:40px}
.lang_sel a.active {color:var(--orange)}
#_lang a {font-size:11px !important;border:0;margin:0 !important;padding:0 !important;width:20px}

.selected_room_title {color:var(--green)}
._logo {margin:-40px auto 40px auto}

.selected_room_title {text-transform:none;letter-spacing:0}
#send_reservation_box {display:none}

#spinner {display:none;position:fixed;top:0;left:0;width:100%;height:100vh;background:rgba(255,255,255,.6)}

@media only screen and (max-width:768px) {

    .slk-arrow .arw-left{left:-5px;top:40%}
    .slk-arrow .arw-right{right:-5px;top:40%}

}

@media only screen and (max-width:600px) {

    .mnone {display:none}
    .mblock {display:block}
    ._logo {margin:-46px auto 40px auto}

    .pr100 {padding-right:0 !important}
    .box {margin-top:30px;padding:30px 15px}
    .data {margin:0 10px}
    .brd {border:0 !important}
    .data_ttl {display:block;font-size:18px}
    .data_txt {display:block;padding-left:0;font-size:18px !important}
    .room {margin-bottom:20px}

    .recap .data_ttl {display:inline-block}
    .recap .data_txt {display:inline-block;padding-left:10px}

    #goExtra, #confirmBtn {margin-bottom:60px !important}

    .slick-dots li {width:14px}
    .btn-big {padding:15px}

    .modal_add_room {margin:0 30px}

    p {font-size:18px}

    .room .ttl{padding:30px 0 0 0}
    #mobile_recap .total {margin-top:10px}

    .wrapper_offer .data_ttl, .wrapper_offer .data_txt {transform:scale(80%)}
    .wrapper_offer .mobile_recap {display:none}

    /*Calendar*/
    .daterangepicker {border-radius:0;border:1px solid #ccc !important;margin-top:0 !important;position:fixed !important;top:45vh !important;
        bottom:0 !important;left:10px !important;width:calc(100% - 20px) !important}
    .daterangepicker .drp-calendar {width:auto !important;padding:20px !important;
        font-family: "Cormorant Garamond",serif;font-weight:300 !important;}
    .daterangepicker td {padding:5px !important;font-size:14px !important;height:24px !important;line-height:20px !important;font-family:"Butler" !important;font-weight:normal}
    .daterangepicker th {font-weight:normal !important}
    .daterangepicker th.month {padding-bottom:10px !important;font-size:16px !important;font-weight:normal}
    .daterangepicker th.next, .daterangepicker th.prev {padding-bottom:10px !important} 
    .daterangepicker th:hover, .daterangepicker th:hover {background:none !important}
    .daterangepicker td.active, .daterangepicker td.active:hover {background:var(--green) !important;border-radius:0 !important}
    .daterangepicker td.available:hover {background:#eee !important;border-radius:0 !important}
    .daterangepicker:before, .daterangepicker:after {display:none !important}

}