@import url('https://fonts.googleapis.com/css2?family=Didact+Gothic&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

:root {
 	--card-border-color: transparent; 
}

/*====== Dropdownmenu ======*/
.site-nav-item--level-0 {
    text-transform: uppercase;
}

/*------ Dropdownmenu: Hover Transition ------*/
.site-nav-item--level-0 .site-nav-item-link--level-0 {
    --color-highlight: var(--nav-text-color-hover);
    position: relative;
    transition: all .5s;
}

.site-nav-item--level-0 .site-nav-item-link--level-0:after {
    transition: all .25s ease-in-out;
    background: var(--color-highlight);
    border-radius: .125rem;
    bottom: 0;
    content: "";
    height: .125rem;
    position: absolute;
    visibility: hidden;
  	width: 0%;
}

.site-nav-item--level-0:hover .site-nav-item-link--level-0:after,
.site-nav-item--level-0:focus .site-nav-item-link--level-0:after {
  	width: 100%;
    visibility: visible;
}

/*====== Categories ======*/
.categories_row {
    border: none !important;
    box-shadow: none !important;
}
.categories_imagecontainer img {
    border-radius: 1000px;
}

.categories_row:hover img {
    opacity: .8;
  	filter: var(--drop-shadow-sm);
}
.categories_row img {
    transition: opacity 0.3s ease, filter 0.3s ease;
}

/*====== Buttons ======*/
.btn-transparent_custom .btn-transparent {
  	background-color: var(--accent-500);
  	font-weight: var(--font-weight-bold);
}

.btn-transparent_custom .btn-transparent:hover,
.btn-transparent_custom .btn-transparent:focus {
  	background-color: #000;
  	color: #fff;
}

/*====== Homepage ======*/
/*------ Utility Classes ------*/
/*--- Heading Display Font Size ---*/
/*- Heading 1 -*/
.heading-1_display-1 h1 {
  	font-size: var(--display-1-font-size);
}

.heading-1_display-2 h1 {
  	font-size: var(--display-2-font-size);
}

.heading-1_display-3 h1 {
  	font-size: var(--display-3-font-size);
}

.heading-1_display-4 h1 {
  	font-size: var(--display-4-font-size);
}

.heading-1_display-5 h1 {
  	font-size: var(--display-5-font-size);
}

.heading-1_display-6 h1 {
  	font-size: var(--display-6-font-size);
}

/*- Heading 2 -*/
.heading-2_display-1 h2 {
  	font-size: var(--display-1-font-size);
}

.heading-2_display-2 h2 {
  	font-size: var(--display-2-font-size);
}

.heading-2_display-3 h2 {
  	font-size: var(--display-3-font-size);
}

.heading-2_display-4 h2 {
  	font-size: var(--display-4-font-size);
}

.heading-2_display-5 h2 {
  	font-size: var(--display-5-font-size);
}

.heading-2_display-6 h2 {
  	font-size: var(--display-6-font-size);
}

/*------ Image width ------*/
.w-100_img img {
 	 width: 100%;
}

/*------ OUR STORY ------*/
.border-top_black {
 	border-top: 1px solid #000; 
}

.border-top_grey-200 {
 	border-top: 1px solid var(--grey-200); 
}

.story-card .card {
  	background-color: transparent;
    border-color: transparent; 
}

.story-card .card-container {
  	background-color: var(--grey-100);
}

.story-card .card-text {
  	font-size: var(--h1-font-size);
  	font-family: "Open Sans", sans-serif;
  	font-weight: 100;
}

@media screen and (min-width: 1200px) {
  .story-card .card-img-container img {
      border-radius: var(--border-radius); 
  }

  .story-card .card .row > div:last-of-type {
      position: relative; 
  }

  .story-card .card-container {
      position: absolute;
      left: -6rem;
      width: fit-content;
      height: max-content !important;
      top: 50%;
      transform: translateY(-50%); 
      border-radius: var(--border-radius);
  }

  .story-card .card-text {
      font-size: var(--display-5-font-size);
  }

  .story-card .card-footer {
      position: absolute;
      bottom: -3rem;
      left: 50%;
      transform: translateX(-50%);
      padding: 0; 
  }

  .story-card .btn-transparent_custom .btn-transparent {
      padding: 1rem 2rem;
      font-size: var(--display-3-font-size);
  }
}

/*------ Company Details ------*/
.company-card .card-body {
 	padding: 0; 
}

.company-card .company-details address {
    background-color: #000;
}

.company-card .company-details address,
.company-card .company-details address a {
 	color: #fff; 
}

.company-card .company-details address a:hover,
.company-card .company-details address a:focus {
 	color: var(--accent-500); 
}

@media screen and (max-width: 991px) {
 	 .company-card .card-body {
     	margin-block-start: var(--section-space-y); 
     }
}

/*------ About us ------*/
.img_youtube img {
 	height: var(--text-size-md); 
  	width: auto;
}

/*------ FAQ ------*/
.widget-faq {
 	--widget-faq-summary-font-weight: var(--font-weight-normal) !important; 
}

/*====== PLP ======*/
.products_name_heading {
    --product-name-heading-font-weight: var(--font-weight-normal) !important;
}

.products_gallery_header,
.products_gallery_body,
.product-card-slide-name,
.product-card-slide-price {
 	text-align: center; 
}

.products_gallery_header .products_name_heading,
.products_gallery_row .productinfo_no_tax,
.products_name_heading {
 	color: var(--grey-500); 
}

.products_gallery_row_price {
 	justify-content: center; 
}

/*====== PDP ======*/
/*------ Prijs ------*/
.productinfo_price .normalPrice, .productinfo_price .specialPrice {
    --productinfo-price-size: var(--display-3-font-size) !important;
}

/*------ Tabs ------*/
.productinfo_description .ui-tabs {
    --tabs-border-color: transparent !important;
  	--tabs-border-color-active: var(--grey-500);
    --tabs-border: var(--tabs-border-width) solid var(--tabs-border-color) !important;
    --tabs-border-active: var(--tabs-border-width) solid var(--tabs-border-color-active) !important;
}

.productinfo_description .ui-tabs li[role="tab"] a {
 	padding: 0; 
}

.productinfo_description .ui-tabs .ui-tabs-nav {
  	gap: var(--gutter);
}

.productinfo_description .ui-tabs li[role="tab"][aria-selected="false"][aria-expanded="false"] a {
 	color: var(--grey-500);
}

.productinfo_description .ui-tabs div[role="tabpanel"] {
	padding-inline: 0;
  	padding-block: var(--st-spacing-md);
}

/*====== FTD ======*/
.slide-container {
    background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0.1) 0%, transparent 99%);
}
.slideshow-title {
    text-shadow: 0 .025em 0.075em rgba(0,0,0,.25);
}

/*====== Laatst bekeken ======*/
#laatst_bekeken {
    margin-block-end: var(--section-space-y);
}

#laatst_bekeken header .h2 {
  	text-transform: uppercase;
}

/*------ Laatst bekeken container ------*/
.wrapper.content.indexPagina .container {
 	padding-block: 0;
}

/*====== Footer ======*/
.site-footer {
 	margin-block-start: 0; 
}

.site-footer .betaalmethodes {
  	display: flex;
    gap: var(--st-spacing-xs);
    flex-wrap: wrap;
}

.site-footer .betaalmethodes img {
  	border-radius: var(--border-radius);
}

/*------ Footer socket ------*/
.site-footer-socket .betaalmethodes img {
  	height: 24px;
  	width: auto;
}

.site-footer-socket .site-footer-socket-content {
 	display: flex;
    justify-content: space-between; 
  	align-items: center;
  	flex-wrap: wrap;
    gap: var(--st-spacing-md);
    text-align: left;
}

.site-footer-socket .footer-socket-custom-text {
 	display: inline-flex; 
  	column-gap: var(--st-spacing-xs)
}

.site-footer-socket .footer-socket-custom-text p:first-of-type,
.site-footer-socket .footer-socket-custom-text p:first-of-type * {
  	color: var(--grey-500);
}

.site-footer-socket .footer-socket-custom-text a {
 	text-decoration: none; 
}

@media screen and (max-width: 992px) {
 	.site-footer-socket .footer-socket-custom-text {
		flex-direction: column;
  	}
}