@charset "UTF-8";
html {
    box-sizing: border-box;
}

*,
*::after,
*::before {
    box-sizing: inherit;
}

/*
 * Abstractions like variables, mixins, etc...
 */
/*
 * http://easings.net/nl
 */
/*
 * Wrapper
 */
/*
 * Media Queries
 */
/*
 * Font weights
 */
/*
 * Font sizes
 */
/**
 * Font family
 */
/*
 * Colors
 */
/**
 * @file
 * Theming for _mixins
 *
 * @author Senne Torfs <senne.torfs@intracto.com>
 */
/* Positions */
.relative {
    position: relative;
}

.absolute {
    position: absolute;
}

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

/* Layout */
.inline-block {
    display: inline-block;
}

.display-block {
    display: block;
}

.table {
    display: table;
    width: 100%;
}

.table-cell {
    display: table-cell;
}

/* Alignment */
.align-left {
    text-align: left;
}

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

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

.v-align-middle {
    vertical-align: middle;
}

.v-align-top {
    vertical-align: top;
}

.v-align-bottom {
    vertical-align: bottom;
}

/* Weights */
.hairline {
    font-weight: 200;
}

.light {
    font-weight: 300;
}

.regular {
    font-weight: 400;
}

.bold {
    font-weight: 700;
}

.normal {
    font-style: normal;
}

.italic {
    font-style: italic;
}

/* Font sizes */
.small-font {
    font-size: 14px;
}

.normal-font {
    font-size: 1.8rem;
}

/* Text decorations */
.underline {
    text-decoration: underline;
}

.line-trough {
    text-decoration: line-through;
}

/* Transform */
.uppercase {
    text-transform: uppercase;
}

.no-margin {
    margin: 0;
}

/* Overflow */
.overflow-hidden {
    overflow: hidden;
}

.no-wrap {
    white-space: nowrap;
}

/*
* Responsive helpers
*/
@media (min-width: 750px) {
    .mobile-only {
        display: none !important;
    }
}

@media (max-width: 750px) {
    .hide-mobile {
        display: none;
    }
}

/*
* Cursors
*/
.cursor--pointer {
    cursor: pointer;
}

.list--inline-block {
    list-style: none;
    margin: 0 0 8px;
    padding: 0;
}

.list--inline-block li {
    display: inline-block;
    margin-right: 7.5px;
}

.list--inline-block li:last-of-type {
    margin-right: 0;
}

.list--inline-block li a {
    display: block;
}

.text--grey {
    color: #8dc8e8;
}

.text--green {
    color: #8dc8e8;
}

.link--back {
    margin-left: 170px;
    background: url(/build/images/arrow-left-grey.4f143450.svg) left center no-repeat;
    color: #fff;
    display: inline-block;
    font-size: 16px;
    padding-left: 15px;
    text-decoration: none;
}

.link--back:hover {
    color: #8dc8e8;
}

.u-color-orange {
    color: #f36279;
}

/**
 * @_clearfix.scss
 * Clearfix to automatically clear child elements
 */
.clearfix,
.footer__block--right ul.footer__list {
    display: block;
}

.clearfix:after,
.footer__block--right ul.footer__list:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

/* Hides from IE-mac \*/
* html .clearfix,
* html .footer__block--right ul.footer__list,
.footer__block--right * html ul.footer__list {
    height: 1%;
}

/**
 * @file
 * Theming for grid
 *
 * @author Senne Torfs <senne.torfs@intracto.com>
 */
.grid__row {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.grid__row::after {
    clear: both;
    content: "";
    display: table;
}

.grid__col--half {
    float: left;
    display: block;
    margin-right: 3.28774%;
    width: 48.35613%;
}

.grid__col--half:last-child {
    margin-right: 0;
}

@media screen and (max-width: 460px) {
    .grid__col--half {
        width: 100%;
    }
}

.grid__col--one-third {
    float: left;
    display: block;
    margin-right: 3.28774%;
    width: 31.1415%;
}

.grid__col--one-third:last-child {
    margin-right: 0;
}

@media screen and (max-width: 750px) {
    .grid__col--one-third {
        margin-right: 0;
        margin-bottom: 30px;
        width: 100%;
    }

    .grid__col--one-third:last-of-type {
        margin-bottom: 0;
    }
}

.grid__col--two-third {
    float: left;
    display: block;
    margin-right: 3.28774%;
    width: 65.57075%;
}

.grid__col--two-third:last-child {
    margin-right: 0;
}

@media screen and (max-width: 750px) {
    .grid__col--two-third {
        margin-right: 0;
        margin-bottom: 30px;
        width: 100%;
    }

    .grid__col--two-third:last-of-type {
        margin-bottom: 0;
    }
}

.grid__col--one-fourth {
    float: left;
    display: block;
    margin-right: 3.28774%;
    width: 22.53419%;
}

.grid__col--one-fourth:last-child {
    margin-right: 0;
}

.grid__col--three-fourth {
    float: left;
    display: block;
    margin-right: 3.28774%;
    width: 74.17806%;
}

.grid__col--three-fourth:last-child {
    margin-right: 0;
}

.grid__col--one-fifth {
    float: left;
    display: block;
    margin-right: 3.28774%;
    width: 17.36981%;
}

.grid__col--one-fifth:last-child {
    margin-right: 0;
}

.grid__col--four-fifth {
    float: left;
    display: block;
    margin-right: 3.28774%;
    width: 79.34245%;
}

.grid__col--four-fifth:last-child {
    margin-right: 0;
}

.grid__col--full {
    clear: both;
    width: 100%;
}

.grid__col--last {
    margin-right: 0;
}

.wrapper,
.page-row--dark > h2 {
    margin-left: auto;
    margin-right: auto;
    max-width: 1280px;
}

.container--center {
    margin: 0 auto;
    width: 1280px;
}

@media screen and (max-width: 1300px) {
    .container--center {
        padding: 0 30px;
        width: 100%;
    }
}

@media screen and (max-width: 1100px) {
    .container--center {
        padding: 0 15px;
    }
}

@media screen and (max-width: 360px) {
    .container--center {
        padding: 0 8px;
    }
}

@media screen and (min-width: 1580px) {
    .container--center.has-filters {
        width: 1500px;
    }
}

.container--center.has-filters .product__overview--grid {
    width: 100%;
}

/*
 * Third party styles (sliders, lightbox, dropdown)
 */
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS and IE text size adjust after device orientation change,
 *    without disabling user zoom.
 */
html {
    /*font-family: sans-serif;*/
    /* 1 */
    -ms-text-size-adjust: 100%;
    /* 2 */
    -webkit-text-size-adjust: 100%;
    /* 2 */
}

/**
 * Remove default margin.
 */
body {
    margin: 0;
}

/* HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11
 * and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
    display: block;
}

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */
audio,
canvas,
progress,
video {
    display: inline-block;
    /* 1 */
    vertical-align: baseline;
    /* 2 */
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
    display: none;
    height: 0;
}

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
 */
[hidden],
template {
    display: none;
}

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

/**
 * Improve readability of focused elements when they are also in an
 * active/hover state.
 */
a:active,
a:hover {
    outline: 0;
}

/* Text-level semantics
   ========================================================================== */
/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */
abbr[title] {
    border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */
b,
strong {
    font-weight: 800;
}

/**
 * Address styling not present in Safari and Chrome.
 */
dfn {
    font-style: italic;
}

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */
h1 {
    font-size: 2em;
    margin: 0.67em 0;
}

/**
 * Address styling not present in IE 8/9.
 */
mark {
    background: #ff0;
    color: #000;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
    font-size: 80%;
}

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

sup {
    top: -0.5em;
}

sub {
    bottom: -0.25em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9/10.
 */
img {
    border: 0;
}

/**
 * Correct overflow not hidden in IE 9/10/11.
 */
svg:not(:root) {
    overflow: hidden;
}

/* Grouping content
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari.
 */
figure {
    margin: 1em 40px;
}

/**
 * Address differences between Firefox and other browsers.
 */
hr {
    box-sizing: content-box;
    height: 0;
}

/**
 * Contain overflow in all browsers.
 */
pre {
    overflow: auto;
}

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */
code,
kbd,
pre,
samp {
    font-family: monospace, monospace;
    font-size: 1em;
}

/* Forms
   ========================================================================== */
/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */
/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */
button,
input,
optgroup,
select,
textarea {
    color: inherit;
    /* 1 */
    font: inherit;
    /* 2 */
    margin: 0;
    /* 3 */
}

select {
    color: black;
}

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */
button {
    overflow: visible;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */
button,
select {
    text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
input {
    border-radius: 0;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
    cursor: pointer;
    /* 3 */
    -webkit-appearance: none;
    border-radius: 0;
}

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
    cursor: default;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
input {
    line-height: normal;
}

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
input[type="checkbox"],
input[type="radio"] {
    box-sizing: border-box;
    /* 1 */
    padding: 0;
    /* 2 */
}

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    height: auto;
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.
 */
input[type="search"] {
    -webkit-appearance: textfield;
    /* 1 */
    box-sizing: content-box;
    /* 2 */
}

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

/**
 * Define consistent border, margin, and padding.
 */
fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
    border: 0;
    /* 1 */
    padding: 0;
    /* 2 */
}

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */
textarea {
    overflow: auto;
}

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */
optgroup {
    font-weight: bold;
}

/* Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
    border-collapse: collapse;
    border-spacing: 0;
}

td,
th {
    padding: 0;
}

/**
 * Swiper 3.4.2
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 *
 * http://www.idangero.us/swiper/
 *
 * Copyright 2017, Vladimir Kharlampidi
 * The iDangero.us
 * http://www.idangero.us/
 *
 * Licensed under MIT
 *
 * Released on: March 10, 2017
 */
.swiper-container {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    /* Fix of Webkit flickering */
    z-index: 1;
}

.swiper-container-no-flexbox .swiper-slide {
    float: left;
}

.swiper-container-vertical > .swiper-wrapper {
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    -ms-transition-property: -ms-transform;
    transition-property: transform;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

.swiper-container-android .swiper-slide,
.swiper-wrapper {
    -webkit-transform: translate3d(0px, 0, 0);
    -moz-transform: translate3d(0px, 0, 0);
    -o-transform: translate(0px, 0px);
    -ms-transform: translate3d(0px, 0, 0);
    transform: translate3d(0px, 0, 0);
}

.swiper-container-multirow > .swiper-wrapper {
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}

.swiper-container-free-mode > .swiper-wrapper {
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    -ms-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    margin: 0 auto;
}

.swiper-slide {
    -webkit-flex-shrink: 0;
    -ms-flex: 0 0 auto;
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
}

/* Auto Height */
.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
    height: auto;
}

.swiper-container-autoheight .swiper-wrapper {
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-transition-property: -webkit-transform, height;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    -ms-transition-property: -ms-transform;
    transition-property: transform, height;
}

/* a11y */
.swiper-container .swiper-notification {
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    opacity: 0;
    z-index: -1000;
}

/* IE10 Windows Phone 8 Fixes */
.swiper-wp8-horizontal {
    -ms-touch-action: pan-y;
    touch-action: pan-y;
}

.swiper-wp8-vertical {
    -ms-touch-action: pan-x;
    touch-action: pan-x;
}

/* Arrows */
.swiper-button-prev,
.swiper-button-next {
    position: absolute;
    top: 50%;
    width: 27px;
    height: 44px;
    margin-top: -22px;
    padding: 0 30px;
    z-index: 10;
    cursor: pointer;
    -moz-background-size: 27px 44px;
    -webkit-background-size: 27px 44px;
    background-size: 27px 44px;
    background-position: center;
    background-repeat: no-repeat;
}

@media (max-width: 1100px) {
    .swiper-button-prev,
    .swiper-button-next {
        display: none;
    }
}

.swiper-button-prev {
    left: 50px !important;
}

.swiper-button-next {
    right: 50px !important;
}

.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
    opacity: 0.35;
    cursor: auto;
    pointer-events: none;
}

.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23c3a372'%2F%3E%3C%2Fsvg%3E");
    left: 10px;
    right: auto;
}

.swiper-button-prev.swiper-button-black,
.swiper-container-rtl .swiper-button-next.swiper-button-black {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
}

.swiper-button-prev.swiper-button-white,
.swiper-container-rtl .swiper-button-next.swiper-button-white {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
}

.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23c3a372'%2F%3E%3C%2Fsvg%3E");
    right: 10px;
    left: auto;
}

.swiper-button-next.swiper-button-black,
.swiper-container-rtl .swiper-button-prev.swiper-button-black {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
}

.swiper-button-next.swiper-button-white,
.swiper-container-rtl .swiper-button-prev.swiper-button-white {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
}

/* Pagination Styles */
.swiper-pagination {
    position: absolute;
    text-align: center;
    -webkit-transition: 300ms;
    -moz-transition: 300ms;
    -o-transition: 300ms;
    transition: 300ms;
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    z-index: 10;
}

.swiper-pagination.swiper-pagination-hidden {
    opacity: 0;
}

/* Common Styles */
.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-container-horizontal > .swiper-pagination-bullets {
    bottom: 10px;
    left: 0;
    width: 100%;
}

/* Bullets */
.swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 100%;
    background: white;
}

button.swiper-pagination-bullet {
    border: none;
    margin: 0;
    padding: 0;
    box-shadow: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -webkit-appearance: none;
    appearance: none;
}

.swiper-pagination-clickable .swiper-pagination-bullet {
    cursor: pointer;
}

.swiper-pagination-white .swiper-pagination-bullet {
    background: #fff;
}

.swiper-pagination-bullet-active {
    opacity: 1;
    background: #ef6079;
}

.swiper-pagination-white .swiper-pagination-bullet-active {
    background: #fff;
}

.swiper-pagination-black .swiper-pagination-bullet-active {
    background: #000;
}

.swiper-container-vertical > .swiper-pagination-bullets {
    right: 10px;
    top: 50%;
    -webkit-transform: translate3d(0px, -50%, 0);
    -moz-transform: translate3d(0px, -50%, 0);
    -o-transform: translate(0px, -50%);
    -ms-transform: translate3d(0px, -50%, 0);
    transform: translate3d(0px, -50%, 0);
}

.swiper-container-vertical
> .swiper-pagination-bullets
.swiper-pagination-bullet {
    margin: 5px 0;
    display: block;
}

.swiper-container-horizontal
> .swiper-pagination-bullets
.swiper-pagination-bullet {
    margin: 0 5px;
}

/* Progress */
.swiper-pagination-progress {
    background: rgba(0, 0, 0, 0.25);
    position: absolute;
}

.swiper-pagination-progress .swiper-pagination-progressbar {
    background: #007aff;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: left top;
    -moz-transform-origin: left top;
    -ms-transform-origin: left top;
    -o-transform-origin: left top;
    transform-origin: left top;
}

.swiper-container-rtl
.swiper-pagination-progress
.swiper-pagination-progressbar {
    -webkit-transform-origin: right top;
    -moz-transform-origin: right top;
    -ms-transform-origin: right top;
    -o-transform-origin: right top;
    transform-origin: right top;
}

.swiper-container-horizontal > .swiper-pagination-progress {
    width: 100%;
    height: 4px;
    left: 0;
    top: 0;
}

.swiper-container-vertical > .swiper-pagination-progress {
    width: 4px;
    height: 100%;
    left: 0;
    top: 0;
}

.swiper-pagination-progress.swiper-pagination-white {
    background: rgba(255, 255, 255, 0.5);
}

.swiper-pagination-progress.swiper-pagination-white
.swiper-pagination-progressbar {
    background: #fff;
}

.swiper-pagination-progress.swiper-pagination-black
.swiper-pagination-progressbar {
    background: #000;
}

/* 3D Container */
.swiper-container-3d {
    -webkit-perspective: 1200px;
    -moz-perspective: 1200px;
    -o-perspective: 1200px;
    perspective: 1200px;
}

.swiper-container-3d .swiper-wrapper,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-cube-shadow {
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10;
}

.swiper-container-3d .swiper-slide-shadow-left {
    background-image: -webkit-gradient(
            linear,
            left top,
            right top,
            from(rgba(0, 0, 0, 0.5)),
            to(rgba(0, 0, 0, 0))
    );
    /* Safari 4+, Chrome */
    background-image: -webkit-linear-gradient(
            right,
            rgba(0, 0, 0, 0.5),
            rgba(0, 0, 0, 0)
    );
    /* Chrome 10+, Safari 5.1+, iOS 5+ */
    background-image: -moz-linear-gradient(
            right,
            rgba(0, 0, 0, 0.5),
            rgba(0, 0, 0, 0)
    );
    /* Firefox 3.6-15 */
    background-image: -o-linear-gradient(
            right,
            rgba(0, 0, 0, 0.5),
            rgba(0, 0, 0, 0)
    );
    /* Opera 11.10-12.00 */
    background-image: linear-gradient(
            to left,
            rgba(0, 0, 0, 0.5),
            rgba(0, 0, 0, 0)
    );
    /* Firefox 16+, IE10, Opera 12.50+ */
}

.swiper-container-3d .swiper-slide-shadow-right {
    background-image: -webkit-gradient(
            linear,
            right top,
            left top,
            from(rgba(0, 0, 0, 0.5)),
            to(rgba(0, 0, 0, 0))
    );
    /* Safari 4+, Chrome */
    background-image: -webkit-linear-gradient(
            left,
            rgba(0, 0, 0, 0.5),
            rgba(0, 0, 0, 0)
    );
    /* Chrome 10+, Safari 5.1+, iOS 5+ */
    background-image: -moz-linear-gradient(
            left,
            rgba(0, 0, 0, 0.5),
            rgba(0, 0, 0, 0)
    );
    /* Firefox 3.6-15 */
    background-image: -o-linear-gradient(
            left,
            rgba(0, 0, 0, 0.5),
            rgba(0, 0, 0, 0)
    );
    /* Opera 11.10-12.00 */
    background-image: linear-gradient(
            to right,
            rgba(0, 0, 0, 0.5),
            rgba(0, 0, 0, 0)
    );
    /* Firefox 16+, IE10, Opera 12.50+ */
}

.swiper-container-3d .swiper-slide-shadow-top {
    background-image: -webkit-gradient(
            linear,
            left top,
            left bottom,
            from(rgba(0, 0, 0, 0.5)),
            to(rgba(0, 0, 0, 0))
    );
    /* Safari 4+, Chrome */
    background-image: -webkit-linear-gradient(
            bottom,
            rgba(0, 0, 0, 0.5),
            rgba(0, 0, 0, 0)
    );
    /* Chrome 10+, Safari 5.1+, iOS 5+ */
    background-image: -moz-linear-gradient(
            bottom,
            rgba(0, 0, 0, 0.5),
            rgba(0, 0, 0, 0)
    );
    /* Firefox 3.6-15 */
    background-image: -o-linear-gradient(
            bottom,
            rgba(0, 0, 0, 0.5),
            rgba(0, 0, 0, 0)
    );
    /* Opera 11.10-12.00 */
    background-image: linear-gradient(
            to top,
            rgba(0, 0, 0, 0.5),
            rgba(0, 0, 0, 0)
    );
    /* Firefox 16+, IE10, Opera 12.50+ */
}

.swiper-container-3d .swiper-slide-shadow-bottom {
    background-image: -webkit-gradient(
            linear,
            left bottom,
            left top,
            from(rgba(0, 0, 0, 0.5)),
            to(rgba(0, 0, 0, 0))
    );
    /* Safari 4+, Chrome */
    background-image: -webkit-linear-gradient(
            top,
            rgba(0, 0, 0, 0.5),
            rgba(0, 0, 0, 0)
    );
    /* Chrome 10+, Safari 5.1+, iOS 5+ */
    background-image: -moz-linear-gradient(
            top,
            rgba(0, 0, 0, 0.5),
            rgba(0, 0, 0, 0)
    );
    /* Firefox 3.6-15 */
    background-image: -o-linear-gradient(
            top,
            rgba(0, 0, 0, 0.5),
            rgba(0, 0, 0, 0)
    );
    /* Opera 11.10-12.00 */
    background-image: linear-gradient(
            to bottom,
            rgba(0, 0, 0, 0.5),
            rgba(0, 0, 0, 0)
    );
    /* Firefox 16+, IE10, Opera 12.50+ */
}

/* Coverflow */
.swiper-container-coverflow .swiper-wrapper,
.swiper-container-flip .swiper-wrapper {
    /* Windows 8 IE 10 fix */
    -ms-perspective: 1200px;
}

/* Cube + Flip */
.swiper-container-cube,
.swiper-container-flip {
    overflow: visible;
}

.swiper-container-cube .swiper-slide,
.swiper-container-flip .swiper-slide {
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 1;
}

.swiper-container-cube .swiper-slide .swiper-slide,
.swiper-container-flip .swiper-slide .swiper-slide {
    pointer-events: none;
}

.swiper-container-cube .swiper-slide-active,
.swiper-container-flip .swiper-slide-active,
.swiper-container-cube .swiper-slide-active .swiper-slide-active,
.swiper-container-flip .swiper-slide-active .swiper-slide-active {
    pointer-events: auto;
}

.swiper-container-cube .swiper-slide-shadow-top,
.swiper-container-flip .swiper-slide-shadow-top,
.swiper-container-cube .swiper-slide-shadow-bottom,
.swiper-container-flip .swiper-slide-shadow-bottom,
.swiper-container-cube .swiper-slide-shadow-left,
.swiper-container-flip .swiper-slide-shadow-left,
.swiper-container-cube .swiper-slide-shadow-right,
.swiper-container-flip .swiper-slide-shadow-right {
    z-index: 0;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
}

/* Cube */
.swiper-container-cube .swiper-slide {
    visibility: hidden;
    -webkit-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    transform-origin: 0 0;
    width: 100%;
    height: 100%;
}

.swiper-container-cube.swiper-container-rtl .swiper-slide {
    -webkit-transform-origin: 100% 0;
    -moz-transform-origin: 100% 0;
    -ms-transform-origin: 100% 0;
    transform-origin: 100% 0;
}

.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-next,
.swiper-container-cube .swiper-slide-prev,
.swiper-container-cube .swiper-slide-next + .swiper-slide {
    pointer-events: auto;
    visibility: visible;
}

.swiper-container-cube .swiper-cube-shadow {
    position: absolute;
    left: 0;
    bottom: 0px;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.6;
    -webkit-filter: blur(50px);
    filter: blur(50px);
    z-index: 0;
}

/* Fade */
.swiper-container-fade.swiper-container-free-mode .swiper-slide {
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    -ms-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.swiper-container-fade .swiper-slide {
    pointer-events: none;
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    -o-transition-property: opacity;
    transition-property: opacity;
}

.swiper-container-fade .swiper-slide .swiper-slide {
    pointer-events: none;
}

.swiper-container-fade .swiper-slide-active,
.swiper-container-fade .swiper-slide-active .swiper-slide-active {
    pointer-events: auto;
}

.swiper-zoom-container {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    text-align: center;
}

.swiper-zoom-container > img,
.swiper-zoom-container > svg,
.swiper-zoom-container > canvas {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

/* Scrollbar */
.swiper-scrollbar {
    border-radius: 10px;
    position: relative;
    -ms-touch-action: none;
    background: rgba(0, 0, 0, 0.1);
}

.swiper-container-horizontal > .swiper-scrollbar {
    position: absolute;
    left: 1%;
    bottom: 3px;
    z-index: 50;
    height: 5px;
    width: 98%;
}

.swiper-container-vertical > .swiper-scrollbar {
    position: absolute;
    right: 3px;
    top: 1%;
    z-index: 50;
    width: 5px;
    height: 98%;
}

.swiper-scrollbar-drag {
    height: 100%;
    width: 100%;
    position: relative;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    left: 0;
    top: 0;
}

.swiper-scrollbar-cursor-drag {
    cursor: move;
}

/* Preloader */
.swiper-lazy-preloader {
    width: 42px;
    height: 42px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -21px;
    margin-top: -21px;
    z-index: 10;
    -webkit-transform-origin: 50%;
    -moz-transform-origin: 50%;
    transform-origin: 50%;
    -webkit-animation: swiper-preloader-spin 1s steps(12, end) infinite;
    -moz-animation: swiper-preloader-spin 1s steps(12, end) infinite;
    animation: swiper-preloader-spin 1s steps(12, end) infinite;
}

.swiper-lazy-preloader:after {
    display: block;
    content: "";
    width: 100%;
    height: 100%;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
    background-position: 50%;
    -webkit-background-size: 100%;
    background-size: 100%;
    background-repeat: no-repeat;
}

.swiper-lazy-preloader-white:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}

@-webkit-keyframes swiper-preloader-spin {
    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes swiper-preloader-spin {
    100% {
        transform: rotate(360deg);
    }
}

/*
 * Base styles (typography, grids, global styles, etc..)
 */
/**
 * @_boxmodel.css
 * The CSS box model is essentially a box that wraps around HTML elements,
 * and it consists of: margins, borders, padding, and the actual content.
 */
/* apply a natural box layout model to all elements, but allowing components to change */
html {
    box-sizing: border-box;
}

*,
*:before,
*:after {
    box-sizing: inherit;
}

/* Root typography */
/*
* http://css-tricks.com/rems-ems/
* Root document is the default 100% (can be scaled trough media queries)
* Components are declared with rems
* Components elements are declared with ems
*/
html {
    /*
   * Sets the base font to 10px for easier math
   */
    font-size: 100%;
}

/*
 * Sets the default sizing to make sure nothing is actually 10px
 */
body {
    /*font-family: "Lato", Helvetica, Arial, sans-serif;*/
    font-size: 1rem;
    position: relative;
    /*
   * Force Anti-aliasing
   */
    -webkit-font-smoothing: antialiased;
}

/*
 * Remove margin from first paragraph
 */
p {
    line-height: 1.75;
}

p.small {
    font-size: 0.8em;
}

p:only-of-type {
    margin-top: 0;
}

p:only-child {
    margin: 0;
}

/*
 * Responsive image
 */
img {
    height: auto;
    max-width: 100%;
}

/*
 * Heading styles
 */
h1,
h2,
h3,
h4,
h5,
h6 {
    /*font-family: "Lato", Helvetica, Arial, sans-serif;*/
    font-weight: 400;
    margin-top: 0;
    text-rendering: optimizeLegibility;
}

h1 {
    font-size: 2em;
}

h2 {
    font-size: 1.5em;
}

h3 {
    font-size: 1.25em;
}

h4 {
    font-size: 1.125em;
}

h5 {
    font-size: 1em;
}

h6 {
    font-size: 0.875em;
}

html {
    background: #061729;
}

@keyframes scaleDown {
    0% {
        transform: scale(0.9);
    }
    100% {
        transform: scale(1);
    }
}

@keyframes fadeInTranslate {
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

.flex {
    display: flex;
}

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

.flex-push-right {
    margin-left: auto;
}

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

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

.align-center {
    align-items: center;
}

.white-space-nowrap {
    white-space: nowrap;
}

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

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

div.cookiesplease {
    top: initial;
    bottom: 0;
}

div.cookiesplease.cookiesplease-hidden {
    transform: translate(0, 100%);
    -webkit-transform: translate(0, 100%);
    -ms-transform: translate(0, 100%);
}

div.cookiesplease {
    top: inherit;
}

body.sticky {
    padding-top: 82px;
}

body.no--scroll {
    overflow-x: hidden;
    overflow-y: hidden;
}

.fullwidth {
    width: 100% !important;
}

.hidden {
    display: none !important;
}

@media (max-width: 600px) {
    .hidden-mobile {
        display: none;
    }
}

.no-border {
    border: none !important;
}

@media (min-width: 600px) {
    .mobile-only {
        display: none;
    }
}

.cookietable td {
    border: 1px solid white;
    padding: 4px;
}

/*
 * Header
 */
/**
 * @file
 * Theming for logo
 *
 * @author Senne Torfs <senne.torfs@intracto.com>
 */
.header__logo,
.footer__logo {
    background-position: center center;
    background-repeat: no-repeat;
    border: 0;
    display: block;
    height: 75px;
    float: left;
    overflow: hidden;
    width: 160px;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
    z-index: 10;
}

.header__logo::before,
.footer__logo::before {
    content: "";
    display: block;
    height: 100%;
    width: 0;
}

.no-svg .header__logo,
.no-svg .footer__logo {
    background-image: url(/build/images/ovidias-logo.f936b98c.png);
    background-repeat: no-repeat;
}

@media (min--moz-device-pixel-ratio: 1.3),
(-o-min-device-pixel-ratio: 2.6 / 2),
(-webkit-min-device-pixel-ratio: 1.3),
(min-device-pixel-ratio: 1.3),
(min-resolution: 1.3dppx) {
    .no-svg .header__logo,
    .no-svg .footer__logo {
        background-image: url(/build/images/ovidias-logo_2x.6c716599.png);
        background-size: 150px 75px;
    }
}

@media screen and (max-width: 960px) {
    .header__logo,
    .footer__logo {
        display: inline-block;
        float: none;
        height: 60px;
        width: 128px;
    }
}

@media screen and (max-width: 750px) {
    .header__logo,
    .footer__logo {
        height: 50px;
        width: 107px;
    }
}

@media screen and (max-width: 360px) {
    .header__logo,
    .footer__logo {
        margin: 0 auto;
    }
}

.footer__logo {
    float: none;
}

/**
 * @file
 * Theming for navigation
 *
 * @author Senne Torfs <senne.torfs@intracto.com>
 */
@media (max-width: 960px) {
    .header__navigation-wrapper {
        display: none;
    }
}

.nav__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.nav__list a {
    padding: 5px 20px;
    display: block;
}

@media screen and (max-width: 1100px) {
    .nav__list a {
        padding: 0 15px;
    }
}

@media screen and (max-width: 960px) {
    .nav__list {
        background: #152b3e;
        margin-left: -15px;
        margin-right: -15px;
    }
}

@media screen and (max-width: 960px) {
    .menu-top {
        margin-bottom: 30px;
    }

    .menu-top .nav__item > a {
        font-weight: normal;
        font-size: 14px;
    }
}

nav .nav__item {
    border-left: 1px solid #676767;
}

.nav__item {
    display: inline-block;
    margin-right: -0.25em;
}

.nav__item.highlight {
    border-left: none;
}

.nav__item > a {
    color: #fff;
    font-weight: 700;
    text-decoration: none;
}

.nav__item > a:hover,
.nav__item > a.active {
    color: #8dc8e8;
}

.nav__item.highlight {
    background-color: #f06178;
    border-radius: 6px;
    margin-right: 12px;
}

@media screen and (max-width: 960px) {
    .menu--open .nav__item {
        display: block;
        border-right: none;
        margin: 0;
    }

    .menu--open .nav__item > a {
        padding: 16px 0;
        display: block;
    }
}

@media screen and (max-width: 960px) {
    .nav__item--hide-mobile {
        display: none;
    }
}

.cart-nav__item {
    border-right: none;
    margin-right: 30px;
}

.cart-nav__item:last-of-type {
    margin-right: 0;
}

@media screen and (max-width: 1100px) {
    .cart-nav__item {
        margin-right: 15px;
    }
}

@media screen and (max-width: 460px) {
    .cart-nav__item {
        margin-right: 0;
    }
}

/**
 * Mobile menu
 */
.header__menu--mobile {
    display: none;
}

.cssanimations .header__menu--mobile {
    transform: translateX(-280px);
}

@media screen and (max-width: 960px) {
    .header__menu--mobile {
        padding: 0;
    }

    @keyframes menuSlideIn {
        100% {
            transform: translateX(0);
            opacity: 1;
        }
    }
    .header__menu--mobile.menu--open {
        background: #003865;
        display: block;
        height: 100%;
        left: 0;
        margin: 0;
        max-width: 100%;
        overflow-y: auto;
        padding: 15px 15px 30px;
        position: fixed;
        top: 0;
        z-index: 100;
        width: 280px;
        border-right: 2px solid rgba(103, 103, 103, 0.5);
    }

    .cssanimations .header__menu--mobile.menu--open {
        transform: translateX(0);
    }
}

.header__menu-toggle {
    color: #fff;
    display: none;
    float: left;
    font-size: 0.8125em;
    font-weight: 400;
    padding: 20px;
    text-transform: uppercase;
    position: relative;
    z-index: 7;
}

.menu--open .header__menu-toggle {
    position: absolute;
    top: 6px;
    right: 0;
}

@media screen and (max-width: 960px) {
    .header__menu-toggle {
        display: block;
    }
}

.header__menu-toggle:hover {
    color: #fff;
}

.header__menu-toggle:hover .nav__lines {
    background-color: #fff;
}

.header__menu-toggle:hover .nav__lines::before {
    top: -9px;
}

.header__menu-toggle:hover .nav__lines::after {
    bottom: -9px;
}

.header__menu-toggle:hover .nav__lines.lines--close {
    background-color: transparent;
}

.header__menu-toggle:hover .nav__lines.lines--close::before,
.header__menu-toggle:hover .nav__lines.lines--close::after {
    background-color: #f36279;
}

.header__menu-toggle:hover .lines--close::before,
.header__menu-toggle:hover .lines--close::after {
    top: 0;
    bottom: 0;
}

.nav__lines-wrapper {
    display: inline-block;
    height: 12px;
    float: left;
    margin: 0;
    position: relative;
    width: 23px;
}

.nav__lines {
    background-color: #fff;
    display: block;
    position: relative;
    margin-top: -2px;
    top: 50%;
    z-index: 20;
}

.nav__lines,
.nav__lines::before,
.nav__lines::after {
    height: 3px;
    transition: top 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955),
    bottom 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
    width: 100%;
}

.nav__lines::before,
.nav__lines::after {
    background-color: inherit;
    content: "";
    left: 0;
    position: absolute;
}

.nav__lines::before {
    top: -7px;
}

.nav__lines::after {
    bottom: -7px;
}

.lines--close {
    background-color: transparent;
}

.lines--close::before {
    background-color: #fff;
    transition: background ease-in 250ms;
    transform: rotate(45deg);
    top: 0;
}

.lines--close::after {
    background-color: #fff;
    transition: background ease-in 250ms;
    bottom: 0;
    transform: rotate(-45deg);
}

.mobile__title {
    font-size: 1em;
    margin-bottom: 8px;
}

.nav__with-sub-items {
    color: white;
    text-decoration: none;
    font-size: 1.2rem;
    margin-bottom: 5px;
}

.nav__with-sub-items div {
    padding: 5px 20px;
    font-size: 1.2rem;
}

.nav__sub-items {
    display: flex;
    flex-wrap: wrap;
}

.nav__sub-items a {
    width: 50%;
    color: white;
    text-decoration: none;
    font-size: 0.9rem;
}

.nav__sub-items a:hover {
    color: #8dc8e8;
}

@media (max-width: 600px) {
    .filter-container > .filters {
        overflow-y: scroll;
    }
}

.nav__item--dropdown {
    position: relative;
}

.nav__item--dropdown .nav__item--dropdown-trigger {
    background: url(/build/images/triangle-down-white.87ac32c8.svg);
    background-repeat: no-repeat;
    background-position: calc(100% - 10px) center;
    background-size: 8px 5px;
    padding-right: 30px;
    border-bottom: none;
    display: block;
}

.nav__item--dropdown:hover .nav__dropdown,
.nav__item--dropdown.dropdown-visible .nav__dropdown {
    animation: scaleDown 450ms cubic-bezier(0.1, 1.45, 0.35, 1);
    opacity: 1;
    display: flex;
}

@media (max-width: 960px) {
    .nav__item--dropdown:hover .nav__dropdown,
    .nav__item--dropdown.dropdown-visible .nav__dropdown {
        display: block;
    }
}

.nav__dropdown {
    opacity: 0;
    background: #152b3e;
}

.nav__dropdown ul {
    list-style: none;
    margin: 0;
    margin-right: auto;
    padding: 0;
}

@media (min-width: 960px) {
    .nav__dropdown.xl {
        width: 440px;
    }
}

@media (min-width: 960px) {
    .nav__dropdown {
        background-color: #003865;
        border-radius: 6px;
        box-shadow: 0 1px 21px 0 rgba(0, 0, 0, 0.55);
        border: 1px solid #8dc8e8;
        position: absolute;
        top: 100%;
        width: 320px;
        margin: 0;
        left: 0;
        padding: 10px 10px 10px 0;
        z-index: 20;
        display: none;
        flex-wrap: wrap;
        align-items: flex-start;
    }
}

@media (max-width: 960px) {
    .nav__dropdown {
        display: none;
        padding: 0;
    }
}

.nav__dropdown-visual {
    width: 30%;
    height: auto;
    position: absolute;
    right: 15px;
    top: 10px;
    opacity: 0;
    transition: all ease 200ms;
    transform: scale(0.9);
}

@media (max-width: 960px) {
    .nav__dropdown-visual {
        display: none;
    }
}

.nav__dropdown-link:last-child a {
    border: none;
}

.nav__dropdown-link.is-active .nav__dropdown-visual {
    opacity: 1;
    transform: scale(1);
}

.nav__dropdown-link:hover a {
    color: #8dc8e8;
    text-decoration: underline;
}

.nav__dropdown-link a {
    color: white;
    text-decoration: none;
    display: block;
}

@media (max-width: 960px) {
    .nav__dropdown-link a {
        padding: 0.75em 0;
    }
}

.nav__dropdown.secondary {
    background-color: #152b3e;
    width: auto;
    z-index: 50;
}

.nav__dropdown.secondary .nav__dropdown-link a {
    white-space: nowrap;
    text-align: left;
    font-size: 14px;
    padding: 4px 20px;
}

/*
 * Components styles (specific reusable module styles)
 */
button {
    transition: all ease 250ms;
}

.btn--brown,
.btn--brown--compact,
.btn--brown--large,
.btn--green--compact,
.btn--green--large,
.btn__config {
    background-color: #f36279;
    border: 1px solid #f14a65;
    color: #fff;
    display: inline-block;
    font-size: 1.125em;
    line-height: 1.5625em;
    padding: 8px 30px;
    text-decoration: none;
    transition: background-color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

.btn--brown:hover,
.btn--brown--compact:hover,
.btn--brown--large:hover,
.btn--green--compact:hover,
.btn--green--large:hover,
.btn__config:hover {
    background-color: #f14a65;
}

.btn--brown--compact {
    font-size: 1em;
    padding: 4px 20px;
}

.btn--brown--large {
    font-size: 1.25em;
    padding: 8px 38px;
}

.btn--blue,
.btn--blue--compact,
.btn--blue--large {
    background-color: #2e95b7;
    border: 1px solid #64c0df;
    color: #fff;
    display: inline-block;
    font-size: 1.125em;
    line-height: 1.5625em;
    padding: 8px 30px;
    text-decoration: none;
    transition: background-color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

.btn--blue:hover,
.btn--blue--compact:hover,
.btn--blue--large:hover {
    background-color: #2984a3;
}

.btn--blue--compact {
    font-size: 1em;
    padding: 4px 20px;
}

.btn--blue--large {
    font-size: 1.25em;
    padding: 8px 38px;
}

.btn--green {
    background-color: #4ca447;
    border: 1px solid #3c8038;
    color: #fff;
    display: inline-block;
    font-size: 1.125em;
    padding: 8px 30px;
    text-decoration: none;
    transition: background-color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

.btn--green:hover {
    background-color: #3c8038;
}

.btn--green--compact {
    font-size: 1em;
    padding: 4px 20px;
}

.btn--green--large {
    font-size: 1.25em;
    padding: 8px 38px;
}

#ot-sdk-btn.ot-sdk-show-settings {
    color: #fff !important;
    border: 1px solid #f14a65 !important;
}

#ot-sdk-btn.ot-sdk-show-settings:hover {
    color: #fff !important;
    background-color: #ef3351 !important;
}

.btn--pink {
    background-color: #f36279;
    border: 1px solid #f14a65;
    color: #fff;
    display: inline-block;
    font-size: 1.125em;
    line-height: 1.5625em;
    padding: 8px 30px;
    text-decoration: none;
    transition: background-color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

.btn--arrow {
    background-image: url(/build/images/arrow-right-white.fc286066.svg);
    background-repeat: no-repeat;
    background-position: right 30px center;
    background-size: auto 12px;
    padding-right: 60px;
}

.btn--text,
.btn--text--arrow {
    background-color: none;
    border: none;
}

.btn--text--arrow {
    background-image: url(/build/images/arrow-left-grey.4f143450.svg);
    background-repeat: no-repeat;
    background-position: 0 center;
    background-size: auto 12px;
    color: #fff;
    font-size: 0.875em;
    font-weight: 700;
    padding-left: 15px;
    text-decoration: none;
}

.btn--text--arrow-right {
    background-image: url(/build/images/arrow-right-grey.1c3a4582.svg);
    background-position: right center;
    background-repeat: no-repeat;
    background-size: auto 9px;
    color: #b0b0b0;
    font-size: 0.875em;
    font-weight: 700;
    padding-right: 15px;
    text-decoration: none;
    transition: color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

.btn--text--arrow-right:hover {
    color: #fff;
}

.btn--black {
    background-color: #14141478;
    border: none;
    color: #fff;
    display: inline-block;
    font-size: 1.75em;
    padding: 8px 30px;
    text-decoration: none;
    transition: background-color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

.btn--black:hover {
    background-color: rgba(33, 33, 33, 0.470588);
}

@media screen and (max-width: 860px) {
    .btn--black {
        font-size: 1.5em;
    }
}

@media screen and (max-width: 750px) {
    .btn--black {
        font-size: 1.25em;
    }
}

.btn--openinghours {
    appearance: none;
    background: transparent;
    border: none;
    color: #8dc8e8;
    text-decoration: underline;
}

.btn--ajax {
    position: relative;
}

.btn--ajax:before {
    animation: sizeIn 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955) both;
    background: #8dc8e8;
    bottom: 0;
    content: "";
    height: 3px;
    left: 0;
    position: absolute;
    width: 100%;
    z-index: 10;
}

.btn--ajax:after {
    animation: fadeIn 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955) both,
    leftToRight 0.8s infinite 0.2s linear;
    background: #78bee4;
    bottom: 0;
    content: "";
    height: 3px;
    left: 0;
    position: absolute;
    width: 8px;
    z-index: 11;
}

.btn--complete,
.btn--error {
    position: relative;
}

.btn--complete:after,
.btn--error:after {
    animation: fadeIn 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955) both,
    fadeOut 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955) 2.8s both;
    background: #8dc8e8 url(/build/images/checkmark-icon-white.875300a0.svg) no-repeat center center;
    border: 1px solid #8dc8e8;
    content: "";
    display: block;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.btn--error:after {
    background-image: url(/build/images/close-icon-cross.48f42993.svg);
    background-size: 14px;
    background-color: #cd5e5e;
    border-color: #bd3b3b;
}

@keyframes sizeIn {
    from {
        height: 1px;
    }
    to {
        height: 3px;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes fadeOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

@keyframes leftToRight {
    0% {
        left: 0;
    }
    100% {
        left: 100%;
    }
}

a.disabled,
button.disabled {
    pointer-events: none;
    cursor: not-allowed;
    background: #949494;
    border-color: #323232;
}

.btn--small {
    padding: 4px 15px;
    font-size: 0.9em;
    line-height: 1.3em;
}

.btn--upload {
    padding: 4.44444px 15px;
    font-size: 0.9em;
    line-height: 1.3em;
    color: #838383;
    border-radius: 12px;
    display: inline-block;
    appearance: none;
    background: #fff url(/build/images/image-upload.919dbfd7.svg) no-repeat 11px center;
    background-size: 15px 11px;
    padding-left: 30px;
    border: none;
}

.btn--transform {
    background: #656565;
    width: 40px;
    height: 40px;
    border: none;
    margin-right: 2px;
    margin-bottom: 2px;
    padding: 6px;
    text-align: center;
}

.btn--transform img {
    display: block;
    margin: auto;
}

@media (max-width: 960px) {
    .btn--transform {
        margin-right: 10px;
        margin-bottom: 10px;
    }
}

.btn--cart-icon {
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn--cart-icon .cart-icon {
    width: 18px;
    height: 12px;
    background-size: 100% 100%;
    margin-right: 0;
}

.horizontal-list li,
.horizontal-list a {
    display: inline-block;
}

a {
    color: #8dc8e8;
}

.link--gold {
    color: #8dc8e8;
}

.link--gold:hover {
    color: #63b4df;
}

.link--white {
    color: #fff;
}

.link--white:hover {
    color: #e6e6e6;
}

input,
textarea {
    background-color: #fff;
    border: 1px solid rgba(20, 20, 20, 0.3);
    color: #676767;
    display: block;
    font-size: 0.875em;
    padding: 8px;
}

input[type="submit"],
input[type="button"] {
    white-space: normal;
}

.form__item {
    font-size: 0.875em;
    margin-bottom: 15px;
}

@media (max-width: 960px) {
    .form__item.flex {
        flex-direction: column;
    }
}

.form__item .form__item {
    font-size: 1em;
}

.form__input-wrapper {
    display: inline-block;
    max-width: calc(100% - 165px);
}

@media (max-width: 600px) {
    .form__input-wrapper {
        max-width: 100%;
    }
}

.form__input-wrapper input,
.form__input-wrapper label,
.form__input-wrapper select {
    display: inline-block;
    margin-right: 8px;
}

.form__input-wrapper .form__label {
    margin-right: 30px;
    width: auto;
}

@media screen and (max-width: 600px) {
    .form__input-wrapper {
        display: block;
        width: 100%;
    }
}

.form__input {
    font-size: 1em;
    max-width: 100%;
    width: 240px;
}

@media screen and (max-width: 600px) {
    .form__input {
        display: block;
        width: 100%;
    }
}

.input--postal {
    width: 90px;
}

.form__label {
    display: inline-block;
    font-size: 1em;
    margin-bottom: 8px;
    margin-right: 15px;
    text-align: right;
    width: 150px;
}

.form__label--above {
    display: block;
    font-size: 1em;
    margin-bottom: 8px;
}

@media screen and (max-width: 600px) {
    .form__label {
        display: block;
        text-align: left;
        width: 100%;
    }
}

.form__actions--bottom {
    clear: both;
    padding: 30px 0;
    text-align: right;
}

.form__group {
    padding: 0 15px;
}

.form__group--grey {
    background: #152b3e;
    margin-bottom: 15px;
    padding: 15px;
}

.form__group--grey > div:last-child {
    margin-bottom: 0;
}

.form__group--hidden {
    display: none;
}

.form__fieldset {
    border: none;
    margin: 0 0 30px;
    padding: 0;
}

.select__item {
    appearance: none;
    background-color: #fff;
    background-image: url(/build/images/triangle-down-grey.adc46d04.svg);
    background-position: right 8px center;
    background-repeat: no-repeat;
    background-size: 7px 3px;
    border: none;
    box-shadow: none;
    border-radius: 0;
    color: #676767;
    cursor: pointer;
    display: inline-block;
    padding: 8px 15px 8px 8px;
    transition: color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
    max-width: 100%;
    width: 240px;
}

@media screen and (max-width: 600px) {
    .select__item {
        display: block;
        width: 100%;
    }
}

.form__error,
.form-error {
    color: #cd5e5e;
}

input[type="text"],
input[type="email"],
textarea {
    border: 2px solid transparent;
    transition: border ease 300ms;
}

input[type="text"]:focus,
input[type="email"]:focus,
textarea:focus {
    outline: none;
    border: 2px solid #f36279;
}

.custom-radio label {
    display: flex;
    align-items: center;
}

.custom-radio label:before {
    content: "";
    display: block;
    width: 16px;
    min-width: 16px;
    height: 16px;
    margin-right: 10px;
    left: 0;
    background-color: #f5f5f5;
    border: 1px solid #ababab;
    border-radius: 100%;
    transition: background-color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
    margin-top: 2px;
}

.custom-radio input[type="radio"] {
    display: none !important;
}

.custom-radio input[type="radio"]:checked ~ label:before {
    background-color: white;
    background-image: url(/build/images/radio.3fc5f19c.svg);
    background-size: 12px 12px;
    background-position: center center;
    background-repeat: no-repeat;
    border-color: #cd5e5e;
    box-shadow: none;
}

.custom-checkbox label {
    display: flex;
    align-items: center;
}

.custom-checkbox label:before {
    content: "";
    display: block;
    width: 16px;
    min-width: 16px;
    height: 16px;
    margin-right: 10px;
    left: 0;
    background-color: #f5f5f5;
    border-radius: 15%;
    transition: background-color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
    margin-top: 2px;
}

.custom-checkbox input[type="checkbox"] {
    display: none !important;
}

.custom-checkbox input[type="checkbox"]:checked ~ label:before {
    background-color: #f36279;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23ffffff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E");
    background-size: 13px 13px;
    background-position: center center;
    background-repeat: no-repeat;
    box-shadow: none;
}

.custom-checkbox .small {
    padding-left: 8px;
    font-size: 0.8rem;
    color: #8dc8e8;
}

label.required:after {
    content: " *";
    color: white;
    font-size: 18px;
}

.initially-hidden {
    display: none;
}

/**
 * @file
 * Theming for _langswitch
 *
 * @author Senne Torfs <senne.torfs@intracto.com>
 */
.langswitch {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    background-position: right center;
    background-repeat: no-repeat;
    background-size: 7px 3px;
    border: none;
    box-shadow: none;
    cursor: pointer;
    display: block;
    float: right;
    font-size: 0.75em;
    padding: 0 12px 0 0;
    transition: color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
    color: white;
}

.langswitch * {
    color: black;
}

.Firefox .langswitch * {
    color: white;
}

.header__navigation-wrapper .langswitch {
    display: none;
}

@media screen and (max-width: 960px) {
    .langswitch {
        font-size: 0.875em;
    }

    .menu--open .langswitch {
        background-color: #152b3e;
        background-position: right 8px center;
        display: block;
        float: none;
        margin-bottom: 15px;
        padding: 8px 15px;
        width: calc(100% - 50px);
    }
}

/**
 * @file
 * Theming for _cart
 *
 * @author Senne Torfs <senne.torfs@intracto.com>
 */
.header__cart-wrapper {
    float: right;
}

.header__cart-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
}

@media screen and (max-width: 360px) {
    .header__cart-menu {
        position: static;
    }
}

.cart__link {
    border: 1px solid transparent;
    border-bottom: none;
    display: block;
    padding: 7.5px;
    position: relative;
    display: flex;
    align-items: center;
}

.cart-icon {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 28px 22px;
    width: 28px;
    height: 22px;
    margin: 0 7px 0 8px;
    display: inline-block;
}

.cart-nav__item:hover .cart__link {
    background-color: #061729;
    border-radius: 6px 6px 0 0;
    box-shadow: inset 0 -7px 6px -7px rgba(0, 0, 0, 0.5);
}

.cart-nav__item:hover > .cart__summary {
    display: block;
    animation: scaleDown 450ms cubic-bezier(0.1, 1.45, 0.35, 1);
    transform-origin: top center;
}

@media screen and (max-width: 960px) {
    .cart-nav__item:hover .cart__link {
        background-color: transparent;
        border-color: transparent;
        border-radius: 0;
        box-shadow: none;
    }

    .cart-nav__item:hover > .cart__summary {
        display: none;
    }

    .cart-nav__item:hover > .cart__summary.cart--open {
        display: block;
    }
}

.added-tocart:hover > .cart__summary {
    animation: none;
}

@keyframes cartBounce {
    0%,
    100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.3);
    }
}

.cart__amount {
    background: #8dc8e8;
    border-radius: 3px;
    color: #323232;
    display: inline-block;
    font-size: 0.8125em;
    line-height: 1;
    padding: 3px 5px;
}

.added-tocart .cart__amount {
    background: #8dc8e8;
    font-weight: bold;
    animation: cartBounce cubic-bezier(0.77, 0, 0.175, 1) 450ms;
}

@media (max-width: 960px) {
    .cart__label {
        display: none;
    }
}

.added-tocart .cart__link {
    background-color: #f36279;
    border: 1px solid #f14a65;
    border-radius: 6px;
    box-shadow: inset 0 -7px 6px -7px rgba(0, 0, 0, 0.5);
}

.cart__summary {
    background-color: #142a3d;
    border: 1px solid #061729;
    border-radius: 6px;
    display: none;
    position: absolute;
    right: 0;
    width: 320px;
    z-index: 100;
    box-shadow: 0px 1px 21px 0px rgba(0, 0, 0, 0.55);
}

@media screen and (max-width: 960px) {
    .cart__summary.cart--open {
        display: block;
        top: 60px;
    }

    .cart__summary .cart__link {
        border: none;
        display: block;
        float: right;
    }
}

@media screen and (max-width: 360px) {
    .cart__summary {
        width: 100%;
    }

    .cart__summary.cart--open {
        left: 5%;
        top: 120px;
        width: 90%;
    }
}

.summary__title {
    border-bottom: 1px solid #061729;
    clear: both;
    font-weight: 700;
    margin-bottom: 0;
    padding: 15px;
}

@media screen and (max-width: 960px) {
    .summary__title {
        padding-top: 2px;
    }
}

.summary__wrapper {
    padding: 15px;
}

.summary__wrapper::after {
    clear: both;
    content: "";
    display: table;
}

.summary__table {
    font-size: 0.875em;
    margin-bottom: 15px;
    width: 100%;
}

.summary__table td {
    padding: 4px 8px 4px 0;
    vertical-align: top;
}

.summary__table tr td {
    width: 50%;
    text-align: left;
}

.summary__table tr td:last-child {
    text-align: right;
}

@media screen and (max-width: 960px) {
    .cart__row {
        border-bottom: 1px solid #676767;
        display: block;
    }

    .cart__row::after {
        clear: both;
        content: "";
        display: table;
    }

    .cart__row td {
        display: block;
        float: left;
        text-align: left;
    }
}

.cart__cell--product {
    width: 100%;
}

.cart__cell--amount {
    width: 20%;
}

.cart__cell--price {
    width: 80%;
}

.summary__submit {
    background-image: url(/build/images/arrow-right-white.fc286066.svg);
    background-position: right 15px center;
    background-repeat: no-repeat;
    clear: both;
    display: inline-block;
    float: right;
    font-size: 0.75em;
    text-transform: uppercase;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
}

.header__cart-close {
    display: none;
}

@media screen and (max-width: 960px) {
    .header__cart-close {
        display: block;
        float: right;
        margin: 15px 15px 0 0;
    }
}

.payment__optin {
    max-width: 400px;
    text-align: right;
    margin-right: 0;
    margin-left: auto;
    display: flex;
    align-items: flex-start;
    padding-right: 10px;
    margin-bottom: 10px;
}

.payment__optin input[type="checkbox"] {
    margin-top: 7px;
    transform: scale(1.2);
}

p.js-couponcode-error {
    line-height: 26px;
    margin-top: 12px;
}

@media screen and (min-width: 860px) {
    p.js-couponcode-error {
        width: 340px;
    }
}

p.js-couponcode-error-hidden {
    display: none;
}

/* Product components */
/**
 * @file
 * Theming for _product
 *
 * @author Senne Torfs <senne.torfs@intracto.com>
 */
/**
 * Default product grid view
 */
.product__overview--grid {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 30px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.product__overview--grid::after {
    clear: both;
    content: "";
    display: table;
}

@media (max-width: 600px) {
    .product__overview--grid {
        display: block;
    }
}

.product__overview--grid:last-of-type {
    margin-bottom: 0;
}

.product__overview--grid:after {
    content: none;
}

.product__overview--grid.shop {
    align-content: flex-start;
    justify-content: flex-start;
}

.product__item--block {
    background-color: #152b3e;
    border-left: 4px solid #061729;
    border-right: 4px solid #061729;
    display: flex;
    align-content: stretch;
    flex-direction: column;
    float: left;
    padding: 15px;
    width: 33.33333%;
    margin-bottom: 25px;
}

@media (max-width: 750px) {
    .product__item--block.item-6 {
        margin-bottom: 15px;
    }
}

@media screen and (max-width: 860px) {
    .product__item--block {
        width: 50%;
    }

    .product__item--block:nth-of-type(3n) {
        border-right: none;
    }

    .product__item--block:nth-of-type(2n),
    .product__item--block:last-of-type {
        border-right: 1px solid #5b5b5b;
    }

    .product__item--block:nth-of-type(n + 3) {
        border-top: none;
    }
}

@media screen and (max-width: 600px) {
    .product__item--block {
        margin-bottom: 8px;
        width: 100%;
        float: none;
    }
}

.product__row {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 15px;
    flex-grow: 1;
}

.product__row::after {
    clear: both;
    content: "";
    display: table;
}

.product__row:last-of-type {
    margin-bottom: 0;
}

.product__col--full {
    clear: both;
}

.cart__form {
    float: right;
    vertical-align: top;
}

.cart__form .spinner__wrapper {
    background-color: #8dc8e8;
}

@media screen and (max-width: 960px) {
    .cart__form {
        display: inline-block;
        margin: 0 4px;
        float: none;
    }

    .cart__form .spinner__wrapper {
        margin-bottom: 2px;
    }
}

@media screen and (max-width: 600px) {
    .cart__form {
        display: block;
        width: 100%;
    }
}

.cart__quantity {
    background: #152b3e;
    color: white;
    display: inline-block;
    font-size: 0.875em;
    padding: 8px;
    width: 45px;
    text-align: center;
}

.cart__submit-wrapper {
    display: inline-block;
    overflow: hidden;
    position: relative;
    vertical-align: top;
}

.cart__submit-wrapper .cart-icon {
    color: #001729;
}

.cart__submit {
    font-size: 0.875em;
    padding: 8px;
    text-transform: uppercase;
}

.product__sub-items {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.product__sub-item {
    background: #1e1e1e;
    display: flex;
    margin-bottom: 1px;
    padding: 8px;
    align-items: center;
    text-decoration: none;
}

.product__sub-item::after {
    clear: both;
    content: "";
    display: table;
}

.product__sub-item img {
    display: block;
}

.product__sub-item:hover {
    background-color: #07497d;
}

.product__sub-item--list {
    width: 33%;
    font-size: 0.75em;
    margin-bottom: 30px;
    display: flex;
    align-items: center;
}

.product__sub-item--list .grid__col--one-third {
    width: 52px;
    height: 56px;
    margin-right: 20px;
    margin-bottom: 0;
}

@media (max-width: 860px) {
    .product__sub-item--list {
        width: 50%;
    }
}

@media (max-width: 600px) {
    .product__sub-item--list {
        width: 100%;
    }
}

.product__sub-item--list img {
    display: block;
}

@media screen and (max-width: 360px) {
    .product__sub-item .sub-item__col--left {
        display: none;
    }

    .product__sub-item .sub-item__col--left {
        width: 100%;
    }
}

@media screen and (max-width: 300px) {
    .product__sub-item {
        display: none;
    }
}

.sub-item__title {
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    margin: 0;
}

.sub-item__description {
    color: #949494;
    font-size: 1em;
    line-height: 1.25;
    margin: 0;
}

.sub-item__col--left {
    float: left;
    display: block;
    margin-right: 6.79902%;
    width: 25.24069%;
    max-width: 34px;
}

.sub-item__col--left:last-child {
    margin-right: 0;
}

.sub-item__col--right {
    float: left;
    display: block;
    margin-right: 6.79902%;
    width: 67.96029%;
}

.sub-item__col--right:last-child {
    margin-right: 0;
}

/**
 * Product overview in configurator
 */
.product__overview--list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.product__item--list {
    float: left;
    display: block;
    margin-right: 4.43223%;
    width: 12.97314%;
    margin-bottom: 15px;
    position: relative;
}

.product__item--list:last-child {
    margin-right: 0;
}

.product__item--list,
.product__item--list--compact {
    display: inline-block;
}

.product__item--list--compact {
    float: left;
    display: block;
    margin-right: 6.79902%;
    width: 11.00082%;
    margin-bottom: 0;
}

.product__item--list--compact:last-child {
    margin-right: 0;
}

.product__item--list.active .product__image-wrapper--config {
    background: #21487d;
}

.product__item--list.active .product__title--list {
    color: white;
}

.modal__content .product__item--list {
    cursor: pointer;
}

.modal__content .product__item--list:hover .product__image-wrapper--config {
    background: #21487d;
}

@media screen and (max-width: 960px) {
    .product__item--list--compact {
        float: left;
        display: block;
        margin-right: 3.28774%;
        width: 13.92688%;
    }

    .product__item--list--compact:last-child {
        margin-right: 0;
    }
}

@media screen and (max-width: 460px) {
    .product__item--list--compact {
        float: left;
        display: block;
        margin-right: 6.79902%;
        width: 28.80065%;
        margin-bottom: 4px;
    }

    .product__item--list--compact:last-child {
        margin-right: 0;
    }

    .product__item--list--compact:nth-of-type(3n) {
        margin-right: 0;
    }

    .product__item--list--compact:nth-of-type(3n + 1) {
        clear: left;
    }
}

@media screen and (max-width: 360px) {
    .product__item--list {
        float: left;
        display: block;
        margin-right: 6.79902%;
        width: 28.80065%;
    }

    .product__item--list:last-child {
        margin-right: 0;
    }

    .product__item--list:nth-of-type(3n) {
        margin-right: 0;
    }

    .product__item--list:nth-of-type(3n + 1) {
        clear: left;
    }
}

.product__item--selected .product__image-wrapper--config {
    background: #f36279;
}

.product__item--selected:hover .product__image-wrapper--config {
    background: #f14a65;
}

.product__image-wrapper--config {
    background: #152b3e;
    border-radius: 6px;
    margin-bottom: 4px;
    padding: 12px;
    position: relative;
    transition: background 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

.product__image-wrapper--config img {
    display: block;
    width: 100%;
}

.product__image-wrapper--empty {
    background: url(/build/images/plus-icon.27753c07.svg) no-repeat center center;
    border: 2px dashed #07497d;
    border-radius: 6px;
    display: block;
    height: inherit;
    min-height: 103px;
    overflow: hidden;
    position: relative;
    width: 100%;
    opacity: 0.7;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
    z-index: 10;
}

.product__image-wrapper--empty::before {
    content: "";
    display: block;
    height: 150%;
    width: 0;
}

@media screen and (max-width: 860px) {
    .product__image-wrapper--empty {
        min-height: 90px;
    }
}

.product__remove {
    background: url(/build/images/close-icon.4c7ddcda.svg) no-repeat center center;
    height: 30px;
    overflow: hidden;
    position: absolute;
    right: -15px;
    text-decoration: none;
    top: -15px;
    width: 30px;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
    z-index: 10;
    transition: all ease 350ms;
}

.product__remove:hover {
    background: url(/build/images/close-icon-red.4c8e3c3b.svg) no-repeat center center;
}

.product__remove::before {
    content: "";
    display: block;
    height: 100%;
    width: 0;
}

.product_can_info {
    position: absolute;
    right: 0;
    bottom: 35px;
}

.product--teaser .product__top {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
}

.product--teaser .product__link {
    text-decoration: none;
    color: inherit;
    transition: all ease 250ms;
    margin-bottom: auto;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.product--teaser .product__link:hover .product__image-wrapper {
    opacity: 0.8;
}

@media (min-width: 750px) {
    .product--teaser .product__link:hover .product__title {
        border-color: rgba(255, 255, 255, 0.5);
    }
}

.product--teaser .product__detail-link {
    text-decoration: underline;
}

@media (max-width: 600px) {
    .product--teaser .product__price {
        margin-bottom: 0.45em;
    }
}

.product__title {
    font-size: 1.125em;
    margin-bottom: 0;
    color: white;
    border-bottom: 1px solid transparent;
}

@media (max-width: 750px) {
    .product__title {
        width: 100%;
    }
}

@media screen and (max-width: 460px) {
    .product__title {
        font-size: 1.125em;
    }
}

@media screen and (max-width: 360px) {
    .product__title {
        font-size: 1em;
    }
}

.product__title--sub {
    color: #8dc8e8;
    font-size: 0.7em;
}

.product__image--thumb {
    display: block;
    margin: 0 auto 0;
    padding-bottom: 15px;
}

.product__details-wrapper {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    flex-grow: 1;
    margin-bottom: 15px;
    width: 100%;
    position: relative;
    padding-bottom: 15px;
    display: flex;
    flex-direction: column;
}

.product__details-wrapper::after {
    clear: both;
    content: "";
    display: table;
}

.product__details-wrapper .product__row:first-child {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.product__details-wrapper .product__description-wrapper {
    flex-grow: 1;
}

.product__details-wrapper .img-wrapper .product-label--red {
    position: absolute;
    border-radius: 100px;
    width: 100px;
    height: 100px;
    background: #ee222c;
    text-align: center;
    font-size: 14px;
    top: 75px;
    display: flex;
    align-items: center;
    word-wrap: break-word;
    line-height: 16px;
    padding: 5px;
    text-transform: uppercase;
    justify-content: center;
}

@media (max-width: 1280px) {
    .product__details-wrapper .img-wrapper {
        width: 100%;
    }
}

@media (max-width: 600px) {
    .product__details-wrapper .img-wrapper {
        width: auto;
    }
}

.product__details-wrapper .img-wrapper.loading {
    height: 290px;
}

.product__details--footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    font-size: 13px;
}

.product__details--footer .product__col--right {
    margin-left: auto;
}

.product__amount {
    border-radius: 100%;
    text-align: center;
    background: #646464;
    font-weight: bold;
    padding: 5px;
    position: absolute;
    top: -8px;
    right: -8px;
    font-size: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Price */
.product__description {
    font-size: 0.85em;
}

.product__description-label {
    color: #fff;
    font-size: 1em;
}

@media screen and (max-width: 300px) {
    .product__description-label {
        display: none;
    }
}

.product__description--short {
    color: #fff;
    font-size: 1em;
    line-height: 1.5;
    margin-bottom: 8px;
    position: relative;
}

.product__description--short:after {
    background-color: transparent;
    background-image: -webkit-linear-gradient(top, transparent, #262626 90%);
    background-image: linear-gradient(to bottom, transparent, #262626 90%);
    bottom: 0;
    content: "";
    height: 40px;
    left: 0;
    position: absolute;
    width: 100%;
}

.product__actions {
    border-top: 1px solid #8dc8e8;
    padding-top: 15px;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

.product__actions::after {
    clear: both;
    content: "";
    display: table;
}

@media screen and (max-width: 960px) {
    .product__actions {
        text-align: center;
    }
}

.product__price {
    display: inline-block;
    font-size: 1.25em;
    font-weight: 700;
    line-height: 18px;
    margin-right: auto;
}

@media (max-width: 960px) {
    .product__price {
        margin-right: auto;
        text-align: center;
    }
}

@media screen and (max-width: 460px) {
    .product__price {
        font-size: 1.125em;
    }
}

@media screen and (max-width: 360px) {
    .product__price {
        font-size: 1em;
    }
}

.product__price-vat {
    color: #8dc8e8;
    font-size: 12px;
}

.product__title--list {
    font-size: 0.875em;
    margin-bottom: 0;
    text-align: center;
    color: rgba(255, 255, 255, 0.5);
}

/* Special edition product label */
.product-label {
    padding: 0 5px;
    font-size: 0.8em;
    margin-left: auto;
    margin-right: 0;
    border-radius: 5px;
    text-align: center;
    font-weight: bold;
    display: block;
    white-space: nowrap;
    text-decoration: none;
    text-shadow: 1px 1px 1px #b9553d;
    color: white;
}

.product-label.special {
    padding-left: 18px;
    background: #f16e50;
    background-image: url(/build/images/icon-star.75dda97a.svg);
    background-repeat: no-repeat;
    background-position: 5px center;
    background-size: 10px 10px;
}

.product-label.new {
    background: #3fa535;
}

.product-label.own-design {
    background: #a57f35;
}

.product-label.promo {
    background: #dcd851;
}

@media (max-width: 960px) {
    .product-label {
        margin-left: 0;
        margin-right: auto;
    }
}

.loading .product-label {
    display: none;
}

/* Promotion product label */
.product-label--promotion {
    background-color: #289a83;
    padding: 1px 6px;
    border-radius: 7px;
    font-size: 14px;
    font-weight: bold;
    text-shadow: 0.5px 0.866px 0px rgba(0, 0, 0, 0.23);
    margin: auto;
    text-align: center;
    z-index: 10;
    display: inline-block;
}

.product__price .product-label--promotion {
    margin-top: 4px;
    margin-left: 10px;
}

@media (max-width: 460px) {
    .product__price .product-label--promotion {
        margin-top: 2px;
    }
}

.product--detail {
    /* Product description */
    /* Add to cart form */
}

.product--detail .product__top {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

@media (min-width: 600px) {
    .product--detail .product__top {
        padding-top: 5em;
    }
}

.product--detail .product__title {
    font-size: 1.5em;
}

@media (min-width: 600px) {
    .product--detail .product__title {
        font-size: 3em;
        margin-bottom: 0.35em;
        font-weight: 200;
    }
}

.product--detail .product__image-wrapper {
    width: 35%;
    padding-right: 20px;
    text-align: center;
    float: left;
}

@media (max-width: 960px) {
    .product--detail .product__image-wrapper {
        width: 35%;
    }
}

@media (max-width: 600px) {
    .product--detail .product__image-wrapper {
        display: none;
    }
}

.product--detail .product__image-wrapper-mobile {
    padding: 1em 0;
}

.product--detail .product__image-wrapper-mobile img {
    max-width: 120px;
    padding: 0;
}

@media (min-width: 600px) {
    .product--detail .product__image-wrapper-mobile {
        display: none;
    }
}

@media (min-width: 960px) {
    .product--detail .product__information {
        width: 50%;
    }
}

@media (min-width: 600px) {
    .product--detail .product__information {
        width: 65%;
        max-width: 505px;
        float: right;
    }
}

.product--detail .product__overview--list {
    position: relative;
    display: inline-flex;
    flex-wrap: nowrap;
    background: #061729;
}

.product--detail .product__item--list {
    max-width: 100px;
    width: auto;
    margin: 0 1em;
    float: none;
}

.product--detail .product__item--list:first-child {
    margin-left: 0;
}

.product--detail .product__item--list:last-child {
    margin-right: 0;
}

.product--detail .product__description-wrapper {
    margin: 2em 0;
}

@media (max-width: 600px) {
    .product--detail .product__description-wrapper {
        display: none;
    }
}

@media (min-width: 600px) {
    .product--detail .product__description-wrapper-mobile {
        display: none;
    }
}

.product--detail .product__description {
    font-size: 1em;
    opacity: 0.8;
}

@media (max-width: 600px) {
    .product--detail .product__description {
        font-size: 0.9em;
    }
}

.product--detail .product__description p {
    line-height: 140%;
}

@media (max-width: 600px) {
    .product--detail .product__description p {
        line-height: 130%;
    }
}

.product--detail .text--grey {
    opacity: 0.3;
}

.product--detail .product__actions {
    border: 1px solid #8dc8e8;
    border-left: none;
    border-right: none;
    padding: 1.25em 0;
    align-items: center;
}

.product--detail .product__actions .product__price {
    margin: 0;
    text-align: left;
    font-size: 1.75em;
    font-weight: 500;
}

@media (max-width: 600px) {
    .product--detail .product__actions .product__price {
        margin: auto;
        margin-bottom: 0.45em;
    }
}

.product--detail .spinner__wrapper {
    margin: 0 1.5em;
}

@media (max-width: 600px) {
    .product--detail .spinner__wrapper {
        margin: 0;
    }
}

.product--detail .can__detail {
    max-width: 670px;
    margin-left: auto;
    margin-right: auto;
}

.product--detail .product__contents {
    margin: auto;
    margin-bottom: 5em;
}

.product--detail .product__contents.has-cans .product__contents-top:after {
    display: block;
}

.product--detail .product__contents-title {
    font-size: 2.1875em;
    font-weight: 200;
    margin-bottom: 1em;
    display: inline-block;
    position: relative;
}

.product--detail .product__contents-top {
    position: relative;
}

.popup__overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #5b5b5b;
    opacity: 0.5;
    left: 0;
    top: 0;
    z-index: 100;
}

.popup__modal-wrapper {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 101;
}

.popup__modal-wrapper .popup__modal {
    width: 60%;
    height: auto;
    margin: 230px auto auto auto;
    background-color: #003865;
    z-index: 102;
    padding: 25px;
    text-align: center;
    border: 1px solid #8dc8e8;
    position: relative;
}

.popup__modal-wrapper .popup__modal-top-image {
    width: 365px;
    position: absolute;
    top: -149px;
    margin-left: 50%;
    left: -182.5px;
}

.popup__modal-wrapper .popup__modal-text {
    color: #979797;
}

.popup__modal-wrapper .popup__modal a {
    color: #fff;
}

.popup__modal-wrapper .popup__modal .newsletter-form {
    width: 75%;
    margin-left: auto;
    margin-right: auto;
}

.popup__modal-wrapper .popup__modal .newsletter-form .newsletter__input {
    width: 80%;
}

.popup__modal-wrapper .popup__modal .newsletter-form .newsletter__submit {
    width: 20%;
}

.popup__modal-wrapper .close-button {
    background: #8dc8e8;
    width: 23px;
    height: 23px;
    cursor: pointer;
    top: -1px;
    right: -24px;
    position: absolute;
}

.imageblock__item--block {
    border-right: none;
    display: flex;
    align-content: stretch;
    flex-direction: column;
    float: left;
    width: 32%;
    margin-bottom: 25px;
}

.imageblock__item--block a {
    padding: 0;
}

.imageblock__item--block a img {
    display: block;
    width: 100%;
}

.imageblock__item--block:nth-of-type(n + 4) {
    border-top: none;
}

@media (max-width: 750px) {
    .imageblock__item--block.item-6 {
        margin-bottom: 15px;
    }
}

@media screen and (max-width: 860px) {
    .imageblock__item--block {
        width: 50%;
    }

    .imageblock__item--block:nth-of-type(3n) {
        border-right: none;
    }

    .imageblock__item--block:nth-of-type(n + 3) {
        border-top: none;
    }
}

@media screen and (max-width: 600px) {
    .imageblock__item--block {
        width: 100%;
        float: none;
    }
}

.pageblock__item--block {
    background-color: #262626;
    border: 1px solid #5b5b5b;
    border-right: none;
    display: flex;
    align-content: stretch;
    flex-direction: column;
    float: left;
    width: 33.33333%;
    margin-bottom: 25px;
    padding: 0;
}

.pageblock__item--block-overlay {
    position: absolute;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, 0.23) linear-gradient(0deg, #262626 0%, rgba(38, 38, 38, 0) 75%);
}

.pageblock__item--block h3 {
    margin-bottom: 5px;
    color: #b0b0b0;
}

.pageblock__item--block ul.taxons {
    list-style: none;
    margin-top: 0;
    margin-left: -40px;
    color: #b0b0b0;
}

.pageblock__item--block ul.taxons li {
    float: left;
    margin-right: 10px;
    border: 1px solid #b0b0b0;
    padding: 5px;
    border-radius: 3px;
    text-transform: uppercase;
    font-size: 10px;
}

.pageblock__item--block ul.taxons li a {
    margin: 0;
    text-decoration: none;
}

.pageblock__item--block ul.taxons li:hover {
    background-color: #b0b0b0;
    color: #07497d;
}

.pageblock__item--block-img {
    height: 40%;
    overflow: hidden;
    vertical-align: bottom;
    position: relative;
    background-position: center center;
}

.pageblock__item--block .block__title-wrapper {
    margin-left: 15px;
    margin-right: 15px;
    position: absolute;
    bottom: 0;
    margin-bottom: 15px;
    z-index: 1;
}

.pageblock__item--block p {
    margin: 25px 15px;
    line-height: 1.5;
    font-size: 13px;
    position: relative;
    color: #d2d2d2;
}

.pageblock__item--block p:after {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 50%;
    width: 100%;
    content: "";
    background: linear-gradient(0deg, #262626 0%, rgba(255, 255, 255, 0) 64%);
    pointer-events: none;
}

.pageblock__item--block a {
    margin: 15px;
    color: #d2d2d2;
    font-size: 13px;
}

.pageblock__item--block:nth-of-type(3n),
.pageblock__item--block:last-of-type {
    border-right: 1px solid #5b5b5b;
}

.pageblock__item--block:nth-of-type(n + 4) {
    border-top: none;
}

@media (max-width: 750px) {
    .pageblock__item--block.item-6 {
        margin-bottom: 15px;
    }
}

@media screen and (max-width: 860px) {
    .pageblock__item--block {
        width: 50%;
    }

    .pageblock__item--block:nth-of-type(3n) {
        border-right: none;
    }

    .pageblock__item--block:nth-of-type(2n),
    .pageblock__item--block:last-of-type {
        border-right: 1px solid #5b5b5b;
    }

    .pageblock__item--block:nth-of-type(n + 3) {
        border-top: none;
    }
}

@media screen and (max-width: 600px) {
    .pageblock__item--block {
        border-right: 1px solid #5b5b5b;
        margin-bottom: 8px;
        width: 100%;
        float: none;
    }

    .pageblock__item--block:nth-of-type(n) {
        border-right: 1px solid #5b5b5b;
        border-top: 1px solid #5b5b5b;
    }
}

.news__category_selector {
    margin-top: 19px;
    border: 1px solid #fff;
    color: #fff;
    background: #003865;
    height: 43px;
    padding: 10px;
    padding-right: 50px;
    float: right;
    max-width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: linear-gradient(45deg, transparent 50%, #fff 50%),
    linear-gradient(135deg, #fff 50%, transparent 50%),
    linear-gradient(to right, #fff, #fff);
    background-position: calc(100% - 20px) calc(1em + 2px),
    calc(100% - 15px) calc(1em + 2px), calc(100% - 2.5em) 0.5em;
    background-size: 5px 5px, 5px 5px, 1px 1.5em;
    background-repeat: no-repeat;
}

.news__block-image {
    width: 100%;
    height: 215px;
    background-position: center;
    overflow: hidden;
}

.news__block-image img {
    height: auto;
    width: 100%;
    height: 215px;
}

@media screen and (max-width: 860px) {
    .news__block-image img {
        height: auto;
    }
}

/**
 * @file
 * Theming for _usp-list
 *
 * @author Senne Torfs <senne.torfs@intracto.com>
 */
.footer__usp-list {
    color: white;
    background: #152b3e;
    clear: both;
    list-style: none;
    margin: 0;
    margin-bottom: 30px;
    padding: 15px 30px;
    width: 100%;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
}

.footer__usp-list::after {
    clear: both;
    content: "";
    display: table;
}

.footer__usp-list li {
    color: #a1a1a1;
    display: table-cell;
    font-size: 0.9375em;
    font-weight: 700;
    padding-right: 30px;
}

.footer__usp-list li:last-child {
    padding-right: 0;
}

.footer__usp-list span {
    display: inline-block;
    line-height: 26px;
    vertical-align: middle;
}

.footer__usp-list svg {
    min-width: 15px;
}

.footer__usp-list svg path {
    fill: white;
}

@media screen and (max-width: 750px) {
    .footer__usp-list {
        display: block;
    }

    .footer__usp-list li {
        display: block;
        float: left;
        margin-bottom: 15px;
        width: 50%;
    }

    .footer__usp-list li:nth-of-type(2n + 1) {
        clear: left;
    }
}

@media screen and (max-width: 460px) {
    .footer__usp-list {
        padding: 15px;
    }

    .footer__usp-list li {
        width: 100%;
    }
}

.usp__icon {
    display: inline-block;
    fill: #ef6079;
    margin-right: 8px;
    vertical-align: middle;
}

.cta-wrapper {
    width: auto;
    float: right;
    padding-top: 1em;
}

@media (max-width: 960px) {
    .cta-wrapper {
        width: 100%;
        text-align: left;
        display: flex;
        justify-content: space-between;
    }
}

@media (max-width: 600px) {
    .cta-wrapper {
        width: 100%;
        flex-direction: column;
    }
}

/**
 * @file
 * Theming for _newsletter
 *
 * @author Senne Torfs <senne.torfs@intracto.com>
 */
.newsletter__submit {
    display: table-cell;
    font-size: 0.75em;
    padding: 8px 15px;
    text-transform: uppercase;
    vertical-align: top;
    height: 40px;
    width: auto;
}

.header__menu--mobile .newsletter__submit {
    width: 100%;
}

input[type="submit"].newsletter__submit {
    white-space: nowrap;
}

.newsletter-form__form {
    display: flex;
}

.newsletter__input {
    color: #676767;
    display: table-cell;
    font-size: 0.8125em;
    margin-right: 8px;
    padding: 7px 15px 7px 8px;
    width: 60%;
    height: 40px;
}

.header__menu--mobile .newsletter__input {
    margin-bottom: 8px;
    width: 100%;
}

.newsletter-form {
    display: table;
    margin-bottom: 15px;
    width: 100%;
}

@keyframes newsletterBounce {
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes newsletterScale {
    0%,
    100% {
        height: auto;
    }
    100% {
        transform: scale(1);
    }
}

.newsletter-form__feedback--wrapper {
    height: 0px;
}

.cssanimations .newsletter-form__feedback--wrapper {
    transform: scale(0.6);
    animation: newsletterScale ease-in 350ms forwards;
}

.newsletter-form__feedback {
    padding: 7px 15px;
    color: white;
    margin: 15px 0;
    margin-bottom: 7px;
    text-align: center;
}

.newsletter-form__feedback.success {
    background-color: #3fb727;
}

.cssanimations .newsletter-form__feedback.success {
    opacity: 0;
    animation: newsletterBounce ease-in 350ms forwards;
}

.newsletter-form__feedback.error {
    background-color: #cd5e5e;
}

.header__menu--mobile .newsletter-form {
    margin-bottom: 30px;
}

/**
 * @file
 * Theming for _banner
 *
 * @author Senne Torfs <senne.torfs@intracto.com>
 */
.mixing__banner {
    background-color: #0d273f;
    background-position: center 40px;
    background-size: cover;
    margin-bottom: 15px;
    padding: 15px;
    border: 4px solid #193865;
    height: 117px;
}

.mixing__banner::after {
    clear: both;
    content: "";
    display: table;
}

.mixing__banner--container {
    float: none;
    clear: both;
}

.mixing__banner--container.grid__col--two-third {
    width: 66.66667%;
    margin-right: 0;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 25px;
}

@media (max-width: 960px) {
    .mixing__banner--container.grid__col--two-third {
        width: 100%;
        padding-left: 0;
    }
}

.mixing__banner--container.grid__row {
    width: 100%;
    margin-top: 0;
}

.mixing__banner--block {
    background-size: cover;
    padding: 45px 65px;
    height: 449px;
    width: 50%;
    float: left;
    align-self: stretch;
    border: 1px solid #5b5b5b;
    border-right: none;
}

.mixing__banner--block::after {
    clear: both;
    content: "";
    display: table;
}

@media (max-width: 1300px) {
    .mixing__banner--block {
        padding: 30px;
    }
}

@media (max-width: 750px) {
    .mixing__banner--block {
        width: 100%;
        height: auto;
        float: none;
        border-right: 1px solid #5b5b5b;
        border-bottom: none;
    }
}

.mixing__banner--block:nth-of-type(3n),
.mixing__banner--block:last-of-type {
    border-right: 1px solid #5b5b5b;
}

@media (max-width: 750px) {
    .mixing__banner--block:nth-of-type(3n),
    .mixing__banner--block:last-of-type {
        border-bottom: 1px solid #5b5b5b;
    }
}

.grid__col--two-third .mixing__banner--block {
    min-height: 0;
}

@media screen and (max-width: 750px) {
    .mixing__banner--block {
        background-position: right top;
        padding: 30px 15px;
    }
}

@media screen and (max-width: 460px) {
    .mixing__banner--block {
        padding: 15px;
    }
}

.banner__title {
    color: #fff;
    font-size: 2.375em;
    margin-bottom: 15px;
}

@media screen and (max-width: 750px) {
    .banner__title {
        font-size: 1.875em;
    }
}

@media screen and (max-width: 460px) {
    .banner__title {
        font-size: 1.5em;
    }
}

.banner__subtitle {
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
    display: inline-block;
    font-size: 0.8125em;
    margin-bottom: 15px;
    padding: 4px 8px;
    max-width: 50%;
}

@media (max-width: 960px) {
    .banner__subtitle {
        display: none;
    }
}

.grid__col--two-third .banner__subtitle {
    display: none;
}

.banner__text {
    clear: both;
    font-size: 0.9375em;
    line-height: 1.5;
    margin-bottom: 30px;
    width: auto;
    max-width: 50%;
}

@media (max-width: 1200px) {
    .banner__text {
        max-width: 100%;
    }
}

.grid__col--two-third .banner__text {
    max-width: 100%;
}

.banner__button {
    color: #fff;
    font-size: 1.0625em;
    text-transform: uppercase;
}

.banner__title--arrow {
    animation: moveDown 1.2s infinite cubic-bezier(0.455, 0.03, 0.515, 0.955) alternate both;
    background: #f06279;
    background-clip: padding-box;
    border: 1px solid rgba(219, 154, 30, 0.3);
    box-shadow: 0 15px 20px rgba(0, 0, 0, 0.5);
    display: inline-block;
    font-size: 1.125em;
    margin-bottom: 0;
    padding: 15px 30px;
    position: relative;
    text-transform: uppercase;
    z-index: 1;
    margin-top: 25px;
}

.banner__title--arrow:before {
    content: "";
    border-color: rgba(219, 154, 30, 0.3) transparent transparent;
    border-style: solid;
    border-width: 24px;
    position: absolute;
    bottom: -48px;
    left: 50%;
    margin-left: -24px;
}

.banner__title--arrow:after {
    content: "";
    border-color: #f06279 transparent transparent;
    border-style: solid;
    border-width: 22px;
    position: absolute;
    bottom: -44px;
    left: 50%;
    margin-left: -22px;
}

@media screen and (max-width: 960px) {
    .banner__title--arrow {
        font-size: 1em;
        padding: 15px;
    }
}

@media screen and (max-width: 750px) {
    .banner__title--arrow {
        display: none;
    }
}

.banner__bar {
    background: rgba(38, 38, 38, 0.7);
    background-clip: padding-box;
    border: 1px solid rgba(81, 81, 81, 0.3);
    float: right;
    font-size: 0.9375em;
    position: relative;
    margin-top: 16px;
}

.grid__col--two-third .banner__bar {
    display: none;
}

.mixing__banner--block .banner__bar {
    width: 100%;
}

@media screen and (max-width: 750px) {
    .banner__bar {
        width: 100%;
    }
}

.banner__hand {
    position: relative;
}

.banner__hand:before {
    background: url(/build/images/can-in-hand.b3ab02ea.png) top center no-repeat;
    bottom: -27px;
    content: "";
    left: -108px;
    position: absolute;
    height: 100px;
    width: 78px;
}

.banner__content--block {
    margin-bottom: 45px;
    margin-left: 51%;
    width: 52.493%;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
}

.grid__col--three-third .banner__content--block {
    width: 100%;
    margin: 0;
}

.grid__col--two-third .banner__content--block {
    width: 100%;
    margin: 0;
}

@media screen and (max-width: 750px) {
    .banner__content--block {
        float: left;
        display: block;
        margin-right: 5.01404%;
        width: 60.61974%;
        margin-left: 39.38026%;
        margin-bottom: 30px;
    }

    .banner__content--block:last-child {
        margin-right: 0;
    }
}

@media screen and (max-width: 600px) {
    .banner__content--block {
        float: left;
        display: block;
        margin-right: 5.01404%;
        width: 86.87325%;
        margin-left: 13.12675%;
    }

    .banner__content--block:last-child {
        margin-right: 0;
    }
}

@media screen and (max-width: 460px) {
    .banner__content--block {
        float: left;
        display: block;
        margin-right: 5.01404%;
        width: 100%;
        margin-left: 0%;
        margin-bottom: 15px;
    }

    .banner__content--block:last-child {
        margin-right: 0;
    }
}

.banner__inner-content {
    overflow: hidden;
}

.banner__inner-content::after {
    clear: both;
    content: "";
    display: table;
}

.banner__content--arrow,
.banner__content--right {
    float: left;
    padding: 16px 30px;
}

@media screen and (max-width: 960px) {
    .banner__content--arrow,
    .banner__content--right {
        padding-left: 15px;
        padding-right: 15px;
    }
}

.banner__content--arrow {
    background: #193865;
    margin-right: 30px;
    position: relative;
    padding-right: 15px;
    height: 50px;
    line-height: 18px;
}

.banner__content--arrow:after {
    content: "";
    border-color: transparent transparent transparent #193865;
    border-style: solid;
    border-width: 25px;
    position: absolute;
    left: 100%;
    top: 0;
}

@media (max-width: 1100px) {
    .banner__content--arrow {
        padding-left: 15px;
        padding-right: 15px;
    }
}

@media screen and (max-width: 600px) {
    .banner__content--arrow {
        text-align: center;
        width: 100%;
    }

    .banner__content--arrow:after {
        border-color: #515151 transparent transparent transparent;
        border-width: 16px;
        left: 50%;
        margin-left: -8px;
        margin-top: 0;
        top: 100%;
    }
}

.banner__content--right {
    padding: 6.66667px 30px;
    height: 50px;
    padding-right: 0;
}

@media (max-width: 1100px) {
    .banner__content--right {
        padding-left: 8px;
    }
}

@media screen and (max-width: 600px) {
    .banner__content--right {
        padding: 15px 30px 8px;
        text-align: center;
        width: 100%;
    }
}

.package-icon {
    background: url(/build/images/giftbox-icon.c7b15433.png) right center no-repeat;
    display: inline-block;
    padding: 8px 0;
    padding-right: 45px !important;
}

.can-icon {
    background: url(/build/images/can-icon.4722982b.png) right center no-repeat;
    display: inline-block;
    padding: 8px 0;
    padding-right: 30px;
}

.banner__text--large {
    font-size: 1.11111em;
    font-weight: 700;
}

.banner__equal-sign {
    display: inline-block;
    font-size: 1.33333em;
    margin: 0 10px;
}

@media screen and (max-width: 960px) {
    .banner__equal-sign {
        margin: 0 15px;
    }
}

@keyframes moveDown {
    0%,
    50% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(10%);
    }
}

.banner--variant-1 {
    background-image: url(/build/images/bg-banner-1-big.25f75259.jpg);
}

.grid__col--two-third .banner--variant-1 {
    background-image: url(/build/images/bg-banner-1-small.42d96f72.jpg);
}

.grid__col--three-third .banner--variant-1 {
    background-image: url(/build/images/bg-banner-1-medium.689b3459.jpg);
}

@media (max-width: 1200px) {
    .grid__col--three-third .banner--variant-1 {
        background-image: url(/build/images/bg-banner-1-small.42d96f72.jpg);
    }
}

.banner--variant-2 {
    background-image: url(/build/images/bg-banner-2-big.ea8c76a5.jpg);
}

.grid__col--two-third .banner--variant-2 {
    background-image: url(/build/images/bg-banner-2-small.a8553794.jpg);
}

.grid__col--three-third .banner--variant-2 {
    background-image: url(/build/images/bg-banner-2-medium.c90b659f.jpg);
}

@media (max-width: 1200px) {
    .grid__col--three-third .banner--variant-2 {
        background-image: url(/build/images/bg-banner-2-small.a8553794.jpg);
    }
}

/* Banner flexbox margin */
.banner__header {
    margin-bottom: auto;
    margin-top: 0;
}

.banner__footer {
    margin-top: auto;
    margin-bottom: 0;
}

/**
 * @file
 * Theming for _configurator
 *
 * @author Senne Torfs <senne.torfs@intracto.com>
 */
@keyframes moveIn {
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

.config__wrapper {
    background: #152b3e;
    border: 1px solid #07497d;
    border-bottom: none;
    border-radius: 9px 9px 0 0;
    bottom: 0;
    left: 50%;
    margin-left: -390px;
    position: fixed;
    width: 780px;
    transition: height cubic-bezier(0.68, -0.55, 0.265, 1.55) 370ms;
    z-index: 13;
}

.cssanimations .config__wrapper {
    opacity: 0;
    transform: translateY(100px);
    animation: moveIn cubic-bezier(0.215, 0.61, 0.355, 1) 500ms forwards;
}

.config__wrapper.wrapper--closed .config__row--bottom {
    display: none;
}

@media screen and (max-width: 600px) {
    .config__wrapper .grid__col--one-fourth,
    .config__wrapper .grid__col--three-fourth {
        margin-right: 0;
        width: 100%;
    }

    .config__wrapper .grid__col--one-fourth {
        padding-bottom: 8px;
    }
}

@media screen and (max-width: 860px) {
    .config__wrapper {
        left: 5%;
        margin-left: 0;
        width: 90%;
    }
}

.wrapper--hidden {
    display: none;
}

.wrapper--closed {
    height: 71px;
}

.wrapper--open {
    height: auto;
}

.wrapper--open.has-message {
    height: auto;
}

.config__row--top,
.config__row--bottom {
    text-align: center;
    padding: 15px 38px;
    position: relative;
}

.config__row--top:before,
.config__row--bottom:before {
    background-color: rgba(177, 177, 0, 0.25);
    border-radius: 50%;
    bottom: 0;
    box-shadow: 5px 2px 10px rgba(255, 255, 255, 0.3);
    clip: rect(20px, auto, 50px, 0);
    content: "";
    height: 20px;
    left: 0;
    position: absolute;
    right: 0;
}

@media screen and (max-width: 750px) {
    .config__row--top,
    .config__row--bottom {
        padding: 15px 15px;
    }
}

.config__row--bottom::after {
    clear: both;
    content: "";
    display: table;
}

.config__row--bottom:before {
    bottom: 20px;
}

.btn__config {
    background-image: url(/build/images/circle-up.56377005.svg);
    background-position: right 30px center;
    background-repeat: no-repeat;
    font-size: 1em;
    font-weight: 700;
    padding-left: 45px;
    padding-right: 68px;
    position: relative;
    text-transform: uppercase;
    color: white;
}

.btn__config:before {
    background: url(/build/images/can-in-hand.b3ab02ea.png) no-repeat center top;
    background-size: 100% auto;
    bottom: -17px;
    content: "";
    left: -30px;
    position: absolute;
    height: 80px;
    width: 62px;
}

.btn__config--open {
    background-image: url(/build/images/circle-down.f837ebe8.svg);
}

.config__message {
    background: url(/build/images/checkmark-icon-white.875300a0.svg) no-repeat left center;
    display: inline-block;
    color: #b0b0b0;
    font-size: 0.875em;
    margin-bottom: 15px;
    padding-left: 30px;
}

.cssanimations .config__message {
    opacity: 0;
    margin: 15px 0 25px 0;
    animation: fadeIn ease 500ms forwards;
}

.config__message.success {
    background: #061729 url(/build/images/checkmark-icon-white.875300a0.svg) no-repeat 10px center;
    padding: 10px;
    padding-left: 35px;
    color: white;
}

.config__message.error {
    background: #cd5e5e url(/build/images/checkmark-icon-white.875300a0.svg) no-repeat 10px center;
    padding: 10px;
    padding-left: 35px;
    color: white;
}

.config__product-name {
    color: #fff;
}

.faq,
.general-conditions {
    margin: 30px 0;
}

.faq__category,
.general-conditions__category {
    margin: 0;
    padding: 0;
    list-style: none;
    margin-bottom: 60px;
    border-left: 5px solid rgba(255, 255, 255, 0.1);
    padding-left: 23.07692px;
    padding-top: 30px;
}

.faq__item,
.general-conditions__item {
    margin: 1 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    padding-bottom: 7.5px;
    margin-bottom: 30px;
}

.faq__item:first-child,
.general-conditions__item:first-child {
    margin-top: 0;
}

.faq__item:last-child,
.general-conditions__item:last-child {
    margin-bottom: 0;
    border-bottom: none;
}

.faq__item p,
.general-conditions__item p {
    max-width: 900px;
}

.faq__item h3,
.general-conditions__item h3 {
    margin-bottom: 0;
    font-weight: 300;
}

.faq__item p:first-child,
.general-conditions__item p:first-child {
    margin-top: 0;
}

.faq__title,
.general-conditions__title {
    padding-bottom: 0;
    margin-bottom: 0.25em;
}

.faq__category-overview,
.general-conditions__category-overview {
    margin: 0;
    padding: 0;
    background: rgba(255, 255, 255, 0.1);
}

.faq__category-overview a,
.general-conditions__category-overview a {
    color: white;
    text-decoration: none;
    padding: 1em 2em;
    display: block;
    text-decoration: underline;
    font-weight: bold;
}

.faq__category-overview a:hover,
.general-conditions__category-overview a:hover {
    background: #f36279;
}

.faq__category-overview li,
.general-conditions__category-overview li {
    list-style: none;
    display: inline-block;
    border-right: 1px solid rgba(255, 255, 255, 0.1);
    float: left;
}

@media (max-width: 860px) {
    .faq__category-overview li,
    .general-conditions__category-overview li {
        float: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        border-right: none;
        display: block;
        text-align: center;
    }
}

.faq__category-overview li:last-child,
.general-conditions__category-overview li:last-child {
    border-right: none;
    border-bottom: none;
}

@media (min-width: 750px) {
    .filter-container {
        min-width: 220px;
        padding-right: 14px;
    }
}

.filters {
    background-color: #152b3e;
    margin-right: 4px;
    display: flex;
    flex-direction: column;
}

.filters .category {
    font-size: 1.125em;
    margin: 18px 0 8px 12px;
    padding: 0;
}

.filters .category > span {
    border-bottom: 1px solid #8dc8e8;
}

.filters ul {
    list-style: none;
    padding: 0;
    margin: 0 12px 6px 12px;
}

.filters li {
    display: flex;
    align-items: center;
    padding-left: 20px;
    margin-bottom: 4px;
}

.filters li label {
    cursor: pointer;
    user-select: none;
}

.filters h3 {
    margin: 8px 12px;
}

@media (max-width: 750px) {
    .filters {
        position: fixed;
        height: calc(100% - 85px);
        top: 85px;
        z-index: 10;
        transition: all 0.3s ease;
        width: 100%;
        left: -280px;
        max-width: 280px;
    }

    .filters.is-open {
        left: 0;
    }
}

.filter-icon:before {
    content: "";
    background: url(/build/images/filters.4d313df3.svg) no-repeat right center;
    width: 17px;
    display: inline-block;
    height: 16px;
    background-size: contain;
}

.backdrop {
    z-index: 3;
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: #0000006b;
    top: 0;
    left: 0;
}

.product-controls {
    float: right;
    margin-bottom: 13px;
    margin-right: 4px;
}

.product-controls .btn {
    cursor: pointer;
}

.close-filters {
    flex-grow: 1;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    margin-bottom: 24px;
}

@keyframes rotating {
    100% {
        transform: rotate(360deg);
    }
}

.img-wrapper img {
    z-index: 2;
    position: relative;
}

.img-wrapper.loading {
    position: relative;
}

.img-wrapper.loading:after {
    animation: rotating 0.8s linear infinite;
    display: block;
    margin: auto;
    width: 32px;
    height: 32px;
    content: "";
    z-index: 1;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    opacity: 0.5;
}

.contact-page h1 {
    margin-bottom: 17.64706px;
}

.contact-page__wrapper {
    flex-direction: row;
    padding-bottom: 60px;
}

@media (max-width: 768px) {
    .contact-page__wrapper {
        flex-direction: column;
    }
}

.contact-page__information {
    padding: 42px 90px;
    padding-right: 0;
}

@media (max-width: 960px) {
    .contact-page__information {
        padding-left: 0;
    }
}

.contact-page__information p {
    margin-bottom: 20px;
}

.contact-page__information p:first-of-type {
    margin-top: 0;
}

.contact-page__information p:last-child {
    margin-bottom: 0;
}

.contact-page__information h3 {
    margin-bottom: 0px;
    font-weight: bold;
}

.contact-page__information h4 {
    margin-bottom: 0;
    margin-top: 60px;
}

.contact-page p {
    max-width: 600px;
}

.contact-page form {
    max-width: 800px;
    width: 60%;
    background-color: #152b3e;
    padding: 30px;
    flex-grow: 1;
}

@media (max-width: 960px) {
    .contact-page form {
        width: 100%;
    }
}

.contact-page form label {
    font-weight: bold;
    margin-bottom: 4px;
    display: block;
}

.contact-page input[type="text"],
.contact-page input[type="email"],
.contact-page textarea {
    width: 100%;
    background: rgba(255, 255, 255, 0.95);
}

.contact-page textarea {
    min-height: 150px;
}

.contact-page .form__item {
    margin-bottom: 20px;
}

.contact-page .form-group {
    margin-bottom: 10px;
}

.contact-page .form__label {
    text-align: left;
    width: auto;
}

.contact-page .select-wrapper {
    width: 100%;
}

.contact-page .form__input-wrapper {
    width: 100%;
    max-width: inherit;
}

.contact-popup {
    text-align: center;
}

.contact-popup h3 {
    color: #f36279;
    font-weight: bold;
    font-size: 1.4em;
    margin-bottom: 30px;
}

.contact-popup .modal__actions a {
    color: #f36279;
    text-decoration: none;
    font-weight: bold;
    margin-right: 30px;
    font-size: 0.9em;
}

.contact-popup .modal__actions a:hover {
    border-bottom: 1px solid;
}

.contact-popup .modal__actions a:last-child {
    margin-right: 0;
    color: #949494;
}

/*
Author: @gijsroge
Description: Pure CSS styled select elements that use pseudo elements to make it visually consistent in all modern browsers. Looks good in: Firefox, Chrome, Safari, IE10+. Other browsers will have multiple down arrows for example. But this is only visual stuff, everything still works as expected of course.
*/
/*******************************
         demo styles
*******************************/
*,
*:after,
*:before {
    box-sizing: border-box;
}

.position-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
}

.position-center .select-wrapper {
    margin: 0 20px;
}

/*******************************
        Styles to copy
*******************************/
/*
* Basic resets for select element
*/
.select-wrapper {
    min-width: 200px;
}

.select-wrapper select {
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    appearance: none;
    border: none;
    outline: none;
    border-radius: 0;
    /*IOS*/
}

.select-wrapper select::-ms-expand {
    display: none;
    /*IE10*/
}

/*
* Global styles
*/
.select-wrapper {
    display: inline-block;
    position: relative;
}

.select-wrapper:after {
    content: "";
    position: absolute;
    height: 100%;
    right: 0;
    top: 0;
    pointer-events: none;
    background-position: left center;
}

.select-wrapper:before {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    line-height: 1;
    pointer-events: none;
    text-align: center;
    z-index: 2;
}

/*******************************
          Dark theme
*******************************/
.select--dark {
    /*
   * Customize options
   */
    /*
   * Hover styles
   */
    /*
   * Select element
   */
}

.select--dark:after,
.select--dark select {
    color: white;
    background-color: #323232;
    transition: 100ms all cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.select--dark:after {
    width: 35px;
    border: 1px solid rgba(243, 98, 121, 0.4);
    border-radius: 0 0px 0px 0;
    border-left: 0;
}

.select--dark:before {
    color: white;
    right: 20px;
    content: "▾";
}

.select--dark:hover:after,
.select--dark:hover select {
    background-color: #191919;
}

.select--dark select {
    padding: 10px 20px;
    padding-right: 35px;
    border: 1px solid rgba(243, 98, 121, 0.4);
    border-radius: 0px;
    color: white;
}

/*******************************
          White theme
*******************************/
.select--white {
    /*
   * Customize options
   */
    /*
   * Hover styles
   */
    /*
   * Select element
   */
}

.select--white:after,
.select--white select {
    color: black;
    background-color: #fff;
    transition: 100ms all cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.select--white:after {
    width: 35px;
    border: 1px solid #000;
    border-radius: 0 0 0 0;
    border-left: 0;
}

.select--white:before {
    color: black;
    right: 20px;
    content: "▾";
}

.select--white:hover:after,
.select--white:hover select {
    background-color: #e6e6e6;
}

.select--white select {
    padding: 10px 20px;
    padding-right: 35px;
    border: 1px solid #000;
    border-radius: 0;
    color: black;
}

/**
 * @file
 * Theming for checkout
 *
 * @author Senne Torfs <senne.torfs@intracto.com>
 */
.checkout__form--cart {
    margin-top: -38px;
    margin-bottom: 60px;
}

.checkout__form-wrapper .form-error {
    background: #cd5e5e;
    color: white;
    text-align: center;
    display: inline-block;
    padding: 5px 15px;
    margin-top: 8px;
}

@media (max-width: 960px) {
    .checkout__form-wrapper .form__group {
        padding: 0;
    }

    .checkout__form-wrapper .form__label {
        text-align: left;
    }
}

@media (max-width: 600px) {
    .checkout__form-wrapper .form__group--grey {
        padding: 0;
    }
}

.checkout__form-wrapper fieldset {
    width: 60%;
}

@media (max-width: 900px) {
    .checkout__form-wrapper fieldset {
        width: 100%;
    }
}

.checkout__form-wrapper input[type="text"],
.checkout__form-wrapper input[type="email"],
.checkout__form-wrapper textarea {
    width: 100%;
    background: rgba(255, 255, 255, 0.95);
}

@media (max-width: 600px) {
    .checkout__form-wrapper input[type="text"],
    .checkout__form-wrapper input[type="email"],
    .checkout__form-wrapper textarea {
        width: 100%;
    }
}

.checkout__form-wrapper .form__input-wrapper {
    width: 100%;
}

.checkout__table {
    width: 100%;
    margin-bottom: 12px;
}

.checkout__table .cart__quantity {
    border-top: 1px solid #8dc8e8;
    border-bottom: 1px solid #8dc8e8;
    height: 39px;
}

.table__head {
    border-bottom: 8px solid #061729;
    text-align: left;
}

.table__head th {
    font-size: 0.875em;
    padding: 0 15px;
}

.table__head.table__head--no-right th {
    padding-right: 0;
    padding-bottom: 8px;
}

.table__head .cell--product {
    padding-left: 45px;
}

@media screen and (max-width: 960px) {
    .table__head .cell--product {
        padding-left: 15px;
    }
}

.cell-product__gift-wrap {
    margin-bottom: 7px;
    margin-top: 7px;
    display: flex;
    align-items: center;
}

.cell-product__gift-wrap:last-child {
    margin-bottom: 0;
}

.cell-product__gift-wrap.package {
    margin-top: 20px;
}

.cell-product__gift-wrap img {
    max-width: 100px;
    margin-left: 10px;
}

@media (max-width: 750px) {
    .cell-product__gift-wrap img {
        display: none;
    }
}

.cell-product__gift-wrap select {
    padding-top: 5px;
    padding-bottom: 5px;
}

.cell-product__gift-wrap .select--dark {
    max-width: 340px;
}

.cell-product__gift-wrap .select--dark select {
    border: 3px solid #f36279;
    border-radius: 5px;
}

.cell-product__gift-wrap .select--dark:after {
    border: 3px solid #f36279;
    border-left: none;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

@media (max-width: 360px) {
    .cell-product__gift-wrap {
        max-width: 100%;
    }
}

.table__body {
    background: #152b3e;
}

.table__body tr.bottom-border {
    border-bottom: 8px solid #061729;
}

@media screen and (max-width: 750px) {
    .checkout__table,
    .table__body {
        display: block;
    }

    .checkout__table::after,
    .table__body::after {
        clear: both;
        content: "";
        display: table;
    }

    .table__head {
        display: none;
    }

    .table__body tr {
        float: left;
        display: block;
        padding-right: 38px;
        position: relative;
        width: 100%;
    }
}

.table__cell {
    padding: 8px;
    text-align: left;
}

.table__cell.empty-cart {
    text-align: center;
}

@media screen and (max-width: 750px) {
    .table__cell {
        display: block;
        float: left;
    }
}

.head__cell--product {
    width: 60%;
}

.head__cell--product-final {
    width: 65%;
}

@media screen and (max-width: 750px) {
    .head__cell--product {
        width: auto;
    }
}

.head__cell--price {
    width: 11%;
}

.head__cell--price-final {
    width: 14%;
}

.head__cell--amount {
    width: 12%;
}

.head__cell--amount-final {
    width: 7%;
}

.head__cell--total {
    width: 12%;
}

.head__cell--total-final {
    width: 14%;
}

.head__cell--empty {
    width: 5%;
}

.cell--image,
.cell--span {
    padding: 30px 15px 30px 45px;
}

@media screen and (max-width: 960px) {
    .cell--image,
    .cell--span {
        padding: 15px;
    }
}

@media screen and (max-width: 750px) {
    .cell--image,
    .cell--span {
        padding: 8px;
    }
}

.cell--image-final img {
    display: block;
    margin: 0 auto;
}

.cell--image {
    width: 80px;
    padding-left: 0;
    vertical-align: top;
    padding-top: 15px;
}

.cell--image img {
    display: block;
    margin-left: 10px;
}

@media screen and (max-width: 750px) {
    .cell--image {
        width: 25%;
    }

    .cell--image img {
        margin: 0 auto;
    }

    .cell--image-final {
        max-width: 60px;
    }
}

.cell--image-final {
    width: 80px;
}

.cell--product,
.cell--span {
    padding-right: 30px;
}

.cell--product {
    width: 50%;
}

.cell--product a {
    text-decoration: none;
    color: white;
    font-weight: bold;
}

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

@media screen and (max-width: 750px) {
    .cell--product {
        width: 75%;
    }

    .cell--product--final {
        padding-right: 8px;
        width: 60%;
    }
}

@media screen and (max-width: 750px) {
    .cell--package {
        padding-right: 8px;
        width: 75%;
    }
}

@media screen and (max-width: 750px) {
    .cell--span {
        width: 100%;
    }
}

@media screen and (max-width: 750px) {
    .cell--total {
        display: none;
    }
}

.cell--amount {
    padding-left: 0;
    padding-right: 0;
}

.cell--amount-final {
    background: url(/build/images/close-icon-cross.48f42993.svg) no-repeat right 4px center;
    background-size: 11px;
    padding-right: 20px;
    text-align: right;
    vertical-align: middle;
}

@media screen and (max-width: 750px) {
    .cell--amount-final {
        position: absolute;
        left: 0;
        top: 4px;
    }
}

@media screen and (max-width: 750px) {
    .cell--remove {
        position: absolute;
        right: 4px;
        padding: 0;
        top: 50%;
        margin-top: -15px;
    }
}

.product__title--cell {
    font-size: 1.25em;
    margin-bottom: 0;
}

@media screen and (max-width: 460px) {
    .product__title--cell {
        font-size: 1.125em;
        margin-bottom: 4px;
    }
}

@media screen and (max-width: 360px) {
    .product__title--cell {
        font-size: 1em;
        margin-bottom: 0;
    }
}

.product__description--cell {
    color: #8dc8e8;
    font-size: 0.875em;
    margin-bottom: 0;
}

.cell--bg {
    background: #152b3e;
    display: inline-block;
    padding: 8px 15px;
}

.checkout__btn--delete {
    background: url(/build/images/close-icon-cross.48f42993.svg) no-repeat center center;
    display: block;
    height: 30px;
    opacity: 0.4;
    overflow: hidden;
    text-decoration: none;
    transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
    width: 30px;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
    z-index: 10;
}

.checkout__btn--delete::before {
    content: "";
    display: block;
    height: 100%;
    width: 0;
}

.checkout__btn--delete:hover {
    opacity: 1;
}

.checkout__coupon-wrapper {
    background: #152b3e;
    margin-left: 20px;
    margin-right: 20px;
    padding: 30px;
    text-align: center;
    position: relative;
}

.checkout__coupon-wrapper:before,
.checkout__coupon-wrapper:after {
    background: url(/build/images/border.4908446c.svg) repeat-y left top;
    background-size: 16px 20px;
    content: "";
    display: block;
    height: 100%;
    position: absolute;
    top: 0;
    width: 20px;
}

.checkout__coupon-wrapper:before {
    left: 100%;
}

.checkout__coupon-wrapper:after {
    left: -20px;
    transform: rotate(180deg);
}

@media (max-width: 750px) {
    .checkout__coupon-wrapper .flex {
        flex-wrap: wrap;
    }

    .checkout__coupon-wrapper a {
        width: 100%;
        text-align: center;
        padding: 10px;
    }
}

.checkout__coupon-wrapper input[type="text"] {
    margin-right: 15px;
}

@media (max-width: 750px) {
    .checkout__coupon-wrapper input[type="text"] {
        margin-right: 0;
        margin-bottom: 7.5px;
    }
}

.checkout__coupon-wrapper .form-group {
    margin-bottom: 8px;
}

.checkout__coupon-wrapper .control-label {
    display: none;
}

@media screen and (max-width: 860px) {
    .checkout__coupon-wrapper {
        margin-left: 0;
        margin-right: 0;
        width: 100%;
    }
}

@media screen and (max-width: 600px) {
    .checkout__coupon-wrapper {
        padding: 15px 15px;
    }
}

.coupon__title {
    font-size: 1.5em;
    font-weight: 300;
    margin-bottom: 15px;
}

@media screen and (max-width: 600px) {
    .coupon__title {
        font-size: 1.25em;
    }
}

.checkout__totals-wrapper {
    background: #152b3e;
    margin-bottom: 8px;
    padding: 15px 0;
}

.checkout__totals-wrapper.checkout--finalization {
    float: right;
    max-width: 100%;
    margin: 30px 0;
    width: 420px;
}

.totals__table {
    width: 100%;
}

.totals__table td {
    font-size: 0.875em;
    padding: 8px 15px 8px 45px;
    vertical-align: top;
}

.totals__table td:nth-of-type(2n) {
    padding: 8px 45px 8px 15px;
}

@media screen and (max-width: 600px) {
    .totals__table td {
        padding-left: 15px;
    }

    .totals__table td:nth-of-type(2n) {
        padding-right: 15px;
    }
}

.table--border-top {
    border-top: 8px solid #061729;
    margin-top: 8px;
}

.table--border-top td,
.table--border-top td:nth-of-type(2n) {
    padding-top: 15px;
}

.totals__label--big {
    font-size: 1.42857em;
}

.totals__list {
    float: right;
    list-style: none;
    margin: 0;
    padding: 0;
}

.totals__value--big {
    color: #8dc8e8;
    font-size: 1.42857em;
    font-weight: 700;
}

.totals__description {
    clear: left;
    color: #b0b0b0;
    display: block;
    font-size: 0.85714em;
}

.totals__message {
    background-color: rgba(0, 0, 0, 0.25);
    display: inline-block;
    font-size: 0.875em;
    float: right;
    clear: both;
    margin: 0 0 30px;
    padding: 8px 15px;
    position: relative;
}

.totals__message strong {
    color: #8dc8e8;
}

@media screen and (max-width: 600px) {
    .totals__message {
        width: 100%;
    }
}

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

.checkout__actions {
    clear: both;
    text-align: right;
}

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

.checkout__actions a {
    display: inline-block;
    margin-right: 30px;
}

.checkout__actions a:last-of-type {
    margin-right: 0;
}

.checkout__actions a.align-center {
    margin: 0 auto;
}

@media screen and (max-width: 460px) {
    .checkout__actions {
        text-align: center;
    }

    .checkout__actions a {
        margin: 8px;
    }
}

/**
 * Wrapper for coupon block and totals block on checkout.
 */
.checkout__col--left {
    float: left;
    display: block;
    margin-right: 14.59002%;
    width: 46.52466%;
}

.checkout__col--left:last-child {
    margin-right: 0;
}

.checkout__col--left .form-control {
    max-width: 100%;
}

@media screen and (max-width: 960px) {
    .checkout__col--left {
        float: left;
        display: block;
        margin-right: 6.79902%;
        width: 50.16046%;
    }

    .checkout__col--left:last-child {
        margin-right: 0;
    }
}

@media screen and (max-width: 860px) {
    .checkout__col--left {
        margin-right: 0;
        margin-bottom: 15px;
        padding: 0 15px;
        width: 100%;
    }

    .checkout__col--left .grid__col--one-third {
        float: left;
        display: block;
        margin-right: 3.28774%;
        width: 22.53419%;
        margin-bottom: 0;
    }

    .checkout__col--left .grid__col--one-third:last-child {
        margin-right: 0;
    }

    .checkout__col--left .grid__col--two-third {
        float: left;
        display: block;
        margin-right: 3.28774%;
        width: 74.17806%;
        margin-bottom: 0;
    }

    .checkout__col--left .grid__col--two-third:last-child {
        margin-right: 0;
    }
}

@media screen and (max-width: 600px) {
    .checkout__col--left .grid__col--one-third {
        float: left;
        display: block;
        margin-right: 3.28774%;
        width: 39.74882%;
    }

    .checkout__col--left .grid__col--one-third:last-child {
        margin-right: 0;
    }

    .checkout__col--left .grid__col--two-third {
        float: left;
        display: block;
        margin-right: 3.28774%;
        width: 56.96344%;
    }

    .checkout__col--left .grid__col--two-third:last-child {
        margin-right: 0;
    }
}

@media screen and (max-width: 460px) {
    .checkout__col--left .grid__col--one-third {
        display: none;
    }

    .checkout__col--left .grid__col--two-third {
        width: 100%;
    }

    .checkout__col--left .form-control {
        width: 100%;
    }
}

.checkout__col--right {
    float: left;
    display: block;
    margin-right: 14.59002%;
    width: 38.88532%;
}

.checkout__col--right:last-child {
    margin-right: 0;
}

@media screen and (max-width: 960px) {
    .checkout__col--right {
        float: left;
        display: block;
        margin-right: 6.79902%;
        width: 43.04052%;
    }

    .checkout__col--right:last-child {
        margin-right: 0;
    }
}

@media screen and (max-width: 860px) {
    .checkout__col--right {
        margin-right: 0;
        width: 100%;
    }
}

/**
 * Checkout login
 */
.checkout__col--half {
    float: left;
    display: block;
    margin-right: 14.59002%;
    width: 42.70499%;
}

.checkout__col--half:last-child {
    margin-right: 0;
}

@media screen and (max-width: 600px) {
    .checkout__col--half {
        margin-right: 0;
        padding: 30px 15px;
        width: 100%;
    }

    .checkout__col--half:first-of-type {
        border-bottom: 1px solid #07497d;
    }
}

.checkout__block--right {
    float: right;
}

@media screen and (max-width: 860px) {
    .checkout__block--right {
        float: none;
    }
}

@media screen and (max-width: 600px) {
    .checkout__block--right {
        width: 100%;
    }
}

.login__form {
    margin-bottom: 30px;
}

@media screen and (max-width: 600px) {
    .login__form {
        margin-bottom: 0;
    }
}

/**
 * Checkout form
 */
.address__list {
    font-size: 0.875em;
    font-style: normal;
    list-style: none;
    margin: 0;
    padding: 0;
}

.address__list li {
    margin-bottom: 4px;
}

.checkout__sidebar-block {
    background: #152b3e;
    padding: 15px;
    margin-bottom: 30px;
}

.sidebar__title {
    margin-bottom: 15px;
}

@media screen and (max-width: 1100px) {
    .checkout__row {
        display: flex;
        flex-direction: column-reverse;
    }

    .checkout__row .grid__col--three-fourth {
        width: 100%;
    }

    .checkout__row .grid__col--one-fourth {
        width: 100%;
    }
}

@media screen and (max-width: 750px) {
    .checkout__table--final .table__body tr {
        padding-right: 0;
        padding-left: 45px;
    }
}

.checkout-summary .alert-box {
    margin-bottom: 60px;
}

.checkout__summary {
    width: 30%;
    flex-grow: 1;
    padding-left: 20px;
}

@media (max-width: 1100px) {
    .checkout__summary {
        width: 100%;
        padding: 0;
    }
}

.checkout__summary .product__title--cell,
.checkout__summary .product__price {
    font-size: 1em;
}

.checkout__summary tfoot td {
    padding: 8px 10px;
    vertical-align: top;
}

@media (max-width: 900px) {
    .checkout__summary {
        width: 100%;
    }
}

.checkout__summary table {
    width: 100%;
}

@media (max-width: 1100px) {
    .checkout__form-wrapper {
        flex-direction: column;
    }
}

.checkout__thank-you .page__heading-wrapper {
    padding-left: 0;
    padding-right: 0;
}

.thank-you__steps {
    margin: 0;
    padding: 0;
    list-style: none;
    padding-right: 30px;
    width: 60%;
}

@media (max-width: 960px) {
    .thank-you__steps {
        width: 100%;
        padding-right: 0;
    }
}

.thank-you__steps li {
    background: #152b3e;
    padding: 20px 30px;
    margin-bottom: 15px;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.thank-you__steps img {
    width: 100%;
}

.thank-you__steps h3 {
    font-weight: bold;
    margin-bottom: 7px;
}

.thank-you__steps p {
    margin-bottom: 0;
}

.thank-you__steps .step__icon {
    width: 60px;
    max-width: 60px;
    flex-shrink: 0;
    flex-grow: 1;
}

.thank-you__steps .step__information {
    padding-left: 30px;
}

.thank-you__order {
    flex-grow: 1;
    width: 40%;
}

@media (max-width: 960px) {
    .thank-you__order {
        width: 100%;
    }
}

.thank-you__order--inner {
    background-color: #152b3e;
    padding: 15px;
}

.thank-you__order h3 {
    font-weight: bold;
}

.thank-you__order .order__row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 15px;
}

.thank-you__order .order__row:last-child {
    margin-bottom: 0;
}

.thank-you__order .order__row h3 {
    margin-bottom: 0;
}

.thank-you__order .order__row h3 span {
    font-weight: normal;
    font-size: 0.7em;
    color: #f36279;
}

.thank-you__order .order__row.total {
    padding-top: 10px;
}

@media (max-width: 960px) {
    .thank-you__container {
        flex-direction: column;
    }
}

.checkout__summary--inner {
    background: #152b3e;
    padding: 10px 0;
}

.checkout__summary--inner .table__body {
    background: none;
}

.checkout__summary--inner tr {
    padding-right: 10px;
}

.checkout-payments__proceed {
    display: none;
}

.checked .checkout-payments__proceed {
    display: inline-block;
}

.checkout-payments__container {
    flex-wrap: wrap;
}

.sylius-business-trigger {
    display: flex;
}

.page-title-wrapper {
    width: 50%;
    float: left;
    margin-right: 0;
}

@media (max-width: 960px) {
    .page-title-wrapper {
        width: 100%;
    }
}

@media (max-width: 750px) {
    .page-title-wrapper.grid__col--one-third {
        margin-bottom: 0;
        padding: 0 1rem;
    }
}

.page-title-wrapper .page__heading--cart {
    white-space: nowrap;
}

.page-title-wrapper-overview h1 {
    display: flex;
    justify-content: space-between;
}

@media (max-width: 960px) {
    .page-title-wrapper-overview h1 {
        flex-direction: column;
    }
}

.cta-wrapper {
    width: auto;
    float: right;
    margin-right: 0;
}

@media (max-width: 960px) {
    .cta-wrapper {
        width: 100%;
    }
}

.page__heading-wrapper--gradient {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

@media (max-width: 960px) {
    .page__heading-wrapper--gradient {
        display: block;
    }
}

.page__heading-cta {
    width: 90%;
    text-align: left;
}

@media (max-width: 960px) {
    .page__heading-cta {
        width: 100%;
    }
}

.cell--image a.product__personalised-image {
    background: #061729a3;
    margin-left: 4px;
    color: white;
    text-decoration: none;
    font-weight: bold;
    font-size: 0.8em;
    width: 100%;
    display: block;
    text-align: center;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}

.cell--image a.product__personalised-image:hover {
    background: #f36279;
}

.cell--image a.product__personalised-image img {
    display: block;
    width: 100%;
}

@media (max-width: 468px) {
    .cell--image a.product__personalised-image img {
        margin-bottom: 0;
    }
}

.cell--image a.product__personalised-image img.circle-design {
    border-radius: 50%;
    object-fit: cover;
    width: 115px;
    height: 115px;
}

.cell--image a.product__personalised-image span {
    display: block;
    padding: 3px 10px;
}

@media (max-width: 468px) {
    .cell--image a.product__personalised-image span {
        display: none;
    }
}

.checkout-summary .cell--product .product__personalised-image,
.checkout-finalise .cell--product .product__personalised-image {
    display: none;
}

.shipping-method__address {
    margin-left: 26px;
    margin-top: 0.5em;
    padding: 10px;
    border: 1px solid #8dc8e8;
    display: inline-block;
}

.checkoutstep__wrapper {
    width: 100%;
}

@media (max-width: 700px) {
    .checkoutstep__wrapper {
        display: none;
    }
}

@media (max-width: 960px) {
    .checkoutstep__wrapper {
        float: right;
        margin-top: 35px;
    }
}

.checkoutstep__wrapper .checkout-steps {
    list-style-type: none;
    background-color: #152b3e;
    padding: 0;
    margin: 12px 0 0 0;
    text-align: center;
    text-transform: uppercase;
}

.checkoutstep__wrapper .checkout-steps__item {
    width: 20%;
    vertical-align: middle;
    margin: 0;
    color: #898989;
    position: relative;
    font-size: 14px;
    pointer-events: none;
}

@media (max-width: 800px) {
    .checkoutstep__wrapper .checkout-steps__item {
        font-size: 12px;
    }
}

.checkoutstep__wrapper .checkout-steps__item.hover-possible {
    pointer-events: auto;
}

.checkoutstep__wrapper .checkout-steps__item.active,
.checkoutstep__wrapper .checkout-steps__item.hover-possible:hover {
    font-weight: normal;
    pointer-events: auto;
    background-color: #152b3e;
    color: white;
}

.checkoutstep__wrapper .checkout-steps__item.active a,
.checkoutstep__wrapper .checkout-steps__item.hover-possible:hover a {
    border-right: none;
}

.checkoutstep__wrapper .checkout-steps__item.active a:before,
.checkoutstep__wrapper .checkout-steps__item.hover-possible:hover a:before {
    border-left-color: #152b3e !important;
}

.checkoutstep__wrapper .checkout-steps__item.active a .step-number,
.checkoutstep__wrapper
.checkout-steps__item.hover-possible:hover
a
.step-number {
    color: #8c8c8c;
}

.checkoutstep__wrapper .checkout-steps__item.active a:hover:before,
.checkoutstep__wrapper
.checkout-steps__item.hover-possible:hover
a:hover:before {
    margin-right: 10px;
    border-left-color: #152b3e !important;
}

.checkoutstep__wrapper .checkout-steps__item.active a:hover .step-number,
.checkoutstep__wrapper
.checkout-steps__item.hover-possible:hover
a:hover
.step-number {
    color: #8c8c8c;
}

.checkoutstep__wrapper .checkout-steps__item:not(:last-child) a:after,
.checkoutstep__wrapper .checkout-steps__item:not(:last-child) a:before {
    content: " ";
    display: block;
    width: 0;
    height: 0;
    border-top: 75px solid transparent;
    /* Go big on the size, and let overflow hide */
    border-bottom: 75px solid transparent;
    top: 50%;
    transform: translateY(-50%);
    left: 100%;
}

.checkoutstep__wrapper .checkout-steps__item:not(:last-child) a:after {
    border-left: 50px solid #061729;
    position: absolute;
    z-index: 2;
}

.checkoutstep__wrapper .checkout-steps__item:not(:last-child) a:before {
    border-left: 50px solid #152b3e;
    position: absolute;
    margin-left: -10px;
    z-index: 3;
}

.checkoutstep__wrapper .checkout-steps__item:first-child a {
    padding-left: 15px;
}

.checkoutstep__wrapper .checkout-steps__item:last-child a {
    padding-right: 0;
}

.checkoutstep__wrapper .checkout-steps__item-link {
    display: block;
    padding: 10px 0;
    padding-left: 65px;
    color: inherit;
}

.checkoutstep__wrapper .checkout-steps__item-link .step-number {
    color: white;
    margin-right: 10px;
}

.checkoutstep__wrapper .checkout-steps__item-link div {
    position: relative;
    z-index: 4;
}

.checkoutstep__wrapper .checkout-steps__item-link[href] {
    text-decoration: none;
    text-align: left;
}

.term-check-container {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-bottom: 8px;
}

.term-check-container input {
    margin-right: 6px;
}

.payment-btn:disabled {
    background-color: #f362791f;
}

.checkout-payments {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.checkout-payments__item {
    width: 50%;
    width: calc(50% - 1rem);
    margin-right: 1rem;
    background-color: rgba(255, 255, 255, 0.07);
    border: 1px solid transparent;
    padding: 1rem 1rem 1rem 2rem;
    font-weight: 400;
    margin-bottom: 7px;
    transition: all ease 350ms;
    align-items: center;
    height: 77px;
}

.checkout-payments__item .custom-radio {
    width: 60%;
    position: relative;
    padding-left: 25px;
}

.checkout-payments__item .custom-radio label {
    display: inline-block;
}

.checkout-payments__item .custom-radio label:before {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}

@media (max-width: 960px) {
    .checkout-payments__item {
        height: auto;
    }
}

.checkout-payments__item:hover {
    border-color: rgba(255, 255, 255, 0.4);
}

@media (max-width: 960px) {
    .checkout-payments__item {
        width: 100%;
        margin-right: 0;
        padding: 1.3rem;
    }
}

@media (max-width: 750px) {
    .checkout-payments__item.checked {
        flex-wrap: wrap;
    }
}

.checkout-payments__item.checked .checkout-proceed {
    display: block;
}

.checkout-payments__input,
.checkout-payments__image {
    margin-right: 1rem;
}

.checkout-payments__image {
    width: auto;
    vertical-align: middle;
    height: auto;
    z-index: -1;
    position: relative;
}

@media (max-width: 750px) {
    .checkout-payments__proceed {
        margin: 0;
        margin-top: 15px;
        width: 100%;
    }
}

/**
 * @file
 * Theming for _spinner
 *
 * @author Senne Torfs <senne.torfs@intracto.com>
 */
.spinner__wrapper {
    display: inline-block;
}

.table__cell .spinner__wrapper {
    display: flex;
    flex-wrap: nowrap;
    background: transparent;
}

.spinner__wrapper input {
    border: none;
    padding-top: 9px;
    height: 37px;
    -moz-appearance: textfield;
}

.spinner__wrapper input::-webkit-outer-spin-button,
.spinner__wrapper input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.btn__spinner {
    background: #8dc8e8;
    border: none;
    color: #193865;
    display: inline-block;
    font-weight: 700;
    padding: 8px 8px 8px -1px;
    height: 39px;
}

@media (max-width: 960px) {
    .btn__spinner {
        padding: 8px 15px 8px 15px;
    }
}

.btn__spinner:focus {
    outline: none;
}

.spinner {
    width: 40px;
    height: 40px;
    margin: 100px auto;
    background-color: white;
    border-radius: 100%;
}

.cssanimations .spinner {
    text-indent: -50000px;
    animation: sk-scaleout 1s infinite ease-in-out;
}

@keyframes sk-scaleout {
    0% {
        transform: scale(0);
    }
    100% {
        transform: scale(1);
        opacity: 0;
    }
}

/**
 * @file
 * Theming for _page-part
 *
 * @author Senne Torfs <senne.torfs@intracto.com>
 */
.page-part h2 {
    border-bottom: 1px solid rgba(148, 148, 148, 0.2);
    padding-bottom: 15px;
}

.page-part h2.page-part__subtitle {
    border-bottom: none;
    padding-bottom: 0;
}

.page-part p,
.page-part ol {
    max-width: 800px;
}

.page-part p img,
.page-part ol img {
    max-width: 100%;
    height: auto !important;
}

.page-part ol {
    padding: 0;
    margin: 30px 0;
    margin-left: 15px;
}

.page-part ol li {
    margin-bottom: 10px;
}

.page-part ul {
    padding: 0;
    margin: 30px 0;
    max-width: 800px;
}

.page-part ul li {
    padding-left: 13px;
    text-indent: -15px;
    margin-bottom: 5px;
    font-size: 16px;
    line-height: 22px;
    list-style: none;
}

.page-part ul li:before {
    content: "• ";
    font-size: 15px;
    color: #fafafa;
}

.page-part ul li a {
    text-decoration: none;
}

.page-part ul li a:hover {
    border-bottom: 1px solid;
}

.page__row.page-row--intro img {
    display: block;
    margin: 0 auto;
}

.page__row.page-row--intro .page-part__container {
    margin-bottom: 0;
}

.page__row.page-row--intro .page-part__container.small {
    width: 1240px;
    margin: 0 auto;
}

@media screen and (max-width: 1300px) {
    .page__row.page-row--intro .page-part__container.small {
        max-width: 100%;
    }
}

.page__row.page-row--intro .page-part__intro {
    padding: 60px 0;
}

.page__row,
.page-part__container {
    margin: 0 0 60px 0;
}

@media screen and (max-width: 600px) {
    .page__row,
    .page-part__container {
        margin: 0 0 30px 0;
    }
}

.page-row--dark {
    background-color: #152b3e;
    padding: 60px 0;
}

.page-row--dark > h2 {
    font-size: 46px;
    font-weight: 300;
}

@media screen and (max-width: 600px) {
    .page-row--dark {
        padding: 30px 0;
    }
}

.page-part__intro p {
    color: #b0b0b0;
    font-size: 1.25em;
    font-weight: 300;
}

@media screen and (max-width: 600px) {
    .page-part__intro p {
        font-size: 1.125em;
    }
}

.page-part--full {
    margin: 0 auto 60px auto;
}

.page-part--full.page-part--dark {
    margin: 0;
}

.page-part--image-left {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.page-part--image-left::after {
    clear: both;
    content: "";
    display: table;
}

.page-part--image-left .page-part__col--left {
    float: left;
    display: block;
    margin-right: 6.79902%;
    width: 43.04052%;
}

.page-part--image-left .page-part__col--left:last-child {
    margin-right: 0;
}

.page-part--image-left .page-part__col--right {
    float: left;
    display: block;
    margin-right: 6.79902%;
    width: 50.16046%;
}

.page-part--image-left .page-part__col--right:last-child {
    margin-right: 0;
}

.page-part--image-left img {
    display: block;
    margin: 0 auto;
}

@media screen and (max-width: 960px) {
    .page-part--image-left .page-part__col--left {
        float: left;
        display: block;
        margin-right: 6.79902%;
        width: 28.80065%;
    }

    .page-part--image-left .page-part__col--left:last-child {
        margin-right: 0;
    }

    .page-part--image-left .page-part__col--right {
        float: left;
        display: block;
        margin-right: 6.79902%;
        width: 64.40033%;
    }

    .page-part--image-left .page-part__col--right:last-child {
        margin-right: 0;
    }
}

@media screen and (max-width: 600px) {
    .page-part--image-left .page-part__col--left,
    .page-part--image-left .page-part__col--right {
        margin-right: 0;
        width: 100%;
    }

    .page-part--image-left .page-part__col--left {
        margin-bottom: 15px;
    }

    .page-part--image-left img {
        max-height: 180px;
    }
}

.page-part--image-right {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.page-part--image-right::after {
    clear: both;
    content: "";
    display: table;
}

.page-part--image-right .page-part__col--left {
    float: left;
    display: block;
    margin-right: 6.79902%;
    width: 50.16046%;
}

.page-part--image-right .page-part__col--left:last-child {
    margin-right: 0;
}

.page-part--image-right .page-part__col--right {
    float: left;
    display: block;
    margin-right: 6.79902%;
    width: 43.04052%;
}

.page-part--image-right .page-part__col--right:last-child {
    margin-right: 0;
}

.page-part--image-right img {
    display: block;
    margin: 0 auto;
}

@media screen and (max-width: 960px) {
    .page-part--image-right .page-part__col--left {
        float: left;
        display: block;
        margin-right: 6.79902%;
        width: 64.40033%;
    }

    .page-part--image-right .page-part__col--left:last-child {
        margin-right: 0;
    }

    .page-part--image-right .page-part__col--right {
        float: left;
        display: block;
        margin-right: 6.79902%;
        width: 28.80065%;
    }

    .page-part--image-right .page-part__col--right:last-child {
        margin-right: 0;
    }
}

@media screen and (max-width: 600px) {
    .page-part--image-right .page-part__col--left,
    .page-part--image-right .page-part__col--right {
        margin-right: 0;
        width: 100%;
    }

    .page-part--image-right .page-part__col--left {
        margin-bottom: 15px;
    }

    .page-part--image-right img {
        max-height: 180px;
    }
}

.page-part__title {
    font-size: 2.75em;
    font-weight: 300;
    margin-bottom: 30px;
    margin-top: 0;
}

@media screen and (max-width: 960px) {
    .page-part__title {
        font-size: 2.25em;
    }
}

@media screen and (max-width: 600px) {
    .page-part__title {
        font-size: 2em;
        margin-bottom: 15px;
    }
}

.page-part__subtitle {
    font-size: 2.125em;
    font-weight: 300;
    margin-top: 0;
}

@media screen and (max-width: 960px) {
    .page-part__subtitle {
        font-size: 1.75em;
    }
}

@media screen and (max-width: 600px) {
    .page-part__subtitle {
        font-size: 1.5em;
    }
}

.content__grid-wrapper {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    display: flex;
}

.content__grid-wrapper::after {
    clear: both;
    content: "";
    display: table;
}

@media (max-width: 600px) {
    .content__grid-wrapper {
        flex-direction: column;
    }
}

.content__grid-wrapper .content__block {
    align-self: stretch;
}

.content__block {
    background: #14141478;
    border: 1px solid #07497d;
    padding: 15px 30px 30px;
}

.page__row--col-1 .content__block {
    width: 100%;
}

.page__row--col-2 .content__block {
    float: left;
    display: block;
    margin-right: 3.28774%;
    width: 48.35613%;
}

.page__row--col-2 .content__block:last-child {
    margin-right: 0;
}

.page__row--col-2 .content__block:nth-of-type(2n) {
    margin-right: 0;
}

.page__row--col-3 .content__block {
    float: left;
    display: block;
    margin-right: 3.28774%;
    width: 31.1415%;
}

.page__row--col-3 .content__block:last-child {
    margin-right: 0;
}

.page__row--col-3 .content__block:nth-of-type(3n) {
    margin-right: 0;
}

@media screen and (max-width: 960px) {
    .content__block {
        padding: 8px 15px 15px;
    }
}

@media screen and (max-width: 600px) {
    .content__block {
        margin-bottom: 8px;
    }

    .page-row--dark .content__block {
        border-top: none;
        border-left: none;
        border-right: none;
        margin-bottom: 0;
        padding: 8px 0 15px;
    }

    .page__row--col-2 .content__block {
        width: 100%;
    }

    .page__row--col-3 .content__block {
        width: 100%;
    }
}

.content__block--one-third {
    float: left;
    display: block;
    margin-right: 3.28774%;
    width: 31.1415%;
    background: #14141478;
    border: 1px solid #07497d;
    padding: 15px 30px 30px;
}

.content__block--one-third:last-child {
    margin-right: 0;
}

.content__block--half {
    float: left;
    display: block;
    margin-right: 3.28774%;
    width: 48.35613%;
    background: #14141478;
    border: 1px solid #07497d;
    padding: 15px 30px 30px;
}

.content__block--half:last-child {
    margin-right: 0;
}

.block__title {
    font-size: 1.375em;
    font-weight: 300;
    margin-bottom: 15px;
}

@media screen and (max-width: 600px) {
    .block__title {
        font-size: 1.25em;
    }
}

.block__image {
    display: block;
    width: 100%;
    margin-bottom: 15px;
}

@media screen and (max-width: 600px) {
    .block__image {
        margin-left: auto;
        margin-right: auto;
        max-height: 240px;
        width: auto;
    }
}

.block__text {
    color: #b0b0b0;
    font-size: 1em;
}

.block__text:last-child {
    margin-bottom: 0;
}

.block__text--small {
    color: #b0b0b0;
    font-size: 0.875em;
}

/**
 * @file
 * Theming for _popup
 *
 * @author Senne Torfs <senne.torfs@intracto.com>
 */
.modal__overlay {
    background: rgba(0, 0, 0, 0.8);
    display: none;
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    visibility: hidden;
    width: 100%;
    z-index: 10002;
    overflow-y: scroll;
}

.modal__overlay.modal--visible {
    display: block;
    visibility: visible;
}

.modal__overlay h3 {
    color: white;
}

.modal__content {
    background: #061729;
    position: absolute;
    left: 50%;
    margin-left: -380px;
    width: 760px;
    min-width: 320px;
    min-height: 200px;
    margin-bottom: 30px;
    padding: 30px 38px;
    top: 5vh !important;
}

.cssanimations .modal__content {
    opacity: 0;
    transform: translateY(100px);
    animation: moveIn cubic-bezier(0.13, 0.74, 0.99, 1) 350ms forwards;
}

@media screen and (max-width: 860px) {
    .modal__content {
        margin-left: 0;
        left: 5%;
        width: 90%;
    }
}

@media screen and (max-width: 600px) {
    .modal__content {
        padding: 15px;
    }
}

@media screen and (max-width: 360px) {
    .modal__content {
        min-width: initial;
        padding: 8px;
        left: 2%;
        width: 96%;
    }
}

.modal__title {
    font-size: 2.125em;
    font-weight: 300;
    margin-bottom: 30px;
}

@media screen and (max-width: 600px) {
    .modal__title {
        font-size: 1.75em;
        margin-bottom: 15px;
    }
}

@media screen and (max-width: 460px) {
    .modal__title {
        font-size: 1.5em;
    }
}

.modal__product-title {
    color: #f36279;
    font-size: 1.5em;
    font-weight: 700;
    margin-bottom: 15px;
}

.modal__subtitle {
    font-size: 1em;
    font-weight: 400;
    margin-bottom: 15px;
}

.modal__table {
    font-size: 0.875em;
    margin-bottom: 15px;
    width: 100%;
}

.modal__table th {
    background: #07497d;
    padding: 8px;
}

.modal__table tbody tr {
    border-bottom: 1px solid #07497d;
}

.modal__table td {
    padding: 8px 30px;
}

.modal__text {
    color: #949494;
    font-size: 0.9375em;
    margin-top: 0;
    margin-bottom: 15px;
}

.modal__close {
    background-image: url(/build/images/close-icon-cross.48f42993.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 38px 38px;
    height: 38px;
    overflow: hidden;
    width: 38px;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
    z-index: 10;
    background-size: auto;
    color: #fff;
    display: block;
    position: absolute;
    right: -39px;
    text-align: center;
    text-decoration: none;
    top: -1px;
    transition: background ease 250ms;
}

.modal__close::before {
    content: "";
    display: block;
    height: 100%;
    width: 0;
}

@media screen and (max-width: 860px) {
    .modal__close {
        right: -1px;
        top: -39px;
    }
}

hr {
    border: none;
    border-bottom: 1px solid #07497d;
    margin: 30px 0;
}

@media screen and (max-width: 600px) {
    hr {
        margin: 15px 0;
    }
}

.cssanimations .can__detail.scale-in {
    opacity: 0;
    transform: translateY(10px);
    animation: moveIn cubic-bezier(0.13, 0.74, 0.99, 1) 350ms forwards;
}

.table__level--two td {
    padding-left: 40px;
}

/**
 * @file
 * Theming for _spinner
 *
 * @author Senne Torfs <senne.torfs@intracto.com>
 */
.spinner__wrapper {
    display: inline-block;
}

.table__cell .spinner__wrapper {
    display: flex;
    flex-wrap: nowrap;
    background: transparent;
}

.spinner__wrapper input {
    border: none;
    padding-top: 9px;
    height: 37px;
    -moz-appearance: textfield;
}

.spinner__wrapper input::-webkit-outer-spin-button,
.spinner__wrapper input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.btn__spinner {
    background: #8dc8e8;
    border: none;
    color: #193865;
    display: inline-block;
    font-weight: 700;
    padding: 8px 8px 8px -1px;
    height: 39px;
}

@media (max-width: 960px) {
    .btn__spinner {
        padding: 8px 15px 8px 15px;
    }
}

.btn__spinner:focus {
    outline: none;
}

.spinner {
    width: 40px;
    height: 40px;
    margin: 100px auto;
    background-color: white;
    border-radius: 100%;
}

.cssanimations .spinner {
    text-indent: -50000px;
    animation: sk-scaleout 1s infinite ease-in-out;
}

@keyframes sk-scaleout {
    0% {
        transform: scale(0);
    }
    100% {
        transform: scale(1);
        opacity: 0;
    }
}

.tabs__navigation {
    padding: 0;
    list-style: none;
    margin: 30px 0;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 3em;
}

.tabs__navigation--item {
    display: inline-block;
    margin: 0 12.5px;
    background: transparent;
}

@media (max-width: 860px) {
    .tabs__navigation--item {
        width: 45%;
        margin-right: auto;
        margin-left: auto;
        margin-bottom: 10px;
        text-align: center;
    }

    .tabs__navigation--item:last-child {
        width: 95%;
    }

    .tabs__navigation--item a {
        width: 100%;
        display: block;
    }
}

@media (max-width: 460px) {
    .tabs__navigation--item {
        width: 100%;
    }

    .tabs__navigation--item:last-child {
        width: 100%;
    }
}

.tabs__navigation--item a {
    text-decoration: none;
    border: 1px solid #07497d;
    padding: 10px 20px;
    border-radius: 5px;
    transition: all ease 250ms;
    color: white;
    font-weight: bold;
    width: 100%;
    display: block;
}

.tabs__navigation--item a:hover {
    background: #07497d;
}

.tabs__navigation--item.active a {
    background: #07497d;
}

.customize .tabs__navigation--item {
    margin: 6px 12.5px 6px 0;
}

.customize .tabs__navigation--item a {
    padding: 8px 16px;
}

@media (max-width: 860px) {
    .customize .tabs__navigation--item {
        width: auto;
        margin: 6px 12.5px 6px 0;
    }

    .customize .tabs__navigation--item:last-child {
        width: auto;
    }
}

.gift-wrap__wrapper {
    position: relative;
    cursor: pointer;
}

.gift-wrap__wrapper:hover {
    text-decoration: underline;
}

.gift-wrap__wrapper:hover .gift-wrap__tooltipwrapper {
    display: block;
}

.cssanimations .gift-wrap__wrapper:hover .gift-wrap__tooltipwrapper {
    opacity: 0;
    animation: fadeIn ease 350ms forwards;
}

.gift-wrap__tooltipwrapper {
    display: none;
    position: absolute;
    margin-top: 30px;
    margin-left: -75px;
    bottom: 100%;
    padding-bottom: 20px;
    width: 100%;
}

.gift-wrap__tooltip {
    background: black;
    border-radius: 5px;
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5);
    padding: 6px;
    z-index: 5;
    max-width: 100%;
    text-align: center;
}

.cta-wrapper .gift-wrap__tooltip {
    margin-left: 0;
    width: 100%;
    padding: 15px 5px;
    left: 0;
    border: 1px solid rgba(243, 98, 121, 0.4);
}

.gift-wrap__label {
    background: url(/build/images/questionmark.ddc8acf8.svg) no-repeat right 8px;
    padding-right: 20px;
    background-size: 14px 14px;
    font-size: 14px;
    display: inline-block;
    margin-bottom: 0;
}

.cta-wrapper .gift-wrap__label {
    background-position: right center;
}

/* ==========================================================================
   $BASE-PICKER
   ========================================================================== */
/**
 * Note: the root picker element should *NOT* be styled more than what's here.
 */
.picker {
    font-size: 16px;
    text-align: left;
    line-height: 1.2;
    color: #000000;
    position: absolute;
    z-index: 10000;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/**
 * The picker input element.
 */
.picker__input {
    cursor: default;
}

/**
 * When the picker is opened, the input element is "activated".
 */
.picker__input.picker__input--active {
    border-color: #0089ec;
}

/**
 * The holder is the only "scrollable" top-level container element.
 */
.picker__holder {
    width: 100%;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

/*!
 * Classic picker styling for pickadate.js
 * Demo: http://amsul.github.io/pickadate.js
 */
/**
 * Note: the root picker element should *NOT* be styled more than what's here.
 */
.picker {
    width: 100%;
}

/**
 * The holder is the base of the picker.
 */
.picker__holder {
    position: absolute;
    background: #ffffff;
    border: 1px solid #aaaaaa;
    border-top-width: 0;
    border-bottom-width: 0;
    border-radius: 0 0 5px 5px;
    box-sizing: border-box;
    min-width: 176px;
    max-width: 466px;
    max-height: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    opacity: 0;
    -webkit-transform: translateY(-1em) perspective(600px) rotateX(10deg);
    transform: translateY(-1em) perspective(600px) rotateX(10deg);
    transition: -webkit-transform 0.15s ease-out, opacity 0.15s ease-out,
    max-height 0s 0.15s, border-width 0s 0.15s;
    transition: transform 0.15s ease-out, opacity 0.15s ease-out,
    max-height 0s 0.15s, border-width 0s 0.15s;
}

/**
 * The frame and wrap work together to ensure that
 * clicks within the picker don't reach the holder.
 */
.picker__frame {
    padding: 1px;
}

.picker__wrap {
    margin: -1px;
}

/**
 * When the picker opens...
 */
.picker--opened .picker__holder {
    max-height: 25em;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
    border-top-width: 1px;
    border-bottom-width: 1px;
    -webkit-transform: translateY(0) perspective(600px) rotateX(0);
    transform: translateY(0) perspective(600px) rotateX(0);
    transition: -webkit-transform 0.15s ease-out, opacity 0.15s ease-out,
    max-height 0s, border-width 0s;
    transition: transform 0.15s ease-out, opacity 0.15s ease-out, max-height 0s,
    border-width 0s;
    box-shadow: 0 6px 18px 1px rgba(0, 0, 0, 0.12);
}

/* ==========================================================================
   $BASE-DATE-PICKER
   ========================================================================== */
/**
 * The picker box.
 */
.picker__box {
    padding: 0 1em;
}

/**
 * The header containing the month and year stuff.
 */
.picker__header {
    text-align: center;
    position: relative;
    margin-top: 0.75em;
}

/**
 * The month and year labels.
 */
.picker__month,
.picker__year {
    font-weight: 500;
    display: inline-block;
    margin-left: 0.25em;
    margin-right: 0.25em;
}

.picker__year {
    color: #999999;
    font-size: 0.8em;
    font-style: italic;
}

/**
 * The month and year selectors.
 */
.picker__select--month,
.picker__select--year {
    border: 1px solid #b7b7b7;
    height: 2em;
    padding: 0.5em;
    margin-left: 0.25em;
    margin-right: 0.25em;
}

@media (min-width: 24.5em) {
    .picker__select--month,
    .picker__select--year {
        margin-top: -0.5em;
    }
}

.picker__select--month {
    width: 35%;
}

.picker__select--year {
    width: 22.5%;
}

.picker__select--month:focus,
.picker__select--year:focus {
    border-color: #0089ec;
}

/**
 * The month navigation buttons.
 */
.picker__nav--prev,
.picker__nav--next {
    position: absolute;
    padding: 0.5em 1.25em;
    width: 1em;
    height: 1em;
    box-sizing: content-box;
    top: -0.25em;
}

@media (min-width: 24.5em) {
    .picker__nav--prev,
    .picker__nav--next {
        top: -0.33em;
    }
}

.picker__nav--prev {
    left: -1em;
    padding-right: 1.25em;
}

@media (min-width: 24.5em) {
    .picker__nav--prev {
        padding-right: 1.5em;
    }
}

.picker__nav--next {
    right: -1em;
    padding-left: 1.25em;
}

@media (min-width: 24.5em) {
    .picker__nav--next {
        padding-left: 1.5em;
    }
}

.picker__nav--prev:before,
.picker__nav--next:before {
    content: " ";
    border-top: 0.5em solid transparent;
    border-bottom: 0.5em solid transparent;
    border-right: 0.75em solid #000000;
    width: 0;
    height: 0;
    display: block;
    margin: 0 auto;
}

.picker__nav--next:before {
    border-right: 0;
    border-left: 0.75em solid #000000;
}

.picker__nav--prev:hover,
.picker__nav--next:hover {
    cursor: pointer;
    color: #000000;
    background: #b1dcfb;
}

.picker__nav--disabled,
.picker__nav--disabled:hover,
.picker__nav--disabled:before,
.picker__nav--disabled:before:hover {
    cursor: default;
    background: none;
    border-right-color: #f5f5f5;
    border-left-color: #f5f5f5;
}

/**
 * The calendar table of dates
 */
.picker__table {
    text-align: center;
    border-collapse: collapse;
    border-spacing: 0;
    table-layout: fixed;
    font-size: inherit;
    width: 100%;
    margin-top: 0.75em;
    margin-bottom: 0.5em;
}

@media (min-height: 33.875em) {
    .picker__table {
        margin-bottom: 0.75em;
    }
}

.picker__table td {
    margin: 0;
    padding: 0;
}

/**
 * The weekday labels
 */
.picker__weekday {
    width: 14.285714286%;
    font-size: 0.75em;
    padding-bottom: 0.25em;
    color: #999999;
    font-weight: 500;
    /* Increase the spacing a tad */
}

@media (min-height: 33.875em) {
    .picker__weekday {
        padding-bottom: 0.5em;
    }
}

/**
 * The days on the calendar
 */
.picker__day {
    padding: 0.3125em 0;
    font-weight: 200;
    border: 1px solid transparent;
}

.picker__day--today {
    position: relative;
}

.picker__day--today:before {
    content: " ";
    position: absolute;
    top: 2px;
    right: 2px;
    width: 0;
    height: 0;
    border-top: 0.5em solid #0059bc;
    border-left: 0.5em solid transparent;
}

.picker__day--disabled:before {
    border-top-color: #aaaaaa;
}

.picker__day--outfocus {
    color: #dddddd;
}

.picker__day--infocus:hover,
.picker__day--outfocus:hover {
    cursor: pointer;
    color: #000000;
    background: #b1dcfb;
}

.picker__day--highlighted {
    border-color: #0089ec;
}

.picker__day--highlighted:hover,
.picker--focused .picker__day--highlighted {
    cursor: pointer;
    color: #000000;
    background: #b1dcfb;
}

.picker__day--selected,
.picker__day--selected:hover,
.picker--focused .picker__day--selected {
    background: #0089ec;
    color: #ffffff;
}

.picker__day--disabled,
.picker__day--disabled:hover,
.picker--focused .picker__day--disabled {
    background: #f5f5f5;
    border-color: #f5f5f5;
    color: #dddddd;
    cursor: default;
}

.picker__day--highlighted.picker__day--disabled,
.picker__day--highlighted.picker__day--disabled:hover {
    background: #bbbbbb;
}

/**
 * The footer containing the "today", "clear", and "close" buttons.
 */
.picker__footer {
    text-align: center;
}

.picker__button--today,
.picker__button--clear,
.picker__button--close {
    border: 1px solid #ffffff;
    background: #ffffff;
    font-size: 0.8em;
    padding: 0.66em 0;
    font-weight: bold;
    width: 33%;
    display: inline-block;
    vertical-align: bottom;
}

.picker__button--today:hover,
.picker__button--clear:hover,
.picker__button--close:hover {
    cursor: pointer;
    color: #000000;
    background: #b1dcfb;
    border-bottom-color: #b1dcfb;
}

.picker__button--today:focus,
.picker__button--clear:focus,
.picker__button--close:focus {
    background: #b1dcfb;
    border-color: #0089ec;
    outline: none;
}

.picker__button--today:before,
.picker__button--clear:before,
.picker__button--close:before {
    position: relative;
    display: inline-block;
    height: 0;
}

.picker__button--today:before,
.picker__button--clear:before {
    content: " ";
    margin-right: 0.45em;
}

.picker__button--today:before {
    top: -0.05em;
    width: 0;
    border-top: 0.66em solid #0059bc;
    border-left: 0.66em solid transparent;
}

.picker__button--clear:before {
    top: -0.25em;
    width: 0.66em;
    border-top: 3px solid #ee2200;
}

.picker__button--close:before {
    content: "\D7";
    top: -0.1em;
    vertical-align: top;
    font-size: 1.1em;
    margin-right: 0.35em;
    color: #777777;
}

.picker__button--today[disabled],
.picker__button--today[disabled]:hover {
    background: #f5f5f5;
    border-color: #f5f5f5;
    color: #dddddd;
    cursor: default;
}

.picker__button--today[disabled]:before {
    border-top-color: #aaaaaa;
}

/* ==========================================================================
   $CLASSIC-DATE-PICKER
   ========================================================================== */
.picker--opened .picker__holder:focus {
    outline: none;
    border: 2px solid #f36279;
    border-top: none;
}

.picker__input.picker__input--active {
    border-color: #f36279;
}

.page-exception .page__footer {
    margin-top: 0;
}

.page-exception__content {
    text-align: center;
    padding-top: 90px;
}

.page-exception h1 {
    font-weight: 300;
}

.page-exception__background img {
    display: block;
    margin: 0 auto;
}

@media (max-width: 750px) {
    .page-exception__background {
        display: none;
    }
}

.reset-password__form form {
    max-width: 600px;
}

.reset-password__form label {
    font-weight: bold;
    margin-bottom: 10px;
    display: block;
}

.reset-password__form input[type="email"] {
    width: 100%;
    margin-bottom: 10px;
}

.alert-box {
    padding: 15px;
    margin-bottom: 10px;
}

.alert-box.error {
    background: #cd5e5e;
}

.alert-box.warning {
    background: #f36279;
}

.alert-box.success {
    background: #3fb727;
    text-align: center;
}

/* Rendered at top of page */
.c-alert-box {
    background: white;
    padding: 8px 0;
}

.c-alert-box__message-container {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: calc(100% - 12px);
    float: left;
}

.c-alert-box__message {
    color: black;
    display: inline-block;
    float: left;
    max-width: calc(100% - 122px);
    padding: 0 24px;
}

@media (max-width: 960px) {
    .c-alert-box__message {
        max-width: 100%;
        float: none;
        padding: 12px 0;
    }

    .c-alert-box__message p {
        line-height: 21px;
        font-size: 15px;
    }
}

.c-alert-box__close {
    width: 12px;
    height: 12px;
    appearance: none;
    border: none;
    display: inline-block;
    float: right;
    background: url(/build/images/close-icon-cross.48f42993.svg) no-repeat center center;
    background-size: 12px 12px;
    margin-top: 7px;
}

.icon--horizontal-spacer {
    display: inline-block;
    width: 61px;
    height: 4px;
    float: left;
    border-bottom: 1px solid black;
    border-top: 1px solid black;
}

@media (max-width: 960px) {
    .icon--horizontal-spacer {
        display: none;
    }
}

.form__item.shipping-method {
    margin: 0 0 2em 0;
}

.form__item.shipping-method > .form__label {
    font-size: 1.6em;
    width: auto;
    margin-bottom: 1.15em;
    background: url(/build/images/dpd-packaging.f02750f1.png) no-repeat center right;
    padding-right: 70px;
    background-size: 48px 25px;
}

.form__item.shipping-method .custom-radio {
    padding: 1.4em 2em;
    background: #061729;
    margin-bottom: 0.8em;
}

.form__item.shipping-method .custom-radio:last-child {
    margin-bottom: 0;
}

.form__item.shipping-method .custom-radio label {
    width: auto;
    text-align: left;
    margin-bottom: 0;
}

.form__item.shipping-method.fr-fr > .form__label {
    background: url(/build/images/chronopost.688b66b4.png) no-repeat center right;
    background-size: 115px 25px;
    padding-right: 130px;
}

#sylius-parcel-shop-container {
    background: none;
}

.parcel-shop__form {
    display: flex;
    padding: 1.4em 2em;
    background: #152b3e;
}

@media (max-width: 750px) {
    .parcel-shop__form {
        flex-direction: column;
    }
}

.parcel-shop__form input[type="text"] {
    width: 65%;
}

@media (max-width: 750px) {
    .parcel-shop__form input[type="text"] {
        width: 100%;
    }
}

.parcel-shop__form a,
.parcel-shop__form button {
    width: 35%;
    margin-left: 1em;
    text-align: center;
    flex-grow: 1;
}

@media (max-width: 1024px) {
    .parcel-shop__form a,
    .parcel-shop__form button {
        width: 40%;
    }
}

@media (max-width: 750px) {
    .parcel-shop__form a,
    .parcel-shop__form button {
        margin-left: 0;
        width: 100%;
        margin-top: 0.5em;
    }
}

.parcel-shop__results {
    padding: 1.4em 1em;
    padding-top: 0;
    background: #152b3e;
    display: flex;
    flex-wrap: wrap;
}

.parcel-shop__results p {
    padding-left: 1em;
    margin-bottom: 20px;
}

.parcel-shop__results .parcel-shop__shop {
    width: 46%;
    margin-right: 2%;
    margin-left: 2%;
    margin-bottom: 5%;
    list-style: none;
    border: 1px solid rgba(255, 255, 255, 0.15);
    padding: 15px;
    cursor: pointer;
    transition: all ease 250ms;
    text-align: center;
    position: relative;
}

@media (max-width: 600px) {
    .parcel-shop__results .parcel-shop__shop {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }
}

.parcel-shop__results .parcel-shop__shop div {
    cursor: pointer;
}

.parcel-shop__results .parcel-shop__shop:hover,
.parcel-shop__results .parcel-shop__shop.is-selected {
    border-color: #8dc8e8;
}

.parcel-shop__results .parcel-shop__shop.is-selected {
    position: relative;
}

.parcel-shop__results .parcel-shop__shop.is-selected:before {
    position: absolute;
    left: -10px;
    top: -10px;
    background: #3fb727 url(/build/images/checkmark-icon-white.875300a0.svg) no-repeat center center;
    border-radius: 100%;
    content: "";
    display: block;
    background-size: 12px 12px;
    width: 20px;
    height: 20px;
}

.parcel-shop__results input[type="radio"] {
    display: none;
}

.parcel-shop__results ul {
    margin: 0;
    padding: 0;
}

.parcel-shop__results li {
    list-style: none;
}

.shop__hours {
    position: absolute;
    width: 300px;
    flex-wrap: nowrap;
    display: none;
    background: black;
    padding: 0.7em;
    border: 1px solid #654a1f;
    border-radius: 5px;
    z-index: 5;
    font-size: 0.8em;
    top: -120px;
}

@media (max-width: 960px) {
    .shop__hours {
        top: calc(100% + 1em);
        left: 0;
        width: 100%;
    }
}

.shop__hours.expanded {
    display: block;
}

@media (max-width: 960px) {
    .shop__hours.expanded {
        flex-wrap: wrap;
        justify-content: center;
    }
}

.shop__hours-day {
    width: 100%;
    display: flex;
}

@media (max-width: 960px) {
    .shop__hours-day {
        width: 33.3333333%;
        margin-bottom: 1em;
    }
}

.shop__hours-day .left {
    width: auto;
    min-width: 100px;
    text-align: left;
}

.shop__hours-day .right {
    display: flex;
    flex-wrap: nowrap;
}

.shop__hours-day .morning {
    padding-right: 1em;
}

#sylius-parcel-shop-container {
    padding-top: 0;
}

/*
 * Customization components
 */
@font-face {
    font-family: "chunkfiveroman";
    src: url(/build/fonts/chunkfive-webfont.63c3f3a1.woff2) format("woff2"),
    url(/build/fonts/chunkfive-webfont.0f8391d4.woff) format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "Alba Matter";
    src: url(/build/fonts/ALBAM___.5cd7b2c5.woff) format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "pacificoregular";
    src: url(/build/fonts/pacifico-webfont.762da975.woff2) format("woff2"),
    url(/build/fonts/pacifico-webfont.0f9522a6.woff) format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "NexaRustSlab-Black";
    src: url(/build/fonts/NexaRustSlab-Black.70a6c528.woff) format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "NexaRustHandmade-Condensed";
    src: url(/build/fonts/NexaRustHandmade-Condensed.6235b074.woff) format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "Blacksword";
    src: url(/build/fonts/Blacksword.03bbb0b6.woff) format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "BodoniSvtyTwoITCTT-Book";
    src: url(/build/fonts/BodoniSvtyTwoITCTT-Book.5ea1a810.woff) format("eot");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "bethhandregular";
    src: url(/build/fonts/bethhrg-webfont.1c654150.woff2) format("woff2"),
    url(/build/fonts/bethhrg-webfont.5a46f2a9.ttf) format("truetype"),
    url(/build/fonts/bethhrg-webfont.6db6f91d.woff) format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "LearningCurve";
    src: url(/build/fonts/LearningCurve.d9281b0b.eot);
    src: url(/build/fonts/LearningCurve.d9281b0b.eot?#iefix) format("embedded-opentype"),
    url(/build/fonts/LearningCurve.8c8e258c.woff) format("woff"),
    url(/build/fonts/LearningCurve.1948c22c.ttf) format("truetype");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "LearningCurveBold";
    src: url(/build/fonts/LearningCurve-Bold.22a59966.eot);
    src: url(/build/fonts/LearningCurve-Bold.22a59966.eot?#iefix) format("embedded-opentype"),
    url(/build/fonts/LearningCurve-Bold.01d09ca8.woff) format("woff"),
    url(/build/fonts/LearningCurve-Bold.d90a40c2.ttf) format("truetype");
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: "CaviarDreams";
    src: url(/build/fonts/caviardreams-webfont.6dd2c7da.woff2) format("woff2"),
    url(/build/fonts/caviardreams-webfont.f2eea73d.woff) format("woff"),
    url(/build/fonts/caviardreams-webfont.cc38fff4.ttf) format("truetype");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "CoolCrayonregular";
    src: url(/build/fonts/dk_cool_crayon-webfont.fb0a0e6a.woff2) format("woff2"),
    url(/build/fonts/dk_cool_crayon-webfont.871a0159.woff) format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "BodoniSvtyTwoITCTT-Book";
    src: url(/build/fonts/BodoniSvtyTwoITCTT-Book.d41d8cd9.eot),
    url(/build/fonts/BodoniSvtyTwoITCTT-Book.5ea1a810.woff) format("woff"),
    url(/build/fonts/BodoniSvtyTwoITCTT-Book.b76c9213.ttf) format("truetype"),
    url(/build/images/BodoniSvtyTwoITCTT-Book.c53474dc.svg) format("svg");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "FinelinerScript";
    src: url(/build/fonts/FinelinerScript.16921486.woff) format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "WanderlustLetters-Regular";
    src: url(/build/fonts/WanderlustLetters-Regular.b9c59165.woff) format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "Lazingonasunnyafternoon";
    src: url(/build/fonts/Lazingonasunnyafternoon.500977b7.woff) format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "thirstyScript";
    src: url(/build/fonts/thirstyscriptextrabolddemo-webfont.c7fdcb39.woff2) format("woff2"),
    url(/build/fonts/thirstyscriptextrabolddemo-webfont.4f8fed11.woff) format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "HolidaysHomework";
    src: url(/build/fonts/HolidaysHomework.dc5e60d6.woff2) format("woff2"),
    url(/build/fonts/HolidaysHomework.77c28867.woff) format("woff");
    font-weight: normal;
    font-style: normal;
}

.col {
    width: 50%;
    float: left;
    display: inline-block;
}

.col-left {
    width: 45%;
    padding-right: 30px;
}

@media (max-width: 960px) {
    .col-left {
        width: 60%;
        padding-right: 0;
    }
}

.col-right {
    width: 55%;
    padding-left: 30px;
}

@media (max-width: 960px) {
    .col-right {
        width: 40%;
        padding-left: 15px;
    }
}

.preload-fonts {
    opacity: 0;
    height: 0;
    width: 0;
    display: inline-block;
}

.customize .page__heading--large {
    margin-bottom: 30px;
    margin-top: 0;
}

.customize .product__title--sub {
    color: rgba(255, 255, 255, 0.5);
    font-size: 16px;
}

.customize-wrapper {
    display: none;
}

@media (min-width: 700px) {
    .customize-wrapper {
        display: block;
    }
}

.box.customize-wrapper .main > .canvas-container {
    margin: 0 auto;
}

.customize__mobile-notification {
    display: block;
    margin-top: 0.8em;
}

@media (min-width: 700px) {
    .customize__mobile-notification {
        display: none;
    }
}

.customize__wizard {
    position: relative;
}

.customize__wizard form label {
    display: block;
    margin-bottom: 0.25em;
}

.wizard__indent-line {
    position: absolute;
    z-index: 1;
    background: #152b3e;
    width: 2px;
    height: 100%;
    left: 26px;
    top: 0;
    display: block;
}

@media (max-width: 960px) {
    .wizard__indent-line {
        left: 12px;
    }
}

.wizard__step {
    z-index: 2;
    position: relative;
    margin-bottom: 23px;
}

.wizard__step.step-4 {
    margin-bottom: 0;
}

.wizard__step .step__content {
    display: none;
}

.wizard__step.is-expanded .step__label {
    color: rgba(21, 43, 62, 1) !important
}

.wizard__step.is-expanded .step__label:before {
    background: #16c1f3;
}

.is-rendered .wizard__step.is-expanded .step__content {
    display: block;
    opacity: 0;
    transform: translateY(10px);
    animation: fadeInTranslate ease 600ms forwards;
}

.wizard__step form {
    margin-bottom: 30px;
}

.wizard__step form h4 {
    margin-bottom: 0.5em;
}

.wizard__step form input[type="text"] {
    margin-bottom: 0.5em;
    width: 100%;
}

.step__label {
    /*background-color: #152b3e;*/
    color: rgba(21, 43, 62, 0.5) !important;
    padding: 10px 0;
    text-decoration: none;
    position: relative;
    font-size: 14px;
    display: flex;
    align-items: center;
    /*box-shadow: 0 11px 10px 0 rgba(0, 0, 0, 0.23);*/
    border-bottom: 1px solid rgba(0, 0, 0, 0.5);
    justify-content: space-between;
}

@media (max-width: 960px) {
    .step__label {
        padding: 5px 6px;
    }
}

/*.step__label:before {*/
/*    content: "";*/
/*    display: inline-block;*/
/*    width: 15px;*/
/*    height: 15px;*/
/*    background: #f36279;*/
/*    border: 5px solid #003865;*/
/*    border-radius: 100%;*/
/*    margin-right: 12px;*/
/*}*/

.step__content {
    padding: 30px 0;

}

.step-4 .step__content {
    margin-top: 32px;
}

@media (max-width: 960px) {
    .step__content {
        padding: 1em 0;
        padding-right: 0;
    }
}

.text-form .form__row {
    display: block;
}

.template-picker ul {
    margin: 0;
    padding: 0;
}

.template-picker li {
    list-style: none;
    margin-right: 22px;
    margin-bottom: 22px;
    float: left;
}

@media (max-width: 960px) {
    .template-picker li {
        width: calc(50% - 10px);
        margin-right: 10px;
        margin-bottom: 10px;
    }
}

.template-picker__option {
    display: block;
    width: 100%;
}

.template-picker__option:hover {
    border-color: #f36279;
}

.template-picker__option:hover img {
    opacity: 0.8;
}

.template-picker__option img {
    border-radius: 4px;
    border: 3px solid #8cc7e7;
    transition: all ease 300ms;
    width: 100%;
    height: auto;
    opacity: 0.6;
}

.template-picker__option.is-active img {
    border-color: white;
    opacity: 1;
}

.box .template-picker__option > img {
    border-radius: 50%;
    object-fit: cover;
}

@media (min-width: 1300px) {
    .box .template-picker__option > img {
        max-width: 148px;
        min-width: 148px;
        min-height: 148px;
    }
}

@media (max-width: 1300px) {
    .box .template-picker__option > img {
        max-width: 110px;
        min-width: 110px;
        min-height: 110px;
    }
}

.product-picker ul {
    margin: 0;
    padding: 0;
}

.product-picker li {
    list-style: none;
    width: calc(25% - 22px);
    margin: 11px 22px 22px 0;
}
.product-picker>p {
    color: #000;
    margin-bottom: 10px
}

.wizard__step.is-expanded .step__label {
    color: #000 !important;
    font-weight: 400;
    font-size: 1.2rem;
}

.wizard__step .step__label {
    font-weight: 400;
    font-size: 1.2rem;
}

.product-picker__option {
    display: flex;
    position: relative;
    align-items: center;
    justify-content: center;
    height: 149px;
    width: 100%;
    cursor: pointer;
    border-radius: 4px;
    border: 3px solid #8cc7e7;
    transition: all ease 300ms;
    padding: 0px;
    opacity: 0.6;
}

@media (max-width: 1300px) {
    .product-picker__option {
        height: 111px;
    }
}

.product-picker__option:hover {
    opacity: 0.8;
}

.product-picker__option img {
    padding: 0;
}

.product-picker__option.is-active {
    border-color: #8dc8e8;
    opacity: 1;
}

.customize__switch-view {
    display: flex;
    flex-wrap: wrap;
    text-align: center;
    margin: auto;
    padding: 0;
    margin: 15px 0;
}

.customize__switch-view li {
    display: inline-block;
    max-width: 50%;
    margin: auto;
}

.customize__switch-view li button {
    border: 1px solid #22497e;
    padding: 7px 25px;
    background: #061729;
    color: white;
    display: inline-block;
    appearance: none;
}

.customize__switch-view li button:focus {
    outline: none;
}

.customize__switch-view li.active button {
    background: #22497e;
    color: white;
}

.customize__switch-view li:first-child {
    margin-right: 0;
}

.customize__switch-view li:first-child button {
    border-top-left-radius: 17.5px;
    border-bottom-left-radius: 17.5px;
}

.customize__switch-view li:last-child {
    margin-left: 0;
}

.customize__switch-view li:last-child button {
    border-top-right-radius: 17.5px;
    border-bottom-right-radius: 17.5px;
}

.product__can {
    width: 100%;
    pointer-events: none;
}

.product__can .lower-canvas {
    background: transparent;
}

.is-hidden {
    display: none;
}

.is-visible {
    display: block;
}

.customize_container.hidden {
    display: none;
}

.canvas-container {
    overflow: hidden;
}

.product__canvas {
    display: none;
}

.product__canvas.visible {
    display: block;
    opacity: 0;
    transform: translateY(30px);
    animation: fadeInTranslate ease 600ms 200ms forwards;
}

.no-cssanimations .product__canvas.visible {
    opacity: 1;
    transform: none;
    animation: none;
}

.canvas-container,
.canvas-container canvas,
.product__canvas {
    width: auto !important;
    height: 500px !important;
    max-width: 100%;
}

@media (max-width: 1300px) {
    .canvas-container,
    .canvas-container canvas,
    .product__canvas {
        height: auto !important;
        width: 300px !important;
    }
}

.lower-canvas {
    background: white;
}

.customize__switch-view {
    display: flex;
    flex-wrap: wrap;
    text-align: center;
    margin: auto;
    padding: 0;
    margin: 15px 0;
}

.customize__switch-view li {
    display: inline-block;
    max-width: 50%;
    margin: auto;
}

.customize__switch-view li button {
    border: 1px solid #22497e;
    padding: 7px 25px;
    background: #061729;
    color: white;
    display: inline-block;
    appearance: none;
}

.customize__switch-view li button:focus {
    outline: none;
}

.customize__switch-view li.active button {
    background: #22497e;
    color: white;
}

.customize__switch-view li:first-child {
    margin-right: 0;
}

.customize__switch-view li:first-child button {
    border-top-left-radius: 17.5px;
    border-bottom-left-radius: 17.5px;
}

.customize__switch-view li:last-child {
    margin-left: 0;
}

.customize__switch-view li:last-child button {
    border-top-right-radius: 17.5px;
    border-bottom-right-radius: 17.5px;
}

.product__can {
    width: 100%;
    pointer-events: none;
}

.product__can .lower-canvas {
    background: transparent;
}

.is-hidden {
    display: none;
}

.is-visible {
    display: block;
}

.modal__footer {
    padding-top: 2em;
}

.modal__footer .link--back {
    margin-right: 2em;
}

.finalise-preview {
    background: white no-repeat left top;
    background-size: contain;
    min-height: 286px;
    text-align: right;
}

.finalise-preview img {
    max-width: 389px;
    margin: 0 6px 6px auto;
    display: block;
    position: relative;
    top: 6px;
}

.finalise-preview-box {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-bottom: 45px;
}

.finalise-preview-box img {
    border-radius: 50%;
    object-fit: cover;
    width: 465px;
    height: 465px;
}

.confirmation-modal {
    /* State when user has to confirm add to cart */
    /* State when added to cart */
    /* State when adding to cart */
}

.confirmation-modal .added-to-cart {
    display: none;
}

.confirmation-modal .added-to-cart .modal__title {
    text-align: center;
}

.confirmation-modal .modal__content {
    width: 770px;
}

.confirmation-modal .modal__footer {
    text-align: center;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 30px;
}

.confirmation-modal .adding-to-cart {
    display: none;
    text-align: center;
}

.confirmation-modal .added-to-cart__icon {
    background: rgba(103, 103, 103, 0.3) url(/build/images/checkmark-icon-white.875300a0.svg) no-repeat center center;
    background-size: 60%;
    border-radius: 50%;
    display: block;
    margin: auto;
    width: 70px;
    height: 70px;
}

.confirmation-modal.added-tocart .added-to-cart {
    display: block;
}

.confirmation-modal.added-tocart .add-to-cart {
    display: none;
}

.confirmation-modal .add-to-cart {
    display: block;
}

.confirmation-modal.ajax-loader .adding-to-cart {
    display: block;
}

.confirmation-modal.ajax-loader .add-to-cart {
    display: none;
}

.confirmation-modal .added-to-cart__success {
    transform: translateY(50px);
    opacity: 0;
    animation: fadeInCheckout ease 350ms 120ms forwards;
    padding-bottom: 30px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.confirmation-modal .added-to-cart__next {
    transform: translateY(50px);
    opacity: 0;
    animation: fadeInCheckout ease 350ms 400ms forwards;
    padding-top: 30px;
}

@keyframes fadeInCheckout {
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes fadeOutCheckout {
    100% {
        height: 0;
        transform: translateY(50px);
        opacity: 0;
    }
}

.confirmation-modal__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    margin: 0;
    padding: 0;
}

.confirmation-modal__actions li {
    width: 50%;
    list-style: none;
    padding: 0 0.25em;
    margin-bottom: 0.5em;
}

.confirmation-modal__actions a {
    background-color: rgba(255, 255, 255, 0.07);
    border: 1px solid transparent;
    padding: 1rem;
    text-align: center;
    transition: all ease 350ms;
    text-decoration: none;
    font-weight: 700;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 14px;
}

.upload-form {
    margin-bottom: 0;
}

.upload-form__input {
    position: absolute;
    z-index: 2;
    opacity: 0;
    max-width: 100%;
}

.upload-form__upload-button {
    position: relative;
    z-index: 1;
    margin-bottom: 15px;
}

.upload-form__image {
    border-bottom: 2px solid rgba(255, 255, 255, 0.15);
    margin-bottom: 30px;
    display: none;
}

.upload-form__image.is-visible {
    display: block;
}

.upload-form__image .alert-box {
    display: none;
}

.upload-form__image .alert-box.is-visible {
    display: block;
    opacity: 1;
    transform: translateY(20px);
    animation: fadeInTranslate ease 350ms forwards;
}

.upload-form__image .upload-form {
    margin-bottom: 7.5px;
}

.upload-form__text {
    display: none;
}

.upload-form__text.is-visible {
    display: block;
}

.upload-form .image-preview__wrapper {
    margin-bottom: 15px;
    display: flex;
    align-items: center;
}

.upload-form .image-preview__wrapper .alert-box {
    float: left;
    max-width: calc(80% - 84px);
    margin: 0;
    margin-left: 20px;
    padding: 0.5em;
}

.upload-form .image-preview__wrapper .alert-box p {
    line-height: 18px;
    font-size: 14px;
}

.upload-form__image-preview {
    display: none;
    opacity: 0;
    width: 64px;
    height: 64px;
    border: 2px solid #d1d1d1;
    float: left;
    background: white;
}

.upload-form__image-preview.is-visible {
    display: block;
    opacity: 1;
    transform: translateY(5px);
    animation: fadeInTranslate ease 350ms forwards;
}

.upload-form__image-preview img {
    width: 100%;
    height: 100%;
    float: left;
}

.upload-form__actions {
    display: none;
}

.upload-form__actions.is-visible {
    display: block;
    opacity: 0;
    transform: translateY(10px);
    animation: fadeInTranslate ease 600ms forwards;
}

.upload-form__actions ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
}

.upload-form__actions li {
    display: inline-block;
    float: left;
}

.upload-form__actions label {
    display: none;
}

.upload-form__action-spacer {
    width: 30px;
}

@media (max-width: 960px) {
    .upload-form__action-spacer {
        width: 0;
    }
}

.product__footer {
    border-top: 1px solid #333333;
    margin-top: 27px;
    padding-top: 15px;
}

.customize__ingredients {
    margin-top: 18px;
}

.customize__ingredients .product__sub-item--list {
    background: rgba(17, 17, 17, 0.8);
    margin-bottom: 2px;
    margin-right: 4px;
    width: calc(33.3333333% - 4px);
    padding: 6px 0;
}

.customize__ingredients .product__sub-item--list img {
    height: auto;
    margin: 0;
}

.customize__ingredients .product__sub-item--list .grid__col--one-third {
    display: flex;
    align-items: center;
    margin-right: 0;
    justify-content: center;
    width: 31.1415%;
    flex-grow: 1;
}

.customize__ingredients .sub-item__description p {
    line-height: 15px;
    font-size: 10px;
}

.customize__ingredients .sub-item__title {
    color: #d2d2d2;
}

.wizard-actions.product__actions {
    position: relative;
    z-index: 2;
    border-top: none;
}

.wizard-actions .actions-box {
    background: #001729;
    padding: 20px 44px;
    min-width: 80%;
}

@media (max-width: 960px) {
    .wizard-actions .actions-box {
        padding: 1em;
    }
}

.wizard-actions .actions-box p {
    color: #838383;
    font-size: 14px;
    font-weight: 600;
}

.wizard-actions .cart__submit-wrapper {
    position: relative;
}

.wizard-actions .cart__submit:disabled {
    background: #f36279;
    cursor: not-allowed;
}

.wizard-actions .actions-header {
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

@media (max-width: 960px) {
    .wizard-actions .actions-header__left {
        width: 100%;
        text-align: left;
        margin-bottom: 15px;
    }
}

.wizard-actions .actions-header__right {
    text-align: right;
    position: relative;
}

@media (max-width: 960px) {
    .wizard-actions .actions-header__right {
        width: 100%;
        text-align: left;
    }
}

.wizard-actions .actions-header__price {
    font-size: 44px;
    font-weight: 300;
}

.wizard-actions .actions-header__price-label {
    font-weight: bold;
    margin-left: 17.14286px;
}

@media (max-width: 960px) {
    .wizard-actions .actions-header__price-label {
        margin-left: 0;
        display: block;
    }
}

.cart__tooltip-wrapper {
    position: absolute;
    padding: 6px;
    z-index: 5;
    right: 0;
    bottom: calc(100% + 15px);
    width: 200px;
    display: none;
    opacity: 0;
    transform: scale(0.9);
}

.cart__tooltip-wrapper.is-visible {
    display: block;
    animation: tooltipAnimation ease 10s 150ms forwards;
}

.cart__tooltip {
    position: relative;
    text-align: center;
    padding: 10px 15px;
    background: rgba(243, 98, 121, 0.85);
    border-radius: 5px;
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.5);
}

.cart__tooltip:after {
    position: absolute;
    top: 100%;
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid rgba(243, 98, 121, 0.85);
    right: 15px;
}

@keyframes tooltipAnimation {
    5%,
    95% {
        transform: scale(1);
        opacity: 1;
    }
    100% {
        transform: scale(0.9);
        opacity: 0;
    }
}

/*
 * Layout styles (header, footer, sidebar, etc..)
 */
/**
 * @file
 * Theming for header
 *
 * @author Senne Torfs <senne.torfs@intracto.com>
 */
.page__header-wrapper {
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 100%;
    position: relative;
}

@media (max-width: 960px) {
    .page__header-wrapper .header__mobile-logo-wrapper {
        display: inline-block;
    }
}

.page__header-wrapper .header__menu-40th-anniversary {
    width: 150px;
    float: left;
    margin-right: 20px;
    position: relative;
    top: 178px;
    margin-top: -150px;
    z-index: 100;
}

@media (min-width: 960px) {
    .page__header-wrapper .header__menu-40th-anniversary {
        transition: margin-top 0.5s, top 0.5s, width 0.5s;
    }

    .page__header-wrapper .header__menu-40th-anniversary.minimize {
        margin-top: 0;
        top: 0;
        width: 70px;
    }
}

@media (max-width: 960px) {
    .page__header-wrapper .header__menu-40th-anniversary {
        width: 60px;
        float: none;
        display: inline-block;
        top: 0;
    }
}

@media (max-width: 360px) {
    .page__header-wrapper .header__menu-40th-anniversary {
        width: 40px;
    }
}

.page__header-wrapper.sticky .header__menu-bar {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 99;
    background: #152b3e;
}

.page__header-wrapper.sticky .header__logo {
    height: 50px;
}

.page__header-wrapper.sticky .header__row--top {
    position: fixed;
    top: 35px;
    right: 20px;
    display: none;
}

.page__header-wrapper.sticky .container--center {
    display: block;
}

.page__header-wrapper.sticky .header__navigation-wrapper {
    margin-top: 4px;
}

.page__header-wrapper.sticky .header__row--bottom {
    margin-top: 0;
}

@media (min-width: 960px) {
    .page__header-wrapper.sticky .header__menu-40th-anniversary {
        transition: none;
        width: 55px;
    }
}

@media (max-width: 960px) {
    .page__header-wrapper.sticky .header__menu-40th-anniversary {
        top: 154px;
    }
}

@media (max-width: 960px) {
    .page__header-wrapper.sticky .header__menu-40th-anniversary {
        top: 0;
    }
}

.header-image__container {
    background: #061729;
    position: relative;
    overflow: hidden;
}

@media (max-width: 960px) {
    .header-image__container {
        height: auto;
    }
}

@media (max-width: 750px) {
    .header-image__container {
        min-height: inherit;
    }
}

.header-image__image {
    max-width: inherit;
    height: auto;
    width: auto;
    margin: auto;
    display: block;
    margin-left: 50%;
    transform: translateX(-50%);
}

@media (max-width: 960px) {
    .header-image__image {
        width: 100%;
        margin-top: 0;
    }
}

.cssanimations .header-image__image {
    opacity: 0;
}

.cssanimations .header-image__image.images-loaded {
    animation: fadeIn ease 400ms 250ms forwards;
}

.page__header--mix {
    background-image: url(/build/images/header-bg.3e6586ff.jpg);
    background-position: center top;
    background-repeat: no-repeat;
    background-size: auto 356px;
}

.page__header--black {
    background: #14141478;
    position: relative;
}

.header__menu-bar {
    background-color: #152b3e;
    padding: 15px 0;
}

.header__menu-bar::after {
    clear: both;
    content: "";
    display: table;
}

@media screen and (max-width: 960px) {
    .header__menu-bar {
        text-align: center;
    }
}

.header__col--right {
    float: right;
}

.header__row--top {
    clear: right;
    float: right;
    margin-bottom: 15px;
}

@media screen and (max-width: 960px) {
    .header__row--top {
        display: none;
    }
}

.header__row--bottom {
    clear: right;
    float: right;
    width: calc(100% - 310px);
    margin-top: 30px;
}

@media screen and (max-width: 1300px) {
    .header__row--bottom {
        width: calc(100% - 250px);
    }
}

@media screen and (max-width: 960px) {
    .header__row--bottom {
        width: auto;
        margin-top: 10px;
    }
}

@media screen and (max-width: 360px) {
    .header__row--bottom {
        clear: none;
    }
}

.header__navigation-wrapper {
    float: left;
}

.header__background-image-mobile {
    display: none;
    background-position: center;
    background-repeat: no-repeat;
    height: 170px;
    background-size: 150%;
}

@media (max-width: 460px) {
    .header__background-image-mobile {
        display: block;
        background-position: 70% center;
    }
}

.header__background-image {
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    height: 550px;
}

@media (max-width: 460px) {
    .header__background-image {
        background-image: none !important;
    }
}

@media (max-width: 1160px) {
    .header__background-image {
        height: 400px;
    }
}

@media (max-width: 960px) {
    .header__background-image {
        height: 330px;
        background-size: cover;
    }
}

@media (max-width: 460px) {
    .header__background-image {
        background-position: 100% center;
        height: auto;
    }
}

.header__background-image .container--center {
    height: 100%;
}

.header__content {
    width: 65%;
    padding: 0;
    display: flex;
    align-items: center;
    height: 100%;
    z-index: 10;
}

.header__content--inner {
    background: #152b3e;
    padding: 2em;
}

@media (max-width: 460px) {
    .header__content--inner {
        padding: 1em;
        margin: 1em 0;
        width: 100%;
    }
}

.cssanimations .header__content {
    opacity: 0;
    transform: translateY(20px);
    animation: fadeInTranslate ease-in 500ms forwards;
}

.header__content p {
    font-size: 18px;
}

@media screen and (max-width: 960px) {
    .header__content {
        padding: 0;
    }

    .header__content p,
    .header__content .header__title {
        text-shadow: 0 0 20px #14141478;
    }
}

@media screen and (max-width: 750px) {
    .header__content {
        width: 100%;
        position: relative;
        top: 0;
    }
}

.header__title {
    font-style: italic;
}

.header__title--brown {
    font-size: 1.5625em;
    color: #987f49;
    display: block;
    margin-bottom: 5px;
}

@media (max-width: 960px) {
    .header__title--brown {
        font-size: 1.25em;
    }
}

.header__title--cream {
    font-size: 2em;
    line-height: 42px;
    font-weight: 700;
    color: #e7d7be;
    display: block;
}

@media (max-width: 960px) {
    .header__title--cream {
        font-size: 1.75em;
    }
}

@media screen and (max-width: 460px) {
    .header__title--cream {
        font-size: 1.375em;
    }
}

.header-image__container a {
    text-decoration: none;
}

.header__content {
    font-style: italic;
}

.header__content h1,
.header__content p {
    color: white;
    text-decoration: none;
}

.header__content .btn--brown,
.header__content .btn--brown--compact,
.header__content .btn--brown--large,
.header__content .btn--green--compact,
.header__content .btn--green--large,
.header__content .btn__config {
    font-style: normal;
    margin-top: 1em;
}

.header__menu-top {
    background: #001729;
    box-shadow: 0 1px 0 0 rgba(87, 87, 87, 0.004);
    padding: 10px 0;
    text-align: right;
    min-height: 43px;
}

@media (max-width: 960px) {
    .header__menu-top {
        display: none;
    }
}

.header__menu-top .nav__list {
    display: inline-block;
    margin-right: 90px;
}

.header__menu-top .langswitch {
    display: inline-block;
    float: none;
}

.header__menu-top .nav__item {
    border: none;
}

.header__menu-top .nav__item > a {
    color: rgba(220, 220, 220, 0.5);
    font-size: 14px;
    font-weight: 400;
    padding: 0 23px 0 15px;
}

.header__menu-top .nav__item > a:hover {
    text-decoration: underline;
}

/**
 * @file
 * Theming for _content
 *
 * @author Senne Torfs <senne.torfs@intracto.com>
 */
.content__wrapper--grey {
    clear: both;
}

.content__wrapper {
    clear: both;
}

.content__blue {
    margin: 15px 0px;
    padding: 15px;
    background-color: #152b3e;
}

.page__heading-wrapper {
    padding: 30px 0;
}

@media screen and (max-width: 460px) {
    .page__heading-wrapper {
        padding: 15px 0;
    }
}

.page__heading-wrapper--gradient {
    padding: 30px 0 75px;
}

.page__heading {
    font-size: 1.5em;
    font-weight: 400;
    margin-bottom: 0;
}

.page__heading--large {
    font-size: 2em;
    font-weight: 300;
    margin-bottom: 0;
    margin-top: 90px;
}

.page__heading--cart {
    background: url(/build/images/shopping-cart-icon.3014836b.svg) no-repeat right 15px center;
    background-size: 45px auto;
    font-size: 2.625em;
    font-weight: 700;
    margin-bottom: 15px;
    margin-top: 30px;
    display: inline-block;
    padding-right: 90px;
}

@media screen and (max-width: 960px) {
    .page__heading--cart {
        font-size: 2.25em;
    }

    .page__heading--large {
        font-size: 1.75em;
    }
}

@media screen and (max-width: 600px) {
    .page__heading--cart {
        background-size: 30px auto;
        padding-right: 60px;
        font-size: 1.75em;
    }

    .page__heading--large {
        font-size: 1.5em;
    }
}

@media screen and (max-width: 460px) {
    .page__heading--cart {
        font-size: 1.375em;
    }
}

.page__heading-cta {
    background-color: rgba(0, 0, 0, 0.25);
    display: inline-block;
    font-size: 0.875em;
    margin: 0;
    padding: 11px 45px 11px 75px;
    white-space: nowrap;
    position: relative;
}

.page__heading-cta strong {
    color: #a08b67;
    font-weight: normal;
}

.page__heading-cta strong span {
    font-weight: 900;
    text-transform: uppercase;
}

@media (max-width: 960px) {
    .page__heading-cta {
        padding-left: 15px;
    }

    .page__heading-cta:after {
        display: none;
    }
}

@media (max-width: 600px) {
    .page__heading-cta {
        margin-bottom: 10px;
    }
}

.page__heading-cta.first {
    margin-right: 15px;
}

@media (max-width: 750px) {
    .page__heading-cta.first {
        margin-right: 0;
    }
}

.page__heading-cta.first:after {
    background-position: center center;
    background-repeat: no-repeat;
    width: 50px;
    height: 55px;
    top: -10px;
}

.page__heading-cta.second:after {
    background-position: center center;
    background-repeat: no-repeat;
}

.page__heading-cta:after {
    content: "";
    position: absolute;
    height: 45px;
    width: 50px;
    left: 15px;
    top: -4px;
}

@media screen and (max-width: 750px) {
    .page__heading-cta {
        float: left;
        text-align: left;
    }
}

@media screen and (max-width: 360px) {
    .page__heading-cta {
        padding-left: 15px;
    }

    .page__heading-cta:after {
        content: initial;
    }
}

.cta-grid {
    background: #152b3e;
    margin-top: 20px;
    margin-bottom: 20px;
    width: 100%;
    text-align: center;
}

@media (max-width: 1100px) {
    .cta-grid .cta-wrap {
        margin-right: 1%;
    }
}

@media (max-width: 960px) {
    .cta-grid .cta-wrap {
        margin-bottom: 20px;
        width: 100%;
        margin-left: 0%;
        margin-right: 0%;
    }

    .cta-grid .cta-wrap:last-of-type {
        margin-bottom: 0;
    }
}

.cta-grid .cta-wrap .page__heading-cta {
    font-size: 14px;
    background: none;
    color: #8dc8e8;
    width: 100%;
    padding: 11px 15px 11px 15px;
    text-align: center;
}

@media (max-width: 960px) {
    .cta-grid .cta-wrap .page__heading-cta {
        font-size: 10px;
        padding: 8px 20px 8px 20px;
        margin-bottom: 0;
    }
}

.cta-grid .cta-wrap .page__heading-cta img {
    max-height: 66px;
    margin-right: 10px;
}

@media (max-width: 1100px) {
    .cta-grid .cta-wrap .page__heading-cta img {
        max-height: 54px;
    }
}

@media (max-width: 960px) {
    .cta-grid .cta-wrap .page__heading-cta img {
        max-height: 44px;
    }
}

.cta-grid .cta-wrap .page__heading-cta:after {
    background-size: 145px auto;
    background-repeat: no-repeat;
    background-position: center;
    top: -30px;
    height: 107px;
    left: 0;
}

.cta-grid .cta-wrap .page__heading-cta:first-child:after {
    background-size: 175px auto;
}

.cta-grid .cta-wrap .page__heading-cta.cta-second:after {
    background-size: 20px auto;
    height: 80px;
    background-position: center 17px;
}

.cta-grid .cta-wrap .page__heading-cta a {
    color: #8dc8e8;
    font-weight: 700;
    text-decoration: none;
    font-size: 1.1rem;
}

@media (max-width: 960px) {
    .cta-grid .cta-wrap .page__heading-cta a {
        font-size: 0.9rem;
    }
}

.cta-grid .cta-wrap .page__heading-cta a span {
    display: inline-block;
    line-height: 66px;
    vertical-align: top;
}

@media (max-width: 960px) {
    .cta-grid .cta-wrap .page__heading-cta a span {
        line-height: 50px;
    }
}

/*.page-title-wrapper {
  width: auto;
  margin-right: 0;
  @media (max-width: $tablet) {
    width: 100%;
    margin-bottom: 15px;
  }
}*/
.page__footer {
    margin-top: 30px;
}

.footer__block {
    margin-bottom: 30px;
}

.footer__block.split {
    display: flex;
}

.footer__block--left {
    width: 35%;
}

.footer__block--right {
    width: 65%;
    padding-left: 15px;
}

.footer__block--right ul.footer__list {
    display: block;
}

.footer__block--right ul.footer__list li {
    width: 50%;
    float: left;
    display: block;
}

.footer__block img.safeshops {
    width: 259px;
}

.footer__block .emota-logo {
    width: 259px;
}

.sub-footer__wrapper {
    background-color: #07497d;
    padding: 30px;
}

.sub-footer__wrapper::after {
    clear: both;
    content: "";
    display: table;
}

@media screen and (max-width: 460px) {
    .sub-footer__wrapper {
        padding: 15px;
    }
}

.subtitle--yellow {
    color: #8dc8e8;
    font-size: 1.125em;
    font-weight: 700;
    margin-bottom: 8px;
}

.footer__title {
    color: #fff;
    font-size: 1.125em;
    margin-bottom: 8px;
}

.footer__top {
    background-color: #152b3e;
    box-shadow: 0 11px 10px rgba(0, 0, 0, 0.23);
    margin-bottom: 30px;
}

.footer__top .grid__col--four-fifth {
    margin-right: 0;
}

.footer__top p {
    color: #949494;
    font-size: 13px;
    line-height: 22px;
    margin-bottom: 0;
}

.safe-shop img {
    max-height: 30px;
}

.footer__main {
    background-color: #152b3e;
    background-image: url(/build/images/footer-bg.ab5f7617.png);
    border-top: none !important;
    background-position: center bottom;
    background-repeat: no-repeat;
    border-top: 1px solid #262626;
    padding-bottom: 90px;
}

@media (max-width: 960px) {
    .footer__main .grid__col--one-third {
        width: 50%;
        margin-right: 0;
        padding-right: 30px;
    }

    .footer__main .grid__col--one-third:first-child {
        width: 100%;
        text-align: center;
    }
}

@media (max-width: 600px) {
    .footer__main .grid__col--one-third {
        width: 100%;
        padding-right: 0;
    }
}

.footer__main p {
    color: #949494;
    font-size: 0.8125em;
    margin-top: 0;
}

.footer__bottom {
    color: #949494;
    font-size: 15px;
    padding: 30px 0 90px;
}

.footer__bottom::after {
    clear: both;
    content: "";
    display: table;
}

@media (max-width: 600px) {
    .footer__bottom .list--inline-block {
        text-align: center;
    }

    .footer__bottom .list--inline-block li {
        display: block;
        margin-right: 0;
        margin-bottom: 12px;
    }
}

.footer__bottom a {
    color: #949494;
    text-decoration: none;
}

@media (max-width: 960px) {
    .footer__bottom a:hover {
        text-decoration: underline;
        border: none;
    }
}

.footer__bottom a:hover {
    color: #fff;
    border-bottom: 1px solid;
}

@media (max-width: 960px) {
    .footer__bottom .align-right {
        text-align: center;
    }
}

.footer__list {
    font-size: 0.875em;
    list-style: none;
    margin: 0;
    padding: 0;
}

.footer__list li {
    margin-bottom: 8px;
}

.footer__list a {
    display: inline-block;
    text-decoration: none;
}

.footer__list a:hover {
    color: #fff;
    text-decoration: underline;
}

.social-icons {
    display: flex;
    align-items: center;
}

.social-icons li {
    margin-right: 20px;
}

.social-icons li:last-child {
    margin-right: 0;
}

.social-icons svg,
.social-icons img {
    height: 22px;
    width: auto;
    fill: #ef6079;
}

.social-icons svg:hover,
.social-icons img:hover {
    opacity: 0.8;
}

/* Canvas preview styles for template selection */
.template-canvas-preview canvas {
    max-width: 100%;
    max-height: 100%;
}

.template-canvas-preview .canvas-loading {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #666;
    font-size: 12px;
    z-index: 10;
}

.template-picker__option {
    border: 3px solid #8cc7e7;
    opacity: 0.6;
}

.template-picker__option.is-active {
    opacity: 1;
}

.template-picker__option:hover{
    opacity: 0.8;
}

/* Keep custom upload preview fully opaque on hover */
.template-picker__option.js-choose-custom-upload:hover,
.template-picker__option.js-choose-custom-upload:hover .custom-upload-preview {
    opacity: 1;
}

ul.clearfix.js-template-picker.flex.flex-wrap {
    max-height: 300px;
    scroll-behavior: smooth;
    overflow-y: auto;
    overflow-x: hidden;
}

ul.clearfix.js-template-picker.flex.flex-wrap::-webkit-scrollbar {
    width: 6px;        /* vertical scrollbar */
    height: 6px;       /* horizontal scrollbar */
  }
  
ul.clearfix.js-template-picker.flex.flex-wrap::-webkit-scrollbar-track {
    background: #f0f0f0;       /* Track background */
    border-radius: 5px;
}

ul.clearfix.js-template-picker.flex.flex-wrap::-webkit-scrollbar-thumb {
    background-color: #f36279; /* Scroll thumb color */
    border-radius: 5px;
    border: 1px solid #ccc;    /* Optional: inner border */
}

ul.clearfix.js-template-picker.flex.flex-wrap::-webkit-scrollbar-thumb:hover {
    background-color: #e04760;
}

.no-preview-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 150px;
    background: #f5f5f5;
    border: 1px dashed #ccc;
    color: #999;
    font-size: 14px;
    border-radius: 4px;
}

/*
 * Page specific styles
 */

/* Arrow styling for wizard steps */
.arrow-down {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 10px;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid rgba(21, 43, 62, 0.5);
    transition: transform 0.3s ease;
}

/* Rotate arrow when step is expanded */
.wizard__step.is-expanded .arrow-down {
    transform: rotate(180deg);
    border-top-color: rgba(21, 43, 62, 1);
}

/* Ensure arrow is properly positioned in step labels */
.step__label {
    justify-content: space-between;
}

/* Step 4 Finalization Summary Styles */
.wcpp-finalize-summary {
    padding: 20px 0;
}

.wcpp-summary-section {
    margin-bottom: 30px;
    padding: 20px;
    background: #f9f9f9;
    border-radius: 8px;
    border-left: 4px solid #007cba;
}

.wcpp-summary-section h3 {
    margin: 0 0 20px 0;
    color: #152b3e;
    font-size: 1.4em;
    font-weight: 600;
}

.wcpp-summary-section h4 {
    margin: 0 0 15px 0;
    color: #333;
    font-size: 1.1em;
    font-weight: 500;
}

/* Text Customization Summary */
.wcpp-text-item {
    margin-bottom: 15px;
    padding: 12px;
    background: white;
    border-radius: 6px;
    border: 1px solid #e1e1e1;
    transition: all 0.3s ease;
}

.wcpp-text-item.wcpp-modified {
    border-color: #4CAF50;
    background: #f8fff8;
}

.wcpp-text-preview {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 5px;
}

.wcpp-text-label {
    font-weight: 600;
    color: #333;
    min-width: 80px;
}

.wcpp-text-value {
    font-style: italic;
    color: #555;
    flex: 1;
}

.wcpp-modified-badge {
    background: #4CAF50;
    color: white;
    padding: 2px 8px;
    border-radius: 12px;
    font-size: 0.8em;
    font-weight: 500;
}

.wcpp-text-details small {
    color: #666;
    font-size: 0.85em;
}

/* Image Customization Summary */
.wcpp-image-item {
    margin-bottom: 15px;
    padding: 12px;
    background: white;
    border-radius: 6px;
    border: 1px solid #4CAF50;
    background: #f8fff8;
}

.wcpp-image-preview {
    display: flex;
    align-items: center;
    gap: 15px;
}

.wcpp-image-info {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.wcpp-image-label {
    font-weight: 600;
    color: #333;
}

/* Preview Section */
.wcpp-preview-section {
    margin-bottom: 30px;
}

.wcpp-preview-section h3 {
    margin: 0 0 20px 0;
    color: #152b3e;
    font-size: 1.4em;
    font-weight: 600;
    text-align: center;
}

.wcpp-preview-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 20px;
}

.wcpp-preview-item {
    text-align: center;
    padding: 15px;
    background: white;
    border-radius: 8px;
    border: 2px solid #e1e1e1;
    transition: all 0.3s ease;
}

.wcpp-preview-item:hover {
    border-color: #007cba;
    box-shadow: 0 4px 12px rgba(0, 124, 186, 0.1);
}

.wcpp-preview-item--large {
    grid-column: 1 / -1;
    max-width: 400px;
    margin: 0 auto;
}

.wcpp-preview-item h4 {
    margin: 0 0 15px 0;
    color: #333;
    font-size: 1em;
    font-weight: 600;
}

.wcpp-preview-canvas-container {
    border: 1px solid #ddd;
    border-radius: 6px;
    padding: 10px;
    background: #fafafa;
    display: inline-block;
}

.wcpp-preview-canvas-container--large {
    padding: 15px;
}

.wcpp-preview-canvas-container canvas {
    display: block;
    border-radius: 4px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* Pricing and Checkout Section */
.wcpp-checkout-section {
    background: linear-gradient(135deg, #152b3e 0%, #1a365a 100%);
    padding: 25px;
    border-radius: 12px;
    color: white;
    box-shadow: 0 8px 24px rgba(21, 43, 62, 0.2);
}

.wcpp-price-summary {
    margin-bottom: 25px;
}

.wcpp-price-breakdown {
    background: rgba(255, 255, 255, 0.1);
    padding: 20px;
    border-radius: 8px;
    backdrop-filter: blur(10px);
}

.wcpp-price-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.wcpp-price-row:last-child {
    border-bottom: none;
}

.wcpp-price-row.wcpp-total-price {
    margin-top: 10px;
    padding-top: 15px;
    border-top: 2px solid rgba(255, 255, 255, 0.3);
    font-size: 1.2em;
    font-weight: 700;
}

.wcpp-price-label {
    font-weight: 500;
}

.wcpp-total-label {
    font-weight: 700;
    font-size: 1.1em;
}

.wcpp-price-value {
    font-weight: 600;
}

.wcpp-total-value {
    font-weight: 700;
    color: #4CAF50;
}

.wcpp-quantity-section {
    margin-bottom: 20px;
}

.wcpp-quantity-section .quantity {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
}

.wcpp-quantity-section .quantity input {
    width: 80px;
    padding: 8px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.1);
    color: white;
    text-align: center;
    font-weight: 600;
}

.wcpp-quantity-section .quantity input:focus {
    outline: none;
    border-color: #4CAF50;
    background: rgba(255, 255, 255, 0.2);
}

.wcpp-finalize-add-to-cart {
    width: 100%;
    padding: 15px 30px;
    font-size: 1.2em;
    font-weight: 700;
    background: linear-gradient(135deg, #4CAF50 0%, #45a049 100%);
    border: none;
    border-radius: 8px;
    color: white;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    box-shadow: 0 4px 12px rgba(76, 175, 80, 0.3);
}

.wcpp-finalize-add-to-cart:hover {
    background: linear-gradient(135deg, #45a049 0%, #3d8b40 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(76, 175, 80, 0.4);
}

.wcpp-cart-icon {
    font-size: 1.1em;
}

/* Responsive Design */
@media (max-width: 768px) {
    .wcpp-preview-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    
    .wcpp-preview-item--large {
        grid-column: 1;
    }
    
    .wcpp-text-preview {
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
    }
    
    .wcpp-text-label {
        min-width: auto;
    }
    
    .wcpp-image-preview {
        flex-direction: column;
        text-align: center;
        gap: 10px;
    }
    
    .wcpp-checkout-section {
        padding: 20px;
    }
    
    .wcpp-price-breakdown {
        padding: 15px;
    }
}

.wcpp-wizard-preview-container {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 10px;
}

.wcpp-text-inputs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.wcpp-preview-row {
    display: flex;
    gap: 20px;
    margin-bottom: 30px;
    justify-content: flex-start;
}

.wcpp-preview-column {
    flex: 1;
    max-width: 150px;
    text-align: center;
}

.wcpp-preview-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.wcpp-preview-header h4 {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: #333;
}

.wcpp-text-section {
    margin-bottom: 30px;
}

.wcpp-text-section h4 {
    margin: 0 0 15px 0;
    font-size: 16px;
    font-weight: 600;
    color: #333;
}

.wcpp-text-input-row input {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
    background: #fff;
}

.wcpp-text-input-row input:focus {
    outline: none;
    border-color: #007cba;
    box-shadow: 0 0 0 2px rgba(0, 124, 186, 0.2);
}

.wcpp-price-display {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    margin-bottom: 20px;
}

.wcpp-price-amount {
    font-size: 24px;
    color: #333;
    /*font-family: Athiti, sans-serif;*/
}

.wcpp-price-label {
    font-size: 12px;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 3px;
}

.wcpp-cart-controls {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 16px;
}

.wcpp-quantity-control {
    display: flex;
    align-items: center;
}

.wcpp-quantity-control input {
    width: 50px;
    padding: 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
    text-align: center;
    font-size: 14px;
    background: #fff;
}

.wcpp-quantity-control input:focus {
    outline: none;
    border-color: #007cba;
    box-shadow: 0 0 0 2px rgba(0, 124, 186, 0.2);
}

.wcpp-add-to-cart-btn {
    background: #007cba;
    color: white;
    border: none;
    padding: 12px 24px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.3s ease;
    text-transform: none;
    margin-top: 0px !important;
}
input#wcpp-finalize-quantity {
    max-height: 100% !important;
    font-size: 16px;
    width: 60px;
    height: 54px;
    border-radius: 5px;
}
.wcpp-add-to-cart-btn:hover {
    background: #005a8b;
}

.wcpp-add-to-cart-btn:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(0, 124, 186, 0.3);
}

/* Mobile responsive for new layout */
@media (max-width: 768px) {
    .wcpp-preview-row {
        flex-direction: column;
        gap: 15px;
    }
    
    .wcpp-preview-column {
        max-width: none;
    }
    .wcpp-cart-controls {
        justify-content: center;
    }
}