.flag-background { background-size: contain; background-position: 50%; background-repeat: no-repeat; } .flag { display: inline-block; border: 0px; background-color: transparent; background-size: contain; background-position: 50%; background-repeat: no-repeat; position: relative; display: inline-block; width: 1.33333333em; line-height: 1em; border: none; outline: none; } .flag:before { content: "\00a0"; } .flag-ad { background-image: url(../static/flags/ad.svg); } .flag-ae { background-image: url(../static/flags/ae.svg); } .flag-af { background-image: url(../static/flags/af.svg); } .flag-ag { background-image: url(../static/flags/ag.svg); } .flag-ai { background-image: url(../static/flags/ai.svg); } .flag-al { background-image: url(../static/flags/al.svg); } .flag-am { background-image: url(../static/flags/am.svg); } .flag-ao { background-image: url(../static/flags/ao.svg); } .flag-aq { background-image: url(../static/flags/aq.svg); } .flag-ar { background-image: url(../static/flags/ar.svg); } .flag-as { background-image: url(../static/flags/as.svg); } .flag-at { background-image: url(../static/flags/at.svg); } .flag-au { background-image: url(../static/flags/au.svg); } .flag-aw { background-image: url(../static/flags/aw.svg); } .flag-ax { background-image: url(../static/flags/ax.svg); } .flag-az { background-image: url(../static/flags/az.svg); } .flag-ba { background-image: url(../static/flags/ba.svg); } .flag-bb { background-image: url(../static/flags/bb.svg); } .flag-bd { background-image: url(../static/flags/bd.svg); } .flag-be { background-image: url(../static/flags/be.svg); } .flag-bf { background-image: url(../static/flags/bf.svg); } .flag-bg { background-image: url(../static/flags/bg.svg); } .flag-bh { background-image: url(../static/flags/bh.svg); } .flag-bi { background-image: url(../static/flags/bi.svg); } .flag-bj { background-image: url(../static/flags/bj.svg); } .flag-bl { background-image: url(../static/flags/bl.svg); } .flag-bm { background-image: url(../static/flags/bm.svg); } .flag-bn { background-image: url(../static/flags/bn.svg); } .flag-bo { background-image: url(../static/flags/bo.svg); } .flag-bq { background-image: url(../static/flags/bq.svg); } .flag-br { background-image: url(../static/flags/br.svg); } .flag-bs { background-image: url(../static/flags/bs.svg); } .flag-bt { background-image: url(../static/flags/bt.svg); } .flag-bv { background-image: url(../static/flags/bv.svg); } .flag-bw { background-image: url(../static/flags/bw.svg); } .flag-by { background-image: url(../static/flags/by.svg); } .flag-bz { background-image: url(../static/flags/bz.svg); } .flag-ca { background-image: url(../static/flags/ca.svg); } .flag-cc { background-image: url(../static/flags/cc.svg); } .flag-cd { background-image: url(../static/flags/cd.svg); } .flag-cf { background-image: url(../static/flags/cf.svg); } .flag-cg { background-image: url(../static/flags/cg.svg); } .flag-ch { background-image: url(../static/flags/ch.svg); } .flag-ci { background-image: url(../static/flags/ci.svg); } .flag-ck { background-image: url(../static/flags/ck.svg); } .flag-cl { background-image: url(../static/flags/cl.svg); } .flag-cm { background-image: url(../static/flags/cm.svg); } .flag-cn { background-image: url(../static/flags/cn.svg); } .flag-co { background-image: url(../static/flags/co.svg); } .flag-cr { background-image: url(../static/flags/cr.svg); } .flag-cu { background-image: url(../static/flags/cu.svg); } .flag-cv { background-image: url(../static/flags/cv.svg); } .flag-cw { background-image: url(../static/flags/cw.svg); } .flag-cx { background-image: url(../static/flags/cx.svg); } .flag-cy { background-image: url(../static/flags/cy.svg); } .flag-cz { background-image: url(../static/flags/cz.svg); } .flag-de { background-image: url(../static/flags/de.svg); } .flag-dj { background-image: url(../static/flags/dj.svg); } .flag-dk { background-image: url(../static/flags/dk.svg); } .flag-dm { background-image: url(../static/flags/dm.svg); } .flag-do { background-image: url(../static/flags/do.svg); } .flag-dz { background-image: url(../static/flags/dz.svg); } .flag-ec { background-image: url(../static/flags/ec.svg); } .flag-ee { background-image: url(../static/flags/ee.svg); } .flag-eg { background-image: url(../static/flags/eg.svg); } .flag-eh { background-image: url(../static/flags/eh.svg); } .flag-er { background-image: url(../static/flags/er.svg); } .flag-es { background-image: url(../static/flags/es.svg); } .flag-et { background-image: url(../static/flags/et.svg); } .flag-fi { background-image: url(../static/flags/fi.svg); } .flag-fj { background-image: url(../static/flags/fj.svg); } .flag-fk { background-image: url(../static/flags/fk.svg); } .flag-fm { background-image: url(../static/flags/fm.svg); } .flag-fo { background-image: url(../static/flags/fo.svg); } .flag-fr { background-image: url(../static/flags/fr.svg); } .flag-ga { background-image: url(../static/flags/ga.svg); } .flag-gb { background-image: url(../static/flags/gb.svg); } .flag-gd { background-image: url(../static/flags/gd.svg); } .flag-ge { background-image: url(../static/flags/ge.svg); } .flag-gf { background-image: url(../static/flags/gf.svg); } .flag-gg { background-image: url(../static/flags/gg.svg); } .flag-gh { background-image: url(../static/flags/gh.svg); } .flag-gi { background-image: url(../static/flags/gi.svg); } .flag-gl { background-image: url(../static/flags/gl.svg); } .flag-gm { background-image: url(../static/flags/gm.svg); } .flag-gn { background-image: url(../static/flags/gn.svg); } .flag-gp { background-image: url(../static/flags/gp.svg); } .flag-gq { background-image: url(../static/flags/gq.svg); } .flag-gr { background-image: url(../static/flags/gr.svg); } .flag-gs { background-image: url(../static/flags/gs.svg); } .flag-gt { background-image: url(../static/flags/gt.svg); } .flag-gu { background-image: url(../static/flags/gu.svg); } .flag-gw { background-image: url(../static/flags/gw.svg); } .flag-gy { background-image: url(../static/flags/gy.svg); } .flag-hk { background-image: url(../static/flags/hk.svg); } .flag-hm { background-image: url(../static/flags/hm.svg); } .flag-hn { background-image: url(../static/flags/hn.svg); } .flag-hr { background-image: url(../static/flags/hr.svg); } .flag-ht { background-image: url(../static/flags/ht.svg); } .flag-hu { background-image: url(../static/flags/hu.svg); } .flag-id { background-image: url(../static/flags/id.svg); } .flag-ie { background-image: url(../static/flags/ie.svg); } .flag-il { background-image: url(../static/flags/il.svg); } .flag-im { background-image: url(../static/flags/im.svg); } .flag-in { background-image: url(../static/flags/in.svg); } .flag-io { background-image: url(../static/flags/io.svg); } .flag-iq { background-image: url(../static/flags/iq.svg); } .flag-ir { background-image: url(../static/flags/ir.svg); } .flag-is { background-image: url(../static/flags/is.svg); } .flag-it { background-image: url(../static/flags/it.svg); } .flag-je { background-image: url(../static/flags/je.svg); } .flag-jm { background-image: url(../static/flags/jm.svg); } .flag-jo { background-image: url(../static/flags/jo.svg); } .flag-jp { background-image: url(../static/flags/jp.svg); } .flag-ke { background-image: url(../static/flags/ke.svg); } .flag-kg { background-image: url(../static/flags/kg.svg); } .flag-kh { background-image: url(../static/flags/kh.svg); } .flag-ki { background-image: url(../static/flags/ki.svg); } .flag-km { background-image: url(../static/flags/km.svg); } .flag-kn { background-image: url(../static/flags/kn.svg); } .flag-kp { background-image: url(../static/flags/kp.svg); } .flag-kr { background-image: url(../static/flags/kr.svg); } .flag-kw { background-image: url(../static/flags/kw.svg); } .flag-ky { background-image: url(../static/flags/ky.svg); } .flag-kz { background-image: url(../static/flags/kz.svg); } .flag-la { background-image: url(../static/flags/la.svg); } .flag-lb { background-image: url(../static/flags/lb.svg); } .flag-lc { background-image: url(../static/flags/lc.svg); } .flag-li { background-image: url(../static/flags/li.svg); } .flag-lk { background-image: url(../static/flags/lk.svg); } .flag-lr { background-image: url(../static/flags/lr.svg); } .flag-ls { background-image: url(../static/flags/ls.svg); } .flag-lt { background-image: url(../static/flags/lt.svg); } .flag-lu { background-image: url(../static/flags/lu.svg); } .flag-lv { background-image: url(../static/flags/lv.svg); } .flag-ly { background-image: url(../static/flags/ly.svg); } .flag-ma { background-image: url(../static/flags/ma.svg); } .flag-mc { background-image: url(../static/flags/mc.svg); } .flag-md { background-image: url(../static/flags/md.svg); } .flag-me { background-image: url(../static/flags/me.svg); } .flag-mf { background-image: url(../static/flags/mf.svg); } .flag-mg { background-image: url(../static/flags/mg.svg); } .flag-mh { background-image: url(../static/flags/mh.svg); } .flag-mk { background-image: url(../static/flags/mk.svg); } .flag-ml { background-image: url(../static/flags/ml.svg); } .flag-mm { background-image: url(../static/flags/mm.svg); } .flag-mn { background-image: url(../static/flags/mn.svg); } .flag-mo { background-image: url(../static/flags/mo.svg); } .flag-mp { background-image: url(../static/flags/mp.svg); } .flag-mq { background-image: url(../static/flags/mq.svg); } .flag-mr { background-image: url(../static/flags/mr.svg); } .flag-ms { background-image: url(../static/flags/ms.svg); } .flag-mt { background-image: url(../static/flags/mt.svg); } .flag-mu { background-image: url(../static/flags/mu.svg); } .flag-mv { background-image: url(../static/flags/mv.svg); } .flag-mw { background-image: url(../static/flags/mw.svg); } .flag-mx { background-image: url(../static/flags/mx.svg); } .flag-my { background-image: url(../static/flags/my.svg); } .flag-mz { background-image: url(../static/flags/mz.svg); } .flag-na { background-image: url(../static/flags/na.svg); } .flag-nc { background-image: url(../static/flags/nc.svg); } .flag-ne { background-image: url(../static/flags/ne.svg); } .flag-nf { background-image: url(../static/flags/nf.svg); } .flag-ng { background-image: url(../static/flags/ng.svg); } .flag-ni { background-image: url(../static/flags/ni.svg); } .flag-nl { background-image: url(../static/flags/nl.svg); } .flag-no { background-image: url(../static/flags/no.svg); } .flag-np { background-image: url(../static/flags/np.svg); } .flag-nr { background-image: url(../static/flags/nr.svg); } .flag-nu { background-image: url(../static/flags/nu.svg); } .flag-nz { background-image: url(../static/flags/nz.svg); } .flag-om { background-image: url(../static/flags/om.svg); } .flag-pa { background-image: url(../static/flags/pa.svg); } .flag-pe { background-image: url(../static/flags/pe.svg); } .flag-pf { background-image: url(../static/flags/pf.svg); } .flag-pg { background-image: url(../static/flags/pg.svg); } .flag-ph { background-image: url(../static/flags/ph.svg); } .flag-pk { background-image: url(../static/flags/pk.svg); } .flag-pl { background-image: url(../static/flags/pl.svg); } .flag-pm { background-image: url(../static/flags/pm.svg); } .flag-pn { background-image: url(../static/flags/pn.svg); } .flag-pr { background-image: url(../static/flags/pr.svg); } .flag-ps { background-image: url(../static/flags/ps.svg); } .flag-pt { background-image: url(../static/flags/pt.svg); } .flag-pw { background-image: url(../static/flags/pw.svg); } .flag-py { background-image: url(../static/flags/py.svg); } .flag-qa { background-image: url(../static/flags/qa.svg); } .flag-re { background-image: url(../static/flags/re.svg); } .flag-ro { background-image: url(../static/flags/ro.svg); } .flag-rs { background-image: url(../static/flags/rs.svg); } .flag-ru { background-image: url(../static/flags/ru.svg); } .flag-rw { background-image: url(../static/flags/rw.svg); } .flag-sa { background-image: url(../static/flags/sa.svg); } .flag-sb { background-image: url(../static/flags/sb.svg); } .flag-sc { background-image: url(../static/flags/sc.svg); } .flag-sd { background-image: url(../static/flags/sd.svg); } .flag-se { background-image: url(../static/flags/se.svg); } .flag-sg { background-image: url(../static/flags/sg.svg); } .flag-sh { background-image: url(../static/flags/sh.svg); } .flag-si { background-image: url(../static/flags/si.svg); } .flag-sj { background-image: url(../static/flags/sj.svg); } .flag-sk { background-image: url(../static/flags/sk.svg); } .flag-sl { background-image: url(../static/flags/sl.svg); } .flag-sm { background-image: url(../static/flags/sm.svg); } .flag-sn { background-image: url(../static/flags/sn.svg); } .flag-so { background-image: url(../static/flags/so.svg); } .flag-sr { background-image: url(../static/flags/sr.svg); } .flag-ss { background-image: url(../static/flags/ss.svg); } .flag-st { background-image: url(../static/flags/st.svg); } .flag-sv { background-image: url(../static/flags/sv.svg); } .flag-sx { background-image: url(../static/flags/sx.svg); } .flag-sy { background-image: url(../static/flags/sy.svg); } .flag-sz { background-image: url(../static/flags/sz.svg); } .flag-tc { background-image: url(../static/flags/tc.svg); } .flag-td { background-image: url(../static/flags/td.svg); } .flag-tf { background-image: url(../static/flags/tf.svg); } .flag-tg { background-image: url(../static/flags/tg.svg); } .flag-th { background-image: url(../static/flags/th.svg); } .flag-tj { background-image: url(../static/flags/tj.svg); } .flag-tk { background-image: url(../static/flags/tk.svg); } .flag-tl { background-image: url(../static/flags/tl.svg); } .flag-tm { background-image: url(../static/flags/tm.svg); } .flag-tn { background-image: url(../static/flags/tn.svg); } .flag-to { background-image: url(../static/flags/to.svg); } .flag-tr { background-image: url(../static/flags/tr.svg); } .flag-tt { background-image: url(../static/flags/tt.svg); } .flag-tv { background-image: url(../static/flags/tv.svg); } .flag-tw { background-image: url(../static/flags/tw.svg); } .flag-tz { background-image: url(../static/flags/tz.svg); } .flag-ua { background-image: url(../static/flags/ua.svg); } .flag-ug { background-image: url(../static/flags/ug.svg); } .flag-um { background-image: url(../static/flags/um.svg); } .flag-us { background-image: url(../static/flags/us.svg); } .flag-uy { background-image: url(../static/flags/uy.svg); } .flag-uz { background-image: url(../static/flags/uz.svg); } .flag-va { background-image: url(../static/flags/va.svg); } .flag-vc { background-image: url(../static/flags/vc.svg); } .flag-ve { background-image: url(../static/flags/ve.svg); } .flag-vg { background-image: url(../static/flags/vg.svg); } .flag-vi { background-image: url(../static/flags/vi.svg); } .flag-vn { background-image: url(../static/flags/vn.svg); } .flag-vu { background-image: url(../static/flags/vu.svg); } .flag-wf { background-image: url(../static/flags/wf.svg); } .flag-ws { background-image: url(../static/flags/ws.svg); } .flag-ye { background-image: url(../static/flags/ye.svg); } .flag-yt { background-image: url(../static/flags/yt.svg); } .flag-za { background-image: url(../static/flags/za.svg); } .flag-zm { background-image: url(../static/flags/zm.svg); } .flag-zw { background-image: url(../static/flags/zw.svg); } .flag-es-ct { background-image: url(../static/flags/es-ct.svg); } .flag-eu { background-image: url(../static/flags/eu.svg); } .flag-gb-eng { background-image: url(../static/flags/gb-eng.svg); } .flag-gb-nir { background-image: url(../static/flags/gb-nir.svg); } .flag-gb-sct { background-image: url(../static/flags/gb-sct.svg); } .flag-gb-wls { background-image: url(../static/flags/gb-wls.svg); } .flag-un { background-image: url(../static/flags/un.svg); } .flag-xk { background-image: url(../static/flags/xk.svg); } .flatpickr-calendar.animate.slotpicker.open.arrowTop.rightMost:after { border-bottom-color: #ffed00; } .slotpicker .js-isSlotsCalendar, .js-slotsCalendar-inner { -webkit-appearance: none; font-size: 11.5px !important; } .slotpicker { padding-bottom: 5px; position: absolute; display: flex !important; right: 65px; width: 614px !important; } .slotpicker .slotpicker-container { width: 100%; } .slotpicker a.button.button--yellow { position: absolute; bottom: 10px; right: 8px; width: 10px; height: 8px; font-size: 14px; font-weight: 600; } .slotpicker-title { background-color: #444444; height: 48px; } .slotpicker-title-cross { float: right; margin-right: 14px; margin-top: 7px; font-size: 10px; cursor: pointer; color: #ffffff; } .slotpicker-title-logo { height: 18px; margin-right: auto; margin-left: auto; margin-top: 14px; } .slotpicker .slotpicker-slots-container { display: flex; flex-direction: column; justify-content: space-between; height: 257px; } .slotpicker .slotpicker-slots-text { color: #999999; text-align: left; } .slotpicker .slotpicker-slots-header { text-transform: uppercase; height: 29px; font-weight: 500; font-size: 12px; text-align: left; padding: 3px 10px; } .slotpicker .slotpicker-slots-content { height: 100%; padding: 10px 8px; } .slotpicker .slotpicker-slots { max-height: 169px; overflow-y: auto; } .slotpicker .slotpicker-slot { padding: 5px 8px; border: 1px solid #d2d2d2; border-radius: 8%; float: left; margin-bottom: 5px; margin-right: 5px; cursor: pointer; } .slotpicker .slotpicker-slot-selected { background-color: #00205B; } .slotpicker .slotpicker-slots-footer { height: 65px; text-align: left; padding-left: 7px; } .slotpicker .slotpicker-slots-footer-text { position: absolute; bottom: 12px; font-size: 15px; } .slotpicker .flatpickr-calendar.inline { box-shadow: none !important; top: -24px !important; max-height: 286px !important; } .slotpicker .flatpickr-innerContainer { border-right: 1px solid #d2d2d2 !important; } .slotpicker .timeslot-date { background-repeat: no-repeat !important; background-position: 1px 1px !important; background-size: auto !important; background-position: top right !important; } .slotpicker .timeslot-date-select { background-image: url("data:image/svg+xml;utf8,") !important; } .slotpicker .timeslot-date-noselect { background-image: url("data:image/svg+xml;utf8,") !important; } @media only screen and (max-width: 768px) { .slotpicker { width: 307px !important; display: inline-block !important; } .slotpicker-slots-container { height: unset !important; } .slotpicker .slotpicker-title { display: none; } } @supports (-webkit-overflow-scrolling: touch) { /*#layout { position: fixed; top: 0; right: 0; bottom: 0; left: 0; overflow-y: scroll; -webkit-overflow-scrolling: touch; } *:not(html) { -webkit-transform: translate3d(0, 0, 0); }*/ } @font-face { font-family: "Stag"; src: url("../fonts/Stag-Light-Web.woff2") format("woff2"), url("../fonts/Stag-Light-Web.woff") format("woff"); font-weight: 300; font-style: normal; } @font-face { font-family: "Stag"; src: url("../fonts/Stag-LightItalic-Web.woff2") format("woff2"), url("../fonts/Stag-LightItalic-Web.woff") format("woff"); font-weight: 300; font-style: italic; } @font-face { font-family: "Stag"; src: url("../fonts/Stag-Book-Web.woff2") format("woff2"), url("../fonts/Stag-Book-Web.woff") format("woff"); font-weight: 400; font-style: normal; } @font-face { font-family: "Stag"; src: url("../fonts/Stag-Medium-Web.woff2") format("woff2"), url("../fonts/Stag-Medium-Web.woff") format("woff"); font-weight: 500; font-style: normal; } .discounted-date { background-image: url("data:image/svg+xml;utf8,") !important; background-repeat: no-repeat !important; background-position: 1px 1px !important; background-size: auto !important; } .discounted-date-large { background-image: url("data:image/svg+xml;utf8,") !important; background-repeat: no-repeat !important; background-position: 3px 3px !important; background-size: auto !important; } .selected.discounted-date { background-image: url("data:image/svg+xml;utf8,") !important; --background-color:#4F99FF !important; --color:#fff !important; } .flatpickr-day.today { border-color: #ccc !important; } input[type=number] { -moz-appearance: textfield !important; appearance: textfield !important; padding-top: 0px !important; padding-bottom: 0px !important; } .info-box { padding: 10px !important; margin-bottom: 15px !important; margin: 0px; background: rgb(255, 223, 2); border-radius: 4px; box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 4px 0px; } .info-box-icon { display: inline-block; vertical-align: middle; -webkit-transform: translateY(-2px) !important; transform: translateY(-2px); height: 25px; width: 25px; margin-right: 8px !important; -webkit-box-flex: 0; background-image: url("/static/exclamation-mark.svg"); background-position: center; background-size: contain; background-repeat: no-repeat; transform-origin: 50% 50%; } .selected.discounted-date:hover { } /* */ label { outline: none !important; } body { background: #fafafa; font-size: 16px; margin: 0; padding: 0; } html { overflow-y: scroll; } .layout { min-height: 750px; } body:not(.userIsTabbing) button:focus, body:not(.userIsTabbing) input:focus, body:not(.userIsTabbing) select:focus, body:not(.userIsTabbing) textarea:focus { outline: none; } .loader18 { width: 18px; height: 18px; background-image: url(data:image/gif;base64,R0lGODlhEgASAIQAAAQCBISChERCRMTGxOTi5GRmZCQmJKyurFRSVPz6/BQSFIyKjNza3Ozq7AQGBISGhExKTHx+fCwuLFxeXNze3Ozu7P///wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQJBgAWACwAAAAAEgASAAAFOqAlisRSDGOqVgXgGmpMGa4LxWlFv1GDj5NaJPEbMWqPYirikhCVIogrCRUdFIJKdcvter/gsHgMDQEAIfkECQYAGgAsAAAAABIAEgCEBAIEhIKE1NLUTE5MJCIk7OrspKakNDI0/Pr8dHZ0jIqM3NrcLCos9PL0rK6sPDo8BAYEhIaEZGJkJCYk7O7sNDY0/P78fH583N7ctLK0////AAAAAAAAAAAAAAAAAAAABTmgJopYNBzVZY2sSElALAvtuBCyTDS1VuCxycXhoPQ0sFgEcWQBI82W4ZFgRq/YrHbL7Xq/4LBYFAIAIfkECQYAGwAsAAAAABIAEgCEBAIEhIaEzM7MTEpMJCIk7O7srK6slJKULC4s/Pr8fH58DA4MjI6M5ObkZGJkLCos9Pb0BAYEjIqM3NrcTE5MJCYk9PL0tLK0nJqcNDI0/P78////AAAAAAAAAAAAAAAABTngJopTMCAZxTRjuxUOIM/AIrhbQ9A8hjOzSsBgUCAcFtyEsAgkcNBNAhKtWq/YrHbL7Xq/4LC4FQIAIfkECQYAGAAsAAAAABIAEgCEBAIEhIKEREJE3N7cJCYkbGpstLK09PL0dHZ0PD48HB4c7OrsLC4svLq8fH58BAYEhIaETEpM5OLkLCosbG5s/Pr8fHp8vL68////AAAAAAAAAAAAAAAAAAAAAAAAAAAABTcgJo5VQUwRNIws2wBwXCwtuyhxPK21uBgGB0F36LUqlhjCWEPAEswjJXGJWq/YrHbL7Xq/YGwIACH5BAkGABgALAAAAAASABIAhAQCBISChERGRMTGxOTi5CQiJGRmZPTy9LSytOzq7Hx6fBQSFIyOjDw+PAQGBISGhFRWVNze3OTm5CwqLGxubPz6/Ozu7Hx+fP///wAAAAAAAAAAAAAAAAAAAAAAAAAAAAU7ICaOIwI9EamqC+Aa1ro2rluk8igFRT3FuVHlUqMEVUSAg3AcHXoARnOkeE1FEkFhcO16v+CweEwOhgAAIfkECQYAFwAsAAAAABIAEgCEBAIEhIKEzM7MVFJU7OrsJCIkbGps/Pr8rKqsNDY03N7c9PL0fH58BAYEjIqMZGZk7O7sJCYkbG5s/P78rK6sPDo85OLk////AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABTrgJY5kaZ4XEj0QaiYAECkuKcVyW18Hgz+7kQ/QsAR5hZjjeBkOmIhYAiplEpIM5gUiOGi/4LB4PAoBACH5BAkGABgALAAAAAASABIAhAQCBISChExOTNze3CQiJKSmpPTy9GxubCwuLAwKDIyKjOzu7Ly+vPz+/Hx6fDQ2NAQGBISGhFRWVOTi5KyurPT29DQyNHx+fP///wAAAAAAAAAAAAAAAAAAAAAAAAAAAAU6ICaOZGmeaKquLLoETCtKADTIDwBEcqALMooOERzKLr9WhaBTtBw6yIRVSegOrQYCgDDIJoWFbJwKAQAh+QQJBgAZACwAAAAAEgASAIQEAgSEgoREQkTc3twkJiRsamy0srT08vR8enw8Ojy8urwcHhzs6uwsLix0cnQEBgSEhoRMTkzk4uQsKixsbmy0trT8+vx8fny8vrz///8AAAAAAAAAAAAAAAAAAAAAAAAFOmAmjmRpnmiqrmzrviODWS6zAJRbAcDkGjxf68KLtCwEHqSF4AEGK0uTV2BRnIQDKxGEshQJihZGCgEAIfkECQYAGAAsAAAAABIAEgCEBAIEhIKEREJExMLEZGJk5OLkHB4c9PL0tLa0fH58FBYUjI6MXFpcbGps7OrsJCYkBAYEhIaEREZE3N7cZGZk/Pr87O7sLCos////AAAAAAAAAAAAAAAAAAAAAAAAAAAABTogJo5kaZ5oqq5s675wLJeOoCBuAABMWz27SCuxA0xWFeKOonIkgLuHRSUoAh5HlWEHaUxXA8IiOwoBACH5BAkGABwALAAAAAASABIAhAQCBISChMzKzDQ2NOzq7CQmJKyurPT29JSSlFxeXAwKDIyKjNze3ExKTPTy9CwuLPz+/AQGBISGhOzu7CwqLLSytPz6/JyanGRmZAwODOTi5ExOTP///wAAAAAAAAAAAAU3ICeOZGmeaKqubOu+cCzP9HxAriUpFGM6iUHAUAkUAEiECYFsOgsEkyDibGImKIZk83g0Aj5SCAAh+QQJBgAVACwAAAAAEgASAIQEAgSEgoTEwsQ8Ojzk4uQsKiykoqT09vRcXlwMDgyMioz8/vwEBgSEhoTc3txMSkzs7uwsLiy0srT8+vxkZmT///8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAFN2AljmRpnmiqrmzrvnAsz3S6HC9RJAHOGoBgISCRNAYIiAlSCDqfjROE8nQyBClH4FEoPAKOUggAIfkECQYAFAAsAAAAABIAEgCEBAIEhIKEREJExMLEJCIkZGJk7O7stLa0NDY03NrcLCosbG5sBAYEhIaEREZEJCYk/Pr8vLq83N7cdHJ0////AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABTcgJY5kaZ5oqq5s675wLM9pJEyQiwBA4C68Xm5leAQVjUPEkJIYgzwCE2UoQHmRVSLgeDwWQ1IIACH5BAkGABgALAAAAAASABIAhAQCBISGhExKTMzOzCQiJOzq7DQyNKyurPz6/HR2dCwqLPTy9LS2tAQGBIyKjGRiZNza3CQmJOzu7Dw+PLSytPz+/Hx6fCwuLP///wAAAAAAAAAAAAAAAAAAAAAAAAAAAAU4ICaOZGmeaKqubOuO1bC8FkBI7gUAVL4fLsEu4ArsFIgWZAcgth7MQHJVIDATSitg4io8IsBXKwQAIfkECQYAGgAsAAAAABIAEgCEBAIEhIKEzMrMNDY05ObkJCIktLK0XF5c/Pr8lJaU3NrcDAoMjIqMREZE9PL0LCos5OLkhIaE7OrstLa0ZGJk/P783N7cDA4MTEpMLC4s////AAAAAAAAAAAAAAAAAAAABTugJo5kaZ5oqq6nkDisCC0AFWsRAAw3pge3h84QHN4ausgtoHsgYgodgHE76C5PlqQAKFRukITlRi6TQgAh+QQJBgAXACwAAAAAEgASAIQEAgSEgoTc2txERkQkJiSkpqTs7uxkZmQ8PjwMDgyMiozk5uQ0MjS0trT8+vwEBgSEhoTc3txcXlwsKix8fny8urz8/vz///8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAFQOAljmRpnqhoFEtaGhPAWO54AEDi1FeEAxTeJYAj7HgDXEB4IeAaTCcAKkwCIEwKDsEUPAAS5qUCMYjP6LT6EgIAO1VZZ2pQYVJvQmVCbzZrTUVWU3dxUUxudEs2d3dTN040Z2c5NXJxVkFVQVp1S1ZubXQ0ZkhQb0lXQzZmN0pxQUE=); } /* big spinner */ .spinner32 { height: 32px; width: 32px; background: rgba(0, 0, 0, 0); border-radius: 50%; border: 3px solid rgba(0, 0, 0, 0.1); border-top-color: #666; animation: spinner32 1300ms linear infinite; /*position: absolute; left: 50%; margin-left: -32px !important; margin-top:75px !important;*/ margin: auto !important; margin-top: 0px !important; margin-bottom: 27px !important; } @keyframes spinner32 { to { transform: rotate(360deg); } } .loaderXL, .loaderXL:after { border-radius: 50%; width: 10em; height: 10em; } .loaderXL { margin: 60px auto; font-size: 10px; position: relative; text-indent: -9999em; border-top: 1.1em solid rgba(255, 255, 255, 0.2); border-right: 1.1em solid rgba(255, 255, 255, 0.2); border-bottom: 1.1em solid rgba(255, 255, 255, 0.2); border-left: 1.1em solid #ffffff; -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); -webkit-animation: load8 1.1s infinite linear; animation: load8 1.1s infinite linear; } @-webkit-keyframes load8 { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes load8 { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } .chevron-down { display: inline-block; width: 10px; height: 10px; background-position: center; background-size: 100%; background-repeat: no-repeat; background-image: url("../static/chevron-down.svg"); } .img-cross { display: inline-block; width: 30px; height: 30px; background-position: center; background-size: 100%; background-repeat: no-repeat; background-image: url("../static/cross.svg"); } [class~="layout"] *::after, [class~="layout"] *::before, [class~="layout"] * { margin: 0; padding: 0; box-sizing: border-box; } .layout-inner { font-family: "Open Sans", sans-serif; color: #333333; background: #fafafa; position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; line-height: 1.5; letter-spacing: 0.2px; padding: 10px; } .layout-inner a { cursor: pointer; color: #009ce1; text-decoration: none; /*transition: background-color 0.15s, color 0.15s;*/ } .deactivated .layout-inner a, .layout-inner a.deactivated { background-color: transparent !important; border-color: #d2d2d2 !important; } /*.layout-inner a:hover { color: #333333; }*/ .layout-inner a.plain { color: #555555; /*transition: background-color 0.15s, color 0.15s;*/ } .deactivated .layout-inner a.plain, .layout-inner a.plain.deactivated { background-color: transparent !important; border-color: #d2d2d2 !important; } .layout-inner input, .layout-inner button, .layout-inner select, .layout-inner textarea { font-family: inherit; font-size: inherit; line-height: inherit; letter-spacing: inherit; } .layout-inner h1, .layout-inner h2, .layout-inner h3, .layout-inner h4, .layout-inner h5 { font-weight: 500; line-height: 1.5; } .layout-inner h4 { font-size: 24px; } .layout-inner ul { list-style: inside; color: #555555; } .layout-inner strong, .layout-inner b { font-weight: 500; } .layout-inner > * { max-width: 1200px; } @media (max-width: 699px) { .layout-inner .desktop-only { display: none; } } .layout-inner .mobile-only { display: none; } @media (max-width: 699px) { .layout-inner .mobile-only { display: initial; } } @media (max-width: 399px) { .layout-inner { padding: 0; } } .search { width: 100%; height: 52px; display: flex; font-size: 12px; } .search .search-searchbar { -webkit-appearance: none; border: 0; border-radius: 0; padding: 20px; width: 100%; margin-right: 2px; font-size: 14px; } .search .search-searchbutton { position: relative; display: block; width: 52px; background-color: #00205B; border: none; background-position: center; background-size: 50%; background-repeat: no-repeat; background-image: url("../static/search.svg"); } @media (max-width: 699px) { .search .search-searchbutton { height: 40px; } } @media (max-width: 699px) { .search { height: 40px; } } .radio-control, .radio-control-tire-option { position: relative; cursor: pointer; outline: none !important; } .radio-control > *, .radio-control-tire-option > * { cursor: pointer; vertical-align: middle; } .radio-control .check, .radio-control-tire-option .check { display: block; position: absolute; top: 2px; border: 1px solid #d2d2d2; border-radius: 100%; height: 20px; width: 20px; } .radio-control .check.check--black, .radio-control-tire-option .check.check--black { border: 2px solid black; } .radio-control .check::before, .radio-control-tire-option .check::before { display: block; position: absolute; content: ""; top: 50%; left: 50%; transform: translate(-50%, -50%); height: 24px; width: 24px; background-color: transparent; } .radio-control label, .radio-control-tire-option label { margin-left: 35px; } .radio-control input[type="radio"], .radio-control-tire-option input[type="radio"] { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .radio-control input[type="radio"]:checked ~ .check, .radio-control-tire-option input[type="radio"]:checked ~ .check { border: 1px solid #000000; } .radio-control input[type="radio"]:checked ~ .check::before, .radio-control-tire-option input[type="radio"]:checked ~ .check::before { content: ""; background-image: url("../static/circle-solid.svg"); background-repeat: no-repeat; background-size: 12px; background-position: center; border-color: #4ec361; } .radio-control input[type="radio"]:checked ~ .check--black, .radio-control-tire-option input[type="radio"]:checked ~ .check--black { border: 2px solid #4ec361; } .radio-control input[type="radio"]:checked ~ .check--black::before, .radio-control-tire-option input[type="radio"]:checked ~ .check--black::before { content: ""; background-image: url("../static/circle-solid.svg"); background-repeat: no-repeat; background-size: 12px; background-position: center; border-color: #4ec361; } .infoWindow span { display: block; } .infoWindow .label { margin-top: 15px; } .content-wrapper.bookingDetails { display: flex; flex-direction: column; font-size: 16px; } @media (min-width: 1200px) { .content-wrapper.bookingDetails { width: 790px; } } .bookingDetails-summary { border-radius: 4px; box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1); background-color: #ffffff; padding: 20px 30px; width: 100%; display: flex; flex-direction: column; } @media (max-width: 699px) { .bookingDetails-summary { padding: 10px 15px; } } .bookingDetails-locationAndTime { width: 100%; height: 60px; display: flex; justify-content: space-between; } @media (max-width: 399px) { .bookingDetails-locationAndTime { font-size: 12px; } } .bookingDetails-location { font-weight: 500; display: flex; flex-direction: column; justify-content: center; } .bookingDetails-time { display: flex; flex-direction: column; justify-content: center; padding-left: 30px; border-left: 1px solid #d2d2d2; } @media (max-width: 399px) { .bookingDetails-time { padding-left: 15px; } } .bookingDetails-timeSelected { text-align: center; font-size: 12px; color: #999999; } @media (max-width: 699px) { .bookingDetails-timeSelected { text-align: left; } } .bookingDetails-daySelected { font-weight: 500; } .bookingDetails-smallTitle { font-size: 18px; font-weight: 500; margin-top: 30px; } .bookingDetails-selectedServices { display: flex; flex-direction: column; } .bookingDetails-selectedServices > div:nth-of-type(1) { margin-top: 5px; } @media (max-width: 399px) { .bookingDetails-selectedServices > div:nth-of-type(1) { margin-top: 0; } } .bookingDetails-selectedServices > * + * { border-bottom: 1px solid #d2d2d2; } .bookingDetails-selectedServiceRow { width: 100%; padding-top: 12px; padding-bottom: 12px; display: flex; justify-content: space-between; } @media (max-width: 399px) { .bookingDetails-selectedServiceRow { font-size: 12px; } } .bookingDetails-priceInfo { display: flex; } .bookingDetails-regularPrice { font-weight: 500; } .bookingDetails-oldPrice { margin-right: 5px; color: #999999; text-decoration: line-through; } .bookingDetails-newPrice { color: #ff3b17; font-weight: 500; } .bookingDetails-deleteButton { margin-left: 15px; } .bookingDetails-selectedServiceTotal { display: flex; padding-top: 20px; padding-bottom: 20px; flex-direction: row; justify-content: space-between; align-items: flex-start; } .bookingDetails-selectedServiceTotal .bookingDetails-selectedServiceTotalHeading { font-size: 18px; font-weight: 500; } .bookingDetails-conditions > * + * { margin-top: 10px; } @media (max-width: 699px) { .bookingDetails-conditions { width: 100%; } } .bookingDetails-conditionsText { color: #999999; font-size: 14px; } .bookingDetails-conditionsText span { text-decoration: underline; } @media (max-width: 399px) { .bookingDetails-conditionsText ~ .bookingDetails-conditionsText { margin-top: 20px; } } .bookingDetails-listSavedAmount { font-size: 14px; color: #ff3b17; } .bookingDetails-discounted { color: #ff3b17; } @media (max-width: 399px) { .bookingDetails-listSavedAmount { font-size: 12px; } } .bookingDetails-listVAT { font-size: 14px; color: #d2d2d2; } @media (max-width: 399px) { .bookingDetails-listVAT { font-size: 12px; } } .bookingDetails-totalPrice { width: 40%; display: flex; flex-direction: column; align-items: flex-end; font-weight: 500; text-align: right; margin-right: 35px; } @media (max-width: 399px) { .bookingDetails-totalPrice { font-size: 12px; } } .bookingDetails-totalPriceText { font-weight: 500; margin-bottom: 20px; } .bookingDetails-extrasContainer { display: flex; width: 100%; flex-wrap: wrap; justify-content: space-between; /*transition: max-height 0.5s;*/ overflow-y: hidden; } .bookingDetails-displayAllContainer { border-bottom: 1px solid #d2d2d2; width: 100%; display: flex; justify-content: center; } .bookingDetails-displayAllButton { margin-top: 20px; margin-bottom: 20px; display: flex; align-items: center; border: 0; background: transparent; cursor: pointer; font: inherit; color: #009ce1; } .bookingDetails-displayAllButton::before { content: "Visa alla tillval"; } .bookingDetails-displayAllIcon { background-image: url("../static/chevron-down.svg"); background-size: cover; background-size: 10px 10px; background-repeat: no-repeat; height: 10px; width: 10px; margin-left: 10px; /*transition: all 500ms;*/ } .bookingDetails-availableExtras { display: flex; flex-direction: column; width: 100%; } .bookingDetails-availableExtras.expandExtras .bookingDetails-displayAllButton::before { content: "Visa mindre"; } .bookingDetails-availableExtras.expandExtras .bookingDetails-displayAllIcon { transform: rotateX(180deg); } .bookingDetails-addNewExtra { align-self: flex-end; margin-left: auto; display: flex; align-items: center; cursor: pointer; background: none; border: none; } /*.bookingDetails-addNewExtra::before { font-size: 12px; font-weight: 500; content: "L\E4gg till"; }*/ .bookingDetails-addNewExtra span { margin-left: 5px; } .bookingDetails-addNewExtra span.button-add-text { font-size: 12px; font-weight: 500; } .bookingDetails-addNewExtra span.button-added-text { font-size: 12px; font-weight: 500; color: #4ec361; display:none; } .bookingDetails-extrasBox.selected span.button-added-text { display:inline-block; } .bookingDetails-extrasBox.selected span.button-add-text { display: none; } .bookingDetails-extrasBox { position: relative; display: flex; flex-direction: column; width: 48%; padding-bottom: 4px; } .bookingDetails-extrasBox::after { content: ""; position: absolute; bottom: 0; width: 100%; background-color: #d2d2d2; height: 1px; /*--transition: all 0.1s linear;*/ } .bookingDetails-extrasBox.selected { box-shadow: none; } .bookingDetails-extrasBox.selected::after { background-color: #4ec361; height: 4px; } /* .bookingDetails-extrasBox.selected .bookingDetails-extrasLower .bookingDetails-addNewExtra::before { content: "Tillagd"; color: #4ec361; }*/ .bookingDetails-extrasBox.selected .bookingDetails-extrasLower .bookingDetails-addNewExtra span.button-round { background: #4ec361; background: center/contain no-repeat url("../static/check-o.svg"); } @media (max-width: 899px) { .bookingDetails-extrasBox { width: 100%; } } .bookingDetails-extrasTitle { font-weight: 500; padding-top: 30px; } .bookingDetails-extrasDescription { font-style: italic; color: #555555; margin-bottom: 10px; } .bookingDetails-extrasLower { margin-top: auto; width: 100%; display: flex; margin-bottom: 15px; } .bookingDetails-extrasPrices { font-size: 18px; font-weight: 500; } .bookingDetails-extrasOldPrice { color: #999999; text-decoration: line-through; } .bookingDetails-extrasNewPrice { color: #ff3b17; } .bookingDetails-flexibilityContainer, bookingDetails-tirehotelquestion { display: flex; flex-direction: column; } .bookingDetails-flexDescription { margin-top: 10px; } .bookingDetails-radioButtons { margin-top: 10px; margin-bottom: 30px; color: #999999; } @media (max-width: 699px) { .bookingDetails-radioButtons .radio-control, .bookingDetails-radioButtons .radio-control-tire-option { display: flex; justify-content: flex-start; margin: 5px 0; } .bookingDetails-radioButtons .radio-control label, .bookingDetails-radioButtons .radio-control-tire-option label { display: flex; } .bookingDetails-radioButtons .radio-control label span, .bookingDetails-radioButtons .radio-control-tire-option label span { align-self: flex-start; } } .bookingDetails-continueButton { /* width: 130px; */ margin-left: auto; } .BookingDetails-radioBoldText { display: inline-block; font-weight: 500; color: #333333; min-width: 110px; } .BookingDetails-radioDescriptionText { font-size: 14px; text-align: right; } @media (max-width: 899px) { .BookingDetails-radioDescriptionText { text-align: left; } } .bookingDetails-radioOuterWRapper > * + * { margin-top: 10px; } @media (max-width: 899px) { .bookingDetails-labelContainer { flex-direction: column; } } .expandableSection { font-size: 16px; /*transition: height 0.5s;*/ } .expandableSection + .expandableSection { border-top: 1px solid #d2d2d2; } .expandableSection-heading { cursor: pointer; color: #555555; font-weight: 500; padding: 18px 0; display: flex; align-items: center; justify-content: space-between; } .expandableSection-heading .expandableSection-choicePreview { padding-right: 1em; text-align: right; color: #009ce1; font-weight: normal; font-size: 14px; } .expandableSection-heading .expandableSection-heading--right { display: flex; align-items: center; justify-content: center; } .expandableSection-heading .expandableSection-chevron { width: 10px; height: 10px; /*transition: transform 0.25s ease-in-out;*/ font-size: 0.65em; } .expandableSection-heading .expandableSection-chevron path { fill: currentColor; } .expanded > .expandableSection-heading .expandableSection-chevron { transform: rotateX(180deg); } .expandableSection-expandable { display: none; } .expandableSection-inner { padding-bottom: 15px; width: 100%; } .expandableSection-clear { margin-bottom: 15px; height: 40px !important; padding: 0px 15px 0px 15px !important; } .expandableSection-filtering { width: 100%; display: flex; justify-content: space-between; } .expandableSection-clearAll { display: none; color: #009ce1; font-family: inherit; font-weight: 500; font-size: 12px !important; margin-right: 0.5em; outline: none; border: none; cursor: pointer; } .content-wrapper { margin-bottom: 80px; } @media (max-width: 699px) { .content-wrapper { width: 100%; } } .content-wrapper.responsive { width: 100%; } @media (max-width: 399px) { .content-wrapper.responsive { margin-bottom: 5px; } } @media (max-width: 699px) { .content-wrapper.responsive { margin-bottom: 20px; } } @media (max-width: 1199px) { .content-wrapper.responsive-after-tablet { width: 100%; } } .content-wrapper.small { width: 50%; } @media (max-width: 899px) { .content-wrapper.small.responsive { width: 75%; } } @media (max-width: 699px) { .content-wrapper.small.responsive { width: 100%; } } .content-wrapper.medium { width: 75%; } .content-wrapper.yourCar { max-width: 585px; margin: 0 auto; } .content { display: flex; } .content-inner { width: 100%; display: flex; flex-direction: column; justify-content: center; justify-content: flex-start; position: relative; } .content-aside + .content-inner { margin-left: 30px; } .content-inner:not(.only-structural) { border-radius: 4px; box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1); background-color: #ffffff; padding: 30px; } @media (max-width: 699px) { .content-inner { padding: 15px !important; } } .content-header { padding: 20px 0 24px 0; display: -webkit-box; display: flex; -webkit-box-pack: justify; justify-content: space-between; -webkit-box-align: center; align-items: center; letter-spacing: -0.1px; font-family: "Open Sans", sans-serif; font-size: 30px; } @media (max-width: 899px) { .content-header { -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; -webkit-box-pack: center; justify-content: center; -webkit-box-align: start; align-items: flex-start; padding: 20px 0 10px 0; } } @media (max-width: 699px) { .content-header { font-size: 16px; letter-spacing: 0; text-align: center; -webkit-box-align: center; align-items: center; } } @media (max-width: 399px) { .content-header { padding: 0; padding-bottom: 20px; } } .lastMinute-button { border-radius: 4px; box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1); background-color: #ffffff; padding: 20px 30px; -webkit-appeareance: none; overflow: hidden; padding: 12px 55px; font-size: 16px !important; font-weight: 500; font-family: "Open Sans", sans-serif !important; background-color: white; border: 4px solid white; line-height: 1em; position: relative; } @media (max-width: 699px) { .lastMinute-button { padding: 10px 15px; } } @media (max-width: 899px) { .lastMinute-button { width: 100%; margin-bottom: 15px; } } .lastMinute-button .icon { display: inline-block; vertical-align: middle; -webkit-transform: translateY(-2px); transform: translateY(-2px); height: 20px; width: 20px; margin-right: 8px; -webkit-box-flex: 0; flex-grow: 0; } .lastMinute-button::after { content: ""; position: absolute; height: 32px; width: 32px; top: 0%; left: 0%; background-color: #00205B; -webkit-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); } .lastMinute-button:hover { cursor: pointer; border-color: #00205B; background-color: #00205B; } .lastMinute-button:hover::after { background-color: white; } .serviceInfo-button { border-radius: 4px; box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1); padding: 20px 30px; -webkit-appeareance: none; overflow: hidden; padding: 12px 55px; font-size: 16px !important; font-weight: 500; font-family: "Open Sans", sans-serif !important; background-color: white; border: 4px solid white; line-height: 1em; position: relative; border-color: #ffffff; background-color: #ffffff; } @media (max-width: 699px) { .serviceInfo-button { padding: 10px 15px; } } @media (max-width: 899px) { .serviceInfo-button { width: 100%; margin-bottom: 15px; } } @media (max-width: 699px) { .content-header { font-size: 16px; letter-spacing: 0; text-align: center; -webkit-box-align: center; align-items: center; } .content-header .content-header--text { display: block; padding-bottom: 5px; } } @media (max-width: 399px) { .content-header { padding: 0; padding-bottom: 20px; } .content-header .content-header--text { display: block; padding-bottom: 5px; } } .selectedWorkshopContainer { width: 13%; } @media (min-width: 1124px) { .selectedWorkshopContainer { width: 25%; } } .lastMinute-button { border-radius: 4px; box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1); background-color: #ffffff; padding: 20px 30px; -webkit-appeareance: none; overflow: hidden; padding: 12px 55px; font-size: 16px !important; font-weight: 500; font-family: "Open Sans", sans-serif !important; background-color: white; border: 4px solid white; line-height: 1em; position: relative; } @media (max-width: 699px) { .lastMinute-button { padding: 10px 15px; } } @media (max-width: 899px) { .lastMinute-button { width: 100%; margin-bottom: 15px; } } .lastMinute-button .icon { display: inline-block; vertical-align: middle; -webkit-transform: translateY(-2px); transform: translateY(-2px); height: 20px; width: 20px; margin-right: 8px; -webkit-box-flex: 0; flex-grow: 0; } .lastMinute-button::after { content: ""; position: absolute; height: 32px; width: 32px; top: 0%; left: 0%; background-color: #00205B; -webkit-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); } .lastMinute-button:hover { cursor: pointer; border-color: #00205B; background-color: #00205B; } .lastMinute-button:hover::after { background-color: white; } .serviceInfo-button .icon { display: inline-block; vertical-align: middle; -webkit-transform: translateY(-2px); transform: translateY(-2px); height: 20px; width: 20px; margin-right: 8px; -webkit-box-flex: 0; flex-grow: 0; } .serviceInfo-button:hover { cursor: pointer; border-color: #00205B; background-color: #00205B; } .serviceInfo-button:hover .tag--yellow { background-color: #ffffff; color: #000000; } .content-row { position: relative; width: 100%; display: flex; align-items: flex-start; } .content-row.full-width { max-width: 100%; } @media (max-width: 1199px) { .content-row.responsive { flex-wrap: wrap; align-items: flex-start; align-self: center; padding: 12px; max-width: 800px; } } @media (max-width: 399px) { .content-row.responsive { max-width: 100%; justify-content: center; padding: 0; } } .coloredBox-beige, .coloredBox-beige--small { padding: 20px; border-radius: 4px; background-color: #e5f7ff; border: 1px solid #e1d7c7; } .coloredBox-beige--small { padding: 10px 20px; } .checkmark-container { display: flex; flex-flow: row wrap; justify-content: space-between; width: 100%; } .checkmark-outerWrapper[data-columns="2"] { flex: 1 0 45%; } .checkmark-outerWrapper[data-columns="3"] { flex: 1 0 30%; } .checkmark-outerWrapper[data-columns="4"] { flex: 1 0 23%; } .checkmark-outerWrapper[data-columns="5"] { flex: 1 0 19%; } .checkmark-innerWrapper { display: flex; justify-content: flex-start; align-items: center; position: relative; padding-left: 35px; margin: 6px 0; cursor: pointer; font-size: 16px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .checkmark-innerWrapper input { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .checkmark-innerWrapper img { margin-left: 10px; } body.userIsTabbing .checkmark-innerWrapper input:focus + .checkmark-checkmark { outline: auto 5px #009ce1; outline: auto 5px -webkit-focus-ring-color; } .checkmark-checkmark { position: absolute; top: 0; left: 0; height: 20px; width: 20px; border: 2px solid #333333; border-radius: 2px; } .checkmark-checkmark::after { content: ""; position: absolute; display: none; } .checkmark-innerWrapper input:checked ~ .checkmark-checkmark::after { display: block; } .checkmark-innerWrapper .checkmark-checkmark::after { left: 6px; top: 2px; width: 5px; height: 10px; border: solid #333333; border-width: 0 3px 3px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .flatpickr-calendar { font-family: "Open Sans", sans-serif; text-align: center; padding: 0; direction: ltr; font-size: 16px; line-height: 24px; border-radius: 0; position: absolute; } .flatpickr-day.nextMonthDay:not(.disabled) { color: #808888 !important; } .aside .flatpickr-calendar, .filters-aside-mobile .flatpickr-calendar { box-shadow: none; } @media (max-width: 330px) { .flatpickr-calendar { right: auto !important; left: auto !important; margin: 5px; } } .flatpickr-calendar.inline .flatpickr-rContainer { margin: 0 auto; } @media (max-width: 399px) { .flatpickr-calendar.inline { transform: scale(0.83); transform-origin: 0 0; } } .flatpickr-weekdaycontainer { font-size: 14px; } .flatpickr-weekdaycontainer .flatpickr-weekday { color: #333333; } .flatpickr-months { background-color: #444444; padding: 10px 0; display: flex; align-items: center; } .flatpickr-current-month.flatpickr-current-month { font-family: "Open Sans", sans-serif; font-size: 16px; font-weight: 600; color: #ffffff; } .flatpickr-current-month.flatpickr-current-month .cur-month, .flatpickr-current-month.flatpickr-current-month .cur-year { font-weight: inherit; } .flatpickr-current-month input.cur-year[disabled], input.cur-year { color: #ffffff !important; } .flatpickr-time { display: none !important; } .flatpickr-next-month { position: absolute; margin-top: 7px; border: none; } .flatpickr-prev-month { border: none; margin-top: 7px; width: calc(100% / 7); } .flatpickr-days { display: flex; } .flatpickr-days .flatpickr-day { margin: 0; } .flatpickr-days .flatpickr-day.selected, .flatpickr-days .flatpickr-day.nextMonthDay.selected { background-color: #00205B !important; color: #555555 !important; } .flatpickr-months .flatpickr-prev-month svg, .flatpickr-months .flatpickr-next-month svg { fill: #ffffff; } .dayContainer span { border: 1px solid #d2d2d2 !important; } .dayContainer span:nth-child(n + 8) { border-top: none !important; } .dayContainer span:not(:nth-child(7n)) { border-right: none !important; } .dayContainer .today:not(.selected) { border-bottom-color: #00205B !important; border-bottom-width: 3px !important; } .dayContainer .today:not(.selected):hover:not(.disabled) { background: none; color: #333333; } .radio-container { display: flex; flex-flow: row wrap; justify-content: space-between; } .radio-outerWrapper[data-columns="2"] { flex: 1 0 45%; } .radio-outerWrapper[data-columns="3"] { flex: 1 0 30%; } .radio-outerWrapper[data-columns="4"] { flex: 1 0 23%; } .radio-outerWrapper[data-columns="5"] { flex: 1 0 19%; } .radio-innerWrapper { display: flex; justify-content: flex-start; align-items: center; position: relative; padding-left: 35px; margin: 7px 0; cursor: pointer; font-size: 16px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .radio-innerWrapper input { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .radio-innerWrapper img { margin-left: 10px; } body.userIsTabbing .radio-innerWrapper input:focus + .radio-radio { outline: auto 5px #009ce1; outline: auto 5px -webkit-focus-ring-color; } .radio-radio { position: absolute; top: 0; left: 0; height: 20px; width: 20px; border: 1px solid #333333; border-radius: 50%; } .radio-radio::after { content: ""; position: absolute; display: none; } .radio-innerWrapper input:checked ~ .radio-radio { border: 1px solid #4ec361; } .radio-innerWrapper input:checked ~ .radio-radio::after { display: block; } .radio-innerWrapper .radio-radio::after { width: 12px; height: 12px; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: #4ec361; border-radius: 50%; } .serviceList { display: flex; flex-direction: column; } @media (max-width: 699px) { .serviceList { font-size: 12px; } } .serviceList .serviceList-title { margin-bottom: 30px; } .serviceList > *:not(:last-child) { border-bottom: 1px solid #d2d2d2; padding: 14px 0; } .serviceList .serviceList-item { display: flex; justify-content: space-between; align-items: center; flex-direction: row; } .serviceList .serviceList-item.wrap { flex-wrap: wrap; } .serviceList .serviceList-summaryDescription { display: flex; justify-content: space-between; align-items: flex-end; flex-direction: row; } .serviceList .serviceList-summaryDescription .underline { text-decoration: underline; } @media (max-width: 899px) { .serviceList .serviceList-summaryDescription { width: 100%; } .serviceList .serviceList-summaryDescription > * { margin-bottom: 15px; } } .serviceList .serviceList-price { font-weight: 500; color: #515151; } .serviceList .serviceList-price.discounted { color: #ff3b17; } .serviceList .serviceList-priceOld { /*margin-right: 1em;*/ text-decoration: line-through; color: #999999; } .serviceList .serviceList-summary { padding-top: 20px; } .serviceList .serviceList-summaryDescription { font-size: 14px; color: #999999 !important; } .serviceList .serviceList-summaryBottom, .serviceList .serviceList-summaryTop { display: flex; align-items: flex-end; justify-content: space-between; } @media (max-width: 899px) { .serviceList .serviceList-summaryBottom, .serviceList .serviceList-summaryTop { flex-wrap: wrap; } } .serviceList .serviceList-summaryBottom > *, .serviceList .serviceList-summaryTop > * { max-width: 60%; } @media (max-width: 899px) { .serviceList .serviceList-summaryBottom > *, .serviceList .serviceList-summaryTop > * { width: 100%; max-width: 100%; } } .serviceList .serviceList-summaryTop { font-weight: 500; padding-bottom: 1em; text-align: right; align-items: flex-start; } .serviceList .serviceList-summaryTop .serviceList-listSavedAmount { font-size: 14px; color: #ff3b17; } .serviceList .serviceList-summaryTop .serviceList-listVAT { font-size: 14px; color: #d2d2d2; } .serviceList .serviceList-summaryTop .serviceList-name { color: #555555; } .serviceList .serviceList-totalPriceWrapper { justify-content: flex-start; display: flex; flex-direction: column; text-align: right; } .icon { display: block; background-position: center; background-size: contain; background-repeat: no-repeat; transform-origin: 50% 50%; width: 100%; height: 100%; /* svgs */ } .icon--inline { vertical-align: middle; display: inline-block; width: 1.3em; height: 1.3em; margin-right: 0.25em; transform: translateY(-0.05em); } .icon--xl { width: 1.5em; height: 1.5em; } .icon--xxl { width: 2em; height: 2em; } @media (max-width: 699px) { .icon--xxl { width: 1.5em; height: 1.5em; } } .icon--calendar { background-image: url("../static/calendar.svg"); } .icon--plus-circle { background-image: url("../static/plus-o.svg"); } .icon--calendar { background-image: url("../static/calendar.svg"); } .icon--check-circle { background-image: url("../static/check-o.svg"); } .icon--chevron-down { background-image: url("../static/chevron-down.svg"); } .icon--chevron-left { background-image: url("../static/chevron-left.svg"); } .icon--chevron-right { background-image: url("../static/chevron-right.svg"); } .icon--cross-circle { background-image: url("../static/cross-o.svg"); } .icon--cross { background-image: url("../static/cross.svg"); } .icon--cross-black { background-image: url("../static/cross-black.svg"); } .icon--list { background-image: url("../static/list.svg"); } .icon--direction { background-image: url("../static/direction.svg"); } .icon--location { background-image: url("../static/location-pin.svg"); } .icon--search { background-image: url("../static/search.svg"); } .icon--info { background-image: url("../static/info-circle.svg"); } .label { color: #333333; font-weight: 500; font-size: 12px; margin-right: 0.5em; text-transform: uppercase; } .label--muted { color: #999999; margin-bottom:0px !important; } .label--muted-desc { color: #999999; text-transform: none !important; font-size: 9px; font-weight: normal; } .label--margin { margin-bottom: 2em; } .button { display: block; padding: 12px 35px 12px 35px; border: 1px solid rgba(0, 0, 0, 0); border-radius: 4px; -webkit-font-smoothing: antialiased; font-weight: 600; font-size: 16px; height: 52px; text-align: center; cursor: pointer; /*transition: background-color 0.15s, color 0.15s;*/ } @media (max-width: 899px) { .button { font-size: 14px; } } a .button { font-size: 16px; color: #333333; } @media (max-width: 899px) { a .button { font-size: 14px; } } .deactivated .button, .button.deactivated { background-color: #777777 !important; border-color: #d2d2d2 !important; border: 1px solid #d2d2d2; cursor: auto; } .button svg { fill: #FFFFFF; } .button.deactivated svg { fill: #FFFFFF; } .button.workshop { margin-top: 20px; } a.button { color: #ffffff; display: flex; align-items: center; justify-content: center; } .button--plain { border: none; color: #333333; font-weight: 400; background: none; padding: 0; } .button--yellow { background-color: #3AA5ED; color: #FFFFFF; } .button--green { background-color: #4ec361; color: #333333; } .button--red { background-color: #f44336; color: #333333; } .button--black { background-color: black; color: white; } .button-round, .button-round--add { position: relative; width: 20px; height: 20px; background-color: #bbbbbb; border-radius: 50%; cursor: pointer; } .button-round--add { display: inline-flex; align-items: center; justify-content: center; } .button-round--add::before { content: "+"; display: inline-block; color: #ffffff; font-size: 1.5em; } .button--link { background: none; border: none; padding: none; margin: none; display: inline-block; color: #009ce1; font-size: 16px; } .input { padding: 12px 30px 12px 30px; display: flex; align-items: center; justify-content: center; height: 52px; border: 1px solid #d2d2d2; font-size: 14px; } .recos { margin-top: 2em; display: flex; flex-direction: row; flex-wrap: wrap; } @media (max-width: 699px) { .recos { flex-direction: column; } } .recos .reco { max-width: 50%; font-size: 14px; } .recos .reco + .reco { margin-left: 2em; } @media (max-width: 699px) { .recos .reco { max-width: 100%; } .recos .reco + .reco { margin-top: 2em; margin-left: 0; } } .recos .reco .reco-rating-icon { display: inline-block; transform: translateY(5px); width: 20px; height: 20px; border-radius: 100%; background-color: #00205B; } .recos .reco .reco-total { color: #333333; font-size: 12px; margin-left: 0.5em; } .recos .reco .info { margin: 0.5em 0; } .recos .reco .reco-name { font-weight: 500; } .recos .reco .reco-quote { display: block; margin: 1em 0; } .aside, .filters-aside-mobile { border-radius: 4px; box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1); background-color: #ffffff; padding: 20px 30px; position: sticky; top: 30px; width: 500px; min-width: 368px; height: 100%; max-height: calc(100vh - 60px); margin-right: 30px; overflow-x: hidden; overflow-y: auto; } .single .aside, .single .filters-aside-mobile { display: none; color: blue !important; } @media (max-width: 699px) { .aside, .filters-aside-mobile { padding: 10px 15px; } } @media (max-width: 1199px) { .aside, .filters-aside-mobile { display: none; } } @media (max-width: 699px) { .aside, .filters-aside-mobile { max-height: auto; } } .aside .aside-inner .aside-calendar-input, .filters-aside-mobile .aside-inner .aside-calendar-input { display: none; } .aside .aside-inner .aside-filters .aside-filter, .filters-aside-mobile .aside-inner .aside-filters .aside-filter { display: flex; align-items: center; justify-content: space-between; padding: 8px 0; height: 36px; position: relative; } .aside .aside-inner .aside-filters .aside-filter label, .filters-aside-mobile .aside-inner .aside-filters .aside-filter label { cursor: pointer; text-indent: 1em; display: block; width: 100%; height: 100%; } .aside .aside-inner .aside-filters .aside-filter .label-inner, .filters-aside-mobile .aside-inner .aside-filters .aside-filter .label-inner { position: absolute; left: 0; } .aside .aside-inner .aside-filters .aside-filter .check, .filters-aside-mobile .aside-inner .aside-filters .aside-filter .check { position: absolute; right: 0; } .aside .aside-inner .aside-filters .aside-filter .backdrop, .filters-aside-mobile .aside-inner .aside-filters .aside-filter .backdrop { position: absolute; z-index: 0; top: 0; left: 0; margin-left: -25%; width: 150%; height: 100%; } .aside .aside-inner .aside-filters input[type="radio"], .filters-aside-mobile .aside-inner .aside-filters input[type="radio"], .aside .aside-inner .aside-filters input[type="checkbox"], .filters-aside-mobile .aside-inner .aside-filters input[type="checkbox"] { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .aside .aside-inner .aside-filters input[type="radio"] ~ .check, .filters-aside-mobile .aside-inner .aside-filters input[type="radio"] ~ .check, .aside .aside-inner .aside-filters input[type="checkbox"] ~ .check, .filters-aside-mobile .aside-inner .aside-filters input[type="checkbox"] ~ .check { opacity: 0; } .aside .aside-inner .aside-filters input[type="radio"]:checked ~ .check, .filters-aside-mobile .aside-inner .aside-filters input[type="radio"]:checked ~ .check, .aside .aside-inner .aside-filters input[type="checkbox"]:checked ~ .check, .filters-aside-mobile .aside-inner .aside-filters input[type="checkbox"]:checked ~ .check { opacity: 1; } .aside .aside-inner .aside-filters input[type="radio"]:checked ~ .backdrop, .filters-aside-mobile .aside-inner .aside-filters input[type="radio"]:checked ~ .backdrop, .aside .aside-inner .aside-filters input[type="checkbox"]:checked ~ .backdrop, .filters-aside-mobile .aside-inner .aside-filters input[type="checkbox"]:checked ~ .backdrop { background-color: #fafafa; } .workshops { background: #fafafa; display: flex; flex-direction: column; justify-content: center; /*align-items: center;*/ z-index: 1000; width: 100%; /*transition: transform 0.5s;*/ } .workshops > * + * { margin-top: 10px; } @media (max-width: 699px) { .workshops > * + * { margin-top: 25px; } } .workshops.is-search-result { transform: translateY(-200px); } .divider { width: 100%; height: 1px; background-color: #d2d2d2; } .divider.divider--vertical { height: 1.5em; width: 1px; margin: 0 30px; } .workshop-filters, .workshop-filters-mobile { padding: 6px 0; position: relative; display: flex; align-items: center; flex-direction: row; flex-wrap: nowrap; } .single .workshop-filters, .single .workshop-filters-mobile { display: none; } .workshop-filters .filter-term, .workshop-filters-mobile .filter-term { position: relative; } .workshop-filters .filter-term:first-of-type, .workshop-filters-mobile .filter-term:first-of-type { margin-right: 8px; } .workshop-filters .filter-term:not(:first-of-type), .workshop-filters-mobile .filter-term:not(:first-of-type) { margin: 0 8px; } @media (max-width: 699px) { .workshop-filters .filter-term:not(:first-of-type), .workshop-filters-mobile .filter-term:not(:first-of-type) { margin: 0 5px; } } .workshop-filters .sort-by-text, .workshop-filters-mobile .sort-by-text { font-weight: 500; } @media (max-width: 899px) { .workshop-filters, .workshop-filters-mobile { padding: 0; } } .filter-terms-mobile { padding: 0 10px; } .workshop-filters-movable { display: flex; flex-direction: row; flex-wrap: wrap; } .workshop-filters-mobile { flex-direction: column; border-top: 1px solid #d2d2d2; border-bottom: 1px solid #d2d2d2; margin-bottom: 10px; } .workshop-filters-mobile > * { width: 100%; } .workshop-filters-mobile .filter-term { margin: 0 !important; margin-right: 15px !important; } .workshop-filters-mobile .sort-by-text { padding-bottom: 11px; width: 100%; } .filters-aside-mobile { min-width: auto; margin-right: 0; margin-top: 30px; width: 100%; } @media (max-width: 899px) { .filters-aside-mobile { display: block; } } .workshop-map-big { width: 100%; height: 400px; max-height: 0; /*transition: max-height 0.5s;*/ } .workshop-map-big.loading { visibility: hidden; } .workshop-map-big.open { max-height: 400px; } .workshop-search { border-radius: 4px; box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1); background-color: #ffffff; } .workshop-search input { border: none; } .single .workshop-search { display: none; } .workshop { width: 800px; display: block; position: relative; border-radius: 4px; box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1); background-color: #ffffff; /* transition: background-color 0.15s, color 0.15s;*/ } @media (max-width: 899px) { .workshop { width: 100%; } } .deactivated .workshop, .workshop.deactivated { background-color: transparent !important; border-color: #d2d2d2 !important; opacity: 0.2; background-color: #fafafa !important; } .deactivated .workshop > *, .workshop.deactivated > * { pointer-events: none; } .workshop .workshop-heading-wrapper { display: flex; justify-content: space-between; } .workshop .workshop-heading { line-height: 150%; font-size: 18px; font-weight: 500; margin-bottom: 18px; color: #333333; } .workshop .workshop-heading .garageAlias { line-height: 150%; font-size: 14px; font-weight: 500; margin-bottom: 18px; color: #666666; } .workshop .workshop-inner { min-height: 185px; } .workshop .workshop-inner:not(.no-flex) { display: flex; flex-direction: row; } @media (max-width: 699px) { .workshop .workshop-inner:not(.no-flex) { flex-direction: column; width: 100%; } } .workshop .workshop-inner > * { padding: 20px 30px; } @media (max-width: 699px) { .workshop .workshop-inner > * { padding: 15px; } } .workshop .label { display: block; margin-bottom: 12px; } .workshop .close-expanded { cursor: pointer; display: none; position: absolute; color: #333333; top: 0px; right: 0px; width: 30px; height: 30px; line-height: 30px; text-align: center; } .workshop .close-expanded:hover { opacity: 0.75; } .workshop .close-expanded path, .workshop .close-expanded .workshop-close-icon { width: 8px; height: 8px; position: relative; fill: currentColor; stroke: currentColor; path: currentColor; } .workshop .workshop-info { display: flex; flex-direction: column; justify-content: space-between; width: 100%; } @media (max-width: 699px) { .workshop .workshop-info { border-bottom: 1px solid #d2d2d2; margin-bottom: 10px; } } .workshop .workshop-tagOverflow { white-space: nowrap; } .workshop .workshop-readMore { display: block; font-size: 14px; } @media (max-width: 899px) { .workshop .workshop-readMore { padding-top: 20px; } } .workshop .workshop-suggestion { overflow: hidden; border-left: 1px solid #d2d2d2; width: 500px; } @media (max-width: 699px) { .workshop .workshop-suggestion { overflow: hidden; /*transition: max-height 0.5s, opacity 0.5s;*/ width: 100%; border: 0; padding-top: 0; margin: 0; } } .workshop .workshop-suggestion .button { margin-top: 15px; } .workshop .workshop-suggestion > * { width: 100%; } @media (max-width: 699px) { .workshop .workshop-suggestion-mobile { padding: 15px; padding-top: 0; } } .workshop .workshop-tags { font-size: 12px; } @media (max-width: 699px) { .workshop .workshop-distanceTo { font-size: 12px; } } .workshop .workshop-distanceTo--mobile { margin-top: 10px; } .workshop .workshop-expanded { display: none; width: 100%; transform: rotateZ(0.001deg); padding: 20px 30px; border-top: 1px solid transparent; position: relative; } @media (max-width: 699px) { .workshop .workshop-expanded { padding: 20px 20px; } } .workshop .workshop-expanded::after { content: ""; /*transition: background-color 0.5s;*/ background-color: transparent; position: absolute; left: 30px; top: 0; width: calc(100% - 60px); height: 1px; color: #555555; } @media (max-width: 699px) { .workshop .workshop-expanded::after { height: 0; } } .workshop .workshop-expanded h3 { margin-bottom: 10px; } .workshop .workshop-expanded > * { margin-bottom: 30px; } .workshop .workshop-expanded .workshop-calendar-input { width: 280px; cursor: pointer !important; } @media (max-width: 699px) { .workshop .workshop-expanded .workshop-calendar-input { font-size: 16px; width: 100%; cursor: pointer !important; } } @media (max-width: 699px) { .workshop.selected .workshop-suggestion { opacity: 0; max-height: 0; } } .workshop.selected .close-expanded { display: block; } .workshop.selected ::after { background-color: #d2d2d2; } .workshop.selected .workshop-readMore { display: none; } .workshop .workshop-google-map { width: 350px; height: 200px; } @media (max-width: 899px) { .workshop .workshop-google-map { width: 100%; } } @media (max-width: 899px) { .workshop .flatpickr-input { width: 100%; } } .workshop .workshop-calendar-input { font-size: 14px; position: relative; display: block; padding-left: 40px; padding-right: 0.5em; background-position: 16px center; background-size: 19px; background-repeat: no-repeat; background-image: url("../static/calendar.svg"); font-weight:bold; cursor: pointer; } .workshop .workshop-calendar-input:hover { color: #009ce1; } @media (max-width: 699px) { .workshop .workshop-calendar-input { font-size: 16px; } } .workshop .workshop-contact { padding-top: 20px; display: flex; flex-direction: row; justify-content: space-between; } @media (max-width: 899px) { .workshop .workshop-contact { flex-direction: column-reverse; } } .workshop .workshop-contact span { display: block; color: #555555; } .workshop .workshop-contact .workshop-contactInfo { display: flex; flex-direction: column; } @media (max-width: 899px) { .workshop .workshop-contact .workshop-contactInfo { margin-top: 10px; } } .workshop .workshop-contact .workshop-contactInfo > * + * { margin-top: 10px; } .workshop-offers { columns: 2; } @media (max-width: 699px) { .workshop-offers { columns: 1; } } .tag { display: inline-block; line-height: 2em; padding: 0.25em 1em; text-transform: uppercase; font-weight: 500; color: #fff; border-radius: 1000px; /*transition: background-color 0.15s, color 0.15s;*/ white-space: nowrap; } .deactivated .tag, .tag.deactivated { background-color: transparent !important; border-color: #d2d2d2 !important; background-color: #d2d2d2 !important; } .tag--yellow { color: #FFFFFF; font-weight: 500; padding: 0 0.6em; line-height: 2; margin-top: -2px; height: 16px; font-size: 9px; background-color: #00205B; } @media (max-width: 399px) { .tag--yellow { font-size: 8px; line-height: 2.2; } } .tag--green { display: inline; background-color: #00205B; padding: 0.25em 1em; line-height: 2em; } .service-content { margin-bottom: 30px; display: flex; flex-flow: row wrap; display: grid; grid-template-columns: repeat(auto-fit, minmax(360px, 1fr)); grid-auto-rows: max-content; grid-auto-flow: dense; grid-gap: 20px; } .service-content > .service-wrapper { flex: 1 0 30%; margin: 0 15px; } @supports (display: grid) { .service-content > .service-wrapper { margin: 0; } } @media (max-width: 699px) { .service-content { flex-direction: column; align-items: center; } @supports (display: grid) { .service-content { align-items: flex-start; } } .service-content > .service-wrapper { flex: none; margin: 0; } } @media (max-width: 399px) { .service-content { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); } } .service-wrapper { display: flex; flex-direction: column; min-width: 0; width: 100%; grid-auto-rows: min-content max-content auto; } .service-wrapper.js-more-than-3-services { max-width: 350px; } @supports (display: grid) { .service-wrapper.js-more-than-3-services { max-width: initial; } } .service-wrapper.js-only-1-service { margin-left: auto; margin-right: auto; max-width: 600px; } .service-wrapper .service-wrapper--content:last-child { border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } @media (max-width: 1199px) { .service-wrapper { margin-bottom: 15px; } } @media (max-width: 699px) { .service-wrapper, .service-wrapper.js-more-than-3-services { max-width: 600px; } } @media (max-width: 399px) { .service-wrapper { margin-bottom: 30px; } /* new */ #SelectServiceContainer .closed .service-wrapper--content { display: none; } #SelectServiceContainer .closed .selected { display:block !important; } } .service-workshopSelected.content-header { padding-top: 40px; letter-spacing: 0; } .service-header--selectedWorkshop { font-size: 12px; margin-left: 30px; margin-top: 0; } /*service-wrapper--header */ @media (max-width: 899px) { .service-header--selectedWorkshop { margin: 0; } } .service-wrapper--header { height: 75px; width: 100%; display: flex; align-items: center; justify-content: center; text-align: center; background-color: #00205B; font-family: "Open Sans", sans-serif; font-size: 12px; padding: 0 16px; -webkit-font-smoothing: antialiased; border-top-left-radius: 4px; border-top-right-radius: 4px; } .service-wrapper--header h1 { color: #FFFFFF; font-weight: 400; } @media (max-width: 399px) { .service-wrapper--header { font-size: 12px; height: 160px; } } .service-wrapper--content { border: 1px solid #d2d2d2; margin-top: -1px; background-color: #fff; } .service-wrapper--content.selected { z-index: 10; border: 1px solid #00205B; background-color: #fafafa; } .service-wrapper--content:hover { cursor: pointer; background-color: #fafafa; } .service-single { padding: 15px 13px 8px 13px; color: #555555; } @media (max-width: 699px) { .service-single { padding: 15px; padding-bottom: 14px; } } .service-single--type { display: flex; align-items: center; font-size: 16px; margin-bottom: -3px; } .service-single--type span:first-child { margin-left: 2px; } .service-single--type .tag { margin-left: 10px; } @media (max-width: 1199px) { .service-single--type > * + * { margin-left: 4px; } } .service-single--type button:focus { outline: auto 5px #009ce1; outline: auto 5px -webkit-focus-ring-color; } .service-single--select { display: inline-flex; align-items: center; margin-left: auto; } .service-single--select img { margin-left: 5px; } /*.service-single--select::before { content: "V\E4lj"; color: #bbbbbb; font-size: 12px; } .service-wrapper--content.selected .service-single--select::before { content: "Vald"; color: #4ec361; font-size: 12px; }*/ .service-single--select span.button-add-text { font-size: 12px; color: #bbbbbb; } .service-single--select span.button-added-text { font-size: 12px; color: #00205B; display:none; } .service-wrapper--content.selected .service-single--select span.button-add-text { display:none; } .service-wrapper--content.selected .service-single--select span.button-added-text { display: inline-block; } .service-single--selectText { color: #bbbbbb; } .service-single--button { margin-left: 5px; border: none; /*background: center/contain no-repeat url("../static/plus-o-grey.svg");*/ background: center/contain no-repeat url("data:image/svg+xml,%3Csvg viewBox='0 0 48 48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m.04 24.04a24 24 0 1 0 0-.08zm26-12v10h10v4h-10v10h-4v-10h-10v-4h10v-10z' fill='%23bbb'/%3E%3C/svg%3E"); } .service-wrapper--content.selected .service-single--button { /*background: center/contain no-repeat url("../static/check-o.svg");*/ background: center/contain no-repeat url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m10 0a10 10 0 1 0 7.07 2.93 10 10 0 0 0 -7.07-2.93z' fill='%2300205b'/%3E%3Cpath d='m8.38 14.69-4.11-4.35 1.46-1.37 2.64 2.8 6.07-6.45 1.45 1.36z' fill='%23fff'/%3E%3C/svg%3E"); } .service-single--button--black { /*background: center/contain no-repeat url("../static/plus-o.svg");*/ background: center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath d='M.04 24.04a24 24 0 1 0 0-.08zm26-12v10h10v4h-10v10h-4v-10h-10v-4h10v-10z'/%3E%3C/svg%3E"); } .service-single--description { padding-top: 4px; padding-left:2px; display: flex; flex-direction: column; align-items: flex-start; /*transition: max-height 0.2s ease-out;*/ overflow: hidden; position: relative; height:0px; } .service-single--descriptionTextWrapper { margin-bottom: 6px; width: 230px; } @media (max-width: 1199px) { .service-single--descriptionTextWrapper { width: 100%; } } @media (max-width: 399px) { .service-single--descriptionTextWrapper { display: flex; margin-bottom: 0; } } .service-single--descriptionText { font-size: 13px; position: relative; font-style: italic; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin-bottom: -5px; } .service-single--readMore { width: 100%; height: 100%; position: relative; font-size: 14px; } .service-single--readMore span.less { display: none; } .service-single--description.expanded + .service-single--readMore span.more { display: none; } .service-single--description.expanded + .service-single--readMore span.less { display: inline; } /*.service-single--readMore::before { content: "L\E4s mer"; display: inline-block; position: absolute; bottom: -0.5em; left: 0; color: #009ce1; cursor: pointer; }*/ /*.service-single--description.expanded + .service-single--readMore::before { content: "L\E4s mindre"; }*/ .service-single--readMore::before:hover { color: #15b7ff; } @media (max-width: 699px) { .service-single--readMore { font-size: 14px; } } @media (max-width: 399px) { .service-single--readMore { bottom: -0.6em; } } .service-footer-wrapper { z-index: 2000; display: flex; justify-content: center; background: #fafafa; border-top: 1px solid #d2d2d2; padding-top: 0; position: fixed; width: 100%; bottom: 0; left: 0; transform: translateY(100%); /*transition: transform 0.25s ease-out;*/ } .service-footer-wrapper.showing { transform: translateY(0); /*transition: transform 0.25s ease-in;*/ } .service-footer { max-width: 1200px; width: 100%; display: flex; justify-content: flex-start; align-items: center; padding: 15px; } @media (max-width: 699px) { .service-footer { border: none; margin-top: 0; padding: 5px 10px; } } .service-footer--button { margin-left: auto; } .service-selectionSummary { position: relative; } @media (max-width: 699px) { .service-selectionSummary { font-size: 12px; } } @media (max-width: 699px) { .service-selectionSummary--selections { max-width: 100% !important; } } .service-selectionSummary--caption { font-weight: 500; } @media (max-width: 899px) { .service-selectionSummary--caption { display: block; } } .service-selectionSummary--selections { font-style: italic; position: relative; } @media (max-width: 899px) { .service-selectionSummary--selections { white-space: nowrap; display: inline-block; max-width: 200px; } .service-selectionSummary--selections::after { display: block; } } @media (max-width: 399px) { .service-selectionSummary--selections { max-width: 100px; white-space: normal; } } .progressbar-container { display: flex; flex-direction: column; align-items: center; width: 100%; } .progressbar-container > * { padding-bottom: 10px; } @media (max-width: 899px) { .progressbar-container { padding-bottom: 0; } } @media (max-width: 750px) { .progressbar-container { width: 100%; padding: 15px; padding-bottom: 0; } } .progressbar-bar--wrapper { display: flex; width: 100%; margin-top: -5px; } .progressbar-bar--wrapper .progressbar-bar--section:first-child .progressbar-halfBar:first-child { border-top-left-radius: 1.5px; border-bottom-left-radius: 1.5px; } .progressbar-bar--wrapper .progressbar-bar--section:last-child .progressbar-halfBar:last-child { border-top-right-radius: 1.5px; border-bottom-right-radius: 1.5px; } .progressbar-bar--section { display: flex; flex-direction: column; align-items: center; width: 100%; } .progressbar-bar--section.current ~ .progressbar-bar--section .progressbar-halfBar, .progressbar-bar--section.current ~ .progressbar-bar--section .progressbar-point, .progressbar-bar--section.current .progressbar-halfBar:last-child { background-color: #f0f0f0; cursor: auto; } .progressbar-bar--section.current .progressbar-description, .progressbar-bar--section.current ~ .progressbar-bar--section .progressbar-description { font-size: 18px; } .progressbar-bar { display: flex; align-items: center; width: 100%; } .progressbar-caption { color: #333333; font-size: 18px; font-weight: 500; } @media (max-width: 750px) { .progressbar-caption { display: none; } } .progressbar-halfBar { height: 3px; border-radius: 0; background-color: #00205B; width: 100%; } .finished .progressbar-halfBar { background-color: #00205B; } .progressbar-point { color: inherit; text-decoration: inherit; min-width: 25px; width: 25px; height: 25px; border: solid 3px #fafafa; background-color: #00205B; border-radius: 50%; cursor: pointer; } .finished .progressbar-point { background-color: #00205B; cursor: auto; } .current .progressbar-point { cursor: auto; } @media (max-width: 750px) { .progressbar-point { min-width: 31px; width: 31px; height: 31px; } } .progressbar-description { color: #333333; font-weight: 500; margin-top: 8px; font-size: 14px; white-space: nowrap; } @media (max-width: 750px) { .progressbar-description { display: none; } } .progressbar-description--selectedServices { font-size: 12px; text-align: center; } @media (max-width: 750px) { .progressbar-description--selectedServices { display: none; } } .roundDeleteButton { width: 20px; height: 20px; background: #d2d2d2; border: none; cursor: pointer; border-radius: 50%; background-image: url("../static/cross.svg"); background-size: 8px 8px; background-repeat: no-repeat; background-position: center; } .roundDeleteButton-red { width: 20px; height: 20px; background: red; border: none; cursor: pointer; border-radius: 50%; background-image: url("../static/cross-white.svg"); background-size: 8px 8px; background-repeat: no-repeat; background-position: center; } .modal { display: none; font-family: "Open Sans", sans-serif; } .modal .modal-backdrop { padding: 30px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 20000; background: rgba(51, 51, 51, 0.4); } .modal .modal-inner { box-sizing: border-box; border-radius: 4px; box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1); background-color: #ffffff; padding: 20px 30px; position: absolute; top: 40px; left: 50%; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); z-index: 20001; width: 100%; max-width: 800px; padding: 30px; } @media (max-width: 699px) { .modal .modal-inner { padding: 10px 15px; /*top: 5%; -webkit-transform: translate(-50%, -5%); transform: translate(-50%, -5%);*/ } } @media (max-width: 899px) { .modal .modal-inner { max-width: calc(100% - 30px); } } .modal .modal-header { display: -webkit-box; display: flex; width: 100%; -webkit-box-pack: end; justify-content: flex-end; } .modal .modal-closeButton { border: none; position: absolute; width: 12px; height: 12px; top: 15px; right: 15px; cursor: pointer; } .modal .modal-content { } .modal .modal-content h3 { font-size: 18px; color: #333; } .modal .modal-content p { color: #333; line-height: 1.5; } .hide { display: none; } .close-btn { float: right; padding: 2px; border-radius: 50%; height: 22px; width: 22px; text-align: center; padding-top: 0px; font-size: 14px; color: #fff; background: red; cursor: pointer; } .category-ignore[disabled] { opacity: 0.5; pointer-events: none; } .button--brown { background-color: #58595B; color: #00205B; } .service-option--button { margin-left: auto; } .tag--common { font-weight: 500; padding: 0 0.6em; line-height: 2; margin-top: -2px; height: 16px; font-size: 9px; } .serviceBreakdownDetails { width: 100%; padding-bottom: 6px; display: flex; justify-content: space-between; } .serviceBreakdownDetails .bookingDetails-priceInfo { margin-right: 35px; } .serviceBreakdownDetails .bookingDetails-regularPrice { font-weight: 400 !important; } .additionals { margin-top: 20px; color: #74A333; margin-bottom: 10px; } .breakDownWrapper { margin-left: 15px; margin-bottom: 15px; } .breakDownWrapper > p { font-weight: 500; } .service-breakdown-readMore { display: flex; flex-direction: row; align-items: center; margin-bottom: 15px; } .service-breakdown-readMore span.less { display: none; } .js-breakdown-slideDown.expanded + .service-breakdown-readMore span.less { display: inline; margin-top: -5px; } .js-breakdown-slideDown.expanded + .service-breakdown-readMore span.more { display: none; } .show-flex { display: flex; } .hide { display: none; } .rotate-180 { transform: rotate(180deg); } .arrow-head { width: 20px; position: relative; top: 0; margin-right: 8px; } .timeSlotInfo-button { border-radius: 4px; box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1); background-color: #ffffff; padding: 20px 30px; -webkit-appeareance: none; overflow: hidden; padding: 12px 55px; font-size: 16px !important; font-weight: 500; font-family: "Open Sans", sans-serif !important; background-color: white; border: 4px solid white; line-height: 1em; position: relative; } @media (max-width: 699px) { .timeSlotInfo-button { padding: 10px 15px; } } @media (max-width: 899px) { .timeSlotInfo-button { width: 100%; margin-bottom: 15px; } } .timeSlotInfo-button .icon { display: inline-block; vertical-align: middle; -webkit-transform: translateY(-2px); transform: translateY(-2px); height: 20px; width: 20px; margin-right: 8px; -webkit-box-flex: 0; flex-grow: 0; } .timeSlotInfo-button::after { content: ""; position: absolute; height: 32px; width: 32px; top: 0%; left: 100%; background-color: #808285; -webkit-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); } .timeSlotInfo-button:hover { cursor: pointer; border-color: #00205B; background-color: #00205B; color: #ffffff; } .timeSlotInfo-button:hover .icon--info { background-image: url("../static/info-circle-white.svg"); } .timeSlotInfo-button:hover::after { background-color: white; } .time-slot-triangle { border-left: 32px solid transparent; border-right: 32px solid #808285; border-bottom: 32px solid transparent; position: absolute; right: 0px; top: 0px; } .tire-option-error { border: 1px solid; border-color: #bd3e3e !important; padding: 5px; border-radius: 2px; margin: 10px; } .js-plateNotFound { border-radius: 5px; margin: 5px 0px; padding: 15px; background-color: #3AA5ED; color: black; } .js-notFleetVehicle { border-radius: 5px; margin: 5px 0px; padding: 15px; background-color: #3AA5ED; color: black; } .brakeChange-wrapper { position: relative; margin-top: 54px; color: #333333; } .brakeChange-wrapper::before { content: ""; position: absolute; top: -25px; left: 0; height: 1px; width: 100%; background-color: #d2d2d2; } @media (max-width: 430px) { .brakeChange-wrapper { font-size: 14px; } .brakeChange-wrapper .checkmark-container { display: block; margin: 0 auto; } } .brakeChange-heading { font-size: 18px; margin-bottom: 9px; } .brakeChange-paragraph { margin-bottom: 20px; line-height: 1.4; } .fetchedCarModel-wrapper { margin-top: 30px; } .fetchedCarModel-modelData { letter-spacing: 0; } .fetchedCarModel-mileageWrapper { margin-top: 25px; } .fetchedCarModel-heading { color: #333333; font-size: 12px; margin-top: 25px; margin-bottom: 12px; } .fetchedCarModel-heading:not(span) { font-size: 12px; font-weight: 500; text-transform: uppercase; } .fetchedCarModel-heading span { text-transform: lowercase; font-size: 12px; font-weight: 300; } .fetchedCarModel-input { width: 95%; height: 51px; border: 1px solid #d2d2d2; border-radius: 4px; font-size: 14px; margin-top: -2px; padding: 0 15px; } .regNumber-information--wrapper { width: 100%; margin-bottom: 30px; } .regNumber-information--heading { margin-bottom: 10px; font-size: 18px; } .regNumber-information--text { font-size: 16px; letter-spacing: 0; line-height: 1.3; } .regnumber-input--heading { color: #333333; font-size: 12px; text-transform: uppercase; } .regnumber-input--heading:not(:first-child) { font-weight: 500; } .regnumber-input--heading span { font-size: 12px; font-weight: 300; text-transform: lowercase; } .regnumber-input--innerWrapper { position: relative; display: flex; flex-flow: row nowrap; width: 100%; height: 80px; margin-top: 12px; font-size: 30px; } .regnumber-input--innerWrapper input { border-top-left-radius: 4px; border-bottom-left-radius: 4px; } @media (max-width: 430px) { .regnumber-input--innerWrapper { height: 70px; } .regnumber-input--innerWrapper::before { top: 15px; } .regnumber-input--innerWrapper::after { bottom: 5px; } } .regNumber-countryCode-wrapper { background-color: #4a90e2; position: absolute; padding-top: 5px; left: 0; top: 0; height: 100%; width: 50px; display: flex; flex-direction: column; align-items: center; justify-content: center; border-top-left-radius: 4px; border-bottom-left-radius: 4px; } .regNumber-countryCode-wrapper:hover { background-color: #009ce1; cursor: pointer; } .regNumber-countryCode-wrapper .regNumber-countryCode--code { bottom: 14px; font-size: 22px; color: white; font-weight: 500; transition: 0.3s ease; } .regNumber-countryCode--ring { width: 50%; height: 40%; text-align: center; } .regNumber-countryCode--ring span { width: 100%; object-fit: contain; height: 100%; display: block; } .regNumber-countryCodeDropdown--wrapper { font-size: 16px; display: none; padding-top: 10px; position: absolute; top: 100%; left: 0; } .is-expanded .regNumber-countryCodeDropdown--wrapper { display: block; } .regNumber-countryCodeDropdown { min-width: 290px; border: 1px solid #d2d2d2; border-radius: 4px; box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1); background-color: #ffffff; padding: 15px 20px; } .regNumber-countryCodeDropdown h3 { font-size: 12px; text-transform: uppercase; } .regNumber-input--innerWrapper { position: relative; display: flex; flex-flow: row nowrap; width: 100%; height: 80px; margin-top: 12px; font-size: 30px; } .regNumber-input--innerWrapper input { border-top-left-radius: 4px; border-bottom-left-radius: 4px; } .regNumber-input--innerWrapper:focus { top: 9; width: 12px; height: 12px; } @media (max-width: 430px) { .regNumber-input--innerWrapper { height: 70px; } .regNumber-input--innerWrapper::before { top: 15px; } .regNumber-input--innerWrapper::after { bottom: 5px; } } .regNumber-input--input { -webkit-appearance: none; margin-right: 1px; border: 1px solid #d2d2d2; border-right: none; height: inherit; width: 100%; min-width: 0%; font-size: 30px; font-weight: 500; text-transform: uppercase; text-align: center; padding: 0 10px 0 50px; } .regNumber-input--input::placeholder { color: #d2d2d2; } .regNumber-input--button { line-height: 0 !important; width: 80px; height: 80px; border-top-left-radius: 0; border-bottom-left-radius: 0; } @media (max-width: 430px) { .regNumber-input--button { height: 70px; } } .yourCar-wrapper { display: flex; flex-direction: column; width: 100%; } @media (max-width: 699px) { .yourCar-wrapper { padding: 15px 8px; } } .yourCar-footer { width: 100%; display: flex; margin-top: 30px; } .yourCar-button { margin-left: auto; } .yourCar-button.deactivated { color: #999999; } .yourCar-dropdown { height: 100%; display: none; } .cart-describeInput { margin-top: 0px; } .cart-describeInput > * + * { margin-top: 10px; } .cart-describeInput textarea { width: 100%; height: 104px; padding: 15px; resize: none; border-radius: 4px; } .cart-describeInput textarea::placeholder { color: #999999; font-style: italic; } @media (max-width: 399px) { .cart-describeInput { font-size: 16px; } .cart-describeInput textarea { margin: 25px 0; } } .cart-describeTitle { font-weight: 500; font-size: 18px; } .cart-attachImageButton { background: none; border: none; cursor: pointer; font: inherit; display: flex; } .cart-attachImageButton img { width: 20px; height: 20px; margin-right: 10px; } @media (max-width: 699px) { .cart-userDetails { font-size: 14px; } } .cart-formContainer { display: flex; justify-content: space-between; margin-top: 20px; padding-bottom: 20px; border-bottom: 1px solid #d2d2d2; } .cart-formContainer > div { width: 48%; } .cart-formContainer > div input { width: 100%; margin-top: 10px; border-radius: 4px; padding: 12px 20px 12px 20px; } @media (max-width: 1199px) { .cart-formContainer > div input { font-size: 16px; } } .cart-formContainer > div label { font-size: 12px; font-weight: 500; } .cart-formContainer > div > div * + * { margin-bottom: 25px; } @media (max-width: 899px) { .cart-formContainer > div > div * + * { margin-bottom: 10px; } } @media (max-width: 699px) { .cart-formContainer { display: block; } .cart-formContainer div { width: 100%; } } .cart-continueButton { margin-top: 20px; margin-left: auto; width: 170px; } .cart-radioBoldText { min-width: 260px; } .uploaded-image-remove { color: #e20d0d; cursor: pointer; margin-left: 2px; opacity: 0.8; } .uploaded-image-remove:hover { opacity: 1; } .alert-success { color: #3c763d; background-color: #dff0d8; border-color: #d6e9c6; } .alert-danger { color: #a94442; background-color: #f2dede; border-color: #ebccd1; } .alert-warning { color: #8a6d3b; background-color: #fcf8e3; border-color: #faebcc; } .alert { padding: 15px; margin-bottom: 20px; border: 1px solid transparent; border-radius: 4px; } .receipt-button { display: flex; justify-content: center; align-items: center; width: 100%; margin-top: 30px; white-space: nowrap; } .receipt-button button { width: 180px; padding: 0; font-size: 14px; text-align: center; } .receipt-thanks { font-size: 16px; } .receipt-thanks > * { margin: 10px 0; } .receipt-thanks h3 { margin-top: 20px; } .serviceList-item.receipt-serviceListItem { align-items: stretch; } .serviceList-item.receipt-serviceListItem h3 { margin-bottom: 1em; } .serviceList-item.receipt-serviceListItem .workshop-contactInfo div:nth-child(3) { margin-top: 1em; } @media (max-width: 1199px) { .serviceList-item.receipt-serviceListItem { flex-direction: column; justify-content: center; font-size: 14px; } } .receipt-calendarLink { margin-top: 12px; margin-bottom: 27px; color: #009ce1; } .receipt-calendarLink img { position: relative; margin-right: 0; width: 18px; height: 18px; } .receipt-calendarLink a { display: flex; font-size: 15px; } .receipt-calendarIcon { width: 20px; height: 20px; position: relative; top: 0; margin-right: 8px; } .receipt-calendarIcon path { fill: currentColor; } .receipt-googleMap.workshop-google-map { width: 350px; } @media (max-width: 1199px) { .receipt-googleMap.workshop-google-map { margin-top: 20px; width: 100%; } } .receipt-summary { margin-top: 15px; } .receipt-summary .serviceList-title { margin-bottom: 10px; } .receipt-summary .serviceList { /*line-height: 3.15;*/ } .receipt-summary .serviceList-summary { padding-top: 15px; line-height: 1.3; } .receipt-summary .serviceList-summary .serviceList-totalPrice { margin: 0; margin-bottom: 7px; } @media (max-width: 699px) { .receipt-summary .serviceList-summary .serviceList-totalPrice { font-size: 16px; } } .receipt-summary .serviceList-summary .serviceList-price { font-size: 14px; } .receipt-summary .serviceList-summary .serviceList-price.discounted, .receipt-summary .serviceList-summary .serviceList-price.VAT { font-weight: 300 !important; } .receipt-summary .serviceList-summary .serviceList-price.discounted span, .receipt-summary .serviceList-summary .serviceList-price.VAT span { font-weight: 500; } @media (max-width: 1199px) { .receipt-summary .serviceList-summary .serviceList-totalLabel, .receipt-summary .serviceList-summary .serviceList-totalPriceWrapper { width: auto; max-width: auto; } } .receipt-summary .serviceList-priceOld { /*margin-right: 8px;*/ } .receipt-serviceList .serviceList-item { padding: 0; margin-top: 0px; } .receipt-serviceListItem.serviceList-item { padding: 17px 0; } .receipt-serviceListItem .workshop-contactInfo h3 { margin-top: 5px; font-size: 18px; } .receipt-serviceListItem .workshop-contactInfo .workshop-contactAdress { margin-top: -5px; } .receipt-serviceListItem .workshop-contactInfo .workshop-contactDetails { padding-top: 10px; } .receipt-summaryBottom.serviceList-summaryBottom > * { max-width: 450px; } .receipt-summaryBottom.serviceList-summaryBottom > .serviceList-summaryDescription { position: relative; top: -35px; } @media (max-width: 699px) { .receipt-summaryBottom.serviceList-summaryBottom > .serviceList-summaryDescription { top: 0; } } .serviceList-item.service-item { margin-bottom: 10px; }