﻿:root {
  --clr-black: #000;
  --clr-white: #FFF;
  --clr-orange: #EB8C23;
  --clr-grey: #d6d6d6;
  --clr-grey-light: #f0f0f0;
}
/* #region Standaard */
.umb-block-grid {
  --umb-block-grid--areas-row-gap: 2rem;
  --umb-block-grid--areas-column-gap: 2rem;
  --umb-block-grid--column-gap: 0;
  --umb-block-grid--row-gap: 0;
}
@media (max-width: 991px) {
  .umb-block-grid {
    --umb-block-grid--areas-row-gap: 0;
    --umb-block-grid--areas-column-gap: 2;
    --umb-block-grid--column-gap: 0;
    --umb-block-grid--row-gap: 0;
    margin-bottom: 1rem;
  }
}
.umb-block-grid__layout-container {
  position: relative;
  display: grid;
  grid-template-columns: repeat(var(--umb-block-grid--grid-columns, 1), minmax(0, 1fr));
  grid-auto-flow: row;
  grid-auto-rows: minmax(50px, -webkit-min-content);
  grid-auto-rows: minmax(50px, min-content);
  -moz-column-gap: var(--umb-block-grid--column-gap, 0);
  column-gap: var(--umb-block-grid--column-gap, 0);
  row-gap: var(--umb-block-grid--row-gap, 0);
}
.umb-block-grid__layout-item {
  position: relative;
  /* For small devices we scale columnSpan by three, to make everything bigger than 1/3 take full width: */
  grid-column-end: span min(calc(var(--umb-block-grid--item-column-span, 1) * 3), var(--umb-block-grid--grid-columns));
  grid-row: span var(--umb-block-grid--item-row-span, 1);
  margin-block: 1.5rem;
}
.umb-block-grid__area-container,
.umb-block-grid__block--view::part(area-container) {
  position: relative;
  display: grid;
  grid-template-columns: repeat(var(--umb-block-grid--area-grid-columns, var(--umb-block-grid--grid-columns, 1)), minmax(0, 1fr));
  grid-auto-flow: row;
  grid-auto-rows: minmax(50px, -webkit-min-content);
  grid-auto-rows: minmax(50px, min-content);
  -moz-column-gap: var(--umb-block-grid--areas-column-gap, 0);
  column-gap: var(--umb-block-grid--areas-column-gap, 0);
  row-gap: var(--umb-block-grid--areas-row-gap, 0);
}
.umb-block-grid__area {
  position: relative;
  height: 100%;
  display: flex;
  flex-direction: column;
  /* For small devices we scale columnSpan by three, to make everything bigger than 1/3 take full width: */
  grid-column-end: span min(calc(var(--umb-block-grid--area-column-span, 1) * 3), var(--umb-block-grid--area-grid-columns));
  grid-row: span var(--umb-block-grid--area-row-span, 1);
}
.site-container--sidebar .umb-block-grid__area-container {
  padding-inline: 0;
}
.site-container--sidebar .umb-block-grid__layout-item .umb-block-grid__layout-item {
  padding-left: 4rem;
}
@media (min-width: 1024px) {
  .umb-block-grid__layout-item {
    grid-column-end: span min(var(--umb-block-grid--item-column-span, 1), var(--umb-block-grid--grid-columns));
  }
  .umb-block-grid__area {
    grid-column-end: span min(var(--umb-block-grid--area-column-span, 1), var(--umb-block-grid--area-grid-columns));
  }
}
/* #endregion */
/* #region Overrides */
.umb-block-grid {
  margin-bottom: 3.5rem;
  max-width: 100vw;
  overflow-x: hidden;
}
.umb-block-grid__area-container {
  width: 100%;
  margin-inline: auto;
  padding-inline: 15px;
}
@media (min-width: 576px) {
  .umb-block-grid__area-container {
    max-width: 540px;
  }
}
@media (min-width: 768px) {
  .umb-block-grid__area-container {
    max-width: 720px;
  }
}
@media (min-width: 992px) {
  .umb-block-grid__area-container {
    max-width: 960px;
  }
}
@media (min-width: 1200px) {
  .umb-block-grid__area-container {
    max-width: 1140px;
  }
}
@media (min-width: 1400px) {
  .umb-block-grid__area-container {
    max-width: 1320px;
  }
}
@media (min-width: 1480px) {
  .umb-block-grid__area-container {
    max-width: 1460px;
  }
}
/* #endregion */
/* #region Custom Grid Options */
.umb-block-grid__layout-item {
  padding-top: 0.5rem;
}
.umb-block-grid__layout-item.gridrow--alt {
  /* Alternatieve vormgeving */
}
.umb-block-grid__layout-item.gridrow--margin-top {
  /* Rij zonder margin boven */
  margin-top: 0;
  padding-top: 0;
}
.umb-block-grid__layout-item.gridrow--margin-bottom {
  /* Rij zonder margin onder */
  margin-bottom: 0;
  padding-bottom: 0;
}
@media (min-width: 991px) {
  .umb-block-grid__layout-item.gridrow--hide-desktop {
    display: none;
  }
}
@media (max-width: 990px) {
  .umb-block-grid__layout-item {
    margin-block: 0;
  }
  .umb-block-grid__layout-item.gridrow--reverse-mobile .umb-block-grid__area-container {
    display: flex;
    flex-direction: column-reverse;
  }
  .umb-block-grid__layout-item.gridrow--hide-mobile {
    display: none;
  }
  .umb-block-grid__layout-item.gridrow--margin-top {
    padding-top: 0.5rem;
  }
  .umb-block-grid__layout-item.gridrow--margin-bottom {
    padding-bottom: 0.5rem;
  }
  .umb-block-grid__area.gridblock--hide-mobile {
    display: none;
  }
}
/* #endregion */
.btn {
  background-color: var(--clr-orange);
  color: var(--clr-white);
}
.btn:hover {
  border: 1px solid var(--clr-orange);
}
.bg-grey-light {
  background-color: var(--clr-grey-light);
}
.bor-radius {
  border-radius: 0.25rem;
}
.bor-top-part-grey:before {
  content: "";
  width: 180px;
  height: 3px;
  background-color: var(--clr-grey-light);
  display: block;
  top: -10px;
  position: relative;
}
/*#region modals */
.close-modal {
  width: 30px;
  height: 30px;
  background: url(/lib/img/icons/ic-close.svg) no-repeat center center;
  display: block;
  position: absolute;
  right: 10px;
  top: 10px;
}
/*#endregion */
/*#region language select */
.language-select .dropdown-menu {
  padding: 5px 12px;
  min-width: 85px;
  z-index: 9999;
}
.language-select a {
  color: var(--clr-black);
}
.language-select .nav-link {
  padding-left: 8px !important;
  padding-right: 8px !important;
}
.language-select img {
  width: 20px;
}
@media (max-width: 1199px) {
  .language-select .nav-link {
    margin-right: 0;
    background-color: transparent !important;
  }
  .language-select img {
    float: left;
    margin-right: 5px;
    position: relative;
    top: 3px;
  }
}
/*#endregion */
/* #region Paginering */
.pagination-container {
  display: flex;
  justify-content: space-between;
}
.pagination-container .hide {
  visibility: hidden;
}
.pagination-container .pagination {
  justify-content: center;
  display: flex;
  margin: 0;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.pagination-container .pagingdivider {
  font-size: 25px;
  padding-top: 3px;
}
.pagination-container a.number {
  background-color: transparent;
  border: 1px solid var(--clr-orange);
  color: var(--clr-black);
  display: block;
  font-size: 0.875rem;
  text-decoration: none;
  margin-top: 5px;
  padding: 10px 14px;
  border-radius: 5px;
}
.pagination-container a.number:hover {
  background-color: var(--clr-orange);
  color: var(--clr-white);
}
.pagination-container a.prev,
.pagination-container a.next {
  background-color: transparent;
  border: 1px solid var(--clr-orange);
  height: 40px;
  width: 60px;
  background-repeat: no-repeat;
  background-position: center center;
  position: relative;
  top: 5px;
  border-radius: 5px;
}
.pagination-container a.prev:hover,
.pagination-container a.next:hover {
  background-color: var(--clr-orange);
  color: var(--clr-white);
}
.pagination-container a.prev {
  background-image: url(/lib/img/icons/ic-arrow-black-small-back.svg);
  margin-right: 10px;
}
.pagination-container a.prev:hover {
  background-image: url(/lib/img/icons/ic-arrow-white-small-back.svg);
}
.pagination-container a.next {
  background-image: url(/lib/img/icons/ic-arrow-black-small.svg);
  margin-left: 10px;
}
.pagination-container a.next:hover {
  background-image: url(/lib/img/icons/ic-arrow-white-small.svg);
}
.pagination-container .active a {
  background-color: var(--clr-orange);
  color: var(--clr-white);
}
@media (max-width: 991px) {
  .pagination-container {
    margin-top: 10px;
    margin-bottom: 10px;
  }
}
/* #endregion */
/*#region positions */
.sticky-offset {
  top: 20px;
}
/*#endregion */
a.phone,
a.email,
a.account,
a.top-cart {
  display: block;
  position: relative;
  padding-left: 34px;
  background: no-repeat left center;
  line-height: 32px;
  background-size: 26px 26px;
  margin: 12px 0;
}
a.phone {
  background-image: url('/lib/img/ic-phone.svg');
}
a.email {
  background-image: url('/lib/img/ic-email.svg');
}
a.account,
a.top-cart {
  display: inline-block;
  height: 36px;
  background-size: 36px 36px;
  color: var(--clr-black);
}
a.account {
  background-image: url('/lib/img/icons/ic-account.svg');
  padding-left: 40px;
  margin-right: 1rem;
}
a.fav {
  background-image: url('/lib/img/icons/ic-heart.svg');
  width: 40px;
  height: 40px;
  display: block;
  cursor: pointer;
}
a.fav.active {
  background-image: url('/lib/img/icons/ic-heart-red.svg');
}
a.pwd {
  text-decoration: none;
  color: var(--clr-black);
  background: url(/lib/img/icons/ic-arrow-black-small2.svg) no-repeat center right;
  padding-right: 15px;
}
/*#region Cart */
a.top-cart {
  width: 36px;
  background-image: url('/lib/img/icons/ic-top-cart.svg');
}
a.top-cart span {
  position: absolute;
  top: -10px;
  right: -5px;
  background-color: var(--clr-orange);
  color: var(--clr-white);
  border-radius: 50%;
  width: 20px;
  height: 20px;
  line-height: 15px;
  text-align: center;
  font-size: var(--fnt-size-small);
}
.cart .delete {
  border: 0;
  background: url(/lib/img/icons/ic-delete.svg) no-repeat center center;
  display: inline-block;
  width: 30px;
  height: 30px;
  padding: 0;
  flex-shrink: 0;
}
.cart a {
  color: var(--clr-black);
  text-decoration: none;
}
.pd-quantity {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: var(--clr-white);
  border-radius: 1.78125rem;
  padding: 12px 10px;
}
.pd-quantity .button-minus,
.pd-quantity .button-plus {
  border: 0;
  background-color: transparent;
  color: var(--clr-black);
  display: inline-block;
  width: 26px;
  height: 30px;
  padding: 0;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  border-radius: 0;
  font-size: 18px;
  font-weight: 500;
}
.pd-quantity .quantity-field {
  width: 40px;
  height: 24px;
  text-align: center;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  border-radius: 0;
  border: 0;
  border-left: 1px solid var(--clr-black);
  border-right: 1px solid var(--clr-black);
}
.pd-quantity .quantity-field::-webkit-outer-spin-button,
.pd-quantity .quantity-field::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.pd-quantity .quantity-field input[type=number] {
  -moz-appearance: textfield;
}
.pd-quantity.product-quantity {
  background-color: var(--clr-grey-light);
}
.pd-quantity.product-quantity .quantity-field {
  background-color: var(--clr-grey-light);
}
.summary {
  background-color: var(--clr-grey-light);
  padding: 20px;
}
.summary hr {
  border-top-color: var(--clr-black);
  opacity: 1;
  margin-top: 10px;
}
.summary .total {
  background-color: var(--clr-grey);
  padding: 10px;
  position: relative;
  left: -10px;
  width: calc(100% + 20px);
}
.btn-order {
  width: 100%;
  padding: 15px;
}
.btn-order:hover {
  background-color: var(--clr-grey);
}
a.shoplink {
  color: var(--clr-black);
  text-decoration: none;
}
.delete-discount {
  position: relative;
  top: -2px;
  margin-left: 3px;
}
.info {
  background-color: var(--clr-grey);
  border-radius: 50%;
  width: 18px;
  height: 18px;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  display: inline-block;
  color: var(--clr-black);
  text-decoration: none;
}
/*#endregion */
/*#region register */
#invoiceAddress,
#showAccount {
  display: none;
}
#invoiceAddress.show,
#showAccount.show {
  display: block;
}
/*#endregion */
/*#region product */
.product-card,
.product-img-holder {
  position: relative;
}
.product-card .label,
.product-img-holder .label {
  padding: 5px 10px;
  background-color: var(--clr-orange);
  color: var(--clr-white);
  position: absolute;
  top: 0;
  right: 0;
}
/*#endregion */
/*#region filter */
.remfilt {
  cursor: pointer;
}
/*#endregion */
/*#region order */
.order-header {
  font-size: 1.25rem;
  margin-bottom: 5px;
}
.openOrder {
  cursor: pointer;
}
.order-data .order-content {
  background-color: var(--clr-grey-light);
  margin-bottom: 4px;
}
.order-data .order-content a {
  text-decoration: none;
  color: var(--clr-black);
}
.order-data .order-content .line-total {
  width: 130px;
}
.order-data .order-content .total {
  margin-top: 5px;
  background-color: var(--clr-grey);
  padding: 5px 10px;
  position: relative;
  right: -10px;
}
.order-row a.openOrder {
  padding: 25px 0;
  background-color: var(--clr-grey);
  margin-bottom: 4px;
  background-repeat: no-repeat;
  background-position: right 20px center;
  background-image: url(/lib/img/icons/ic-arrow-down.svg);
  color: var(--clr-black);
  text-decoration: none;
  font-size: 1.25rem;
}
.order-row a.openOrder.open {
  background-image: url(/lib/img/icons/ic-arrow-up.svg);
}
.editAddress {
  cursor: pointer;
  color: var(--clr-black);
  text-transform: lowercase;
  text-decoration: none;
  display: inline-block;
  margin-top: 10px;
  background: url(/lib/img/icons/ic-arrow-black-small2.svg) no-repeat center right;
  padding-right: 15px;
}
/*#endregion */
/*#region gallery */
.pswp {
  --pswp-bg: var(--clr-white);
  --pswp-icon-color: var(--clr-black);
  --pswp-icon-color-secondary: var(--clr-white);
}
.pswp--touch .pswp__button--arrow {
  visibility: visible;
}
/*#endregion */
/*#region account */
.account-menu a {
  color: var(--clr-black);
  text-decoration: none;
  margin-bottom: 10px;
  display: block;
}
.account-menu a.active {
  font-weight: 700;
}
/*#endregion */
/*#region coupon code */
.offer-wrap {
  position: relative;
}
.offer-wrap .apply {
  position: absolute;
  right: 4px;
  top: 3px;
  padding: 3px 10px;
  /*        
        border: 0;
        background-color: transparent;
        background-image: url(/lib/img/icons/ic-arrow-black-small2.svg);
        background-repeat: no-repeat;
        background-position: right 10px center;
        width: 30px;
        height: 30px;*/
}
/*#endregion */
.field-validation-valid {
  display: none;
  padding-left: 10px;
}
/* click through disabled buttons */
button[disabled] {
  pointer-events: none;
}
.terms-check {
  cursor: pointer;
}
#terms-error {
  display: none;
}
.autocomplete_list hr {
  border-top: 1px solid var(--clr-grey-light);
  margin: 0.5rem 0;
}
.autocomplete_list span {
  display: block;
  font-size: var(--fnt-size-small);
}
.autocomplete_list div.line {
  display: block;
  margin: 3px 0;
}
.autocomplete_list div.img {
  display: inline-block;
  width: 100px;
  height: 100px;
  margin-right: 10px;
  -moz-border-radius: 5px !important;
  -webkit-border-radius: 5px !important;
  border-radius: 5px !important;
  background-size: contain;
  background-color: var(--clr-white);
  background-position: center;
  background-repeat: no-repeat;
}
.autocomplete_list a {
  display: inline-block;
  color: var(--clr-black);
  vertical-align: super;
}
.autocomplete_list h6 {
  color: var(--clr-grey-light);
}
.autocomplete_list {
  display: none;
  position: absolute;
  top: 65px;
  left: 0;
  width: 100%;
  background-color: var(--clr-grey-light);
  padding: 20px;
  -moz-border-radius: 20px !important;
  -webkit-border-radius: 20px !important;
  border-radius: 20px !important;
  z-index: 99999;
}
.autocomplete_list:before {
  position: absolute;
  content: '';
  top: -10px;
  left: 90px;
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 0 10px 10px 10px;
  border-color: transparent transparent var(--clr-grey-light) transparent;
  transform: rotate(0deg);
}
.autocomplete_list div.img {
  width: 25px;
  height: 25px;
}