:root {
  /* ------------------------------------------------ // colors */
  --gray-100: #EDEDED;
  --gray-200: #DDDDDD;
  --gray-250: #ECECEB;
  --gray-300: #9E9999;
  --gray-400: #7C7775;
  --gray-500: #4E4E4E;
  --gray-600: #292929;
  --blue-200: #88959D;
  --blue-350: #009FE380;
  --blue-400: #009FE3;
  --blue-500: #0077AA;
  --green-400: #008500;
  --green-600: #0D6D0D;
  --red-400: #D10028;
  --alert-info-400: #002B55;
  --alert-succes-400: #247C17;
  --alert-error-400: #D10028;
  --yellow-400: #FCEB00;
  --yellow-600: #B3A700;
  --primary-100: #EDEDED;
  --primary-200: #FFD0BC;
  --primary-250: #76C5E6;
  --primary-400: #009FE3;
  --primary-600: #002B55;
  --white: #FFFFFF;
  --black: #000;
  --black-400: #292929;
  --black-600: #0B0B0B;
  --body-color: var(--black-400);
}

header .top-bar .top-right .topbar-links a:hover {
  color: var(--red-400);
}
header .top-bar {
  background: var(--blue-200);
  color: var(--white);
}
header .top-bar .top-right .topbar-links a {
  color: var(--white);
}
header .top-bar .top-right .topbar-links a:hover {
  color: var(--yellow-400);
}
header .top-bar:before {
  background: var(--blue-200);
}
header .header-wrapper:before {
  background: var(--primary-600);
}
header .header-wrapper .hamburger-and-logo .logo img {
  height: 54px;
  width: auto;
}
header .header-wrapper .search input {
  background: var(--white);
  color: var(--black-600);
}
header .header-wrapper .search button:after {
  color: var(--black-600);
}
header .header-wrapper .search button:hover:after {
  color: var(--gray-300);
}
header .header-wrapper .middle-right a:hover {
  color: var(--yellow-400);
}
header .header-wrapper .middle-right a:hover svg {
  fill: var(--yellow-400);
}
header .header-wrapper .middle-right a .number-of-items {
  background: var(--yellow-400);
  color: var(--black-400);
}
header .header-bottom {
  background: var(--gray-250);
  position: relative;
}
header .header-bottom:before {
  content: "";
  position: absolute;
  top: 0;
  width: 100vw;
  left: 50%;
  transform: translateX(-50%);
  height: 100%;
  background: var(--gray-250);
  z-index: -1;
}
header .header-bottom nav.navbar ul.navbar-nav li.current-menu-item > a {
  color: var(--blue-400);
}
header .header-bottom nav.navbar ul.navbar-nav li a {
  color: var(--primary-600);
}

footer {
  background: var(--primary-600);
  color: var(--white);
}
footer .footer-top-row {
  display: block;
  padding: 78px 0 70px;
  background: var(--blue-200);
}
@media (max-width: 992px) {
  footer .footer-top-row {
    padding: 47px 0 53px;
  }
}
footer .footer-top-row .footer-top-tekst {
  padding: 0;
  background: none;
}
footer .footer-top-row .footer-top-tekst .adres-container {
  margin-bottom: 16px;
}
@media (max-width: 992px) {
  footer .footer-top-row .footer-top-tekst .adres-container {
    margin-bottom: 24px;
  }
}
footer .footer-top-row .footer-top-tekst .adres-container .icon-location::before {
  color: var(--primary-600);
}
footer .footer-top-row .footer-top-tekst p {
  max-width: 536px;
  margin-bottom: 10px;
}
@media (max-width: 992px) {
  footer .footer-top-row .footer-top-tekst p {
    margin-bottom: 24px;
  }
}
footer .footer-top-row .footer-top-tekst .adres-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding-top: 45px;
}
@media (max-width: 992px) {
  footer .footer-top-row .footer-top-tekst .adres-wrapper {
    padding-top: 0;
  }
}
footer .footer-top-row .footer-top-tekst .adres-wrapper a.btn {
  background: var(--primary-600);
  color: var(--white);
}
footer .footer-top-row .footer-top-tekst .adres-wrapper a.btn:hover {
  background: var(--blue-400);
}
footer .footer-main {
  color: var(--white);
}
footer .footer-main ul.menu li.menu-item a:hover {
  color: var(--white);
}
footer .footer-bottom-row {
  color: var(--gray-250);
}
footer .footer-bottom-row ul.menu li.menu-item a {
  color: var(--gray-250);
}
footer .footer-bottom-row ul.menu li.menu-item a:hover {
  color: var(--white);
}
footer .footer-bottom-row .social-icons-container h4.titel {
  color: var(--white);
}
footer .footer-bottom-row .social-icons-container a {
  color: var(--primary-600) !important;
  background: var(--white) !important;
}
footer .footer-bottom-row .social-icons-container a:hover {
  color: var(--white) !important;
  background: var(--primary-400) !important;
}
footer .contact-buttons a {
  background: var(--yellow-400);
  color: var(--primary-600);
}
footer .contact-buttons a:hover {
  color: var(--black-400);
  background: var(--yellow-600);
}

body.woocommerce-cart .woocommerce .cart-collaterals .cart_totals .wc-proceed-to-checkout a,
body.woocommerce-checkout .woocommerce-checkout .wrapper #order_review #payment .place-order button.button {
  background: var(--yellow-400);
  color: var(--black-400);
}
body.woocommerce-cart .woocommerce .cart-collaterals .cart_totals .wc-proceed-to-checkout a:hover, body.woocommerce-cart .woocommerce .cart-collaterals .cart_totals .wc-proceed-to-checkout a:focus, body.woocommerce-cart .woocommerce .cart-collaterals .cart_totals .wc-proceed-to-checkout a:active,
body.woocommerce-checkout .woocommerce-checkout .wrapper #order_review #payment .place-order button.button:hover,
body.woocommerce-checkout .woocommerce-checkout .wrapper #order_review #payment .place-order button.button:focus,
body.woocommerce-checkout .woocommerce-checkout .wrapper #order_review #payment .place-order button.button:active {
  background: var(--yellow-600);
  color: var(--black-400);
}

.home main .over-werkgoed {
  margin-bottom: 40px;
}
.home main .over-werkgoed .over-werkgoed-tekst {
  text-align: center;
  gap: 12px;
}
.home main .over-werkgoed .over-werkgoed-tekst h2 {
  margin-bottom: 12px;
}

.home main .uitgelichte-pagina-container .uitgelichte-pagina .overlay-tekst .lees-meer-wrapper .lees-meer,
.home main .uitgelichte-pagina-container .uitgelichte-pagina .overlay-tekst .lees-meer-wrapper .icon {
  color: var(--yellow-400);
  transition: 0.3s;
}
.home main .uitgelichte-pagina-container .uitgelichte-pagina:hover .overlay-tekst .lees-meer-wrapper .lees-meer,
.home main .uitgelichte-pagina-container .uitgelichte-pagina:hover .overlay-tekst .lees-meer-wrapper .icon {
  color: var(--yellow-600);
}

.home main .webshops-overzicht .webshops-wrapper .webshop-link {
  background: var(--primary-600);
}
.home main .webshops-overzicht .webshops-wrapper .webshop-link:hover {
  background: var(--blue-400);
}
.home main .webshops-overzicht .webshops-wrapper .webshop-link .icon {
  color: var(--yellow-400);
}

body.single-product .breadcrumbs span > span:first-child a {
  background: var(--primary-600);
  font-weight: 500;
}
body.single-product .breadcrumbs span > span:first-child a:hover {
  background: var(--primary-400);
}

body.single-product div.product .product-beschrijving-container .summary .single_add_to_cart_button {
  background: var(--yellow-400);
  color: var(--black-400);
}
body.single-product div.product .product-beschrijving-container .summary .single_add_to_cart_button:hover, body.single-product div.product .product-beschrijving-container .summary .single_add_to_cart_button:focus, body.single-product div.product .product-beschrijving-container .summary .single_add_to_cart_button:active {
  color: var(--black-400);
  background: var(--yellow-600);
}

body.single-product div.product .woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li img {
  border: 1px solid var(--gray-200);
}

body.single-product div.product .product-cta {
  background: var(--primary-600);
  margin-top: 49px;
}
body.single-product div.product .product-cta .cta-buttons a {
  background: var(--blue-400);
  color: var(--white);
}
body.single-product div.product .product-cta .cta-buttons a:hover {
  background: var(--blue-500);
}

body.archive.woocommerce .storefront-sorting .woocommerce-pagination ul.page-numbers li span.current {
  background: var(--primary-600);
}
body.archive.woocommerce .storefront-sorting .woocommerce-pagination ul.page-numbers li a:hover {
  background: var(--blue-400);
  color: var(--white);
}

button,
.button,
.wp-block-button__link,
.wp-block-button__link:not(.has-background),
.wp-block-button__link:not(.has-text-color),
.woocommerce-Button,
.btn {
  background-color: var(--primary-600);
  color: var(--white);
}
button a,
.button a,
.wp-block-button__link a,
.wp-block-button__link:not(.has-background) a,
.wp-block-button__link:not(.has-text-color) a,
.woocommerce-Button a,
.btn a {
  color: inherit;
}
button:hover, button:focus, button:active,
.button:hover,
.button:focus,
.button:active,
.wp-block-button__link:hover,
.wp-block-button__link:focus,
.wp-block-button__link:active,
.wp-block-button__link:not(.has-background):hover,
.wp-block-button__link:not(.has-background):focus,
.wp-block-button__link:not(.has-background):active,
.wp-block-button__link:not(.has-text-color):hover,
.wp-block-button__link:not(.has-text-color):focus,
.wp-block-button__link:not(.has-text-color):active,
.woocommerce-Button:hover,
.woocommerce-Button:focus,
.woocommerce-Button:active,
.btn:hover,
.btn:focus,
.btn:active {
  background: var(--primary-400);
  color: var(--white);
  text-decoration: none;
}

body .breadcrumbs > span a {
  color: var(--primary-600);
}

body.archive.woocommerce #secondary .widget .wp-block-woocommerce-price-filter .wc-block-components-price-slider__range-input-wrapper::before {
  background: var(--blue-350);
}