@font-face {
    font-family: "akaDylan Collage";
    src: url("/assets/fonts/akaDylan Collage.ttf");
}
@font-face {
    font-family: "akaDylan Open";
    src: url("/assets/fonts/akaDylan Open.ttf");
}
@font-face {
    font-family: "akaDylan Plain";
    src: url("/assets/fonts/akaDylan Plain.ttf");
}
@font-face {
    font-family: "A Mano Blaxtendida";
    src: url("/assets/fonts/AManoBlaxtendida.ttf");
}
@font-face {
    font-family: "A Year Without Rain";
    src: url("/assets/fonts/AYearWithoutRain.ttf");
}
@font-face {
    font-family: "JuneBug";
    src: url("/assets/fonts/JUNEBUG.TTF");
}
@font-face {
    font-family: "Rage Italic Regular";
    src: url("/assets/fonts/RAGE.TTF");
}
@font-face {
    font-family: "Autumn Moon";
    src: url("/assets/fonts/Autumn Moon - TTF.ttf");
}
@font-face {
    font-family: "Affectionately Yours";
    src: url("/assets/fonts/Affectionately Yours - OTF.otf");
}
@font-face {
    font-family: "Amatic Bold";
    src: url("/assets/fonts/amatic.bold.ttf");
    font-weight: normal;
    font-style: normal;                
}
@font-face {
    font-family: "Channel";
    src: url("/assets/fonts/Channel.ttf");
}

:root {
    --bs-blue: #0d6efd;
    --bs-indigo: #6610f2;
    --bs-purple: #6f42c1;
    --bs-pink: #d63384;
    --bs-red: #dc3545;
    --bs-orange: #fd7e14;
    --bs-yellow: #ffc107;
    --bs-green: #198754;
    --bs-teal: #20c997;
    --bs-cyan: #0dcaf0;
    --bs-black: #000;
    --bs-white: #fff;
    --bs-gray: #6c757d;
    --bs-gray-dark: #343a40;
    --bs-gray-100: #f8f9fa;
    --bs-gray-200: #e9ecef;
    --bs-gray-300: #dee2e6;
    --bs-gray-400: #ced4da;
    --bs-gray-500: #adb5bd;
    --bs-gray-600: #6c757d;
    --bs-gray-700: #495057;
    --bs-gray-800: #343a40;
    --bs-gray-900: #212529;
    --bs-primary: #0d6efd;
    --bs-secondary: #6c757d;
    --bs-success: #198754;
    --bs-info: #0dcaf0;
    --bs-warning: #ffc107;
    --bs-danger: #dc3545;
    --bs-light: #f8f9fa;
    --bs-dark: #212529;
    --bs-primary-rgb: 13,110,253;
    --bs-secondary-rgb: 108,117,125;
    --bs-success-rgb: 25,135,84;
    --bs-info-rgb: 13,202,240;
    --bs-warning-rgb: 255,193,7;
    --bs-danger-rgb: 220,53,69;
    --bs-light-rgb: 248,249,250;
    --bs-dark-rgb: 33,37,41;
    --bs-white-rgb: 255,255,255;
    --bs-black-rgb: 0,0,0;
    --bs-body-color-rgb: 33,37,41;
    --bs-body-bg-rgb: 255,255,255;
    --bs-font-sans-serif: system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
    --bs-font-monospace: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
    --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
    --bs-body-font-family: var(--bs-font-sans-serif);
    --bs-body-font-size: 1rem;
    --bs-body-font-weight: 400;
    --bs-body-line-height: 1.5;
    --bs-body-color: #212529;
    --bs-body-color-disabled: #21252990;
    --bs-body-bg: #fff;
    --bs-border-width: 1px;
    --bs-border-style: solid;
    --bs-border-color: #dee2e6;
    --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
    --bs-border-radius: 0.375rem;
    --bs-border-radius-sm: 0.25rem;
    --bs-border-radius-lg: 0.5rem;
    --bs-border-radius-xl: 1rem;
    --bs-border-radius-2xl: 2rem;
    --bs-border-radius-pill: 50rem;
    --bs-link-color: #0d6efd;
    --bs-link-hover-color: #0a58ca;
    --bs-code-color: #d63384;
    --bs-highlight-bg: #fff3cd;
}

.sticky {
    position: sticky;
    top: 0;
    background: white;
    z-index: 1000;
    box-shadow: 0 0 1rem 0 #0008;
}
.align-top {
    align-self: baseline;
}
.align-center {
    align-self: center;
}
.login-button button {
    margin-right: 0.5rem;
    border-radius: 0.5rem;
    padding: 0.25rem 0.5rem;
}
.overzicht-bestelling-button button {
    margin-right: 0.5rem;
    border-radius: 0.5rem;
    padding: 0.25rem 0.5rem;
}
.loginLoginForm label {
    width: 300px;
    display: block;
    margin-bottom: 1rem;
}
.loginLoginForm input {
    width: 300px;
    display: block;
    border-radius: 0.5rem;
    padding: 0.25rem 0.5rem;
}
.row, .container {
    --bs-gutter-x: 0;
    --bs-gutter-y: 0;
}
.logo {
    margin-left: 1rem;
    max-height: 90px;    
}
.menu {
    background-color: #333333;
    margin: 0;
}
.navbar-nav {
    flex-direction: row;
    justify-content: center;
}
.navbar-nav > li > a {
    padding: 0.5rem 1rem;
    color: #fff;
    display: block;
    text-decoration: none;
}
.navbar-nav > li:hover > a {
    color: #fff;
    background: #888;
}
h1 {
    padding: 2rem 0.5rem 1rem;
    font-size: 1.6rem;
}
h1.home{
    padding: 1rem 0.5rem 0.5rem 0;
}
img {
    max-width: 100%;
}
.row-grid {
    display: grid;
    grid-template-columns: 1fr 1fr; 
    gap: 0.5rem;
    margin-top: 1rem;
}
.main.container {
    margin-bottom: 1rem;
    min-height: calc(100vh - 550px);
    min-height: calc(100dvh - 550px);
}
.main.container p, .main.container form {
    padding-inline: 0.5rem;
}
.main.container p {
    padding-inline: 0rem !important;
}
.product-kleur-text p {
    padding-inline: 0rem !important;
}

@media screen and (max-width: 600px) {
    .row-grid{
        grid-template-columns: 1fr;
    }
}

.category-grid-top {
    display: grid;
    grid-template-columns: 1fr 1fr; 
    gap: 0.5rem;
    margin-bottom: 1rem;
}
.category-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 0.5rem;
    margin-bottom: 1rem;
}
.category-product-list-item {
    box-shadow: 0 0 0.5rem 0 #0002;
    padding: 0.5rem;
    text-decoration: none;
    color: #333;
    font-size: 1rem;
    line-height: 1;
    position: relative;
    padding-bottom: 3.5rem;
    background: #fff;
}
.category-product-list-item.cat{
    padding-bottom: 0.5rem !important;
}
.category-product-list-item:is(:hover,:focus) {
    box-shadow: 0 0 0.5rem 0 #000;
    background: #eee;
    color: #333;
}
ul.pagination {
    display: block;
    margin-top: 1rem;
}
ul.pagination > li {
    display: inline-block;
    margin-right: 0.5rem;
    box-shadow: 0 0 0.5rem 0 #0002;
}
ul.pagination > li > a {
    display: block;
    padding: 0 0.5rem;
    text-decoration: none;
    color: #333;
    height: 2rem;
    line-height: 2rem;
}
ul.pagination > li.active > span {
    display: block;
    padding: 0 0.5rem;
    text-decoration: none;
    color: #888;
    height: 2rem;
    line-height: 2rem;
    background: #eee;
    font-weight: bold;
}
ul.pagination > li.disabled > span {
    display: block;
    padding: 0 0.5rem;
    text-decoration: none;
    color: #888;
    background: #f8f8f8;
    height: 2rem;
    line-height: 2rem;
}
ul.pagination > li:is(:hover,:focus) > a {
    background: #eee;
    color: #333;
    box-shadow: 0 0 0.5rem 0 #000;
}
.product-price {
    position: absolute;
    bottom: 0.5rem;
    left: 0.5rem;
    right: 0;
}
.category-product-list-item img {
    box-shadow: 0 0 0.2rem 0 #0008;
    width: 100%;
    aspect-ratio: 1440 / 924;
    /* object-fit: cover; */
    object-fit: cover;
    margin-bottom: 0.5rem;
}
.main-product-image {
    margin: 0;
    /*border: 2px solid #333;*/
    width: 100%;
}
.sub-image-container {
    overflow-y: hidden;
    overflow-x: auto;
    margin: 0.5rem 0;
    background: #efefef;
    /*border: 2px solid #333;*/
}
.sub-image-hidden-container {
    width: 100%;
    margin: -2px 0 0 -2px;
    background: #fff;
    display: flex;
}
.sub-product-images {
    float: left;
    margin: -2px 0.5rem -2px 0;
    /*border: 2px solid #333;*/
    width: auto;
    height: 120px;
    cursor: pointer;
}
.sub-product-images:nth-last-child(1) {
    margin-right: 0;
}
.product-one-column {
    display: grid;
    grid-template-columns: 1fr;
}
.product-two-column {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
}
.product-options-one-column {
    display: grid;
    grid-template-columns: 1fr;
}
.product-options-columns-120,
.product-options-two-columns {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 0.5rem;
}
.product-options-columns-80 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
    gap: 0.5rem;
}
.product-options-columns-60 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(60px, 1fr));
    gap: 0.5rem;
}
.product-options-columns-40,
.product-options-six-columns {
    display: grid;
    grid-template-columns: repeat(auto-fit, 40px);
    gap: 0.5rem;
}
.vilt-kleuren {
    grid-template-columns: repeat(auto-fit, 98px);
}
.product-wrapper {
    border-top: 1px solid #0004;
    position: relative;
    margin: 0rem 0.5rem 0.5rem 0.5rem;
    margin: 0rem 0rem 0.5rem 0.5rem;
    font-size: 1rem;
    padding: 0.5rem;
    padding: 0.7rem;
    border: 2px solid #000;
    background-color: #fbfbfb;
    border: none;
    box-shadow: 0px 0px 10px 0 #0004;
}
.product-wrapper legend {
    font-size: 1rem;
}
.product-item {
    border: 1px solid #0004;
    position: relative;
    border-radius: 0.5rem;
    box-shadow: 0 0 0.5rem 0 #0002;
    overflow: hidden;
}

.product-item-input {
    width: 100%;
}
.product-item-input input {
    padding: 0.5rem;
    font-size: 1rem;
    width: 100%;
    height: 100%;
    border: 1px #888 dotted;
    outline: none;
    border-radius: 0.5rem;
    color: var(--bs-body-color);
}
.product-item-input input::placeholder {
    color: var(--bs-body-color-disabled);
}
.product-label {
    display: block;
    padding: 0.5rem;
    border-radius: 0.5rem;
    width: 100%;
    height: 100%;
    border: 0.3rem solid #fff;
    outline: 1px solid #0002;
    outline-offset: -0.3rem;
    background: #fff;
}

.product-item:not(.product-readonly-item):hover {
    box-shadow: 0 0 0.5rem #000;
}
.product-item:not(.product-readonly-item):hover label {
    cursor: pointer;
}
.product-radio {
    display: none;
}
.product-input-checkbox {
    display: none;
}
.product-prijs {
    font-weight: bold;
}


.product-readonly-item,
.input-required .product-item:not(.product-kleur-item) {
    border: 1px solid #ffb886;
}
.product-item.item-is-checked:not(.product-kleur-item) {
    border: 1px solid #ffb886;
    box-shadow: 0 0 0.5rem 0 #ffb886;
}
.product-readonly-item::after,
.product-item.item-is-checked:not(.product-kleur-item)::after {
    display: block;
    content: "";
    position: absolute;
    top: 0;
    right: 0.25rem;
    height: 0.75rem;
    width: 1rem;
    border: solid hsl(90 75% 40% / 1);
    border-width: 0 0 0.2rem 0.2rem;
    transform: rotate(-45deg);
    filter: drop-shadow(0 0 1px #000);
}
.product-readonly-item .product-label,
.product-item.item-is-checked:not(.product-kleur-item) .product-label {
    border: 0.3rem solid #ffb886;
}
.product-item.item-is-checked.product-kleur-item {
    box-shadow: 0 0 0.5rem 0 #888;
}
.product-item.item-is-checked.product-kleur-item .product-label {
    border: 0.3rem solid #ccc;
    background: #0001;
}

.product-item.item-is-checked.product-sample-item {
    box-shadow: 0 0 0.5rem 0 #080;
}
.product-item.item-is-checked.product-sample-item .product-label {
    border: 0.3rem solid #0c0;
    background: #0001;
}


.product-keuze {
    font-size: 1em;
    color: #aaa;
    padding-left: 2rem;
}
.product-sample-keuze {
    padding-left: 0rem;
}
.product-kleur-label {
    aspect-ratio: 1/1;
    font-size: 0.6rem;
    padding: 0.5rem 0.1rem;
    text-align: center;
}
.product-kleur-item.origineel {
    grid-column: 1/4;
    grid-column: 1/3;
    grid-row: 1/2;
    background: #fff;
    display: none;
}
.originele-kleuren.product-kleur-origineel-1 ~ :is(.product-kleur-wrapper-kleur2, .product-kleur-wrapper-kleur3, .product-sample-wrapper-sample) {
    display: none;
}
.originele-kleuren.product-kleur-origineel-0 {
    box-shadow : none;
}
.originele-kleuren.product-kleur-origineel-0 ~ :is(.product-kleur-wrapper-kleur2, .product-kleur-wrapper-kleur3, .product-sample-wrapper-sample) {
    margin-top: -0.3rem;
}
.originele-kleuren.product-kleur-origineel-1 ~ :is(.product-kleur-wrapper-kleur1, .product-kleur-wrapper-kleur2, .product-kleur-wrapper-kleur3, .product-sample-wrapper-sample) .required {
    display: none;
}

.product-kleur-wrapper legend, .color-selector-example {
    line-height: 40px;
    height: 40px;
    display: flex;
    place-items: center; 
    cursor: pointer;
    margin-bottom: 0;
}
.product-sample-wrapper legend, .sample-selector-example .sample-example-item {
    line-height: 40px;
    height: 40px;
    display: flex;
    place-items: center; 
    cursor: pointer;
    margin-bottom: 0.5rem;
}
.product-sample-keuze-nr {
    color: #aaa;
    width: 4ch;
}
.product-kleur-keuze {
    padding-left: 0;
}
.product-kleur-keuze-voorbeeld, .product-sample-keuze-voorbeeld {
    display: inline-block;
    width: 40px;
    height: 40px;
    border-radius: 0.5rem;
    border: 0.3rem solid #fff;
    outline: 1px solid #0002;
    outline-offset: 0rem;
    background-color: #fff;
    box-shadow: 0 0 0.5rem 0 #0002;
    background: radial-gradient(#0001 40%, #0004);
    margin-right: 0.5rem;
}
.product-kleur-wrapper .product-kleur, .product-sample-wrapper .product-sample {
    padding-top: 1rem;
}
.product-kleur-wrapper .color-selector, .product-sample-wrapper .sample-selector {
    display: block;
} 
.product-kleur-wrapper-common p {
    margin: 0;
}
.product-kleur-wrapper.hide-color .color-selector-example, .product-kleur-wrapper.hide-color .sample-selector-example, .product-sample-wrapper.hide-color .sample-selector-example {
    display: flex;
} 
.product-kleur-wrapper .color-selector-example,
.product-kleur-wrapper222.hide-color .color-selector {
    display: none;
} 
body {
    counter-reset: stap-counter;
}
.product-wrapper:not(.product-eind-wrapper, .product-kleur-wrapper-kleur1, .product-kleur-wrapper-kleur2, .product-kleur-wrapper-kleur3) {
    position: relative;
}
.product-wrapper:not(.product-wrapper:nth-of-type(1), .product-kleur-wrapper-kleur1, .product-kleur-wrapper-kleur2, .product-kleur-wrapper-kleur3) {
    margin-top: 3rem;
}
.product-wrapper:not(.product-eind-wrapper, .product-kleur-wrapper-kleur1, .product-kleur-wrapper-kleur2, .product-kleur-wrapper-kleur3)::before {
    counter-increment: stap-counter;
    content: "Stap " counter(stap-counter);    
    position: absolute;
    top: -2.5rem;
    left: 0.5rem;
    font-size: 1.5rem;
    font-weight: 700;
    color: #333333;
}
.product-kleur-wrapper-kleur1, .product-kleur-wrapper-kleur2, .product-kleur-wrapper-kleur3, .product-sample-wrapper-sample {
    margin-top: -0.3rem;
    border-top-width: 0;
}
.product-wrapper.product-eind-wrapper {
    border: none;
    box-shadow: 0px 0px 10px 0 #0004;
}
.product-wrapper.product-eind-wrapper::before {
    content: "Product overzicht";    
    position: absolute;
    top: -2.5rem;
    left: 0.5rem;
    font-size: 1.5rem;
    font-weight: 700;
    color: #333333;
}
.product-wrapper.product-eind-wrapper .custom-submit {
    border-color: #55c74b;
    color: #55c74b;
    background: #fff;
}
.product-wrapper.product-eind-wrapper .custom-submit:is(:hover,:focus-within) {
    border-color: #3b9c30;
    color: #3b9c30;
    background: #fff;
}
.product-wrapper.product-eind-wrapper .custom-submit.disabled {
/*     border-color: #2c7524;
color: #2c7524;
 */    border-color: #ffb886;
    color: #ffb886;
    
    /* background: #ccc; */
}
.product-cropper-wrapper {
    margin-left: 0;
    margin-top: 2.5rem;
}
.required-and-submit {
    display: grid;
    grid-template-columns: 1fr 2fr;
}
.input-error-message-block {
    position: absolute;
    background: #fee;
    right: 5px;
    left: 5px;
    padding: 15px;
    border: 2px solid #a00;
    bottom: 70px;
    cursor: pointer;
}
.input-error-message-block-close {
    position: absolute;
    top: 15px;
    right: 15px;
    width: 30px;
    height: 30px;
    border: 2px solid #a00;
    text-align: center;
    font-size: 2rem;
    line-height: 19px;
    color: #a00;
    background: #fcc;
}
details.product_content_details {
    border-radius: 4px;
    padding: 0.5em 1em;
    margin-bottom: 1em;
    transition: all 0.3s ease-in-out;
    max-width: 500px;
    text-wrap: pretty;
}
details.product_content_details > summary {
    font-weight: bold;
    cursor: pointer;
    position: relative;
    background-color: #fff;
    padding: 0.5em 1em;
    border: 1px solid #444;
    max-width: 500px;
}
details.product_content_details > summary::marker {
    display: none;
    content: none;
}
details.product_content_details > summary::before {
    content: "\002B";
    font-size: 2rem;
    font-weight: 700;
    text-shadow: 0 0 2px #000;
    color: #fff;
    border-color: red;
    position: absolute;
    right: 1rem;
    top: 0rem;
    line-height: 32px;
}
details.product_content_details[open] > summary::before {
    content: "\2212";
}
details.product_content_details .content-text {
    padding: 1rem;
}
details.product-kleur-wrapper, details.product-sample-wrapper {
    transition: all 0.3s ease-in-out;
}
details.product-kleur-wrapper summary, details.product-sample-wrapper summary {
    display: grid;
    grid-template-columns: 96px 1fr;
    line-height: 40px;
}
details.product-kleur-wrapper > summary::marker, details.product-sample-wrapper > summary::marker {
    display: none;
    content: none;
}
details.product-kleur-wrapper > summary::before, details.product-sample-wrapper > summary::before {
    content: "\002B";
    line-height: 54px;
    font-size: 2rem;
    font-weight: 700;
    text-shadow: 0 0 2px #000;
    color: #fff;
    border-color: red;
    position: absolute;
    right: 1rem;
    top: 0rem;
}
details.product-kleur-wrapper[open] > summary::before, details.product-sample-wrapper[open] > summary::before {
    content: "\2212";
}




.border {
    border: 1px solid red;
}
.cart_col_1 {
    display: inline-block;
    width: 18ch;
    margin-right: 0.25rem;
    text-align: right;
    font-weight: bold;
}
.cart_col_2 {
    display: inline-block;
}
.cart_col_price {
    display: inline-block;
}
.cart_option_kleur {
    position: relative; 
    top: 0.15rem; 
    display: inline-block; 
    width: 1rem; 
    height: 1rem; 
    border: 0.1rem solid #fff;
    box-shadow: 0 0 0.25rem 0 #0008;
}
.add-to-cart .required {
    color: #fa5959;
}
.product-wrapper.input-error {
    box-shadow: 0 0 0.25rem 0.1rem #800;
    background: #8002;
}
.product-eind-wrapper {
    display: grid;
    gap: 1rem;
    background: #f0f0f0;
}
.product-totalen > div {
    width: 100%;
}
.product-totalen > div > label {
    width: 100%;
    font-size: 1rem;
    font-weight: bold;
    padding-left: 0.5rem;
}
.product-totalen > div > :is(input,textarea) {
    padding: 0.5rem;
    font-size: 1rem;
    width: 100%;
    border: 1px #888 dotted;
    outline: none;
    border-radius: 0.5rem;
    margin: 0;
    color: var(--bs-body-color);
}
.product-totalen > div > input[readonly] {
    color: var(--bs-body-color-disabled);
    cursor: default;
    background: #f8f8f8;
}
.product-eind-wrapper .custom-submit {
    width: 100%;
    border: 4px solid #000;
    padding: 0.5rem;
    font-size: 1rem;
    font-weight: bold;
    background-color: #FF5E00;
    white-space: normal;
}
.sepia img {
    filter: sepia(1);
}
.zwart-wit img {
    filter: grayscale(1);
}
.kleur img {
    filter: none;
}
.c-cart {
    font-size: 1rem;
}
.c-cart h1 {
    font-size: 1.2rem;
}
.c-cart h2 {
    font-size: 1.1rem;
}
.c-cart h3 {
    font-size: 1.05rem;
}
.c-cart h4 {
    font-size: 1rem;
}
.c-cart-item-remove .c-button, tfoot button[name="update_cart"] {
    background: #ddd;
    margin-top: 0.5rem;
}
.c-cart-item-remove .c-button {
    margin-top: 0.5rem;
}
.c-cart-item {
    grid-template-columns: max-content 1fr max-content max-content max-content max-content;
    grid-template-areas: "image details prijsdetails aantal prijs remove";
    border: 2px solid #000;
}
.c-cart-item-image {
    grid-area: image;
    align-self: start;
    vertical-align: top !important;
}
.c-cart-item-name {
    grid-area: details;
    align-self: end;
    vertical-align: top !important;
    width: 100%;
}
.c-cart-item-price {
    grid-area: prijsdetails;
    align-self: end;
    vertical-align: top !important;
}
.c-cart-item-quantity {
    grid-area: aantal;
    align-self: start;
    vertical-align: top !important;
}
.c-cart-item-total {
    grid-area: prijs;
    align-self: start;
    vertical-align: top !important;
}
.c-cart-item-remove {
    grid-area: remove;
    align-self: start;
    vertical-align: top !important;
}
.product-readonly-wrapper {
    position: relative;
}
.product-readonly-info {
    width: 1.5rem;
    height: 1.5rem;
    line-height: 1.5rem;
    font-size: 1.0rem;
    background: #333;
    color: #eee;
    border-radius: 50%;
    cursor: pointer;
    display: inline-block;
    padding: 0;
    text-align: center;
    font-style: italic;
}
.product-readonly-info::after {
    content: attr(data-title);
    position: absolute;
    background: #333;
    padding: 0.5rem;
    top: 0.25rem;
    left: 0.5rem;
    right: 0.5rem;
    transform: translateY(-100%) scale(0);
    transform-origin: 12ch 100%;
    text-align: left;
    border-radius: 0.5rem;
    opacity: 0;
    transition: all 1s ease-in-out 0s;
    white-space: pre-wrap;
}
.product-readonly-info.show::after {
    transform: translateY(-100%) scale(1);
    opacity: 0.9;
    transition: all 1s ease-in-out 0s;
}
.c-orders-table :is(td,th) {
    padding: 0.25rem 0.5rem;
}
.c-order-summary:is(td,th) {
    padding: 0.25rem 0.5rem;
} 
.figuur-letter[data-font]                         { 
    padding-left: 0;
    font-size: 16px;
}
.figuur-letter[data-font=""]                      {
    font-weight: 400;
    font-size: 15px;
    font-family: "arial";
    line-height: 1.2;
}
.figuur-letter[data-font="Calibri Bold"]                { 
    font-weight: bold;
    line-height: 1.0;
    font-size: 24px;
    padding-left: 0px;
    font-family: "calibri";
}
.figuur-letter[data-font="A Year Without Rain"]         { 
    font-weight: bold;
    line-height: 1.2;
    font-size: 24px;
    padding-left: 0px;
    font-family: "A Year Without Rain";
}
.figuur-letter[data-font="A Mano Blaxtendida"]          { 
    font-weight: bold;
    line-height: 1.2;
    font-size: 24px;
    padding-left: 5px;
    font-family: "A Mano Blaxtendida";
}
.figuur-letter[data-font="Times Bold acct A.K. Rev.F"]  {
    font-weight: bold;
    line-height: 1.2;
    font-size: 24px;
    padding-left: 0px;
    font-family: "times";
}
.figuur-letter[data-font="akaDylan Collage"]            {
    font-weight: normal;
    line-height: 1.5;
    font-size: 16px;
    padding-left: 0px;
    font-family: "akaDylan Collage";
}
.figuur-letter[data-font="akaDylan Open"]               {
    font-weight: normal;
    line-height: 1.5;
    font-size: 16px;
    padding-left: 0px;
    font-family: "akaDylan Open";
}
.figuur-letter[data-font="akaDylan Plain"]              {
    font-weight: normal;
    line-height: 1.5;
    font-size: 16px;
    padding-left: 0px;
    font-family: "akaDylan Plain";
}
.figuur-letter[data-font="JuneBug"]                     {
    font-weight: normal;
    line-height: 1.5;
    font-size: 16px;
    padding-left: 1px;
    font-family: "JuneBug";
}
.figuur-letter[data-font="Rage Italic Regular"]         {
    font-weight: normal;
    line-height: 1.2;
    font-size: 20px;
    padding-left: 0px;
    font-family: "Rage Italic Regular";
}
.figuur-letter[data-font="Autumn Moon"]                 {
    font-weight: normal;
    line-height: 1.7;
    font-size: 20px;
    padding-left: 0px;
    font-family: "Autumn Moon";
}
.figuur-letter[data-font="Affectionately Yours"]        {
    font-weight: normal;
    line-height: 1.1;
    font-size: 20px;
    padding-left: 0px;
    font-family: "Affectionately Yours";
}
.figuur-letter[data-font="Amatic Bold"]                 {
    font-weight: bold;
    line-height: 1.0;
    font-size: 20px;
    padding-left: 0px;
    font-family: "Amatic Bold";
}
.figuur-letter[data-font="Channel"]                     {
    font-weight: normal;
    line-height: 2.0;
    font-size: 20px;
    padding-left: 0px;
    font-family: "Channel";
}
.figuur-letter[data-font="cursive"]                     {
    font-weight: bold;
    line-height: 1.3;
    font-size: 22px;
    padding-left: 0px;
    font-family: cursive;
}
.figuur-letter[data-font="fantasy"]                     {
    font-weight: normal;
    line-height: 1.3;
    font-size: 22px;
    padding-left: 0px;
    font-family: fantasy;
}
.figuur-letter[data-font="monospace"]                   {
    font-weight: bold;
    line-height: 1.2;
    font-size: 22px;
    padding-left: 0px;
    font-family: monospace;
}
.figuur-letter[data-font="sans-serif"]                  {
    font-weight: bold;
    line-height: 1.2;
    font-size: 22px;
    padding-left: 0px;
    font-family: sans-serif;
}
.figuur-letter[data-font="serif"]                       {
    font-weight: bold;
    line-height: 1.2;
    font-size: 22px;
    padding-left: 0px;
    font-family: serif;
}
.figuur-letter[data-font="Lato"]                        {
    font-weight: bold;
    line-height: 1.2;
    font-size: 22px;
    padding-left: 0px;
    font-family: "Lato";
}
.product-font-name[data-font="Calibri Bold"]                { 
    font-size: 19px;
    padding-left: 0px;
}
.product-font-name[data-font="A Year Without Rain"]         { 
    font-size: 16px;
    padding-left: 0px;
}
.product-font-name[data-font="A Mano Blaxtendida"]          { 
    font-size: 14px;
    padding-left: 5px;
}
.product-font-name[data-font="Times Bold acct A.K. Rev.F"]  {
    font-size: 18px;
    padding-left: 0px;
}
.product-font-name[data-font="akaDylan Collage"]            {
    font-size: 14px;
    padding-left: 0px;
}
.product-font-name[data-font="akaDylan Open"]               {
    font-size: 14px;
    padding-left: 0px;
}
.product-font-name[data-font="akaDylan Plain"]              {
    font-size: 14px;
    padding-left: 0px;
}
.product-font-name[data-font="JuneBug"]                     {
    font-size: 14px;
    padding-left: 1px;
}
.product-font-name[data-font="Rage Italic Regular"]         {
    font-size: 22px;
    padding-left: 0px;
}
.product-font-name[data-font="Autumn Moon"]                 {
    font-size: 18px;
    padding-left: 0px;
}
.product-font-name[data-font="Affectionately Yours"]        {
    font-size: 20px;
    padding-left: 0px;
}
.product-font-name[data-font="Amatic Bold"]                 {
    font-size: 27px;
    padding-left: 0px;
}
.product-font-name[data-font="Channel"]                     {
    font-size: 16px;
    padding-left: 0px;
}
.product-font-name[data-font="cursive"]                     {
    font-size: 26px;
    padding-left: 0px;
}
.product-font-name[data-font="fantasy"]                     {
    font-size: 22px;
    padding-left: 0px;
}
.product-font-name[data-font="monospace"]                   {
    font-size: 20px;
    padding-left: 0px;
}
.product-font-name[data-font="sans-serif"]                  {
    font-size: 18px;
    padding-left: 0px;
}
.product-font-name[data-font="serif"]                       {
    font-size: 24px;
    padding-left: 0px;
}
.product-font-name[data-font="Lato"]                        {
    font-size: 24px;
    padding-left: 0px;
}
.product-font-label .product-font-name {
    height: 45px;
    display: flex;
    text-align: center;
    align-items: center;
    justify-content: center;
}
.product-font-label .product-prijs {
    text-align: center;
}
footer{
    background-color: gray;
    color: #efefef;
}
footer img.logo{
    width: auto;
    height: auto;
    margin: 0;
}
footer.container{
    display: grid;
    grid-template-columns: 1fr;
    grid-gap: 1rem;
}
.col{
    padding: .5rem;
}
.c-cart-summary-items tr > td:nth-child(2),
.c-cart-totals tr > td:nth-child(2),
.c-cart-items td.c-cart-item-price, 
.c-cart-totals td.c-cart-item-price {
    text-align: right !important;
}
.c-cart-summary-totals-label-subtotal, 
.c-cart-summary-totals-subtotal, 
.c-cart-summary-totals-label-total, 
.c-cart-summary-totals-total {
    border-top: 2px solid #919191;
}
.c-order-details-table {
    width: 100%;
}
.c-order-details-table td, 
.c-order-details-table th {
    vertical-align: top;
    padding: 0.5rem 1rem;
}
.c-order-item-name {
    width: auto;
}


@media screen and (min-width: 500px) {
    footer.container{
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-gap: 1rem;
    }
    .col:nth-child(5){
        grid-column-start: 2;
        grid-row-start: 1;
    }
    .col:nth-child(6){
        grid-column-start: 2;
        grid-row-start: 2;
    }
}
@media screen and (min-width: 992px) {
    h1 {
        font-size: 2rem;
    }
    footer.container{
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        grid-gap: 1rem;
    }
    .grid-col-span-2{
        grid-column: span 2;
    }
    .grid-col-span-2.blue{
        grid-column: span 2;
    }
    .grid-col-span-3{
        grid-column: span 3;
    }
    .grid-col-span-4{
        grid-column: span 4;
    }
    .col:nth-child(5){
        grid-column-start: 4;
        grid-row-start: 1;
    }
    .col:nth-child(6){
        grid-column-start: 4;
        grid-row-start: 2;
    }
}    
@media screen and (max-width: 991.9999px) {
    #content2 {
        padding: 0.5rem;
        max-width: 100vw;
        max-width: 100dvh;
        overflow-x: hidden;
    }
    .c-cart-items thead {
        display: none;
    }
    .c-cart-item {
        display: grid;
        grid-template-columns: max-content 1fr max-content;
        grid-template-areas:
        "image details prijsdetails"
        "remove aantal prijs";
        margin-bottom: 0.5rem;
    }
    .c-order-items thead {
        display: none;
    }
    .c-order-items .cart_col_1 {
        display: none;
    }
    .c-order-item {
        display: grid;
        grid-template-columns: max-content 1fr max-content;
        grid-template-areas:
        "image details prijsdetails"
        "remove aantal prijs";
        margin-bottom: 0.5rem;
    }
    .c-cart-item .cart_col_1 {
        text-align: left;
    }
    .c-cart-item .adjustment_wrapper {
        height: 3rem;
    }
    .c-cart-item .cart_col_price::before {
        content: "\00a0";
        display: block;
    }
    .c-cart-items td, .c-cart-items th, .c-cart-totals td, .c-cart-totals th {
        padding: 0.5em 0.5em !important;
    }
    .c-checkout.c-cart.c-checkout-cart :is(h2, h3, .c-cart-optional) {
        padding-inline: 0.5em;
    }
    .c-cart-item .c-cart-item-total {
        text-align: right;
    }
}
@media screen and (max-width: 600px) {
    .c-cart-items thead {
        display: none;
    }
    .c-cart-item {
        display: grid;
        grid-template-columns: 1fr max-content;
        align-items: end;
        grid-template-areas:
        "image remove"
        "details prijsdetails"
        "aantal prijs";
    }
    .c-orders-table {
        width: 100%;
    }
    .c-orders-table thead {
        display: none;
    }
    .c-orders-table tbody tr {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-rows: 1fr 1fr;
    }
    .c-orders-table tbody tr {
        border: 1px solid #0008;
    }
    .c-orders-table tbody tr td:nth-child(1)  {
        grid-column: 1/2;
        grid-row: 1/2;    
    }
    .c-orders-table tbody tr td:nth-child(2)  {
        grid-column: 2/3;
        grid-row: 1/2;    
    }
    .c-orders-table tbody tr td:nth-child(3)  {
        grid-column: 3/4;
        grid-row: 1/2;    
    }
    .c-orders-table tbody tr td:nth-child(4)  {
        grid-column: 2/3;
        grid-row: 2/3;    
    }
    .c-orders-table tbody tr td:nth-child(5)  {
        grid-column: 3/4;
        grid-row: 2/3;    
    }
    .c-orders-table tbody tr td:nth-child(1):before {
        content: "Bestelling";
        display: block;
        font-weight: bold;
    }
    .c-orders-table tbody tr td:nth-child(2):before {
        content: "Datum";
        display: block;
        font-weight: bold;
    }
    .c-orders-table tbody tr td:nth-child(3):before {
        content: "Bedrag";
        display: block;
        font-weight: bold;
    }
    .c-orders-table tbody tr td:nth-child(4):before {
        content: "Status";
        display: block;
        font-weight: bold;
    }
    .c-orders-table tbody tr td:nth-child(5):before {
        content: "Factuur";
        display: block;
        font-weight: bold;
    }
    .c-order-summary {
        list-style: none;
        display: block;
        padding: 0;
        margin: 0 0 1rem 0;
    }
    .c-order-summary li {
        display: inline-block;
        margin-right: 1rem;
    }
    .c-order-summary-label {
        display: block;
        font-weight: bold;
    }
    .c-order-summary-value {
        display: block;
    }
    .c-order-details-table { 
        width: 100%;
        margin-bottom: 1rem;
    }
    .c-order-details-table thead {
        display: none;
    }
    .c-order-details-table tfoot td[colspan="2"] {
        display: none;
    }
    .c-order-details-table tbody tr :is(td,th) {
        padding: 0.25rem 0.5rem;
    }
    .c-order-details-table tbody tr {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-rows: 1fr 1fr;
    }
    .c-order-details-table tbody tr {
        border: 1px solid #0008;
    }
    .c-order-details-table tbody tr td:nth-child(1)  {
        grid-column: 1/2;
        grid-row: 1/2;    
    }
    .c-order-details-table tbody tr td:nth-child(2)  {
        grid-column: 2/4;
        grid-row: 1/2;    
    }
    .c-order-details-table tbody tr td:nth-child(3)  {
        grid-column: 1/2;
        grid-row: 2/3;    
    }
    .c-order-details-table tbody tr td:nth-child(4)  {
        grid-column: 2/3;
        grid-row: 2/3;    
    }
    .c-order-details-table tbody tr td:nth-child(5)  {
        grid-column: 3/4;
        grid-row: 2/3;    
    }
    .c-order-details-table tbody tr td:nth-child(1):before {
        content: "Aantal";
        display: block;
        font-weight: bold;
    }
    .c-order-details-table tbody tr td:nth-child(2):before {
        content: "Product";
        display: block;
        font-weight: bold;
    }
    .c-order-details-table tbody tr td:nth-child(3):before {
        content: "Excl.BTW";
        display: block;
        font-weight: bold;
    }
    .c-order-details-table tbody tr td:nth-child(4):before {
        content: "BTW";
        display: block;
        font-weight: bold;
    }
    .c-order-details-table tbody tr td:nth-child(5):before {
        content: "Incl.BTW";
        display: block;
        font-weight: bold;
    }
    .c-order-details-table tfoot tr {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-rows: 1fr;
    }
    .c-order-details-table tfoot tr :is(td,th) {
        padding: 0.25rem 0.5rem;
    }
    .c-order-details-table tfoot tr td:nth-child(2)  {
        grid-column: 2/4;
        grid-row: 1/2;    
    }
    .c-order-details-table tfoot tr td:nth-child(3)  {
        grid-column: 1/2;
        grid-row: 2/3;    
    }
    .c-order-details-table tfoot tr td:nth-child(4)  {
        grid-column: 2/3;
        grid-row: 2/3;    
    }
}
@media screen and (min-width: 1024px) and (min-height: 60px) {
    .sticky {
        position: sticky;
        top: 0;
        background: white;
        z-index: 1000;
        box-shadow: 0 0 1rem 0 #0008;
    }
}

.cart-debug99 {
    display: block !important;
}
.mega-menu2 {
    background: #fff;
    position: relative;
    z-index: 1000;
}
.mega-menu2 ul {
    list-style: none;
    padding : 0;
    margin: 0;
    color: #333;
    line-height: 2;
}
.mega-menu2 a {
    color: #333;
    text-decoration: none;
    text-align: left;
    font-size: 1.3rem;
}
.mega-menu2 .open-mobile-menu {
    display: none;
}
.mega-menu2 .searchitem-mobile {
    display: none;
}
.mega-menu2 .title-mobile-menu {
    display: none;
}
.mega-menu2 .sub-menu {
    display: none;
}
.mega-menu2 .sub-menu-back {
    display: none;
}
.mega-menu2 li.item0 {
    display: none;
}
.mega-menu2 li.parent > a {
    font-weight: 700;
}
.mega-menu2 ul.level0 {
    display: flex;
    gap: 0.1rem;
}
.mega-menu2 ul.level0 > li {
    padding: 0.25rem 1rem;
    flex-grow: 1;
    background: #333;
    color: #fff;
    text-align: center;
}
.mega-menu2 ul.level0 > li > a {
    color: #fff;
}
.mega-menu2 ul.level0 > li:not(.searchitem):hover > ul {
    display: grid;
}
.mega-menu2 ul.level0 > li.searchitem a {
    display: block;
    text-align: center;
}
.mega-menu2 ul.level1 {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    color: #333;
    background: #fff;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 0 1rem;
    box-shadow: 0 0 1rem 0 #0004;
    padding: 1rem;
    text-align: left;
}
.mega-menu2 ul.level1 > li.menuitem.grid-col1 {
    grid-column: 1/2;
}
.mega-menu2 ul.level1 > li.menuitem.grid-col2 {
    grid-column: 2/3;
}
.mega-menu2 ul.level1  li.menuitem.grid-col3 {
    grid-column: 3/4;
}
.mega-menu2 ul.level1 > .menu-image {
    grid-column: 4/5;
    grid-row: 1/10;
}
.product-maat-categorie {
    position: relative;
}
.product-maat-categorie:not(:nth-last-child(1)) {
    margin-bottom: 1rem;
}

#form-searchitem {
    display: flex;
    gap: 0.25rem;
}

.submit-button-search {
    white-space: nowrap;
}
.search-manager-grid {
    max-width: 500px;
}
#search-frontend {
    width: 100%;
}


@media (max-width: 991px) {
    .mega-menu2 {
        background: #333;
        color: #fff;
        padding: 0.5rem 1rem;
        margin-top: 1rem;
    }    
    .mega-menu2 .menu-wrapper {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background: #fffe;
        display: block;
        transform: translateX(100vw);
        transition: transform 0.5s ease-in-out;
        z-index: 100;
    }
    .mega-menu2 .open-mobile-menu {
        display: inline-block;
        cursor: pointer;
        width: 2rem;
        font-size: 2rem;
    }
    .mega-menu2 .searchitem-mobile {
        position: absolute;
        right: 0.5rem;
        top: 0.3rem;
        display: inline-block;
        width: calc(100% - 4.3rem);
        font-size: 2rem;
    }
    .mega-menu2 .searchitem-mobile #search-text-mobile {
        width: calc(100% - 4rem);
    }
    .mega-menu2 .searchitem-mobile button {
        /* AANPASSING GJ 7-10-2024 */
        /* margin-left: 0.5rem; */
        margin-left: 0;
        width: 3.5rem;
        z-index: 99;
    }
    .mega-menu2 .title-mobile-menu {
        display: block;
    }
    .mega-menu2 .sub-menu {
        display: inline-block;
        width: 1rem;
        text-align: center;
    }
    .mega-menu2 .sub-menu-back {
        display: inline-block;
        width: 1rem;
        text-align: center;
    }
    .mega-menu2 .searchitem {
        display: none;
    }
    .mega-menu2 li.item0 {
        display: block;
    }
    .mega-menu2 li.item0 > a {
        font-weight: 700;
    }
    .mega-menu2 li {
        padding: 0.5rem 2rem;
        border-bottom: 1px solid #333;
        line-height: 2rem;
    }
    .mega-menu2 li > a {
        color: #333;
        width: calc(100% - 1.3rem);
        display: inline-block;
    }
    .mega-menu2 li > .sub-menu {
        transform: translateX(1rem);
        cursor: pointer;
        display: inline-block;
    }
    .mega-menu2 li > .sub-menu-back {
        transform: translateX(1rem);
        cursor: pointer;
        display: inline-block;
    }
    .mega-menu2 li > .close-mobile-menu {
        position: absolute;
        top: 0;
        right: 1rem;
        cursor: pointer;
    }
    .mega-menu2 .title-mobile-menu {
        font-weight: 700;
        font-size: 1.5rem;
        border-bottom: 2px solid #333;
        line-height: 3rem;
        z-index: 100;
        background: #0002 !important;
    }
    .mega-menu2 .title-mobile-menu .close-mobile-menu {
        padding-top: 0.25rem;
        cursor: pointer;
    }
    .mega-menu2 li.item0 {
        background: #0001 !important;
    }
    .mega-menu2 ul.level0 {
        display: flex;
        flex-direction: column;
        gap: 0rem;
    }
    .mega-menu2 ul.level0 > li {
        padding: 0.25rem 2rem;
        flex-grow: 1;
        background: #fffe;
        color: #333;
        text-align: left;
    }
    .mega-menu2 ul.level0 > li > a {
        color: #333;
    }
    .mega-menu2 ul.level0 > li.active {
        z-index: 10;
    }
    .mega-menu2 ul.level0 > li.active > ul {
        transform: translateX(0);
    }
    .mega-menu2 ul.level1,
    .mega-menu2 ul.level2,
    .mega-menu2 ul.level3 {
        display: grid;
        position: fixed;
        top: 0rem;
        bottom: 0;
        left: 0;
        right: 0;
        color: #333;
        background: #fffe;
        grid-template-columns: 1fr;
        grid-auto-rows: max-content;
        gap: 0rem;
        box-shadow: none;
        padding: 3.5rem 0 0 0;
        z-index: 50;
        transform: translateX(100vw);
        translate: 0 0;
        transition: transform 0.5s ease-in-out;
        overflow-x: hidden;
        overflow-y: auto;
    }
    .mega-menu2 ul.level1 > li,
    .mega-menu2 ul.level2 > li,
    .mega-menu2 ul.level3 > li {
        grid-column: auto !important;
        background: #fffe;
    }
    .mega-menu2 ul.level1 > .menu-image,
    .mega-menu2 ul.level2 > .menu-image,
    .mega-menu2 ul.level3 > .menu-image {
        display: none;
    }
    .mega-menu2 ul.level1 > li.active,
    .mega-menu2 ul.level2 > li.active,
    .mega-menu2 ul.level3 > li.active {
        z-index: 10;
    }
    .mega-menu2 ul.level1 > li.active > ul,
    .mega-menu2 ul.level2 > li.active > ul,
    .mega-menu2 ul.level3 > li.active > ul {
        transform: translateX(0);
    }
    body.menu-active {
        overflow: hidden;
    }
    body.menu-active .mega-menu2 .menu-wrapper {
        transform: translateX(0);
    }
}
@media (max-width: 767px) {
    .product-wrapper {
        margin: 0rem 0rem 0.5rem 0rem;
    }
    .product-content {
        padding: 0.5rem;
    }
}



#content::before {
    z-index: -1;
}
.product-container .product-grid {
    display: grid !important;
    grid-template-areas:
        "image options"
        "content options"
        "end end";
    grid-template-columns: 7fr 5fr;
    grid-template-rows: min-content 1fr min-content;
    gap: 0.5rem;
}
.product-container .product-grid-image {
    width: 100%;
    grid-area: image;
    padding: 0;
    margin: 0;
    max-width: 100vw;
    max-width: 100dvw;
}
.product-container .product-grid-options {
    width: 100%;
    grid-area: options;
    padding: 0;
    margin: 0;
    max-width: 100vw;
    max-width: 100dvw;
}
.product-container .product-grid-content {
    width: 100%;
    grid-area: content;
    padding: 0;
    margin: 0;
    max-width: 100vw;
    max-width: 100dvw;
}
.product-container .product-grid-end {
    width: 100%;
    grid-area: end;
    padding: 0;
    margin: 0;
}
.product-container .product-grid-image .sub-image-container {
    margin-bottom: 0;
    background: #fff;
}
.product-container .product-grid-content details.product_content_details {
    padding: 0.5em 0.5em;
    margin-bottom: 1em;
}
.product-container .product-grid-options .product-wrapper {
    margin-inline: 0rem;
}
.product-container .product-eind-wrapper {
    background: #fbfbfb;
}
.product-container .product-eind-wrapper {
    margin-top: 3rem;
}
.product-wrapper.product-kleur-wrapper.product-kleur-wrapper-common {
    display: grid;
    grid-template-columns: max-content 1fr;
    align-items: center;
    gap: 1rem;
}
#product-kleur-origineel-knop {
    font-size: 1rem;
    background: radial-gradient(#0001 40%, #0004); 
    display: block;
    padding: 0.5rem;
    border-radius: 0.5rem;
    border: 0.3rem solid #fff;
    outline: 1px solid #0002;
}
#product-kleur-origineel-knop:hover {
    box-shadow: 0 0 0.5rem #000;
}        
.product-wrapper.product-kleur-wrapper.product-kleur-wrapper-common.product-kleur-origineel-0 {
    padding: 0;
}
.product-wrapper.product-kleur-wrapper.product-kleur-wrapper-common.product-kleur-origineel-0 > div {
    display: none;
}

@media (max-width: 991px) {
    .product-container .product-grid {
        grid-template-areas:
            "image"
            "options"
            "content"
            "end";
        grid-template-columns: 1fr;
        grid-template-rows: min-content 1fr min-content min-content;
        gap: 0.5rem;
    }
    .product-container .product-grid-options {
        margin-top: 3rem;
    }
    .product-container .product-grid-content {
        margin-top: 3rem;
    }
    #save-cropped-image {
        padding-inline: 0.2rem;
    }
    .required-and-submit {
        grid-template-columns: minmax(max-content,1fr) 2fr;
        gap: 1rem;
    }
    .menu-searchitem.show-search {
        display: none !important;
    }
}


.product-info-popup {
    width: 1.5rem;
    height: 1.5rem;
    line-height: 1.5rem;
    font-size: 1.0rem;
    background: #333;
    color: #eee;
    border-radius: 50%;
    cursor: pointer;
    display: inline-block;
    padding: 0;
    text-align: center;
    font-style: italic;
    font-weight: normal;
    position: absolute;
    right: 0.5rem;
    top: 0.5rem;
    cursor: help;
}
.product-info-popup-wrapper {
    position: fixed;
    inset: 2rem 5rem;
    display: none;
    z-index: 100000;
    background: #fff;
    outline: 100vmax solid #000c;
    aspect-ratio: 16 / 9;
    margin: auto;
    max-width: 90vw;
    max-height: 90vh;        
}
.product-info-popup-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.product-info-popup-text {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0.5rem;
    text-align: center;
}
.product-info-popup-wrapper::before {
    content: "";
    position: absolute;
    inset: -100vmax;
    z-index: -1;
}
.product-info-popup-wrapper::after {
    content: "X";
    position: fixed;
    top: 1rem;
    right: 2rem;
    color: #fff;
    font-size: 2rem;
}
.product-info-popup.show + .product-info-popup-wrapper {
    display: block;
}


.register > form {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.register > form input[type="submit"] {
    padding: 0.5em 1em;
    border: none;
    background: #cbf1d2;
    border-radius: 3px;
    font-size: 1em;
    cursor: pointer;
    text-decoration: none;
}
.register > form input[type="submit"]:is(:hover,:focus) {
    color: #222222;
    background: #7bdb8c;
}


.c-checkout-new-user form, .c-checkout-existing-user form, .c-checkout-new-user form .c-field, .c-checkout-existing-user form .c-field {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}


@media (max-width: 1024px) {

    .c-checkout-summary, .cart_content_details h2, .main.container .cart_content_details p {
        padding-inline: 0.5rem !important;
    }
    
}


.register form {
    max-width: 500px;
}