@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&family=Overpass:ital,wght@0,100..900;1,100..900&display=swap');
:root {    
    --theme-bgcolor: #000;
    --theme-bgcolor-faded: #0006;
    --theme-fontcolor: #fff; 
    --theme-primary: #c0261c;
    --theme-secondary: #375436;
    --theme-tertiary: #ccc;    
    --theme-inputbg: #fff; 
    --theme-inputfontcolor: #000; 
    --theme-buttonbg: #c0261c; 
    --theme-button-fontcolor: #fff; 
    --theme-buttondisabledbg: #ccc6;
    --theme-inputbuttonbg: #fff; 
    --theme-navbuttonbg: #fff;
    --theme-itembg: #375436;
    --theme-borderradius: .5em;
}

html { overflow: hidden; }
body { background:var(--theme-bgcolor); font-size:16px; overflow: hidden; }
body, h1, h2, h3 { color:var(--theme-fontcolor); font-weight: 600; }
p, label { font-weight: 400; }
body, p { font-family: 'Overpass', tahoma, helvetica; }
h1 { font-family: 'Oswald'; font-size:2em; line-height: 1.2em; margin-bottom: 0; }
h2 { font-family: 'Oswald'; font-size:1.8em; }
h3 { font-family: 'Oswald'; font-size:1.3em; }

::-webkit-scrollbar-thumb { background:var(--theme-primary); z-index: 100;}
::-webkit-scrollbar-track { background:#0000; z-index: 99; }

a { color:#000; }
hr { border:0; border-top:1px solid var(--theme-secondary); opacity: .5; }
label { text-transform: none; font-size: .8em; }
.fa-arrow-left:before { content:'\f177'; }
.fa-arrow-right:before { content:'\f178'; }
.slider { background:var(--theme-inputbg); }
.agreement h1:after { display:none; }
.viewcontent .navbuttons, .pagecontent .navbuttons { opacity: 0; animation: fadeIn 1s ease-in-out forwards; animation-delay: .3s; }
.slider, main, .main { overflow: hidden !important; }
 
/* [data-lazybg][data-lazybgstate="loaded"] { opacity: .1 !important; } */
.hero[data-lazybg] { display:none; opacity: 0; transition:all .3s ease-in-out; }
.hero[data-lazybg][data-lazybgstate="loading"] { display: block; opacity: 0; animation: fadeToPoint 1s linear forwards; animation-delay:500ms; }
.hero[data-lazybg][data-lazybgstate="loaded"] { display: block; opacity: .33; }
@keyframes fadeToPoint { 0% { opacity: 0; } 100% { opacity: .33; } }

/* Hero */
.hero .logo, .top .logo { display:none; }
.hero:before, .hero:after { display: none; }
.top { position: absolute; top:0; left:0; width:100%; height:auto !important; min-height: 0; z-index: 0; pointer-events: none; }
div[data-name]>.top:after, view[name=checkout] .scrollable:after, view[name=paymenterror] .scrollable:after, view[name=cancelbooking] .scrollable:after, view[name=thanks] .scrollable:after { display:block !important; transform:none !important; z-index: 100; content:'STEDET HVOR BALLERNE MØDES - DIT LOKALE VÆRTSHUS OG BAR I ODENSE'; position: absolute; top:0; left:0; width:100%; height:auto !important; min-height: 0; z-index: 0; pointer-events: none; background:var(--theme-secondary); text-align: center; color:var(--theme-fontcolor); font-family: 'Oswald'; font-size: .9em; padding:.5em 0; border-bottom:5px solid var(--theme-primary); box-shadow: 0 10px 50px -5px var(--theme-primary); }
.top>.hero, view[name=paymenterror] .hero, view[name=cancelbooking] .hero, view[name=thanks] .hero { position: absolute; background-repeat: no-repeat; background-position: center center; background-size: cover; padding: 0; margin: 0; width: 100vw; height: 100vh !important; max-height: 100vh; top: 0; left: 0; opacity: .33; z-index: -1; }

/* Datepicker */
.datepickerwrap { transition: all .2s ease-in-out; box-shadow: 0px 10px 7.5px 0px #3636361a; border-radius: var(--theme-borderradius); width:148px; }
.datepickerwrap input { border-radius: var(--theme-borderradius); box-shadow: none; border:none; padding: 0 60px 0 20px; background:var(--theme-inputbg); color:var(--theme-inputfontcolor); user-select: none; }
.datepickerwrap:hover { box-shadow: 0px 5px 7.5px 0px #3636361a; }
.datepickerwrap:active { transition: all .0s ease-in-out; transform: scale(95%) !important; box-shadow: none;}
.datepickerwrap:after { border-radius:.5em; box-shadow:none; color:var(--theme-buttonbg); background: none; height:56px; }

.ui-datepicker { background:var(--theme-secondary); box-shadow: none; border-radius: var(--theme-borderradius); color:var(--theme-fontcolor); }
.ui-datepicker .ui-datepicker-title { background: var(--theme-buttonbg); border-radius: var(--theme-borderradius) var(--theme-borderradius) 0 0; }
.ui-datepicker .ui-datepicker-header { border-radius: var(--theme-borderradius) var(--theme-borderradius) 0 0; }
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { background-color: var(--theme-inputbg); color:var(--theme-inputfontcolor); }
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { background-color:#fff; border-color: #fff; color:var(--theme-primary); }
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight { border-color:#fff5; }

/* Bookingperiod selector */
.bookingperiodselector .selectwrapper { max-width: 150px; box-shadow: none; }
.bookingperiodselector .selectwrapper:after { content: '\f078'; background: none; width: 42px; height: 100%; position: absolute; border-radius: 0; top: 0; right: 0; pointer-events: none; font-family: 'FontAwesome'; color: var(--theme-buttonbg); font-size: .7em; text-align: center; line-height: 56px; }
.bookingperiodselector .selectwrapper:has(select:focus):after { content: '\f077'; }
.bookingperiodselector .selectwrapper select { appearance: none; background: var(--theme-inputbg); color:var(--theme-inputfontcolor); border-radius: var(--theme-borderradius); box-shadow: 0px 10px 7.5px 0px #3636361a; padding-right: 64px; border:0; font-size: 1em; max-width: 150px; }
.bookingperiodselector .selectwrapper select option { background-color: var(--theme-inputbg); color:var(--theme-inputfontcolor); }

.bookingperiod { position: relative;}
.bookingperiod:last-child:after { display: none;}

/* Manual resource selector */
.manualResourceSelection .selectwrapper { max-width: 340px; box-shadow: none; }
.manualResourceSelection .selectwrapper:after { content: '\f078'; background: none; width: 42px; height: 100%; position: absolute; border-radius: 0; top: 0; right: 0; pointer-events: none; font-family: 'FontAwesome'; color: var(--theme-buttonbg); font-size: .7em; text-align: center; line-height: 56px; }
.manualResourceSelection .selectwrapper:has(select:focus):after { content: '\f077'; }
.manualResourceSelection .selectwrapper select { max-width: 340px; appearance: none; background: var(--theme-inputbg); color:var(--theme-inputfontcolor); border-radius: var(--theme-borderradius); box-shadow: 0px 10px 7.5px 0px #3636361a; padding-right: 64px; border:0; font-size: 1em; }
.manualResourceSelection .selectwrapper select option { background-color: var(--theme-inputbg); color:var(--theme-inputfontcolor); }
.manualResourceSelection label { text-transform: capitalize; }

/* Numselector */
.numselector { background: var(--theme-inputbg); color:var(--theme-inputfontcolor); border-radius: var(--theme-borderradius); box-shadow: 0px 10px 7.5px 0px #3636361a; width:96px; transition: all .3s ease-in-out; }
.numselector:hover { box-shadow: 0px 5px 7.5px 0px #3636361a; }
.numselector input { box-shadow:none; border:0; color:var(--theme-inputfontcolor); }
.numselector button { background: none; color:var(--theme-buttonbg); box-shadow: none; }
.numselector button:first-child { border:0; border-radius: 0 0 0 0; height:56px; }
.numselector button:last-child { border:0; border-radius: 0 0 0 0; height:56px; }

/* Timeslots */
.timeslots { display:grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr; grid-gap:16px; margin:2em 0; }
.timeslots_container.loading .timeslots { opacity: .5; filter: grayscale(1); }
.timeslot { background:var(--theme-inputbg); margin:0; border:0; box-shadow: 0px 10px 7.5px 0px #3636361a; border-radius: var(--theme-borderradius); align-content: center; font-size:.8em; padding:1.25em 1em; color:var(--theme-buttonbg) }
.timeslot:not(.selected):hover { transform: scale(1.05) !important; box-shadow: none; }
.timeslot .pricebadge { background:var(--theme-primary); color:var(--theme-button-fontcolor); word-spacing: normal; box-shadow: none; top:-12px; right:-6px; }
.timeslot .quantitybadge { background:var(--theme-primary); color:var(--theme-button-fontcolor); }
.timeslot.disabled { background:var(--theme-inputbg); color:var(--theme-inputfontcolor); position: relative; opacity: .25 !important; color:var(--theme-primary); animation:none !important;}
.timeslot.disabled:hover { transform:none !important; }
.timeslot.selected, .timeslot.selected:hover { background:var(--theme-buttonbg); color:var(--theme-button-fontcolor); }
.timeslot.selected .pricebadge, .timeslot.selected:hover .pricebadge { background:var(--theme-inputbg); color:var(--theme-primary); }

/* Resources */
.resources { display:grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); grid-gap:16px; width:100%; margin-top:2em; }
.resource { background:var(--theme-inputbg); margin:0; border:0; box-shadow: 0px 10px 7.5px 0px #3636361a; border-radius: var(--theme-borderradius); align-content: center; font-size:.8em; padding:1.25em 1em; color:var(--theme-buttonbg) }
.resource:not(.selected):hover { transform: scale(1.05) !important; box-shadow: none; }
.resource.disabled { background:var(--theme-inputbg); color:var(--theme-inputfontcolor); position: relative; opacity: .25 !important; color:var(--theme-primary); animation:none !important;}
.resource.disabled:hover { transform:none !important; }
.resource.selected, .resource.selected:hover { background:var(--theme-buttonbg); color:var(--theme-button-fontcolor); }

/* Products */
.relatedProduct .card { background: var(--theme-itembg); color: var(--theme-fontcolor); }
.relatedProduct .card .actions:after { display: none; }
.relatedProduct .card .pricebadge { background:#2d3e41; }

/* Booking */
view .viewcontent { display:grid; grid-template-rows: auto 1fr auto; }
view .viewcontent, view .pagecontent { padding-bottom:100px; position: relative; }
view .viewcontent .navbuttons button, view .pagecontent .navbuttons button { top:-50px; position: relative; }
view .viewcontent:before, view .pagecontent:before { display: block; width:100%; height:72px; max-height:10vh; margin:3em 0 2em; background:url(cityclub_logo_white.svg) no-repeat center center; background-size: contain; content:''; }
view .viewcontent .navbuttons, view .pagecontent .navbuttons { padding:0 42px 42px; bottom:-50px; }

[data-name=step1] .top>.hero { background-image: none; background-color: #000a; opacity: 1; position: fixed; }
[data-name=step1] video { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; object-fit: cover; z-index: 0; }
[data-name=step1] h1 { text-align: center;}
[data-name=step1] [l="step1_text"] { text-align: center; }
[data-name=step1] .viewcontent, [data-enablecart=""] [data-name=step1] .viewcontent { padding-bottom:42px; min-height: 100vh; display: grid; grid-template-rows: auto 1fr auto; max-width: 100%; }
[data-name=step1] .viewcontent:before { animation:fadeIn 1s ease-in-out forwards; }
[data-name=step1] .viewcontent>div { display: flex; flex-direction: column; justify-content: center; }

view[name=booking] [data-name=step2] .description h3 { color:var(--theme-fontcolor); font-weight: 400; font-size:.8em; }
view[name=booking] [data-name=step2] .description { margin-bottom:2em; font-size: .9em; }
view[name=booking] [data-name=step2] .inputs { margin-bottom:0; }
view[name=booking] .scrollable { position: relative; background: var(--theme-bgcolor); overflow-y: auto; overflow-x: hidden; }
view[name=booking] .scrollable>.content { z-index: 1; min-height: 100%; }
view[name=booking] .scrollable.hasNavbuttons { padding-bottom: 0; }
view[name=booking] .scrollable.hasNavbuttons:before,
view[name=checkout] .scrollable.hasNavbuttons:before { background: linear-gradient(to top, var(--theme-secondary), transparent); }
view[name=booking] .viewcontent>h2 { margin:1em 0 0; }
view[name=checkout] .scrollable { background: var(--theme-bgcolor); overflow-y: auto; overflow-x: hidden; padding-bottom: 0 !important; }
view[name=checkout] .scrollable>.content { z-index: 1; background: var(--theme-bgcolor); min-height:100%; }

.step1_info { text-align: center; display:none; }

/* Checkout */
view[name=checkout] .top>.hero { background-image: url('cityclub_bg.jpg'); }
view[name=paymenterror] .hero { background-image: url('cityclub_bg.jpg'); }
view[name=cancelbooking] .hero { background-image: url('cityclub_bg.jpg'); }
/* view[name=checkout] .scrollable  { background: var(--theme-bgcolor-faded); } */
/* view[name=paymenterror] .scrollable  { background: var(--theme-bgcolor-faded); } */
/* view[name=cancelbooking] .scrollable { background: var(--theme-bgcolor-faded); } */

/* Cart */
.cart { background: #eddecb; box-shadow: inset 50px 0 50px -50px #441f005c; }
.cartButton { background: var(--theme-fontcolor); box-shadow: 0 0 0 5px #88002622; }
.cartButton .count { background: #4e3f3c; color:#fff; border-radius: var(--theme-borderradius);}
.cartButton.cartvisible { color:var(--theme-fontcolor); }
.cart .items, .checkoutcart .items { overflow-x: visible; overflow-y: visible;}
.cart .item, .checkoutcart .item, .confirmselection .item { background: none; box-shadow: none !important; border-radius: 0; padding:0; border:0 !important; margin:0 !important; }

.cart .totals, .checkoutcart .totals { border:0; padding: 1em 0; margin-bottom:0; border-radius: 0; }
.cart .totals, .checkoutcart .totals h2, .cart .totals, .checkoutcart .totals h3, .cart .totals>div, .checkoutcart .totals>div { font-family: 'Oswald', tahoma, helvetica; }
.cart .item, .checkoutcart .item .content, .confirmselection .item .content { background: var(--theme-itembg); padding:1.5em; border-radius: var(--theme-borderradius); position: relative; box-shadow: 0px 10px 7.5px 0px #3636361a; }
.cart .item, .checkoutcart .item .grid, .confirmselection .item .grid { display:block; }
.cart .item, .checkoutcart .item .img, .confirmselection .item .img { display:none; }
.cart .item .grid, .checkoutcart .item .grid, .confirmselection .item .grid { grid-template-columns: minmax(100px, 140px) 1fr; padding:1em; }
.cart .item .grid:has(+ .products), .checkoutcart .item .grid:has(+ .products), .confirmselection .item .grid:has(+ .products) { box-shadow: none; }
.cart .totals>div, .checkoutcart .totals>div { font-family: 'Lato', tahoma, helvetica; }
.cart .products, .checkoutcart .products, .confirmselection .products { margin:0; padding:1.5em; box-shadow: inset 0 2em 1em -1em #0008; background: var(--theme-itembg); color: var(--theme-fontcolor); }

[data-enablecart="1"] view[name=booking] .checkoutbuttons { margin:-42px -42px 0; padding:160px 42px 0; }
.checkoutcart .totals h3 { color:var(--theme-primary); }

.termslink, .gdprlink { color:var(--theme-fontcolor); font-weight: 400; margin-right:.5em; font-size: .8em; }
.termslink i, .gdprlink i { content:'\f061'; font-size:.6em; transform:translateY(-2px); margin-right:5px; }
.termslink i:before, .gdprlink i:before { content:'\f061'; }
.termscontainer div:last-child { font-size: .8em; }

.cart .item .content p, .checkoutcart .item .content p, .confirmselection .item .content p { margin:.25em 0 0 0; color:var(--theme-fontcolor); font-size: .9em; }

view[name=checkout] .voucherform { padding:0; background: none; box-shadow: none; display:none; }
view[name=checkout] .checkoutcart h2 { font-size:1.5em; color:var(--theme-fontcolor); margin-bottom:1em; text-transform: uppercase; }

/* Buttons */
.cart .item .delete, .checkoutcart .item .delete, .confirmselection .item .delete, .fastcheckout .customerinfo .delete { background:none; color:var(--theme-button-fontcolor); margin:0; padding: 0; width: 32px; }
button:not(.card button):disabled, a.button:disabled, button:not(.card button).disabled, a.button.disabled { background: var(--theme-buttondisabledbg); border:0; }
button, a.button { font-family: 'Oswald'; border-radius: var(--theme-borderradius); background:var(--theme-secondary); color:var(--theme-button-fontcolor); box-shadow: 0px 10px 7.5px 0px #3636361a; font-weight: 700; }
button.green { background-color: var(--theme-buttonbg); color:var(--theme-button-fontcolor); box-shadow:0px 10px 7.5px 0px #3636361a; }

/* Inputs */
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { -webkit-box-shadow: 0 0 0 30px var(--theme-inputbg) inset !important; -webkit-text-fill-color: var(--theme-inputfontcolor) !important; }
input::placeholder { color:var(--theme-secondary); }
.inputwrapper.validated:after { content:'\f00c'; font-family: 'FontAwesome'; top:50%; right:1.5em; background: none; width:auto; border:0; left:auto; transform: translateY(-50%); height:auto; font-size: .7em; color:var(--theme-primary); }
.inputwrapper.error:after { display: none; }

input[type=checkbox] + label { background:var(--theme-inputbg); box-shadow: none; border:0; border-radius: var(--theme-borderradius); }
input[type=checkbox]:checked + label { background:var(--theme-inputbg); color:var(--theme-primary); box-shadow: none; border:0; }
input[type=checkbox]:checked + label:after { color:var(--theme-primary); }

/* Resourcetypes */
.resourceTypes { grid-gap:32px; width:100%; display:grid; margin-top:2em; grid-template-columns: repeat(auto-fit, minmax(200px, 296px)); place-content: center; }
.resourceType { position: relative; width:100%; height:auto; padding:1em 0; transition: transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1); }
.resourceType:hover { transform: scale(1.05) !important; }
.resourceType .card { background:#fff; border:none; border-radius: var(--theme-borderradius); padding:0; box-shadow: 0px 10px 7.5px 0px #3636361a; overflow:hidden; display: grid; grid-template-rows: auto 1fr auto; }

.resourceType:last-child .card { border:none; }
.resourceType .card span { display: inline; }

.resourceType .card .top { aspect-ratio: 4/2; border-radius: var(--theme-borderradius) var(--theme-borderradius) 0 0; }
.resourceType .card .top:after { display: none; }
.resourceType .card .content { display: flex; flex-direction: column; justify-content: space-between;width: 100%; height:auto; padding:1.5em; box-shadow: inset 0 1em 1em #0002; }
.resourceType .card .content h3 { color:var(--theme-primary); margin-bottom: .5em; }
.resourceType .card .content .date .month:before { content:'/'; }
.resourceType .card .content .date .year { display: none; } 
.resourceType .card .content .date .hours:before { content: "\a"; white-space: pre; }
.resourceType .card .content .date .hours:after { content: ":"; }
.resourceType .card .content .date .hours,
.resourceType .card .content .date .minutes { display: inline; font-size: .7em; color:var(--theme-secondary); }
.resourceType .card .content .price { display: none; color:var(--theme-primary); min-width:150px; font-size:1.2em; font-weight: 700; }
.resourceType .card .content .price .suffix { display: none; }
.resourceType .card .content h3 { margin:0 0 .5em 0; text-transform: uppercase; color:var(--theme-inputfontcolor); }
.resourceType .card .content p { color:var(--theme-inputfontcolor); font-size:.9em;  }
.resourceType .card .actions { background: none; box-shadow: none; margin:0; padding:1em 0 0 0; }
.resourceType .card button { border-radius: var(--theme-borderradius); background:var(--theme-buttonbg); color:var(--theme-button-fontcolor); box-shadow: none; padding: 1em; height:auto; }

/* Checkout */
view[name=checkout] .checkoutgrid { display: grid; grid-template-columns: 1fr; }
view[name=checkout] .checkoutgrid .checkoutgrid.customerlookup { display: grid; grid-template-columns: 1fr auto; grid-gap: 16px; max-width: 480px; margin: 0 auto; }
view[name=checkout] .checkoutgrid .checkoutgrid:not(.persistant) { grid-template-columns: 1fr 1.5fr; }
view[name=checkout] h2 { margin-bottom:.5em; }
[data-enablecart=""] .checkoutgrid .checkoutcontainer { order:2; }
[data-enablecart=""] .checkoutsummary { order:1; }
[data-enablecart=""] .checkoutsummary>h2 { display: none; }

view[name=checkout] .checkoutform { background: none; border:0; border-radius: 0; box-shadow:none; padding:0; }
view[name=checkout] .checkoutform input, 
view[name=checkout] .noteform textarea { background-color: var(--theme-inputbg); color:var(--theme-inputfontcolor); border:0; box-shadow: 0px 10px 7.5px 0px #3636361a; resize:none; border-radius: var(--theme-borderradius); font-family: 'Oswald'; font-size: 13px; }

view[name=checkout] .checkoutform input:hover, view[name=checkout] .checkoutform input:focus, 
view[name=checkout] .noteform textarea:hover, view[name=checkout] .noteform textarea:focus { box-shadow: 0px 5px 7.5px 0px #3636361a; }

.fastcheckout>p:first-child { display: none; }
view[name=checkout] .fastcheckout button { background-color:var(--theme-buttonbg) !important; color:var(--theme-button-fontcolor); }
view[name=checkout] .customerinfo { background: var(--theme-itembg); background-size: 100% 400%; background-position: 0 -20px; border:none !important; color:var(--theme-button-fontcolor); border-radius: var(--theme-borderradius); padding: 1.5em; }
view[name=checkout] .checkoutbuttons button { height: 56px; margin:1em 0 0 0; }
view[name=checkout] .checkoutbuttons button i:before { content:'\f178'; }
.cart .item .badge, .checkoutcart .item .badge { background: none; border:1px solid var(--theme-fontcolor); color:var(--theme-fontcolor); border-radius: 0;    }

.checkoutgrid:has(.customerlookup) ~ div#checkoutcomplete { display:none; }
.cart .item .price, .checkoutcart .item .price, .confirmselection .item .price { background: none; border-radius: 0; color: var(--theme-fontcolor); font-family: 'Oswald'; transform: none; right: 0px; font-size: 1.1em; height:calc(100% + 2px); align-content: center; top:0; right:0; bottom:auto; align-content: end; padding:2em; }
.checkoutcart .totals>div { font-family: 'Oswald'; }
.cart .item .price span, .checkoutcart .item .price span, .confirmselection .item .price span { text-align: right; font-size: .7em;}

/* Thanks */
view[name=thanks] [l=thanks_helptext] { display: none; }
view[name=thanks] .icon { display:block; float:none; }
view[name=thanks] .icon > img { height:100px; margin: 0 auto; filter:invert(1); }
view[name=thanks] .pagecontent { padding-bottom:0; text-align: center; }
view[name=thanks] .pagecontent h1 { margin-bottom:10px; }
view[name=thanks] button { margin:0 auto 2em auto; display: block; }

/* Footer */
view[name=booking] .footer { margin: 0 -42px -42px; padding: 4em 1em 1em; background: linear-gradient(to top, var(--theme-secondary) 25%, #0000); }
view[name=booking] .footer>div { margin:0 auto; max-width: 1200px; width: 100%;}
view[name=booking] .footer>div:after {content:'';width:20%; left:40%; top:5px; height:100%; position: relative; height:22px; background:url('data:image/svg+xml,<%3Fxml version="1.0" encoding="UTF-8" standalone="no"%3F><svg viewBox="0 0 1095.5607 1148.4489" height="1148.4489" width="1095.5607" xml:space="preserve" id="svg1" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg"><g id="g17" style="fill:%23ffffff66" transform="translate(-598.70319,-405.55121)"><g id="g16" style="fill:%23ffffff66;fill-opacity:1"><g id="g15" style="fill:%23ffffff66;fill-opacity:1"><path class="st1" d="m 1620.89,1477.72 c -37.03,36.93 -80.09,59.09 -130.5,71.22 -19.02,4.56 -37.31,4.58 -55.94,4.58 -86.88,0 -419.7,0.28 -644.2,0.48 -113.9,0.1 -202.59,-98.66 -190.43,-211.91 l 12.02,-112.03 c 7.88,-73.46 63.7,-132.56 136.61,-144.44 175.12,-28.54 479.38,-77.94 520.44,-83.46 66.66,-8.96 133.42,-18.03 200.85,-10.75 38.73,4.19 76.47,13.25 109.37,35.5 30.13,20.39 53.75,46.99 71.44,78.95 20.65,37.31 33.69,77.23 40.32,118.99 11.37,71.5 -4.33,187.4 -69.98,252.87 z" id="path14" style="fill:%23ffffff;fill-opacity:1" /><path class="st1" d="m 1582.09,795.17 c -32.11,56.84 -99.58,91.49 -161.74,101.95 -77.46,13.01 -154.99,25.6 -232.5,38.32 -36.18,5.93 -229.74,37.31 -378.06,61.34 -88.89,14.4 -167.15,-59.54 -157.87,-149.11 l 28.73,-277.28 c 10.26,-99 97.38,-171.86 196.62,-164.3 155.76,11.87 327.4,26.53 461.91,47.22 39.29,6.05 80.8,15.63 118.23,28.55 73.46,25.36 143.2,85.95 152.96,167.45 6.15,51.41 -2.67,100.53 -28.28,145.86 z" id="path15" style="fill:%23ffffff;fill-opacity:1" /></g></g></g></svg>') no-repeat center center; background-size: contain;display: block;transition: all .3s cubic-bezier(0.075, 0.82, 0.165, 1);}
view[name=booking] .footer p, view[name=booking] .footer a { color: var(--theme-fontcolor); font-family:'Oswald'; }
view[name=booking] .footer p { float:right; display: inline; height: 32px; display: inline-flex; align-items: center; }
view[name=booking] .footer p:before { content:'\2022'; margin:0 .5em; }
view[name=booking] .footer p:nth-child(1) { font-weight: 600; }
view[name=booking] .footer p:nth-child(1):before, view[name=booking] .footer p:last-child:before { display:none; }
view[name=booking] .footer p:nth-child(1), view[name=booking] .footer p:nth-child(2), view[name=booking] .footer p:nth-child(3), view[name=booking] .footer p:nth-child(6) { float:left; height: 32px; display: inline-flex; align-items: center; }
view[name=booking] .footer a { display: inline;margin:0; }

/* Modals */
.modal_window { background:var(--theme-inputbg); color:var(--theme-inputfontcolor); padding: 2em 2em 1.5em;}
.modal_window>.modal_buttons, .modal_content .buttons { background: var(--theme-buttondisabledbg); margin:1.5em -2em -1.5em; }
.modal_buttons button { background-color: var(--theme-buttonbg); color: var(--theme-button-fontcolor); }
.modal_buttons button i { display: none; }
.modal_window h1 { font-size:2em; color: var(--theme-inputfontcolor); }
.modal_window h2 { font-size:1.8em; color: var(--theme-inputfontcolor); }
.modal_window h3 { font-size:1.5em; color: var(--theme-inputfontcolor); }

@media only screen and (max-width: 1024px) {  



    view[name=booking] .footer p { float:none !important; height:24px !important; display: inline-flex; align-items: center;  margin-bottom: .5em; }
    view[name=booking] .footer p:nth-child(n+4):before { display: none !important; }
    view[name=booking] .footer p:nth-child(n+5) { margin-right:1em; display: inline-block; }
    view[name=booking] .footer p:last-child { margin-right:0; }
    view[name=booking] .footer p:nth-child(4) { display: block; }    
}

@media only screen and (max-width: 640px) {    

    h1 { font-size: 1.8em;}
    h2 { font-size: 1.4em;}
    h3 { font-size: 1.2em;}

    div[data-name]>.top:after, view[name=checkout] .scrollable:after, view[name=paymenterror] .scrollable:after, view[name=cancelbooking] .scrollable:after, view[name=thanks] .scrollable:after { font-size: .7em; border-width: 3px; padding: 1em 0; }

    [data-name=step1] .viewcontent { padding-bottom:0px; height:100%; }
    [data-name=step1] h1 { font-size: 1.5em; margin-bottom: 0; }    
    view[name=checkout] .viewcontent, view[name=checkout] .pagecontent { height:calc(100% + 120px); }
    view .viewcontent { height:100%; }    
    view .viewcontent:before, view .pagecontent:before { margin-bottom: 1.5em; height:48px; }
    
    view .viewcontent .navbuttons, view .pagecontent .navbuttons { padding: 0 24px 24px; }
    view[name=checkout] .checkoutform [data-enablecart="1"] view[name=booking] .checkoutbuttons { margin: -112px -24px 0; padding: 160px 24px 0; }
    /* view .viewcontent .navbuttons:after, view .pagecontent .navbuttons:after { top: -142px; } */

    .resourceType { padding: 0 0 1em 0; }
    .resourceType .card .content h3 { font-size:1em; word-break: break-word; }
    .resourceType .card .content h3 ~ span { display: none; }
    .resourceType .card .content .date { font-size: 1em; }
    .resourceType .card .content .price { min-width: 0; font-size:1em; }

    .bookingperiodselector .selectwrapper { max-width: 100%; }
    .bookingperiodselector .selectwrapper select { width: 100%; max-width: 100%; }

    .timeslots { display:grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-gap:12px; margin:2em 0; word-spacing: 24px; }
        
    view[name=checkout] .fastcheckout .checkoutgrid>div:last-child { padding-top:0 !important;  }
    view[name=checkout] .fastcheckout .checkoutgrid>div:last-child label { margin:10px 0 !important; display:block; }
    view[name=checkout] .checkoutform { margin-top:1em; }
    view[name=checkout] .checkoutcart h2 { font-size: 1em; margin:0 0 1em 0; }
    .cart .item, .checkoutcart .item .content, .confirmselection .item .content { padding: 1em; }
    .cart .item .price, .checkoutcart .item .price, .confirmselection .item .price { padding:1em; }

    view[name=thanks] .pagecontent { font-size: .8em; }
    
    .footer { margin:0; padding:2em; display: flex; justify-content: center; align-items: end; }
    .footer p { font-size:.8em; }
    .footer p:nth-child(1) { font-weight: 500;}
    .footer p:nth-child(1):after, .footer p:nth-child(5):after {content: '\a'; white-space: pre;}
    .footer p:nth-child(6):after {content: '';}
    .footer p:nth-child(2):before, .footer p:nth-child(6):before {display: none;}
    .footer p:nth-child(7):before { content: '\2022'; color:var(--theme-primary); margin: 0 .5em; } 
}

/* Toast */
.toast_window { background:var(--theme-fontcolor); color:#fff; }