@import url('https://fonts.googleapis.com/css2?family=Bitter:ital,wght@0,100..900;1,100..900&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
:root {
    --theme-bgcolor: #1e1c15;    
    --theme-bgcolor-faded: #1e1c15cc;    
    --theme-fontcolor: #fff; 
    --theme-input-color: #605f5f99;
    --theme-button-color: #ffd706;
    --theme-button-fontcolor: #000;
    --theme-hrcolor: #000;
    --theme-borderradius: 0.5em;
}
::-webkit-scrollbar-thumb { background: var(--theme-button-color);}
::-webkit-scrollbar-track { background:var(--theme-input-color); }
::placeholder { color: var(--theme-fontcolor); opacity: .3; }

/* Autofill */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active{ box-shadow: 0 0 0 30px var(--theme-input-color) inset !important; transition: none !important; border:0 !important; color:var(--theme-fontcolor) !important; -webkit-text-fill-color: var(--theme-fontcolor) !important; }

body { background: #23211b; font-size:15px; }
body, h1, h2, h3 { color:var(--theme-fontcolor); }
p, label { color:var(--theme-fontcolor); font-weight: 300; }
body, p { font-family: 'Inter', tahoma, helvetica; }
h1, h2, h3 { font-family: 'Bitter', tahoma, helvetica; text-transform: uppercase; font-weight: 700; }
h1 { font-size:2.2em; }
h2 { font-size:1.6em; }
h3 { font-size:1.3em; }
a { color:var(--theme-button-color); }
hr { border:0; border-top:1px solid #663a3244; }
label { text-transform: none; margin:0 0 .5em; }

.fa-arrow-left:before { content:'\f177'; }
.fa-arrow-right:before { content:'\f178'; } 
.slider { background: var(--theme-bgcolor); }
.agreement h1:after { display:none; } 

/* Booking */
button.bookButton { opacity:1; transition: opacity .2s ease-in-out; position: absolute; top:calc(50% + 10vh); left:25%; transform: translateX(-50%); background:var(--theme-button-color); color:var(--theme-button-fontcolor); box-shadow: none; padding: 0 1em; height: 50px; border-radius: .5em; font-family: 'Bitter'; font-weight: 700; max-width: 15vw; min-width: 200px; }
button.bookButton:after { content: '\f178'; font-family: 'FontAwesome'; margin-left: 1em; transition: margin .2s ease-in-out; }
button.bookButton:hover:after { margin-left: 1.5em; transition: margin .2s ease-in-out; }
button:not(.card button).bookButton:active { transform:translateX(-50%) scale(.95) !important; }
view[name="booking"]:not(:has([data-name="step1"])) button.bookButton { opacity: 0; animation:salute_animateaway .2s forwards; animation-delay:1s; }


/* Hero */
.hero .logo, .top .logo { background-image:url('salute_logo_yellow.svg'); left: 50%; top: 0; width:100%; height:7vw; min-height: 80px; position: absolute; background-size: contain; background-repeat: no-repeat; background-position: center center; transform:translateX(-50%); background-origin: content-box; padding: 1em 5em;}
.hero:before, .hero:after { display: none; }
.top { height:auto; }
/* [data-name]>.top, view[name="checkout"] .top { height:9vh; max-height:9vh; } */

.hero[data-lazybg] { display:none; opacity: 0; transition:all .3s ease-in-out; }
.hero[data-lazybg][data-lazybgstate="loading"] { display: block; opacity: 0; }
.hero[data-lazybg][data-lazybgstate="loaded"] { display: block; opacity: 1 !important; }
[data-name]:not([data-name="step2"])>.top>.hero { background:none !important; padding:0; overflow:visible; height:9vh; }

/* Step 2 */
[data-name="step2"] .top { position: relative; display: block !important; width: 100%; aspect-ratio: 16/9; max-height: 100%; opacity:1; }
[data-name="step2"] .top .logo { display: none; }
[data-name="step2"] .top .hero { display: block !important; width: 100%; height: 100%; opacity: 0; background-size:cover !important; max-height: 100vh !important; padding:0; }

/* Datepicker */
.datepickerwrap { box-shadow: none; transition: all .2s ease-in-out; height:auto; }
.datepickerwrap input { height:42px; min-height: 42px; background: var(--theme-input-color); box-shadow: none; border:none; font-family: 'Inter', tahoma, helvetica; font-size:12px; font-weight: 600; color:var(--theme-fontcolor); padding: 0 60px 0 10px; border-radius: .5em; }
.datepickerwrap:active { transition: all .0s ease-in-out; transform: scale(95%) !important; box-shadow: none;}
.datepickerwrap:after { width:42px; height:42px; line-height:42px; box-shadow: none; color: var(--theme-button-fontcolor); background: var(--theme-button-color); border-left: 0; border-top-right-radius: .5em; border-bottom-right-radius: .5em; padding: 0; }
.ui-datepicker { background:var(--theme-bgcolor); border:0; border-radius: .5em; }
.ui-datepicker, .ui-datepicker .ui-datepicker-header, .ui-datepicker .ui-datepicker-title { border-radius: .5em; }
.ui-datepicker .ui-datepicker-header { background: var(--theme-bgcolor); }
.ui-datepicker .ui-datepicker-title { background: var(--theme-bgcolor); font-size: 14px; text-transform: none; border: 0; border-radius: 1em 1em 0 0; color: #fff; }
.ui-datepicker .ui-datepicker-prev:before,
.ui-datepicker .ui-datepicker-next:before { color:#fff; }
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { background: var(--theme-input-color); border:0; border-radius: .5em; color:var(--theme-fontcolor); transition: transform .2s ease-in-out; font-family: 'Inter'; font-weight: 400; }
.ui-state-hover { transform: translateY(-3px); }
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { background:var(--theme-button-color); color:var(--theme-button-fontcolor); }
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active,
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight { border-color: #0000; }

/* Messages */
.messages_container:empty { display:none; }
.messages_container:not(:empty) { background: var(--theme-input-color); border-radius: 1em; padding:1em; margin:2em 0; display:none; animation:fadeIn .5s ease-in-out forwards; }
.messages_container p:first-child { margin-top:0; }
.messages_container p:last-child { margin-bottom:0; }

/* Bookingperiod selector */
.bookingperiodselector .selectwrapper:after { content: '\f078'; background: var(--theme-button-color); width: 42px; height: 100%; position: absolute; border-radius: 0; top: 0; right: 0; pointer-events: none; font-family: 'FontAwesome'; color: var(--theme-button-fontcolor); font-size: 1.1em; text-align: center; line-height: 50px; }
.bookingperiodselector .selectwrapper select { appearance: none; font-size: 1em; background: var(--theme-input-color); border-color:#0000; border-radius: .5em; padding-right: 64px; }
.bookingperiodselector .selectwrapper select option { background-color: var(--theme-input-color); }
.bookingperiod { position: relative;}

/* Numselector */
.numselector { background: none; box-shadow: none; width: 130px; grid-template-columns: 42px 1fr 42px; height:auto; }
.numselector input { border:0; background:var(--theme-input-color); font-family: 'Inter', tahoma, helvetica; font-size:12px; font-weight: 600; color:var(--theme-fontcolor); height:42px; min-height: 42px; line-height: 42px; }
.numselector button { line-height: 44px; width:42px; }
.numselector button:first-child { border:0; border-right:none; height:42px; background: var(--theme-button-color); color:var(--theme-button-fontcolor); border-top-left-radius:.75em; border-bottom-left-radius:.75em;  }
.numselector button:last-child { border:0; border-left:none; height:42px; background: var(--theme-button-color); color:var(--theme-button-fontcolor); border-top-right-radius:.75em; border-bottom-right-radius:.75em; }

/* Timeslots */
.timeslots_container[data-numavailabletimeslots="0"]:after { content:'Ingen mulige tider'; }
.timeslots { display:grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr; grid-gap:16px; margin:2em 0; }
.timeslot { background:var(--theme-input-color); color:var(--theme-fontcolor); margin:0; box-shadow: none; border-radius: .5em; align-content: center;}
.timeslot:not(.selected):hover { transform: scale(1.05) !important; box-shadow: none; }
.timeslot .pricebadge { background: var(--theme-button-color); color:var(--theme-button-fontcolor); top:-5px; left:-5px; right:auto; font-size: .85em; font-weight: 700; }
.timeslot .quantitybadge { background: none; box-shadow: none; top: -16px; right: 5px; font-size: 1em; border-radius: 0; border: none; margin: 10px 0 0; font-weight: 700; transform: none; position: static; padding: 10px 0 0; display: block; width: 100%; border-top: 1px solid #fffafa50; }
.timeslot.disabled { background:var(--theme-input-color); color:var(--theme-button-fontcolor); position: relative; text-decoration: line-through; }
.timeslot.disabled:hover { transform:none !important; }
.timeslot.selected, .timeslot.selected:hover { background:var(--theme-button-color); color:var(--theme-button-fontcolor); box-shadow: none; }
.timeslot.selected .quantitybadge{ color:var(--theme-button-fontcolor); border-color: var(--theme-button-fontcolor);}
.timeslot.selected .pricebadge { background: var(--theme-bgcolor); color:var(--theme-fontcolor); }
.timeslot.selected .pricebadge .currency { display: none; }

/* Files */
.files { margin:1.5em 0 2.5em; }
.files .file a {text-overflow: ellipsis; overflow: hidden; display: inline-block; white-space: nowrap; max-width: 100%; }
.files .file a:before { content:'\f15b'; font-family: 'FontAwesome'; margin:0 1em 0 0; }

/* Buttons */
.cart .item .delete, .checkoutcart .item .delete, .confirmselection .item .delete, .fastcheckout .customerinfo .delete { aspect-ratio: 1; width:50px; }
button:not(.card button):disabled, a.button:disabled, button:not(.card button).disabled, a.button.disabled { background: var(--theme-input-color); color: var(--theme-button-fontcolor); }
button, a.button { background:var(--theme-input-color); color:var(--theme-fontcolor); box-shadow: none; border:0; font-family: 'Inter'; font-weight: 700; border-radius: .5em; font-size:1em; }
.modal_window button, .modal_window a.button { background:var(--theme-button-color); color:var(--theme-button-fontcolor); }
button.green { background:var(--theme-button-color); color:var(--theme-button-fontcolor); box-shadow: none;}
.viewcontent .navbuttons, [data-enablecart=""] .pagecontent .navbuttons { max-width:1280px; }


.inputwrapper.validated:after { content:'\f00c'; font-family: 'FontAwesome'; top:50%; right:1em; background: none; width:auto; border:0; left:auto; transform: translateY(-50%); height:auto;}
.inputwrapper.error:after { display: none; }

input[type=checkbox] + label { background:var(--theme-input-color); box-shadow: none; border:0; border-radius: .25em; }
input[type=checkbox] + label:after { color:var(--theme-button-color); }
input[type=checkbox]:checked + label { color:#fff; box-shadow: none; border:0; }
input[type=checkbox]:checked + label:after { color:#fff; }

/* Booking */
[data-enablecart=""] .app>view[name=booking], [data-enablecart=""] .app>view[name=checkout] { display:grid; grid-template-columns: 1fr 1fr; }
[data-enablecart=""] .app>view[name=booking]:before, [data-enablecart=""] .app>view[name=checkout]:before { animation:fadeIn 1s cubic-bezier(0.075, 0.82, 0.165, 1); content:''; background: url('salute_logo_yellow.svg') no-repeat center calc(50% - 4vh); background-size: 40%; width:100%; height:100%; order:1; box-shadow: inset -10px 0 4em #00000008; }
[data-enablecart=""] view[name=booking] .scrollable>.top, [data-enablecart=""] view[name=checkout] .scrollable>.top { display:none; }
[data-enablecart=""] view[name=booking] .slider { order:2; }
[data-enablecart=""] view[name=booking] .cartContainer { display: none; }
[data-enablecart=""] view[name=booking] .viewcontent .navbuttons { transform:none; left:0; padding: 0 4em 2em; }
[data-enablecart=""] .app>view[name=checkout] .viewcontent .navbuttons, [data-enablecart=""] .pagecontent .navbuttons { transform:none; left:50%; padding: 0 4em 2em; }

[data-enablecart=""] view .viewcontent { margin:0; }
view[name=booking] .scrollable>.content,
view[name=checkout] .scrollable>.content { padding-top:0; }

view[name=booking] .scrollable.hasNavbuttons:before, 
view[name=checkout] .scrollable.hasNavbuttons:before { background: linear-gradient(to bottom, #0000, var(--theme-bgcolor) 100%); }
view[name=booking] .scrollable.hasNavbuttons:before,
[data-enablecart=""] .app>view[name=checkout] .scrollable.hasNavbuttons:before { left:50%; width:50%;  }
view[name=booking] .scrollable.hasNavbuttons:before, [data-enablecart=""] .app>view[name=checkout] .scrollable.hasNavbuttons:before { left:0; width:100%; }

/* Step 1 */
[data-enablecart=""] [data-name=step1] .viewcontent { min-height:600px; height:100%; max-width: 100%; display:grid; grid-template-rows: 1fr auto; padding:1em; }
[data-enablecart=""] [data-name=step1] .content:has(.resourceTypes[data-num]) { display: grid; grid-template-rows: auto 1fr; height:100%; }
[data-enablecart=""] [data-name=step1] .content:has(.resourceTypes[data-num]):before { content:'Arrangementer'; position:relative; padding:.5em .5em 0; text-align: center; display: block; font-family: 'Bitter'; font-weight: 600; font-size:2em; color: var(--theme-fontcolor); }
[data-enablecart=""] [data-name=step1] .content:has(.resourceTypes[data-num="1"]):before { display:none; }
[l="step1_title"] { display:none; }
[l="step1_text"] { display:none; }

.inputs[data-numdates="1"] .selectors .inputwrapper:first-child { display:none !important; }

/* Resourcetypes */
.resourceTypes { display: grid; width: 100%; min-height: 500px; grid-gap:1em; grid-template-columns: 1fr 1fr; }
.slick-initialized .slick-slide { position: relative; }
[data-name=step1].scrollable:before { content:'';position: absolute; bottom:-100px; width:100%; height:100px; left:0; z-index: 1002; background: linear-gradient(to bottom, #0000, var(--theme-bgcolor)); transition: all 1s cubic-bezier(0.075, 0.82, 0.165, 1); }
[data-name=step1].scrollable[data-scrolltop="0"]:before { bottom:0; }
[data-name=step1].scrollable:after { content:'\f107'; text-align: center; font-size:24px; color:var(--theme-button-color); line-height: 50px; font-family: 'FontAwesome'; position: absolute; bottom:0; width:100%; height:50px; left:0; opacity: 0; z-index: 1002; transition: all 1s cubic-bezier(0.075, 0.82, 0.165, 1); }
[data-name=step1].scrollable[data-scrolltop="0"]:after { opacity:1; animation:salute_float 2s ease-in-out infinite; transition-delay: .5s; }
[data-name=step1].scrollable[data-scrolltop="0"]:has(.resourceTypes[data-num="1"]):after, /* Remember that with one event - num = 2, as we also have a hidden Book bord element */
[data-name=step1].scrollable[data-scrolltop="0"]:has(.resourceTypes[data-num="2"]):after,
[data-name=step1].scrollable[data-scrolltop="0"]:has(.resourceTypes[data-num="3"]):after { display:none; }

[data-name=step1] .resourceTypes .resourceType { width:100%; min-height:calc(25vh - 3em); display: block; padding:0; animation:none !important; border-top:1px solid var(--theme-bgcolor); }
[data-name=step1] .resourceTypes .resourceType:first-child { display:none; }


/* [data-name=step1] .resourceTypes .resourceType:first-child:after { content: 'Arrangementer'; font-family: 'Bitter'; font-weight: 600; font-size:1em; position: absolute; bottom: 0; left: 50%; padding: 1em 2em; border-radius: 2em; transform: translate(-50%,50%); background: var(--theme-bgcolor); color: var(--theme-button-color); z-index: 1001; transition: all .2s ease-in-out; } */

[data-name=step1] .resourceTypes[data-num="1"] .resourceType:first-child:after { display: none; }
/* [data-name=step1] .resourceTypes[data-num="2"] .resourceType { min-height:calc(50vh - 45px); } */

[data-name=step1] .resourceTypes .resourceType .card { border:1px solid #666; z-index: 1 !important; border-radius: 0; min-height: 300px; background: var(--theme-bgcolor); box-shadow: none; animation: none; opacity: 1 !important; grid-template-rows: 1fr auto; }
/* [data-name=step1] .resourceTypes .resourceType .card:before { content:''; position: absolute; height: 64px; width: 100%; background: linear-gradient(to bottom, var(--theme-bgcolor-faded), transparent); z-index: 1; } */
[data-name=step1] .resourceTypes .resourceType .card:active { transform:none !important; }
[data-name=step1] .resourceTypes .resourceType .top { display:block; position:relative; width:100%; height:auto; aspect-ratio: 16/9; background-size: cover; transform:none; border-radius: 0; transition: all .3s cubic-bezier(0.075, 0.82, 0.165, 1); animation:none; }
[data-name=step1] .resourceTypes .resourceType .top:after { display:none; }
[data-name=step1] .resourceTypes .resourceType:hover .top { transform:scale(1.05); }
[data-name=step1] .resourceTypes .resourceType .actions { background: none; box-shadow: none; margin:1.5em 0 0 0; padding:0; }
/* [data-name=step1]:not(:has(.resourceTypes[data-num="1"])) .resourceType:last-child .content,
[data-name=step1]:not(:has(.resourceTypes[data-num="2"])) .resourceType:last-child .content { padding-bottom:6em; } */

[data-name=step1] .resourceTypes .resourceType .card span {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
}

[data-name=step1] .resourceTypes .resourceType .content { position: relative; display: grid; grid-template-columns: auto 1fr; grid-auto-rows: auto; opacity:1; bottom:0; left:0; width:100%; height:auto; padding:2.5em 2em; background: linear-gradient(to bottom, #0000 0%, var(--theme-bgcolor-faded) 33%); }
[data-name=step1] .resourceTypes .resourceType .content > :nth-child(1) { grid-column: 1; }
[data-name=step1] .resourceTypes .resourceType .content > :nth-child(2) { grid-column: 2; }
[data-name=step1] .resourceTypes .resourceType .content > :nth-child(n+3) { grid-column: 1 / -1; }
[data-name=step1] .resourceTypes .resourceType .content h3 { font-size:1.5em; margin:0; }
[data-name=step1] .resourceTypes .resourceType .content p { margin:.5em 0 0 0; }
[data-name=step1] .resourceTypes .resourceType .card button { display: flex; justify-content: center; align-content: center; flex-wrap: wrap; background:var(--theme-button-color); color:var(--theme-button-fontcolor); box-shadow: none; padding: 0 1em; height: 50px; border-radius: .5em; font-family: 'Bitter'; font-weight: 700; width: 100%; }
[data-name=step1] .resourceTypes .resourceType button:after { content: '\f178'; font-family: 'FontAwesome'; margin-left: 1em;  transition: all .2s ease-in-out; }
[data-name=step1] .resourceTypes .resourceType:hover button:after { margin-left: 1.5em;  transition: all .2s ease-in-out; }

.resourceType .card .content .date { color:var(--theme-fontcolor); font-size:1.2em; font-weight: 700; text-align: center; position: relative; }
.resourceType .card .content .date .datewrapper { background-color: var(--theme-bgcolor); border-radius: 5px; box-shadow:0 0 0 10px var(--theme-bgcolor); color: var(--theme-fontcolor); margin:10px -10px -10px 10px; }

.resourceType .card .content .date[data-numdates="1"] { display: block; padding-right:1em; }
.resourceType .card .content .date:not([data-numdates="1"]) { display:none; }        
/* .resourceType .card .content .date .month:before { content:'/'; } */
.resourceType .card .content .date .day { display:block; font-size:1.4em; } 
.resourceType .card .content .date .monthnameabr { display:block; } 
.resourceType .card .content .date .month { display: none; } 
.resourceType .card .content .date .year { display: none; } 
.resourceType .card .content .date .hours { display: none; }
.resourceType .card .content .date .minutes { display: none; }
.resourceType .card .content .price:not([data-price="0"]) { display: inline-block; color:var(--theme-fontcolor); font-size:.9em; font-weight: 700; align-items: center; position: absolute; left: -.25em; bottom: calc(2em + 46px); background: var(--theme-bgcolor); padding: .33em .5em; border-radius: .33em; }
/* [data-name=step1]:not(:has(.resourceTypes[data-num="1"])) .resourceType:last-child .card .content .price:not([data-price="0"]),
[data-name=step1]:not(:has(.resourceTypes[data-num="2"])) .resourceType:last-child .card .content .price:not([data-price="0"]) { bottom: calc(2em + 100px); } */
.resourceType .card .content .price .suffix { display: none; }
    
/* Step 2 */
[data-enablecart=""] [data-name=step2] .viewcontent { display:block; max-width: 800px; margin: 0; padding: 3em 4em 100px; height:auto; } /* Important height is auto - otherwise no scrolling ;) */
[data-enablecart=""] [data-name=step2][data-resourcetypeid="cmbet8ka809l4xmwqej50uz4u"] .top { height:100px !important; }
[data-enablecart=""] [data-name=step2][data-resourcetypeid="cmbet8ka809l4xmwqej50uz4u"] .top .hero { display:none !important; }
    
[data-name=step2] h1 { text-transform: uppercase; }
[data-name=step2] h2 { margin: 1em 0 .5em 0 !important; }
[data-name=step2] .description { margin: 0 0 2em 0 !important; }
[data-name=step2] .description h3 { color:var(--theme-button-color); }

/* Step 3 */

/* Products */
.relatedProduct .card .pricebadge { font-family: 'Bitter'; background: var(--theme-button-color); color:var(--theme-button-fontcolor); position: absolute; bottom: .5em; font-size: 1em; font-weight: 700; float: none; margin: 0; padding: .5em; box-shadow: none; }
.relatedProduct .card .actions>div input { border: 0; background: var(--theme-bgcolor); font-family: 'Inter', tahoma, helvetica; font-size: 12px; font-weight: 600; color: var(--theme-fontcolor); height:42px; box-shadow: none; }
.relatedProduct .card .actions>div { max-width:130px; grid-template-columns: 42px 1fr 42px; grid-gap:0; }
.relatedProduct .card button { background:var(--theme-button-color); color:var(--theme-button-fontcolor); height:42px; line-height: 44px; font-size: .75em; }
.relatedProduct .card button:first-child { border-radius: .75em 0 0 .75em; }
.relatedProduct .card button:last-child { border-radius: 0 .75em .75em 0; }
.relatedProduct .card button:active { opacity: .5; }
.relatedProduct .card { background: var(--theme-input-color); border-radius: 1em; padding:1em; margin:0; box-shadow: none; }
.relatedProduct .card .actions { box-shadow: none; background:none; }
.relatedProduct .card .actions:after { display:none; }
.relatedProduct .card .img { overflow: hidden; margin: -1em .5em -1em -1em; height: calc(100% + 2em); border-radius: .5em 0 0 .5em;}
.relatedProduct .card .content { padding:0 .5em 0 1em; }

/* Checkout */
[data-enablecart=""] view[name=checkout] .scrollable { order:2; }
[data-enablecart=""] view[name=checkout] .pagecontent { display:grid; grid-template-rows: 0 auto 1fr auto; max-width: 800px; margin: 0; padding: 3em 4em 100px; min-height:100%; }
view[name=checkout] .scrollable.hasNavbuttons { padding-bottom:0; }

/* Override when checkout inside booking view */
[data-enablecart=""] view[name=booking] view[name=checkout] { grid-template-columns: 1fr; }
[data-enablecart=""] view[name=booking] view[name=checkout]:before { display: none; }
[data-enablecart=""] view[name=booking] view[name=checkout] footer { display: none; }
[data-enablecart=""] view[name=booking] view[name=checkout] .languageSelector { display: none; }
[data-enablecart=""] view[name=booking] view[name=checkout] .scrollable.hasNavbuttons:before { left:0; width:100%;  }
[data-enablecart=""] view[name=booking] view[name=checkout] .scrollable .navbuttons { left:0; }
    
/* Reservationchoices */
.reservationchoices { margin-top:1em; }
.reservationchoice div:last-child { font-size: .9em; }

/* Terms */
.termscontainer div:last-child { font-size: .9em; }

/* Buttons */
.checkoutbuttons button.green:disabled { background: var(--theme-input-color); color:#0002; opacity: 1; }
.checkoutbuttons button.green { background: var(--theme-button-color); color:var(--theme-button-fontcolor); border-radius: var(--theme-borderradius); }

/* Cart */
.cart { background: #eddecb url('papertop_bg.png') repeat-x; box-shadow: inset 50px 0 50px -50px #441f005c; }
.cartButton { background: #212121; box-shadow: 0 0 0 5px #88002622; }
.cartButton .count { background: #4e3f3c; color:#f6f0ee; border-radius: .5em;}
.cartButton.cartvisible { color:#212121; }
.cart .items, .checkoutcart .items { overflow-x: visible; overflow-y: visible;}
.cart .item, .checkoutcart .item, .confirmselection .item { background: var(--theme-input-color); border-radius: 0; padding:1.5em !important; border:0 !important; box-shadow: none !important; }
.cart .item, .checkoutcart .item:first-child, .confirmselection .item:first-child { border-radius: 1em 1em 0 0; }
.cart .item, .checkoutcart .item:last-child, .confirmselection .item:last-child { border-radius: 0 0 1em 1em; }
.cart .item, .checkoutcart .item:first-child:last-child, .confirmselection .item:first-child:last-child {border-radius: .75em;}
.cart .totals, .checkoutcart .totals { background: var(--theme-input-color); border-radius: 0 0 1em 1em; padding:1.5em !important; border:0 !important; box-shadow: none !important; margin-top: 2px; margin-bottom:0; }
.cart .totals>div, .checkoutcart .totals>div { font-family: 'Inter';font-size:1em; }
.cart .products, .checkoutcart .products, .confirmselection .products { box-shadow: none; margin:1.5em -1.5em -1.5em; padding:1.5em; border-top:2px solid var(--theme-bgcolor); font-family: 'Inter'; }
.cart .item .grid:has(+ .products), .checkoutcart .item .grid:has(+ .products), .confirmselection .item .grid:has(+ .products) { box-shadow: none; }
.cart .products h3, .checkoutcart h3 { color:var(--theme-fontcolor); }

view[name=checkout] .checkoutcart h2 { color:var(--theme-fontcolor); }
.checkoutcart .totals h3 { color:var(--theme-fontcolor); }
.cart .item, .checkoutcart .item .content, .confirmselection .item .content { padding:0; }
.cart .item .img, .checkoutcart .item .img, .confirmselection .item .img { display:none; }
/* .cart .item .grid, .checkoutcart .item .grid, .confirmselection .item .grid { grid-template-columns: minmax(150px, 150px) 1fr; padding:0; } */
.cart .item .grid, .checkoutcart .item .grid, .confirmselection .item .grid { display:block; }
view[name=checkout] .checkoutcart .item { margin:0; }
[data-enablecart="1"] view[name=booking] .checkoutbuttons { background: url('paperbottom_bg.png') repeat-x; margin:-42px -42px 0; padding:160px 42px 0; }
.termslink, .gdprlink { color:var(--theme-button-color); font-weight: 400; } 
.cart .item .content p, .checkoutcart .item .content p, .confirmselection .item .content p { font-family: 'Inter'; color:var(--theme-fontcolor); }
view[name=checkout] .voucherform { padding:0; background: none; box-shadow: none; display:none; }
view[name=checkout] .reservationchoices { margin:0 0 1em 0; }

/* Checkout */
[data-enablecart=""] view .pagecontent { max-width:1280px; }
view[name=checkout] .checkoutgrid { display: grid; grid-template-columns: 1fr; grid-template-rows: max-content;}
view[name=checkout] .checkoutgrid .checkoutgrid.persistant { margin-top:2.5em; }
[data-enablecart=""] .checkoutgrid .checkoutcontainer { order:2; }
[data-enablecart=""] .checkoutsummary { order:1; margin-bottom:-20px; }
[data-enablecart=""] .checkoutsummary>h2 { display: none; }
[l="checkout_myinfo"] { display:none; }
view[name=checkout] .checkoutform { background: none; border:0; border-radius: 0; box-shadow:none; padding:0; margin:2em 0 1em 0; }
view[name=checkout] .checkoutform input { height: 50px; min-height: 50px; }
view[name=checkout] .checkoutform input, 
view[name=checkout] .noteform textarea {background-color: var(--theme-input-color);color:var(--theme-fontcolor); border: 0;box-shadow: none;resize: none;border-radius: .75em;}

/* input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { box-shadow: 0 0 0 30px var(--theme-input-color) inset !important; } */

view>div>.content { background-color: var(--theme-bgcolor);}

view[name=checkout] .noteform textarea { min-height: 100px; }
.fastcheckout>p:first-child { display: none; }
view[name=checkout] .fastcheckout button { border-radius: .75em; height:50px; }
view[name=checkout] .fastcheckout button:not(:disabled) { background: var(--theme-button-color); color:var(--theme-button-fontcolor); border-radius: .75em; }
view[name=checkout] .customerinfo { box-shadow: none; background: var(--theme-input-color); border:0; border-radius: 1em; padding: 1.5em; }
view[name=checkout] .checkoutbuttons button { border-radius: .75em; height:50px; }
view[name=thanks] { text-align: center; }
view[name=thanks] .pagecontent h1 { text-align: center; margin-bottom:20px; }
view[name=thanks] .icon { display: none; }
view[name=thanks] button { margin-top:2em; }
view[name=cancelbooking] .pagecontent { margin-top:3em; }
.cart .item .badge, .checkoutcart .item .badge { background: none; border:1px solid var(--theme-fontcolor); color:var(--theme-fontcolor); border-radius: .25em;    }

.checkoutgrid:has(.customerlookup) ~ div#checkoutcomplete { display:none; }

#printOrderConfirmationBtn { display:none; }
.cart .item .price, .checkoutcart .item .price, .confirmselection .item .price { background: none; color: var(--theme-fontcolor); transform: none; right: 0; bottom: 0; padding:1.5em; align-content: center; font-family: 'Bitter'; font-size: 1em; font-weight: 600; }
.cart .item .price span, .checkoutcart .item .price span, .confirmselection .item .price span { font-size: .75em; text-align: end; font-weight: 400; font-family: 'Inter'; }

/* Modals */
.modal_window { background:var(--theme-bgcolor); }
.modal_window>.modal_buttons { background:var(--theme-bgcolor); }

/* Cancel */
view[name=cancelbooking] .hero { background-image: url(salute_logo_yellow.svg) !important; background-size:contain; max-height: 250px !important; padding: 2.5em 0 0 0; background-origin: content-box; }
view[name=cancelbooking] .hero:before, view[name=cancelbooking] .hero:after { display:none; }
view[name=cancelbooking] .hero .logo { display:none !important; }
view[name=cancelbooking] .icon img { width:100px; }

/* Thanks */
view[name=thanks] .hero { background-image: url(salute_logo_yellow.svg) !important; background-repeat: no-repeat !important; background-position: center center !important; background-size:contain; max-height: 250px !important; padding: 2.5em 0 0 0; background-origin: content-box !important; }
view[name=thanks] .hero:before, view[name=thanks] .hero:after { display:none; }
view[name=thanks] .hero .logo { display:none !important; }
view[name=thanks] .icon img { width:100px; }

/* Footer */
view[name=booking] .footer { display:none; }
footer { display: block; position: absolute; bottom:0; left:0; width:50%; padding:2em; z-index: 1003; }
footer p, .footer p { display: inline; color:var(--theme-fontcolor); font-size:1em; }
footer p:nth-child(3):after, footer p:nth-child(6):after, .footer p:nth-child(3):after, .footer p:nth-child(6):after { content: "\a"; white-space: pre; }
footer p:not(:first-child):not(:nth-child(4)):not(:nth-child(7)):before, .footer p:not(:first-child):not(:nth-child(4)):not(:nth-child(7)):before { content: '\2022'; color:var(--theme-button-color); margin: 0 .5em; }
footer a, .footer a { color:var(--theme-fontcolor); display: inline-block; margin:0; text-decoration: none; transition: all 1s cubic-bezier(0.075, 0.82, 0.165, 1); }
footer a:hover, .footer a:hover { color:var(--theme-button-color); }

/* Responsiveness */
@media only screen and (max-height: 840px) {
    [data-enablecart="1"] view[name=booking] .checkoutbuttons { margin:-42px -24px 0 }
}
               
@media only screen and (max-width: 1280px) {

    .resourceTypes { grid-template-columns: 1fr; padding-bottom:1em; }

}

@media only screen and (max-width: 840px) {
  
    ::-webkit-scrollbar { display: none;  /* Safari and Chrome */ }
    h1 { font-size:1.5em !important; margin-bottom:0; margin-top: 1em; }
    h2 { font-size:1.2em !important; }
    h3 { font-size:1.1em !important; }

    [data-enablecart=""] view[name=booking] .scrollable>.top, [data-enablecart=""] view[name=checkout] .scrollable>.top { display: block; position: relative; width:100%; }
    [data-enablecart=""] view[name=booking] .scrollable:not([data-name="step1"])>.top, [data-enablecart=""] view[name=checkout] .scrollable:not([data-name="step1"])>.top { background: var(--theme-bgcolor); }
    .navbuttons button:first-child { margin-left:-16px; }
    .navbuttons button:last-child { margin-right:-16px; }

    .numselector { grid-template-columns: 42px 1fr 42px; }
    .datepickerwrap { width:146px; }
    .datepickerwrap input { padding: 0 50px 0 10px; }
    /* .datepickerwrap:after { width:46px; } */
    
    [data-enablecart=""] [data-name=step1] .viewcontent { padding: 0; height:auto; }
    [data-enablecart=""] [data-name=step1] .content:has(.resourceTypes[data-num]):before { display: none; }
    [data-enablecart=""] [data-name=step2] .viewcontent { padding: 0 1.5em 6em;}    
    [data-enablecart=""] [data-name=step3] .viewcontent { padding: 0 1.5em 6em;}    
    [data-enablecart=""] view[name=checkout] .pagecontent { padding: 0 1.5em 6em; min-height: 0; }  
    [data-enablecart=""] view[name=booking] .slider { height:100%; }
  
    .hero:before, .hero:after { display:none; }
    .hero { display: block; max-height: 96px; padding:1.5em 0; background-size: contain; background-origin: content-box; }
    
    .bookButton { display: none; }
    [data-name=step1] .hero { background: url('salute_logo_yellow.svg') no-repeat center center, linear-gradient(to bottom, var(--theme-bgcolor), #0000); background-repeat: no-repeat; background-size: contain; background-origin: content-box, padding-box; padding:1.5em 0;}
    [data-name=step1] .resourceTypes { position: relative; z-index: 0; top:-102px; grid-gap:0; }
    [data-name=step1] .resourceTypes .resourceType:first-child { min-height: 75vh; display:block; }
    [data-name=step1] .resourceTypes .resourceType { min-height:75vh; }
    [data-name=step1] .resourceTypes .resourceType .card {  border-left:0; border-right:0; }
    [data-name=step1] .resourceTypes .resourceType .content { padding: 2em 1.5em; }
    [data-name=step1].scrollable[data-scrolltop="0"]:has(.resourceTypes[data-num="2"]):after { display:block; }
    [data-name=step1].scrollable[data-scrolltop="0"]:has(.resourceTypes[data-num="3"]):after { display:block; }

    [data-name="step2"] .top .logo { display: block; }
    /* [data-name="step2"] .top .hero { -webkit-mask-image: linear-gradient(to bottom, #000 60%, transparent 100%); mask-image: linear-gradient(to bottom, #000 60%, transparent 100%); } */

    [data-enablecart=""] .app>view[name=booking], [data-enablecart=""] .app>view[name=checkout] { display:block; overflow:hidden; }
    [data-enablecart=""] .app>view[name=booking]:before, [data-enablecart=""] .app>view[name=checkout]:before { background-color: var(--theme-bgcolor); position: absolute; z-index: 1000; background-size: 40%, 50px; animation:salute_slideup 1s cubic-bezier(0.075, 0.82, 0.165, 1) forwards; animation-delay: 1.5s; pointer-events: none; }
    
    .timeslots { grid-template-columns: 1fr 1fr 1fr 1fr; }

    .relatedProduct .card .img { width: calc(100% + 2em); border-radius: .5em .5em 0 0; height:100%; }
    .relatedProduct .card .actions { padding-top:0; }
    .relatedProduct .card .content { padding: 1em .5em .5em; }
    
    footer { position: absolute; width:100%; animation:salute_fadeoutanddisplaynone 1s cubic-bezier(0.075, 0.82, 0.165, 1) forwards; animation-delay: 1.5s; }
    footer p:nth-child(1), .footer p:nth-child(1) { font-weight: 700; font-family:'Bitter';  margin:1em 0 2em 0;}
    footer p:nth-child(1):after, footer p:nth-child(5):after, .footer p:nth-child(1):after, .footer p:nth-child(5):after {content: '\a'; white-space: pre;}
    footer p:nth-child(6):after, .footer p:nth-child(6):after {content: '';}
    footer p:nth-child(2):before, footer p:nth-child(6):before, .footer p:nth-child(2):before, .footer p:nth-child(6):before {display: none;}
    footer p:nth-child(7):before, .footer p:nth-child(7):before { content: '\2022'; color:var(--theme-button-color); margin: 0 .5em; } 
        
    view[name=booking] .footer  { display: block; padding:2em 0; margin-top:-102px; }

    [data-enablecart=""] view[name=checkout] .scrollable .navbuttons { left:0; padding: 0 2em 1em; }
    [data-enablecart=""] view[name=booking] .viewcontent .navbuttons, [data-enablecart=""] .scrollable .navbuttons { left:0; padding: 0 2em 1em; }

    view[name=booking] .scrollable.hasNavbuttons:before, [data-enablecart=""] .app>view[name=checkout] .scrollable.hasNavbuttons:before { left:0; width:100%; }

    [data-enablecart=""] .app>view[name=checkout] .scrollable.hasNavbuttons:before { left:0; width:100%;  }

    view[name=booking] .scrollable.hasNavbuttons:before, 
    view[name=checkout] .scrollable.hasNavbuttons:before { animation-duration:0; transition:all 3s linear; opacity:1; }
    view[name=booking] .scrollable.hasNavbuttons.out:before, 
    view[name=checkout] .scrollable.hasNavbuttons.out:before { animation-duration:300ms; opacity: 0; }

}

/* Animations */
@keyframes salute_fadein { from { opacity: 0; } to { opacity: 1; } }
@keyframes salute_fadeout { from { opacity: 1; } to { opacity: 0; } }
@keyframes salute_fadeoutanddisplaynone { 0% { opacity: 1; } 50% { opacity: 0; height:initial; padding:initial; overflow:visible; } 100% { opacity: 0; height:1px; padding:0; overflow:hidden; } }
@keyframes salute_slideup { 0% { transform: translateY(0); } 100% { transform: translateY(-100%); } }
@keyframes salute_float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes salute_animateaway { 0% { top:0; left:0; } 100% { top:0; left:0; } }
@keyframes salute_fadetopoint { 0% { opacity: 0; } 100% { opacity: .2; } }

/* Toast */
.toast_window { background:var(--theme-fontcolor); color:#fff; }
