:root {
   /* Kleurenpalet */
   --donkerblauw: #233e85;
   --volblauw: #4a76cc;
   --lichtblauw: #e5f0f8;
	--lichtgroen: #caeacb;
	--donkergroen: #3a8d3b;
   --geel: #ffe4a9;
  --main-color: #4b76cc;
  --main-color-light: #f0faff;
  --main-color-dark: #0067b2;
  --inactive-button-bg: #c9c9c9;
  --red: #ed1c24;
  --black: #000000;
  --white: #ffffff;
  --green: #29af58;
  --brown: #b27036;
  --blue: #29abe2;
  --yellow: #ffb831;
  --gray-bg: #d7d7d7;
  --inactive: #b7b7b7;
}

body {
    margin: 0;
    padding: 0 0 120px;
   font-family: "Chivo", sans-serif;
   font-optical-sizing: auto;
   font-weight: 400;
   font-style: normal;
	font-size:16px;
	line-height:1.5em
}
.main {
    margin: 0 auto;
    background: white
}
.container {
    margin: 0 auto;
    display: grid;
    gap: 2.35%;
    padding: 0 4.3%;
	margin-bottom:2em
}
.col {
    background-color: #ddd;
    height: 50px;
	margin-bottom:50px
}
#header {background-image:url("../assets/images/header-bg-1900x1200.jpg");background-position: 50% 20%; background-size: cover; background-repeat: no-repeat;} 
.start {background-image:url("../assets/images/header-bg-1900x1200.jpg");background-size: cover; background-repeat: no-repeat;height:100vh}
	.identity {background-image:url("/img/blauw70.png");text-align:center}
.identity a:link, .identity a:visited {font-size:143.75%;color:white;text-decoration:none;display:inline-block;margin-top:16px;padding:60px 0 12px;background-image:url("hulp-voor-bestuivers.svg");background-size:114px 54px;background-repeat: no-repeat;background-position:top center}
.introductie {background:white;width: 80%; max-width:400px;margin:30px auto;padding:10px 20px 30px}

#main {}
/* breadcrumbs T */
.container.breadcrumb {margin-bottom:0}
.container.breadcrumb ul {padding: 10px 16px 0 0;list-style: none;margin:0 0 16px;}
.container.breadcrumb ul li {display: inline;font-weight:bold}
.container.breadcrumb ul li+li:before {padding: 8px;color: black;/*content: "/\00a0";*/}
.container.breadcrumb ul li a {color: #000; text-decoration: none;font-weight:normal;background-image:url("/extra/chevron.svg");background-repeat: no-repeat;background-position: right center;background-size: 8px 12px; padding-right:16px;margin-right:8px}
.container.breadcrumb ul li a:hover {color: #01447e;text-decoration: underline}

/* generieke grids */
.half-half {display: grid;gap: 2.35%; grid-template-columns: 1fr 1fr}
@media (max-width: 770px) {.half-half {grid-template-columns: 1fr}}
.een-twee {display: grid;gap: 2.35%; grid-template-columns: 1fr 2fr}
@media (max-width: 770px) {.een-twee {grid-template-columns: 1fr}}

/* stap */
.stap {background:var(--volblauw);background-image: url("/extra/hoek-vraag.svg");background-repeat:no-repeat;background-position:left top;background-size:35px 37px;color:white; display: grid;gap: 2.35%;
	grid-template-columns: 1fr 1fr;padding:30px 30px 30px 50px}
.stap.pre {padding:0;background:var(--lichtblauw);gap: 0.01%;color:black}

.buttons {display: grid;gap: 2.35%;
	grid-template-columns: 1fr 1fr;padding:0px}
.buttons .choice {padding:0 8px 16px}
@media (max-width: 1100px) {
	body {font-size:14px}
	.stap {grid-template-columns: 1fr;background:orange}
}
/* eindstap */
.eindstap {background:var(--lichtgroen); background-image: url("/extra/hoek-tool.svg");background-repeat:no-repeat;background-position:left top;background-size:35px 37px;color:black; display: grid;gap: 2.35%;
	grid-template-columns: 1fr;padding:30px 30px 30px 50px}
.eindstap.wijzer {background:var(--lichtblauw); background-image: url("/extra/hoek-hulp-links.svg");background-repeat:no-repeat;background-position:left top;background-size:35px 37px;color:black; display: grid;gap: 2.35%;
	grid-template-columns: 1fr;padding:30px 30px 30px 50px}

a:hover .tegel {outline: 3px solid var(--donkergroen);outline-offset:4px}
a:hover .tegel-extern {outline: 3px solid var(--volblauw);outline-offset:4px}
	.preview {grid-template-columns: 1fr;}
.knop2 {display: grid;gap: 5.35%;
	grid-template-columns: 1fr 1fr;
grid-template-rows: 60px 1fr 60px;}
@media (max-width: 770px) {
	.knop2 {grid-template-columns: 1fr}
	.nix {display:none}
}
.keuzes {padding-left:30px}
@media (max-width: 1100px) {
.keuzes {padding-left:0}
}



.knop {display:inline-block;border: 1px solid var(--donkerblauw);text-decoration:none;color: var(--donkerblauw);min-width:156px;width:100%;border-radius:6px;text-align:center;line-height:50px}
.knop:hover {background-color: var(--geel)}
.los {max-width:164px;margin-top:1em;border-width:2px}
.disabled {border: 1px solid var(--inactive);color: var(--inactive);cursor: default;}
.tw {padding-top:6px;padding-bottom:2px}
.tw span {display: inline-block;
  vertical-align: middle;
  line-height: normal;padding-bottom:6px}
.een {padding-top:6px;padding-bottom:2px}
.een span {display: inline-block;
  vertical-align: middle;
  line-height: normal;padding-bottom:6px}
.keuze {background:#fff}
.keuze:hover {background:var(--geel)}
.verwijzing a:link, .verwijzing a:visited {text-decoration:underline;color: var(--volblauw)}
.verwijzing a:hover {color: var(--donkerblauw)}
/* Tooltip container */
.tooltip {
  position: relative;
  display: inline-block;
  /*border-bottom: 1px dotted black; /* Add dots under the hoverable text */*/
  cursor: pointer;
}

/* Tooltip text */
.tooltiptext {
  visibility: hidden; /* Hidden by default */
  width: 100%;
  background: var(--inactive);
  color: #fff;
  text-align: center;
  font-size:85%;line-height:120%;padding: 2px 0;
  border-radius: 6px;
  position: absolute;
	left:0;
	top:70px;
  z-index: 100; /* Ensure tooltip is displayed above content */
}

/* Show the tooltip text on hover */
.tooltip:hover .tooltiptext {
  visibility: visible;
}

/* extra */
.extra.wijzer {background:var(--lichtblauw);background-image: url("/extra/hoek-hulp.svg");background-repeat:no-repeat;background-position:right top;background-size:35px 37px;}
.extra.afb {background:var(--lichtblauw)}
.extra.afb .verwijzing {height:100%;display: flex;
  align-items: flex-end}
.verwijzing {padding:10px 20px}
.verwijzing p, .verwijzing ul {font-size:90%;line-height:1.5em}
.verwijzing ul {margin:0;padding:0 0 0 16px}
.verwijzing p.credits {padding-bottom:8px;text-align:right;width:100%}
img.screenshot {border:1px solid grey}
.link {min-height:110px;vertical-align:center;line-height:100px;padding-left:30px}

/* bladeren door de eco-profielen */
.bladeren {display: grid;gap: 5.35%; grid-template-columns:38px 1fr 38px;vertical-align:middle;}
.knop-klein {max-width:45px;max-height:45px;}
.knop-klein a:link {border:1px solid var(--volblauw);border-radius:6px;color:var(--volblauw);width:36px;height:36px;display:block}
.knop-klein a.vorige {background:#fff url("/extra/vorige.svg") center center no-repeat;background-size:22px 13px;}
.knop-klein a.vorige:hover {background:var(--geel) url("/extra/vorige-hover.svg") center center no-repeat;background-size:22px 13px;}
.knop-klein a.volgende {background:#fff url("/extra/volgende.svg") center center no-repeat;background-size:22px 13px;}
.knop-klein a.volgende:hover {background:var(--geel) url("/extra/volgende-hover.svg") center center no-repeat;background-size:22px 13px;}
.knop-klein a:link span {display:none}
.profiel {text-align:center;vertical-align:middle}
.profiel h3 {margin:0;margin-top:8px}

.innerlink {padding:1em 0}
.link a:link, .link a:visited, .innerlink a:link, .innerlink a:visited {font-size:120%;border:1px solid var(--volblauw);border-radius:6px;color:var(--volblauw);background:#fff url("../extra/pijl-blauw.svg") right center no-repeat;background-size:24px 16px;padding:6px 50px 6px 12px;text-decoration:none;}
.link a:hover, .innerlink a:hover {background:var(--donkerblauw) url("../extra/pijl-wit.svg") right center no-repeat;border:1px solid var(--donkerblauw);background-size:24px 16px;color:white}
.link.wegwijzer {background-image:url("../extra/preview-wegwijzerbestuivers.png");background-size:135px 110px;background-position:left top;background-repeat:no-repeat}
.link.bestuivers-rodelijst {background-image:url("../extra/preview-bestuivers-rodelijst.png");background-size:135px 110px;background-position:left top;background-repeat:no-repeat}
.link.landschapsgericht-advies {background-image:url("../extra/preview-landschapsgericht-advies.png");background-size:135px 110px;background-position:left top;background-repeat:no-repeat}
.link.terreingericht-advies {background-image:url("/extra/preview-terreingericht-advies.png");background-size:135px 110px;background-position:left top;background-repeat:no-repeat}
/* type */
h1 {font-size:2.6em;font-weight:600;margin:20px 0;line-height:1.2em}
h2, h1.h2 {font-size:1.6em;line-height:1.2em}
.vraag H2 {margin-top:0}
.eindstap .vraag a:link, .eindstap .vraag a:visited {color: var(--volblauw);text-decoration:underline}
.stap .vraag a:link, .stap .vraag a:visited {color: white;text-decoration:underline}
.eindstap .vraag a:hover {color:var(--donkergroen)}
p {font-size:112.5%;margin:12px 0}
.pv {max-width:376px}
.vraag img, .extra img {max-width:100%}
@media (max-width: 1100px) {
	.link.wegwijzer {font-size:90%}
}
.c21 {
    grid-template-columns: 2fr 1fr;
}
@media (max-width: 640px) {
.c21 {
    grid-template-columns: 1fr;
}}


@media only screen and (min-width: 667px) {
	.main {
   /*background: #ffdeeb*/
}
.container {
    gap: 2.35%;
    padding: 0 4.3%
}
.c12 {
    grid-template-columns: repeat(6, 1fr);
}
.c6 {
    grid-template-columns: repeat(3, 1fr);
}
.c4 {
    grid-template-columns: repeat(2, 1fr);
}
.c3 {
    grid-template-columns: repeat(2, 1fr);
}
.c2 {
    grid-template-columns: repeat(1, 1fr);
}
}
	
@media only screen and (min-width: 1024px) {
	.main {
    /*background: #fce1ac*/
}
.container {
    gap: 2.35%;
    padding: 0 4.3%
}
.c12 {
    grid-template-columns: repeat(12, 1fr);
}
.c6 {
    grid-template-columns: repeat(6, 1fr);
}
.c4 {
    grid-template-columns: repeat(4, 1fr);
}
.c3 {
    grid-template-columns: repeat(3, 1fr);
}
.c2 {
    grid-template-columns: repeat(2, 1fr);
}
}

@media only screen and (min-width: 1366px) {
.main {
    /*background: transparent;*/
}
.container {
    max-width: 1280px;
    padding: 0
}
}

/* Footer 11-2025 */
.fsp {position: fixed;left: 0;bottom: 0;width: 100%;background-color: var(--main-color-light);border-top: 1px solid var(--main-color);}
.fc {max-width:1280px;margin:0 auto;display: grid;grid-template-columns:1fr 2fr;}
@media (max-width: 1366px) {.fc {padding:0 55px}}
.kip {font-weight: 700;text-transform: uppercase;font-size: 1rem;line-height: 1.2rem;padding-top:14px}
.kip a, .kip a:visited {text-decoration:none;color: var(--main-color);max-width:20em;display:inline-block}
.kip a:hover {text-decoration:underline}
.sp {padding:10px 0;text-align:right}
.sp a {text-decoration:none;min-height:40px}
.sp img {max-height:40px}
img.fw {max-height:32px} /* wur */
img.fe {margin:0 6vw 0 6vw;max-height:42px}/* eis */
img.fm {margin-right:5vw}/* lvvn */
img.fb {}/* bijenstrategie */
@media (max-width:1076px) {img.fe {margin:0 3vw 0 3vw} img.fm {margin-right:2.5vw}}
@media (max-width:920px) /* mobiel */
{.fc {grid-template-columns:1fr} .kip {text-align:center} .kip a, .kip a:visited {max-width:500em;}.sp{text-align:center}img.fe {margin:0 10vw 0 10vw} img.fm {margin-right:8.5vw}}
@media (max-width:806px) {.sp img {margin-bottom:40px}}

/*  Media Queries  */

@media (max-width: 768px) {
	body {padding-bottom:220px}
}
.card .card-wrapper .align-items-center {
 align-items:start!important
}

.card .card-wrapper .align-items-center .image-wrapper img {margin-top:8px!important}
a.pdf:hover {text-decoration:underline}
a.pdf {
  background-image: url("data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMSAyMSI+PGRlZnM+PHN0eWxlPi5jbHMtMXtmaWxsOiNmZmY7fS5jbHMtMntmaWxsOiM0ZTRmNGY7fS5jbHMtM3tmaWxsOiNlZTI5MjQ7fTwvc3R5bGU+PC9kZWZzPjx0aXRsZT5kb2MtcGRmPC90aXRsZT48cG9seWdvbiBjbGFzcz0iY2xzLTEiIHBvaW50cz0iNC45NiAwLjk2IDEzLjc5IDAgMjAuODYgNy4wNyAyMC40NCAyMC44OCA0Ljk2IDE5Ljk4IDQuOTYgMC45NiIvPjxwYXRoIGNsYXNzPSJjbHMtMiIgZD0iTTIwLjYyLDYuNDcsMTQuMzkuMjVhLjg0Ljg0LDAsMCwwLS42LS4yNUg0LjlhLjg1Ljg1LDAsMCwwLS44NC44NFYyMC4xNkEuODUuODUsMCwwLDAsNC45LDIxSDIwYS44NS44NSwwLDAsMCwuODQtLjg0VjcuMDdBLjg3Ljg3LDAsMCwwLDIwLjYyLDYuNDdabS0uNTQuODItMS4zMi4zOVYxOC45SDYuMTZWMi4xaDdMMTMuNTcuNzhjMC0uMTQuMTUtLjA5LjE1LS4wOXY2YS40Mi40MiwwLDAsMCwuNDIuNDJoNlMyMC4yMyw3LjI0LDIwLjA4LDcuMjlaIi8+PHBhdGggY2xhc3M9ImNscy0zIiBkPSJNMTYuNDYsMTYuNTZIMFY4LjMySDE2LjQ2WiIvPjxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTEuMzQsMTUuMjFWOS43NUgzYzEuMjEsMCwyLjIzLjMsMi4yMywxLjY4YTEuNjcsMS42NywwLDAsMS0xLjg5LDEuNjhIMi41MnYyLjFabTEuMTctM2MuNjUsMCwxLjUuMiwxLjUtLjc4cy0uODQtLjc0LTEuNS0uNzZaIi8+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNNiw5Ljc5SDcuODVhMi40NCwyLjQ0LDAsMCwxLDIuNzMsMi4xMiwzLjExLDMuMTEsMCwwLDEsMCwuNjEsMi40NSwyLjQ1LDAsMCwxLTIuMTYsMi43LDIuMTgsMi4xOCwwLDAsMS0uNTcsMEg2Wm0xLjE4LDQuNThoLjZjMS4zOSwwLDEuNi0xLDEuNi0xLjgycy0uMjEtMS44NC0xLjYtMS44MmgtLjZaIi8+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNMTEuNDgsMTUuMjFWOS43NUgxNXYuOTFIMTIuNjRWMTJoMi4ydi45MWgtMi4ydjIuMzNaIi8+PC9zdmc+");
  background-repeat: no-repeat;
  background-size: 21px 21px;
  background-position: left 2px;
  padding-left: 1.6em;
}