/*
Theme Name: Divi Child Theme
Theme URI: https://kahlo.nl
Description: Child theme for the Divi Theme
Author: Karen Nijst
Author URI: https://kahlo.nl
Template: Divi
Version: 1.3
*/

@charset "UTF-8";
/* abril-fatface-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Abril Fatface';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/abril-fatface-v25-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* Voeg eerst het font toe bevan-v26-latin-regular */
/* bevan-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Bevan';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/bevan-v26-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
@font-face {
  font-family: 'Merriweather';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('./fonts/merriweather-v32-latin-700.woff2') format('woff2');
}
/* league-spartan-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'League Spartan';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/league-spartan-v15-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* league-spartan-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'League Spartan';
  font-style: normal;
  font-weight: 500;
  src: url('./fonts/league-spartan-v15-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* league-spartan-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'League Spartan';
  font-style: normal;
  font-weight: 600;
  src: url('./fonts/league-spartan-v15-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* league-spartan-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'League Spartan';
  font-style: normal;
  font-weight: 700;
  src: url('./fonts/league-spartan-v15-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* ---------------------------
   Lokaal gehoste POPPINS font-varianten
------------------------------ */
/* poppins-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/poppins-v23-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* poppins-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 400;
  src: url('./fonts/poppins-v23-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* poppins-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  src: url('./fonts/poppins-v23-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* poppins-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  src: url('./fonts/poppins-v23-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* poppins-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  src: url('./fonts/poppins-v23-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* poppins-700italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 700;
  src: url('./fonts/poppins-v23-latin-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* lato-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/lato-v24-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* lato-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  src: url('./fonts/lato-v24-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* lato-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Lato';
  font-style: normal;
  font-weight: 900;
  src: url('./fonts/lato-v24-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* caveat-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Caveat';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/caveat-v22-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* caveat-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Caveat';
  font-style: normal;
  font-weight: 700;
  src: url('./fonts/caveat-v22-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* Toepassen op headings */
h1, h2 {
  font-family: 'League Spartan', Georgia, "Times New Roman", serif !important;
  font-weight: 600!important;
}
#main-content h3 {
  font-family: 'League Spartan', Georgia, "Times New Roman", serif !important;
  font-weight: 600!important;
}
/* homepage h1 */
.home .et_pb_text_0 h1 {
    font-family: 'Lato', sans-serif;
    font-weight: 900 !important;
}
#OranjeSchuineBanner .et_pb_text_2_tb_body {
    line-height: 1.2em;
    font-family: 'Caveat', sans-serif !important;
    font-weight: 700 !important;
}
#BIOKarenNijst .bio-title,
#BIOKarenNIjstRecl .bio-title,
#privacyKaren .bio-title{
    font-size: 36px;
    color: #e27055;
    font-family: 'Caveat', sans-serif !important;
    font-weight: 700 !important;
    margin: 0;
}
.sloganKahlo
{
	font-family: 'Caveat', sans-serif !important;
	font-weight: 700 !important;
}
/* ---------------------------
   Corps (body) standaard instellen
------------------------------ */
body, p, li, span, td, th, input, textarea, select, .et_pb_text, .et_pb_module {
  font-family: 'Poppins', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-weight: 500 !important;
  font-style: normal !important;
}
strong, button, h3, h4, h5, h6, .entry-content a {
  font-family: 'Poppins', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-weight: 600 !important;
  font-style: normal !important;
}
#blogsFooter h3, h4{
	  font-family: 'Poppins', 'Helvetica Neue', Helvetica, Arial, sans-serif!important;
	font-weight: 100 !important;
}
#builderContent h4, #builderContent h5, #builderContent h6 {
    padding: 30px 0;
	line-height: 1.6em !important;
	font-family: 'Poppins', Georgia, "Times New Roman", serif!important;
}
#builderContent h4 {
    font-weight: 500!important; /* 400 is Normaal gewicht */
}
#builderContent .et_pb_toggle_title,
h2.et_pb_toggle_title,
h3.et_pb_toggle_title,
h4.et_pb_toggle_title{
  font-family: 'Poppins', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-weight: 600 !important;
  font-style: normal !important;
	padding-right: 2em;
}
.my-iframe-wrapper {
  max-width: 600px;
  margin: 2rem 0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  background: #ffffff;
  transition: transform 0.3s ease;
}

.my-iframe-wrapper:hover {
  transform: scale(1.01);
}

.my-iframe-wrapper blockquote.wp-embedded-content {
  display: block !important;
  padding: 1.5rem 2rem;
  background: linear-gradient(135deg, #f0f4f8, #e0e7ef);
  color: #1a1a1a;
  font-size: 1.1rem;
  font-weight: 600;
  border-left: 4px solid #0073aa;
}

.my-iframe-wrapper blockquote.wp-embedded-content a {
  display: inline-block;
  margin-top: 1rem;
  color: #0073aa;
  font-weight: 600;
  text-decoration: none;
  border-bottom: 2px solid transparent;
  transition: all 0.2s ease;
}

.my-iframe-wrapper blockquote.wp-embedded-content a:hover {
  border-color: #0073aa;
  color: #005b8f;
}

/* iframe uit beeld houden */
.my-iframe-wrapper iframe {
  display: none;
}


/* MENU */
#et-top-navigation li {
font-family: 'Poppins', 'Helvetica Neue', Helvetica, Arial, sans-serif!important;
  font-weight: 700 !important;
  font-style: normal !important;
}

pre {
  overflow: auto;
  padding: 0px;
  font-family: 'Courier New', monospace;
  white-space: pre-wrap;
  word-break: break-word;
  font-weight: 600;
  font-size: 1rem;
	line-height:1.4em; 
	margin: 30px 0;
color: #7c7373; 
}

/* --------------------------------------------------------------------------*/

/* toegankelijkheid 
  */
/* --------------------------------------------------------------------------*/
html[data-actw-focus-ring] body #page-container :focus:not(#dvmd_accessibility_wrapper *),
html[data-actw-focus-ring] body :focus:not(#dvmd_accessibility_wrapper *),
html[data-actw-focus-ring] body.et-db #et-boc .et-l :focus:not(#dvmd_accessibility_wrapper *) {
  outline: 3px solid var(--dvmd_actw_focus_ring_color) !important;
  outline-style: solid !important;
  outline-offset: 6px !important;
  border-radius: 5px !important;
}


/* Uitzondering: als de focus op een link-met-plaatje zit,
   toon de focusring alleen rond de a link: <img> */
#menuBovenaan .et_pb_menu__logo a:focus-visible {
  outline: 3px solid var(--focus-color);
  outline-offset: 4px;
  box-shadow:
    0 0 0 6px var(--focus-bg),
    0 0 0 9px var(--focus-color);
  border-radius: 4px;
  display: inline-block; /* Zorg dat de focusring ruimte heeft */
	padding: 6px; 
}
/* logo vervolg */
.et_pb_menu__logo {
    overflow: visible; 
}
.dsm-submenu-container.dsm-submenu-open {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}
    
/* DSM zoekvak tonen als class actief is */
#menuBovenaan .dsm-mega-menu-search-box.dsm-show-search-box {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  height: auto !important;
}

/* Maak de zoekknop 'blokachtig' zodat focusring groter wordt */
/* Zoekicoon altijd een 'klikbare box' maken */
#et_search_icon[role="button"] {
  display: inline-flex;             /* flexbox in plaats van inline-block */
  align-items: center;              /* verticaal centreren */
  justify-content: center;          /* horizontaal centreren */
  width: 40px;                      /* vaste knopmaat */
  height: 40px;
  border-radius: 4px;
  cursor: pointer;
	margin:-10px; 
}

#et_search_icon[role="button"]:focus-visible {
  outline: 3px solid var(--focus-color);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px var(--focus-bg),
              0 0 0 6px var(--focus-color);
}


/* Basis: offscreen */
.skip-link {
  position: absolute;
  left: -9999px;
  top: auto;
}
/* Tonen bij focus (overrult Divi) */
html body a.skip-link:focus,
html body a.skip-link:focus-visible {
  position: fixed !important;
  left: 1rem !important;
  top: 2rem !important;
  z-index: 2147483647 !important; /* boven alles */
  padding: .5rem 1rem !important;
  background: #fff !important;
  color: #000 !important;
  text-decoration: none !important;
  border: 0px dashed #005fcc !important;
  box-shadow: 0 0 0 4px #fff, 0 0 0 7px #005fcc !important;
  border-radius: 4px !important;
}



.et-pb-slider-arrows a[role="button"]:focus-visible {
  outline: 2px solid #005fcc;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px #fff, 0 0 0 6px #005fcc;
}

/* einde focus */

/* einde focus */

/* screen-reader helpers (veilig, geen -9999px) */
.screen-reader-text,
.sr-only,.sr-onlyKahlo {
  position:absolute !important; width:1px !important; height:1px !important;
  padding:0 !important; margin:0 !important; overflow:hidden !important;
  clip:rect(1px,1px,1px,1px) !important; clip-path: inset(50%) !important;
  white-space:nowrap !important; border:0 !important; left:auto !important;
}

/* zoekveld krijgt alleen interactie als het zichtbaar/open is */
.et_pb_menu__search-form input[type="search"] {
  pointer-events: none;   /* geen klik / geen focus via muis */
}
/* als jij het open zet (JS hieronder), wordt ’ie weer interactief */
.et-search-open .et_pb_menu__search-form input[type="search"] {
  pointer-events: auto;
}


/* bar indien ingelogd */
body.admin-bar #wpadminbar #adminbar-search input,
body.admin-bar #wpadminbar #adminbar-search {
  color: #1c1c1c !important;
  background-color: #ffffff !important;
}


/* Zorg dat iconen nooit op opacity:0 blijven door waypoint/animatie */
.et_pb_blurb .et_pb_image_wrap .et-pb-icon,
.et_pb_blurb .et-waypoint .et-pb-icon {
  opacity: 1 !important;
}

/* Zet het juiste icon-font + zichtbare kleur (zonder alpha) */
.et_pb_blurb .et-pb-icon {
  font-family: "ETmodules" !important;
  color: #0e366d !important; /* geen #0e366d00 */
}
/* -------------------TOGGLE A11y ---------*/
/* Alleen van toepassing op jouw toegankelijke toggles */
/* -------------------TOGGLE A11y ---------*/
/* Alleen van toepassing op jouw toegankelijke toggles */
/* -------------------TOGGLE A11y Modern ---------*/
.accessible-toggle {
  margin-bottom: 0px;
}

/* Algemene box-sizing voor alles binnen de toggle */
.accessible-toggle *,
.accessible-toggle *::before,
.accessible-toggle *::after {
  box-sizing: border-box;
}
/* ===================================== */

/* Knop */
.accessible-toggle .toggle-button {
  all: unset;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 88%;
  font-size: 22px;
	line-height: 1.3em;
  font-weight: 600;
  padding: 20px 1.2em;
  color: #222;
  transition: background 0.3s;
}


/* Focus en hover */
.accessible-toggle .toggle-button:focus {
  outline: 3px solid #0066cc;
  outline-offset: 2px;
}

.accessible-toggle .toggle-button:hover {
  background: #f7f9fc;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
}

/* Chevron rechts */
.accessible-toggle .toggle-button::after {
  content: "\002B"; /* plus */
  font-size: 1.2em;
  margin-left: 1em;
  transition: transform 0.3s ease;
}

.accessible-toggle .toggle-button[aria-expanded="true"]::after {
  content: "\2212"; /* min */
}

/* Contentvlak */
.accessible-toggle [id^="toggle-content-"] {
  width: 93%;
  background: #fff;
  margin-top: 0;
  padding: 1em 1em 6em 1em;
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition: max-height 0.4s ease, opacity 0.3s ease;
	border-bottom: 4px solid #333;

}
.accessible-toggle [id^="toggle-content-"] h3
{
	margin-top:30px; 
}
.accessible-toggle a {
    text-decoration: underline;
    text-decoration-style: dotted;
    -webkit-text-decoration-color: #9b9b9b;
    text-decoration-color: #9b9b9b;
}
/* Als zichtbaar */
.accessible-toggle [id^="toggle-content-"]:not([hidden]) {
  max-height: 6200px;
  opacity: 1;
}

/* Donkerder begin  lichter eind, altijd voldoende contrast */
.toggles-container .et_pb_code:nth-child(1) .toggle-button { background-color: #d0deec; } /* donkerste */
.toggles-container .et_pb_code:nth-child(2) .toggle-button { background-color: #d6e2ef; }
.toggles-container .et_pb_code:nth-child(3) .toggle-button { background-color: #dde7f2; }
.toggles-container .et_pb_code:nth-child(4) .toggle-button { background-color: #e3ebf5; }
.toggles-container .et_pb_code:nth-child(5) .toggle-button { background-color: #e9eff7; }
.toggles-container .et_pb_code:nth-child(6) .toggle-button { background-color: #eef2f9; }
.toggles-container .et_pb_code:nth-child(7) .toggle-button { background-color: #f2f5fb; }
.toggles-container .et_pb_code:nth-child(8) .toggle-button { background-color: #f6f8fc; }
.toggles-container .et_pb_code:nth-child(9) .toggle-button { background-color: #fafbfd; }
.toggles-container .et_pb_code:nth-child(10) .toggle-button { background-color: #ffffff; } /* bijna wit */
.toggles-container .et_pb_code:nth-child(11) .toggle-button { background-color: #ffffff; } /* bijna wit */
/* en opnieuw */
/* Donkerder begin  lichter eind, altijd voldoende contrast */
.toggles-container .et_pb_code:nth-child(12) .toggle-button { background-color: #d6e2ef; }
.toggles-container .et_pb_code:nth-child(13) .toggle-button { background-color: #dde7f2; }
.toggles-container .et_pb_code:nth-child(14) .toggle-button { background-color: #e3ebf5; }
.toggles-container .et_pb_code:nth-child(15) .toggle-button { background-color: #e9eff7; }
.toggles-container .et_pb_code:nth-child(16) .toggle-button { background-color: #eef2f9; }
.toggles-container .et_pb_code:nth-child(17) .toggle-button { background-color: #f2f5fb; }
.toggles-container .et_pb_code:nth-child(18) .toggle-button { background-color: #f6f8fc; }
.toggles-container .et_pb_code:nth-child(19) .toggle-button { background-color: #fafbfd; }
.toggles-container .et_pb_code:nth-child(20) .toggle-button { background-color: #ffffff; } /* bijna wit */

/* Donkerder begin  lichter eind, altijd voldoende contrast */
.toggles-container .et_pb_code:nth-child(21) .toggle-button { background-color: #d0deec; } /* donkerste */
.toggles-container .et_pb_code:nth-child(22) .toggle-button { background-color: #d6e2ef; }
.toggles-container .et_pb_code:nth-child(23) .toggle-button { background-color: #dde7f2; }
.toggles-container .et_pb_code:nth-child(24) .toggle-button { background-color: #e3ebf5; }
.toggles-container .et_pb_code:nth-child(25) .toggle-button { background-color: #e9eff7; }
.toggles-container .et_pb_code:nth-child(26) .toggle-button { background-color: #eef2f9; }
.toggles-container .et_pb_code:nth-child(27) .toggle-button { background-color: #f2f5fb; }
.toggles-container .et_pb_code:nth-child(28) .toggle-button { background-color: #f6f8fc; }
.toggles-container .et_pb_code:nth-child(29) .toggle-button { background-color: #fafbfd; }
.toggles-container .et_pb_code:nth-child(30) .toggle-button { background-color: #ffffff; } /* bijna wit */


/* afwijkende kleur toggles-containerWit */
.toggles-containerWit .et_pb_code:nth-child(1) .toggle-button { background-color: #fafbfd; box-shadow: 6px 6px 18px 0px rgba(26, 0, 79, 0.1) !important;}
.toggles-containerWit .et_pb_code:nth-child(2) .toggle-button { background-color: #fafbfd; box-shadow: 6px 6px 18px 0px rgba(26, 0, 79, 0.1) !important;}
.toggles-containerWit .et_pb_code:nth-child(3) .toggle-button { background-color: #fafbfd; box-shadow: 6px 6px 18px 0px rgba(26, 0, 79, 0.1) !important;}
.toggles-containerWit .et_pb_code:nth-child(4) .toggle-button { background-color: #fafbfd; box-shadow: 6px 6px 18px 0px rgba(26, 0, 79, 0.1) !important;}
.toggles-containerWit .et_pb_code:nth-child(5) .toggle-button { background-color: #fafbfd; box-shadow: 6px 6px 18px 0px rgba(26, 0, 79, 0.1) !important;}
.toggles-containerWit .et_pb_code:nth-child(6) .toggle-button { background-color: #fafbfd; box-shadow: 6px 6px 18px 0px rgba(26, 0, 79, 0.1) !important;}
.toggles-containerWit .et_pb_code:nth-child(7) .toggle-button { background-color: #fafbfd; box-shadow: 6px 6px 18px 0px rgba(26, 0, 79, 0.1) !important;}
.toggles-containerWit .et_pb_code:nth-child(8) .toggle-button { background-color: #fafbfd; box-shadow: 6px 6px 18px 0px rgba(26, 0, 79, 0.1) !important;}
.toggles-containerWit .et_pb_code:nth-child(9) .toggle-button { background-color: #fafbfd; box-shadow: 6px 6px 18px 0px rgba(26, 0, 79, 0.1) !important;}
.toggles-containerWit .et_pb_code:nth-child(10) .toggle-button { background-color: #fafbfd; box-shadow: 6px 6px 18px 0px rgba(26, 0, 79, 0.1) !important;}


.accessible-toggle .toggle-button {
  all: unset;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 88%;
  font-size: 22px;
	line-height: 1.3em;
  font-weight: 600;
  padding: 20px 1.2em;
  color: #222;
  transition: background 0.3s;
}

/* DEMO buttons simulatie (in functions.php) [a11y_simulatie] */
/* Alleen stijlen binnen de shortcode wrapper */
.a11y-sim .demo-section {
  margin-bottom: 2rem;
  padding: 1rem;

}

/* Buttons binnen de shortcode */
.a11y-sim button {
  margin: 0.5rem 0.5rem 1rem 0;
  padding: 0.5rem 1rem;
  border: none;
  border-radius: 5px;
  background-color: #005fcc;
  color: white;
  cursor: pointer;
  font-size: 1.1rem;
  font-weight: 600;
	min-width: 196px;
}

.a11y-sim button:focus {
  outline: 3px solid orange;
  outline-offset: 2px;
}

/* Filtereffecten die op body worden toegepast */
body.low-contrast {
  filter: contrast(30%);
  background-color: #DBD8D8;
  color: #555;
}

body.blur {
  filter: blur(3px);
}

body.grayscale {
  filter: grayscale(100%);
}
/* einde opmaak en effect [a11y_simulatie] */




/* -------------------BLOG ---------*/
/* blog module als javascript uitvalt */
.no-js-only { display: none; }
html.no-js .js-only { display: none; }
html.no-js .no-js-only { display: block; }
/* Algemene container */
.kahlo-plain-blog {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 2rem;
}

/* Eén artikelblok */
.kahlo-plain-blog .kb-post {
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 6px;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* Titel */
.kahlo-plain-blog .kb-title {
  font-size: 1.6rem;
  margin: 0 0 .75rem;
  line-height: 1.4;
}

.kahlo-plain-blog .kb-title a {
  color: #222;
  text-decoration: none;
}

.kahlo-plain-blog .kb-title a:hover,
.kahlo-plain-blog .kb-title a:focus {
  text-decoration: underline;
}

/* Afbeelding */
.kahlo-plain-blog img {
  display: block;
  max-width: 100%;
  height: auto;
  margin-bottom: .75rem;
  border-radius: 4px;
}

/* Tekst */
.kahlo-plain-blog .kb-excerpt {
  flex: 1 1 auto;
  font-size: 1.1rem;
  line-height: 1.5;
  color: #444;
}

/* Paginering */
.kahlo-plain-blog .kb-pagination {
  grid-column: 1 / -1; /* Laat paginering onderaan over hele breedte lopen */
  margin-top: 1rem;
  text-align: center;
}

.kahlo-plain-blog .kb-pagination li {
  display: inline-block;
  margin: 0 .25rem;
}

.kahlo-plain-blog .kb-pagination a,
.kahlo-plain-blog .kb-pagination span {
  display: inline-block;
  padding: .4rem .7rem;
  border: 1px solid #ccc;
  border-radius: 4px;
  text-decoration: none;
}

.kahlo-plain-blog .kb-pagination a:hover,
.kahlo-plain-blog .kb-pagination .current {
  background-color: #005fcc;
  color: #fff;
  border-color: #005fcc;
}
/* einde BLOG opmaak zonder JS */



/* comments toegankelijkheid
form#commentform label{display:block!important;font-weight:600;margin:0 0 .25rem}*/ 


/* commentform: labels mogen niet display:none zijn */
form#commentform label {
  display: block !important;
}

/* labels visueel verbergen maar screenreaders laten lezen */
form#commentform p.comment-form-author > label,
form#commentform p.comment-form-email > label,
form#commentform p.comment-form-url > label,
form#commentform p.comment-form-comment > label {
  position: absolute !important;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

/* cookie-consent label zichtbaar laten */
form#commentform p.comment-form-cookies-consent label {
  position: static !important;
  width: auto;
  height: auto;
  margin: 0;
  clip: auto;
  clip-path: none;
  overflow: visible;
  white-space: normal;
}



/* ========== Voorlees-UI (gescoped) ========== */
.voorlees-controls{
  /* Variabelen alleen binnen deze widget */
  --vc-h: 1.6rem;         /* ~35px hoog */
  --vc-gap: .2rem;
  --vc-pad-x: .6rem;
  --vc-radius: .45rem;
  --vc-font: .95rem;
  --vc-accent: #738ca5;   /* subtiel grijsblauw */
}

.voorlees-controls.voorlees-controls-row{
  display:flex; align-items:center; gap:var(--vc-gap); flex-wrap:wrap;
}

.voorlees-controls .vc-label{ margin-right:.25rem; font-size:var(--vc-font); }

.voorlees-controls .vc-select,
.voorlees-controls .vc-btn{
  height:var(--vc-h);
  padding:0 var(--vc-pad-x);
  border:1px solid #c8c8c8; border-radius:var(--vc-radius);
  background:#fff; font:inherit; font-size:var(--vc-font); line-height:1;
}

/* Iets hogere opties (beter klikbaar) */
.voorlees-controls .vc-select,
.voorlees-controls .vc-select option{ font-size:1rem; }

.voorlees-controls .vc-btn{
  display:inline-flex; align-items:center; gap:.3rem; cursor:pointer;
}

.voorlees-controls .vc-btn[disabled]{ opacity:.55; cursor:default; }

/* Primaire knop: subtiel, lichte blauwgrijze achtergrond + zwarte tekst */
.voorlees-controls .vc-btn--primary{
  background:#e3e8ed;   /* licht blauwgrijs */
  border-color:#c0c8d0; /* iets donkerder rand */
  color:#000;           /* zwarte tekst */  
	font-weight:400 !important; /* normaal (niet vet) */
}

/* Hover/focus: iets donkerder */
.voorlees-controls .vc-btn--primary:hover,
.voorlees-controls .vc-btn--primary:focus-visible{
  background:#d1d8df;
  border-color:#a8b2bb;
  color:#000;
	
}
/* Dropdown mag niet “afgehapt” worden door parent overflow */
.voorlees-controls{ overflow:visible; }

/* Focusring blijft fel en duidelijk – WCAG SC 2.4.7 */
.voorlees-controls :is(.vc-select,.vc-btn):focus-visible{
  outline:3px solid #0b5ea8; /* huisstijl blauw */
  outline-offset:2px;
}
.uitlegVoorlezen h2{
	font-weight:400 !important; /* normaal (niet vet) */
}

/* Mobiel: select kan breder */
@media (max-width:640px){
  .voorlees-controls .vc-select{ min-width:14rem; width:100%; }
}


/* standaard verbergen */
#voorlezenPC {
  display: none;
}

/* Alle niet-touch apparaten = desktops/laptops */
@media screen and (min-width: 1367px) {
  #voorlezenPC {
    display: block;
  }
}

/* --------------------------------------------------------------------------*/
/* einde toegankelijkheid */
/* --------------------------------------------------------------------------*/



/*
.MEGA menu opmaak in builder zelf!!!!*/


code {
  background-color: #f4f4f4;
  color: #000;
  padding: 0.2em 0.4em;
  font-size: 0.95em;
	font-weight:600;
  border-radius: 4px;
  font-family: 'Courier New', Courier, monospace;
  border: 1px solid #e0e0e0;
}

/* andere BIO laten zien op bepaalde pagina's -gebruikt in Builder */
/* Standaard tonen */
#BIOKarenNijst {
  display: block;
}
#BIOKarenNIjstRecl {
  display: none;
}

/*overons */
#kahloMEGA.dsm_mega_menu_0_tb_header .dsm-mega-menu-container:not(.mobile-menu) .dsm-mega-menu-item.dsm-native-menu>.dsm-submenu-container {
    left: auto;
    top: auto;
    right: 10px;
}
/* Verbergen van standaard tekst en tonen van alternatieve tekst op specifieke pagina's */
body.postid-3679 #BIOKarenNijst,
body.postid-1846 #BIOKarenNijst,
body.postid-1798 #BIOKarenNijst,
body.postid-448 #BIOKarenNijst{
  display: none;
}
body.postid-3679 #BIOKarenNIjstRecl,
body.postid-1846 #BIOKarenNIjstRecl,
body.postid-1798 #BIOKarenNIjstRecl,
body.postid-448 #BIOKarenNIjstRecl{
  display: block;
}




#top-header .container,
#main-header .container,
#main-content .container{
    width: 96%;
}

/* verbergen recaptcha v3 */
.grecaptcha-badge
{visibility: hidden; 
display:none !important;
	}
.LI-profile-badge {
    display: inline-block !important;
    visibility: visible !important;
    overflow: visible !important;
}


/* dIVI popup */
#et-boc .area-outer-wrap .da-close {
    position: absolute;
    right: 0;
    top: 0;
    display: block;
    box-sizing: content-box;
    width: 50px !IMPORTANT;
    height: 50px !IMPORTANT;
    line-height: 30px;
    text-decoration: none;
    text-align: center;
    font-family: Courier New,monospace;
    font-size: 50px !IMPORTANT;
    font-weight: 700;
    cursor: pointer;
    opacity: .7;
    transition: all .3s;
    pointer-events: all;
}

/* Landingspagina Checklist */
 #landingspagina {
            font-family: Arial, sans-serif;
            max-width: 800px;
            margin: 20px auto;
            padding: 20px;
            background-color: #F0F8FF;
            border-radius: 10px;
            box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
        }

 #landingspagina .checklist-item {
            display: flex;
            align-items: center;
            margin-bottom: 10px;
        }

#landingspagina .checklist-item::before {
      content: "\2713"; /* Unicode checkmark character */
        font-size: 18px;
        color: green;
        margin-right: 10px;
       }
		

#landingspagina .checklist-text {
    font-size: 16px;
	font-family: "Courier", monospace;
      }
#landingspagina .checklist-text strong {
        font-size: 16px;
		 font-family: Arial, sans-serif;;
        }

#landingspagina .cta-button {
            display: inline-block;
            padding: 10px 20px;
            color: #fff;
            text-align: center;
            text-decoration: none;
            border-radius: 5px;
            transition: background-color 0.3s ease;
        }

     #landingspagina .cta-button-blue {
            background-color: #004FA3;
		 color: #FFF!important;
		 font-weight: 700;
        }

    #landingspagina .cta-button-red {
            background-color: #B30000;
		color: #FFF!important;
		font-weight: 700;
        }

  #landingspagina .cta-button:hover {
            background-color: #0056b3;
        }

  #landingspagina .cta-buttons {
            margin: 20px;
            display: flex;
            justify-content: space-between;
        }
a.smallsilver {
   box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%);
	background-color:#ffffff;
	border-radius:6px;
	border:1px solid #dcdcdc;
	display:inline-block;
	cursor:pointer;
	color:#666666;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:13px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #ffffff;
}
.smallsilver:hover,
#mailpoet_form_5 .mailpoet_submit:hover{
	background:linear-gradient(to bottom, #f6f6f6 5%, #ffffff 100%);
	background-color:#f6f6f6;
}
.smallsilver:active {
	position:relative;
	top:1px;
}
a.smallorange, a.bigorange {
	color: #FFF !important;
	background: #ffcb8c;
	border: 1px solid #db9c51;
	font-weight: bolder;
	background-color: #FF8040;
	background-position: bottom;
	font-size: 1.1em;
}
.postid-1424 .mejs-overlay { /*klant */
	background-image: url(https://kahlowebsites.nl/wp-content/uploads/2020/11/MailPoett-tutorial.jpg) !important;
	background-color: #FFB191;
	    position: absolute;
    z-index: 10;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
}
.postid-6135 .mejs-overlay { /*klant */
	background-image: url(https://kahlowebsites.nl/wp-content/uploads/2020/11/Foto-aanleveren-voor-printwerk-website-1.jpg) !important;
	position: absolute;
	z-index: 10;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	cursor: pointer;
	border: 6px solid #333;
}


/*------------------------------------------------*/
/*-------------------[GENERAL]--------------------*/
/*------------------------------------------------*/

#et-info {
    float: left;
	margin-left:24px;
}
#main-header {
    border-bottom-width: 4px;
    border-bottom-style: solid;
    border-bottom-color: #CCCCCC; /* Lichtgrijze kleur voor de ondergrens */
    box-shadow: 0 8px 30px -6px #01295B; /* Voegt schaduw toe aan de onderkant: horizontale offset, verticale offset, blur radius, en schaduwkleur */
    background-color: #FFFFFF; /* Achtergrondkleur van de header, pas dit aan naar gewenste kleur */

}


/* WCAG <nav aria-label="Breadcrumb">
  <ul class="breadcrumbs">*/
.breadcrumbs {
  list-style: none;       /* geen opsommingstekens */
  display: flex;          /* horizontale lijst */
  gap: 0.5rem;            /* ruimte tussen items */
  padding: 0;
  margin: 0;
}

.breadcrumbs li {
  display: flex;
  align-items: center;
}

.breadcrumbs li::after {
  content: "\003E";           /* scheidingsteken */
  margin-left: 0.5rem;
}

.breadcrumbs li:last-child::after {
  content: "";            /* geen scheidingsteken achter de laatste */
}

.breadcrumbs [aria-current="page"] {
  font-weight: bold !important;      /* huidige pagina duidelijk maken */
}


.et_pb_text_inner a{text-decoration: underline;
    text-decoration-style: dotted;
    -webkit-text-decoration-color: #9b9b9b;
    text-decoration-color: #9b9b9b; 
}

#builderContent .et_pb_row.et_pb_row_0
{
	width:96%!important;
}
#builderContent h1, #builderContent h2{
    padding: 30px 0;
	
}
.et_pb_text_inner h4,.et_pb_text_inner h5
{
	padding: 30px 0;
}


#builderContent ul {
    list-style: none; /* Verwijder standaard bullets */
    padding-left: 30px;
    margin-top: 12px;
}


#builderContent ul li {
    margin-bottom: 7px; /* Ruimte tussen lijst-items */
    padding-left: 20px; /* Zorg dat de tekst begint na het vinkje */
    text-indent: -18px; /* Verplaats de eerste regel naar links zodat het vinkje zichtbaar blijft */
}

#builderContent ul li::before {
    content: "âś”"; /* Unicode-teken voor een vinkje */
    color: #f0a13b; /* Oranje kleur */
    font-size: 18px; /* Grootte van het vinkje */
    margin-right: 0px; /* Verminder de ruimte tussen vinkje en tekst */
    display: inline-block; /* Houd het vinkje inline met tekst */
    width: 18px; /* Consistente breedte */
}

#builderContent ul li a {
    word-break: break-word; /* Breek lange links correct af */
}

/* geen vinkje bij bv tabs: */
#builderContent ul.et-tabs-control li::before {
    content: none; /* Verwijder het vinkje */
}


#left-area a[href^="http"]:not([href*="kahlowebsites.nl"])::after,
#left-area a[href$=".pdf"],
#builderContent a[href^="http"]:not([href*="kahlowebsites.nl"])::after,
#builderContent a[href$=".pdf"],
.et_pb_testimonial_content a[href^="http"]:not([href*="kahlowebsites.nl"])::after {
  content: "\2197";  /* pijltje omhoog */
  font-size: 0.9em;
  margin-left: 4px;
  vertical-align: baseline;
}

#builderContent ol {
    list-style: none; /* Verwijder standaardnummering */
    padding-left: 0; /* Verwijder standaardinspringing */
    counter-reset: list-counter; /* Reset de teller */
    margin-top: 12px;
}

#builderContent ol li {
    margin-bottom: 22px; /* Ruimte tussen de items */
    padding-left: 0px; /* Ruimte voor de nummering */
    text-indent: 0; /* Geen negatieve inspringing nodig */
    position: relative;
    counter-increment: list-counter; /* Verhoog de teller */
}

#builderContent ol li::before {
    content: counter(list-counter); /* Gebruik de correcte teller */
    background-color: #F0A13B; /* Oranje achtergrond */
    color: white; /* Witte tekstkleur */
    font-weight: bold; /* Maak de cijfers vet */
    font-size: 16px; /* Pas lettergrootte aan */
    width: 25px; /* Maak het een cirkel */
    height: 25px; /* Zorg voor een vierkante basis */
    line-height: 25px; /* Centreer tekst verticaal */
    border-radius: 50%; /* Maak het een cirkel */
    text-align: center; /* Centreer tekst horizontaal */
    display: inline-block; /* Houd de nummering inline met de tekst */
    margin-right: 10px; /* Ruimte tussen nummer en tekst */
    vertical-align: middle; /* Zorg dat de nummers verticaal goed staan */
}
#builderContent ol li ul {
    counter-reset: none; /* Reset de teller voor geneste ul's */
    list-style: none; /* Zorg ervoor dat de ul geen standaard bullets toont */
    padding-left: 40px; /* Geef wat ruimte voor de geneste lijst */
}

#builderContent ol li ul li {
    counter-increment: none; /* Geen tellers voor ul-items */
    padding-left: 0; /* Geen extra inspringing nodig */
    margin-bottom: 10px; /* Optioneel, voor wat ruimte tussen de items */
}

#builderContent ol li ul li::before {
    content: none; /* Verwijder de nummering of bullets voor ul-items */
}


/* images */
.wp-caption {
    border: 0px solid #ddd;
    text-align: center;
    background-color: transparent;
    margin-bottom: 10px;
    max-width: 96%;
    padding: 8px;
}
.wp-caption-text {
    color: #236fb4 !important;
    font-size: 14px !important;
    font-family: 'Courier New', monospace !important;
    line-height: 1.4em;
    margin-top: 10px !important;
    font-weight: 700 !important;
}.wp-caption-text a {
 	color: #000000 !important;
    font-weight: bold !important;
	text-decoration: underline;
}
#builderContent img.alignleft, a img.alignleft,
#builderContent img.alignright, a img.alignright,
.wp-caption.alignleft,
.wp-caption.alignright{
    vertical-align: bottom;
    max-width: 60%!important;
}
#builderContent .wp-caption.alignright {
    margin: 0 0 20px 20px;
	max-width: 60%!important;
}
#builderContent .wp-caption.alignleft {
    margin: 0 20px 20px 0;
	max-width:60%!important;
}


form.et-search-form {
	max-width:25% !important;
	background-color: #F8FAFA !important;
	background-position: 0;	
	padding-left:12% !important;
	 
}
.et-search-form input
{
padding-left:8%;	
font-size: 1.2em;
}


/*-------------------vak met content--------------------*/
.et_blog_grid_equal_height article {/*blogs equal heights */
	overflow: hidden;
}
#blogsBuilder .et_pb_blog_grid .et_pb_image_container img {

  width: 100% !important; /* Zorgt ervoor dat de afbeeldingsbreedte auto is, zodat de aspect ratio behouden blijft */
  height: 200px !important; /* Stelt een vaste hoogte in voor de afbeeldingen */
	object-fit:cover;
}
img.alignleft,
picture.alignleft
{
	Margin-right:28px !important;
}
img.alignright,
picture.alignright
{
	Margin-left:28px !important;
}

#main-content .container:before {  /*hinderlijk streepje rechts */
    content: '';
    position: absolute;
    top: 0;
    height: 100%;
    width: 0px;
    background-color: #e2e2e2;
}
.caption p.caption-text {
    color: #236fb4 !important;
    font-size: 14px !important;
    font-family: 'Courier New', monospace !important;
	line-height:1.4em;
	margin-top:10px!important;
	 font-weight: bold;
}

.caption {
    border: 0px solid #ddd;
    text-align: center;
    background-color: transparent;
    margin-bottom: 10px;
    max-width: 96%;
    padding: 8px;
}


.et_pb_pricing_content ul
{
	margin-left:0px !important;
}
/* video emt code [embed] */

.postid-5827 .wp-video,
.postid-1424 .wp-video{
    max-width: 100%;
	width:100% !important;
    height: auto;
}
/*biografie Karen */

/* Stijl voor de afbeelding */
#KarenNijstBIO .author-image img {
    border-radius: 50%; /* Ronde afbeelding */
    border: 2px solid #FFD700; /* Subtiele gouden rand */

    object-fit: cover; /* Verhouding behouden */
    display: block;
    margin: 0 auto 10px; /* Centreren van de afbeelding */
}



div.et_pb_toggle_content{background-color: #FFFFFF !important;
  padding: 0px 20px 20px 20px !important;
margin-top:20px !important; }
.et_pb_module.uitlegVoorlezen div.et_pb_toggle_content{background-color: #F3F7FE !important;
  padding: 10px !important;
margin-top:14px !important; }
.et_pb_module.uitlegVoorlezen
{
	width: 100%!important; 
}

/* TABS (een functie in DIVI editor Classic ) */
/* Tabs container */
.et-tabs-container {
  background-color: #f0f0f0;
  padding: 20px;
  border-radius: 5px;
	margin: 20px auto !important;
}

/* ====== Tabs styling ====== */
#builderContent .et-tabs-control {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;             /* tabs netjes naast elkaar */
  gap: 5px;                  /* ruimte tussen tabs */
}

#builderContent .et-tabs-control li {
  margin: 0;
  padding: 0;
}

#builderContent .et-tabs-control li a {
  display: block;
  padding: 10px 30px !important;
  font-size: 14px;
  font-weight: bold;
  text-decoration: none;
  color: #000 !important;
  background-color: #f0f8ff; /* standaard tabkleur */
  border-radius: 5px 5px 0 0; /* boven afgerond, onder strak */
  transition: all 0.3s ease;
}

/* Hover effect */
#builderContent .et-tabs-control li a:hover {
  background-color: #0056b3;
  color: #fff !important;
}

/* Actieve tab */
#builderContent .et-tabs-control li.active a {
  background-color: #fff;
  color: #000 !important;
  border: 1px solid #ddd;      /* subtiel randje */
  border-bottom: none;         /* zodat hij "één geheel" lijkt met content */
  position: relative;
  z-index: 2;                  /* boven de content */
}


/* Tab content */
.et-slidecontent {
  padding: 10px;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 5px;
  margin-top: 10px;
}

/* Tab content wrapper */
.et-tabs-content {
  margin-top: 20px;
}

.et-tabs-content-main-wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

/* ------------ quiz hoe goed promoot jij je website  [promotion_quiz] ----------------- */
.doedequiz {
    display: inline-block;
    background-color: #F7A32E;
    color: #ffffff;
    text-decoration: none;
    font-size: 1.2em;
    font-weight: bold;
    padding: 15px 30px;
    border-radius: 10px;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2);
    text-align: center;
    transition: all 0.3s ease-in-out;
	margin: -20px 0 30px 0;

}

.doedequiz:hover {
    background-color: #e89227;
    box-shadow: 0px 6px 8px rgba(0, 0, 0, 0.3);
    transform: translateY(-2px);
}

.doedequiz:active {
    background-color: #d87b1e;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
    transform: translateY(1px);
}


#promotiequiz {
    max-width: 98%;
    margin: 0 auto;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 8px;
    background-color: #f9f9f9;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

#promotiequiz h2 {
    font-size: 1.5rem;
    margin-bottom: 20px;
    color: #333;
}

/* Vraagtekst (legend of label boven de antwoorden) */
#promotiequiz legend,
#promotiequiz .quiz-vraag-label {
    display: block;
    font-size: 1.1rem;
    font-weight: bold;
    color: #444;
    margin-top: 0.75rem;
	margin-bottom: 0.75rem;
}

/* Container voor elke antwoordoptie */
#promotiequiz .antwoord-optie {
    display: flex;
    align-items: center;
    margin-bottom: 0.5rem;
}

/* Ruimte tussen radio en labeltekst */
#promotiequiz input[type="radio"] {
    margin-right: 10px;
}

/* Label voor de radiobuttons */
#promotiequiz .antwoord-optie label {
    font-weight: normal;
    font-size: 1rem;
    color: #333;
    cursor: pointer;
}


#promotiequiz button {
    display: block;
    width: 98%;
    max-width: 300px;
    margin: 20px 0;
    padding: 10px;
    font-size: 1rem;
    color: #fff;
    background-color: #0073aa;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

#promotiequiz button:hover {
    background-color: #0056b3;
}

#promotiequiz input[type="radio"]:focus + label {
    outline: 2px solid #007bff;
}

#promotiequiz br {
    margin-bottom: 20px;
}
#quizuitslag {
    max-width: 800px;
    margin: 20px auto;
    padding: 20px;
    border: 2px solid #007bff;
    border-radius: 10px;
    background-color: #f8f9fa;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    text-align: center;
}

#quizuitslag h3 {
    font-size: 1.8rem;
    color: #333;
    margin-bottom: 15px;
}

#quizuitslag p {
    font-size: 1.2rem;
    color: #555;
    margin: 10px 0;
}

#quizuitslag a {
    display: inline-block;
    margin-top: 15px;
    padding: 10px 20px;
    font-size: 1rem;
    color: #fff;
    background-color: #007bff;
    border-radius: 5px;
    text-decoration: none;
    transition: background-color 0.3s ease;
}

#quizuitslag a:hover {
    background-color: #0056b3;
}
#quizuitslag h3::before {
    content: 'đźŹ†'; /* Emoji: Brein */
    font-size: 2.5em;
    margin-right: 10px;
    vertical-align: middle;
    display: inline-block;
}






/* --------------------------- calculator  [budget_calculator] ----------------- */
#budget-calculator {
    margin: 20px auto !important;
    padding: 16px;
    border: 1px solid #ddd;
    border-radius: 8px;
    background-color: #f9f9f9;
    max-width: 600px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}



/* Labels */

.kleineletter
{
	font-size:0.8em;
	line-height: 1.2em!important; 
	display:block;
}
#budget-calculator label {
    display: block;
    margin: 10px 0;
    font-size: 16px;
    color: #555;
	
	
}

/* Stijl voor select dropdowns */
#budget-calculator select {
    display: block;
    width: 100%;
    max-width: 100%;
    padding: 10px 12px;
    font-size: 14px;
    color: #555;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg xmlns%3D%22http%3A//www.w3.org/2000/svg%22 width%3D%2210%22 height%3D%2210%22 viewBox%3D%220 0 10 10%22%3E%3Cpath d%3D%22M0 3h10L5 9z%22 fill%3D%22%23777%22/%3E%3C/svg%3E');
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 10px;
    cursor: pointer;
    box-sizing: border-box;
}

#budget-calculator select:focus {
    border-color: #0073e6;
    outline: none;
    box-shadow: 0 0 5px rgba(0, 115, 230, 0.5);
}

/* Opties binnen de select */
#budget-calculator option {
    padding: 10px;
    font-size: 14px;
    color: #333;
}

/* Checkboxes */
#budget-calculator input[type="checkbox"] {
    margin-right: 10px;
    cursor: pointer;
}

#budget-calculator fieldset {
    border: none;
    padding: 0;
    margin: 15px 0;
}

#budget-calculator legend {
    font-weight: bold;
    color: #333;
    margin: 10px 0;
    font-size: 16px;
}

/* Knopstijl */
#budget-calculator button {
    display: block;
    width: 100%;
    padding: 12px;
    font-size: 16px;
    color: #fff;
    background-color: #0073e6;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    text-align: center;
    transition: background-color 0.3s ease;
}

#budget-calculator button:hover {
    background-color: #005bb5;
}

/* Resultaat box */
#budget-result {
    margin-top: 20px;
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: 8px;
    background-color: #e6f7ff;
    text-align: left;
}

#budget-result h4 {
    margin: 0;
    color: #00458A;
    font-weight: bold;
    font-size: 20px;
}

/* --------------------------- poll Star Rate ----------------- */

/* Om alles te centreren */
#poll-form {
    display: flex;
    flex-direction: column; /* Elementen onder elkaar */
    align-items: center; /* Horizontaal centreren */
    text-align: center; /* Tekst in het midden uitlijnen */
    margin: 70px auto -40px auto; /* Centraal in de container plaatsen */
	line-height: 1.4em;
}
#poll-form h4
{
	padding: 40px 0 0px 0!important;
	font-family: 'Poppins', Georgia, "Times New Roman", serif;
	font-size: 18px!important;
}
/* Poll-sterren centreren */
.poll-stars {
    display: flex;
    justify-content: center; /* Horizontaal centreren */
    gap: 10px; /* Ruimte tussen de sterren */
    margin-bottom: 15px; /* Ruimte onder de sterren */
}

/* Hoogte van het tekstvak aanpassen */
.poll-textarea textarea {
    width: 100%; /* Breedte behouden */
	max-width: 600px;
    min-height: 100px; /* Nieuwe hoogte */
    padding: 5px; /* Binnenruimte */
    border: 1px solid #ccc; /* Rand */
    border-radius: 4px; /* Afgeronde hoeken */
	font-size: 0.9em; 
}

/* Versturen-knop centreren */
#poll-submit-button {
    margin-top: 0px; /* Ruimte boven de knop */
    text-align: center;
	  width: 200px; /* Breedte van de knop */
    padding: 10px; /* Binnenruimte */
    background-color: #0073aa; /* Achtergrondkleur */
    color: white; /* Tekstkleur */
    border: none; /* Geen rand */
    border-radius: 4px; /* Afgeronde hoeken */
    cursor: pointer; /* Pointer-cursor bij hover */
    font-size: 16px; /* Tekengrootte */
}
#poll-results{
	margin-top: 20px; 
	font-weight: bold; 
	color: #333;
}
#poll-result-message{
	margin-top: 20px; 
	font-weight: bold; 
	color: green; 
	display: none;
}
/* Sterren styling */
.poll-stars .star {
    font-size: 35px; /* Grootte van de sterren */
    cursor: pointer; /* Handje bij hover */
    color: #736F6F; /* Grijze kleur voor niet-gekozen sterren */
}

.poll-stars .star.selected {
    color: gold; /* Gouden kleur voor geselecteerde sterren */
}

/* Resultatensterren */
.poll-stars-uitslag .star {
    font-size: 35px; /* Zorg dat resultaten consistent zijn */
    color: gold;
}

/* --------------------------- table ----------------- */
.hosting-tabel th[scope="row"] {
  background-color: #E7F1F9;
  font-weight: bold;
  text-align: left;
}
.hosting-tabel caption {
  caption-side: top;      /* boven de tabel, kan ook 'bottom' */
  text-align: left;       /* niet gecentreerd */
  font-size: 18px!important;        /* kleiner maken */
  font-weight: normal;    /* geen bold */
  margin-bottom: 0.5em;   /* wat ruimte */
  color: #333;            /* subtieler kleurtje */
}

#left-area table,
#builderContent table{
  border: 1px solid #ccc;
  border-collapse: collapse;
  margin: 18px 0;
  padding: 0;
  width: 100% !important;
  table-layout: fixed;
}

#left-area table caption,
#builderContent table caption{
  font-size: 1.5em;
  margin: .5em 0 .75em;
}

#left-area table tr,
#builderContent tr{
	background-color: #FAFBFC;
	border: 1px solid #ddd;
	padding: .35em;
}

#left-area table th,
#left-area table td,
#builderContent table th,
#builderContent table td{
  padding: .625em;
  text-align: left;
}

#left-area table th,
#builderContent table th{
  font-size: 1em;
  letter-spacing: .1em;
  text-transform: uppercase;
}

/*-------------------galerie--------------------*/
.et_pb_gallery_pagination {
	width: 100%;
	border-top: 1px solid #e2e2e2;
	position: relative;

	
}
.et_pb_gallery .et_pb_gallery_pagination ul li a {
    font-size: 22px !important;
    line-height: 16px;
    color: #999;	font-weight: bold !important;
}


.gallery {
	margin-top: 10px;
	margin-bottom: 18px;
	margin-left: 0% !important;
	padding: 0%;
	
}
.gallery .gallery-item {
	float: left;
	margin-top: 0;
	text-align: center;
	background: #F1F7FA;
	margin-right:2%;
	padding-top: 10px;
}


.gallery img {
	margin:0px !important;
	border-top-style: none !important;
	border-right-style: none !important;
	border-left-style: none !important;
	border-bottom-width: 4px !important;
	border-bottom-style: solid !important;
	border-bottom-color: #FFF !important;
	margin-left:auto !important;
	mergin-right:auto !important;
}
.gallery img:hover {
	background: white;
}
.gallery-caption, .gallery-item a { /*zorgt voor uitlijning, width staat in divi op 90% maar dat heet ook effect op het plaatje (bevat link) */
    width: 98%;
}
.gallery .gallery-caption {
	color: #888;
	font-size: 0.9em !important;
	margin: 5 0 12px;
	background-color: transparent;
	text-align: center;
	line-height: 1.1em;
}
.gallery dl, .gallery dt { margin: 0; }
.gallery br+br { display: none; }

.gallery-columns-1 .attachment-large,
.gallery-columns-1 .attachment-medium,
.gallery-columns-1 .attachment-thumbnail,
.gallery-columns-2 .attachment-full,
.gallery-columns-2 .attachment-thumbnail,
.gallery-columns-2 .attachment-medium,
.gallery-columns-2 .attachment-large,
.gallery-columns-3 .attachment-thumbnail,
.gallery-columns-3 .attachment-medium,
.gallery-columns-3 .attachment-large,
.gallery-columns-4 .attachment-thumbnail,
.gallery-columns-4 .attachment-medium,
.gallery-columns-4 .attachment-large,
.gallery-columns-5 .attachment-thumbnail,
.gallery-columns-5 .attachment-medium,
.gallery-columns-5 .attachment-large {
	height: auto;
	width:auto;
	
}


/*-------------------contactform 7--------------------*/

div.et-pb-contact-message p {

    padding: 17px;
    padding-bottom: 20px !important;
    font-size: 1.2em;
    background-color: #2ea3f2 !important;
    color: #FFFFFF !important;
}
.et-pb-contact-message ul li{
	color: #FFF;
}

div.wpcf7 {  /*wrap rondom een input (alle) veld */
	
	/*text-align: center !important;*/
	margin-top:20px;
}

/* recaptcha kan in de plugin worden ingesteld */ 
.wpcf7-form textarea,.wpcf7-form input[type="text"], input[type=tel], input[type="password"], .wpcf7-form input[type="email"] {
	outline: none;
	font-family: inherit;
	font-weight: inherit;
	line-height: normal;
	transition: 0.3s ease;
	margin-bottom:10px;

background-color: #F2F3F4 !important;
border: none !important;
width: 100% !important;
-moz-border-radius: 0 !important;
-webkit-border-radius: 0 !important;
border-radius: 0 !important;
font-size: 15px;
color: #000 !important;
padding: 16px !important;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
#vragenlijst .wpcf7-form textarea
{
	width: 90% !important;
	height:140px;
	background-color: #FFF !important;
}
#vragenlijst .wpcf7-form input[type="text"], #vragenlijst input[type=tel], #vragenlijst .wpcf7-form input[type="email"] {
	width: 90% !important;
	background-color: #FFF !important;
}


/* controle velden */
.wpcf7-form .wpcf7-response-output.wpcf7-validation-errors {
    color: #D8000C;
    background-color: #FFBABA;
    border: 0;
    padding: 14px;
}
.wpcf7 form.invalid .wpcf7-response-output, 
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.sent .wpcf7-response-output{
    color: #4F8A10;
    background-color: #DFF2BF;
    border: 0;
    padding: 14px;
}
/* select */
input[type=checkbox]
{
  /* Double-sized Checkboxes */
  -ms-transform: scale(1.5); /* IE */
  -moz-transform: scale(1.5); /* FF */
  -webkit-transform: scale(1.5); /* Safari and Chrome */
  -o-transform: scale(1.5); /* Opera */
  transform: scale(1.5);
  padding: 0px;
  margin-right:15px;
  margin-top:14px;
}
#vragenlijst span.wpcf7-list-item {
    display: block;
    margin: 0 0 0 1em;
}
input[type="file"] {
    cursor: pointer;
	  -ms-transform: scale(1.2); /* IE */
  -moz-transform: scale(1.2); /* FF */
  -webkit-transform: scale(1.2); /* Safari and Chrome */
  -o-transform: scale(1.2); /* Opera */
  transform: scale(1.2);
  margin-left:40px;
  margin-bottom:20px;
  box-shadow:inset 0px 1px 0px 0px #dcecfb;
	background:linear-gradient(to bottom, #EEF7FE 5%, #E1F0FD 100%);
	background-color:#EEF7FE;
}

.select-css {
	
	width: 220px;
	max-width:220px;
	box-shadow:inset 0px 1px 0px 0px #dcecfb;
	background:linear-gradient(to bottom, #EEF7FE 5%, #E1F0FD 100%);
	background-color:#EEF7FE;
	border-radius:6px;
	border:1px solid #84bbf3;
	display:inline-block;
	cursor:pointer;
	color:#333;
	font-family:Arial;
	font-size:14px;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #528ecc;
	margin-bottom:12px;
}
.select-css::-ms-expand {
	display: none;
}
.select-css:hover {
	border-color: #888;
	background:linear-gradient(to bottom, #E1F0FD 5%, #EEF7FE 100%);
	background-color:#E1F0FD;
}
.select-css:focus {
	border-color: #aaa;
	box-shadow: 0 0 1px 3px rgba(59, 153, 252, .7);
	box-shadow: 0 0 0 3px -moz-mac-focusring;
	color: #222;
	outline: none;
}
.select-css option {
	font-weight:normal;
}
/* Support for rtl text, explicit support for Arabic and Hebrew */
*[dir="rtl"] .select-css, :root:lang(ar) .select-css, :root:lang(iw) .select-css {
	background-position: left .7em top 50%, 0 0;
	padding: .6em .8em .5em 1.4em;
}

/* Disabled styles */
.select-css:disabled, .select-css[aria-disabled=true] {
	color: graytext;
	
}
.select-css:disabled:hover, .select-css[aria-disabled=true] {
	border-color: #aaa;
}

/* sbmit */
.wpcf7-submit.contactform7 {
	box-shadow:inset 0px 1px 0px 0px #54a3f7;
	background:linear-gradient(to bottom, #007dc1 5%, #0061a7 100%);
	background-color:#007dc1;
	border-radius:3px;
	border:1px solid #124d77;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:18px;
	padding:14px 10px;
	text-decoration:none;
	text-shadow:0px 1px 0px #154682;
}
#vragenlijst .wpcf7-submit.contactform7 {
	box-shadow:inset 0px 1px 0px 0px #54a3f7;
	background:linear-gradient(to bottom, #666 5%, #000 100%);
	background-color:#000;
	border-radius:3px;
	border:1px solid #124d77;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:24px;
	padding:14px 40px  !important;
	text-decoration:none;
	text-shadow:0px 1px 0px #154682;
}
.wpcf7-submit.contactform7:hover {
	background:linear-gradient(to bottom, #0061a7 5%, #007dc1 100%);
	background-color:#0061a7;
}
.wpcf7-submit.contactform7:active {
	position:relative;
	top:1px;
}

/*WPForms */
/* contactform */




#wpforms-form-247374 input.text, 
#wpforms-form-247374 input.title, 
#wpforms-form-247374 input[type=email], 
#wpforms-form-247374 input[type=password], 
#wpforms-form-247374 input[type=tel], 
#wpforms-form-247374 input[type=text], 
#wpforms-form-247374 select, 
#wpforms-form-247374 textarea {
    background-color: #fff!important;
    border: 2px solid #a7b0d4 !important;
    color: #242121 !important;
}
div.wpforms-container-full .wpforms-confirmation-container-full, div[submit-success]>.wpforms-confirmation-container-full:not(.wpforms-redirection-message) {
    background: #f4f7fc;
    border: 1px solid #C3D0DC; 
    box-sizing: border-box;
}
/* Voor alle placeholders op de site */
#wpforms-form-247374 ::placeholder {
  color: #666666; /* Donkergrijs – pas aan naar wens */
  opacity: 1;     /* Zorgt dat het niet semi-transparant is */
}

/* Voor oudere browsers (Edge, Firefox) */
#wpforms-form-247374 ::-webkit-input-placeholder {
  color: #666666;
  opacity: 1;
}
#wpforms-form-247374 :-moz-placeholder {
  color: #666666;
  opacity: 1;
}
#wpforms-form-247374 ::-moz-placeholder {
  color: #666666;
  opacity: 1;
}
#wpforms-form-247374 :-ms-input-placeholder {
  color: #666666;
  opacity: 1;
}
div.wpforms-container-full input[type=checkbox]:before, div.wpforms-container-full input[type=radio]:before {
    border-width: var(--wpforms-field-border-size);
    border-style: var(--wpforms-field-border-style);
    border-color: rgb(0 0 0 / 70%);
}
/* ALGEMENE STYLING scan aanvragen */

#wpforms-250162
{
	margin-top:-10px!important;
}
#wpforms-250162 .wpforms-field {
    margin-bottom:-6px;
}
#wpforms-250162 input::placeholder {
  color: #2E2C2C !important;
  font-size: 16px !important;
  opacity: 1 !important;
	font-style: italic;
}

#wpforms-250162 input[type="text"],
#wpforms-250162 input[type="email"],
#wpforms-250162 textarea {
    width: 100%;
    padding: 14px 16px;
    font-size: 16px;
    line-height: 1.5;
    border: 1px solid #ccc;
    border-radius: 8px;
    background-color: #f9f9f9;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}


/* LABELS */
#wpforms-250162 .wpforms-field-label {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 6px;
    display: block;
}


#wpforms-submit-250162 {
    background-color: #ffcc40;      /* Geel */
    color: #000;                    /* Zwarte tekst */
    font-weight: bold;
    font-size: 16px;
    padding: 12px 20px 22px 20px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.2s ease;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    display: inline-block;
}

#wpforms-submit-250162:hover {
    background-color: #f5b800;      /* Donkerder geel bij hover */
    transform: translateY(-1px);
}

#wpforms-submit-250162:focus {
    outline: 2px solid #000;
    outline-offset: 3px;
}


/*klant widget homepage */ 
.et_pb_gutters3 .et_pb_column_4_4 .et_pb_grid_item, .et_pb_gutters3 .et_pb_column_4_4 .et_pb_shop_grid .woocommerce ul.products li.product, .et_pb_gutters3 .et_pb_column_4_4 .et_pb_widget, .et_pb_gutters3.et_pb_row .et_pb_column_4_4 .et_pb_grid_item, .et_pb_gutters3.et_pb_row .et_pb_column_4_4 .et_pb_shop_grid .woocommerce ul.products li.product, .et_pb_gutters3.et_pb_row .et_pb_column_4_4 .et_pb_widget  {
    width:100%;
    margin-right: 0%;
    margin-bottom: 0%;
}

/* voorkom vreemde weergave buttons op bv iad */
input {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}

/* comments*/

body.comments-disabled #kahloReactiesBuilder { /* werkt alleen in combi met de functie function kahlo_add_body_class($classes) in functions.php */
    display: none;
}

#commentform textarea, #commentform input[type="text"], #commentform input[type="email"], #commentform input[type="url"] {
    padding: 12px;
    color: #999;
      width: 100%;
	background-color:#FFFFFF!important;
    font-size: 16px;
    border-width: 2px;
}

/* Comments */

.comment_avatar img {
    display: block;
    height: auto;
    max-width: 50px !important;
    width: auto;
	border-radius:45px;
}
.comment-body { /* de blokjes met de reacties */
	position: relative;
	margin-bottom: 10px;
	min-height: 87px;
	
	padding-top: 10px;
	padding-right: 140px;
	padding-bottom: 20px;
	padding-left: 70px;
	font-size:0.9em;
	line-height:1.4em;
		background-color:#FFF;

	}

.comment_avatar {
  left: 10px;
  position: absolute;
  top: 7px; }

.comment_avatar img {
  display: block;
  height: auto;
  max-width: 100%;
  width: auto; }

.comment_postinfo {
  margin-bottom: 8px; }

span.fn,
span.fn a { /* naam */
  color: #000;
  font-weight: 700;
  text-decoration: none;
  font-size: 16px;
  display: inline-block; }

span.comment_date {
  color: #000;
  font-size: 14px;
  font-weight: 300; }

.comment_area .comment-reply-link {
  position: absolute;
  top: 7px;
  right: 0;
  display: block; }

.comment-reply-link:hover,
.form-submit:hover {
  text-decoration: none; }

.comment .children {
	margin-left: 60px !important;
	padding-left: 0 !important;
}
.children .comment-body {
	background-color: #F9FBFF
}


/* -------------------------------------------- footer ----------------------- */

.kahlo-tagcloud {
  display: flex;
  flex-wrap: wrap;
  justify-content: center; /* <-- CENTREERT de inhoud */
  gap: 10px;
  padding: 20px;
  border-radius: 10px;
  text-align: center;
}

.kahlo-tag {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 6px;
  background-color: rgba(255, 255, 255, 0.04); /* subtiele achtergrond */
  font-weight: 600;
  text-decoration: none;
  transition: all 0.2s ease;
}

.kahlo-tag:hover {
  background-color: rgba(255, 255, 255, 0.15);
  transform: scale(1.05);
}




/* voor de kleutjes! de rest staat in de builder in de footer*/
/*
#categorized-tag-cloud
{
      line-height: 2em !important;
}
#categorized-tag-cloud-el-4 a, #categorized-tag-cloud-el-4 a:visited,
#categorized-tag-cloud-el-24 a, #categorized-tag-cloud-el-24 a:visited,
#categorized-tag-cloud-el-18 a, #categorized-tag-cloud-el-18 a:visited,
#categorized-tag-cloud-el-30 a, #categorized-tag-cloud-el-30 a:visited{
    color: #c7b !important;
}
#categorized-tag-cloud-el-1 a, #categorized-tag-cloud-el-1 a:visited,
#categorized-tag-cloud-el-7 a, #categorized-tag-cloud-el-7 a:visited,
#categorized-tag-cloud-el-14 a, #categorized-tag-cloud-el-14 a:visited{
    color: #bc1 !important;
}
#categorized-tag-cloud-el-27 a, #categorized-tag-cloud-el-27 a:visited,
#categorized-tag-cloud-el-2 a, #categorized-tag-cloud-el-2 a:visited,
#categorized-tag-cloud-el-16 a, #categorized-tag-cloud-el-16 a:visited,
#categorized-tag-cloud-el-21 a, #categorized-tag-cloud-el-21 a:visited{
    color: #09d !important;
}
#categorized-tag-cloud-el-11 a, #categorized-tag-cloud-el-11 a:visited,
#categorized-tag-cloud-el-3 a, #categorized-tag-cloud-el-3 a:visited,
#categorized-tag-cloud-el-28 a, #categorized-tag-cloud-el-28 a:visited{
    color: #f01 !important;
}
#categorized-tag-cloud-el-9 a, #categorized-tag-cloud-el-9 a:visited,
#categorized-tag-cloud-el-10 a, #categorized-tag-cloud-el-10 a:visited,
#categorized-tag-cloud-el-20 a, #categorized-tag-cloud-el-20 a:visited{
    color: #594 !important;
}


*/


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

#et-info-phone {
    margin-left: -5px!important;
	 position: relative;
    top: 5px; /* Pas de waarde aan om het telefoonnummer verder omhoog of omlaag te plaatsen */
}


.whatsapp
{
display:none;	
}


/* klant category woocommerce, wordpress, website */

.category-114 #media_image-3,
.category-114 #custom_html-2,
.category-61 #media_image-3,
.category-61 #custom_html-2,
.category-112 #media_image-4,
.category-112 #custom_html-2
{
display:none !important;	
}


	.gallery-columns-1 .gallery-item { width: 96% !important; min-height:380px;}
.gallery-columns-2 .gallery-item { width: 48% !important; height:350px; }
.gallery-columns-3 .gallery-item { width: 31% !important; height:240px;}
.gallery-columns-4 .gallery-item { width: 23% !important; height:200px;}
.gallery-columns-5 .gallery-item { width: 18% !important; height:300px;}
.gallery-columns-6 .gallery-item { width: 12% !important; height:300px;}
.gallery-columns-7 .gallery-item { width: 10% !important; height:300px;}




.gallery-columns-1 .attachment-large,
.gallery-columns-1 .attachment-medium,
.gallery-columns-1 .attachment-thumbnail{
	max-height:300px;
	
}
/* klant woocommerce shop */
.postid-5128 .gallery-columns-1 .gallery-item { width: 96% !important; min-height:480px; margin-bottom: 30px;}
.postid-5128 .gallery-columns-1 .attachment-large,
.postid-5128 .gallery-columns-1 .attachment-medium,
.postid-5128  .gallery-columns-1 .attachment-thumbnail{
	max-height:480px;
	
}


.gallery-caption {
	color: #888;
	font-size: 1em !important;
	background-color: transparent;
	text-align: center;
	line-height: 1.3em;
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 12px;
	margin-left: 0px;
	padding-top: 10px;
	padding-right: 40px;
	padding-bottom: 10px;
	padding-left: 40px;
}

.postid-5128 .gallery-columns-1  .gallery-caption {
	color: #888;
	font-size: 1em !important;
	background-color: transparent;
	text-align: center;
	line-height: 1.3em;
	margin-top: 16px;
	margin-right: 0px;
	margin-bottom: 12px;
	margin-left: 0px;
	padding-top: 20px;
	padding-right: 40px;
	padding-bottom: 20px;
	padding-left: 40px;
}




.gallery-columns-2 .attachment-full,
.gallery-columns-2 .attachment-thumbnail,
.gallery-columns-2 .attachment-medium,
.gallery-columns-2 .attachment-large{
	max-height:230px;
}


.gallery-columns-3 .attachment-thumbnail,
.gallery-columns-3 .attachment-medium,
.gallery-columns-3 .attachment-large{
	max-height:200px;
}

.gallery-columns-4 .attachment-thumbnail,
.gallery-columns-4 .attachment-medium,
.gallery-columns-4 .attachment-large {
	max-height:200px;
}
.gallery-columns-5 .attachment-thumbnail,
.gallery-columns-5 .attachment-medium,
.gallery-columns-5 .attachment-large {
	max-height:200px;
	
}

.gallery-columns-6 .attachment-thumbnail,
.gallery-columns-6 .attachment-medium,
.gallery-columns-6 .attachment-large {
	max-height:200px;
	
}
	.gallery-columns-7 .attachment-thumbnail,
.gallery-columns-7 .attachment-medium,
.gallery-columns-7 .attachment-large {
	max-height:200px;
	
}
	
}


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

#et-info-phone:before {
    /*content: ""; */
    position: relative;
    top: 2px;
    margin-right: 2px;
}	
.mega-link > a img {
 
    display: none !important;
}


img.whatsapp,
picture.whatsapp
{
	display: inline-block !important;
width:24px!important;
margin-left:5px;
	margin-right:10px; 
height:auto!important;
	float:left; 
}
.emailmenu
{
display:none;	
}
#et-info {
    float: left;
	margin-left:10px;
}
#videophone.phone
{
	width: 50%;
	
}
div.caption {
    border: 1px solid #ddd;
    text-align: center;
    background-color: transparent;
    margin-bottom: 10px;
    max-width: 64%;
    padding: 8px;
}
.postid-7756 .et_pb_pricing_table { /* wat kost een website */
    width: 100% !important;
    max-width: 100% !important;
}
/* verwijderen laatste berichten uit sidebar (is anders erg dubbel */
#sidebar .et_pb_widget.widget_recent_entries
{
display:none; 	
}
	/*#logo {
    min-height: 66px !important;
}*/

/*blogs*/
.et_pb_column .et_pb_blog_grid .column.size-1of2 {
    margin: 0 5.3% 0% 0 !important;
    width: 44.55% !important;
    clear: none;
    float: left;
}
.et_blog_grid_equal_height article{
		margin-bottom:30px !important; 
	}
	
	
.et_pb_image_container img.alignleft, .et_pb_post a img.alignleft,
.et_pb_image_container img.alignright, .et_pb_post a img.alignright{
    vertical-align: bottom;
    max-width: 80%;
}


.wpcf7-form textarea,.wpcf7-form input[type="text"],  input[type=tel], input[type="password"], .wpcf7-form input[type="email"],  input[type="search"] {
width:96%;	
}
	
		.gallery-columns-1 .gallery-item { width: 48% !important; min-height:320px;}
.gallery-columns-2 .gallery-item { width: 48% !important; min-height:320px;}
.gallery-columns-3 .gallery-item { width: 48% !important; min-height:320px;}
.gallery-columns-4 .gallery-item { width: 48% !important; min-height:280px;}
.gallery-columns-5 .gallery-item { width: 48% !important; min-height:280px;}
.gallery-columns-6 .gallery-item { width: 48% !important; min-height:320px;}
.gallery-columns-7 .gallery-item { width: 48% !important; min-height:320px;}
.gallery-columns-8 .gallery-item { width: 48% !important; min-height:320px;}
.postid-5128 .gallery-columns-1 .gallery-item {
    width: 98% !important;
    min-height: 320px;
}

.gallery .gallery-caption {
	font-size: 0.9em;
}

.gallery-columns-1 .attachment-large,
.gallery-columns-1 .attachment-medium,
.gallery-columns-2 .attachment-large,
.gallery-columns-2 .attachment-thumbnail,
.gallery-columns-3 .attachment-large,
.gallery-columns-3 .attachment-medium,
.gallery-columns-3 .attachment-thumbnail,
.gallery-columns-4 .attachment-large,
.gallery-columns-4 .attachment-medium,
.gallery-columns-4 .attachment-thumbnail,
.gallery-columns-5 .attachment-large,
.gallery-columns-5 .attachment-medium,
.gallery-columns-5 .attachment-thumbnail,
.gallery-columns-6 .attachment-large,
.gallery-columns-6 .attachment-medium,
.gallery-columns-6 .attachment-thumbnail,
.gallery-columns-7 .attachment-large,
.gallery-columns-7 .attachment-medium,
.gallery-columns-7 .attachment-thumbnail,
.gallery-columns-8 .attachment-large,
.gallery-columns-8 .attachment-medium,
.gallery-columns-8 .attachment-thumbnail,
.gallery-columns-9 .attachment-thumbnail
{
	max-width: 100%;
	max-height:220px;

}
.gallery-columns-5 .gallery-caption,
.gallery-columns-6 .gallery-caption,
.gallery-columns-7 .gallery-caption,
.gallery-columns-8 .gallery-caption,
.gallery-columns-9 .gallery-caption
{
	display:inline-block !important;
}

	
}
/* Responsive adjustments */
@media (max-width: 782px) {
	

  .et_pb_post h2, .et_pb_text_1 h2, .et_pb_text_2 h2, .et_pb_text_3 h2, .et_pb_text_4 h2, .et_pb_text_5 h2, .et_pb_text_6 h2, .et_pb_text_7 h2, .et_pb_text_8 h2, .et_pb_text_9 h2, .et_pb_text_10 h2, .et_pb_text_11 h2, .et_pb_text_12 h2, .et_pb_text_13 h2, .et_pb_text_14 h2, .et_pb_text_15 h2, .et_pb_text_16 h2, .et_pb_text_17 h2, .et_pb_text_18 h2, .et_pb_text_19 h2, .et_pb_text_20 h2, .et_pb_text_21 h2, .et_pb_text_22 h2, .et_pb_text_23 h2, .et_pb_text_24 h2, .et_pb_text_25 h2, .et_pb_text_26 h2, .et_pb_text_27 h2, .et_pb_text_28 h2, .et_pb_text_29 h2, .et_pb_text_30 h2, .et_pb_text_31 h2, .et_pb_text_32 h2 {
        font-size: 40px!important;
	  line-height: 1.2em!important; 
	}
	
  .et-tabs-control li {
    display: block;
    margin-bottom: 10px;
  }

    #promotiequiz {
        padding: 15px;
    }

    #promotiequiz label {
        font-size: 0.9rem;
    }

    #promotiequiz button {
        font-size: 0.9rem;
    }
	
    #top-header .container {
        flex-direction: column;
        align-items: flex-start;
    }

    #et-secondary-menu {
        flex-direction: column;
        gap: 5px;
    }

    #et-secondary-menu ul li a {
        width: 100%;
        text-align: center;
    }
	
.mega-link > a img {
 
    display: none !important;
}
		/* klant*/
#videophone.phone
{
	width: 90%;
	
}
	/*
h1 {
    font-family: 'Montserrat',Helvetica,Arial,Lucida,sans-serif !important;
	font-size: 27px; 
}
h2 {
    font-family: 'Montserrat',Helvetica,Arial,Lucida,sans-serif !important;
	font-size: 22px; 
}*/
/* Alle kolommen gelijke hoogte, aangepast aan de hoogste.
hier weer veranderen !!
toegevoegd in blogmudule theme buil;der: klas:.et_blog_grid_equal_height, vervolgens javascript bij integratie.  */
.et_blog_grid_equal_height article {
     height:auto!important;
}


/* images */
.et_pb_image_container img.alignleft, .et_pb_post a img.alignleft,
.et_pb_image_container img.alignright, .et_pb_post a img.alignright{
    vertical-align: bottom;
    max-width: 60%;
}
.wp-caption.alignright {
    margin: 0 0 20px 20px;
	width: 100%;
}
.wp-caption.alignleft {
    margin: 0 20px 20px 0;
	width:100%;
}

.comment-body { /* de blokjes met de reactie */
	padding-right: 30px;

	}
.postid-1424 .et_post_meta_wrapper.onderaan
{
	margin-left:1%;
}

}

@media only screen and (max-width:650px)
{
	
  .et_pb_post h2, .et_pb_text_1 h2, .et_pb_text_2 h2, .et_pb_text_3 h2, .et_pb_text_4 h2, .et_pb_text_5 h2, .et_pb_text_6 h2, .et_pb_text_7 h2, .et_pb_text_8 h2, .et_pb_text_9 h2, .et_pb_text_10 h2, .et_pb_text_11 h2, .et_pb_text_12 h2, .et_pb_text_13 h2, .et_pb_text_14 h2, .et_pb_text_15 h2, .et_pb_text_16 h2, .et_pb_text_17 h2, .et_pb_text_18 h2, .et_pb_text_19 h2, .et_pb_text_20 h2, .et_pb_text_21 h2, .et_pb_text_22 h2, .et_pb_text_23 h2, .et_pb_text_24 h2, .et_pb_text_25 h2, .et_pb_text_26 h2, .et_pb_text_27 h2, .et_pb_text_28 h2, .et_pb_text_29 h2, .et_pb_text_30 h2, .et_pb_text_31 h2, .et_pb_text_32 h2 {
        font-size: 30px!important;
	  line-height: 1.2em!important; 
	}
.home .et_pb_text_1 h2
 {
        font-size: 20px !important;
	 line-height: 1.4em!important; 
	}
.comment .children {
	margin-left: 0px !important;
	padding-left: 0 !important;
}
.comment .children a {
		font-size:0.8em!important
	}

/* image */
	div.caption {
    border: 0px solid #ddd;
    text-align: center;
    margin-bottom: 10px;
    max-width: 100%;
    padding: 8px;
}

.et_post_meta_wrapper.bovenaan .et_pb_post a img {
	vertical-align: bottom;
	max-width: auto;
	height:170px;
	object-fit: cover !important;
	object-position: 40% 30%; /* try 20px 10px */
}
#left-area table,
table.tablekahlo,
	#builderContent table,
	#builderContent table.tablekahlo{
    border: 0;
  }

  #left-area table caption,
table.tablekahlo caption,
	#builderContent table caption,
	#builderContent table.tablekahlo caption{
    font-size: 1.3em;
  }
  
  #left-area table thead,
table.tablekahlo thead,
	#builderContent table thead,
	#builderContent table.tablekahlo thead{
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }
  
  #left-area table tr,
table.tablekahlo tr,
	#builderContent table tr,
	#builderContent table.tablekahlo tr{
    border-bottom: 3px solid #ddd;
    display: block;
    margin-bottom: .625em;
  }
  
  #left-area table td,
table.tablekahlo td,
	#builderContent table td,
	#builderContent table.tablekahlo td{
    border-bottom: 1px solid #ddd;
    display: block;
    font-size: 1em;
    text-align: left;
  }
  
  #left-area table td::before,
table.tablekahlo td::before,
	#builderContent table td::before,
	#builderContent table.tablekahlo td::before{
    /*
    * aria-label has no advantage, it won't be read inside a #left-area table
    content: attr(aria-label);
    */
    content: attr(data-label);
    float: left;
    font-weight: bold;
    text-transform: uppercase;
  }
  
  #left-area table td:last-child,
table.tablekahlo td:last-child,
	#builderContent table td:last-child,
	#builderContent table.tablekahlo td:last-child{
    border-bottom: 0;
  }
  input[type="file"] {
    cursor: pointer;
	  -ms-transform: scale(1); /* IE */
  -moz-transform: scale(1); /* FF */
  -webkit-transform: scale(1); /* Safari and Chrome */
  -o-transform: scale(1); /* Opera */
  transform: scale(1);
  margin-left:2px;
  margin-bottom:20px;
  box-shadow:inset 0px 1px 0px 0px #dcecfb;
	background:linear-gradient(to bottom, #EEF7FE 5%, #E1F0FD 100%);
	background-color:#EEF7FE;
}
  #custom_html-2
  {
	display:none;  
  }
	.gallery-columns-1 .gallery-item { width: 96% !important; min-height:100px;}
.gallery-columns-2 .gallery-item { width: 96% !important; min-height:100px;}
.gallery-columns-3 .gallery-item { width: 96% !important; min-height:100px;}
.gallery-columns-4 .gallery-item { width: 96% !important; min-height:100px;}
.gallery-columns-5 .gallery-item { width: 96% !important; min-height:100px;}
.gallery-columns-6 .gallery-item { width: 96% !important; min-height:100px;}
.gallery-columns-7 .gallery-item { width: 96% !important; min-height:100px;}
.gallery-columns-8 .gallery-item { width: 96% !important; min-height:100px;}


.gallery .gallery-caption {
	font-size: 1em;
}

.gallery-columns-1 .attachment-large,
.gallery-columns-1 .attachment-medium,
.gallery-columns-2 .attachment-large,
.gallery-columns-2 .attachment-thumbnail,
.gallery-columns-3 .attachment-large,
.gallery-columns-3 .attachment-medium,
.gallery-columns-3 .attachment-thumbnail,
.gallery-columns-4 .attachment-large,
.gallery-columns-4 .attachment-medium,
.gallery-columns-4 .attachment-thumbnail,
.gallery-columns-5 .attachment-large,
.gallery-columns-5 .attachment-medium,
.gallery-columns-5 .attachment-thumbnail,
.gallery-columns-6 .attachment-large,
.gallery-columns-6 .attachment-medium,
.gallery-columns-6 .attachment-thumbnail,
.gallery-columns-7 .attachment-large,
.gallery-columns-7 .attachment-medium,
.gallery-columns-7 .attachment-thumbnail,
.gallery-columns-8 .attachment-large,
.gallery-columns-8 .attachment-medium,
.gallery-columns-8 .attachment-thumbnail,
.gallery-columns-9 .attachment-thumbnail
{
	width: 100%;
	height: auto;
	max-height:250px;
	 object-fit: cover;
}
		/* Poll: Hoogte van het tekstvak aanpassen */
.poll-textarea textarea {
    min-height: 170px; /* Nieuwe hoogte */
	font-size: 0.9em; 
}
	
	
	/* footer */
#main-footer .widget_search {
    width: 90%;
		margin-right: auto;
	margin-left:auto;

}
	
}

@media (max-width:479px){

.et_pb_post .entry-content { /* box met single post, zie ook .et_post_meta_wrapper img */

	padding: 5px;
	}
/* images */
	 div.caption {
    width: 100% !important;
}
.et_pb_image_container img.alignleft, .et_pb_post a img.alignleft,
.et_pb_image_container img.alignright, .et_pb_post a img.alignright{
    vertical-align: bottom;
    max-width: 100% !important;
	width: 100% !important;
}
.wp-caption.alignright {
    margin: 0 0 20px 20px;
	width: 100% !important;
	 max-width: 100% !important;
}
.wp-caption.alignleft {
    margin: 0 20px 20px 0;
	width: 100% !important;
	 max-width: 100% !important;
}
	#builderContent img.alignleft, a img.alignleft,
#builderContent img.alignright, a img.alignright{
    vertical-align: bottom;
    max-width: 100%!important;
}
#builderContent .wp-caption.alignright {
    margin: 0 0 20px 20px;
	width: 100%!important;
		max-width:100%!important;
}
#builderContent .wp-caption.alignleft {
    margin: 0 20px 20px 0;
	width:100%!important;
	max-width:100%!important;
}

img.alignright:not(.nietvergroten), img.alignleft:not(.nietvergroten), picture.alignright:not(.nietvergroten), picture.alignleft:not(.nietvergroten) {

    display: block;
    margin-left: 0px !important;
    max-width: 40% !important;
    margin-top: 18px;
	margin-bottom: 18px;
}

#bio-kunst img.alignleft
{
		width:80px !important;
	float:left; 
}
	/* voor kleine plaatjes */
img.alignleft.geen100pr
	{
		width:120px !important;
	float:left;
	
	}
img.alignright.geen100pr
	{
		width:120px !important;
	float:right;
	
	}	
}
@media (max-width:320px){
img.whatsapp 
{	
margin-left:10px;
}}

/* ----------- iPad Pro ----------- */
/* Portrait and Landscape */
@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
	  
	  #main-content
	  {
		  font-size:1.1em;
		  line-height: 1.5em;
	  }
	  .et_full_width_page .et_pb_post .entry-content {
    padding-left: 8%;
    padding-right: 8%;
}
}

/* Portrait */
@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
}

/* Landscape */
@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1.5) {

}

/* mobiel menu */
/*change hamburger icon to x when mobile menu is open*/
.et_header_style_left #et-top-navigation .mobile_menu_bar {
    padding-bottom: 18px; /* Afstand aan de onderkant */
    width: 50px; /* Breedte van het icoon */
    height: 50px; /* Hoogte van het icoon */
    border-radius: 50%; /* Maakt de achtergrond rond */
    background-color: orange; /* Achtergrondkleur */
    display: flex;
    justify-content: center;
    align-items: center;
}

.mobile_menu_bar:before {
    content: "\2630"; /* Unicode voor standaard hamburgericoon */
    font-size: 32px; /* Grootte van het icoon */
    color: white !important; /* Kleur van de streepjes */
    position: relative;
    cursor: pointer;
	padding-top:8px; 
}


#et_mobile_nav_menu .mobile_nav.opened .mobile_menu_bar::before,
.et_pb_module.et_pb_menu .et_mobile_nav_menu .mobile_nav.opened .mobile_menu_bar::before {
	content: '\4d';
}

/* Forceer mobiele navigatie naar de voorgrond */
#et_mobile_nav_menu,
.et_mobile_menu {
  z-index: 9999 !important;
 
}

/*adjust the new toggle element which is added via jQuery*/

ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,
ul.et_mobile_menu li.page_item_has_children .mobile-toggle,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,
.et-db #et-boc .et-l ul.et_mobile_menu li.page_item_has_children .mobile-toggle {
	width: 44px;
	height: 100%;
	padding: 0px !important;
	max-height: 44px;
	border: none;
	position: absolute;
	right: 0px;
	top: 0px;
	z-index: 999;
	background-color: transparent;
}


/*some code to keep everyting positioned properly*/

ul.et_mobile_menu>li.menu-item-has-children,
ul.et_mobile_menu>li.page_item_has_children,
ul.et_mobile_menu>li.menu-item-has-children .sub-menu li.menu-item-has-children,
.et-db #et-boc .et-l ul.et_mobile_menu>li.menu-item-has-children,
.et-db #et-boc .et-l ul.et_mobile_menu>li.page_item_has_children,
.et-db #et-boc .et-l ul.et_mobile_menu>li.menu-item-has-children .sub-menu li.menu-item-has-children {
	position: relative;
}


/*remove default background color from menu items that have children*/

.et_mobile_menu .menu-item-has-children>a,
.et-db #et-boc .et-l .et_mobile_menu .menu-item-has-children>a {
	background-color: transparent;
}


/*hide the submenu by default*/

ul.et_mobile_menu .menu-item-has-children .sub-menu,
#main-header ul.et_mobile_menu .menu-item-has-children .sub-menu,
.et-db #et-boc .et-l ul.et_mobile_menu .menu-item-has-children .sub-menu,
.et-db #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu {
	display: none !important;
	visibility: hidden !important;
}


/*show the submenu when toggled open*/

ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
#main-header ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
.et-db #et-boc .et-l ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
.et-db #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu.visible {
	display: block !important;
	visibility: visible !important;
}


/*adjust the toggle icon position and transparency*/

ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle {
	text-align: center;
	opacity: 1;
}


/*submenu toggle icon when closed*/

ul.et_mobile_menu li.menu-item-has-children .mobile-toggle::after,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle::after {
	position: relative;
	font-family: "ETModules";
	content: '\33';
	color: #0d0e0e;
	background: #f0f3f6;
	border-radius: 50%;
	padding: 8px;
	font-size: 18px;
}
.et_mobile_nav_menu button{
font-weight: 700 !important;
}
/*submenu toggle icon when open*/

ul.et_mobile_menu li.menu-item-has-children.dt-open>.mobile-toggle::after,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children.dt-open>.mobile-toggle::after {
	content: '\32';
}


/*add point on top of the menu submenu dropdown*/

.et_pb_menu_0.et_pb_menu .et_mobile_menu:after {
	position: absolute;
	right: 5%;
	margin-left: -20px;
	top: -14px;
	width: 0;
	height: 0;
	content: '';
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	border-bottom: 20px solid #ffffff;
}


/*adjust the position of the hamburger menu*/

.mobile_menu_bar {
	position: relative;
	display: block;
	bottom: 10px;
	line-height: 0;
}


/*force the background color and add a rounded border*/

.et_pb_menu_0.et_pb_menu .et_mobile_menu,
.et_pb_menu_0.et_pb_menu .et_mobile_menu ul {
	background-color: #ffffff!important;
	border-radius: 10px;
}


/* menu als js wegvalt (zie ook functions.php id 4) */
/* === No-JS fallback menu (child theme) === */
/* standaard verborgen (met JS aan) */
/* === No-JS fallback hamburger === */

/* standaard verbergen (JS aan) */
.no-js-hamburger { display:none; }

/* tonen zonder JS */
html.no-js .no-js-hamburger {
  display:block;
  background:#fff;
  border-bottom:1px solid #eee;
  float:right;
  clear:both;
  margin:.25rem 1rem .5rem 0;
  width:max-content;
}

/* knopstijl */
html.no-js .no-js-hamburger > summary {
  cursor:pointer;
  font-weight:700;
  font-size:1.05rem;
  line-height:1.2;
  padding:.55rem .9rem;
  color:#222;
  background:#fff;
  border:2px solid #ccc;
  border-radius:6px;
  display:inline-flex;
  align-items:center;
  gap:.5rem;
}


/* verberg marker */
html.no-js .no-js-hamburger > summary::marker { display:none; }
html.no-js .no-js-hamburger > summary::-webkit-details-marker { display:none; }

/* icoon */
html.no-js .no-js-hamburger > summary::before {
  content:"\2630";
  font-size:1.1rem;
  line-height:1;
}

html.no-js .no-js-hamburger[open] > summary {
  background:#f7f7f7;
  border-color:#bbb;
}

/* focus zichtbaar */
html.no-js .no-js-hamburger > summary:focus {
  outline:3px solid #005fcc;
  outline-offset:2px;
}

/* lijststijl */
.no-js-menu-list {
  list-style:none;
  margin:0;
  padding:.5rem 0 1rem;
}
.no-js-menu-list > li > a {
  display:block;
  padding:.6rem 1rem;
  color:#222;
  text-decoration:none;
  line-height:1.3;
}
.no-js-menu-list > li > a:hover,
.no-js-menu-list > li > a:focus {
  background:#f7f7f7;
}
.no-js-menu-list a:focus {
  outline:3px solid #005fcc;
  outline-offset:2px;
}

/* submenus */
.no-js-menu-list .sub-menu {
  list-style:none;
  margin:0;
  padding:0 0 0 1rem;
  border-left:2px solid #eee;
}
.no-js-menu-list .sub-menu a {
  padding:.5rem 1rem;
}

/* verberg mobiel menu & zoekknoppen zonder JS */
html.no-js .et_mobile_nav_menu,
html.no-js .et_pb_menu__search-button,
html.no-js .et_pb_menu__search,
html.no-js .et_pb_menu__search-container,
html.no-js .dsm-mega-menu-search-button,
html.no-js .dsm-mega-menu-search-container,
html.no-js .dsm-mega-menu-search-box {
  display:none !important;
}

/* === Logo rechts uitlijnen bij no-JS (Divi menu module #menuKahlo) === */
html.no-js #menuKahlo .et_pb_menu_inner_container{
  display:flex;              /* forceer flex */
  align-items:center;
}

/* menu/links eerst, logo helemaal rechts */
html.no-js #menuKahlo .et_pb_menu__wrap{ order:1; flex:1 1 auto; }
html.no-js #menuKahlo .et_pb_menu__logo-wrap{ order:2; margin-left:auto; }

/* kleine cosmetica */
html.no-js #menuKahlo .et_pb_menu__logo img{ display:block; height:auto; }
/* Alternatief zonder flex: forceer float rechts op het logo */
html.no-js #menuKahlo .et_pb_menu__logo-wrap{ float:right !important; }
html.no-js #menuKahlo .et_pb_menu__wrap{ overflow:hidden; } /* voorkomt overlap */


/* compacter op kleine schermen */
@media (max-width:480px) {
  html.no-js .no-js-hamburger { margin-right:.5rem; }
  html.no-js .no-js-hamburger > summary { padding:.5rem .75rem; font-size:1rem; }
}

