/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing

# Base
	- Typography
	- Elements
	- Utility Classes
	- Buttons
	- Links
	- Forms
	- Icons
	
# Components
	- Navigation
	- Posts and pages
	- Captions
	- Header
	- MainSearch
	- Main Categories Menu
	- Badges 
	- Breadcrumbs
	- Footer
	- Marketing Popup
	- Banner Blocks
	
# Woocommerce
	- Reviews & Ratings
	- Notices & Messages
	- Shop Tables
	- Currency and Country Selectors

# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic + Variables
--------------------------------------------------------------*/

:root,
*::before,
*::after {
  /*Primary Colours*/
  --accent-clr: #ff3d00;
  --ultra-light-grey-clr: #f5f5f8;
  --very-light-grey-clr: #dbdbdb;
  --light-grey-clr: #9e9e9c;
  --medium-grey-clr: #4a4d54;
  --dark-grey-clr: #1c1c1c;

  --transparent-grey-clr: rgba(34, 34, 34, 0.15);

  --accent-hover-clr: #ff784d;
  --dark-grey-hover-clr: #7c7f84;

  /*Secondary Colours*/
  --bright-blue-clr: #00c2ff;
  --dark-blue-clr: #005fbd;
  --bright-green-clr: #00ff3d;
  --medium-dark-green-clr: #79c501;
  --dark-green-clr: #03af75;
  --bright-yellow-clr: #ffbd00;
  --dark-orange-clr: #fd9800;
  --light-orange-clr: #fecf84;
  --very-light-orange-clr: #fee5bf;
  --bright-red-clr: #dd2c00;
  --dark-red-clr: #aa151b;
  --purple-clr: #9d34da;
  --light-purple-clr: #eacffb;

  /*Terc Colours*/
  --fade-blue-clr: #ebf5ff;
  --fade-green-clr: #f2faf7;
  --fade-green-darker-clr: #e6efd7;
  --fade-red-clr: #fdf2f2;
  --fade-yellow-clr: #fffbeb;
  --fade-orange-clr: #fff7eb;
  --fade-grey-blue-clr: #e5e9f2;
  --fade-purple-clr: #f0e1f9;

  --background-color: #f5f5f8;
  --background-grey-clr: #eee;

  --text-black-clr: #1c1c1c;
  --text-white-clr: #fafafa;

  /*Sizes*/
  --very-big: 4rem;
  --medium-big: 3rem;
  --semi-big: 2.5rem;
  --big: 2rem;
  --medium: 1.5rem;
  --small: 1.25rem;
  --default: 1rem;
  --default-mobile: 14px;

  /*Boxes style*/
  --box-radius: 5px;
  --border: 1px solid var(--very-light-grey-clr);
  --border-transparent: 1px solid white;
  --box-shadow: 0 4px 20px var(--transparent-grey-clr);

  /*Animations*/
  --bezier: cubic-bezier(0.345, 0.115, 0.135, 1.42);
  --bezier-nobounce: cubic-bezier(0.34, 0.05, 0.52, 1);

  scroll-padding: 0; /* Fix for autofocus on position sticky header */
}

.mobile {
  --very-big: 2.5rem;
  --medium-big: 2.25rem;
  --semi-big: 2rem;
  --big: 1.5rem;
  --medium: 1.25rem;
  --small: 1.15rem;
}

@font-face {
  font-family: "GPBox V3 Next";
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url(../woff2/flama-basic.woff2) format("woff2"),
    url(../woff/flama-basic.woff) format("woff");
}

@font-face {
  font-family: "GPBox V3 Next";
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src: url(../woff2/flama-semibold.woff2) format("woff2"),
    url(../woff/flama-semibold.woff) format("woff");
}

@font-face {
  font-family: "GPBox V3 Next";
  font-weight: 900;
  font-style: normal;
  font-display: swap;
  src: local("Telegraf Black"),
    url(../woff2/telegraf-black.woff2) format("woff2"),
    url(../woff/telegraf-black.woff) format("woff");
}

/*--------------------------------------------------------------
# Reset
--------------------------------------------------------------*/
html,
body,
p,
ol,
ul,
li,
dl,
dt,
dd,
blockquote,
figure,
fieldset,
legend,
textarea,
pre,
iframe,
hr,
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  padding: 0;
  border: 0;
}

* {
  border: 0;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  outline: 0;
  margin: 0;
  padding: 0;
  -webkit-user-drag: none;
}

/* Normalize
--------------------------------------------- */
/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  scroll-behavior: smooth;

  /* Scroll offset for href's pointing to id's and sticky header */
  scroll-padding-top: 160px;
}

/* Sections
	 ========================================================================== */
/**
 * Render the `main` element consistently in IE.
 */
main {
  display: block;
}

/* Grouping content
========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `rem` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace;
  font-size: 1rem;
}

/* Text-level semantics
========================================================================== */

/*
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: 700;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `rem` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace;
  font-size: 1rem;
}

/**
 * Add the correct font size in all browsers.
 */
small,
.small {
  font-size: 14px;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25rem;
}

sup {
  top: -0.5rem;
}

.single-line {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Forms
========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
  margin: 0;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

button.no-button-appearance {
  -webkit-appearance: none !important;
  background: none !important;
  outline: none !important;
  border-radius: 0 !important;
}

/**
 * Style the scrollbar to a minimum
 */
.desktop .scrollbar-min::-webkit-scrollbar {
  width: 5px;
}
.desktop .scrollbar-min::-webkit-scrollbar-thumb {
  border-radius: 3px;
  background-color: transparent;
}
.desktop .scrollbar-min::-webkit-scrollbar-track {
  border-radius: 3px;
}
.desktop .scrollbar-min:hover::-webkit-scrollbar-thumb,
.desktop .scrollbar-min.scrollbar-always::-webkit-scrollbar-thumb {
  background-color: #e0e0e0;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted var(--very-light-grey-clr);
}

/**
 * Remove pointerevents when .disabled is present
 */
button.disabled,
a.disabled,
span.disabled {
  pointer-events: none;
}

/**
 * Soft disable inputs without the htlm disable attribute. Form parser uses the date, user is readonly.
 * Using disabled attribute makes the input not parsable with the form
 */

input[type="text"].soft-disabled {
  pointer-events: none;
  background: var(--ultra-light-grey-clr);
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
  padding: 0;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *		`fieldset` elements in all browsers.
 */
legend {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto;
}

/**
 * Add a default custom quote styling
 */
blockquote {
  font-size: var(--medium);
  display: block;
  margin-top: 0.2rem;
}

blockquote::before {
  content: "\201d";
  font-size: 5rem;
  color: var(--accent-clr);
  position: relative;
  font-weight: 900;
  margin-right: 0.5rem;
  line-height: 1;
  display: inline-block;
  max-height: 45px;
  overflow: hidden;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  height: 0px;
  width: 0px;
  margin: 0;
  padding: 20px 0 0 20px;
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  -o-appearance: none;
  cursor: pointer;
  border-radius: 3px;
}
[type="checkbox"]:checked,
[type="radio"]:checked {
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  -o-appearance: none;
}

[type="checkbox"]::before {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' viewBox='0 0 20 20' focusable='false'%3E%3Cpath stroke='var(--dark-grey-clr, %231c1c1c)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M17 1H3a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2V3a2 2 0 00-2-2z'/%3E%3C/svg%3E ");
  background-size: contain;
  height: 20px;
  width: 20px;
  top: 0;
  left: 0;
  z-index: 1;
  position: absolute;
  background-repeat: no-repeat;
}
[type="checkbox"]:checked::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='white' viewBox='0 0 18 18' focusable='false'%3E%3Cpath fill='var(--dark-grey-clr, %231c1c1c)' fill-rule='evenodd' d='M2 0h14a2 2 0 012 2v14a2 2 0 01-2 2H2a2 2 0 01-2-2V2a2 2 0 012-2zm11.707 6.707a1 1 0 00-1.414-1.414L7.5 10.086 5.707 8.293a1 1 0 00-1.414 1.414l2.5 2.5a1 1 0 001.414 0l5.5-5.5z' clip-rule='evenodd'/%3E%3C/svg%3E%0A");
}
[type="checkbox"]:disabled::before {
  content: "";
  background-image: none;
  background: var(--very-light-grey-clr);
  border-radius: 5px;
  background-size: contain;
  height: 20px;
  width: 20px;
  top: 50%;
  left: 50%;
  z-index: 1;
  position: absolute;
  background-repeat: no-repeat;
  transform: translate(-50%, -50%);
}

[type="radio"]::before {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 24 24' focusable='false'%3E%3Ccircle cx='12' cy='12' r='10' stroke='var(--dark-grey-clr, %231c1c1c)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3C/svg%3E");
  background-size: contain;
  height: 24px;
  width: 24px;
  top: 0;
  left: 0;
  z-index: 1;
  position: absolute;
  background-repeat: no-repeat;
}

[type="radio"]:checked::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 24 24' focusable='false'%3E%3Ccircle cx='12' cy='12' r='10' fill='var(--dark-grey-clr, %231c1c1c)' stroke='var(--dark-grey-clr, %231c1c1c)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3Ccircle cx='12' cy='12' r='4' fill='%23fff'/%3E%3C/svg%3E%0A");
}

[type="radio"]:focus,
[type="radio"]:focus-visible {
  outline: none;
}

[type="checkbox"]:focus,
[type="checkbox"]:focus-visible {
  outline: 0;
  -webkit-box-shadow: inherit;
  box-shadow: inherit;
  box-shadow: 0 0 0 2px white, 0 0 0 4px var(--dark-grey-clr);
  border-radius: 2px;
}

/**
 * Custom slider from checkbox
 */
input.gpbox-slider[type="checkbox"] {
  width: 3rem !important;
  min-width: 3rem !important;
  height: 1.5rem !important;
  background: white !important;
  border: 2px solid var(--very-light-grey-clr) !important;
  border-radius: 50px !important;
  transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out,
    box-shadow 0.15s ease-in-out !important;
}

input[type="checkbox"].gpbox-slider:before {
  width: 1rem;
  height: 1rem;
  border-radius: 1.5rem;
  color: var(--very-light-grey-clr);
  background-color: var(--very-light-grey-clr);
  transition: transform 0.15s ease-in-out, background-color 0.15s ease-in-out,
    border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  background-image: none;
  -webkit-transform: translate(-1.2rem, -50%);
  -ms-transform: translate(-1.2rem, -50%);
  transform: translate(-1.2rem, -50%);
  top: 50%;
  left: 50%;
}

input.gpbox-slider[type="checkbox"]:checked,
input.gpbox-slider[type="checkbox"]:not(:disabled):active {
  color: white !important;
  background-color: var(--medium-dark-green-clr) !important;
  border-color: var(--medium-dark-green-clr) !important;
}

input.gpbox-slider[type="checkbox"]:checked:before {
  background-color: white !important;
  -webkit-transform: translate(0.28rem, -50%);
  -ms-transform: translate(0.28rem, -50%);
  transform: translate(0.28rem, -50%);
}

input.gpbox-slider[type="checkbox"]:focus {
  box-shadow: 0 0 0 3px rgb(133 79 255 / 10%) !important;
}

input.gpbox-slider[type="checkbox"]:focus:not(:checked) {
  border-color: var(--medium-dark-green-clr) !important;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: 0px;
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration,
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-results-button,
[type="search"]::-webkit-search-results-decoration {
  display: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

/**
 * Correct z-index of recaptcha badge on forms and hide it from everywhere
 */
.grecaptcha-badge {
  display: none;
  z-index: 9999;
}

/**
 * Create general form validation styling
 */
.input-validation {
  position: relative;
}

.input-validation::after {
  content: "";
  position: absolute;
  right: 10px;
  height: 18px;
  width: 18px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  opacity: 0;
  -webkit-transition: opacity 295ms var(--bezier);
  -o-transition: opacity 295ms var(--bezier);
  transition: opacity 295ms var(--bezier);
  pointer-events: none;
  background-repeat: no-repeat;
}

.input-validation.error::after {
  background-image: url("../svg/error.svg");
  opacity: 1;
}

.input-validation.error input,
input.wcfm_validation_failed,
input.validation_error {
  box-shadow: 0 0 0 2px var(--bright-red-clr);
}

.input-validation.error input:focus,
.input-validation.error input:focus-visible,
input.wcfm_validation_failed:focus,
input.wcfm_validation_failed:focus-visible,
input.validation_error:focus,
input.validation_error:focus-visible {
  box-shadow: 0 0 0 2px var(--dark-grey-clr);
  outline: none;
}

.input-validation.valid::after {
  background-image: url("../svg/check-circle.svg");
  opacity: 1;
}

/**
 * Create general messages feedback alerts
 */
.gpbox-message,
.woocommerce-notices-wrapper > ul,
.woocommerce-notices-wrapper > div,
.woocommerce-notices-wrapper > p,
.woocommerce-info,
.woocommerce-error,
.woocommerce-success {
  clear: both;
  list-style: none;
  margin: 0;
  border-radius: 8px;
  padding: 0.6rem 1rem;
  margin-bottom: 2rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.woocommerce-notices-wrapper > ul > li,
.woocommerce-NoticeGroup > ul > li,
ul.woocommerce-error > li,
ul.woocommerce-info > li,
ul.woocommerce-success > li {
  width: calc(100% - 20px - 0.5rem);
  margin-left: calc(20px + 0.5rem);
  padding-top: 0.25rem;
  text-align: left;
}

.woocommerce-notices-wrapper > ul > li:first-child,
.woocommerce-NoticeGroup > ul > li:first-child,
ul.woocommerce-error > li:first-child,
ul.woocommerce-info > li:first-child,
ul.woocommerce-success > li:first-child {
  margin-left: 0;
  padding-top: 0;
}

.gpbox-message:before,
.woocommerce-notices-wrapper > ul:before,
.woocommerce-notices-wrapper > div:before,
.woocommerce-notices-wrapper > p:before,
.woocommerce-info:before,
.woocommerce-notices-wrapper .woocommerce-info:before,
.woocommerce-warning:before,
.woocommerce-notices-wrapper .woocommerce-warning:before,
.woocommerce-error::before,
.woocommerce-notices-wrapper .woocommerce-error:before,
.woocommerce-success::before,
.woocommerce-notices-wrapper .woocommerce-success:before {
  content: "";
  min-width: 20px;
  width: 20px;
  height: 20px;
  position: relative;
  margin-right: 0.5rem;
  margin-top: 0.15rem;
  background-repeat: no-repeat;
  background-size: 100%;
}

.success-message,
.woocommerce-message,
.woocommerce-success {
  background-color: var(--fade-green-darker-clr);
  color: var(--medium-dark-green-clr);
}

.success-message::before,
.woocommerce-message::before,
.woocommerce-success::before {
  margin-top: 0.2rem;
  background-image: url("../svg/check-circle.svg");
}

.woocommerce-info {
  background-color: var(--fade-blue-clr);
  color: var(--dark-blue-clr);
  margin: 2.5rem 0;
}

.woocommerce-warning {
  background-color: var(--ultra-light-grey-clr);
  color: var(--medium-grey-clr);
  margin: 2.5rem 0;
}

.woocommerce-info:before,
.woocommerce-notices-wrapper .woocommerce-info:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 24 24' focusable='false'%3E%3Cpath fill='var(--dark-blue-clr, %23005fbd)' fill-rule='evenodd' d='M12.707 16.707A1 1 0 0111 16v-4a1 1 0 012 0v4a1 1 0 01-.293.707zm4.849 3.608A10 10 0 116.444 3.685a10 10 0 0111.112 16.63zM16.445 5.348a8 8 0 10-8.89 13.304 8 8 0 008.89-13.304zM12 7a1 1 0 100 2 1 1 0 000-2z' clip-rule='evenodd'/%3E%3C/svg%3E%0A");
}
.woocommerce-warning:before,
.woocommerce-notices-wrapper .woocommerce-warning:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 24 24' focusable='false'%3E%3Cpath fill='var(--medium-grey-clr, %234a4d54)' fill-rule='evenodd' d='M12.707 16.707A1 1 0 0111 16v-4a1 1 0 012 0v4a1 1 0 01-.293.707zm4.849 3.608A10 10 0 116.444 3.685a10 10 0 0111.112 16.63zM16.445 5.348a8 8 0 10-8.89 13.304 8 8 0 008.89-13.304zM12 7a1 1 0 100 2 1 1 0 000-2z' clip-rule='evenodd'/%3E%3C/svg%3E%0A");
}

.error-message,
.woocommerce-error {
  background-color: var(--fade-red-clr);
  color: var(--bright-red-clr);
}
.error-message::before,
.woocommerce-error::before {
  background-image: url("../svg/error.svg");
}

.woocommerce-error a {
  color: var(--bright-red-clr);
  font-weight: 700;
}
.woocommerce-error a:hover {
  opacity: 0.7;
}

/* Icons
========================================================================== */
/*
 * Add block to all svg icons.
 */
.gpbox-icon,
.gpbox-icon svg {
  display: block;
}
.gpbox-icon:not(.interactive-svg) svg {
  pointer-events: none;
}

.gpbox-icon.accent-text svg path {
  stroke: var(--accent-clr);
}

.accent-icon-big svg {
  width: 40px;
  height: 40px;
}

.icon-small svg {
  height: 20px;
  width: 20px;
}

.accent-icon:not(.accent-icon-fill) svg path {
  stroke: var(--accent-clr);
}

.accent-icon-fill svg path {
  fill: var(--accent-clr);
}

.grey-icon-stroke svg path {
  stroke: var(--light-grey-clr);
}

.gpbox-icon.white-stroke svg path {
  stroke: var(--text-white-clr);
}

/* 
* General icons - No background, ultra-light-grey hover effect
*/
.bg-icon {
  border: none;
  background: none;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: 40px;
  width: 40px;
  z-index: 0;
  border-radius: 50px;
}

.bg-icon-text {
  width: unset;
  padding: 0 1rem;
  line-height: 40px;
  white-space: nowrap;
  display: block;
}

.desktop .bg-icon-text-narrow {
  width: unset;
  padding-left: 12px;
  padding-right: 5px;
  line-height: 40px;
}

.desktop .bg-icon-text-narrow:focus,
.desktop .bg-icon-text-narrow:focus-visible {
  outline: none;
}

.bg-icon-text-aligned {
  margin-left: -1rem;
}

.bg-icon-text-aligned-right {
  margin-right: -1rem;
}

.bg-icon-text-aligned-top {
  margin-top: -0.75rem;
  margin-bottom: -0.75rem;
}

.bg-icon:before,
.bg-text:before {
  content: "";
  background-color: var(--ultra-light-grey-clr);
  border: inherit;
  border-radius: inherit;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50px;
  z-index: -1;
  -webkit-transition: opacity 150ms ease-out,
    -webkit-transform 200ms var(--bezier);
  transition: opacity 150ms ease-out, -webkit-transform 200ms var(--bezier);
  -o-transition: transform 200ms var(--bezier), opacity 150ms ease-out;
  transition: transform 200ms var(--bezier), opacity 150ms ease-out;
  transition: transform 200ms var(--bezier), opacity 150ms ease-out,
    -webkit-transform 200ms var(--bezier);
  -webkit-transform: scale(0.7) perspective(1px);
  transform: scale(0.7) perspective(1px);
  opacity: 0;
  pointer-events: none;
}
.bg-icon.transparent-background:before,
.bg-text.transparent-background:before {
  background-color: rgba(255, 255, 255, 0.2);
}

.bg-icon-flat {
  width: unset;
  min-height: 40px;
  height: unset;
  padding: 6px 1.25rem;
  white-space: nowrap;
  display: block;
}

.bg-icon-flat:before,
.bg-icon-flat:focus,
.bg-icon-flat:active,
.bg-icon-flat:focus-visible {
  border-radius: 0px !important;
}

.bg-icon:hover,
.bg-text:hover {
  cursor: pointer;
}

@media (hover: hover) and (pointer: fine) {
  .bg-icon:hover:before,
  .bg-text:hover:before,
  .bg-icon.active:before,
  .bg-text.active:before {
    opacity: 1;
    -webkit-transform: scale(1) perspective(1px);
    transform: scale(1) perspective(1px);
  }

  .bg-icon.darker:hover:before,
  .bg-text.darker:hover:before,
  .bg-icon.darker.active:before,
  .bg-text.darker.active:before {
    background-color: var(--very-light-grey-clr);
  }

  .desktop
    .bg-icon-text-narrow:focus:before
    .desktop
    .bg-icon-text-narrow:focus-visible:before {
    opacity: 1;
    -webkit-transform: scale(1) perspective(1px);
    transform: scale(1) perspective(1px);
  }
}

.white-icon:not(.white-icon-only) {
  width: 24px;
  height: 24px;
  min-width: 24px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background-color: var(--light-grey-clr);
  color: var(--text-white-clr);
  border-radius: 50%;
}

.white-icon svg > path {
  stroke: var(--text-white-clr);
}

.white-icon.white-icon-fill svg > path {
  stroke: unset;
  fill: var(--text-white-clr);
}

.gpbox-icon.w-24 svg {
  width: 24px;
  height: 24px;
}

@media screen and (max-width: 37.5rem) {
  .bg-icon-text {
    padding: 0 5px;
  }
  .bg-icon-text-aligned {
    padding: 0 2rem 0 1rem;
  }
}

/* 
* White bubble icons
*/
.white-bubble:not(.gpbox-icon) {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: 2.75rem;
  width: auto;
  padding: 0 1rem;
  line-height: 40px;
  white-space: nowrap;
  background-color: #fff;
  border-radius: 5rem;
  -webkit-box-shadow: 0 6px 8px 0 rgba(0, 0, 0, 0.2);
  box-shadow: 0 6px 8px 0 rgba(0, 0, 0, 0.2);
}

.gpbox-icon.white-bubble {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: 2.75rem;
  width: 2.75rem;
  background-color: #fff;
  border-radius: 50%;
  -webkit-box-shadow: 0 6px 8px 0 rgba(0, 0, 0, 0.2);
  box-shadow: 0 6px 8px 0 rgba(0, 0, 0, 0.2);
  -webkit-transition: -webkit-transform 195ms var(--bezier-nobounce);
  transition: -webkit-transform 195ms var(--bezier-nobounce);
  -o-transition: transform 195ms var(--bezier-nobounce);
  transition: transform 195ms var(--bezier-nobounce);
  transition: transform 195ms var(--bezier-nobounce),
    -webkit-transform 195ms var(--bezier-nobounce);
}

.gpbox-icon.white-bubble.small-bubble {
  height: 2rem;
  width: 2rem;
}

@media (hover: hover) and (pointer: fine) {
  .gpbox-icon.white-bubble:not(.bg-icon):hover {
    -webkit-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);
    -webkit-box-shadow: 0 6px 8px 0 rgba(0, 0, 0, 0.2);
    box-shadow: 0 6px 8px 0 rgba(0, 0, 0, 0.2);
  }
}

/*
 * Add most used icons as pseudoelements for ease of use
 */
.right-chevron::after {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16' focusable='false'%3E%3Cpath stroke='var(--dark-grey-clr, %231c1c1c)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M6 12l4-4-4-4'/%3E%3C/svg%3E ");
  position: absolute;
  width: 16px;
  height: 16px;
  right: 18px;
  background-repeat: no-repeat;
}
.right-arrow::after {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16' focusable='false'%3E%3Cpath stroke='var(--dark-grey-clr, %231c1c1c)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M6 12l4-4-4-4'/%3E%3C/svg%3E ");
  position: absolute;
  width: 16px;
  height: 16px;
  right: 18px;
  background-repeat: no-repeat;
}

section.section-icons {
  content-visibility: auto;
  contain-intrinsic-size: auto 408px;
}

/* Utility classes
--------------------------------------------- */
/* Container widths */
.mw-container {
  max-width: 1600px;
  margin: 0 auto;
  width: 100%;
  padding: 0 40px;
  overflow: hidden;
}
.mw-container-product {
  max-width: 1600px;
  margin: 0 auto;
  width: 100%;
  padding: 0 40px;
}
@media screen and (max-width: 37.5rem) {
  .mw-container,
  .mw-container-product {
    padding: 0 0.75rem;
  }
}
@media screen and (min-width: 37.5rem) and (max-width: 80rem) {
  .mw-container,
  .mw-container-product {
    padding: 0 1.5rem;
  }
}

/* Masterhead exception for tippy on main-nav */
#masthead .mw-container {
  overflow: unset;
}

/* Widths */
.mw-400 {
  max-width: 400px;
}
.mw-550 {
  max-width: 550px;
}
.mw-650 {
  max-width: 650px;
}
.mw-850 {
  max-width: 900px;
}
.mw-1000 {
  max-width: 1000px;
}
.mw-1100 {
  max-width: 1100px;
}
.mw-100p {
  max-width: 100%;
}

.minw-0 {
  min-width: 0;
}

/* Device Specific */
.mobile-only {
  display: none !important;
}
.tablet-only {
  display: none !important;
}

/* Colours Text&Background */
.accent-text {
  color: var(--accent-clr) !important;
  font-weight: 400;
}

@media (hover: hover) and (pointer: fine) {
  a:not(.btn-small, .bg-icon).accent-text:hover {
    color: var(--accent-hover-clr) !important;
    cursor: pointer;
  }
}

.white-text {
  color: var(--text-white-clr);
}

.black-text {
  color: var(--text-black-clr);
}

.red-text {
  color: var(--bright-red-clr);
}

.bg-icon.red-text:before {
  background-color: var(--fade-red-clr);
}

.semibold-text {
  font-weight: 700;
}

.regular-text {
  font-weight: 400;
}

.grey-text {
  color: var(--light-grey-clr);
}

.grey-box {
  background: var(--ultra-light-grey-clr);
  border-radius: 10px;
  padding: 1.5rem;
  overflow: hidden;
}

.dark-box {
  background: var(--dark-grey-clr);
  color: var(--text-white-clr);
}

.light-bg {
  background: var(--ultra-light-grey-clr);
}
.br-50 {
  border-radius: 50px;
}

/* Element statusses */
.fadein {
  opacity: 0;
  -webkit-transition: opacity 250ms ease-out;
  -o-transition: opacity 250ms ease-out;
  transition: opacity 250ms ease-out;
}

.fadeout {
  opacity: 1;
  will-change: opacity;
  -webkit-transition: opacity 250ms ease-out;
  -o-transition: opacity 250ms ease-out;
  transition: opacity 250ms ease-out;
}

.hidden {
  opacity: 0;
}

.display-none {
  display: none !important;
}

.show {
  opacity: 1;
  -webkit-transform: translateY(0px) scale(1) perspective(1px);
  transform: translateY(0px) scale(1) perspective(1px);
  -webkit-transition-delay: 75ms;
  -o-transition-delay: 75ms;
  transition-delay: 75ms;
}

/* Element flex aligns*/
.flex-align {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  display: -webkit-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: distribute;
  justify-content: space-around;
}
.flex-align-center {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.flex-align-center-top {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.flex-align-between {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.flex-align-start {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  position: relative;
}
.flex-align-end {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}
.flex-align-end-bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}
.flex-align-top {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.flex-align-start-bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}
.flex-align-start-top {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}
.flex-wrap {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.flex-stretch {
  justify-content: stretch;
  align-items: stretch;
}

.flex-shrink {
  flex-shrink: 1;
  overflow: hidden;
}

.flex-shrink-0 {
  flex-shrink: 0;
}

.flex-grow {
  flex-grow: 1;
}

.flex-align-baseline {
  align-items: baseline;
}

.flex-column {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  position: relative;
}
.flex-column-center {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: relative;
}
.flex-column-start {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}

.flex-column-start-center {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}

.gap-5 {
  gap: 0.5rem;
}
.gap-0875 {
  gap: 0.875rem;
}
.gap-10 {
  gap: 1rem;
}
.gap-15 {
  gap: 1.5rem;
}

.fluid {
  width: 100%;
}

.half-fluid {
  width: calc(50% - 1rem);
}

.fluid-60 {
  width: 60%;
}

.half-fluid:first-child {
  margin-right: 1rem;
}
.half-fluid:last-child {
  margin-left: 1rem;
}

.inline-block {
  display: inline-block !important;
}

/* Position */
.relative {
  position: relative;
}
.absolute {
  position: absolute;
}

.z0 {
  z-index: 0;
}

.z1 {
  z-index: 1;
}

.z2 {
  z-index: 2;
}

/* Spacing stuff */
.nm-ni {
  /* No margin without important*/
  margin: 0;
}

.margin-center {
  margin: 0 auto;
}
.align-center {
  text-align: center;
}
.align-left {
  text-align: left;
}
.align-right {
  text-align: right !important;
}

.mr-2 {
  margin-right: 0.2rem;
}

.mr-025 {
  margin-right: 0.25rem;
}

.mr-5,
.mr-8 {
  margin-right: 0.5rem;
}
.mr-0875 {
  margin-right: 0.875rem;
}
/* mr-14 backward compatibility for gpb-print-on-demand */
.mr-10,
.mr-14 {
  margin-right: 1rem;
}
.mr-15,
.mr-18 {
  margin-right: 1.5rem;
}
.mr-25 {
  margin-right: 2.5rem;
}
.ml-2 {
  margin-left: 0.2rem;
}
.ml-5 {
  margin-left: 0.5rem;
}
.ml-0875 {
  margin-left: 0.875rem;
}
.ml-10 {
  margin-left: 1rem;
}
.ml-15 {
  margin-left: 1.5rem;
}
.ml-20 {
  margin-left: 2rem;
}
.ml-25 {
  margin-left: 2.5rem;
}
.mb-2 {
  margin-bottom: 0.2rem;
}
.mb-4 {
  margin-bottom: 0.4rem;
}
.mb-5 {
  margin-bottom: 0.5rem;
}
.mb-8 {
  margin-bottom: 0.8rem;
}
.mb-10 {
  margin-bottom: 1rem;
}
.mb-15 {
  margin-bottom: 1.5rem;
}
.mb-20 {
  margin-bottom: 2rem;
}
.mb-25 {
  margin-bottom: 2.5rem;
}
.mb-30 {
  margin-bottom: 3rem;
}

.mb-40 {
  margin-bottom: 4rem;
}
.mb-60 {
  margin-bottom: 6rem;
}
.mb-80 {
  margin-bottom: 8rem;
}
.mb-100 {
  margin-bottom: 10rem;
}
.mb-120 {
  margin-bottom: 12rem;
}
.mt-2 {
  margin-top: 0.25rem;
}
.mt-4 {
  margin-top: 0.4rem;
}
.mt-5 {
  margin-top: 0.5rem;
}
.mt-8 {
  margin-top: 0.8rem;
}
.mt-10 {
  margin-top: 1rem;
}
.mt-12 {
  margin-top: 1.25rem;
}
.mt-15 {
  margin-top: 1.5rem;
}
.mt-20 {
  margin-top: 2rem;
}
.mt-25 {
  margin-top: 2.5rem;
}
.mt-30 {
  margin-top: 3rem;
}
.mt-40 {
  margin-top: 4rem;
}
.pr-25p {
  padding-right: 25%;
}
.pr-10 {
  padding-right: 1rem;
}
.pr-15 {
  padding-right: 1.5rem;
}
.pr-20 {
  padding-right: 2rem;
}
.pr-25 {
  padding-right: 2.5rem;
}
.pl-15 {
  padding-left: 1.5rem;
}
.pl-25 {
  padding-left: 2.5rem;
}
.pt-40 {
  padding-top: 4rem;
}
.pt-60 {
  padding-top: 6rem;
}
.pt-140 {
  padding-top: 14rem;
}

.overflow-visible {
  overflow: visible;
}

.overflow-hidden {
  overflow: hidden;
}

/* Round */
.round {
  border-radius: 50%;
}

.nowrap {
  white-space: nowrap;
}

/* Border */
.vertical-border > * {
  border-left: var(--border);
  padding: 0rem 0.8rem;
  line-height: 1rem;
}
.vertical-border > :first-child {
  border-left: none;
  padding-left: 0;
}
.vertical-border > :last-child,
body.mobile .vertical-border > .asmall:not(.desktop-only):nth-child(3) {
  padding-right: 0;
}

.border-bottom {
  border-bottom: var(--border);
  padding-bottom: 1.5rem;
}

.border-bottom-pb-10 {
  border-bottom: var(--border);
  padding-bottom: 1rem;
}

.border-bottom-pb-5 {
  border-bottom: var(--border);
  padding-bottom: 0.5rem;
}

/* Removing spacings */
.no-focus:focus,
.no-focus:focus-visible {
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}

.nb {
  /* No border */
  border: none !important;
}
.nm {
  /* No margin */
  margin: 0 !important;
}
.np {
  /* No padding */
  padding: 0 !important;
}
.no-ul {
  list-style: none;
}

/* Cursor behaviour */
.pointer {
  cursor: pointer;
}

/* Font sizes */
.big-text {
  font-size: var(--big);
}

.medium-text {
  font-size: var(--medium);
}
.rotate-45n {
  transform: rotate(-45deg);
  transform-origin: center center;
}
.rotate-45 {
  transform: rotate(45deg);
  transform-origin: center center;
}
.rotate-90 {
  transform: rotate(90deg);
  transform-origin: center center;
}
.rotate-180 {
  transform: rotate(180deg);
  transform-origin: center center;
}
.rotate-270 {
  transform: rotate(270deg);
  transform-origin: center center;
}
.right-arrow-after::after {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 24 24' focusable='false'%3E%3Cpath stroke='var(--dark-grey-clr, %231c1c1c)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 12h14M12 5l7 7-7 7'/%3E%3C/svg%3E%0A");
  background-size: 100%;
  height: 18px;
  width: 18px;
  position: relative;
  margin-left: 0.25rem;
  display: flex;
}

/* Interactive
========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}

/* Misc
========================================================================== */

/**
 * Add the correct display in IE 10+.
 */
template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
  display: none;
}

/* Box sizing
--------------------------------------------- */

/* Inherit box-sizing to more easily change it's value on a component level.
@link http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
*,
*::before,
*::after {
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
}

html {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

/*--------------------------------------------------------------
# Base
--------------------------------------------------------------*/

/* Typography
--------------------------------------------- */
body {
  color: var(--dark-grey-clr);
  font-family: "GPBox V3 Next", -apple-system, BlinkMacSystemFont, Arial,
    "Helvetica", "Droid Sans", "Segoe UI", "Roboto", sans-serif;
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  line-height: 1.5;

  text-rendering: geometricPrecision;

  font-smooth: always;
  font-smoothing: antialiased;
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;

  -moz-osx-font-smoothing: grayscale;

  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
}

button,
input,
select,
optgroup,
textarea {
  color: var(--dark-grey-clr);
  font-family: "GPBox V3 Next", -apple-system, BlinkMacSystemFont, Arial,
    "Helvetica", "Droid Sans", "Segoe UI", "Roboto", sans-serif;
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  line-height: 1.5;
}

h1,
h2 {
  clear: both;
  font-weight: 900;
  line-height: 100%;
}

h3,
h4,
h5,
h6 {
  clear: both;
  font-weight: 700;
  line-height: 100%;
}

h1 {
  font-size: var(--very-big);
}
h1.small {
  font-size: var(--medium);
}
h1.extra-small {
  font-size: var(--small);
}
h1.medium {
  font-size: var(--semi-big);
}
h2 {
  font-size: var(--big);
}
h2.small {
  font-size: var(--medium);
}
h2.extra-small {
  font-size: var(--small);
}
h3 {
  font-size: var(--medium);
}
h3.big {
  font-size: var(--big);
  font-weight: 900;
}
h4 {
  font-size: var(--small);
  line-height: 120%;
}
h4.small {
  font-size: var(--default);
  line-height: 1.15;
}
h5 {
  font-size: 1rem;
}

p {
  margin-bottom: 1.5rem;
}

dfn,
cite,
em,
i {
  font-style: italic;
}

blockquote {
  margin: 0 1.5rem;
}

address {
  margin: 0 0 1.5rem;
  font-style: normal;
}

pre {
  background: #eee;
  font-family: "Courier 10 Pitch", courier, monospace;
  line-height: 1.6;
  margin-bottom: 1.6rem;
  max-width: 100%;
  overflow: auto;
  padding: 1.6rem;
}

mark,
ins {
  text-decoration: none;
}

big {
  font-size: 125%;
}

.big-text-number {
  font-size: var(--very-big);
  font-weight: 900;
  line-height: 1;
}

/* Elements
--------------------------------------------- */
body {
  background: white;
  overflow-y: auto;
  overflow-x: hidden;
}

/* body.desktop #page {
  overflow-x: hidden;
  min-height: 100vh;
} */

body.mobile {
  width: 100%;
}
body.desktop.modal-opened:not(.modal-opened-scroll) {
  padding-right: calc(100vw - 100% + 15px);
  overflow-y: overlay;
}

@media screen and (min-width: 37.5rem) and (max-width: 1600px) {
  body.mobile.sticky-header-mobile {
    padding-top: calc(64px + 0.4rem);
  }
}

@supports (-moz-appearance: none) {
  /* Firefox only "vw" adds the scrollbar, chrome and edge not */
  body {
    padding-right: 0 !important;
  }
}

hr {
  background-color: var(--very-light-grey-clr);
  border: 0;
  height: 1px;
  margin-bottom: 1.5rem;
  width: 100%;
}

ul,
ol {
  margin: 0 0 1.5rem 3rem;
}

ul {
  list-style: disc;
}

ol {
  list-style: decimal;
}

li > ul,
li > ol {
  margin-bottom: 0;
  margin-left: 1.5rem;
}

dt {
  font-weight: 700;
}

dd {
  margin: 0 1.5rem 1.5rem;
}

/* Make sure rembeds and iframes fit their containers. */
embed,
iframe,
object {
  max-width: 100%;
}

img {
  display: block;
  height: auto;
  max-width: 100%;
  border-style: none; /* Remove the border on images inside links in IE 10. */
}

picture.picture {
  height: 100%;
  width: 100%;
}

picture > img:not(.no-picture-size) {
  height: unset; /* Remove the parent-child size dependency */
  max-width: unset;

  height: 100%;
  width: 100%;
  object-fit: cover;
  object-position: center;
}

img.round-corners,
.round-corners {
  border-radius: 8px;
}

img.round-corners-small,
.round-corners-small {
  border-radius: 4px;
}

img.border-around,
.border-around {
  border: var(--border);
}

img.object-fit {
  object-fit: cover;
  object-position: center;
}

img.aspect-ratio-1 {
  aspect-ratio: 1/1;
}

img[loading="lazy"]:not(.noimgbackground) {
  background-color: var(--ultra-light-grey-clr);
}

.product-gallery__image--placeholder img[loading="lazy"] {
  background-color: unset;
  width: 100%;
}

figure {
  margin: 1rem 0;
}

table {
  margin: 0 0 1.5rem;
  width: 100%;
}

/* Tooltip */
[data-tippy-root] {
  z-index: 999 !important;
}

.tippy-box {
  -webkit-box-shadow: 0 4px 20px -0.5px var(--transparent-grey-clr);
  box-shadow: 0 4px 20px -0.5px var(--transparent-grey-clr);
  border-radius: 8px;
  border: var(--border-transparent);
  background-color: white;
  color: var(--text-black-clr);
  font-weight: 400;
}

.tippy-content {
  padding: 1rem;
  font-size: 1rem;
}

.tippy-close {
  position: absolute;
  top: 0.25rem;
  right: 0.25rem;
}

.tippy-arrow {
  transform-style: preserve-3d;
}
.tippy-box .tippy-arrow::before {
  width: 12px;
  height: 12px;
  background: white;
  border: var(--border-transparent);
  transform: rotate(45deg);
}
.tippy-box[data-placement^="bottom"] > .tippy-arrow:before {
  top: -8px;
  border-width: 1px 0 0 1px;
}
.tippy-box[data-placement^="top"] > .tippy-arrow:before {
  bottom: -8px;
  border-width: 0 1px 1px 0;
}
.tippy-box[data-placement^="right"] > .tippy-arrow:before {
  left: -9px;
  top: 8px;
  border-width: 0 0 1px 1px;
}
.tippy-box[data-placement^="left"] > .tippy-arrow:before {
  right: -8px;
  border-width: 1px 1px 0 0;
}
.tippy-box[data-placement="top-end"] > .tippy-arrow:before {
  left: 12px;
}

span[data-tippy-content][data-tippy-underline],
[data-tippy-content] > [data-tippy-underline] {
  -webkit-text-decoration-line: underline;
  text-decoration-line: underline;
  -webkit-text-decoration-style: dashed;
  text-decoration-style: dashed;
  -webkit-text-decoration-color: var(--text-black-clr);
  text-decoration-color: var(--text-black-clr);
  text-underline-position: under;
  text-decoration-thickness: 0.08rem;
  cursor: help;
}

.header-icons .tippy-content {
  white-space: nowrap;
}

/* Buttons
--------------------------------------------- */
.btn-hover:before {
  content: "";
  background-color: rgba(255, 255, 255, 0.2);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50px;
  -webkit-transition: opacity 150ms ease-out,
    -webkit-transform 200ms var(--bezier);
  transition: opacity 150ms ease-out, -webkit-transform 200ms var(--bezier);
  -o-transition: transform 200ms var(--bezier), opacity 150ms ease-out;
  transition: transform 200ms var(--bezier), opacity 150ms ease-out;
  transition: transform 200ms var(--bezier), opacity 150ms ease-out,
    -webkit-transform 200ms var(--bezier);
  -webkit-transform: scale(0.7) perspective(1px);
  transform: scale(0.7) perspective(1px);
  opacity: 0;
  pointer-events: none;
}

@media (hover: hover) and (pointer: fine) {
  .btn-hover:not(:disabled):hover:before,
  .btn-hover:not(:disabled).active:not(.checkout-button):before {
    z-index: 1;
    opacity: 1;
    -webkit-transform: scale(1) perspective(1px);
    transform: scale(1) perspective(1px);
  }
}

.btn-accent {
  width: 100%;
  height: 56px;
  font-weight: 700;
  color: var(--text-white-clr);
  background-color: var(--accent-clr);
  border-radius: 50px;
  -webkit-transition: background-color 295ms var(--bezier);
  -o-transition: background-color 295ms var(--bezier);
  transition: background-color 295ms var(--bezier);
  position: relative;
  cursor: pointer;
  text-align: center;
}
.btn-accent:before {
  background-color: rgba(255, 255, 255, 0.3);
}

.btn-accent[disabled] {
  pointer-events: none;
  background-color: var(--very-light-grey-clr);
}

.btn-big {
  padding: 0 30px;
  height: 48px;
  color: var(--text-white-clr);
  background-color: var(--dark-grey-clr);
  border-radius: 50px;
  -webkit-transition: background-color 295ms var(--bezier);
  -o-transition: background-color 295ms var(--bezier);
  transition: background-color 295ms var(--bezier);
  cursor: pointer;
  position: relative;
}

.btn-medium {
  padding: 0 1.25rem;
  height: 44px;
  color: var(--text-white-clr);
  background-color: var(--dark-grey-clr);
  border-radius: 50px;
  -webkit-transition: background-color 295ms var(--bezier);
  -o-transition: background-color 295ms var(--bezier);
  transition: background-color 295ms var(--bezier);
  cursor: pointer;
  position: relative;
}

.btn-small {
  background-color: var(--ultra-light-grey-clr);
  border-radius: 50px;
  -webkit-transition: background-color 295ms var(--bezier);
  -o-transition: background-color 295ms var(--bezier);
  transition: background-color 295ms var(--bezier);
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: 40px;
  padding: 0 1.25rem;
  cursor: pointer;
  position: relative;
}

.btn-arrow {
  padding-left: 2rem;
  padding-right: 0.5rem;
}

.btn-arrow > span {
  margin-left: auto;
}
.btn-arrow .white-icon {
  width: 40px;
  min-width: 40px;
  height: 40px;
  background-color: rgba(255, 255, 255, 0.4);
  margin-left: auto;
}
.btn-arrow .white-icon svg {
  width: 24px;
  min-width: 24px;
  height: 24px;
  margin-left: 2px;
}
.btn-arrow .white-icon svg path {
  stroke-width: 1.5;
}

.btn-arrow.btn-small {
  padding-left: 1.25rem;
  padding-right: 0.25rem;
}

.btn-arrow.btn-small .white-icon {
  width: 32px;
  min-width: 32px;
  height: 32px;
  margin-left: auto;
}
.btn-arrow.btn-small .white-icon svg {
  width: 20px;
  min-width: 20px;
  height: 20px;
  margin-left: 2px;
}

.btn-arrow.btn-medium {
  padding-left: 1rem;
  padding-right: 0.25rem;
}

.btn-arrow.btn-arrow-left.btn-medium {
  padding-right: 1rem;
  padding-left: 0.25rem;
}

.btn-arrow.btn-medium .white-icon {
  width: 36px;
  min-width: 36px;
  height: 36px;
  margin-left: auto;
}
.btn-arrow.btn-medium .white-icon svg {
  width: 20px;
  min-width: 20px;
  height: 20px;
  margin-left: 2px;
}

.btn-arrow.btn-white .white-icon {
  background-color: var(--ultra-light-grey-clr);
}

.btn-arrow.btn-white .white-icon svg path {
  stroke: var(--text-black-clr);
}

.btn-ghost {
  color: var(--text-black-clr);
  background-color: white;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  border: 1px solid var(--very-light-grey-clr) !important;
}

.btn-red {
  color: var(--bright-red-clr);
  background-color: white;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  border: 1px solid var(--bright-red-clr);
}

.btn-red:hover {
  background-color: var(--fade-red-clr);
}

.btn-dark {
  background-color: var(--dark-grey-clr);
  color: var(--text-white-clr);
}

.btn-white {
  background-color: white;
  color: var(--text-black-clr);
}

.btn-ghost:before {
  background-color: #1c1c1c10;
}

.btn-small:not(.btn-dark):before {
  background-color: #1c1c1c10;
}

.accent {
  background-color: var(--accent-clr);
  color: white;
  font-weight: 700;
}
.accent:before {
  background-color: rgba(255, 255, 255, 0.3);
}

.border-box {
  border: var(--border);
  border-radius: 8px;
  padding: 1.5rem;
}
.border-box.small-padding {
  padding: 1rem;
}
.border-box.small-padding.background-clear {
  background: #fcfcfd;
}
.background-white {
  background: white;
}
.dashed-border-box {
  border: 2px dashed var(--very-light-grey-clr);
  border-radius: 10px;
  min-width: 170px;
  transition: border-color 295ms var(--bezier-nobounce);
}
.dashed-border-box:hover {
  cursor: pointer;
  border-color: var(--light-grey-clr) !important;
}

.border-box > .border-top {
  border-top: var(--border);
  width: calc(100% + 3rem);
  margin: 1.5rem -1.5rem 0 -1.5rem;
  padding: 1.5rem 1.5rem 0 1.5rem;
}

a .border-box.box-hover::after,
a .grey-box.box-hover::after {
  content: "";
  box-shadow: 0 0 0 2px var(--dark-grey-clr);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: 8px;
  opacity: 0;
  transition: opacity 295ms var(--bezier);
}

a .grey-box.box-hover {
  overflow: visible;
}

@media (hover: hover) and (pointer: fine) {
  a:hover .border-box.box-hover::after {
    opacity: 1;
  }
  a:hover .grey-box.box-hover::after {
    opacity: 1;
  }

  a:hover .icon-hover svg {
    transform: scale(1.05);
  }
}

.icon-hover svg {
  transition: transform 295ms var(--bezier);
}

/* Links
--------------------------------------------- */
a {
  color: var(--dark-grey-clr);
  text-decoration: none;
}

body.loaded a {
  -webkit-transition: color 295ms var(--bezier-nobounce);
  -o-transition: color 295ms var(--bezier-nobounce);
  transition: color 295ms var(--bezier-nobounce);
}

a:focus,
a:focus-visible {
  outline: none;
  opacity: 1;
}

@media (hover: hover) and (pointer: fine) {
  a:focus,
  a:focus-visible {
    outline: none;
  }
}

a:hover,
a:active {
  outline: 0;
}

a.underline {
  text-decoration: underline;
}

a.underline-hover:hover {
  text-decoration: underline;
}

@media (hover: hover) and (pointer: fine) {
  a.asmall:hover,
  a.asmall:active {
    color: var(--accent-clr);
  }
}

/* Forms
--------------------------------------------- */
button,
input[type="button"],
input[type="reset"] {
  border: none;
  border-radius: 50px;
  line-height: 1;
  padding: 0;
}

button:active,
button.active:not(.icon-dropdown),
.bg-icon:active .bg-icon.active:not(.icon-dropdown),
input[type="button"]:active,
input[type="reset"]:active,
input[type="submit"]:active {
  opacity: 0.7;
}

button:focus,
button:focus-visible,
.bg-icon:focus,
.bg-icon:focus-visible,
input[type="button"]:focus,
input[type="button"]:focus-visible,
input[type="reset"]:focus,
input[type="reset"]:focus-visible,
input[type="submit"]:focus,
input[type="submit"]:focus-visible {
  outline: 1px dotted var(--light-grey-clr);
  border-radius: 50px;
}

button:focus-visible,
.bg-icon:focus-visible,
input[type="button"]:focus-visible,
input[type="reset"]:focus-visible,
input[type="submit"]:focus-visible {
  background-color: var(--ultra-light-grey-clr);
  border-radius: 50px;
}

button.accent:disabled {
  background-color: var(--light-grey-clr);
  cursor: auto;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
  color: var(--medium-grey-clr);
  border: var(--border);
  border-radius: 5px;
  padding: 0.5rem 1rem 0.5rem;

  /* Remove First */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

label {
  margin-bottom: 0.25rem;
}
input[type="checkbox"] + label {
  cursor: pointer;
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: var(--light-grey-clr);
}

input::-moz-placeholder,
textarea::-moz-placeholder {
  color: var(--light-grey-clr);
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: var(--light-grey-clr);
}

input::-ms-input-placeholder,
textarea::-ms-input-placeholder {
  color: var(--light-grey-clr);
}

input::placeholder,
textarea::placeholder {
  color: var(--light-grey-clr);
}

input[type="text"]:focus,
input[type="text"]:focus-visible,
input[type="email"]:focus,
input[type="email"]:focus-visible,
input[type="url"]:focus,
input[type="url"]:focus-visible,
input[type="password"]:focus,
input[type="password"]:focus-visible,
input[type="number"]:focus,
input[type="number"]:focus-visible,
input[type="search"]:focus,
input[type="search"]:focus-visible,
input[type="range"]:focus,
input[type="range"]:focus-visible,
input[type="tel"]:focus,
input[type="tel"]:focus-visible,
input[type="range"]:focus,
input[type="range"]:focus-visible,
input[type="date"]:focus,
input[type="date"]:focus-visible,
input[type="month"]:focus,
input[type="month"]:focus-visible,
input[type="week"]:focus,
input[type="week"]:focus-visible,
input[type="time"]:focus,
input[type="time"]:focus-visible,
input[type="datetime"]:focus,
input[type="datetime"]:focus-visible,
input[type="datetime-local"]:focus,
input[type="datetime-local"]:focus-visible,
input[type="color"]:focus,
input[type="color"]:focus-visible,
textarea:focus,
textarea:focus-visible {
  outline: 0;
  -webkit-box-shadow: inherit;
  box-shadow: inherit;
  box-shadow: 0 0 0 2px var(--dark-grey-clr);
}

.input-icon > input {
  padding-left: calc(1rem + 42px);
  z-index: 0;
}

.input-icon > .gpbox-icon {
  position: absolute;
  padding-left: 0.8rem;
  min-width: unset;
  top: 50%;
  left: 0;
  transform: translate(0, -50%);
  z-index: 1;
}
.input-icon > .gpbox-icon svg {
  width: 20px;
}

.input-icon > .gpbox-icon path {
  stroke: var(--light-grey-clr);
}

textarea {
  width: 100%;
  resize: vertical;
}

/* Select fields formatting - Shipping address pre-update*/
select {
  color: var(--dark-grey-clr);
  border: var(--border);
  border-radius: 5px;
  padding: 0.5rem 1rem 0.5rem;
  line-height: 1.5;
  height: unset;
  width: 100%;
  -webkit-appearance: none;
  appearance: none;
  overflow: hidden;
  overflow: -moz-hidden-unscrollable;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 16 16' focusable='false'%3E%3Cpath stroke='var(--accent-clr, %23ff3d00)' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M4 6l4 4 4-4'/%3E%3C/svg%3E%0A")
    no-repeat right white;
  background-position: center right 5px;
  background-size: 24px;
  cursor: pointer;
}

/* Select2 fields formatting */
body .select2-container--default .select2-selection {
  color: var(--dark-grey-clr);
  border: var(--border);
  border-radius: 5px;
  padding: 0.5rem 1rem 0.5rem;
  line-height: 1.5;
  height: unset;
}
body
  .select2-container--default
  .select2-selection
  .select2-selection__rendered {
  height: unset;
  line-height: unset;
  padding-left: 0;
  color: var(--dark-grey-clr);
}

/* Switch default arrow for our svg */
body .select2-container--default .select2-selection .select2-selection__arrow {
  height: unset;
  right: 0.5rem;
  top: 50%;
  transform: translateY(-50%);
}
body
  .select2-container--default
  .select2-selection
  .select2-selection__arrow
  b {
  display: none;
}
body
  .select2-container--default
  .select2-selection
  .select2-selection__arrow::before {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16' focusable='false'%3E%3Cpath stroke='var(--accent-clr, %23ff3d00)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 6l4 4 4-4'/%3E%3C/svg%3E%0A");
  background-position: center;
  background-size: 20px;
  background-position-y: 2px;
  width: 20px;
  height: 20px;
  display: flex;
}

body .select2-container--open .select2-dropdown--below {
  border: var(--border);
}
body
  .select2-container--default
  .select2-search--dropdown
  .select2-search__field {
  border: var(--border);
}

body .select2-selection--multiple:after {
  content: "";
  border: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16' focusable='false'%3E%3Cpath stroke='var(--accent-clr, %23ff3d00)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 6l4 4 4-4'/%3E%3C/svg%3E%0A");
  background-position: center;
  background-size: 20px;
  background-position-y: 2px;
  background-repeat: no-repeat;
  width: 20px;
  height: 20px;
  display: flex;
  right: 0.5rem;
  top: 50%;
  transform: translateY(-50%);
}

/*--------------------------------------------------------------
# Components
--------------------------------------------------------------*/

/* Header Banner Structure
--------------------------------------------- */
.header-banner__wrapper {
  overflow: hidden;
  width: 100vw;
  max-width: calc(1600px - 80px);
  margin-left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}

/* Classes affected by the mw-container width change
--------------------------------------------- */
@media screen and (max-width: 1600px) {
  /* These 3 classes make the carousels flow across screen on small sizes */
  .category-slider .flex-viewport,
  #myaccount-product-history-container .flex-viewport,
  .myaccount-flexslider-wrapper .flex-viewport,
  .section-products__extra .product-gallery-content .flex-viewport {
    overflow: visible !important;
  }
  #myaccount-product-favourite,
  #myaccount-vendor-favourite,
  #myaccount-category-favourite,
  #myaccount-product-history,
  .category-slider,
  .section-products__extra {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw); /* Negative to the left */
    padding-left: calc(50vw - 50%); /* Postiive both paddings */
    padding-right: calc(50vw - 50%); /* Postiive both paddings */
    content-visibility: visible !important;
  }
  .section-products__extra {
    padding-left: calc(50vw - 50%) !important;
    padding-right: calc(50vw - 50%) !important;
    border-radius: 0;
  }

  body.home .review-container {
    width: 100vw;
    max-width: calc(1600px - 80px);
    margin-left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);

    content-visibility: auto;
    contain-intrinsic-size: auto 300px;
  }
}

/* Navigation
--------------------------------------------- */
.main-navigation {
  display: block;
  width: auto;
}

.main-navigation ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  list-style: none;
  margin: 0;
  padding-left: 0;
}

.main-navigation .header-icons > li {
  position: relative;
  margin: 0 0.15rem;
}
.main-navigation .header-icons > li:last-child {
  margin-right: -10px;
}

.main-navigation .header-icons > li > .bg-icon,
.main-navigation .header-icons > li > a > .bg-icon,
.main-navigation .header-icons > li > button > .bg-icon {
  height: 44px;
  line-height: 44px;
}

.main-navigation
  .header-icons
  > li
  > .bg-icon:not(.bg-icon-text, .bg-icon-text-narrow),
.main-navigation
  .header-icons
  > li
  > a
  > .bg-icon:not(.bg-icon-text, .bg-icon-text-narrow),
.main-navigation
  .header-icons
  > li
  > button
  > .bg-icon:not(.bg-icon-text, .bg-icon-text-narrow) {
  width: 44px;
}

.main-navigation .header-icons > li .bg-icon:before {
  border-radius: 50px;
}

.main-navigation .country_nav img {
  border-radius: 50%;
  width: 20px;
  height: 20px;
  object-fit: cover;
  object-position: center;
}

/* Small menu */
.menu-toggle,
.main-navigation.toggled ul,
.country-currency-nav__selector.modal-opener {
  display: block;
  background: none;
}
.menu-toggle:focus,
.menu-toggle:focus-visible {
  outline: none;
}

/* Myaccount menu*/
#myaccount-submenu {
  padding: 12px 0;
}
body.mobile:not(.wcfm-dashboard-page) #myaccount-submenu {
  min-width: 240px;
  right: -2rem;
}
body.mobile #myaccount-submenu.popup-body:not(.popup-no-arrow)::after {
  right: 44px;
}
.header-icons > ul > li > a > .profile-social__picture {
  padding-right: 3px;
}
.profile-social__picture > img {
  max-width: unset;
  object-fit: cover;
}
.signout-button .gpbox-icon {
  transform: rotate(270deg);
  transform-origin: center center;
}

.mobile-fullpage-container {
  margin: 0 0.5rem;
  padding-top: 1rem;
}

.mobile-menu-item {
  padding: 0.65rem 0;
  border-bottom: var(--border);
  min-height: calc(1.3rem + 44px);
}

.mobile-menu-item:nth-last-child(2),
.mobile-menu-item:last-child {
  border-bottom: none;
}

.mobile-menu-item[aria-expanded="true"] {
  border-bottom: none;
  padding-bottom: 0;
  min-height: calc(73px - 0.75rem);
}

.mobile-menu-item img {
  object-fit: cover;
}

.mobile-fullpage-container .white-icon {
  transition: transform 295ms var(--bezier-nobounce);
  background-color: var(--very-light-grey-clr);
}

.mobile-menu-item[aria-expanded="true"] .white-icon {
  transform: rotate(90deg);
}

.mobile-submenu-item {
  display: block;
  margin-left: 1.5rem;
  padding: 1rem 0;
  border-bottom: var(--border);
}

.mobile-submenu-item:last-child {
  border-bottom: none;
}

.main-navigation .header-icons > li.search-open-mobile-wrapper {
  margin: 0 0.25rem 0 0.55rem;
}

body.mobile.logged-in .location-country {
  order: -1;
}
body.mobile.logged-in .user-profile-my-account {
  order: 1;
}
body.mobile.logged-in .fullpage-menu {
  order: 2;
}
.search-open-mobile {
  height: 44px;
  padding: 0 1rem 0 10px;
  width: 100%;
  border: 2px solid var(--dark-grey-clr);
  background: white;
}
.search-open-mobile .pseudo-placeholder {
  color: var(--light-grey-clr);
}

@media screen and (max-width: 37.5rem) {
  body.mobile #masthead {
    height: 64px;
    min-height: 64px;
    max-height: 64px;
    max-width: 100vw;
  }

  #masthead .site-header {
    height: 64px;
    min-height: 64px;
    max-height: 64px;
    justify-content: flex-start;
    padding-bottom: 0.5rem;
  }

  .site-header .searchbar-container {
    margin: 0.65rem 0;
  }
  /* Only if it is the location country button and it is the first icon */
  body.mobile
    .site-header:not(.site-header__nosearch)
    .main-navigation
    .header-icons
    > li.location-country {
    margin-left: -48px;
    margin-right: 4px;
  }

  body.mobile
    .main-navigation
    .header-icons
    > li
    > .bg-icon:not(.bg-icon-text, .bg-icon-text-narrow),
  body.mobile
    .main-navigation
    .header-icons
    > li
    > a
    > .bg-icon:not(.bg-icon-text, .bg-icon-text-narrow),
  body.mobile
    .main-navigation
    .header-icons
    > li
    > button
    > .bg-icon:not(.bg-icon-text, .bg-icon-text-narrow) {
    width: 40px;
  }

  .main-navigation .header-icons > li {
    margin: 0;
  }
  .main-navigation .header-icons > li:last-child {
    margin-right: -8px;
  }

  #desktop-category-menu {
    display: none;
  }
  body:not(.mobile) .site-header .logo-container {
    order: 1;
  }
  body:not(.mobile) .site-header .main-navigation {
    order: 2;
  }
  body:not(.mobile) .site-header .searchbar-container {
    order: 3;
  }
}

/* Posts and pages
--------------------------------------------- */
.sticky {
  display: block;
}

.updated:not(.published) {
  display: none;
}

.page-content,
.entry-summary {
  margin: 1.5rem 0 0;
}

.page-links {
  clear: both;
  margin: 0 0 1.5rem;
}

/* Header
--------------------------------------------- */
/* Header container sticky */
#masthead:not(.no-sticky) {
  width: 100%;
  z-index: 9999;
  position: relative;
}

body:not(.error404) .site-header,
body:not(.error404) #masthead:not(.no-sticky) {
  background: white;
}

body.modal-opened #masthead:not(.no-sticky) {
  z-index: 10;
}

body:not(.product-body) #masthead:not(.no-sticky),
body.product-body.mobile #masthead:not(.no-sticky) {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 0px;
}

body:not(.product-body) .sticky-header-simple,
body.product-body.mobile .sticky-header-simple {
  box-shadow: 4px 2px 10px 0px var(--transparent-grey-clr);
  -webkit-box-shadow: 4px 2px 10px 0px var(--transparent-grey-clr);
}

body.mobile #masthead.no-sticky-mobile {
  position: relative !important;
}

body.desktop #masthead.no-sticky-desktop {
  position: relative !important;
}

.site-header {
  height: 70px;
  padding-top: 6px;
  padding-bottom: 6px;
}

/* Old sticky header */
.admin-bar .sticky-header {
  top: 32px;
}
.sticky-header {
  position: fixed;
  right: 0;
  left: 0;
  top: 0;
  z-index: 9999;
  box-shadow: 4px 2px 10px 0px var(--transparent-grey-clr);
  -webkit-box-shadow: 4px 2px 10px 0px var(--transparent-grey-clr);
  background: white;
  animation-name: fadeInDown;
  animation-duration: 500ms;
  will-change: transform, opacity;
}
.sticky-header.no-sticky {
  animation-name: none;
}
@keyframes fadeInDown {
  from {
    opacity: 0;
    transform: translate3d(0, -100%, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

/* Header container sticky on scroll top mobile with headroom.js */
.headroom {
  /* will-change: transform; */
  transition: transform 200ms var(--bezier-nobounce);
}

.headroom--pinned,
.headroom--unpinned.search-mobile-no-sticky {
  position: fixed;
  right: 0;
  left: 0;
  top: 0;
  z-index: 80;
  background: white;
  box-shadow: 4px 2px 10px 0px var(--transparent-grey-clr);
  -webkit-box-shadow: 4px 2px 10px 0px var(--transparent-grey-clr);
}

.headroom--top {
  box-shadow: none;
  -webkit-box-shadow: none;
  transform: none;
  animation-name: none;
  animation-duration: unset;
  transition: none;
  z-index: 9999;
}

/* Media query for the app-like PWA for IOS */
@media screen and (display-mode: standalone) {
  body #masthead:not(.no-sticky),
  #masthead .site-header {
    height: 58px !important;
    min-height: 58px !important;
    max-height: 58px !important;
  }

  #masthead .site-header {
    padding-top: 0px !important;
  }
}

/* Logo */
/* Make sure logo link wraps around logo image. */
.logo-link {
  display: block;
}

/* Logo image for png christmas themed logo*/
.logo-link .logo-image {
  min-width: 166px;
  height: 100%;
  margin-top: -2px;
}

@media screen and (max-width: 64rem) {
  .header-logo svg,
  .logo-link svg {
    height: 16px;
    width: 85px;
  }
  .logo-link .logo-image {
    min-width: 85px;
  }
}

/* Notification icons */
.notification-count.active {
  position: absolute;
  top: 0;
  right: -2px;
  color: var(--text-white-clr);
  background: var(--accent-clr);
  height: 20px;
  width: 20px;
  min-width: 20px;
  line-height: 0;
  border-radius: 50px;
  font-size: 11px;
  font-weight: 700;
  padding: 0 0 1px 0;
  border: 3px solid white;
}

.notification-count:not(.active) {
  display: none;
}

.macos .notification-count.active {
  padding: 2px 0;
}

.notification-count.active.dark {
  background: var(--dark-grey-clr);
}
body:not(.mobile) .bg-icon-text-narrow .notification-count,
.dashboard-heading-nav .bg-icon .notification-count.active {
  right: unset;
  left: 30px;
  top: -1px;
}
body.mobile .dashboard-heading-nav .bg-icon.icon-dropdown {
  width: unset;
  padding-left: 10px;
  padding-right: 3px;
  line-height: 40px;
}

.submenu__item .notification-count {
  position: relative;
  margin-left: auto;
  border: none;
  font-size: 12px;
  padding: 0;
}
#dashboard_menu .notification-count.empty-notification {
  margin-right: -1rem !important;
}
.notification-count.empty-notification::after {
  content: "";
  width: 6px;
  height: 6px;
  background-color: var(--text-white-clr);
  display: flex;
  position: relative;
  border-radius: 50px;
}

/* Notification submenu */
#notifications-submenu .notifications-submenu__header {
  padding: 0 1rem;
  width: 325px;
  height: 60px;
}
#notifications-submenu
  .notifications-submenu__header.notification-body-scrolled {
  box-shadow: 0 2px 20px rgb(34 34 34 / 15%);
}

#notifications-submenu .notifications-submenu__body {
  overflow-y: auto;
  overflow-x: hidden;
  font-size: 15px;
}
.notification_item {
  padding: 8px 1rem;
}

.notification_item[data-notification-read="0"] {
  background: var(--ultra-light-grey-clr);
}

#notifications-submenu a:hover {
  color: var(--accent-clr);
}
.notification-message .notification-product-image {
  height: 75px;
  width: 75px;
  object-fit: cover;
  border: var(--border);
  border-radius: 6px;
  margin: 0.5rem 0.5rem 0.5rem 0;
  transition: opacity 295ms var(--bezier-nobounce);
}
.notification-message .notification-product-image:hover {
  opacity: 0.7;
}
message-product-ids,
message-vendor-id {
  display: none;
}

/* Main Search
--------------------------------------------- */
.searchbar-container {
  margin: 0 0.5rem 0 2rem;
}

@media screen and (max-width: 37.5rem) {
  body.mobile .searchbar-container {
    margin: 0;
  }
  body.mobile .logo-container {
    height: 16px;
  }
}

#mobile-search-modal > .modal-container {
  padding: 0;
  margin-top: 1rem;
  transition-delay: 0ms;
}
.site-header > .menu-toggle {
  margin-left: -8px;
}

.search-form {
  position: relative;
  margin: 0px;
}
#main-search-bar {
  width: 100%;
  border: 2px solid var(--dark-grey-clr);
  background: white;
  border-radius: 40px 40px 40px 40px;
  padding: 0rem 3rem 0 1.25rem;
  line-height: 44px;
  transition: background-color 295ms var(--bezier-nobounce);
}

#main-search-bar.active {
  z-index: 9112;
  background: white;
  border-radius: 22px 22px 0 0;
  border-color: transparent;
  border-bottom: 1px solid var(--very-light-grey-clr);
  padding-bottom: 1px;
}
#main-search-bar:focus,
#main-search-bar:focus-visible {
  outline: none !important;
}
#main-search-bar::-webkit-input-placeholder {
  color: var(--light-grey-clr);
}
#main-search-bar::-moz-placeholder {
  color: var(--light-grey-clr);
}
#main-search-bar:-ms-input-placeholder {
  color: var(--light-grey-clr);
}
#main-search-bar::-ms-input-placeholder {
  color: var(--light-grey-clr);
}
#main-search-bar::placeholder {
  color: var(--light-grey-clr);
}
.search-submit {
  z-index: 9113;
  position: absolute;
  right: 6px;
  pointer-events: none;
  height: 38px;
  width: 38px;
  background: var(--dark-grey-clr);
}
#main-search-bar.active ~ .search-submit {
  pointer-events: all;
  background: var(--ultra-light-grey-clr);
}

.search-form:hover #main-search-bar:not(.active) {
  background: var(--ultra-light-grey-clr);
}

.search-submit .gpbox-icon > svg {
  width: 22px;
  height: 22px;
}
.search-submit .gpbox-icon > svg > path {
  stroke: var(--text-white-clr);
  transition: stroke 295ms var(--bezier-nobounce);
}
#main-search-bar.active ~ .search-submit .gpbox-icon > svg > path {
  stroke: var(--text-black-clr);
}

.algolia-autocomplete {
  z-index: 9999 !important;
}

body.mobile .algolia-autocomplete {
  z-index: 99999999 !important;
}

.aa-dropdown-menu {
  /* we set the width in JS */
  padding-top: 0.5rem;
  border-top: none;
  border-bottom-left-radius: 22px;
  border-bottom-right-radius: 22px;
  background: white;
  overflow: hidden;
}
.aa-suggestion,
.popular-suggestions > a,
.searchbar-history__item {
  -webkit-transition: background-color 150ms ease-out;
  -o-transition: background-color 150ms ease-out;
  transition: background-color 150ms ease-out;
}
.aa-suggestion:hover,
.popular-suggestions > a:hover,
.searchbar-history__item:hover,
.aa-suggestion-find-all > .aa-suggest-link:hover {
  background-color: var(--ultra-light-grey-clr);
}
.aa-suggestion a,
.popular-suggestions a,
.popular-suggestions__title,
.search-history__title,
.searchbar-history__item {
  padding: 0.5rem 1.15rem;
}
.mobile .aa-suggestion-find-all .find-all-suggestions {
  max-width: calc(100% - 115px);
  overflow: hidden;
  text-overflow: ellipsis;
}

.search-history__title {
  padding-bottom: 0;
}

.searchbar-history__item-name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: calc(100% - 80px);
}

.searchbar-history__item-delete.bg-icon {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translate(0, -50%);
  width: 32px;
  height: 32px;
  margin-right: 0.5rem;
}
.searchbar-history__item-delete.bg-icon > svg {
  width: 20px;
  height: 20px;
}

.suggestion-post-thumbnail {
  height: 24px;
  width: 24px;
  min-width: 24px;
  border-radius: 50px;
  border: var(--border);
  margin-right: 0.8rem;
  margin-left: -2px;
  object-fit: cover;
}

.suggestion-link .gpbox-icon:not(.nm) {
  height: 24px;
  width: 24px;
  min-width: 24px;
  margin-right: 0.8rem;
  margin-left: -2px;
}

.suggestion-link .gpbox-icon:not(.nm) svg {
  height: 20px;
  width: 20px;
  stroke-width: 0.75;
}

.suggestion-link > .loop-product__title {
  white-space: nowrap;
}

.suggestion-link > .loop-product__title:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
}

.loop-product__title {
  display: block;
}

.loop-product__title::first-letter {
  text-transform: uppercase;
}

.aa-empty {
  padding: 1rem 1.5rem 1.5rem 1.25rem;
}

.aa-suggestion-find-all {
  padding: 1rem 0 1rem 0;
}
.aa-suggestion-find-all > .aa-suggest-link {
  padding: 0 1.5rem 0rem 0.5rem;
}

.right-arrow-search {
  height: 32px;
  width: 32px;
  background-color: var(--very-light-grey-clr);
}

#most-searched {
  position: absolute;
  border-radius: 0 0 22px 22px;
  padding: 0px;
  max-width: none;
  -webkit-transform: translateY(-15px) scale(1) perspective(1px);
  transform: translateY(-15px) scale(1) perspective(1px);
  padding: 0.5rem 0 1rem;
}

#most-searched.active {
  opacity: 1;
  -webkit-transform: translateY(0px) scale(1) perspective(1px);
  transform: translateY(0px) scale(1) perspective(1px);
  -webkit-transition-delay: 75ms;
  -o-transition-delay: 75ms;
  transition-delay: 75ms;
  z-index: 1000;
}

body.mobile #most-searched {
  transform: none;
  position: relative;
  transition-delay: 0ms;
  z-index: 1;
  transition: none;
  width: 100% !important;
}

body.mobile #mobile-search-modal > .modal-container {
  border-radius: 22px;
}

body.mobile #mobile-search-modal > .modal-container #most-searched {
  overflow-y: scroll;
}

.search-close {
  z-index: 9113;
  right: 2px;
  position: absolute;
}

/**
* Fullpage menu
*/

/*Interaction with header*/
/* Header remove searchbar and other icons */
.modal-opened-fullpage-menu .searchbar-container,
.modal-opened-fullpage-menu .main-navigation li:not(.fullpage-menu) {
  opacity: 0;
  pointer-events: none;
}

/* Small interaction burger menu to cross */
.menu-toggle .hamburger-svg .line {
  --burger-to-cross-speed: 145ms;
  transition: y var(--burger-to-cross-speed) ease-in
      var(--burger-to-cross-speed),
    transform var(--burger-to-cross-speed) ease-in,
    opacity 0ms var(--burger-to-cross-speed);
  transform-origin: 12px 13px;
}
.menu-toggle[aria-expanded="true"] .hamburger-svg .line {
  transition: y var(--burger-to-cross-speed) ease-in,
    transform var(--burger-to-cross-speed) ease-in var(--burger-to-cross-speed),
    opacity 0ms var(--burger-to-cross-speed);
}
.menu-toggle[aria-expanded="true"] .first-line,
.menu-toggle[aria-expanded="true"] .third-line {
  y: 12px;
}

.menu-toggle[aria-expanded="true"] .first-line {
  transform: rotate(45deg);
}

.menu-toggle[aria-expanded="true"] .second-line {
  opacity: 0;
}

.menu-toggle[aria-expanded="true"] .third-line {
  transform: rotate(-45deg);
}

/* Structure + Layout */
body:not(.mobile) #fullpage-menu {
  position: fixed;
  top: 70px;
  right: 0;
  bottom: 0;
  left: 0;
  height: 100%;
  height: -webkit-fill-available;
  width: 100%;
  background: white;
  z-index: 999;
  -webkit-transform: translateX(100%);
  -ms-transform: translateX(100%);
  transform: translateX(100%);
  -webkit-transition: -webkit-transform var(--bezier-nobounce) 195ms;
  transition: -webkit-transform var(--bezier-nobounce) 195ms;
  -o-transition: transform var(--bezier-nobounce) 195ms;
  transition: transform var(--bezier-nobounce) 195ms;
  transition: transform var(--bezier-nobounce) 195ms,
    -webkit-transform var(--bezier-nobounce) 195ms;
  pointer-events: none;
}

body.mobile #fullpage-menu > .modal-container,
body.mobile #filters-mobile-modal > .modal-container {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  height: 100%;
  width: calc(100% - 40px - 1rem);
  max-width: calc(100% - 40px - 1rem);
  padding: 0;
  margin-left: 0;
  background: white;
  border-radius: 0;
  z-index: 99999999;
  -webkit-transform: translateX(100%);
  -ms-transform: translateX(100%);
  transform: translateX(100%);
  -webkit-transition: -webkit-transform var(--bezier-nobounce) 195ms;
  transition: -webkit-transform var(--bezier-nobounce) 195ms;
  -o-transition: transform var(--bezier-nobounce) 195ms;
  transition: transform var(--bezier-nobounce) 195ms;
  transition: transform var(--bezier-nobounce) 195ms,
    -webkit-transform var(--bezier-nobounce) 195ms;
  pointer-events: none;
  -webkit-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  transform: translateX(-100%);
}

body:not(.mobile) #fullpage-menu.active,
body.mobile #fullpage-menu.active > .modal-container,
body.mobile #filters-mobile-modal.active > .modal-container {
  -webkit-transform: none !important;
  -ms-transform: none !important;
  transform: none !important;
  pointer-events: all !important;
}

body:not(.mobile) #fullpage-menu:not(.active),
body.mobile #fullpage-menu:not(.active) > .modal-container,
body.mobile #filters-mobile-modal:not(.active) > .modal-container {
  -webkit-transition-delay: 0ms;
  -o-transition-delay: 0ms;
  transition-delay: 0ms;
}

.modal-container > .close-modal-cross {
  position: absolute;
  right: 1rem;
  top: 1rem;
  z-index: 1;
}

@supports ((-webkit-clip-path: circle(0px)) or (clip-path: circle(0px))) {
  .desktop #fullpage-menu {
    --clip-path-delay: 600ms;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    -webkit-clip-path: circle(0px at top right);
    clip-path: circle(0px at top right);
    transition: -webkit-clip-path var(--bezier) var(--clip-path-delay);
    -webkit-transition: -webkit-clip-path var(--bezier) var(--clip-path-delay);
    -o-transition: clip-path var(--bezier) var(--clip-path-delay);
    transition: clip-path var(--bezier) var(--clip-path-delay);
    transition: clip-path var(--bezier) var(--clip-path-delay),
      -webkit-clip-path var(--bezier) var(--clip-path-delay);
  }

  .desktop #fullpage-menu:not(.active) {
    -webkit-transition-delay: var(--clip-path-delay);
    -o-transition-delay: var(--clip-path-delay);
    transition-delay: var(--clip-path-delay);
  }

  .desktop #fullpage-menu.active {
    -webkit-transition-delay: var(--clip-path-delay);
    -o-transition-delay: var(--clip-path-delay);
    transition-delay: var(--clip-path-delay);
    -webkit-clip-path: circle(250% at top right);
    clip-path: circle(250% at top right);
    transition: -webkit-clip-path var(--bezier) var(--clip-path-delay);
    -webkit-transition: -webkit-clip-path var(--bezier) var(--clip-path-delay);
    -o-transition: clip-path var(--bezier) var(--clip-path-delay);
    transition: clip-path var(--bezier) var(--clip-path-delay);
    transition: clip-path var(--bezier) var(--clip-path-delay),
      -webkit-clip-path var(--bezier) var(--clip-path-delay);
  }
}

.desktop #fullpage-menu div.animation_in > .animated {
  opacity: 0;
  -webkit-transition: opacity 350ms linear;
  -o-transition: opacity 350ms linear;
  transition: opacity 350ms linear;
  display: none;
}

.desktop #fullpage-menu.active div.animation_in > .animated {
  -webkit-animation: fadeIn var(--bezier-nobounce) 550ms forwards;
  animation: fadeIn var(--bezier-nobounce) 550ms forwards;
  -webkit-animation-delay: 200ms;
  animation-delay: 200ms;
  display: block;
}

.desktop #fullpage-menu:not(.active) div.animation_in > .animated {
  opacity: 1;
  -webkit-animation: fadeOut var(--bezier-nobounce) 500ms forwards;
  animation: fadeOut var(--bezier-nobounce) 500ms forwards;
}
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }
  75% {
    opacity: 0.7;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }
  75% {
    opacity: 0.7;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  75% {
    opactiy: 0.7;
  }
  100% {
    opacity: 0;
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
  }
}
@keyframes fadeOut {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  75% {
    opactiy: 0.7;
  }
  100% {
    opacity: 0;
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
  }
}

/* Fullpage menu components */
.fullpage-column {
  padding: 0 4rem;
}

.fullpage-column:last-child {
  padding: 0 2.5rem;
}

.image-block {
  overflow: hidden;
  border-radius: 8px;
}
.image-block .title {
  position: absolute;
  top: 1rem;
  left: 1rem;
  z-index: 2;
}
.image-block picture {
  display: block;
  width: 300px;
  height: 148px;
}
.image-block img {
  width: 100%;
  height: 100%;
  border-radius: 8px;
  object-fit: cover;
  transition: transform 295ms var(--bezier-nobounce);
}

@media (hover: hover) and (pointer: fine) {
  .image-block a:hover img {
    transform: scale(1.15);
  }
}

/* 
* Main Categories Menu 
*/
#main-category-menu {
  max-width: 100%;
  cursor: pointer;
}
#main-category-menu > li {
  padding: 0rem 0rem 12px;
  white-space: nowrap;
  line-height: 24px;
}

#main-category-menu > li:first-child {
  padding-left: 0rem;
}

#main-category-menu > li:last-child {
  padding-right: 0rem;
}

#main-category-dropdown-submenu {
  --transition-time: 125ms;

  position: absolute;
  min-height: 425px;
  top: 100px;
  left: 0;
  right: 0;
  margin-top: 0;

  display: flex;
  flex-wrap: wrap;

  border-top: var(--border);
  border-bottom: var(--border);
  box-shadow: 0 16px 20px -15px var(--transparent-grey-clr);
  -webkit-box-shadow: 0 16px 20px -15px var(--transparent-grey-clr);

  opacity: 0;

  pointer-events: none;
  background: white;
  z-index: -1;
  transform: translateY(-5px);
  transition: opacity var(--transition-time) var(--bezier-nobounce),
    transform var(--transition-time) var(--bezier-nobounce);
}

body.loaded #main-category-dropdown-submenu {
  display: flex !important;
}

#main-category-dropdown-submenu.open {
  transform: translateY(0);
  opacity: 1 !important;
  pointer-events: auto;
  z-index: 9999999;
}
#main-category-dropdown-submenu .dropdown-submenu {
  width: 100%;
  max-width: 100%;
  display: none;
}

#main-category-dropdown-submenu .dropdown-submenu .dropdown-submenu-container {
  padding: 0 1%;
  overflow: visible;
  opacity: 0;
}

#main-category-dropdown-submenu .dropdown-submenu.active,
#main-category-dropdown-submenu
  .dropdown-submenu.active
  .dropdown-submenu-container {
  display: block;
  opacity: 1;
}

#main-category-menu > li a:before {
  content: "";
  position: absolute;
  opacity: 0;
  width: 0;
  height: 2px;
  bottom: -9px;
  background: var(--dark-grey-clr);
  z-index: 99999999;
}

#main-category-menu > li.active a:before {
  opacity: 1;
  width: 100%;
  transition: opacity 195ms var(--bezier-nobounce),
    width 195ms var(--bezier-nobounce);
  transition-delay: 50ms;
  -webkit-transition: opacity 195ms var(--bezier-nobounce),
    width 195ms var(--bezier-nobounce);
  -webkit-transition-delay: 50ms;
  -moz-transition: opacity 195ms var(--bezier-nobounce),
    width 195ms var(--bezier-nobounce);
  -moz-transition-delay: 50ms;
  -ms-transition: opacity 195ms var(--bezier-nobounce),
    width 195ms var(--bezier-nobounce);
  -ms-transition-delay: 50ms;
  -o-transition: opacity 195ms var(--bezier-nobounce),
    width 195ms var(--bezier-nobounce);
  -o-transition-delay: 50ms;
}

.dropdown-submenu .menu-item > a {
  width: 23%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 10px 20px;
  border-radius: 25px;
  -webkit-transition: color 295ms var(--bezier-nobounce),
    background-color 295ms var(--bezier-nobounce);
  -o-transition: color 295ms var(--bezier-nobounce),
    background-color 295ms var(--bezier-nobounce);
  transition: color 295ms var(--bezier-nobounce),
    background-color 295ms var(--bezier-nobounce);
}
.dropdown-submenu .menu-item:first-child > a {
  padding-top: 1rem;
}
.dropdown-submenu .menu-item:not(:first-child) > a.active {
  background: var(--ultra-light-grey-clr);
}
.dropdown-submenu .menu-item:first-child > a:hover {
  color: var(--accent-clr);
}
.dropdown-submenu .menu-item:first-child {
  padding-top: 0.5rem;
}

.dropdown-submenu .menu-content {
  width: 76%;
  position: absolute;
  right: 0;
  top: 0;
  height: 423px;
  border-left: var(--border);
  padding: 1rem 40px;
  background: white;
  opacity: 0;
  transition: opacity 495ms var(--bezier);
  pointer-events: none;
}

.dropdown-submenu .menu-content.active {
  opacity: 1;
  pointer-events: auto;
}

.dropdown-submenu .menu-content.full-width-submenu {
  width: 100%;
  border-left: none;
  -webkit-transform: none;
  -ms-transform: none;
  transform: none;
  position: relative;
  left: 0;
  padding: 0 20px;
  height: unset;
  opacity: 1;
  pointer-events: auto;
}

.dropdown-submenu .first-column-tile {
  width: 24%;
}
.dropdown-submenu .main-column-tile {
  width: 76%;
}

.dropdown-submenu .submenu-title,
.dropdown-submenu .all-other {
  font-weight: 700;
  margin-bottom: 0.5rem;
}

.dropdown-submenu .promo-picture .submenu-title {
  text-align: center;
  margin-bottom: 0;
}
.dropdown-submenu .promo-picture .submenu-subtitle {
  position: absolute;
  bottom: 3rem;
  left: 0.6rem;
  background: white;
  font-size: 14px;
  border-radius: 3px;
  padding: 3px 8px;
  margin-right: 0.75em;
  -webkit-box-shadow: 0 6px 8px 0 rgb(0 0 0 / 20%);
  box-shadow: 0 6px 8px 0 rgb(0 0 0 / 20%);
}

.dropdown-submenu .menu-content .flex-column > a {
  margin-bottom: 0.4rem;
  -webkit-transition: color 295ms var(--bezier);
  -o-transition: color 295ms var(--bezier);
  transition: color 295ms var(--bezier);
}
.dropdown-submenu .menu-content .flex-column:not(.promo-picture) > a:hover {
  color: var(--accent-clr);
}
.dropdown-submenu .all-other {
  margin: 1rem 0 !important;
  display: flex;
  align-items: center;
}

.dropdown-submenu .all-other:not(.no-arrow)::after,
.dropdown-submenu .menu-item > a:not(.right-chevron)::after {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 24 24' focusable='false'%3E%3Cpath stroke='var(--dark-grey-clr, %231c1c1c)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 12h14M12 5l7 7-7 7'/%3E%3C/svg%3E%0A");
  background-size: 100%;
  height: 18px;
  width: 18px;
  position: relative;
  margin-left: 0.25rem;
  transition: background-image 295ms var(--bezier-nobounce);
}
.dropdown-submenu .all-other:not(.no-arrow):hover::after,
.dropdown-submenu .menu-item > a:not(.right-chevron):hover::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 24 24' focusable='false'%3E%3Cpath stroke='var(--accent-clr, %23ff3b00)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 12h14M12 5l7 7-7 7'/%3E%3C/svg%3E%0A");
}

.mobile .subcategory-menu .small-arrow-right svg {
  width: 18px;
  height: 18px;
}

.dropdown-submenu .promo-picture a {
  display: flex;
  flex-direction: column;
  margin-top: 1rem;
}

.dropdown-submenu .items-badge {
  margin-left: 0.75rem;
  color: var(--text-black-clr) !important;
  font-weight: 400;
  height: 24px;
  line-height: 18px;
}
.dropdown-submenu .items-badge.new-badge {
  background-color: var(--very-light-orange-clr);
}
.dropdown-submenu .items-badge.trending-badge {
  background-color: #ccf3ff;
}
.dropdown-submenu .items-badge.hot-badge {
  background-color: #f8d5cc;
}

.dropdown-submenu .right-chevron .items-badge {
  margin-right: 2rem;
}

.dropdown-submenu .right-chevron::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16' focusable='false'%3E%3Cpath stroke='var(--text-white-clr, %23fafafa)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M6 12l4-4-4-4'/%3E%3C/svg%3E ");
  background-position: center;
  background-size: 18px;
  background-position-x: 4px;
  background-color: var(--very-light-grey-clr);
  background-repeat: no-repeat;
  width: 24px;
  height: 24px;
  right: 12px;
  display: flex;
  border-radius: 50%;
}

.automotive-dropdown .first-column-tile {
  width: 240px;
}
.automotive-dropdown .main-column-tile {
  width: calc(100% - 240px);
}

.automotive-grid {
  display: grid;
  row-gap: 0.5rem;
  column-gap: 1rem;
  grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
  grid-template-rows: auto 1fr;
}

.automotive-grid > div {
  border: 1px solid white;
  border-radius: 8px;
  -webkit-transition: border 295ms var(--bezier);
  -o-transition: border 295ms var(--bezier);
  transition: border 295ms var(--bezier);
}
.automotive-grid .dropdown-submenu_thumbnail {
  height: unset;
  width: unset;
  margin-top: 0;
  margin-bottom: 0.25rem;
}

@media screen and (max-width: 1400px) {
  .dropdown-submenu .promo-picture-no-1400 {
    display: none;
  }
}

@media screen and (max-width: 64rem) {
  .dropdown-submenu {
    display: none;
  }

  #main-category-menu > li {
    padding: 0rem 0.5rem 1rem;
  }
}

/* Main menu gift section */
.dropdown-submenu .gift-box {
  height: 250px;
  width: 250px;
  border: var(--border);
  border-radius: 8px;
  margin-bottom: 0.4rem;
  margin-top: 0.5rem;
  overflow: hidden;
  position: relative;
}

.dropdown-submenu .promo-picture:hover .gift-value {
  opacity: 1;
  transform: scale(1.1);
}

.dropdown-submenu .promo-picture .gift-value {
  /* font-size: clamp(2.5rem, 4vw, 5.5rem); */
  font-size: min(
    max(2.5rem, 4vw),
    5.5rem
  ); /*Fixes safari issue with clamp font size*/
}

.dropdown-submenu .promo-picture .woocommerce-Price-currencySymbol {
  /* font-size: clamp(1.8rem, 3vw, 3.5rem); */
  font-size: min(
    max(1.8rem, 3vw),
    3.5rem
  ); /*Fixes safari issue with clamp font size*/
}

/* Pictures */
.dropdown-submenu_thumbnail {
  overflow: hidden;
  border-radius: 8px;
  border: var(--border);
  margin-top: 0.5rem;
  margin-bottom: 0.4rem;
  height: 250px;
  width: 250px;
}

.dropdown-submenu .dropdown-submenu_thumbnail img {
  height: 100%;
  width: 100%;
  border-radius: 8px;
  object-fit: cover;
  transition: transform 295ms var(--bezier-nobounce);
}

a:hover .dropdown-submenu_thumbnail img {
  transform: scale(1.15);
}

/* Badges */
.badge-small {
  font-size: 14px;
  border-radius: 3px;
  padding: 3px 8px;
  margin-right: 0.75em;
}

.badge-small.outofstock {
  background-color: #f8d5cc;
}
.badge-small.last-unit {
  background-color: #ccdff2;
}
.badge-small.limited-edition {
  background-color: #ccf3ff;
}
.badge-small.best-seller {
  background-color: var(--very-light-orange-clr);
}
.badge-small.freeshipping {
  background-color: #e4f3cc;
}
.badge-small.coa {
  background-color: #ffecb3;
}
.badge-small.hand {
  background-color: #e4f3cc;
}

.badge-small.processing {
  background-color: var(--very-light-orange-clr);
}

.badge-small.completed {
  background-color: #e4f3cc;
}

.badge-small.shipped {
  background-color: #ccf3ff;
}

.badge-small.order-status-text {
  display: inline-flex;
}

.badge-small.refunded,
.badge-small.refundrequested,
.badge-small.refund-requested,
.badge-small.partiallyrefunded {
  background-color: var(--fade-red-clr);
  color: var(--bright-red-clr);
}

.badge-small.pending,
.badge-small.pendingpayment {
  background-color: #ffecb3;
}

.badge-small.hold,
.badge-small.onhold,
.badge-small.cancelled,
.badge-small.failed {
  background-color: #f8d5cc;
}

.badge-small.status {
  color: var(--medium-grey-clr);
}

/* Pills */
.pill-new {
  font-weight: 700;
  font-size: 0.75rem;
  background-color: var(--accent-clr);
  color: var(--text-white-clr);
  border-radius: 2px;
  padding: 0.2rem 0.45rem;
  margin-left: 0.5rem;
  text-transform: uppercase;
  line-height: 1.5;
}

.pill-white {
  background-color: white;
  color: var(--text-black-clr);
  margin-left: 0px;
}

.pill-dark {
  background-color: var(--dark-grey-clr);
  color: var(--text-white-clr);
}

/* Carbon offset*/
.product-carbon-offset picture {
  width: 204px;
  min-width: 204px;
  aspect-ratio: 1/1;
  height: auto;
  overflow: hidden;
}
.product-carbon-offset > div {
  padding: 1.5rem 2rem;
}
.carbon-button {
  background-color: var(--medium-dark-green-clr);
  -webkit-transition: opacity 295ms var(--bezier);
  -o-transition: opacity 295ms var(--bezier);
  transition: opacity 295ms var(--bezier);
}

.bodyfooter .product-carbon-offset {
  margin-bottom: 0.75rem;
  margin-top: auto;
}
.bodyfooter .product-carbon-offset > div {
  padding: 0.75rem 1rem;
  justify-content: center;
  width: 326px;
  max-width: 100%;
}
.bodyfooter .product-carbon-offset picture {
  width: 160px;
  min-width: 160px;
}

.bodyfooter .product-carbon-offset > .flex-column-start > div.mb-15 {
  margin-bottom: 0;
}

.bodyfooter .product-carbon-offset > .flex-column-start a.carbon-button {
  display: none;
}

@media screen and (max-width: 37.5rem) {
  .product-carbon-offset picture {
    width: 100% !important;
    height: 140px;
    aspect-ratio: unset;
  }
  .product-carbon-offset > div {
    padding: 1.25rem;
  }
}

@media screen and (min-width: 37.5rem) and (max-width: 64rem) {
  .bodyfooter .product-carbon-offset {
    display: none;
  }
}

/* Announcement Strip */
.announcement-strip .announcement-strip__content {
  padding: 0.5rem 0.25rem 0.5rem 1rem;
}
.announcement-strip .pill-white {
  padding: 0.1rem 0.45rem;
}
.announcement-strip > a:hover > div {
  cursor: pointer;
  background-color: var(--accent-hover-clr);
  transition: background-color 295ms var(--bezier-nobounce);
}
.announcement-strip .announcement-strip-close-wrapper {
  position: absolute;
  right: 0;
}

@media screen and (max-width: 1600px) {
  body:not(.mobile) .announcement-strip .announcement-strip-close-wrapper {
    padding-right: 12px;
  }
}

/* Breadcrumbs */
.page-breadcrumbs a {
  font-weight: 700;
}
@media (hover: hover) and (pointer: fine) {
  .page-breadcrumbs a:hover {
    color: var(--accent-clr);
  }
}
.page-breadcrumbs .separator {
  color: #fff;
  position: relative;
  vertical-align: middle;
  line-height: 0;
  font-size: 14px;
  padding: 0 3px;
  z-index: 0;
}
.page-breadcrumbs .separator:before {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16' focusable='false'%3E%3Cpath stroke='var(--dark-grey-clr, %231c1c1c)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M6 12l4-4-4-4'/%3E%3C/svg%3E ");
  background-repeat: no-repeat;
  left: 0;
  top: 0;
  width: 16px;
  height: 16px;
  z-index: 2;
  margin-left: 2px;
  position: absolute;
}

.mobile .page-breadcrumbs {
  font-size: var(--default-mobile);
}

/* Slider - Mobile Pagination Navigation */
.flex-control-paging {
  position: absolute;
  list-style: none;
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  left: 50%;
  transform: translateX(-50%);
  overflow: visible;
  z-index: 0;
}
.flex-control-paging > li {
  padding: 0;
  margin: 0 0.15rem;
  height: 14px;
  display: flex;
  align-items: center;
  overflow: visible;
}

.flex-control-paging > li > a {
  display: block;
  font-size: 0;
  height: 12px;
  width: 12px;
  background: var(--ultra-light-grey-clr);
  border-radius: 100%;
  transition: background-color 295ms var(--bezier-nobounce);
  overflow: visible;
}

.section-header-banner .flex-control-paging {
  bottom: 0.5rem;
}

.flex-control-paging > li > a.flex-active {
  background: var(--very-light-grey-clr);
}

.section-header-banner .flex-control-paging > li > a.flex-active {
  background: var(--ultra-light-grey-clr);
}
.section-header-banner .flex-control-paging > li > a {
  background: #3a3a3ab3;
}

.grey-box .flex-control-paging > li > a.flex-active {
  background: var(--very-light-grey-clr);
}
.grey-box .flex-control-paging > li > a {
  background: var(--light-grey-clr);
}

.mobile .myaccount-flexslider-wrapper {
  padding-bottom: 1rem;
}

/* Photoswipe */
.pswp {
  z-index: 99999;
}
.pswp__bg {
  background: rgba(64, 64, 64, 0.9);
}
.pswp__img--placeholder--blank {
  background: none;
}

.pswp__caption,
.pswp__top-bar {
  background: none !important;
}
.pswp__caption {
  display: none;
}
.pswp img {
  border-radius: 20px;
}

button.pswp__button:not(.pswp__element--disabled) {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 2.75rem;
  width: 2.75rem;
  border-radius: 50%;
  box-shadow: 0 6px 8px 0 rgb(0 0 0 / 20%) !important;
  transition: transform 195ms var(--bezier-nobounce);
  opacity: 1 !important;
  margin: 0 1rem;
  background: none !important;
  background-color: #fff !important;
}
button.pswp__button:hover {
  transform: scale(1.05);
  background-color: #fff !important;
}
.pswp__top-bar button.pswp__button {
  margin: 0.5rem;
}

.pswp__top-bar {
  opacity: 1;
  padding: 0.5rem;
}
.pswp__counter {
  display: none;
}

button.pswp__button:before {
  display: block;
  position: relative;
  background-position: center;
  inset: unset;
  content: "";
  background-size: cover;
  width: 24px;
  height: 24px;
}

button.pswp__button--arrow--right:before,
button.pswp__button--arrow--left:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16' focusable='false'%3E%3Cpath stroke='var(--dark-grey-clr, %231c1c1c)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M6 12l4-4-4-4'/%3E%3C/svg%3E ") !important;
}

button.pswp__button--arrow--left:before {
  transform: rotate(180deg);
}

button.pswp__button--close:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 24 24' focusable='false'%3E%3Cpath stroke='var(--dark-grey-clr, %231c1c1c)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M18 6L6 18M6 6l12 12'%3E%3C/path%3E%3C/svg%3E");
}

button.pswp__button--zoom:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' viewBox='0 0 24 24' focusable='false'%3E%3Cpath stroke='var(--dark-grey-clr, %231c1c1c)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M11 19a8 8 0 100-16 8 8 0 000 16zM21 21l-4.35-4.35M11 8v6M8 11h6'/%3E%3C/svg%3E%0A");
}

.pswp--zoomed-in button.pswp__button--zoom:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' viewBox='0 0 24 24' focusable='false'%3E%3Cpath stroke='var(--dark-grey-clr, %231c1c1c)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M11 19a8 8 0 100-16 8 8 0 000 16zM21 21l-4.35-4.35M9.5 11h4'/%3E%3C/svg%3E");
}

button.pswp__button--fs:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 96 960 960' focusable='false'%3E%3Cpath d='M190.913 865.087V650.5h91v123.587H405.5v91H190.913Zm0-363.587V286.913H405.5v91H281.913V501.5h-91ZM554.5 865.087v-91h123.587V650.5h91v214.587H554.5ZM678.087 501.5V377.913H554.5v-91h214.587V501.5h-91Z'/%3E%3C/svg%3E");
}

.pswp--zoom-allowed .pswp__img {
  cursor: zoom-in;
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' viewBox='0 0 24 24' focusable='false'%3E%3Cpath stroke='var(--dark-grey-clr, %231c1c1c)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M11 19a8 8 0 100-16 8 8 0 000 16zM21 21l-4.35-4.35M11 8v6M8 11h6'/%3E%3C/svg%3E%0A")
      18 18,
    zoom-in;
  cursor: -webkit-image-set(
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' viewBox='0 0 24 24' focusable='false'%3E%3Cpath stroke='var(--dark-grey-clr, %231c1c1c)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M11 19a8 8 0 100-16 8 8 0 000 16zM21 21l-4.35-4.35M11 8v6M8 11h6'/%3E%3C/svg%3E%0A")
          1x
      )
      18 18,
    zoom-in;
}

.pswp--zoomed-in .pswp__img {
  cursor: -webkit-grab;
  cursor: -moz-grab;
  cursor: grab;
}

.pswp:not(.pswp--supports-fs) button.pswp__button--fs,
.pswp:not(.pswp--zoom-allowed) button.pswp__button--zoom {
  display: none;
}

@media screen and (max-width: 37.5rem) {
  .pswp__img {
    padding: 0.75rem;
  }
  button.pswp__button.pswp__button--close {
    margin-right: 0;
  }
}

/* Footer
--------------------------------------------- */
/* General */
#colophon .border-bottom {
  padding-bottom: 2rem;
}
.bodyfooter {
  padding-bottom: 2rem;
  align-items: stretch;
}

.site-footer .linkfooter .small > div.mb-4 {
  margin-bottom: 0.8rem;
  align-items: baseline;
}
.site-footer h4 {
  font-size: 1rem;
}

.bodyfooter > .flex-column.flex-shrink-0:not(:last-child) {
  width: 20%;
}

.footer-logo {
  height: 20px;
  width: 107px;
}

.prefooter {
  min-height: 150px;

  content-visibility: auto;
  contain-intrinsic-size: auto 302px;
}

.linkfooter {
  content-visibility: auto;
  contain-intrinsic-size: auto 280px;
}

.social-icons {
  width: 40px;
  height: 40px;
}

@media screen and (max-width: 37.5rem) {
  .prefooter {
    contain-intrinsic-size: auto 511px;
  }

  .bodyfooter {
    flex-direction: column;
    padding: 0 0.5rem;
  }

  .bodyfooter > div {
    width: 100%;
    margin-bottom: 1rem;
    padding-bottom: 2.5rem;
    border-bottom: var(--border);
  }

  .bodyfooter > div:nth-child(3) {
    border-bottom: none;
    margin-bottom: 0;
  }

  .bodyfooter > div:last-child {
    order: -1;
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 1.5rem;
    justify-content: center;
  }
  #fullpage-menu .bodyfooter .product-carbon-offset {
    display: none;
  }

  .trustfooter {
    flex-direction: column;
    gap: 2rem;
  }

  .trustfooter .payments-available__list ul {
    flex-wrap: nowrap;
    overflow-y: scroll;
    width: calc(100vw - 0.75rem);
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
  }
  .trustfooter .payments-available__list ul::-webkit-scrollbar {
    display: none; /* Chrome, Safari and Opera */
  }
}
@media screen and (max-width: 64rem) {
  .footer-logo,
  .logo-link svg {
    width: 84px;
    height: 16px;
  }
  .linkfooter {
    white-space: nowrap;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch; /* Momentum iOS */
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }
}

/* Favourites common
--------------------------------------------- */
/**
* Favourite btn
*/
button.add-to-favourites {
  cursor: pointer;
  box-shadow: 0 6px 8px 0 rgb(0 0 0 / 20%);
  -webkit-box-shadow: 0 6px 8px 0 rgb(0 0 0 / 20%);
}

button.add-to-favourites .gpbox-icon.white-bubble {
  box-shadow: none;
  -webkit-box-shadow: none;
}

.text-favourite-btn {
  position: absolute;
  top: 1rem;
  right: 1rem;
}
.text-favourite-btn .white-bubble {
  width: 215px;
  border-radius: 50px;
}
.text-favourite-btn.add-to-favourites svg {
  width: 24px;
  height: 24px;
}

@media screen and (max-width: 37.5rem) {
  .mobile .text-favourite-btn {
    right: 0rem;
    top: 0.75rem;
  }
}

@media screen and (max-width: 1580px) {
  body:not(.mobile) .text-favourite-btn {
    right: -0.5rem;
  }
}

/* Favourites popup */
.modal-container.modal-container-favourites {
  margin-bottom: 1rem !important;
  padding: 1.5rem;
}

#favourite-element-image img {
  width: 80px;
  height: 80px;
  object-fit: cover;
  border-radius: 8px;
  border: var(--border);
}

.mobile #myaccount-product-history .add-to-favourites {
  display: none;
}

.mobile .modal-container.modal-container-favourites {
  padding: 1.25rem;
  max-width: 95%;
}

.mobile #favourite-element-image img {
  width: 60px;
  height: 60px;
  min-width: 60px;
  min-height: 60px;
}

/* Protection Popup */
#product-protection-modal .modal-container {
  max-width: 700px;
  padding-top: 1.5rem;
  margin-top: auto;
  margin-bottom: auto;
  height: fit-content;
}

#product-protection-modal .product-protection-wrapper {
  overflow-y: scroll;
  padding-right: 0.5rem;
  max-height: calc(95vh - 36px);
  max-height: calc(95dvh - 36px);
}

.mobile #product-protection-modal .modal-container {
  border-radius: 20px;
  padding: 1rem 0 0 0;
}

.mobile #product-protection-modal .product-protection-wrapper {
  border-top: var(--border);
  padding: 1rem 1.5rem 1rem 1rem;
}
.mobile #product-protection-modal .modal-container .title {
  padding: 0 1rem;
}
.mobile #product-protection-modal .modal-container > .close-modal-cross {
  right: 0.5rem;
  top: 0.5rem;
}

#product-protection-modal .green-icon svg {
  width: 20px;
  height: 20px;
}
#product-protection-modal .green-icon.fill svg path:not([fill="white"]) {
  fill: var(--medium-dark-green-clr);
}
#product-protection-modal .green-icon.stroke svg path {
  stroke: var(--medium-dark-green-clr);
}

/* Newsletter Subscription Forms
--------------------------------------------- */
/* General */
.gpbox-chequered-pattern.darker svg path {
  opacity: 0.7;
  fill: var(--very-light-grey-clr);
}

.left-side-image .gpbox-chequered-pattern {
  position: absolute;
  right: 0;
  left: 0;
  bottom: -20%;
}

.left-side-image .gpbox-chequered-pattern svg {
  width: 100%;
}

.left-side-image img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  object-position: center;
  max-width: unset;
}

.right-side-form .text-container {
  font-size: 1.25rem;
  font-weight: 700;
  width: 75%;
  min-width: 300px;
}

/* Marketing Popup */
#marketing_modal_popup .modal-container {
  width: 900px;
  max-width: 90%;
  max-height: 90%;
  padding: 0px;
  align-items: stretch;
}
#marketing_modal_popup .left-side-image {
  overflow: hidden;
  width: 100%;
  border-radius: 24px 0 0 24px;
}
#marketing_modal_popup .right-side-form {
  width: 100%;
  padding: 10px;
}
#subscribe-form-popup {
  width: 70%;
  min-width: 300px;
  margin: 0 10px;
}

.subscribe-responses {
  width: 95%;
}

@media screen and (max-width: 37.5rem) {
  #marketing_modal_popup .logo-close {
    position: absolute;
    top: 0;
    width: 100%;
    padding: 0.5rem 0.5rem 0 1rem;
  }
  #marketing_modal_popup .logo-close .logo-container svg {
    width: 110px;
  }
  #marketing_modal_popup .right-side-form {
    padding: 1.25rem 1rem 1rem 1rem;
  }
  .right-side-form .text-container {
    font-size: 1rem;
  }
  #subscribe-form-popup,
  .right-side-form .text-container {
    width: 100%;
    min-width: unset;
  }
  #marketing_modal_popup .left-side-image {
    border-radius: 24px 24px 0 0;
    height: 170px;
    padding: 0;
  }
  #marketing_modal_popup .left-side-image .gpbox-chequered-pattern {
    width: 100%;
    left: 40%;
    top: -25%;
    opacity: 0.5;
  }
  .carbon-offset .content-image__right {
    order: -1;
    border-radius: 12px 12px 0 0;
    height: 190px;
    padding: 0 !important;
  }
  .carbon-offset .content-image__right img {
    border-radius: 0;
  }
  .section-content-image .margin-center {
    margin-left: auto;
  }
}

/* Footer Inline Newsletter */
.subscribe-inline-form input[type="email"] {
  width: 100%;
  min-width: 400px;
}
.subscribe-inline-form {
  align-items: stretch;
}
.subscribe-inline-form .left-side-image {
  overflow: hidden;
  width: 100%;
  border-radius: 12px 0 0 12px;
}
.subscribe-inline-form .right-side-form {
  border-radius: 0 12px 12px 0;
  background: var(--ultra-light-grey-clr);
  padding: 1rem;
}
.subscribe-inline-form .left-side-image img {
  max-height: 360px;
}
.subscribe-inline-form .left-side-image .gpbox-chequered-pattern {
  left: 28%;
  bottom: -59%;
  top: unset;
}

@media screen and (max-width: 37.5rem) {
  .subscribe-inline-form {
    flex-direction: column;
  }
  .subscribe-inline-form .left-side-image {
    border-radius: 12px 12px 0 0;
    height: 190px;
  }
  .subscribe-inline-form .right-side-form {
    border-radius: 0 0 12px 12px;
  }
  #subscribe-form-inline {
    width: 100%;
  }
  .subscribe-inline-form input[type="email"] {
    min-width: unset;
  }
}

@media screen and (min-width: 37.5rem) and (max-width: 64rem) {
  .subscribe-inline-form input[type="email"] {
    min-width: unset;
  }
  #subscribe-form-inline {
    width: 75%;
    min-width: 300px;
  }
}

/**
* Banner Blocks
*/
/* Light Grey Banner GPBox pattern logo*/
.grey-background__brand-pattern {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 0;
}
.grey-background__brand-pattern:not(.gpbox-chequered-pattern) svg {
  height: 885px;
  width: 2200px;
  transform: rotate(-25deg) translate(-10%, -32%);
}
.grey-background__brand-pattern:not(.gpbox-chequered-pattern) svg path {
  stroke: var(--very-light-grey-clr);
  stroke-width: 0.8;
  opacity: 0.5;
}

.grey-background__brand-pattern.gpbox-chequered-pattern svg {
  top: 50%;
  left: 50%;
  height: 100%;
  width: 150%;
  transform: translate(-50%, -50%);
  position: absolute;
}

@media screen and (max-width: 37.5rem) {
  .grey-background__brand-pattern:not(.gpbox-chequered-pattern) svg {
    top: 50%;
    left: 50%;
    height: 700px;
    width: 1200px;
    transform: translate(-50%, -50%) rotate(-25deg);
    position: absolute;
  }
}

/* Dark Grey Banner GPBox pattern logo intersection*/
.background__brand-pattern-intersect {
  position: absolute;
  bottom: 0;
  top: 0;
  right: 0;
}

.background__brand-pattern-intersect svg {
  height: 2700px;
  width: 2700px;
  transform: rotate(-45deg) translate(46%, -3%);
}

.background__brand-pattern-intersect svg path.intersect_accent {
  stroke: var(--accent-clr);
  z-index: 2;
  stroke-width: 0.5;
}

.background__brand-pattern-intersect svg path.intersect_bkg {
  stroke: var(--medium-grey-clr);
  opacity: 0.5;
  z-index: 0;
  stroke-width: 0.5;
}

/* Light Grey GPBox square pattern logo*/
.gpbox-chequered-pattern {
  top: -100%;
  bottom: -100%;
}

.gpbox-chequered-pattern svg {
  width: 100%;
}

.grey-background.dark-box img {
  border-radius: 10px;
  min-width: 250px;
  min-height: 250px;
  z-index: 1;
}

.grey-background.dark-box picture {
  z-index: 1;
}

/* Dark grey Content image block */
.section-content-image {
  border-radius: 10px;

  content-visibility: auto;
  contain-intrinsic-size: auto 360px;
}
.content-image__left {
  width: 30%;
  min-width: 480px;
  position: relative;
  padding: 0 40px;
  overflow: hidden;
  height: 360px;
  border-radius: 10px 0 0 10px;
}

.content-image__right {
  width: 100%;
  position: relative;
  overflow: hidden;
  height: 360px;
  padding: 3rem;
  border-radius: 0 10px 10px 0;
}

.section-content-image .margin-center {
  margin-left: 0px;
}

.content-image__right img {
  height: 100%;
  width: 100%;
  background-color: var(--dark-grey-clr);
  object-fit: cover;
  border-radius: 10px;
}

.section-content-image.carbon-offset {
  background-color: var(--medium-dark-green-clr);
  color: var(--text-white-clr);
}

.section-content-image.dark-grey {
  background-color: var(--dark-grey-clr);
  color: var(--text-white-clr);
}

@media screen and (max-width: 62rem) {
  .content-image__left {
    min-width: unset;
  }
  .carbon-offset .content-image__left {
    width: 100%;
    padding: 1.5rem;
    height: unset;
  }
  .section-content-image .margin-center {
    margin-left: auto;
  }
}

/*--------------------------------------------------------------
# Woocommerce
--------------------------------------------------------------*/

/* Ratings & Reviews
--------------------------------------------- */

.star-rating {
  display: flex;
  overflow: hidden;
  position: relative;
  height: 20px;
  width: 100px;
}
.star-rating span {
  top: 0;
  left: 0;
  position: absolute;
}
.star-rating::before,
.star-rating span::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' viewBox='0 0 24 24' focusable='false'%3E%3Cpath stroke='var(--dark-grey-clr, %231c1c1c)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/%3E%3C/svg%3E ");
  background-size: contain;
  background-repeat: repeat-x;
  width: 100%;
  height: 20px;
  z-index: 1;
}
.star-rating span::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' viewBox='0 0 24 24' focusable='false'%3E%3Cpath fill='var(--dark-grey-clr, %231c1c1c)' stroke='var(--dark-grey-clr, %231c1c1c)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/%3E%3C/svg%3E ");
  z-index: 2;
}

h2 > .review-number {
  font-size: var(--big);
}

.verified-badge > span {
  cursor: pointer !important;
}

.vendor-verified {
  display: inline-block;
}

.vendor-verified svg path {
  fill: var(--bright-blue-clr);
  stroke: var(--bright-blue-clr);
}

.vendor-verified .big svg {
  width: 26px;
  height: 26px;
}

.verified-badge .review-verified__icon.white svg path {
  fill: var(--text-white-clr);
  stroke: var(--text-white-clr);
}

/* Shop Tables
--------------------------------------------- */
table.shop_table_responsive thead,
table.shop_table_responsive tbody th {
  display: none;
}

@media screen and (min-width: 37.5rem) {
  table.shop_table_responsive thead {
    display: table-header-group;
  }

  table.shop_table_responsive tbody th {
    display: table-cell;
  }

  table.shop_table_responsive tr th,
  table.shop_table_responsive tr td {
    text-align: left;
  }

  table.shop_table_responsive tr td {
    display: table-cell;
  }
}

/* Currency and Country Selectors
--------------------------------------------- */
/* Set the widget of the country dropdown  */
.widget_wc_aelia_currencyswitcher_widget #aelia_cs_currencies,
.widget_wc_aelia_country_selector_widget .countries {
  width: 100%;
}

.country-currency__selector:not(.country-currency-nav__selector) {
  margin: -0.5rem -1rem;
  height: 40px;
  padding: 0rem 1rem;
}
.country-currency__selector.vertical-border > * {
  line-height: inherit;
}

#country-currency-custom select {
  -webkit-transition: border-color 200ms ease-out,
    -webkit-box-shadow 200ms ease-out;
  transition: border-color 200ms ease-out, -webkit-box-shadow 200ms ease-out;
  -o-transition: border-color 200ms ease-out, box-shadow 200ms ease-out;
  transition: border-color 200ms ease-out, box-shadow 200ms ease-out;
  transition: border-color 200ms ease-out, box-shadow 200ms ease-out,
    -webkit-box-shadow 200ms ease-out;
  -webkit-appearance: none;
  -ms-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: block;
  font-family: inherit;
  font-size: 16px;
  height: 48px;
  padding-left: 12px;
  padding-right: 36px;
  width: 100%;
  border-radius: 6px;
  background: #ffffff;
  border: var(--border);
  text-indent: 0.01px;
  cursor: pointer;
}
#country-currency-custom select:hover {
  border-color: rgba(34, 34, 34, 0.5);
  -webkit-box-shadow: 0 1px 12px 0 rgba(34, 34, 34, 0.2);
  box-shadow: 0 1px 12px 0 rgba(34, 34, 34, 0.2);
}
#country-currency-custom select:focus {
  border-color: rgba(34, 34, 34, 0.5);
  -webkit-box-shadow: 0 0 0 2px white, 0 0 0 4px var(--dark-grey-clr) !important;
  box-shadow: 0 0 0 2px white, 0 0 0 4px var(--dark-grey-clr) !important;
}

#country-currency-custom .custom-select:after {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 16 16' focusable='false'%3E%3Cpath stroke='var(--accent-clr, %23ff3d00)' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M4 6l4 4 4-4'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  width: 24px;
  height: 24px;
  pointer-events: none;
  position: absolute;
  right: 10px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

/*--------------------------------------------------------------
# Utilities
--------------------------------------------------------------*/
/* Modal
--------------------------------------------- */
.modal-overlay {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow-y: auto;
  overflow-x: hidden;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  min-height: 100%;
  z-index: 99999;
  padding-top: env(safe-area-inset-top, 0px);
  padding-bottom: env(safe-area-inset-bottom, 0px);
  pointer-events: none; /* This allows clicks go throught the overlay so, we detect
	with js that the click happens outside of the modal. */
  touch-action: none;
  -ms-touch-action: none;
  overscroll-behavior: contain;
}

#fullpage-menu.modal-overlay {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.modal-overlay:not(.active) {
  visibility: hidden;
  background: rgba(34, 34, 34, 0);
  -webkit-transition: visibility 0ms linear 300ms, z-index 0ms linear 300ms,
    background-color 300ms ease-out;
  -o-transition: visibility 0ms linear 300ms, z-index 0ms linear 300ms,
    background-color 300ms ease-out;
  transition: visibility 0ms linear 300ms, z-index 0ms linear 300ms,
    background-color 300ms ease-out;
}

.modal-overlay:not(.modal-no-background).active {
  visibility: visible;
  background: rgba(34, 34, 34, 0.65);
  -webkit-transition-delay: 0ms;
  -o-transition-delay: 0ms;
  transition-delay: 0ms;
}

.modal-overlay.modal-no-background.active {
  overflow: hidden !important;
}

.modal-container:not(.fullpage-menu-container) {
  pointer-events: auto;
  -webkit-box-shadow: var(--box-shadow);
  box-shadow: var(--box-shadow);
  background: white;
  border-radius: 24px;
  position: relative;
  margin: auto;
  max-width: 580px;
  width: 100%;
  z-index: 10;
  padding: 30px;
  opacity: 0;
  -webkit-transform: translateY(30px) scale(0.965) perspective(1px);
  transform: translateY(30px) scale(0.965) perspective(1px);
  -webkit-transition: opacity 150ms ease-out,
    -webkit-transform 195ms var(--bezier);
  transition: opacity 150ms ease-out, -webkit-transform 195ms var(--bezier);
  -o-transition: opacity 150ms ease-out, transform 195ms var(--bezier);
  transition: opacity 150ms ease-out, transform 195ms var(--bezier);
  transition: opacity 150ms ease-out, transform 195ms var(--bezier),
    -webkit-transform 195ms var(--bezier);
}

@media screen and (max-width: 37.5rem) {
  body.mobile .modal-container:not(.fullpage-menu-container) {
    width: 95%;
    padding: 1.5rem;
    overscroll-behavior: contain;
  }
}
@media screen and (min-width: 37.5rem) {
  body.mobile #fullpage-menu .mw-container {
    overflow: auto !important;
    -webkit-overflow-scrolling: unset !important;
  }
}

.modal-overlay.active .modal-container {
  opacity: 1 !important;
  -webkit-transform: translateY(0px) scale(1) perspective(1px);
  transform: translateY(0px) scale(1) perspective(1px);
  -webkit-transition-delay: 25ms;
  -o-transition-delay: 25ms;
  transition-delay: 25ms;
}

.modal-container.modal-drawer {
  width: 31.25rem;
  padding: 0;
  max-width: unset;
  overflow-y: auto;
  overflow-x: hidden;
  border-radius: 0;
  margin: 0 0 0 auto;
  -webkit-transform: translateX(100%) scale(1) perspective(1px);
  transform: translateX(100%) scale(1) perspective(1px);
  transition: opacity 150ms ease-out,
    -webkit-transform 195ms var(--bezier-nobounce);
  -o-transition: opacity 150ms ease-out, transform 195ms var(--bezier-nobounce);
  transition: opacity 150ms ease-out, transform 195ms var(--bezier-nobounce);
  transition: opacity 150ms ease-out, transform 195ms var(--bezier-nobounce),
    -webkit-transform 195ms var(--bezier-nobounce);
}
.modal-container.modal-drawer.drawer-left {
  margin: 0 auto 0 0;
  -webkit-transform: translateX(-100%) scale(1) perspective(1px);
  transform: translateX(-100%) scale(1) perspective(1px);
}
.modal-overlay.active .modal-container.modal-drawer {
  -webkit-transform: translateX(0) scale(1) perspective(1px) !important;
  transform: translateX(0) scale(1) perspective(1px) !important;
}

body.modal-opened:not(.modal-opened-fullpage-menu) #page {
  pointer-events: none;
}

body.modal-opened:not(.modal-opened-scroll) {
  /* when modal active */
  touch-action: none;
  -webkit-overflow-scrolling: none;
  /* Other browsers */
  overscroll-behavior: none;
  overflow: hidden;
}

#country-currency-modal {
  z-index: 999999999;
}

.fullpage-mobile-close-container {
  position: absolute;
  right: calc(-40px - 0.5rem);
  background: white;
  border-radius: 50px;
}

/* Menu Drawer
--------------------------------------------- */
.modal-drawer
  .top-box
  .grey-background__brand-pattern:not(.gpbox-chequered-pattern)
  svg {
  height: 515px;
  width: 1200px;
  transform: rotate(-25deg) translate(-21%, -43%);
}
.modal-drawer
  .top-box
  .grey-background__brand-pattern:not(.gpbox-chequered-pattern)
  svg
  path {
  opacity: 0.25;
  stroke-width: 1.5;
}

.modal-drawer .top-box > * {
  padding: 1.25rem 3rem;
}
.modal-drawer .top-box > div:first-child {
  padding: 8.5rem 3rem 2.5rem;
}
.modal-drawer section {
  padding: 2.5rem 3rem;
}
.modal-drawer section:first-of-type {
  padding-bottom: 0;
}
.modal-drawer .top-box > a {
  border-top: 1px solid var(--very-light-grey-clr);
}
.modal-drawer .top-box > a:last-of-type {
  background-color: var(--accent-clr);
  border-top: 0;
}
.modal-drawer .top-box > a:last-of-type h4 {
  color: var(--text-white-clr);
}

.modal-drawer .top-box > a:hover h4 {
  text-decoration: underline;
}

.modal-drawer .top-box h4 {
  font-size: 18px;
}

.modal-drawer .gpbox-icon.white-bubble {
  border: var(--border);
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
}

.modal-drawer .top-box .gpbox-icon.white-bubble svg,
.modal-drawer .gpbox-icon.w-20 svg {
  width: 20px;
  min-width: 20px;
  height: 20px;
}
.modal-drawer .top-box .gpbox-icon.white-bubble svg path,
.modal-drawer .gpbox-icon.w-20 svg path {
  stroke-width: 1.5;
}

/* Menu Popup
--------------------------------------------- */
[data-haspopup][aria-expanded="true"] ~ .popup-body {
  transition: opacity 180ms ease-out,
    box-shadow 180ms cubic-bezier(0.175, 0.885, 0.4, 1.1),
    transform 180ms cubic-bezier(0.175, 0.885, 0.4, 1.1),
    visibility 180ms linear;
  box-shadow: var(--box-shadow);
  -webkit-box-shadow: var(--box-shadow);
  opacity: 1 !important;
  transform: scaleX(1) scaleY(1) perspective(1px);
  visibility: visible;
  z-index: 99999;
}

.popup-body {
  background: white;
  border-radius: 12px;
  border: var(--border-transparent);
  min-width: 160px;
  max-width: 350px;
  max-height: 480px;
  position: absolute;
  z-index: 70;
  box-shadow: 0px 0px 0px transparent;
  -webkit-box-shadow: 0px 0px 0px transparent;
  opacity: 0;
  transform: scaleX(0.5) scaleY(0.2) perspective(1px);
  transform-origin: top right;
  visibility: hidden;
  transition: box-shadow 180ms cubic-bezier(0.6, 0, 0.825, 0.115) 0s,
    opacity 108ms cubic-bezier(0.6, 0, 0.825, 0.115) 72ms,
    transform 180ms cubic-bezier(0.6, 0, 0.825, 0.115) 0s,
    visibility 0s linear 144ms;
}

.popup-body.popup-left-bottom {
  top: calc(100% + 0.875rem);
  left: auto;
  right: 0;
}
.popup-body:not(.popup-no-arrow)::after {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  top: -6px;
  right: 26px;
  transform: rotate(45deg);
  background: white;
}

/* Dropdown
--------------------------------------------- */
.dropdown-container {
  opacity: 0;
  -webkit-transform: translateY(-5px);
  -ms-transform: translateY(-5px);
  transform: translateY(-5px);
  -webkit-transition: opacity 150ms ease-out,
    -webkit-transform 100ms var(--bezier-nobounce);
  transition: opacity 150ms ease-out,
    -webkit-transform 100ms var(--bezier-nobounce);
  -o-transition: opacity 150ms ease-out, transform 100ms var(--bezier-nobounce);
  transition: opacity 150ms ease-out, transform 100ms var(--bezier-nobounce);
  transition: opacity 150ms ease-out, transform 100ms var(--bezier-nobounce),
    -webkit-transform 100ms var(--bezier-nobounce);
}

.dropdown-container.active {
  opacity: 1;
  -webkit-transform: translateY(0px);
  -ms-transform: translateY(0px);
  transform: translateY(0px);
  -webkit-transition-delay: 75ms;
  -o-transition-delay: 75ms;
  transition-delay: 75ms;
}

/* Read More
--------------------------------------------- */
.more.bg-icon-text {
  display: none;
  text-align: center;
  padding: 0px;
  -webkit-box-shadow: 0 -3px 4px 2px rgba(255, 255, 255, 0.7);
  box-shadow: 0 -3px 4px 2px rgba(255, 255, 255, 0.7);
  position: absolute;
  bottom: -1.5rem;
  margin: 0 auto;
  width: 100%;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 0;
}
.more.bg-icon-text::before {
  width: 115px;
  left: 50%;
  -webkit-transform: scale(0.7) perspective(1px) translateX(-50%);
  transform: scale(0.7) perspective(1px) translateX(-50%);
}
@media (hover: hover) and (pointer: fine) {
  .more.bg-icon-text:hover::before {
    -webkit-transform: scale(1) perspective(1px) translateX(-50%);
    transform: scale(1) perspective(1px) translateX(-50%);
  }
}
.more[aria-expanded="true"] {
  -webkit-box-shadow: none;
  box-shadow: none;
  background: transparent;
}

.teaser {
  overflow: hidden;
  -webkit-transition: max-height 295ms var(--bezier-nobounce),
    padding 95ms var(--bezier-nobounce);
  -o-transition: max-height 295ms var(--bezier-nobounce),
    padding 95ms var(--bezier-nobounce);
  transition: max-height 295ms var(--bezier-nobounce),
    padding 95ms var(--bezier-nobounce);
  /* margin-bottom: 1rem; */
}
.teaser-2 {
  max-height: 4rem;
}
.teaser-3 {
  max-height: 5rem;
}
.teaser-4 {
  max-height: 7rem;
}
.teaser-10 {
  max-height: 16rem;
}
.teaser.fulltext {
  max-height: 200rem;
  padding-bottom: 2rem;
}
.teaser-10.fulltext {
  max-height: 200rem;
}

@media screen and (max-width: 37.5rem) {
  .teaser-2 {
    max-height: 7rem;
  }
  .teaser-3 {
    max-height: 4rem;
  }
}

/* Accessibility
--------------------------------------------- */

/* Text meant only for screen readers. */
.screen-reader-only,
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
}

.screen-reader-only:focus,
.screen-reader-only:focus-visible,
.screen-reader-text:focus,
.screen-reader-text:focus-visible {
  background-color: var(--ultra-light-grey-clr);
  border-radius: 3px;
  -webkit-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  -webkit-clip-path: none;
  clip-path: none;
  color: var(--dark-grey-clr);
  display: block;
  font-size: 0.875rem;
  font-weight: 700;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
}

/* Do not show the outline on the skip link target. */
#primary[tabindex="-1"]:focus,
#primary[tabindex="-1"]:focus-visible {
  outline: 0;
}

/* General elements
--------------------------------------------- */
/* General popup overlay */
#page:after,
.sticky-header:after,
#masthead .site-header:after {
  content: "";
  height: 100%;
  width: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  visibility: hidden;
  background: rgba(34, 34, 34, 0);
  -webkit-transition: visibility 0ms linear 300ms, z-index 0ms linear 300ms,
    background-color 300ms ease-out;
  -o-transition: visibility 0ms linear 300ms, z-index 0ms linear 300ms,
    background-color 300ms ease-out;
  transition: visibility 0ms linear 300ms, z-index 0ms linear 300ms,
    background-color 300ms ease-out;
  z-index: 0;
}
body.modal-opened-mobile-search-modal #page:after,
body.modal-opened-mobile-search-modal .sticky-header:after,
body.modal-opened-mobile-search-modal #masthead .site-header:after {
  background: none !important;
}

#page.bodyoverlay:after,
#page.bodyoverlay .sticky-header:after,
#page.bodyoverlay #masthead .site-header:after {
  z-index: 3;
  visibility: visible;
  background: rgba(34, 34, 34, 0.55);
  -webkit-transition-delay: 0ms;
  -o-transition-delay: 0ms;
  transition-delay: 0ms;
}

/* General Spinner effect */
.lds-ripple {
  position: relative;
  width: 72px;
  height: 72px;
  overflow: hidden;
  display: flex;
  z-index: 1;
}
.lds-ripple div {
  position: absolute;
  inset: 0;
  margin: auto;
  border: 4px solid var(--light-grey-clr);
  opacity: 1;
  border-radius: 50%;
  -webkit-animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
  animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
  -webkit-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
  -webkit-transform-style: preserve-3d;
  z-index: 1;
}
.lds-ripple div:nth-child(2) {
  -webkit-animation-delay: -0.5s;
  animation-delay: -0.5s;
}
.ripple-spinner .button-spinner {
  position: absolute;
  height: 100%;
  top: 0;
  right: 0.5rem;
  display: flex;
  align-items: center;
}
.ripple-spinner .button-spinner.smaller {
  right: 0.25rem;
}
.ripple-spinner .button-spinner .lds-ripple {
  width: 40px;
  height: 40px;
}

@-webkit-keyframes lds-ripple {
  0% {
    width: 8px;
    height: 8px;
    opacity: 0;
  }
  4.9% {
    width: 8px;
    height: 8px;
    opacity: 0;
  }
  5% {
    width: 8px;
    height: 8px;
    opacity: 1;
  }
  100% {
    width: 100%;
    height: 100%;
    opacity: 0;
  }
}
@keyframes lds-ripple {
  0% {
    width: 8px;
    height: 8px;
    opacity: 0;
  }
  4.9% {
    width: 8px;
    height: 8px;
    opacity: 0;
  }
  5% {
    width: 8px;
    height: 8px;
    opacity: 1;
  }
  100% {
    width: 100%;
    height: 100%;
    opacity: 0;
  }
}

/* Accent Price */
.accent-price__value {
  font-size: 2rem;
  font-weight: 900;
  align-items: baseline;
  line-height: 2rem;
}

.accent-price__value .woocommerce-Price-currencySymbol {
  font-size: 1.8rem;
  font-weight: 700;
}

/* Simple image grid */
.image-grid {
  padding: 0;
  display: grid;
  row-gap: 1.25rem;
  column-gap: 1.25rem;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  list-style: none;
  justify-items: stretch;
  align-items: start;
}
.image-grid img {
  border-radius: 8px;
  border: var(--border);
}

@media screen and (max-width: 37.5rem) {
  .image-grid {
    grid-template-columns: repeat(2, 1fr);
    row-gap: 1.5rem;
    column-gap: 1.5rem;
  }
  .image-grid img:nth-child(n + 11) {
    display: none;
  }
}

/* Gifts sections */
.gift-box {
  min-height: 180px;
  padding: 1.5rem;
  padding-right: 2rem;
  overflow: hidden;
}

.gift-box-wrapper:nth-child(1) .gift-box {
  background: var(--accent-clr);
}
.gift-box-wrapper:nth-child(2) .gift-box {
  background: var(--very-light-grey-clr);
}
.gift-box-wrapper:nth-child(3) .gift-box {
  background: var(--light-grey-clr);
}
.gift-box-wrapper:nth-child(4) .gift-box {
  background: var(--medium-grey-clr);
}

.gift-box > h2,
.gift-box > h3 {
  font-weight: 900;
  font-size: var(--big);
}

.gift__stripes {
  position: absolute;
  right: 0px;
  top: 0px;
  height: 100%;
  width: 22%;
  max-width: 150px;
}
.gift__stripes {
  opacity: 0.35;
  transform: scale(1.5);
  transition: transform 295ms var(--bezier);
}

.gift__stripes > svg {
  -webkit-mask-image: -webkit-gradient(
    linear,
    left top,
    right top,
    from(rgba(0, 0, 0, 0)),
    to(rgba(0, 0, 0, 1))
  );
  -webkit-mask-image: linear-gradient(
    90deg,
    rgba(0, 0, 0, 0),
    rgba(0, 0, 0, 1)
  );
  mask-image: -webkit-gradient(
    linear,
    left top,
    right top,
    from(rgba(0, 0, 0, 0)),
    to(rgba(0, 0, 0, 1))
  );
  mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1));
  rotate: 5deg;
}

.gift-value {
  color: var(--text-white-clr);
  /* font-size: clamp(3rem, 7vw, 6.5rem); */
  font-size: min(
    max(3rem, 7vw),
    6.5rem
  ); /*Fixes safari issue with clamp font size*/
  font-weight: 900;
  opacity: 0.7;
  line-height: 4rem;
  transition: transform 295ms var(--bezier), opacity 295ms var(--bezier);
  align-items: baseline;
  width: 100%;
}

.gift-value .woocommerce-Price-currencySymbol {
  font-weight: 700;
  /* font-size: clamp(2.8rem, 5vw, 5rem); */
  font-size: min(
    max(2.8rem, 5vw),
    5rem
  ); /*Fixes safari issue with clamp font size*/
}

@media (hover: hover) and (pointer: fine) {
  a.gift-box-hover:hover .header-banner__stripes.gift__stripes {
    transform: scale(2.5);
  }

  a.gift-box-hover:hover .gift-value {
    transform: scale(1.1);
    opacity: 1;
  }
}

@media screen and (min-width: 37.5rem) and (max-width: 64rem) {
  .gift-value {
    bottom: -5%;
  }

  .gift-box .btn-small {
    display: none;
  }
}

.display-none-soft {
  display: none;
}

/* Notification Icons */
.notification-icon {
  width: 24px;
  min-width: 24px;
  max-width: 24px;
  min-height: 24px;
  max-height: 24px;
  height: 24px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
}
.notification-icon:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: transparent;
  background-size: 14px 14px;
  background-position: center center;
  background-repeat: no-repeat;
  border-radius: 50%;
}

.notification-mail.notification-icon:before {
  background-color: var(--fade-blue-clr);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' viewBox='0 0 16 16' focusable='false'%3E%3Cpath stroke='var(--dark-blue-clr, %23005fbd)' stroke-linecap='round' stroke-linejoin='round' stroke-width='1' d='M2.667 2.667h10.666c.734 0 1.334.6 1.334 1.333v8c0 .733-.6 1.333-1.334 1.333H2.667c-.734 0-1.334-.6-1.334-1.333V4c0-.733.6-1.333 1.334-1.333z'/%3E%3Cpath stroke='var(--dark-blue-clr, %23005fbd)' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.33' d='M14.667 4L8 8.667 1.333 4'/%3E%3C/svg%3E");
}

.notification-waitlist.notification-icon:before {
  background-color: var(--very-light-grey-clr);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' viewBox='0 0 24 24' focusable='false'%3E%3Cpath stroke='var(--medium-grey-clr, %234a4d54)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2 2 6.477 2 12s4.477 10 10 10z'/%3E%3Cpath stroke='var(--medium-grey-clr, %234a4d54)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 6v6l4 2'/%3E%3C/svg%3E%0A");
}

.notification-cart.notification-icon:before {
  background-color: var(--fade-green-clr);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' viewBox='0 0 24 24' focusable='false'%3E%3Cpath stroke='var(--medium-dark-green-clr, %2379c501)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M20 22a1 1 0 100-2 1 1 0 000 2zM9 22a1 1 0 100-2 1 1 0 000 2zM1 1h4l2.68 13.39a2 2 0 002 1.61h9.72a2 2 0 002-1.61L23 6H6'/%3E%3C/svg%3E ");
}

.notification-star_empty.notification-icon:before {
  background-color: var(--fade-yellow-clr);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' viewBox='0 0 24 24' focusable='false'%3E%3Cpath stroke='var(--bright-yellow-clr, %23ffbd00)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/%3E%3C/svg%3E ");
}

.notification-info.notification-icon:before {
  background-color: var(--very-light-grey-clr);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' viewBox='0 0 24 24' focusable='false'%3E%3Cpath fill='var(--medium-grey-clr, %234a4d54)' fill-rule='evenodd' d='M12.707 16.707A1 1 0 0111 16v-4a1 1 0 012 0v4a1 1 0 01-.293.707zm4.849 3.608A10 10 0 116.444 3.685a10 10 0 0111.112 16.63zM16.445 5.348a8 8 0 10-8.89 13.304 8 8 0 008.89-13.304zM12 7a1 1 0 100 2 1 1 0 000-2z' clip-rule='evenodd'/%3E%3C/svg%3E ");
}

.notification-announcement.notification-icon:before {
  background-color: var(--very-light-grey-clr);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 24 24' focusable='false'%3E%3Cpath fill='var(--dark-grey-clr, %231c1c1c)' d='M19.991 2.002a1 1 0 00-1 1v.637a9.036 9.036 0 01-7 3.363h-6a3.003 3.003 0 00-3 3v2a3.003 3.003 0 003 3h.484l-2.403 5.606a.999.999 0 00.92 1.394h4a.999.999 0 00.918-.607l2.724-6.355a9.026 9.026 0 016.357 3.325v.637a1 1 0 002 0v-16a.998.998 0 00-1-1zm-14 11a1 1 0 01-1-1v-2a1 1 0 011-1h1v4h-1zm2.341 7H6.508l2.142-5h1.825l-2.143 5zm10.66-4.478a11.052 11.052 0 00-7-2.522h-3v-4h3a11.053 11.053 0 007-2.522v9.044z'%3E%3C/path%3E%3C/svg%3E");
}

.notification-repeat.notification-icon:before {
  background-color: #f8d5cc;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' viewBox='0 0 24 24' focusable='false' %3E%3Cpath stroke='var(--bright-red-clr, %23dd2c00)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M7 23l-4-4 4-4'/%3E%3Cpath stroke='var(--bright-red-clr, %23dd2c00)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M21 13v2a4 4 0 01-4 4H3M17 1l4 4-4 4'/%3E%3Cpath stroke='var(--bright-red-clr, %23dd2c00)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 11V9a4 4 0 014-4h14'/%3E%3C/svg%3E ");
}

.notification-heart.notification-icon:before {
  background-color: #ffd9ce;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='7 6 50 50' aria-hidden='true' focusable='false' class='unstroked'%3E%3Cpath stroke='var(--accent-clr, %23ff3b00)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round' class='st0' d='m32 49.6c9-9 19.6-15.4 19.6-23.8 0-10.2-10.9-15.8-19.6-7.4-8.7-8.4-19.6-2.8-19.6 7.4 0 8.4 10.6 14.8 19.6 23.8z'/%3E%3C/svg%3E ");
}

.notification-truck.notification-icon:before {
  background-color: var(--fade-blue-clr);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' focusable='false'%3E%3Cpath fill='var(--dark-blue-clr, %23005fbd)' fill-rule='evenodd' clip-rule='evenodd' d='M1 4h15v3h3.0246l3.9793 5.6848V18h-2.6567c-.4218 1.3056-1.6473 2.25-3.0933 2.25-1.446 0-2.6715-.9444-3.0932-2.25h-3.9044c-.4217 1.3056-1.6472 2.25-3.0932 2.25S4.4916 19.3056 4.0698 18H1V4zm3.0698 12c.4218-1.3056 1.6473-2.25 3.0933-2.25 1.446 0 2.6715.9444 3.0932 2.25H14V6H3v10h1.0698zM16 14.0007a3.24 3.24 0 0 1 1.2539-.2507c1.446 0 2.6715.9444 3.0933 2.25h.6567v-2.6848L17.9833 9H16v5.0007zM7.163 15.75c-.6903 0-1.25.5596-1.25 1.25s.5597 1.25 1.25 1.25c.6904 0 1.25-.5596 1.25-1.25s-.5596-1.25-1.25-1.25zm10.0909 0c-.6904 0-1.25.5596-1.25 1.25s.5596 1.25 1.25 1.25 1.25-.5596 1.25-1.25-.5596-1.25-1.25-1.25z'%3E%3C/path%3E%3C/svg%3E ");
}

@media screen and (max-width: 87rem) {
  /* 1400px */
  .no-1400 {
    display: none;
  }
}

@media screen and (max-width: 64rem) {
  .desktop-only {
    display: none !important;
  }

  .tablet-only {
    display: flex !important;
  }
}

@media screen and (max-width: 37.5rem) {
  body.mobile .no-mobile,
  body.mobile .desktop-only {
    display: none !important;
  }
}

@media screen and (max-width: 87rem) {
  /* 1400px */
  body.desktop .no-1400-checkout {
    display: none;
  }
}

.email-only {
  display: none;
}

@media screen and (max-width: 37.5rem) {
  .desktop-only {
    display: none !important;
  }

  .mobile-only {
    display: flex !important;
  }

  .no-mobile {
    display: none !important;
  }

  .mb-nm {
    margin: 0;
  }

  .mb-np {
    padding: 0;
  }

  .mb-block {
    display: block;
  }

  .mb-flex-align {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    display: -webkit-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: distribute;
    justify-content: space-around;
  }

  .mb-flex-between {
    justify-content: space-between;
  }

  .mb-flex-around {
    justify-content: space-around;
  }

  .mb-flex-column {
    flex-direction: column;
  }

  .mb-flex-row {
    flex-direction: row;
  }

  .mb-flex-row-reverse {
    flex-direction: row-reverse;
  }

  .mb-flex-column-start {
    align-items: flex-start;
  }

  .mb-flex-center {
    justify-content: center;
  }

  .mb-flex-end {
    justify-content: flex-end;
  }

  .mb-flex-top {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
  }

  .mb-flex-wrap {
    flex-wrap: wrap;
  }

  .mb-fluid {
    width: 100%;
  }
  .mb-half-fluid {
    width: 50%;
  }

  .mb-mb2 {
    margin-bottom: 0.2rem;
  }

  .mb-mb5 {
    margin-bottom: 0.5rem;
  }

  .mb-mb10 {
    margin-bottom: 1rem;
  }

  .mb-mb15 {
    margin-bottom: 1.5rem;
  }

  .mb-mb20 {
    margin-bottom: 2rem;
  }

  .mb-mb25 {
    margin-bottom: 2.5rem;
  }

  .mb-mb30 {
    margin-bottom: 3rem;
  }

  .mb-mb40 {
    margin-bottom: 4rem;
  }

  .mb-mr2 {
    margin-right: 0.25rem;
  }

  .mb-mr5 {
    margin-right: 0.5rem;
  }

  .mb-mr10 {
    margin-right: 1rem;
  }

  .mb-mt5 {
    margin-top: 0.5rem;
  }

  .mb-mt10 {
    margin-top: 1rem;
  }

  .mb-mt15 {
    margin-top: 1.5rem;
  }

  .mb-mt30 {
    margin-top: 3rem;
  }

  .mb-align-center {
    text-align: center;
  }

  .mb-align-right {
    text-align: right;
  }

  .mb-margin-center {
    margin-left: auto;
    margin-right: auto;
  }

  .grey-box {
    padding: 1.25rem;
  }

  section.section-icons {
    contain-intrinsic-size: auto 576px;
  }

  .icons-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-row-gap: 3rem;
    grid-column-gap: 1rem;
    place-items: center;
    align-items: start;
  }

  .gpbox-chequered-pattern {
    width: 275%;
    left: -100%;
    top: 0;
    bottom: 0;
  }

  #country-currency-custom .action-buttons {
    justify-content: space-between;
  }

  #country-currency-custom .action-buttons > * {
    width: 100%;
  }

  .country-currency__selector:not(.country-currency-nav__selector) {
    padding: 0.35rem 0px;
    margin-left: -1rem;
    margin-right: -1rem;
  }
}

@media screen and (min-width: 37.5rem) and (max-width: 64rem) {
  .no-tablet {
    display: none !important;
  }

  .tb-nm {
    margin: 0;
  }

  .tb-margin-center {
    margin-left: auto;
    margin-right: auto;
  }

  .tb-mb5 {
    margin-bottom: 0.5rem;
  }

  .tb-mb10 {
    margin-bottom: 1rem;
  }

  .tb-mb20 {
    margin-bottom: 2rem;
  }

  .tb-mb30 {
    margin-bottom: 3rem;
  }

  .tb-mt10 {
    margin-top: 1rem;
  }

  .tb-mt15 {
    margin-top: 1.5rem;
  }

  .tb-fluid {
    width: 100%;
  }

  .tb-flex-column {
    flex-direction: column;
  }

  .tb-flex-row {
    flex-direction: row;
  }

  .tb-flex-row-between {
    justify-content: space-between;
  }

  .tb-flex-wrap {
    flex-wrap: wrap;
  }
}

@media screen and (min-width: 37.5rem) and (max-width: 72rem) {
  /* Individual media query to avoid overlapping of text */
  #desktop-category-menu .tablet-only {
    display: flex !important;
  }

  #desktop-category-menu .desktop-only {
    display: none !important;
  }

  /* Header Search + Sign in margin interaction */
  .searchbar-container {
    margin-right: 1rem;
  }

  .main-navigation li.sign-in {
    margin: 0;
  }
}