:root {

  --primary-color: #f6f3eb;

  --secondary-color: #967967;

  --tertiary-color: #2c2e25;

  --p-color: #2c2e25;

}

@font-face {

  font-family: 'KarinRegular';

  src: url('/app/themes/goldenoasis/assets/fonts/KarinRegular.woff') format('woff');

  font-display: swap;

}

/* Kerst Korting */
.kerst_korting {
  display: flex;
  justify-content: center;
  align-items: center;
  background-image: url("https://goldenoasis.nl/app/uploads/2023/12/Kerst_korting.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  margin-bottom: 20px;
  text-align: center;

  flex-direction: column;

  padding: 20px;
}

.kerst_korting_title {
  color: white;
  font-size: 2rem;
  font-weight: 600;
  font-family: 'KarinRegular';
  margin-bottom: 0px;
}

.kerst_korting_p {
  color: white;
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 0px;
}


/* Custom Bootstrap classes */

.py-6 {

  padding-top: 4.5rem;

  padding-bottom: 4.5rem;

}



@media screen and (max-width: 800px) {

  .py-6 {

    padding-top: 1rem !important;

    padding-bottom: 1rem !important;

  }

}



.gap-5 {

  gap: 40px;

}



.px-5 {

  padding-left: 4.5rem !important;

  padding-right: 4.5rem !important;

}



.container-small {

  max-width: 800px;

  margin: 0 auto;

}



body .btn {

  background-color: var(--tertiary-color);

  border-radius: 4px;

  border-width: 0;

  color: var(--primary-color);

  cursor: pointer;

  display: inline-block;

  font-size: 14px;

  font-weight: 500;

  line-height: 20px;

  list-style: none;

  margin: 0;

  padding: 10px 12px;

  text-align: center;

  vertical-align: baseline;

  white-space: nowrap;

  user-select: none;

  -webkit-user-select: none;

  touch-action: manipulation;

}



body p {

  font-size: 1.125rem;
  color: var(--p-color);

}



body h1,

.h1 {

  color: var(--secondary-color);

  font-family: "karinregular";

  font-size: 2rem;

  font-weight: 600 !important;

  margin: 10px 0 10px 0;

}





body h2,
.h2 {

  color: var(--p-color);

  font-family: "karinregular";

  font-size: 2rem;

  font-weight: 600 !important;

  margin: 10px 0 10px 0 !important;

}



body h3,

.h3 {

  font-family: "karinregular";

  font-size: 1.5rem;

  font-weight: 600 !important;

  margin: 10px 0 10px 0;

}



body h4,

.h4 {

  font-size: 1.2rem;

  font-weight: 600 !important;

  margin: 10px 0 10px 0;

}

.h5 {
  margin-top: 0;
  margin-bottom: 0.5rem;
  line-height: 1.2;
  font-size: 1.25rem;
  text-decoration: none;
  font-family: "karinregular";
  font-weight: 600 !important;
  color: var(--secondary-color) !important;

}

body p,
p {
  /* font-family: "karinregular"; */
}





body a {

  color: var(--p-color);

  text-decoration: none;

  font-weight: 600;

}



header a {

  font-weight: unset;

}



.bigger-container {

  margin: auto;

  max-width: calc(100% - 40px);

}



@media screen and (max-width: 800px) {

  .bigger-container {

    padding: 20px;

    margin: auto;

    max-width: calc(100%);

  }

}



.color_main {

  background-color: var(--primary-color);

}



.color_secondary {

  background-color: #212121;

}



/* CTA upper menu */

.cta-menu {

  justify-content: center;

}



.cta-menu p {

  margin-bottom: 0rem !important;

}



.cta {

  font-size: .8rem;

  color: var(--secondary-color);

}



/* Header */

.main-menu a {

  text-decoration: none;

  color: var(--p-color);

}



.logo {

  width: 430px;
  height: 36.641px;

}



.icons {

  gap: 20px;

}



.icon {

  color: var(--p-color);

  text-decoration: none;

  position: relative;

}



.amount-products-in-cart {

  position: absolute;

  right: -9px;

  top: 0px;

  background-color: var(--secondary-color);

  color: white;

  padding: 4px;

  border-radius: 100%;

  width: 15px;

  height: 15px;

  font-size: 0.6rem;

  display: flex;

  align-items: center;

  justify-content: center;

}



/* Iconic */



.iconic-was-chosen-attribute__no-selection {

  display: none !important;

}



.iconic-was-swatches--text-swatch .iconic-was-swatch--selected,

.iconic-was-swatches--text-swatch .iconic-was-swatch--selected:hover {

  background: var(--secondary-color);

}



.iconic-was-swatch:hover {

  background: var(--secondary-color);

  color: white !important;

  border-color: white !important;

}



.iconic-was-swatches--text-swatch .iconic-was-swatch:hover {

  color: white !important;

}



.variations td.label {

  color: #000000 !important;

}



.woocommerce div.product form.cart .variations label {

  font-weight: 400;

}



/* Search bar and icons */



a.SearchPanelBtn::before {

  width: 0px;

}



/* Icons */

.icon {

  opacity: 1;

  transition: opacity 0.3s ease-in-out;

  visibility: visible;

  cursor: pointer;



  width: 18px;

  height: 18px;

}



.icon.hidden {

  display: none;

  opacity: 0;

  visibility: hidden;

}



/* Search bar */

.search-dropdown {

  display: none;

  height: 0;

  overflow: hidden;



  margin-top: 5px;

  width: 100vw;

  box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.04);

}



.custom-search-wrapper {

  display: flex;

  justify-content: center;

  align-items: center;



  padding: 40px 0 40px 0;

}



/* Keyframes animation for sliding down */

@keyframes slideDown {

  0% {

    height: 0px;

    opacity: 0;

  }



  100% {

    height: 130px;

    opacity: 1;

  }

}



@keyframes slideUp {

  0% {

    height: 130px;

    opacity: 1;

  }



  100% {

    height: 0px;

    opacity: 0;

  }

}





/* Show the search panel with animation */

.search-dropdown {

  position: absolute;

  top: 210px;

  left: 0;

  width: 100%;

  display: block;

  background-color: white;

}



.search-dropdown.open {

  animation: slideDown 0.5s ease-in-out forwards;

}



.search-dropdown.close {

  animation: slideUp 0.5s ease-in-out forwards;

}



.custom-search-wrapper form {

  position: relative;

}



/* Search form */

#woocommerce-product-search-field {

  width: 600px;

  height: 60px;

  background-color: white;

  border-radius: 15px;

  border: 2px solid var(--secondary-color);

  padding: 14px 58px 14px 23px;

  color: inherit;

}



#woocommerce-product-search-field:focus {

  outline: 0 none;

}



/* Search submit button */

.search-submit {

  position: absolute;

  top: 0;

  right: 20px;

  display: block;

  font-size: 0px;

  color: inherit;

  width: 38px;

  height: calc(100% + 1px);

  border-radius: 0;

  background-color: transparent;

  border: 0px;

  cursor: pointer;

  fill: inherit;

}



@media only screen and (max-width: 768px) {

  #woocommerce-product-search-field {

    width: 100%;

  }



  .search-dropdown {

    top: 100px;

  }



}



@media screen and (min-width: 800px) {

  .dm-none {

    display: none !important;

  }

}



@media screen and (max-width: 800px) {

  .hamburger-menu__line {

    width: 15px;

    height: 1px;

    background-color: var(--secondary-color);



  }







  .mobile-header {

    flex-direction: column;

    justify-content: space-between;

    align-items: center;

  }



  .icons {

    justify-content: space-around;

    width: 100%;

  }



  .logo {

    max-width: 300px;
    height: auto;

  }


  .cta.h-none:first-child {
    display: block !important;
  }


  .h-none {

    display: none !important;

  }





  #open-slider {

    display: flex;

    gap: 10px;

    justify-content: space-between;

  }



  #open-slider span {

    width: 8px;

  }



  .mobile-popup-button a {

    text-decoration: none;

    color: var(--p-color);

  }



  .menu-items {

    border-bottom: 1px solid var(--secondary-color);

    padding-bottom: 1.5rem;

    padding-top: 1.5rem;

    display: flex;

    justify-content: space-between;

  }



  .menu-items span {

    width: 10px;

  }



  .no-scroll {

    overflow: hidden;

    height: 100%;

  }



  .search_form {

    display: flex;

    border: 1px solid var(--secondary-color);

    border-radius: 4px;

    width: 100%;

    overflow: hidden;

  }



  a#close-slider {

    position: absolute;

    width: 40px;

    height: 40px;

    right: -40px;

    background: var(--primary-color);

    display: flex;

    align-items: center;

    justify-content: center;

  }



  .search input {

    height: 35px;

    border-radius: 5px 0px 0px 5px;

    border: 0px solid var(--secondary-color);

    padding-inline: 15px !important;

    padding: 0px;

    width: 100%;

  }



  .search button {

    height: 35px;

    width: 40px;

    background-color: rgb(234, 234, 234);

    border: 0px solid var(--secondary-color);

    padding-block: 0px;

    padding-inline: 5px;

  }





  .body-no-scroll {

    overflow: hidden;

    height: 100%;

  }



  .mobile-slider {

    padding-left: 20px;

    position: fixed;

    top: 0;

    left: -100%;

    /* Initially position it off the screen */

    width: 80%;

    height: 100%;

    background: var(--primary-color);

    color: #fff;

    transition: left 0.3s ease;

    /* Add transition effect */

    z-index: 1000;

    padding-right: 30px;

  }



  .mobile-slider.open {

    left: 0;

    /* Slide in the slider when .open class is added */

  }



  /* Overlay */

  .overlay {

    opacity: 0;

    /* Initially, the overlay is fully transparent */

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: rgb(133 133 133 / 50%);

    /* Gray overlay */

    z-index: 999;

    transition: opacity 0.3s ease;

    /* This line adds a fade effect */

    pointer-events: none;

    /* Makes it so initially the overlay cannot be interacted with */

  }



  .overlay.visible {

    opacity: 1;

    /* When the .visible class is added, the overlay becomes fully opaque */

    pointer-events: auto;

    /* Allows interaction with the overlay when visible */

  }







}



/* Jumbo header */

.jh-border {

  border-radius: 175px 175px 8px 8px;

  height: 400px;

  object-fit: cover;

}



@media screen and (max-width: 800px) {

  .jh-border {

    height: 300px;

  }



  .jumbo-header {

    flex-direction: column;

  }

}



/* Footer */

footer div ul li a,

footer h5,

footer p {

  color: var(--secondary-color);

  text-decoration: none;

  font-weight: unset;

}



footer h5 {

  font-family: 'KarinRegular';

  font-weight: 600;

}



.copywrite p {

  font-size: .8rem;

}

/* media @  */
@media screen and (max-width: 800px) {
  .mobile-footer {
    text-align: center;
  }
}



/* Nieuwsletter */

.nieuwsbrief {
  padding-top: 40px;
  color: var(--secondary-color);
}



.sib_signup_box_inside_1 p input.btn {

  height: 49px;

  width: 115px;

}



.sib_signup_box_inside_1 p input.btn:hover {

  background-color: var(--secondary-color);

  color: var(--primary-color);

}

.btn:hover {
  background-color: #c69b4c !important;

  color: white !important;
}



.sib_signup_box_inside_1 {

  display: flex;

  gap: 20px;

  justify-content: center;

  align-items: center;

}

form#sib_signup_form_1 input[type=text],
form#sib_signup_form_1 input[type=email],
form#sib_signup_form_1 select {
  color: var(--secondary-color);
}

@media screen and (max-width: 800px) {

  .sib_signup_box_inside_1 {

    justify-content: center;

    flex-direction: column;


  }

}



.sib_signup_box_inside_1 p {

  margin-bottom: 0px;

}



input.sib-email-area {

  border: 1px solid black;

  background: transparent;

  padding: 10px;

}



input.sib-email-area::placeholder {

  color: var(--secondary-color);

  font-size: 0.8rem;

}





/* Unieke-punten */

.unieke-punten-padding {
  padding-top: 60px;
  padding-bottom: 60px;
}


@media screen and (max-width: 800px) {

  .punten {

    flex: 0 0 100% !important;

  }

}





.unieke_punten_img {

  width: 150px;

  aspect-ratio: 1;

}



/* Categorieen */

@media screen and (min-width: 800px) {

  .row-categorieen:nth-child(even) {

    flex-direction: row-reverse
  }

}



@media screen and (max-width: 800px) {

  .row-categorieen {

    flex-direction: column;

    margin-bottom: 40px;

  }

}



.text-area {

  margin-left: -30px;

  padding: 40px 40px 40px 60px;

  z-index: 1;

  border-radius: 5px;

}



.categorieen-img {

  width: 350px;

  height: 400px;

  object-fit: contain;

  z-index: 2;

}



@media screen and (max-width: 800px) {



  .text-area {

    margin-left: 0px;

    padding: 20px;

  }



  .categorieen-img {

    width: 100%;

    height: auto;

  }



}



.sub-text {

  color: var(--secondary-color);

  font-size: 0.6em;

  text-transform: uppercase;

  letter-spacing: 1.5px;

  margin-bottom: -0.4rem;

}



/* Woocommerce */

.woocommerce div.product p.price ins,
.woocommerce div.product span.price ins {
  text-decoration: none;
}

h2.woocommerce-loop-product__title,

.woocommerce ul.products li.product .price {

  color: var(--tertiary-color);

}



h2.woocommerce-loop-product__title:hover,

.woocommerce ul.products li.product .price:hover {

  color: var(--secondary-color);

}



.woocommerce ul.products li.product,

.woocommerce-page ul.products li.product {

  margin-bottom: 0.992em;

}



h1.product_title.entry-title {

  color: var(--secondary-color);

  font-family: "karinregular";



}



.woocommerce ul.products li.product a img {
  border-radius: 10px;
}


.woocommerce div.product p.price {

  color: var(--p-color);

}



button.single_add_to_cart_button.button.alt,

button.single_add_to_cart_button.button.alt.disabled.wc-variation-selection-needed,

button.single_add_to_cart_button.button.alt.disabled.wc-variation-is-unavailable {

  border-radius: 0;

  background-color: #88C425;

  color: white;

  transition: all 0.3s ease-in-out;

}





button.single_add_to_cart_button.button.alt:hover,

button.single_add_to_cart_button.button.alt.disabled.wc-variation-selection-needed,

button.single_add_to_cart_button.button.alt.disabled.wc-variation-is-unavailable {

  border-radius: 0;

  background-color: #88C425;

  color: white;

  transition: all 0.3s ease-in-out;



}





li.woocommerce-widget-layered-nav-list__item.wc-layered-nav-term a {

  color: var(--secondary-color);

}



ul.product-categories {

  list-style-type: none;

  padding-left: 0px !important;

}



ul.product-categories li a {

  color: var(--secondary-color);

}



h3.widget-title {

  font-size: 1.2rem;

}



#sidebar-primary {

  padding-top: 100px;

}


@media screen and (max-width: 800px) {

  .archive-custom {
    flex-direction: column;
  }

  #sidebar-primary {

    padding-top: 0px;

  }


}





/* Product page - Description and img */

.img_summary {

  display: grid;

  align-items: center;

  gap: 40px;

  grid-template-columns: 1fr 1fr;

}



.woocommerce .woocommerce-breadcrumb {

  padding-top: 20px !important;


  margin: 0;

}



@media screen and (max-width: 800px) {

  .woocommerce-breadcrumb {

    padding-top: 0px !important;
    padding-bottom: 20px !important;

  }



  .img_summary {

    display: grid;

    align-items: center;

    gap: 0px;

    grid-template-columns: 1fr;

  }



  .woocommerce div.product div.images {

    margin-bottom: 0em;

  }

}



.woocommerce #content div.product div.summary,

.woocommerce div.product div.summary,

.woocommerce-page #content div.product div.summary,

.woocommerce-page div.product div.summary {

  width: 100%;

}



.woocommerce #content div.product div.images,

.woocommerce div.product div.images,

.woocommerce-page #content div.product div.images,

.woocommerce-page div.product div.images {

  width: 100%;

}







@media screen and (min-width: 800px) {

  .images {

    grid-area: 1 / 1 / 2 / 2;

  }



  .summary {

    grid-area: 1 / 2 / 2 / 3;

  }



  .woocommerce-tabs {

    grid-area: 2 / 1 / 3 / 3;

  }



  .related.products {

    grid-area: 3 / 1 / 4 / 3;

  }

}







/* Product page - CTA */

.product-cta {

  padding-inline-start: 0 !important;

  margin-block-start: 0em !important;

  list-style-type: none;



}



.product-cta li {

  position: relative;

  padding-left: 1em;

  margin-bottom: 10px;

}



.product-cta li::before {

  content: '';

  position: absolute;

  left: 0;

  top: 6px;

  width: 1em;

  height: 1em;

  background-repeat: no-repeat;

  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Laag_1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13.47 20.06'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%237a623a;stroke-width:0px;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='m6.58,20.06c.21-2.56.4-4.8.6-7.2,1.2.54,2.12.96,3.03,1.37.1-.12.21-.24.31-.35-.48-.8-.95-1.59-1.57-2.62,1.64-.42,3.08-.79,4.52-1.17,0-.1,0-.2-.01-.3-1.43-.15-2.87-.3-4.41-.45.36-1.12.69-2.16,1.14-3.56-1.12.93-1.89,1.58-2.74,2.29-.18-2.67-.36-5.36-.53-8.05-.25,0-.49-.01-.74-.02-.13,2.76-.27,5.53-.42,8.7-1.06-1.07-1.8-1.81-2.54-2.55-.14.08-.28.15-.42.23.39,1.04.78,2.07,1.25,3.35-1.46.18-2.76.34-4.06.49v.29c1.22.28,2.42.56,3.65.84-.35.91-.65,1.7-.96,2.48.13.09.27.17.4.26.66-.56,1.32-1.12,2.25-1.9l.87,7.88h.37Z'/%3E%3C/svg%3E");

}



/* Product page - Tabs */

.woocommerce div.product .woocommerce-tabs ul.tabs {

  padding: 0 !important;

  margin: 0 !important;

}



.woocommerce div.product .woocommerce-tabs ul.tabs::before {

  border-bottom: 0px solid #cfc8d8 !important;

}



.woocommerce div.product .woocommerce-tabs ul.tabs li {

  margin: 0px;

  padding: 0px;



  margin-right: 20px;



  border: 0px solid #cfc8d8 !important;

  background-color: transparent !important;

  color: var(--p-color) !important;

  border-radius: 0 !important;

}



.woocommerce div.product .woocommerce-tabs ul.tabs li a {

  color: var(--secondary-color);

}



.woocommerce div.product .woocommerce-tabs ul.tabs li a::before {

  content: '//';

}



.woocommerce div.product .woocommerce-tabs ul.tabs li::before {

  box-shadow: 0px 0px 0px 0px !important;

  border-width: 0px !important;

}



.woocommerce div.product .woocommerce-tabs ul.tabs li.active::after {

  box-shadow: none !important;

}



.woocommerce div.product .woocommerce-tabs ul.tabs li::after {

  right: 0px !important;

  border-bottom-left-radius: 0px !important;

  border-width: 0px !important;

}



.header-h4 {

  font-weight: 700;

  margin-top: 20px;

}



/* Category custom header */



.category-header {

  display: flex;

  gap: 40px;

  margin-top: 10px;

  margin-bottom: 20px;

}



@media (max-width: 800px) {

  .category-header {

    flex-direction: column;
    gap: 0px;
    margin-top: 0px;
    margin-bottom: 0px;

  }

}



/* Product - extra info */

.woocommerce table.shop_attributes {

  border-top: 0px !important;

}



.woocommerce table.shop_attributes tr:nth-child(even) td {

  background: transparent !important;

}



.woocommerce table.shop_attributes th {

  background: transparent !important;

  border-bottom: transparent !important;

}



.woocommerce table.shop_attributes td {

  border-bottom: transparent !important;

}





/* Product - Sale banner */

span.onsale {

  background-color: transparent !important;

  color: var(--secondary-color) !important;

  right: 18px !important;

}



/* Product category */



span.page-numbers.current {

  background-color: var(--secondary-color) !important;

  color: var(--primary-color) !important;

  width: 32px;

  border-radius: 5px;

}



nav.woocommerce-pagination {

  padding-bottom: 40px;

}



.woocommerce .woocommerce-pagination ul.page-numbers li,

.woocommerce-page .woocommerce-pagination ul.page-numbers li {

  padding-left: 10px;

}



.woocommerce nav.woocommerce-pagination ul li a:focus,

.woocommerce nav.woocommerce-pagination ul li a:hover,

.woocommerce nav.woocommerce-pagination ul li span.current {

  background-color: transparent;

}



.woocommerce nav.woocommerce-pagination ul,

.woocommerce nav.woocommerce-pagination ul li {

  border: 0px !important;

}



.woocommerce ul.products li.product a {

  text-align: center;

}



/* Product stock */

.stock-container {

  color: var(--secondary-color);

  margin-bottom: 20px;

}



.woocommerce div.product .stock {

  color: var(--secondary-color);

}





.woocommerce .quantity .qty {

  display: none;

}



span.woocommerce-Price-amount.amount {

  color: var(--secondary-color);

}



.woocommerce-variation-price {

  margin-bottom: 20px;

}



/* Woocommerce colums-4 */

ul.products.columns-4 {

  margin: 0 !important;

  padding-bottom: 20px;

  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 20px;
}

@media screen and (max-width: 800px) {
  ul.products.columns-4 {
    grid-template-columns: 1fr 1fr;
  }
}

@media screen and (max-width: 500px) {
  ul.products.columns-4 {
    grid-template-columns: 1fr 1fr;
  }
}

ul.products.columns-3 {

  margin: 0 !important;

  padding-bottom: 20px;

  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 20px;
}

@media screen and (max-width: 800px) {
  ul.products.columns-3 {
    grid-template-columns: 1fr 1fr;
  }
}

@media screen and (max-width: 500px) {
  ul.products.columns-3 {
    grid-template-columns: 1fr;
  }
}

.woocommerce .products ul::after,
.woocommerce .products ul::before,
.woocommerce ul.products::after,
.woocommerce ul.products::before {
  content: none !important;
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
  margin: 0;
  width: 100% !important;
}

.woocommerce ul.products[class*=columns-] li.product,
.woocommerce-page ul.products[class*=columns-] li.product {
  margin: 0;
}

.custom_product_img {
  grid-column: 1 / 3;
  grid-row-start: 3;
  border-radius: 10px;
  overflow: hidden;
  position: relative;
}

.custom_product_img:before {
  content: " ";
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(50%, transparent), to(rgba(0, 0, 0, .75)));
  background-image: -webkit-linear-gradient(top, transparent 50%, rgba(0, 0, 0, .75));
  background-image: linear-gradient(180deg, transparent 50%, rgba(0, 0, 0, .75));
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 2;
}

@media (max-width: 768px) {
  .custom_product_img {
    grid-row-start: 4;
  }
}

@media (max-width: 500px) {
  .custom_product_img {
    grid-column: 1;
    grid-row-start: unset;
  }
}

.custom_product_texts {
  color: white;
  z-index: 3;
}

.custom_product_url {
  width: 100%;
  height: 100%;
  position: absolute;
}

.archive-image {
  height: 100% !important;
  width: 100%;
  object-fit: cover;
  position: absolute;
  inset: 0px;
  z-index: 1;
}

.custom_product_img_content {
  z-index: 3;
  position: absolute;
  bottom: 20px;
  left: 25px;
  right: 25px;
}

.pc-image {
  display: block;
}

.mobile-image {
  display: none;
}

@media (max-width: 768px) {
  .mobile-image {
    display: block;
  }

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


.category-header {
  align-items: center;
  position: relative;
  overflow: hidden;
}

header.woocommerce-products-header {
  margin: 20px 0px;
}

h1.category-title {
  position: absolute;
  margin-left: 40px;
  padding: 10px 34px;
  font-size: 3rem;
  background: white;
  border-radius: 6px;
}

@media (max-width: 768px) {
  h1.category-title {
    margin-left: 0px;
    top: 46%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
}

.category-description {
  max-height: 200px;
  width: 100%;
  overflow: hidden;
  border-radius: 10px;

}

.category-description img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

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


/* Woocommerce - login screen */



.login-img {

  width: 50%;

}



@media (max-width: 800px) {

  .login-page {

    flex-direction: column;

  }



  .login-img {

    width: 100%;

  }

}





form.woocommerce-form.woocommerce-form-login.login {

  border: 0px;

  border-radius: unset;

  margin: 0;

  padding: 0;

}



button.woocommerce-button.button.woocommerce-form-login__submit,

button.woocommerce-Button.button {

  background-color: var(--secondary-color);

  color: white;

  margin-top: 20px;

}



label.woocommerce-form__label.woocommerce-form__label-for-checkbox.woocommerce-form-login__rememberme {

  margin-top: 20px;

}



input#username,

input#password {

  height: 35px;

  border-radius: 5px;

  border: 1px solid var(--secondary-color);

  margin-top: 5px;

}



/* Woocommerce - messages */

.woocommerce-error,

.woocommerce-info,

.woocommerce-message {

  border-top: 0px solid transparent !important;

  background-color: white !important;

  margin: 20px 0px 20px 0px !important;

  padding: 1em 2em;

  min-height: 68px;

}



.woocommerce .woocommerce-error .button,

.woocommerce .woocommerce-info .button,

.woocommerce .woocommerce-message .button,

.woocommerce-page .woocommerce-error .button,

.woocommerce-page .woocommerce-info .button,

.woocommerce-page .woocommerce-message .button {

  background-color: var(--secondary-color);

  color: white;

}



.woocommerce .woocommerce-error .button:hover,

.woocommerce .woocommerce-info .button:hover,

.woocommerce .woocommerce-message .button:hover,

.woocommerce-page .woocommerce-error .button:hover,

.woocommerce-page .woocommerce-info .button:hover,

.woocommerce-page .woocommerce-message .button:hover {

  background-color: var(--secondary-color);

  color: white;

}



.woocommerce-error li,

.woocommerce-info li,

.woocommerce-message li {

  display: flex;

  justify-content: space-between;

  flex-direction: row-reverse;

  gap: 20px;

  align-items: center;

}



.woocommerce-error::before,

.woocommerce-info::before,

.woocommerce-message::before,

.woocommerce-error::after,

.woocommerce-info::after,

.woocommerce-message::after {

  display: none;

}



/* Woocommerce - Order received page */

p.woocommerce-notice.woocommerce-notice--success.woocommerce-thankyou-order-received {

  margin-bottom: 40px;

}



/* Woocommerce - cart */



.cart-product {

  display: flex;

  align-items: center;

  gap: 20px;

  justify-content: space-around;

  border-bottom: 2px solid var(--secondary-color);

}



@media (max-width: 800px) {

  .cart-product {

    padding-top: 20px;

    padding-bottom: 20px;

  }

}



.cart-image {

  width: 200px;

}



.cart-meta {

  display: flex;

  flex-direction: column;

  gap: 10px;

  align-items: flex-start;

}



.cart-meta a {

  font-weight: 600;

}



.woocommerce a.remove {

  color: black !important;

}



.cart-overview {

  display: grid;

  grid-template-columns: 60% 40%;

  gap: 40px;

}



@media (max-width: 800px) {

  .cart-overview {

    grid-template-columns: 100%;

    gap: 0px;

  }

}







.woocommerce .cart-collaterals .cart_totals,

.woocommerce-page .cart-collaterals .cart_totals {

  width: 100%;

}



table.shop_table.shop_table_responsive {

  padding: 20px !important;

  margin-top: 20px;

}



.cart-subtotal td {

  float: right;

}



tr.cart-subtotal {

  display: table-row;



}



.woocommerce-shipping-totals.shipping {

  display: grid;

  grid-template-columns: 1fr;

}



.woocommerce table.shop_table tbody th,

.woocommerce table.shop_table tfoot td,

.woocommerce table.shop_table tfoot th,

#add_payment_method .cart-collaterals .cart_totals tr td,

#add_payment_method .cart-collaterals .cart_totals tr th,

.woocommerce-cart .cart-collaterals .cart_totals tr td,

.woocommerce-cart .cart-collaterals .cart_totals tr th,

.woocommerce-checkout .cart-collaterals .cart_totals tr td,

.woocommerce-checkout .cart-collaterals .cart_totals tr th {

  border-top: 0px !important;

}



#add_payment_method .cart-collaterals .cart_totals table th,

.woocommerce-cart .cart-collaterals .cart_totals table th,

.woocommerce-checkout .cart-collaterals .cart_totals table th {

  width: 100%;

}



a.checkout-button.button.alt.wc-forward {

  background-color: var(--secondary-color);

  border-radius: 0px;

  font-size: 1.2rem;

}



.woocommerce-cart #content table.cart tbody td.actions {

  margin-top: 20px;

  display: flex;

  justify-content: space-between
}



.coupon {

  margin-top: 20px;

}



@media (max-width: 800px) {

  .cart-collaterals {

    margin-top: 20px;

  }



  .coupon {

    display: flex;

    flex-direction: column;

    gap: 20px;

  }



  .woocommerce table.shop_table tbody:first-child tr:first-child td,

  .woocommerce table.shop_table tbody:first-child tr:first-child th {

    width: 100%;

  }



  ul#shipping_method li:first-child {

    padding-top: 10px !important;

  }



  .woocommerce ul#shipping_method li {

    margin: 0 0 0.5em;

    line-height: 1.5em;

    list-style: none outside;

    width: 100%;

    display: flex;

  }



  p.woocommerce-shipping-destination {

    text-align: left;

    margin: 20px 0;

  }



  form.woocommerce-shipping-calculator {

    text-align: left;

    margin: 20px 0;

  }



  .cart_totals h2 {

    margin-bottom: 20px;

  }

}





.faq-section {

  padding-bottom: 20px;



}



.faq-question {

  cursor: pointer;

  margin: 0;

  padding: 10px 0;

  position: relative;

  display: flex;

  align-items: center;

}



.faq-question .arrow-vragen {

  margin-left: 10px;

  transition: transform 0.3s ease;

}



.faq-answer {

  padding: 10px 0;

}



/* Popup */

/* The CSS for the popup */

.modal {

  display: none;

  /* Hidden by default */

  position: fixed;

  /* Stay in place */

  z-index: 1;

  /* Sit on top */

  left: 0;

  top: 0;

  width: 100%;

  /* Full width */

  height: 100%;

  /* Full height */

  overflow: auto;

  /* Enable scroll if needed */

  background-color: rgb(0, 0, 0);

  /* Fallback color */

  background-color: rgba(0, 0, 0, 0.4);

  /* Black w/ opacity */

}



/* Modal Content */

.modal-content {

  background-color: #fefefe;

  margin: 15% auto;

  /* 15% from the top and centered */

  padding: 20px;

  border: 1px solid #888;

  width: 80%;

  /* Could be more or less, depending on screen size */

}



/* The Close Button */

.close {

  color: #aaa;

  float: right;

  font-size: 28px;

  font-weight: bold;

}



.close:hover,

.close:focus {

  color: black;

  text-decoration: none;

  cursor: pointer;

}


.h1-block {
  width: 0px;
  height: 0px;
  top: 0;
  left: 0;
  position: absolute;
  overflow: hidden;
}

.wysiwyg-block {
  word-break: break-word;
}


div#searchPanel {
  z-index: 99999;
}

/* Toegevoegde niewue css */

.col.punten {
  padding-top: 10px;
}

/* media @  */
@media screen and (max-width: 800px) {
  .col.punten {
    padding-top: 60px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .smaller-h2-mobile {
    font-size: 1.5rem;
  }
}

a.btn {
  margin-bottom: 25px;
  border-radius: 8px;
}

.vegan-logo {
  width: 200px;
  height: 81px;
}

@media screen and (max-width: 800px) {
  .vegan-logo {
    width: 100%;
    height: auto;
  }
}

.color-change-text {
  color: var(--secondary-color);
}

/* Grid Block */
.grid_block {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 20px;
  padding-bottom: 40px;
}

@media screen and (max-width: 800px) {
  .grid_block {
    grid-template-columns: 1fr;
    gap: 40px;
  }
}

.grid_block div img {
  width: 170px;
  height: 170px;
  object-fit: cover;
  margin-bottom: 20px;
}

.grid_block .background_div {
  padding: 20px 15px;
  background-color: #e3c79c;
  border-radius: 10px;
  margin-bottom: 20px;
}

.hidden {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transition: max-height 0.5s ease, opacity 0.5s ease, visibility 0s 0.5s;
}

.hidden.show {
  max-height: 1500px;
  opacity: 1;
  visibility: visible;
  transition: max-height 0.5s ease, opacity 0.5s ease;
}