:root{color-scheme:light;--color-baltic-blue:#2f5d82;--color-deep-space-blue:#1b3346;--color-alice-blue:#f0f8ff;--color-baby-blue:#89c9eb;--color-bright-snow:#fafafa;--color-fresh-sky:#5fb7e5;--color-dust-grey:#d5d5d5;--color-charcoal:#555;--color-onyx:#111;--color-main:var(--color-baltic-blue);--color-base:var(--color-bright-snow);--color-highlight:var(--color-fresh-sky);--color-background:var(--color-base);--color-text:var(--color-onyx);--color-lighter-text:var(--color-charcoal);--color-chart-grid:var(--color-dust-grey);--color-success:#00ddb5;--color-warn:#ffc410;--color-error:#9d340b;--color-fuel-sc95:#00cb67;--color-fuel-sc95plus:#008e48;--color-fuel-sc98:#9fe841;--color-fuel-sc98plus:#82b639;--color-fuel-diesel:#777;--color-fuel-dieselplus:#d19729;--color-fuel-gpl:#00a3d9}[data-theme=dark]{color-scheme:dark;--color-base:var(--color-deep-space-blue);--color-text:var(--color-alice-blue);--color-lighter-text:var(--color-dust-grey);--color-main:var(--color-baby-blue);--color-chart-grid:var(--color-baltic-blue)}:root{--font-stack:Inter,sans-serif;--font-stack-titles:"Hanken Grotesk",sans-serif;--font-stack-prices:Segment7,monospace;--font-root-size:16px;--font-weight-normal:300;--font-weight-bold:500;--grid-max-width:1200px;--grid-padding:10px;--grid-gap:30px;--section-spacer:100px;--border-radius:20px;--header-height:70px;--anim-slow:.7s ease-in-out;--anim-normal:.4s ease-in-out;--anim-fast:.2s ease-in-out;--anim-inputs:.15s ease-in}*,:after,:before,html{box-sizing:border-box}blockquote,body,button,div,fieldset,figcaption,figure,form,h1,h2,h3,html,input,legend,li,p,table,td,textarea,th,ul{border:0;margin:0;padding:0}fieldset,img{border:0}address,caption,cite,code{font-style:normal;font-weight:400}ul{list-style:none}h1,h2,h3{font-size:100%;font-weight:400}button,input,select,textarea{font-family:inherit;font-size:inherit;font-weight:inherit}input,select,textarea{font-size:100%;outline:none}button{cursor:pointer}td,th,thead{font-weight:400}html{font-size:var(--font-root-size);height:100%;scroll-behavior:smooth}body{background:var(--color-background);color:var(--color-text);font:var(--font-root-size) var(--font-stack);font-weight:var(--font-weight-normal)}main{padding-top:calc(var(--header-height) + 20px)}strong{font-weight:var(--font-weight-bold)}a{color:var(--color-main);&:active,&:hover{color:var(--color-highlight)}}@font-face{font-display:swap;font-family:Hanken Grotesk;font-style:italic;font-weight:900;src:url(../fonts/hanken-grotesk-v12-latin-900italic.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:normal;font-weight:300;src:url(../fonts/inter-v20-latin-300.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:normal;font-weight:500;src:url(../fonts/inter-v20-latin-500.woff2) format("woff2")}@font-face{descent-override:5%;font-display:swap;font-family:Segment7;font-weight:400;src:url(../fonts/segment7.woff2) format("woff2")}body{display:grid;height:100%;grid-gap:0;grid-template:auto 1fr auto/1fr;min-width:320px;.container{margin:0 auto;max-width:var(--grid-max-width);padding:0 10px;width:100%}.section-spacer{margin:var(--section-spacer) auto}.hidden{display:none!important}}.alert-bar{bottom:-200px;left:0;position:fixed;right:0;transition:bottom var(--anim-normal);z-index:4;@media (min-width:1200px){left:calc(50% - 600px);right:calc(50% - 600px)}&.visible{bottom:0}.alert-bar-title{background-color:var(--color-error);border-top-left-radius:5px;border-top-right-radius:5px;color:var(--color-bright-snow);cursor:pointer;display:inline-block;font-family:var(--font-stack-titles);font-size:14px;font-style:italic;font-weight:900;padding:5px 10px;text-transform:uppercase}.alert-bar-ticker{background-color:var(--color-bright-snow);border-top:1px solid var(--color-error);box-shadow:0 -4px 6px rgba(0,0,0,.1);color:var(--color-onyx);cursor:pointer;font-size:14px;height:48px;overflow:hidden;padding:0 10px;@media (min-width:1200px){border-bottom-color:var(--color-error);border-bottom-color:currentcolor;border-bottom-style:solid;border-bottom-style:none;border-bottom-width:1px;border-bottom-width:medium;border-left-color:var(--color-error);border-left-style:solid;border-left-width:1px;border-right-color:var(--color-error);border-right-style:solid;border-right-width:1px;border-top-color:var(--color-error);border-top-right-radius:5px;border-top-style:solid;border-top-width:1px;height:32px}.alert-bar-ticker-item{align-items:center;display:none;gap:10px;height:48px;justify-content:flex-start;transition:transform var(--anim-normal),opacity var(--anim-normal);@media (min-width:1200px){height:32px}&.is-active{display:flex}&.is-entering{display:flex;opacity:0;transform:translateY(100%)}&.is-leaving{opacity:0;transform:translateY(-100%)}&:before{background-color:var(--color-error);content:"";display:block;flex-shrink:0;height:5px;width:5px}.alert-date{color:var(--color-charcoal);font-size:12px}}}}.average-prices{display:grid;grid-template:1fr/1fr;grid-gap:var(--grid-gap);@media (min-width:768px){grid-template:1fr/1fr 1fr 1fr;margin-bottom:0;margin-left:auto;margin-right:auto;margin-top:0;max-width:700px}&.smaller{@media (min-width:768px){grid-template:1fr/1fr 1fr}}&.white{.stat .label:after{background-color:#fff}}.stat{text-align:center;.label{font-size:24px;font-weight:var(--font-weight-bold);margin-bottom:10px;&:after{background-color:#000;content:"";display:inline-block;height:24px;margin-left:10px;mask-image:url(/dist/images/icons/trend-equal.svg);mask-size:contain;vertical-align:middle;width:24px}&.increase{&:after{background-color:#e44c10;mask-image:url(/dist/images/icons/trend-up.svg)}}&.decrease{&:after{background-color:#00ddb5;mask-image:url(/dist/images/icons/trend-down.svg)}}}.text{font-size:14px;font-weight:var(--font-weight-bold);margin-top:10px}}}.brand-icon{background-color:var(--color-bright-snow);border-radius:8px;display:inline-block;font-size:0;padding:4px;vertical-align:middle}.button{background-color:var(--color-highlight);border:1px solid #000;border-radius:var(--border-radius);box-shadow:2px 3px #000;color:#000;cursor:pointer;display:inline-block;font-family:var(--font-stack-titles);font-size:18px;margin-bottom:5px;padding:5px 10px;text-decoration:none;transition:box-shadow var(--anim-fast),transform var(--anim-fast);&.pressed,&:active{box-shadow:none;outline:0;transform:translate(2px,3px)}&:hover{color:#000}&.disabled{opacity:.5;pointer-events:none}&.secondary{background-color:var(--color-dust-grey);color:var(--color-onyx)}&.danger{background-color:var(--color-error);color:#fff}&.link{align-items:center;background-color:transparent;color:var(--color-text);display:inline-flex;font-size:16px;&:before{background-color:var(--color-text);content:"";display:inline-block;height:14px;margin-right:5px;-webkit-mask-image:url(/dist/images/icons/arrow-forward.svg);mask-image:url(/dist/images/icons/arrow-forward.svg);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;width:14px}&.white{color:var(--color-bright-snow);&:before{background-color:var(--color-bright-snow)}}&.white,[data-theme=dark] &{border-color:var(--color-alice-blue);box-shadow:2px 3px var(--color-alice-blue);&.pressed,&:active{box-shadow:none}}}}.cheapest-near-location{margin-bottom:var(--section-spacer);margin-top:var(--section-spacer);&.main-component{margin-top:0}.consent-request{max-height:280px;opacity:1;overflow:hidden;text-align:center;transition:opacity var(--anim-normal);&.collapsed{max-height:0;opacity:0}.needs-consent{font-size:20px;margin-bottom:20px}.alternative{font-size:14px;margin-top:20px;p{margin-bottom:10px}.alternative-links{margin:0 auto;max-width:300px;@media (min-width:768px){display:flex;gap:10px;justify-content:center;max-width:500px}}a{margin-top:10px}}}.nearest-results{max-height:0;opacity:0;overflow:hidden;text-align:center;transition:max-height var(--anim-normal),opacity var(--anim-normal);@media (min-width:768px){align-items:flex-start;display:flex;flex-direction:row-reverse;gap:var(--grid-gap);>:first-child{flex:1}>:last-child{flex:0 0 60%}}&.visible{max-height:1200px;opacity:1}.location-name{display:none;font-size:14px;margin-bottom:20px;&.visible{display:block}}.nearest-results-list{display:none;&.visible{display:block}}.nearest-results-no-results{display:none;font-size:18px;margin:15px 0;&.visible{display:block}}.view-all{margin-top:var(--grid-gap)}.nearest-filters{display:grid;grid-template:1fr/1fr;grid-gap:var(--grid-gap);margin-bottom:var(--grid-gap);text-align:left;@media (min-width:768px){margin-bottom:0;margin-top:45px}}}}.dark-bar{background:var(--color-deep-space-blue);box-shadow:0 0 30px rgba(55,133,167,.5);color:var(--color-bright-snow);isolation:isolate;padding:var(--grid-gap) 0;position:relative;text-align:center;.title{text-align:left}&:before{animation:glow 5s ease-in-out infinite;box-shadow:0 0 30px rgba(55,133,167,.9);content:"";inset:0;opacity:0;pointer-events:none;position:absolute;z-index:-1}}@keyframes glow{0%{opacity:.5}50%{opacity:.9}to{opacity:.5}}.dialog{align-items:center;background-color:rgba(0,0,0,.5);bottom:0;display:none;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:9;&.active{display:flex}.modal-content{background-color:var(--color-base);border-radius:var(--border-radius);margin:var(--grid-padding);max-width:400px;padding:var(--grid-gap);width:100%;.modal-title{font-size:24px;font-weight:var(--font-weight-bold);margin-bottom:var(--grid-padding)}.modal-buttons{align-items:center;display:flex;flex-direction:column;gap:var(--grid-gap);margin-top:var(--grid-gap);.button{text-align:center;width:70%}}}}.fixed-mobile{overflow:hidden;@media (min-width:768px){overflow:auto}}.form{border:1px solid var(--color-main);border-radius:var(--border-radius);padding:16px 10px;&.no-border{border:0;border-radius:0;padding:0}label{color:var(--color-main);display:block;margin-bottom:5px;padding-left:10px}input,select,textarea{background:var(--color-base);border:1px solid var(--color-main);border-radius:var(--border-radius);box-sizing:border-box;color:var(--color-text);padding:10px;transition:box-shadow var(--anim-fast);width:100%;&:active,&:focus{box-shadow:0 0 8px rgba(62,143,209,.5);outline:0}&.error{border-color:var(--color-error)}&:disabled{opacity:.5;pointer-events:none}[data-theme=dark] &{background:#072435}}select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url(/dist/images/icons/arrow.svg);background-position:right 10px center;background-repeat:no-repeat;background-size:20px;cursor:pointer;[data-theme=dark] &{background-image:url(/dist/images/icons/arrow-white.svg);background-position:right 10px center;background-repeat:no-repeat;background-size:20px}}textarea{max-height:300px;min-height:100px;resize:vertical}.form-switch{display:inline-block;height:20px;position:relative;width:40px;&.disabled{opacity:.5;pointer-events:none}input{height:0;opacity:0;position:absolute;width:0}label{display:block;font-size:0;height:100%;position:relative;width:100%}.slider{border:1px solid var(--color-main);border-radius:var(--border-radius);bottom:0;cursor:pointer;left:0;position:absolute;right:0;top:0;transition:var(--anim-normal);&:before{background-color:var(--color-main);border-radius:50%;content:"";display:block;height:14px;left:4px;position:absolute;top:2px;transition:var(--anim-normal);width:14px}}input:checked~label .slider{background-color:var(--color-highlight);&:before{background-color:var(--color-bright-snow);transform:translateX(16px)}}}.form-search{position:relative;input{padding-right:32px}button{background-color:var(--color-text);cursor:pointer;height:42px;mask-image:url(/dist/images/icons/search.svg);mask-position:center;mask-repeat:no-repeat;mask-size:24px;position:absolute;right:5px;top:0;width:32px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none;appearance:none}}.field-error{background-color:var(--color-error);border-radius:var(--border-radius);color:var(--color-bright-snow);display:none;font-size:12px;margin-top:5px;padding:5px 10px;&.active{display:block}}.input-unit-aux{position:relative;&:before{color:var(--color-lighter-text);display:block;font-size:13px;line-height:42px;position:absolute;right:5px}&.litres:before{content:"litros"}&.euro:before{content:"€"}&.distance:before{content:"km"}&.capacity:before{content:"kWh"}&.fuel:before{content:"l/100km"}&.ev:before{content:"kWh/100km"}}}.fuel-price{background-color:#000;border-left:5px solid #000;border-radius:5px;color:#fff;display:inline-block;font-family:var(--font-stack-prices);font-size:24px;letter-spacing:2px;padding:5px;text-align:right;width:82px;&.large{font-size:40px;width:120px}&.marker-map{border-radius:3px;font-size:15px;letter-spacing:1px;line-height:15px;padding:2px;width:50px}&.sc95{border-color:var(--color-fuel-sc95)}&.sc95plus{border-color:var(--color-fuel-sc95plus)}&.sc98{border-color:var(--color-fuel-sc98)}&.sc98plus{border-color:var(--color-fuel-sc98plus)}&.diesel{border-color:var(--color-fuel-diesel)}&.dieselplus{border-color:var(--color-fuel-dieselplus)}&.gpl{border-color:var(--color-fuel-gpl)}&.outdated{color:var(--color-dust-grey);text-decoration:line-through}}.with-discount{min-width:14px;position:relative;&:before{align-items:center;background-color:var(--color-success);border-radius:50%;color:#000;content:"↓";display:flex;font:10px var(--font-stack);height:14px;justify-content:center;position:absolute;right:-5px;top:-8px;width:14px}}.fuel-station-list-discount-info{align-items:center;display:none;font-size:14px;gap:var(--grid-padding);margin:var(--grid-gap) 0;text-align:justify;&.active{display:flex}}.fuel-station-list-outdated-info{align-items:center;display:flex;font-size:14px;gap:var(--grid-padding);margin:var(--grid-gap) 0;text-align:justify;&:before{background-color:var(--color-text);content:"";display:inline-block;flex-shrink:0;height:24px;mask-image:url(/dist/images/icons/warning.svg);mask-position:center;mask-repeat:no-repeat;mask-size:24px;width:24px}}.fuel-station-list{.fuel-station-item{align-items:center;border-bottom:1px solid var(--color-highlight);display:grid;grid-template-areas:"logo name" "logo date" "logo distance" "prices prices";grid-template-columns:auto 1fr;margin-bottom:15px;padding-bottom:15px;position:relative;@media (min-width:768px){grid-template-areas:"logo name prices" "logo date prices" "logo distance prices";grid-template-columns:auto 1fr auto}&:last-child{border-bottom:0;margin-bottom:0}.brand-icon{grid-area:logo;margin-right:var(--grid-padding)}.station-name{font-size:18px;font-weight:var(--font-weight-bold);grid-area:name;margin-bottom:5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;&:after{content:"";inset:0;position:absolute}}.updated-date{grid-area:date}.distance,.updated-date{color:var(--color-lighter-text);font-size:14px}.distance{grid-area:distance;margin-top:5px}.fuel-prices{align-items:center;display:flex;gap:var(--grid-padding);grid-area:prices;justify-content:flex-end;margin-top:var(--grid-padding)}}}.fuel-station-single-price-list{align-items:center;border-bottom:1px solid var(--color-highlight);display:grid;gap:10px;grid-template:1fr/auto 1fr auto;margin-bottom:15px;padding-bottom:15px;position:relative;&:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}.image-placeholder.shimmer{height:24px;width:24px}.fuel-price-placeholder.shimmer{height:36px;width:72px}.station-details{overflow:hidden;text-align:left;.name.shimmer{height:18px;margin-bottom:5px;width:150px}a{display:block;font-size:18px;margin-bottom:5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;@media (min-width:480px){display:inline-block}&:after{content:"";inset:0;position:absolute}}.distance{font-size:14px;&.shimmer{height:14px;width:100px}}}}footer{align-items:end;display:grid;margin-top:50px;.scene{&:before{background:url(/dist/images/peaks.svg) no-repeat 50%;content:"";display:block;height:40px;width:100%}[data-theme=dark] &:before{background-image:url(/dist/images/peaks-night.svg)}.sky{background:linear-gradient(#2f5d82,#0097f0,70%,#d8fff9);height:115px;position:relative;[data-theme=dark] &{background:linear-gradient(#090c0e,#121e26,70%,#0c2033)}.star{animation:twinklestar 3s ease-in-out infinite;background:#fff;display:none;filter:blur(.5px);height:1px;opacity:0;position:absolute;width:1px;z-index:3;[data-theme=dark] &{display:block}}}.sea{background:image-set(url("/dist/images/beach.avif") type("image/avif"),url("/dist/images/beach.png") type("image/png")) repeat-x 50%;height:50px;position:relative;width:100%;[data-theme=dark] &{filter:brightness(.1) saturate(1.2)}.sparkle{animation:twinkle 3s ease-in-out infinite;background:#fff;filter:blur(.5px);height:2px;opacity:0;position:absolute;width:2px;z-index:3;[data-theme=dark] &{display:none}}}.beach{background:#feedd8;height:20px;[data-theme=dark] &{background:#191412}}.sidewalk{background:url(/dist/images/sidewalk.png) repeat-x 50%;[data-theme=dark] &{filter:brightness(.1) saturate(1.2)}.container{height:17px;position:relative;&:after{background:url(/dist/images/beach-yoshi.png) no-repeat 50%;background-size:contain;content:"";display:block;height:33px;position:absolute;right:250px;top:-19px;width:20px;z-index:2;@media (min-resolution:1.5dppx){background-image:url(/dist/images/beach-yoshi-2x.png)}}[data-theme=dark] &:after{display:none}}}.car-park{background:#595959 repeating-linear-gradient(7deg,transparent,transparent 1px,rgba(100,80,60,.1) 45px,rgba(100,80,60,.1) 0);[data-theme=dark] &{background:#111}.container{min-height:30px;position:relative;&:after{background:url(/dist/images/beach-e31.png) no-repeat 50%;background-size:contain;content:"";display:block;height:68px;position:absolute;right:20px;top:-39px;width:176px;z-index:2;@media (min-resolution:1.5dppx){background-image:url(/dist/images/beach-e31-2x.png)}}[data-theme=dark] &:after{filter:brightness(.1) saturate(1.2)}.text{color:#fff;font-size:13px;padding:40px 0 10px;text-align:center;@media (min-width:768px){padding-bottom:10px;padding-left:0;padding-right:0;padding-top:10px;text-align:left}.site-name{display:block;font-weight:var(--font-weight-bold);@media (min-width:768px){display:inline}}.dash{display:none;@media (min-width:768px){display:inline}}.footer-links{margin-top:10px;a{color:#fff}}}}}}}@keyframes twinkle{0%,to{opacity:0}50%{opacity:.7}}@keyframes twinklestar{0%,to{opacity:.1}50%{opacity:.3}}.header-actions{&.visible{.overlay{display:block}.actions-wrapper{right:0;top:0}}.overlay{backdrop-filter:blur(3px);background:rgba(0,0,0,.3);bottom:0;display:none;left:0;position:fixed;right:0;top:0;z-index:4}.actions-wrapper{background-color:var(--color-base);box-shadow:0 0 30px rgba(0,0,0,.5);height:100%;overflow-x:auto;padding-top:var(--header-height);position:fixed;right:-120vw;top:0;transition:right var(--anim-fast),height var(--anim-fast);width:100%;z-index:5;@media (min-width:480px){max-width:450px}}.nav{display:grid;grid-template:1fr auto/1fr;height:100%;&.hidden{display:none}nav{a{border-bottom:1px solid var(--color-highlight);color:var(--color-text);display:block;font-size:22px;font-weight:var(--font-weight-bold);padding:15px;text-align:center;text-decoration:none;text-transform:lowercase;transition:color var(--anim-fast),background-color var(--anim-fast);&:active,&:hover{background-color:var(--color-main);color:#fff}&:last-child{border-bottom:none}}}.theme-switcher{border:1px solid var(--color-main);border-radius:var(--border-radius);margin:20px;padding:10px 15px;.runner{align-items:center;display:flex;justify-content:center;margin:0 auto;position:relative;width:96px}.theme{background:url(/dist/images/theme-toggle.png) no-repeat 50%;background-size:96px 32px;height:32px;left:32px;position:absolute;transition:left .45s cubic-bezier(.34,1.56,.64,1);width:32px;@media (min-resolution:1.5dppx){background-image:url(/dist/images/theme-toggle-2x.png)}&.day{background-position:0 0;left:0}&.night{background-position:-64px 0;left:64px}}.dot{align-items:center;cursor:pointer;display:flex;height:32px;justify-content:center;width:32px;&:before{background-color:var(--color-highlight);border-radius:50%;content:"";display:block;height:5px;width:5px}}.theme-label{font-size:13px;margin-top:10px;text-align:center;text-transform:uppercase}}}.search{align-items:center;display:flex;flex-direction:column;gap:var(--grid-gap);height:100%;justify-content:center;padding:20px;width:100%;&.hidden{display:none}form{position:relative;width:100%;&.with-results{input{border-bottom-left-radius:0;border-bottom-right-radius:0}.autocomplete{display:block}}.autocomplete{background:var(--color-base);border:1px solid var(--color-main);border-bottom-left-radius:var(--border-radius);border-bottom-right-radius:var(--border-radius);border-top:0;color:var(--color-text);display:none;left:0;padding:5px;position:absolute;right:0;top:100%;z-index:2;.result{border-radius:var(--border-radius);color:var(--color-text);cursor:pointer;display:block;margin-bottom:5px;padding:5px var(--border-radius);text-decoration:none;transition:background-color var(--anim-fast);&:active,&:hover{background-color:var(--color-highlight)}&:last-child{margin-bottom:0}}}}.most-searched{text-align:center;width:100%;.inner-title{font-size:14px;font-weight:var(--font-weight-bold);margin-bottom:var(--grid-padding)}ul{li{margin-bottom:var(--grid-padding);&:last-child{margin-bottom:0}}}}}.user{align-items:center;display:grid;gap:var(--grid-gap);height:100%;justify-content:center;padding:20px;&.hidden{display:none}.intro-text{display:block;font-size:20px;font-weight:var(--font-weight-bold);margin-bottom:var(--grid-gap);text-align:center}.sign-in{.form{width:100%;.session-save{align-items:center;display:flex;gap:var(--grid-padding);justify-content:flex-end}.button,.session-save{margin-top:var(--grid-padding)}.button{width:100%}}.inner-separator{align-items:center;display:flex;font-size:12px;font-weight:var(--font-weight-bold);gap:8px;margin:50px 0;text-transform:uppercase;&:after,&:before{background-color:var(--color-highlight);content:"";flex:1;height:1px}}.account-creation{.join-text{font-size:14px}ul{font-size:12px;margin:var(--grid-padding);li{display:flex;gap:8px;margin-bottom:5px;&:before{content:"\2713"}}}.button{text-align:center;width:100%}}}.request-otp{.text{display:block;font-size:20px;margin-bottom:var(--grid-gap)}input{font-size:24px}.button,input{text-align:center}.button{margin-top:var(--grid-gap);width:100%}}.new-account{.text{display:block;text-align:justify}.form>label{margin-top:var(--grid-gap)}.mailing{align-items:center;display:flex;gap:var(--grid-padding);justify-content:flex-end;margin-top:var(--grid-gap);.text{text-align:left}.form-switch{flex-shrink:0}}.button{margin-top:var(--grid-gap);width:100%}}}}header{background:linear-gradient(180deg,var(--color-main) 50px,transparent 51px);height:var(--header-height);left:0;position:fixed;right:0;top:0;z-index:7;[data-theme=dark] &{background:linear-gradient(180deg,#090c0e 50px,transparent 51px)}&:after{background:url(/dist/images/peaks.svg) no-repeat 50%;content:"";display:block;height:40px;margin-top:-10px;transform:scaleY(-1);width:100%}[data-theme=dark] &:after{background-image:url(/dist/images/peaks-night.svg)}&.scrolled{transition:top var(--anim-normal)}.container{align-items:center;display:flex;height:40px;justify-content:space-between;position:relative}.sitename{color:#fff;font-family:var(--font-stack-titles);font-size:24px;font-style:italic;font-weight:900;text-decoration:none;text-transform:uppercase}.actions{align-items:center;display:flex;gap:10px;justify-content:flex-end;&:has(.action:nth-child(4)){gap:5px}.action{background-color:#fff;cursor:pointer;height:32px;mask-position:center;mask-repeat:no-repeat;mask-size:24px;transition:background-color var(--anim-fast);width:32px;&.active,&:active,&:hover{background-color:var(--color-highlight)}&.user{mask-image:url(/dist/images/icons/person.svg)}&.search{mask-image:url(/dist/images/icons/search.svg)}&.nav{mask-image:url(/dist/images/icons/menu.svg)}&.fav{mask-image:url(/dist/images/icons/star.svg);@media (max-width:350px){display:none}}}}}.map-location-search{position:relative;&.with-results{input{border-bottom-left-radius:0;border-bottom-right-radius:0}.place-results{display:block}}.form-search{input{padding-right:64px}button{right:38px}.get-location{background-color:var(--color-text);cursor:pointer;height:42px;mask-image:url(/dist/images/icons/location.svg);mask-position:center;mask-repeat:no-repeat;mask-size:24px;position:absolute;right:5px;top:0;width:32px}}.place-results{background:var(--color-base);border:1px solid var(--color-main);border-bottom-left-radius:var(--border-radius);border-bottom-right-radius:var(--border-radius);border-top:0;color:var(--color-text);display:none;left:0;padding:5px;position:absolute;right:0;top:100%;z-index:2;.result{border-radius:var(--border-radius);cursor:pointer;margin-bottom:5px;padding:5px var(--border-radius);transition:background-color var(--anim-fast);&:active,&:hover{background-color:var(--color-highlight)}&:last-child{margin-bottom:0}}.no-results{font-size:14px;font-weight:var(--font-weight-bold);padding:5px var(--border-radius)}}}.map-point-selector{.map-element{height:200px;z-index:1}.map-actions{background:var(--color-deep-space-blue);border-radius:var(--border-radius);color:var(--color-bright-snow);margin-top:var(--grid-padding);padding:var(--grid-padding)}.selected-points{align-items:center;display:flex;gap:var(--grid-padding);justify-content:space-between;margin:var(--grid-padding) auto;max-width:400px;.selected-point{align-items:center;background-color:var(--color-dust-grey);border:1px solid var(--color-dust-grey);border-radius:4px;display:flex;font-size:12px;gap:var(--grid-padding);padding:4px;width:100%;&.selected{background-color:var(--color-success);border-color:var(--color-success);color:var(--color-deep-space-blue);cursor:pointer}&:before{background-color:var(--color-text);content:"";display:inline-block;flex-shrink:0;height:20px;mask-image:url(/dist/images/icons/car.svg);mask-position:center;mask-repeat:no-repeat;mask-size:20px;width:20px}&.finish:before{mask-image:url(/dist/images/icons/flag.svg)}}}.modal-overlay{inset:0;position:fixed;z-index:5}.modal-box{background:#fff;border-radius:8px;box-shadow:0 4px 16px rgba(0,0,0,.2);display:flex;flex-direction:column;gap:8px;left:50%;min-width:240px;padding:16px;position:fixed;top:50%;transform:translate(-50%,-50%);z-index:7}.modal-close,.modal-option{background:var(--color-baltic-blue);border:none;border-radius:6px;color:var(--color-bright-snow);cursor:pointer;font-size:14px;font-weight:var(--font-weight-bold);padding:10px 16px;text-align:center}.modal-close{background:transparent;color:var(--color-charcoal)}.point-marker{align-items:center;background-color:var(--color-deep-space-blue);border-radius:50% 50% 50% 0;box-shadow:0 2px 6px rgba(0,0,0,.3);color:#fff;display:flex;font-size:12px;font-weight:700;height:28px;justify-content:center;transform:rotate(-45deg);width:28px;&:before{background-color:var(--color-bright-snow);content:"";display:inline-block;flex-shrink:0;height:20px;mask-image:url(/dist/images/icons/car.svg);mask-position:center;mask-repeat:no-repeat;mask-size:20px;transform:rotate(45deg);width:20px}&.finish:before{mask-image:url(/dist/images/icons/flag.svg)}}}.notes{display:flex;font-size:14px;gap:10px;margin:var(--grid-gap) 0;text-align:justify;&:before{background-color:var(--color-text);content:"";display:inline-block;flex-shrink:0;height:24px;mask-image:url(/dist/images/icons/notes.svg);mask-position:center;mask-repeat:no-repeat;mask-size:24px;width:24px}&.white{color:var(--color-bright-snow);&:before{background-color:var(--color-bright-snow)}}.mobile-only{@media (min-width:768px){display:none}}.desktop-only{display:none;@media (min-width:768px){display:block}}}.order{margin:var(--grid-gap) 0;max-width:400px;@media (min-width:480px){margin-left:auto;width:400px}&.with-geo{@media (min-width:768px){max-width:620px;width:620px}}&.open{.action{max-height:200px}.current-order:after{transform:rotate(180deg)}}.current-order{align-items:center;cursor:pointer;display:flex;font-size:14px;font-weight:var(--font-weight-bold);justify-content:space-between;&:after{background:url(/dist/images/icons/arrow.svg) 50% no-repeat;background-size:contain;content:"";display:inline-block;height:20px;transition:transform var(--anim-normal);width:20px}[data-theme=dark] &:after{background-image:url(/dist/images/icons/arrow-white.svg)}}.action{display:flex;flex-direction:column;gap:var(--grid-padding);max-height:0;overflow:hidden;transition:max-height var(--anim-normal);@media (min-width:480px){align-items:center;flex-direction:row;justify-content:space-between}&.with-geo{.text{text-align:center}.options{grid-template-areas:"geo geo geo" "or or or" "fuel1 fuel2 fuel3";grid-template-columns:auto auto auto;justify-content:center;@media (min-width:480px){justify-content:center}@media (min-width:768px){grid-template-areas:"geo or fuel1 fuel2 fuel3";grid-template-columns:1fr auto 1fr 1fr 1fr}}}.text{font-weight:var(--font-weight-bold);padding-top:var(--grid-gap);text-align:center;@media (min-width:480px){text-align:left}}.options{align-items:center;display:grid;gap:var(--grid-padding);grid-template-areas:"fuel1 fuel2 fuel3";grid-template-columns:auto auto auto;justify-content:center;text-align:center;@media (min-width:480px){justify-content:end;padding:var(--grid-gap) 5px 0 5px}.or{align-items:center;color:var(--color-lighter-text);display:flex;font-size:12px;gap:8px;grid-area:or;&:after,&:before{background-color:var(--color-highlight);content:"";flex:1;height:1px}}.geo{grid-area:geo}.fuel1{grid-area:fuel1}.fuel2{grid-area:fuel2}.fuel3{grid-area:fuel3}}}}.shimmer{animation-duration:3s;animation-fill-mode:forwards;animation-iteration-count:infinite;animation-name:shimmer;animation-timing-function:linear;background:#eee;background:linear-gradient(90deg,#e0e0e0 8%,#e9e9e9 18%,#e0e0e0 33%);background-size:1000px 100%;border-radius:10px;[data-theme=dark] &{animation-duration:3s;animation-fill-mode:forwards;animation-iteration-count:infinite;animation-name:shimmer;animation-timing-function:linear;background:#497691;background:linear-gradient(90deg,#345c74 8%,#3f6f86 18%,#345c74 33%);background-size:1000px 100%;border-radius:10px}}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.spinner{background:url(/dist/images/spinner.png);background-size:16px;display:inline-block;height:16px;margin-left:0;transition:all .2s ease-in-out;width:0;&.active{margin-left:10px;width:16px}}.subtle-divider{background-color:var(--color-text);height:1px;margin:var(--grid-gap) auto;max-width:70%;opacity:.1}.title{color:var(--color-main);font-family:var(--font-stack-titles);font-size:19px;font-style:italic;font-weight:900;margin-bottom:var(--grid-gap);text-transform:uppercase;&:after{background:var(--color-main);border-radius:8px;content:"";display:block;height:4px;width:32px}&.white{color:var(--color-alice-blue);&:after{background:var(--color-alice-blue)}}}.wcag-skip{background:var(--color-base);color:var(--color-text);left:calc(50% - 75px);padding:5px 0;position:absolute;text-align:center;transform:translateY(-100%);width:150px;&:focus{transform:translateY(0)}}.article{margin-bottom:100px;.date{color:var(--color-lighter-text);font-size:12px;margin-bottom:var(--grid-gap);margin-top:-20px}.content{margin:0 auto;max-width:1000px;@media (min-width:768px){font-size:18px}figure{display:block;margin:0 auto var(--grid-gap) auto;max-width:1000px;width:100%;img{border-radius:var(--border-radius);height:auto;margin:0 auto;max-width:100%}figcaption{color:var(--color-lighter-text);font-size:14px;text-align:right}}>p{line-height:24px;margin-bottom:20px;@media (min-width:768px){line-height:28px;margin-bottom:30px}a{font-weight:var(--font-weight-bold)}}.article-table{margin-bottom:30px;max-width:calc(100vw - 20px);overflow-x:auto;>table{border:0;border-collapse:collapse;width:100%;th{border-bottom:1px solid var(--color-main);color:var(--color-main);font-size:16px;font-weight:700;padding:3px 5px;text-align:center}tbody th{border:0;text-align:left;white-space:nowrap}td{background-color:var(--color-base);padding:5px 10px;text-align:center}tbody tr:nth-child(2n){td,th{background-color:#f1f1f1;[data-theme=dark] &{background-color:#21435e}}}tbody tr:hover,tbody tr:nth-child(2n):hover{td,th{background-color:var(--color-main);color:var(--color-base)}}}}}}.related-articles{margin-top:100px;.related-article{border-top:1px solid var(--color-highlight);display:block;margin-top:var(--grid-gap);padding-top:var(--grid-gap);text-decoration:none;@media (min-width:768px){align-items:center;display:flex;gap:var(--grid-gap)}img{border-radius:var(--border-radius);display:block;height:auto;margin:0 auto var(--grid-padding) auto;@media (min-width:768px){flex-shrink:0;width:200px}}.content{.inner-title{display:block;font-size:20px;font-weight:var(--font-weight-bold);margin-bottom:var(--grid-padding)}.summary{color:var(--color-text);display:block}.date{color:var(--color-lighter-text);font-size:12px}.date,.read-more{display:block;margin-top:var(--grid-padding)}.read-more{font-size:14px;text-decoration:underline}}}}.brand{.brand-title{align-items:center;display:flex;font-size:22px;gap:var(--grid-padding);margin-bottom:var(--grid-padding);@media (min-width:768px){font-size:28px}&:after{display:none}}.brand-notes{font-size:13px}.dark-bar{margin:var(--grid-gap) 0;.average{font-size:14px;margin-top:var(--grid-padding)}}.chart-wrapper{overflow-x:scroll;padding-left:var(--grid-padding);padding-right:var(--grid-padding);width:100vw;-webkit-overflow-scrolling:touch;@media (min-width:768px){overflow-x:hidden;padding-left:0;padding-right:0;width:100%}}.brand-chart{height:250px}p{margin-bottom:var(--grid-gap)}}.calculator-detour{.intro-text{margin-bottom:var(--grid-padding)}.form{margin:var(--grid-gap) auto 0 auto;max-width:700px;.form-step{margin-bottom:var(--grid-gap);.step-title{font-weight:var(--font-weight-bold);margin-bottom:var(--grid-padding)}.step-explanation{font-size:14px}}.step-spacer{height:var(--grid-gap)}.fuel-inputs{display:flex;flex-direction:column;gap:var(--grid-padding);@media (min-width:768px){align-items:center;flex-direction:row;justify-content:space-between}.input-wrapper{width:100%}}.quantity-inputs{display:flex;gap:var(--grid-padding)}.submit-button{display:block;width:100%}}.results{display:grid;gap:var(--grid-gap);grid-template:auto/auto;margin:var(--grid-gap) 0;@media (min-width:768px){grid-template-columns:repeat(2,minmax(270px,1fr))}@media (min-width:1200px){grid-template-columns:repeat(4,minmax(270px,1fr))}.result{border:1px solid var(--color-deep-space-blue);border-radius:var(--grid-padding);padding:var(--grid-padding);[data-theme=dark] &{border-color:var(--color-onyx)}.result-title{align-items:center;display:flex;gap:var(--grid-padding);justify-content:flex-start;margin-bottom:var(--grid-padding);text-decoration:none;.station-name{overflow:hidden;text-decoration:underline;text-overflow:ellipsis;white-space:nowrap}.cost-difference{background:var(--color-error);border-radius:8px;color:var(--color-bright-snow);flex-shrink:0;font-size:13px;padding:2px 5px;text-decoration:none}}.result-details{display:grid;gap:5px;grid-template:auto/1fr 1fr;.result-description{font-size:14px;font-weight:var(--font-weight-bold)}:first-child{font-size:16px}:nth-child(2){font-size:18px;font-weight:var(--font-weight-bold);@media (min-width:1200px){font-size:14px}}}&.winner{background:var(--color-deep-space-blue);border-radius:var(--grid-padding);color:var(--color-bright-snow);padding:var(--grid-padding);@media (min-width:768px){grid-column:1/-1}@media (min-width:1200px){max-width:calc(50% - var(--grid-gap)/2)}[data-theme=dark] &{background:var(--color-onyx)}.cost-difference{display:none}.result-title{align-items:center;color:var(--color-bright-snow);display:flex;font-size:24px;gap:5px;&:before{background-color:var(--color-success);content:"";display:inline-block;flex-shrink:0;height:24px;mask-image:url(/dist/images/icons/winner.svg);mask-position:center;mask-repeat:no-repeat;mask-size:24px;width:24px}}.result-details{:nth-child(2){font-size:18px}}}}}.results-disclaimer{font-size:14px;p{display:block;margin-bottom:var(--grid-padding)}}.results-more-info{margin:var(--grid-gap) 0;.more-info-action{cursor:pointer;font-size:14px;text-align:center;text-decoration:underline}.more-info-text{font-size:14px;max-height:0;overflow:hidden;transition:max-height var(--anim-normal);&.expanded{max-height:300px}p{display:block;margin-top:var(--grid-padding)}}}}.calculator-exchange{.intro-text{margin-bottom:var(--grid-padding)}.form{margin:var(--grid-gap) auto 0 auto;max-width:700px;.form-step{margin-bottom:var(--grid-gap);.step-title{font-weight:var(--font-weight-bold);margin-bottom:var(--grid-padding)}.step-explanation{font-size:14px}}.trade-in{align-items:center;display:flex;gap:var(--grid-padding);justify-content:space-between;margin-top:var(--grid-padding);.text{font-size:14px}}.side-by-side{display:grid;gap:var(--grid-gap);grid-template:auto/1fr;margin-bottom:var(--grid-gap);@media (min-width:768px){grid-template:auto/1fr 1fr}}.car-list{.car-entry{align-items:center;border-bottom:1px solid var(--color-highlight);display:flex;justify-content:space-between;margin-bottom:var(--grid-padding);padding-bottom:var(--grid-padding);&:last-child{margin-bottom:var(--grid-gap)}.car-name{font-size:14px;font-weight:var(--font-weight-bold)}.car-actions{align-items:center;display:flex;gap:var(--grid-padding);justify-content:center;.car-delete,.car-edit{background-color:var(--color-text);cursor:pointer;height:24px;mask-position:center;mask-repeat:no-repeat;mask-size:24px;width:24px}.car-edit{mask-image:url(/dist/images/icons/edit.svg)}.car-delete{mask-image:url(/dist/images/icons/delete.svg)}}}}.fuel-selector{margin-bottom:var(--grid-gap)}.car-details{border-bottom:1px solid var(--color-highlight);margin-bottom:var(--grid-gap);padding-bottom:var(--grid-gap);.car-name{margin-bottom:var(--grid-gap)}.actions{display:flex;flex-direction:column;gap:var(--grid-padding);.button{text-align:center;width:100%}}}.step-spacer{height:var(--grid-gap)}.submit-button{display:block;text-align:center;width:100%}}.results{.results-title{font-size:24px;font-weight:var(--font-weight-bold);margin-bottom:var(--grid-padding)}.results-lpg-disclaimer{color:var(--color-lighter-text);font-size:14px;margin-bottom:var(--grid-padding)}.results-list{display:grid;gap:var(--grid-gap);grid-template:auto/auto;margin:var(--grid-gap) 0;@media (min-width:768px){grid-template-columns:repeat(2,minmax(270px,1fr))}@media (min-width:1200px){grid-template-columns:repeat(4,minmax(270px,1fr))}.result{border:1px solid var(--color-deep-space-blue);border-radius:var(--grid-padding);padding:var(--grid-padding);[data-theme=dark] &{border-color:var(--color-onyx)}.result-title{align-items:center;display:flex;gap:var(--grid-padding);justify-content:flex-start;margin-bottom:var(--grid-padding);text-decoration:none}.result-details{display:grid;gap:5px;grid-template:auto/2fr 1fr;.result-section{font-size:12px;font-weight:var(--font-weight-bold);grid-column:1/-1;margin:40px 0 10px;text-transform:uppercase;&:first-child{margin-top:10px}}.result-description{font-size:14px}.highlight,.result-description{font-weight:var(--font-weight-bold)}}&.winner{background:var(--color-deep-space-blue);border-radius:var(--grid-padding);color:var(--color-bright-snow);padding:var(--grid-padding);@media (min-width:768px){grid-column:1/-1}@media (min-width:1200px){max-width:calc(50% - var(--grid-gap)/2)}[data-theme=dark] &{background:var(--color-onyx)}.result-title{align-items:center;color:var(--color-bright-snow);display:flex;font-size:24px;gap:5px;&:before{background-color:var(--color-success);content:"";display:inline-block;flex-shrink:0;height:24px;mask-image:url(/dist/images/icons/winner.svg);mask-position:center;mask-repeat:no-repeat;mask-size:24px;width:24px}}.highlight{font-size:18px}}}}}}.calculator-trip{.intro-text{margin-bottom:var(--grid-padding)}.form{margin:var(--grid-gap) auto 0 auto;max-width:700px;.form-step{margin-bottom:var(--grid-gap);.step-title{font-weight:var(--font-weight-bold);margin-bottom:var(--grid-padding)}.step-explanation{font-size:14px}}.car-list{.car-entry{align-items:center;border-bottom:1px solid var(--color-highlight);display:flex;justify-content:space-between;margin-bottom:var(--grid-padding);padding-bottom:var(--grid-padding);&:last-child{margin-bottom:var(--grid-gap)}.car-name{font-size:14px;font-weight:var(--font-weight-bold)}.car-actions{align-items:center;display:flex;gap:var(--grid-padding);justify-content:center;.car-delete,.car-edit{background-color:var(--color-text);cursor:pointer;height:24px;mask-position:center;mask-repeat:no-repeat;mask-size:24px;width:24px}.car-edit{mask-image:url(/dist/images/icons/edit.svg)}.car-delete{mask-image:url(/dist/images/icons/delete.svg)}}}}.fuel-selector{margin-bottom:var(--grid-gap)}.car-details{border-bottom:1px solid var(--color-highlight);margin-bottom:var(--grid-gap);padding-bottom:var(--grid-gap);.car-name{margin-bottom:var(--grid-gap)}.side-by-side{display:grid;gap:var(--grid-gap);grid-template:auto/1fr;margin-bottom:var(--grid-gap);@media (min-width:768px){grid-template:auto/1fr 1fr}}.actions{display:flex;flex-direction:column;gap:var(--grid-padding);.button{text-align:center;width:100%}}}.step-spacer{height:var(--grid-gap)}.submit-button{display:block;text-align:center;width:100%}}.results{.results-title{font-size:24px;font-weight:var(--font-weight-bold);margin-bottom:var(--grid-padding)}.results-lpg-disclaimer{color:var(--color-lighter-text);font-size:14px;margin-bottom:var(--grid-padding)}.results-list{display:grid;gap:var(--grid-gap);grid-template:auto/auto;margin:var(--grid-gap) 0;@media (min-width:768px){grid-template-columns:repeat(2,minmax(270px,1fr))}@media (min-width:1200px){grid-template-columns:repeat(4,minmax(270px,1fr))}.result{border:1px solid var(--color-deep-space-blue);border-radius:var(--grid-padding);padding:var(--grid-padding);[data-theme=dark] &{border-color:var(--color-onyx)}.result-title{align-items:center;display:flex;gap:var(--grid-padding);justify-content:flex-start;margin-bottom:var(--grid-padding);text-decoration:none}.result-details{display:grid;gap:5px;grid-template:auto/2fr 1fr;.result-description{font-size:14px;font-weight:var(--font-weight-bold)}:first-child{font-size:16px}:nth-child(2){font-size:18px;font-weight:var(--font-weight-bold);@media (min-width:1200px){font-size:14px}}}&.winner{background:var(--color-deep-space-blue);border-radius:var(--grid-padding);color:var(--color-bright-snow);padding:var(--grid-padding);@media (min-width:768px){grid-column:1/-1}@media (min-width:1200px){max-width:calc(50% - var(--grid-gap)/2)}[data-theme=dark] &{background:var(--color-onyx)}.result-title{align-items:center;color:var(--color-bright-snow);display:flex;font-size:24px;gap:5px;&:before{background-color:var(--color-success);content:"";display:inline-block;flex-shrink:0;height:24px;mask-image:url(/dist/images/icons/winner.svg);mask-position:center;mask-repeat:no-repeat;mask-size:24px;width:24px}}.result-details{:nth-child(2){font-size:18px}}}}}}}.calculators{.list{margin-top:var(--grid-gap);.entry{align-items:center;border-bottom:1px solid var(--color-highlight);display:flex;flex-direction:column;gap:var(--grid-padding);margin-bottom:var(--grid-gap);padding-bottom:var(--grid-gap);text-decoration:none;@media (min-width:768px){flex-direction:row;gap:var(--grid-gap)}&:last-child{border-bottom:0;margin-bottom:0}img{border-radius:var(--border-radius);height:auto;@media (min-width:768px){width:200px}}.details{.inner-title{display:block;font-size:20px;font-weight:var(--font-weight-bold);margin-bottom:var(--grid-padding);text-decoration:underline}.description{color:var(--color-text)}}}}}.cheapest-by-county{p{display:block;margin-bottom:var(--grid-gap)}.form{display:flex;flex-direction:column;gap:var(--grid-gap);@media (min-width:768px){align-items:flex-end;flex-direction:row;justify-content:space-between}>*{flex-grow:1}}}.cheapest-district{align-items:center;border-bottom:1px solid var(--color-highlight);display:grid;gap:var(--grid-padding);grid-template:1fr/1fr auto;margin-bottom:15px;padding-bottom:15px;position:relative;&:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}a{font-size:18px;&:after{content:"";inset:0;position:absolute}}}.cheapest-overall{@media (min-width:768px){display:grid;grid-template:1fr/1fr 1fr 1fr;grid-gap:50px}}.contact{.success{text-align:center;p{font-weight:var(--font-weight-bold);margin-bottom:var(--grid-gap)}}form{margin:var(--grid-gap) auto 0 auto;max-width:700px;label{margin-top:var(--grid-gap);&:first-child{margin-top:0}}.form-actions{margin-top:var(--grid-gap);text-align:right}}}.district-councils-list{.intro{font-size:18px;margin-bottom:var(--grid-gap)}}.district-councils{.intro{font-size:18px;margin-bottom:var(--grid-gap)}.item-list{.item{align-items:center;border-bottom:1px solid var(--color-highlight);display:grid;grid-template-areas:"name name" "count averages";grid-template-columns:1fr auto;margin-bottom:15px;padding-bottom:15px;position:relative;@media (min-width:768px){align-items:center;grid-template-areas:"name averages" "count averages";grid-template-columns:1fr auto}&:last-child{border-bottom:0;margin-bottom:0}.name{display:block;font-size:18px;font-weight:var(--font-weight-bold);grid-area:name;margin-bottom:5px;&:after{content:"";inset:0;position:absolute}}.count{color:var(--color-lighter-text);font-size:14px;grid-area:count}.averages{display:flex;gap:5px;grid-area:averages;@media (min-width:768px){margin-left:auto}}}}}.error-page{.action{margin-top:var(--grid-gap);text-align:center}}.history{.intro-text{margin-bottom:var(--grid-gap)}.timeline{.timeline-item{border-bottom:1px solid var(--color-highlight);margin-bottom:var(--grid-gap);padding-bottom:var(--grid-gap);@media (min-width:768px){margin-bottom:100px;padding-bottom:100px}&:last-child{margin-bottom:0}@media (min-width:768px){align-items:center;display:flex;gap:var(--grid-gap)}.timeline-year{color:var(--color-highlight);font-size:48px;text-align:center;@media (min-width:768px){min-width:300px}img{border-radius:10px;display:block;margin:10px auto}}.timeline-content{p{margin-bottom:var(--grid-padding);&:last-child{margin-bottom:0}}}}}}.home-about{position:relative;p{margin-bottom:var(--grid-gap);@media (min-width:768px){padding-right:250px}}.scrap-wrap{align-items:flex-start;display:flex;gap:var(--grid-gap);justify-content:center;margin:20px auto;@media (min-width:768px){flex-direction:column;position:absolute;right:0;top:-35px}}.clipping{position:relative;width:172px;&:nth-child(2){margin-left:-37px;margin-top:-10px;@media (min-width:768px){margin-left:-10px;margin-top:-24px}}}.clipping-inner{background:#f5f0e8;border:1px solid #c8b89a;padding:10px 10px 6px;position:relative}.clipping:first-child .clipping-inner{transform:rotate(-2.5deg)}.clipping:nth-child(2) .clipping-inner{transform:rotate(1.8deg)}.clipping-inner:before{background-image:repeating-linear-gradient(0deg,transparent,transparent 19px,rgba(0,0,0,.04) 0,rgba(0,0,0,.04) 20px);content:"";inset:0;pointer-events:none;position:absolute;z-index:0}.clipping-img{background:#c8bfb0;display:block;filter:sepia(.2) contrast(.95);object-fit:cover}.clipping-img,.clipping-img-placeholder{border:1px solid #b0a090;height:100px;position:relative;width:100%;z-index:1}.clipping-img-placeholder{align-items:center;background:#d4cbbf;display:flex;justify-content:center;overflow:hidden}.clipping-date{border-top:1px solid #c0a880;color:#8a7a62;font-family:monospace;font-size:9px;margin-top:4px;padding-right:4px;padding-top:4px;position:relative;text-align:right;z-index:1}.tape-corner{background:hsla(43,44%,69%,.45);border:.5px solid hsla(43,32%,57%,.4);height:12px;position:absolute;width:28px;z-index:3}.clipping:first-child .tape-corner:first-of-type{left:-12px;top:1px;transform:rotate(-35deg)}.clipping:first-child .tape-corner:nth-of-type(2){right:-7px;top:-7px;transform:rotate(35deg)}.clipping:nth-child(2) .tape-corner:first-of-type{left:-5px;top:-5px;transform:rotate(-43deg)}.clipping:nth-child(2) .tape-corner:nth-of-type(2){right:-10px;top:-1px;transform:rotate(20deg)}}.home-alerts{.alert{border-bottom:1px solid var(--color-highlight);margin-bottom:15px;padding-bottom:15px;&:last-child{border-bottom:0;margin-bottom:0}.date{color:var(--color-lighter-text);font-size:12px;margin-top:5px}}.notifications-and-feed{font-size:14px;margin-left:auto;max-width:480px;@media (min-width:768px){max-width:300px}.notifications{align-items:center;display:flex;gap:var(--grid-padding);justify-content:flex-end}.error-message{background-color:var(--color-error);border-radius:var(--border-radius);color:#fff;font-size:12px;font-weight:var(--font-weight-bold);margin:0;max-height:0;opacity:0;padding:4px 5px;text-align:center;transition:all var(--anim-fast);&.visible{margin:5px 0;max-height:50px;opacity:1}}.feed{color:var(--color-lighter-text);font-size:12px;margin-top:10px;text-align:right}}}.home-brands{.home-brand-list{.brand-entry{align-items:center;border-bottom:1px solid var(--color-highlight);display:flex;gap:var(--grid-padding);justify-content:space-between;margin-bottom:15px;padding-bottom:15px;position:relative;&:last-child{border-bottom:0;margin-bottom:0}.brand-name{align-items:center;display:flex;flex-direction:column;flex-grow:1;font-size:14px;justify-content:center;text-align:center;width:74px;@media (min-width:375px){font-size:16px;width:auto}@media (min-width:480px){flex-direction:row;font-size:16px;gap:10px;justify-content:flex-start;text-align:left}@media (min-width:768px){font-size:18px}a:after{content:"";inset:0;position:absolute}}.brand-average{display:flex;flex-shrink:0;gap:5px}}}.notes{@media (min-width:768px){max-width:500px}}.bottom-actions{@media (min-width:768px){align-items:center;display:flex;flex-direction:row-reverse;gap:var(--grid-gap);justify-content:space-between}}}.home-numbers{.numbers{margin:0 auto;max-width:220px;@media (min-width:768px){align-items:center;display:flex;flex-wrap:wrap;gap:var(--grid-gap);justify-content:space-around;max-width:100%}.number{font-weight:var(--font-weight-bold);margin-bottom:var(--grid-gap);text-align:right;.value{font-size:58px;@media (min-width:768px){font-size:70px}.small{font-size:32px}}.label{border-top:1px solid var(--color-highlight);font-size:11px;margin-top:-8px;padding-top:2px;text-transform:uppercase;@media (min-width:768px){font-size:12px;padding-left:10px}}}}}.home-other-areas{.list{margin-top:var(--grid-gap);.entry{align-items:center;border-bottom:1px solid var(--color-highlight);display:flex;flex-direction:column;gap:var(--grid-padding);margin-bottom:var(--grid-gap);padding-bottom:var(--grid-gap);text-decoration:none;@media (min-width:768px){flex-direction:row;gap:var(--grid-gap)}&:last-child{border-bottom:0;margin-bottom:0}img{border-radius:var(--border-radius);height:auto;@media (min-width:768px){width:200px}}.details{.inner-title{display:block;font-size:20px;font-weight:var(--font-weight-bold);margin-bottom:var(--grid-padding);text-decoration:underline}.description{color:var(--color-text)}}}}}.mailing-remove{.action{margin-top:var(--grid-gap);text-align:center}}.price-update{.station-name{align-items:center;display:flex;font-size:18px;font-weight:var(--font-weight-bold);gap:var(--grid-padding);margin-bottom:20px;margin-top:-20px}.explanation{ul{font-size:14px;margin:var(--grid-padding) 0;li{display:flex;gap:var(--grid-padding);margin-bottom:var(--grid-padding);&:before{content:"• "}&:last-child{margin-bottom:0}}}}.form{margin-top:var(--grid-gap);.fuel-type{h2{border-bottom:1px solid var(--color-highlight);font-size:18px;margin-bottom:var(--grid-gap)}.fuel-price-input{align-items:center;display:grid;gap:var(--grid-padding);grid-template:1fr/40px auto 70px;margin-bottom:var(--grid-gap);input{text-align:center}}}.button{display:block;margin-left:auto}}}.search-results{.no-results{font-size:18px;font-weight:var(--font-weight-bold);padding-top:var(--grid-gap);text-align:center}}.station-map{margin-bottom:-30px;.actions{background:var(--color-deep-space-blue);border-radius:var(--border-radius);color:var(--color-bright-snow);display:flex;flex-direction:column;gap:var(--grid-gap);margin-top:var(--grid-padding);padding:var(--grid-padding);@media (min-width:768px){align-items:center;flex-direction:row;justify-content:space-between}form:first-child{@media (min-width:768px){width:500px}}form:nth-child(2){@media (min-width:768px){width:150px}}}.map{border-radius:var(--border-radius);height:calc(100vh - 200px);margin-top:-20px;min-height:300px;z-index:1;@media (min-width:768px){height:calc(100vh - 380px)}}.station-popup{>a{font-size:14px;font-weight:var(--font-weight-bold);gap:5px;margin-bottom:15px}.fuel-prices,>a{align-items:center;display:flex}.fuel-prices{gap:var(--grid-padding);justify-content:center}}.station-marker{align-items:center;background:var(--color-base);border-radius:8px;box-shadow:0 2px 6px rgba(0,0,0,.25);cursor:pointer;display:flex;flex-direction:column;justify-content:center;padding:5px 2px;position:relative;&:after{border:7px solid transparent;border-bottom:none;border-top-color:#fff;bottom:-7px;content:"";left:50%;position:absolute;transform:translateX(-50%)}&.scale{.fuel-price{display:none}}.image{background:var(--color-bright-snow);border-radius:2px;height:20px;margin-bottom:5px;width:20px;img{height:20px;width:20px}}}}.station{>.container{position:relative}.title{align-items:center;display:flex;font-size:22px;gap:var(--grid-padding);margin-bottom:var(--grid-padding);@media (min-width:768px){font-size:28px}&:after{display:none}}.distance,.updated-date{display:flex;font-size:13px;gap:10px;&:before{background-color:var(--color-text);content:"";display:inline-block;flex-shrink:0;height:16px;mask-image:url(/dist/images/icons/clock.svg);mask-position:center;mask-repeat:no-repeat;mask-size:16px;width:16px}}.distance{margin-top:5px;&:before{mask-image:url(/dist/images/icons/distance.svg)}}.top-actions{display:grid;gap:var(--grid-padding);grid-template:1fr/1fr 1fr;margin-top:var(--grid-gap);max-width:500px;@media (min-width:768px){grid-template:1fr/1fr;margin-top:0;position:absolute;right:10px;top:0;width:250px}.button{align-items:center;display:flex;font-size:14px;gap:5px;justify-content:center;padding:5px;width:100%;&:before{background-color:#000;content:"";display:inline-block;height:16px;mask-position:center;mask-repeat:no-repeat;mask-size:16px;width:16px}}.update-prices{&:before{mask-image:url(/dist/images/icons/tag.svg)}}.add-to-favorites{&:before{mask-image:url(/dist/images/icons/star.svg)}&.is-fav{&:before{mask-image:url(/dist/images/icons/star-filled.svg)}}}}.dark-bar{margin:var(--grid-gap) 0;.average{font-size:14px;margin-top:var(--grid-padding)}}.secondary-areas{@media (min-width:768px){display:grid;gap:50px;grid-template:1fr/1fr 1fr 1fr}>*{@media (min-width:768px){width:100%}}}.all-prices{ul{display:flex;flex-direction:column;gap:var(--grid-padding);li{align-items:center;display:flex;justify-content:space-between;.label{font-weight:var(--font-weight-bold)}}}.updated-by{font-size:12px;margin-top:var(--grid-gap);strong{align-items:center;display:inline-flex;&:after{background-color:var(--color-text);content:"";display:inline-block;flex-shrink:0;height:16px;mask-image:url(/dist/images/icons/verified.svg);mask-position:center;mask-repeat:no-repeat;mask-size:16px;width:16px}}a{color:var(--color-text)}}}.location{.address,.working-hours{display:flex;font-size:13px;gap:10px;margin-bottom:var(--grid-padding);&:before{background-color:var(--color-text);content:"";display:inline-block;flex-shrink:0;height:16px;mask-image:url(/dist/images/icons/store.svg);mask-position:center;mask-repeat:no-repeat;mask-size:16px;width:16px}}.working-hours{&:before{mask-image:url(/dist/images/icons/clock.svg)}}.map-actions{align-items:center;display:flex;flex-direction:column;gap:var(--grid-padding);margin:var(--grid-gap) auto 0 auto;max-width:220px;.button{text-align:center;width:100%}.map-links{display:flex;flex-direction:column;gap:var(--grid-padding);max-height:200px;opacity:1;overflow:hidden;padding:0 var(--grid-padding);transition:max-height var(--anim-normal);width:100%;&.collapsed{max-height:0;opacity:0}.button{justify-content:center;width:100%}}}}.services{.services-list{display:flex;flex-direction:column;gap:var(--grid-gap);.service-group{.service-type{border-bottom:2px solid var(--color-highlight);font-weight:var(--font-weight-bold);margin-bottom:var(--grid-padding)}ul{display:flex;flex-direction:column;gap:var(--grid-padding);li{font-size:14px}}}}}.other-stations{padding:0 20px;text-align:center}}.stats-average{p{margin-bottom:var(--grid-gap)}.quick-chart{height:250px;max-width:100%}.all-fuels-list{display:grid;gap:var(--grid-gap);grid-template:1fr/1fr 1fr;@media (min-width:768px){grid-template:1fr/1fr 1fr 1fr 1fr;max-width:100%}.stat{.label{font-size:13px;@media (min-width:480px){font-size:18px}&:after{margin-left:0;@media (min-width:480px){margin-left:10px}}}.text{font-size:12px;@media (min-width:480px){font-size:14px}}}}}.stats-charts{.chart-wrapper{margin:var(--grid-gap) calc(var(--grid-padding)*-1);overflow-x:scroll;padding-left:var(--grid-padding);padding-right:var(--grid-padding);width:100vw;-webkit-overflow-scrolling:touch;@media (min-width:768px){margin-left:0;margin-right:0;overflow-x:hidden;padding-left:0;padding-right:0;width:100%}}.brent-chart,.weekly-chart,.yearly-chart{height:400px;min-width:700px;width:100%}.chart-tip{align-items:center;display:flex;font-size:12px;justify-content:flex-start;margin-bottom:var(--grid-gap);margin-top:-20px;@media (min-width:700px){display:none}span{font-weight:var(--font-weight-bold);margin-right:3px}&:before,span{display:inline-block}&:before{background-color:var(--color-text);content:"";height:16px;margin-right:5px;mask-image:url(/dist/images/icons/idea.svg);mask-position:center;mask-repeat:no-repeat;mask-size:16px;width:16px}}.stats-trimester-select{align-items:center;background:var(--color-deep-space-blue);border-radius:var(--border-radius);color:var(--color-bright-snow);display:flex;gap:var(--grid-padding);justify-content:flex-end;margin-top:var(--grid-padding);padding:var(--grid-padding);.description{font-size:14px;font-weight:var(--font-weight-bold)}.select{width:220px}}}.stats-max-prices{text-align:left;.max-prices-list{display:grid;gap:var(--grid-gap);grid-template:1fr/1fr 1fr;margin:var(--grid-gap) 0;@media (min-width:768px){grid-template:1fr/1fr 1fr 1fr 1fr}.max-prices-entry{text-align:center;.label{font-size:14px;font-weight:var(--font-weight-bold);margin-bottom:var(--grid-padding);@media (min-width:480px){font-size:18px}}.date{font-size:12px;font-weight:var(--font-weight-bold);margin-top:var(--grid-padding);@media (min-width:480px){font-size:14px}}}}}.terms-privacy{p{display:block;margin-bottom:var(--grid-gap)}}.user-area{max-width:500px!important;.intro-text{font-size:18px;margin-bottom:var(--grid-gap);text-align:justify}.action-list{display:flex;flex-direction:column;gap:var(--grid-gap);.button{align-items:center;display:flex;gap:5px;justify-content:center;&:before{background-color:#000;content:"";display:inline-block;height:20px;mask-position:center;mask-repeat:no-repeat;mask-size:20px;width:20px}&.fuel:before{mask-image:url(/dist/images/icons/fuel-station.svg)}&.discounts:before{mask-image:url(/dist/images/icons/discount.svg)}&.data:before{mask-image:url(/dist/images/icons/person.svg)}&.new-station:before{mask-image:url(/dist/images/icons/add-location.svg)}&.logout:before{mask-image:url(/dist/images/icons/logout.svg)}}}.action-forms{.action-form{max-height:2500px;opacity:1;overflow:hidden;padding:var(--grid-gap) 0;transition:max-height var(--anim-normal),opacity var(--anim-normal),padding var(--anim-normal);&.collapsed{max-height:0;opacity:0;padding:0}&.form-station{.spacer{height:20px}}.form-explain{font-size:14px;margin-bottom:var(--grid-gap);text-align:justify}.button{display:block;margin-left:auto;margin-top:var(--grid-gap)}.success-message{background-color:var(--color-success);border-radius:var(--border-radius);color:var(--color-onyx);display:none;font-size:13px;font-weight:var(--font-weight-bold);margin-top:5px;padding:5px 10px;&.active{display:block}}}.email-change-otp{input{font-size:24px;text-align:center}}.flex-wrapper{align-items:center;display:flex;gap:var(--grid-padding);justify-content:space-between;margin:var(--grid-gap) 0;.form-switch{flex-shrink:0}}.delete-account{color:var(--color-error);cursor:pointer;font-size:12px;font-weight:var(--font-weight-bold);text-align:center;text-transform:uppercase;[data-theme=dark] &{background-color:var(--color-error);border-radius:var(--border-radius);color:#fff;font-weight:var(--font-weight-bold);padding:4px 5px;text-align:center}}}.fav-section{.button{justify-content:center;width:100%}}.form-discounts{.discounts-list{margin-bottom:var(--grid-gap);.discount-item{align-items:center;display:flex;gap:var(--grid-padding);justify-content:space-between;.name{font-size:14px;font-weight:var(--font-weight-bold);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.actions{align-items:center;display:flex;gap:var(--grid-padding);.delete,.edit{background-color:var(--color-text);cursor:pointer;height:24px;mask-position:center;mask-repeat:no-repeat;mask-size:24px;width:24px}.edit{mask-image:url(/dist/images/icons/edit.svg)}.delete{mask-image:url(/dist/images/icons/delete.svg)}}}}.new-discount-action{margin:0 auto;max-width:300px;.button{font-size:14px;padding:5px;text-align:center}}.form{margin-top:var(--grid-gap);.entry-block{margin-bottom:var(--grid-gap)}.mini-label{font-size:12px;margin-bottom:5px;padding-left:10px}.discount-values{align-items:center;display:flex;gap:var(--grid-padding);justify-content:space-between;input{text-align:center}}.advanced-mode-entry{margin-bottom:var(--grid-gap)}}}.discount-explain{display:inline-block;&:before{position:unset}}}