:root {
    --zandbeige: #D1B7A8;
    --terracotta: #A9735D;
    --petrolblauw: #33798D;
    --honingbruin: #B78A4A;
}

/* ======== STANDAARD STYLING ======== */

html {
    scroll-behavior: smooth;
}
.container {
    max-width: 1400px;
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

a {
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    text-decoration: none;
}

p {
    color: #221E1F;
    font-size: 17px;
    line-height: 30px;
    font-family: "gotham", sans-serif;
}

input:focus,
textarea {
    outline: none !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "gotham", sans-serif;
    font-weight: 800;
    font-style: normal;
}

/* ======== HEADER ======== */

.menuwrap {
    background: #34534d;
    width: 100%;
    z-index: 99;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.menu-wrap {
    display: flex;
    justify-content: space-between;
    padding-top: 10px;
    padding-bottom: 10px;
    align-items: center;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.menuwrap.scroll {
    background: #34534d;
    -webkit-box-shadow: 0 0 10px 1px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 0 10px 1px rgba(0, 0, 0, .2);
    box-shadow: 0 0 10px 1px rgba(0, 0, 0, .2);
    padding-top: 10px;
    padding-bottom: 10px;
}

ul.menu-ul {
    display: flex;
    list-style: none;
    margin-bottom: 0;
}

a.interesse {
    background: var(--honingbruin);
    padding: 10px;
    border-radius: 40px;
    color: #fff !important;
}

a.interesse:hover {
    background: #fff;
    color: var(--honingbruin)!important;
}

ul.menu-ul a:hover {
    color: var(--honingbruin);
}

img.logo {
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    width: 230px;
}

img.logo-scroll {
    width: 40px;
}

.verdwijn {
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    opacity: 1;
}

.scroll .menu-wrap {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.scroll .verdwijn {
    opacity: 0;
}

svg#buurkamp_logo {
    width: 210px;
    display: block;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.scroll svg#buurkamp_logo {
    width: 155px;
}

ul.menu-ul a {
    color: #fff;
    margin-left: 20px;
    text-transform: uppercase;
    font-family: "gotham", sans-serif;
    font-weight: 600;
    font-size: 18px;
}

.slider-top img {
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.slider-vervolg {
    height: 850px;
    background-size: cover;
    background-position: center;
}

.modal-body.woning-modal {
    font-family: "gotham", sans-serif;
}

.innerafbeelding-1 {
    background-image: url("../img/afbeelding1.jpg");
    background-position: center;
    background-size: cover;
    height: 300px;
  
}


.innerafbeelding-2 {
    background-image: url("../img/afbeelding2.jpg");
    background-position: center;
    background-size: cover;
    height: 300px;
  
    display: flex;
    justify-content: center;
    align-items: center;
}

.innerafbeelding-3 {
    background-image: url("../img/afbeelding3.jpg");
    background-position: center;
    background-size: cover;
    height: 300px;

}

img.klein-logo {
    width: 50px;
}

.menuwrap.scroll .logo {
    width: 170px;
}

ul#menu-hoofdmenu {
    display: flex;
    list-style: none;
    align-items: flex-start;
}

td {
    width: 50%;
}

.slider-top {
    margin-top: -100px;
    z-index: -1;
}

ul#menu-hoofdmenu-2 a:hover {
    color: var(--honingbruin);
}

.interesse-knop a {
    background: #fff;
    color: var(--honingbruin)!important;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 10px;
}

/* ======== INTRO GEDEELTE ======== */

.innertekst {
    padding-right: 30px;
}

.hero {
    position: relative;
    overflow: hidden;
}

.map-wrapper {
    position: absolute;
    top: 0;
    right: 0;
    width: 50vw;
    height: 100%;
    overflow: hidden;
    background: #ddd;
}

.map-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform-origin: center center;
    transition: transform 0.1s ease-out;
}

@media (max-width: 991.98px) {
    .map-wrapper {
        position: static;
        width: 100%;
        height: auto;
    }
}

section.hero {
    position: relative;
    overflow: hidden;
    background-color: #D1B7A8;
    padding: 5rem 0;
}

section.hero h2 {
    text-transform: uppercase;
    font-size: 40px;
    text-wrap-style: pretty;
    margin-bottom: 25px;
    line-height: 38px;
    color: #fff;
}

.hero .text-col {
    position: relative;
    z-index: 2;
    padding-right: 2rem;
}

.hero .map-image {
    position: absolute;
    top: 0;
    right: 0;
    width: 50vw;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}

@media (max-width: 991.98px) {
    .hero .map-image {
        position: static;
        width: 100%;
        height: auto;
        margin-top: 2rem;
    }
}

/* ======== CONTENT ======== */

.witte-content {
    padding-top: 50px;
    padding-bottom: 80px;
    text-align: center;
}

.witte-content p {
    font-size: 18px;
    line-height: 35px;
}

.witte-content h3 {
    font-size: 50px;
    text-transform: uppercase;
    color: #337A8D;
    text-wrap-style: balance;
    margin-bottom: 50px;
    line-height: 45px;
}

.innertekst strong {
    padding-bottom: 10px;
    padding-top: 10px;
    display: block;
}

img.badge-logo {
    width: 60px;
    position: relative;
    top: -80px;
    z-index: 2;
}

.witte-content-vervolg img.badge-logo {
    width: 60px;
    position: relative;
    top: -40px;
    z-index: 2;
}

/* ======== FOTORIJ ======== */

.fotorij {
    margin-bottom: 50px;
    margin-top: 20px;
}

/* ======== WONINGEN ======== */

.woningen {
    background-image: url(../img/achtergrond.jpg);
    background-position: center;
    background-size: cover;
    padding-top: 90px;
    padding-bottom: 130px;
}

.woningen h4 {
    font-size: 40px;
    color: #fff;
    margin-bottom: 70px;
}

.woningen h5 {
    color: #fff;
    margin-top: 0;
    font-size: 16px;
    text-transform: uppercase;
    padding: 26px 20px;
    margin-bottom: 20px;
    margin-left: 20px;
    margin-right: -20px;
}

.woningen p {
    color: #fff;
}


#woningtypes{
    scroll-margin-top: 85px;
}

#situatie{
    scroll-margin-top: 85px;
}


.info {
    display: flex;
    justify-content: space-between;
    font-weight: 400;
    text-transform: none;
    font-size: 15px;
}

.info-wrap {
    padding-top: 15px;
    border-top: 1px solid #ffffff33;
    margin-top: 15px;
}

.tok1 {
    background: #5B327B;
}

.tok2 {
    background: #B2725A;
}

.vrijstaand1 {
    background: #127B92;
}

span.ondertitel {
    display: block;
    min-height: 20px;
    font-weight: 100;
    margin-top: 5px;
    font-size: 15px;
}

p.innertekst-types {
    padding-left: 20px;
    padding-right: 20px;
    text-wrap-style: balance;
    font-size: 17px;
}

/* ======== INTERESSE ======== */

.interesse {
    text-align: center;
    padding-top: 90px;
    padding-bottom: 20px;
    background: #D1B7A8;
    color: #222222;
}

.interesse h4 {
    text-transform: uppercase;
    font-size: 32px;
    margin-bottom: 26px;

}

.interesse p {
    color: #fff;
    font-weight: 400;
    font-size: 18px;
    padding-left: 50px;
    padding-right: 50px;
    color: #222222;
    text-transform: none;
}

a.button {
    background: #33798D;
    color: #fff;
    font-family: "gotham", sans-serif;
    font-weight: 800;
    text-transform: uppercase;
    padding: 12px 20px;
    border-radius: 15px;
    display: inline-block;
    font-size: 16px;
}

.button-bekijk {
    background: #fff !important;
    color: #000 !important;
    margin-left: 20px;
}

.button-bekijk:hover {
    background: #000!important;
    color: #fff !important;
}

.button-bekijk-twee {
    background: #fff !important;
    color: #000 !important;
}

.button-bekijk-twee:hover {
    background: #000!important;
    color: #fff !important;
}

a.button.button-interesse:hover {
    background-color:#000;
}

.knoppen {
    margin-top: 40px;
}


.innerlink {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

/* ======== FOOTER ======== */



#image-container {
    position: relative;
}

#panzoom {
    overflow: hidden;
    cursor: grab;
}

#panzoom:active {
   cursor: grab;
}

.controls {
    position: absolute;
    top: 20px;
    right: 20px;
    display: flex;
    gap: 5px;
    z-index: 10;
    font-family: "gotham", sans-serif;
    font-weight: 800;
}

.controls button {
    background: rgb(169 116 93);
    color: #fff;
    border: none;
    border-radius: 0;
    padding: 5px 10px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 10px;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    font-family: "gotham", sans-serif;
    font-weight: 800;
}

button#reset {
    font-size: 13px;
}

.controls button:hover {
    background: rgba(0, 0, 0, 0.9);
}

section#image-container {

}

button.sluitknlop {
    position: absolute;
    background: #000;
    color: #fff;
    border: none;
    font-size: 18px;
    padding: 8px 15px;
    font-weight: 500;
    right: 0;
    font-family: "gotham", sans-serif;
}

.inner p {
    font-weight: 600;
    text-transform: uppercase;
    display: block;
    padding-top: 10px;
}

.situatie-wrap {
    background-image: url(../img/achtergrond.jpg);
    background-position: center;
    background-size: cover;
    padding-top: 110px;
    padding-bottom: 110px;
}

span.onder.optie {
    pointer-events: none;
    opacity: 1 !important;
    background: #ffc200;
    padding: 5px 10px;
    border-radius: 50px;
    font-size: 15px;
}

span.verkocht.onder.voorbehoud {
    pointer-events: none;
    opacity: 1 !important;
    background: #ffc200;
    padding: 5px 10px;
    border-radius: 50px;
    font-size: 13px;
}

.legenda-blok-inner {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.legenda-blok-inner p {
    margin-bottom: 0px;
    font-family: "gotham", sans-serif;
    font-weight: 600 !important;
    font-size: 14px;
}

.blok {
    width: 40px;
    height: 25px;
    display: flex;
    margin-right: 10px;
}

.kleur1 {
    background: #5b327b;
}

.kleur2 {
    background: #b2725a;
}

.kleur3 {
    background: #127b92;
}

.kleur4 {
    background: #A3B18A;
}

/* ====== DOWNLOADS  =======*/

.rijtop {
    margin-bottom: -8px;
}

.titelbalk {
    color: #fff;
}

.titelbalk h5 {
    padding: 17px 20px;
    font-size: 17px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.downloads {
    background-image: url(../img/achtergrond.jpg);
    background-position: center;
    background-size: cover;
    padding-top: 100px;
    padding-bottom: 100px;
}

.innerdownloads a {
    color: #000;
    font-weight: 500;
    font-size: 16px;
    font-family: "gotham", sans-serif;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0;
    text-transform: none;
}

.innerdownloads {
    padding-top: 20px;
    padding-bottom: 20px;
    border-bottom: 1px dotted #444;
    padding-left: 0;
    padding-right: 5px;
}

.innerdownloads a:hover {
    color: var(--terracotta);
}

.innerdownloads:last-child {
    padding-top: 20px;
    padding-bottom: 15px;
    border-bottom: 0px dotted #444;
}

.blok-downloads {
    background: #fff;
    padding: 10px 0 10px 0;
}

.blok-downloads i.fa-solid.fa-arrow-down {
    color: #a9745d;
    margin-left: 20px;
    display: block;
    position: relative;
    right: 15px;
}

h5.kavels {
    background: #A3B18A;
    margin-top: 60px;
}

/* ======  INTERACTIEVE KAART  =======*/

.\(Levensloop\)-button {
    background: #5a327b !important;
}

.Twee-onder-een-kap-woning-button{
     background: #b27259 !important;
}

.situatie .modal-content {
    padding: 0;
    border-radius: 15px !important;
    -webkit-box-shadow: 0 -5px 55px 0 rgb(0 0 0 / 30%);
    -moz-box-shadow: 0 -5px 55px 0 rgba(0, 0, 0, 0.3);
    box-shadow: 0 -5px 55px 0 rgb(0 0 0 / 30%);
    border-radius: 30px;
}

.modal-content {
    border-radius: 30px !important;
}

span.smalltwee {
    font-size: 12px;
    position: relative;
    top: -5px;
    font-weight: 400;
}

.innerblok-intro.text-left h1 {
    margin-bottom: 20px;
    font-size: 50px !important;
}

.blokinfo tr {
    height: 60px;
    border-bottom: 1px solid #dadada;
    font-size: 18px;
    line-height: 30px;
}


.blokinfo tr:last-child {
    height: 55px;
    border-bottom: 0 solid #dadada;
}

.infogedeelte {
    padding: 15px 30px 0;
}

.infogedeelte h1 {
    font-size: 25px;
}





.modal {
    background: rgb(0 0 0 / 6%);
    -webkit-backdrop-filter: blur(5px) brightness(90%);
    backdrop-filter: blur(5px) brightness(90%);
}

.modal-body {
    padding: 0;
}

.woning-modal img {
    /* border-top-left-radius: 20px; */
    /* border-top-right-radius: 20px; */
    margin-bottom: 20px;
}

.modal tr {
    height: 60px;
    padding-left: 5px;
    padding-right: 5px;
    font-size: 16px;
    border-bottom: 1px dotted #dadada;
}

.modal tr:last-child {
    border-bottom: 0 dotted #dadada;
}

h1.woningtype {
    font-size: 26px;
    margin-bottom: 30px;
    color: #221E1F;
    text-transform: uppercase;
}

.infogedeelte h2 {
    font-size: 19px;
    margin-bottom: 30px;
    color: #221E1F;
    font-weight: 400;
}

h1.titel-Twee-onder-een-kap-woning {
    color: #b2725a;
}

h1.titel-Vrijstaande.woning.\(Levensloop\) {
    color: #387a8f;
}

h1.titel-Twee-onder-een-kap-woning.\(Levensloop\) {
    color: #5b327b !important;
}

a.button-bekijk-woning.Vrijstaande.woning.\(Levensloop\)-button {
    background: #387a8f !important;
}

table {
    color: #221E1F;
}

span.vrij {
    pointer-events: none;
}

a.button-bekijk-woning {
    color: #fff;
    padding: 25px 20px;
    text-decoration: none;
    font-weight: 700;
    font-size: 14px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 30px;
    letter-spacing: 2px;
    background: var(--petrolblauw);
    -webkit-transition: all 0.2s 
ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    font-family: "gotham", sans-serif;
    font-weight: 800;
    text-transform: uppercase;
    margin-left: 0px;
}

a.button-bekijk-woning:hover {
    background: #3c3c3c !important;
    color: #fff;
}

i.fa-solid.fa-arrow-right {
    margin-left: 10px;
    font-size: 17px;
}

p.bouwnummer {
    font-size: 17px;
}

.kavel.vrij {
    fill: #00800000;
    opacity: 1;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    stroke-width: 5px;
    stroke: #000000;
    display: none;   /* DEZE VERWIJDEREN OM DE INTERACTIEVE KAART WEER AAN TE ZETTEN */
}

polygon.kavel.verkocht {
    display: none; /* DEZE VERWIJDEREN OM DE INTERACTIEVE KAART WEER AAN TE ZETTEN */
}



.tijdelijke-situatie polygon.kavel.verkocht {
    display: block!important; /* DEZE VERWIJDEREN OM DE INTERACTIEVE KAART WEER AAN TE ZETTEN */
}

.tijdelijke-situatie .kavel.vrij {
    fill: #00800000;
    opacity: 1;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    stroke-width: 5px;
    stroke: #000000;
	display: block;
}

.vrij:hover {
    fill: #00800091 !important;
    opacity: 0.8;
    cursor: pointer;
    stroke-width: 5;
}

polygon.kavel.Te.koop {
    fill: green;
    opacity: 0;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

polygon.kavel.Te.koop:hover {
    fill: green;
    opacity: 0.8;
    cursor: pointer;
}
.verkocht {
    fill: red;
    opacity: 0.75;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    pointer-events: none;
}

.witte-content-vervolg {
    padding-top: 10px;
    padding-bottom: 20px;
}

.verkocht2 {
    color: red;
}

.optie2 {}

.vrij2 {
    color: green;
}

.verkocht:hover {
    fill: red;
    opacity: 0.8;
    cursor: pointer;
}

.optie {
    fill: #ffc200;
    opacity: 0.5;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.optie:hover {
    fill: #ffc200;
    opacity: 0.8;
    cursor: pointer;
}

.voorbehoud {
    pointer-events: all;
    fill: #ffc200;
    opacity: 0.5;
}

.voorbehoud:hover {
    fill: #ffc200;
    opacity: 0.8;
    cursor: pointer;
}

span.voorbehoud {
    fill: #000 !important;
    opacity: 1;
    pointer-events: none;
}

.innerwit-informatie tr {
    height: 60px;
    border-bottom: 1px solid #ffffff4f;
    font-size: 17px;
    line-height: 30px;
    font-family: "gotham", sans-serif;
}

.innerwit-informatie tr:last-child {
    height: 55px;
    border-bottom:none
}

.inner {
    background: #ffffff;
    padding: 20px;
    -webkit-box-shadow: 0 -5px 50px 0 rgb(0 0 0 / 1%);
    -moz-box-shadow: 0 -5px 50px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 0px 20px 0 rgb(0 0 0 / 5%);
    border-radius: 15px;
        -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.21s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
}

.inner:hover {
    transform: translate(0px, -5px);
}

.plattegronden {
    background-position: center;
    background-size: cover;
    padding-top: 90px;
    padding-bottom: 90px;
    background: #fafafa;
}

.content-plattegronden {
    padding-bottom: 40px;
}

.legenda-blok {
    background-color: #f4f7f6;
    padding: 40px;
    display: flex;
    justify-content: space-between;
}

.Kavels-button {
    background: #A3B18A !important;
}

h1.titel-Kavels {
    color: #A3B18A;
}

/* ======== OVERLAY MENU ======== */

.hamburger {
    width: 40px;
    height: 42px;
    position: fixed;
    cursor: pointer;
    z-index: 99999999;
    right: 30px;
    top: 40px;
    display: none;
    opacity: 0;
}

.hamburger span {
    background: #fff;
    height: 5px;
    width: 100%;
    position: absolute;
    left: 0;
    transition: 0.4s;
    border-radius: 0;
}

.hamburger span:nth-child(1) {
    top: 0;
}
.hamburger span:nth-child(2) {
    top: 11px;
}
.hamburger span:nth-child(3) {
    top: 22px;
}

.hamburger.active span:nth-child(1) {
    transform: rotate(45deg);
    top: 9px;
     background: #B78A4A;
}
.hamburger.active span:nth-child(2) {
    opacity: 0;
    background: #B78A4A;
}
.hamburger.active span:nth-child(3) {
    transform: rotate(-45deg);
    top: 9px;
    background: #B78A4A;
}

.current_page_item a {
  color: var(--honingbruin) !important;
}

i.fa-solid.fa-arrow-down {
    color: #a9745d;
}

ul#menu-hoofdmenu-2 {
    display: flex;
    list-style: none;
    align-items: center;
}

.scroll .menu-blok ul {
    margin-bottom: 0;
}

.menu-blok {
    display: flex;
    align-items: center;
}

ul#menu-hoofdmenu-2 a {
    color: rgb(255, 255, 255);
    margin-left: 25px;
    text-transform: uppercase;
    font-family: gotham, sans-serif;
    font-weight: 600;
    font-size: 19px;
    font-family: "gotham", sans-serif;
}

.container.menu-balk {
    display: flex;
    justify-content: space-between;
}

.menu-fixed {
    position: fixed;
    top: -120px;
    width: 100%;
    z-index: 1000;
    transform: translateY(-100%);
    transition: transform 0.6s;
}

.menu-fixed.visible {
    transform: translateY(0);
    -webkit-box-shadow: 0 0 10px 1px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 0 10px 1px rgba(0, 0, 0, .2);
    box-shadow: 0 0 10px 1px rgba(0, 0, 0, .2);
    top: 0;
}

.overlay {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, 0.7);
    opacity: 0;
    visibility: hidden;
    transition: 0.4s;
    z-index: 99999;
}

.overlay.active {
    opacity: 1;
    visibility: visible;
}

ul#menu-hoofdmenu-1 {
    display: flex;
    list-style: none;
}

.overlay .overlay-menu {
    position: absolute;
    top: 0;
    right: -350px;
    width: 350px;
    height: 100%;
    background: #fff;
    padding: 50px 30px;
    box-shadow: -2px 0 8px rgba(0, 0, 0, 0.4);
    transition: right 0.4s ease;
    overflow-y: auto;
    background: #34534d;
}

.overlay.active .overlay-menu {
    right: 0;
}

.overlay .overlay-menu .menu {
    margin: 0;
    padding: 0;
}

.overlay .overlay-menu .menu li {
    list-style: none;
    margin: 20px 0;
}

.overlay .overlay-menu .menu li a {
    color: #fff;
    font-size: 25px;
    text-decoration: none;
    transition: color 0.3s;
    font-weight: 800;
    font-family: "gotham", sans-serif;
    text-transform: uppercase;
}

.overlay .overlay-menu .menu li a:hover {
    color: #B78A4A;
}

.no-scroll {
    overflow: hidden;
}

nav.overlay-menu .menu {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    align-items: center;
}

/* ======== PARTIJEN ======== */

.partijen {
    padding-top: 70px;
    padding-bottom: 40px;
}

.partijen h5 {
    text-transform: uppercase;
    margin-bottom: 40px;
    color: #2c2c2c;
    font-size: 18px;
}

img.logo-partij {
    width: 190px;
}

img.logo-bemog {
    width: 270px;
    margin-bottom: 30px;
}

.margin-logo {
    margin-bottom: 25px;
}

.partijen p {
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    text-transform: none;
}

.downloads-blok {
    background-image: url(../img/achtergrond.jpg);
    background-size: cover;
    padding-top: 90px;
    padding-bottom: 90px;
}

a.download-button {
    background: #fff;
    padding: 15px 20px;
    display: inline-flex;
    margin-bottom: 20px;
    margin-right: 10px;
    border-radius: 20px;
    color: #000;
    font-family: "gotham", sans-serif;
    font-weight: 500;
    min-width: 22.5%;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    font-size: 17px;
    font-weight: 600;
    text-transform: none;
}

.downloads-blok h4 {
    font-size: 40px;
    color: var(--honingbruin) !important;
    margin-bottom: 40px;
    margin-left: 25px;
}

.download-button i.fa-solid.fa-arrow-down {
     color: var(--honingbruin) !important;
}

a.download-button:hover {
    background: var(--honingbruin) !important;
    color: #fff;
}

a.download-button:hover > i.fa-solid.fa-arrow-down {
    color: #fff!important;
}

.blokken .col-lg-4{
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}



.blokken .col-lg-4:hover {
    transform: translate(0px, -5px);
}

ul#menu-hoofdmenu-1 {
    display: flex;
    list-style: none;
    margin-bottom: 0;
}

ul#menu-hoofdmenu-1 a {
} a {
    color: #fff;
    margin-left: 20px;
    text-transform: uppercase;
    font-family: "gotham", sans-serif;
    font-weight: 600;
    font-size: 18px;
	margin-bottom:0px;
}
.current_page_item a {
    color: var(--honingbruin) !important;
}

h5.kaveltekst {
    background: #A3B18A;
}

input {
    background: #dadada;
    width: 100% !important;
    background-color: #f1f1f1;
    border: 1px solid #cdcdcd;
    height: 45px;
    margin-top: 5px;
    padding: 10px;
    color: #000;
    font-size: 17px;
	border-radius: 10px;
}

.question-type-text {
    text-align: left;
    font-weight: 500;
    margin-top: 10px;
}

.question-type-header, .question-type-profession, .question-type-marital_status, .question-type-radio, .question-type-static, .question-type-text, label.question {
    font-weight: 800;
    text-align: -webkit-left;
    margin-top: 20px;
}

div#tqq76229 {
    text-align: left;
}

label.question {
    width: 100%;
}

.extra-description{font-weight:500;}

select {
    background: #dadada;
    width: 100% !important;
    background-color: #f1f1f1;
    border: 1px solid #cdcdcd;
    height: 45px;
    margin-top: 5px;
    padding: 10px 12px;
    color: #000;
    border-radius: 10px;
}

.question-type-radio input {
    height: auto;
    width: inherit !important;
    font-weight: 100 !important;
}

button.btn-style {
    border: none;
    font-size: 20px !important;
    display: block;
    margin-top: 50px;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    margin-bottom: 50px;
    background: #33798D;
    color: #fff;
    font-family: "gotham", sans-serif;
    font-weight: 800;
    text-transform: uppercase;
    padding: 12px 20px;
    border-radius: 15px;
}

div#formname {
    display: none;
}

label[for="q76196"] {
    font-weight: 800;
    font-size: 30px;
    color: #b78a4a;
}


label[for="q76197"] {
    font-weight: 800;
    font-size: 20px;
}

label[for="q76227"] {
    font-weight: 800;
    font-size: 20px;
}

label[for="q76225"] {
  	margin-bottom:20px;
}

label[for="q76226"] {
  	margin-bottom:20px;
}

label[for="q76230"] {
  	margin-bottom:20px;
}

.extra-description br {
  display: none;
}

div#tqq76229 {
    margin-top: 20px;
}

.homedna-survey {
    font-family: "gotham", sans-serif;
    background: #fff;
    padding: 1px 40px 1px 40px;
    margin-bottom: 50px;
    border-radius: 20px;
    -webkit-box-shadow: 0 0 10px 1px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 0 10px 1px rgba(0, 0, 0, .2);
    box-shadow: 0 0 60px 0px rgb(0 0 0 / 12%);
}

.extra-description {
    font-weight: 400;
    font-size: 17px;
    padding-bottom: 0;
}


label {
    font-weight: 400;
}

#interesse {
    scroll-margin-top: 40px;
}

.modal-padding {
    padding: 40px;
}

h1.titel-modal {
    font-size: 31px;
    margin-top: 10px;
    margin-bottom: 40px;
    text-transform: uppercase;
}

span.ondertitel-modal {
    font-weight: 400;
    font-size: 23px;
    display: block;
}

.nav-tabs {
  border-bottom: 2px solid #e5e7eb;
  gap: 0.5rem;
    font-family: "gotham", sans-serif;
}

.nav-tabs .nav-link {
  color: #000000;
  font-weight: 500;
  border: none;
  border-bottom: 3px solid transparent;
  padding: 0.75rem 1.25rem;
  transition: all 0.25s ease;
}

.nav-tabs .nav-link:hover {
  color: var(--honingbruin) !important;
  background-color: transparent;
}

.nav-tabs .nav-link.active {
  color: var(--honingbruin) !important;
  background-color: transparent;
  border-bottom-color: var(--honingbruin) !important;
}

.nav-tabs .nav-link.disabled {
  color: #9ca3af;
}

.owl-carousel .slide {
    position: relative;
}

.badge {
    height: 320px !important;
    width: 340px !important;
    position: absolute;
    bottom: 50px;
    right: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    transform: rotate(5deg);
    object-fit: contain;
    aspect-ratio: inherit !important;
}

.text-left {
    text-align: left;
    margin-bottom: 60px;
    line-height: 30px;
    font-family: "gotham", sans-serif;
}

.text-left strong {
    font-size: 20px;
    margin-left: 20px;
}