/*
Theme Name: Leenattent
Theme URL: https://smeckdesigns.com
Author: Smeckdesigns.com
Author URL: https://smeckdesigns.com

*/


/* HTML5 Reset
---------------------------------------------------------------------------- */

/* normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
---------------------------------------------------------------------------- */
/* stylelint-disable */
html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}
.genesis-skip-link {display:none}
/* stylelint-enable */




/*basic*/

html {
font-size: 62.5%;
	scroll-behavior: smooth;
}

a, div, span, button, input, p, article, tr, td, section, h1, h2, h3, h4, h5, img, :after, :before {transition:0.3s ease all !important}

body {
	margin:0;
	font-size: 18px;
	font-size: 1.8rem;
	overflow-x:hidden;
}

p {margin:0 0 1.2rem;line-height:1.75}
ul {padding:0;margin-left:20px;width:100%}
li {line-height:2;}


@keyframes fadein {

	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}

}

/* Site Container
--------------------------------------------- */

.site-container {
	animation: fadein 1s;
	word-wrap: break-word;
}



/* Site Inner
--------------------------------------------- */

.site-inner {
	clear: both;
	margin: 0 auto;
	padding: 0px;
    width: 100%;
    max-width: 1280px;
}


/* Site Header
---------------------------------------------------------------------------- */

header {
	background:white;
}


.header-outer {
  width: 100%;
  transition: transform 0.3s ease-in-out;
	background:white;
}

.header-outer.sticky {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
}

.header-outer.hidden {
  transform: translateY(-200%);
}

.header-wrap {
  display: flex;
  flex-wrap: wrap;
  width: calc(100% - 50px);
  padding:0 25px;
  justify-content: space-between;
  margin: 0 auto;
  align-items: center;
  background: white;
}
.placeholder {height: 0;}
img.custom-logo {
    height: auto;
    width: 300px;
}


/* Title Area
--------------------------------------------- */

.title-area {
	float: left;
	padding-bottom: 25px;
	padding-top: 25px;
	display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.wp-custom-logo .title-area {
	max-width: 350px;
	padding-bottom: 5px;
	padding-top: 5px;
	width: 100%;
}

.site-description,
.wp-custom-logo .site-title {
	border: 0;
	clip: rect(0, 0, 0, 0);
	height: 1px;
	overflow: hidden;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

header.entry-header {
    display: none;
}


.offerte-menu a:before {display:none !important}

/* Algemene styling
----------------------------------------------------------------------------------------------------------------------------------- */

:root {
	--zwart: #3A3A3A;
  	--wit: #ffffff;
	--rood1:#FF4367;
	--rood2:#C11E1F;
	--groen1:#65CE55;
	--groen2:#4A983E;
}


::selection {background-color:var(--rood1);color:white}
h1, h2 {    
	font-size: 4.6rem;
    line-height: 50px;
	font-weight:800;
	margin-top:0;
	margin-bottom:1rem;
	width:100%;
}
h3{font-size:3.6rem;width:100%;margin-bottom:1rem;}
h1 strong, h2 strong, h3 strong {color:var(--rood1);}


a {color:var(--rood1);text-decoration:none;cursor:pointer}

body {background-color:#F6F9FF;font-family:'Open Sans';color:var(--zwart)}
.site-inner {max-width:100%;overflow: hidden;}


.knop-rood, .knop-groen {
    background: var(--rood1);
    text-decoration: none;
    color: white;
    margin: 35px auto 0;
    padding: 15px 35px 25px;
    font-weight: 600;
    font-size: 3.5rem;
    position: relative;
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    box-shadow: none;
	cursor:pointer;
	top:0;
}
.knop-groen {background-color:var(--groen1);}
.knop-rood:before, .knop-groen:before  {
    content: "";
    width: 100%;
    height: 10px;
    position: absolute;
    bottom: 0px;    
	left: 0;
    background: var(--rood2);
}
.knop-groen:before{background: var(--groen2);}
.knop-rood:after, .knop-groen:after {
    content: "";
    background: url(/wp-content/uploads/2025/05/pijl.svg);
    height: 50px;
    width: 60px;
    margin-left: 35px;
    position: relative;
    display: inline-flex;
    background-size: contain;
    background-repeat: no-repeat;
}
.knop-rood:hover, .knop-groen:hover {
    box-shadow: -3px 3px 10px #00000044;
	top:-5px;
}
.knop-rood:hover:before, .knop-groen:hover:before {height:100%;}
.knop-rood p, .knop-groen p {margin: 0;z-index: 2;}
.contactform-footer-close {
    font-size: 1.6rem;
    padding: 10px 15px 20px;
    width: 50px !important;
    text-align: center;
    justify-content: center;
}
.contactform-footer-close:after {
    width: 30px;
    height: 25px;
    margin: 0;
    transform: rotate(-90deg);
}


.topbtn {
    position: fixed;
    bottom: 25px;
    right: 25px;
    background: var(--rood1);
    width: 50px;
    height: 50px;
    background-image: url(/wp-content/uploads/2025/05/pijl.svg);
    rotate: -90deg;
    background-size: 75%;
    background-position: center;
    background-repeat: no-repeat;
	z-index:3;
	overflow: hidden;
}
.topbtn.hidden {width:0;height:0}


/* Homepage ------------------------------------------------------------------
----------------------------------------------------------------------------------------------------------------------------------- */
.pic-right, .pic-left {
    position: relative;
	display: flex; 
	flex-wrap: wrap;
	z-index: 1;
}

.content-wrapper {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 100px 0;
	display:flex;
	flex-wrap:wrap;
	justify-content:start;
}
.pic-left .content-wrapper {justify-content:end;}

.content-wit {
    background: white;
    padding: 75px;
    width: 40%;
	max-width:500px;
    left: -5vw;
    position: relative;
}
.pic-left .content-wit{
	left:inherit;
	right:-5vw;
}
.home .pic-right .content-image {
	transform: rotateY(-180deg);
}
.hp-lenen-blok span {
    text-align: center;
    justify-content: center;
    display: flex;
    color: white;
    background: var(--zwart);
    font-size: 1.8rem;
    text-transform: uppercase;
    padding: 15px;
}
.lenen-4 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    border: 1px solid var(--zwart);
}
.lenen-4 a {
    padding: 20px;
    width: calc(50% - 100px);
    padding-left: 80px;
    color: var(--zwart) !important;
    height: 60px;
    display: flex;
    align-items: center;
	position:relative;
	box-shadow:none
}
.lenen-4 a:nth-child(odd) {border-right:1px solid var(--zwart);width: calc(50% - 101px);}
.lenen-4 a:nth-child(1), .lenen-4 a:nth-child(2) {border-bottom:1px solid var(--zwart)}
.lenen-4 a:before {
    display: block;
    content: url(/wp-content/uploads/2025/05/transfer.png);
    position: absolute;
    left: 20px;
    max-width: 50px;
    height: auto;
}
.lenen-4 a:nth-child(2):before {content: url(/wp-content/uploads/2025/05/home.png);}
.lenen-4 a:nth-child(3):before {content: url(/wp-content/uploads/2025/05/doller.png);}
.lenen-4 a:nth-child(4):before {content: url(/wp-content/uploads/2025/05/truck.png);}
.lenen-4 a:after{
	width:100%;
	background:var(--rood1);
	height:0;
	display:block;
	content:'';
	position:absolute;
	bottom:0;
	left:0
}
.lenen-4 a:hover {box-shadow:0 5px 25px #00000044}
.lenen-4 a:hover:after{height:10px;
}


section.center, section.center-klein {
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	text-align:center;
    width: calc(100% - 50px);
	max-width:1280px;
	margin: 0 auto;
	padding:100px 25px;
	position: relative;
}
section.center-klein{
	max-width:800px;
}
.whitebg:after {
    content: "";
    background: white;
    width: 150vw;
    position: absolute;
    left: -50vw;
    height: 100%;
    z-index: -1;
    top: 0;
}

.content-image {
display: block;
    position: absolute;
    top: 0;
    right: 0;
    left: 25%;
    height: 100%;
    width: 75vw;
    max-width: 1500px;
    background-size: cover;
    z-index: -1;

}
.pic-left .content-image {
    right: 25%;
    left: inherit;
}


.hp-triple {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    justify-content: space-between;
    align-items: center;
    text-align: center;
	column-gap:20px;
}
.triple-klein, .triple-groot {
    width: 27.5%;
    display: block;
	text-align:center;
    position: relative;
}
.triple-groot {width:35%;color:var(--rood2);}
.triple-groot img {width: 70%;}
.hp-triple img {margin:20px auto;}
.hp-triple span {display:block;font-size:2.4rem}
.percentage {font-size:3rem;}
.percentage strong {color:var(--rood2);}
p.triple-info {
    line-height: 1.5;
    color: var(--rood2);
    margin-top: 45px;
}
p.triple-info span {font-size:80%}
/* VERGELIJKING 
 -------------------------------------------------*/

.vergelijking-wrapper h2 {
    font-weight: 300 !important;
    font-size: 6rem;
    line-height: 1.1;
    margin: 0 0 50px;
}

.vergelijking-blok {
    width: 100%;
    background: white;
    padding: 50px;
    display: flex;
    flex-wrap: wrap;
	font-size:1.8rem;
	margin-bottom:25px;
	border: 1px solid #e3e3e3;
}

.vergelijking-wrapper .intro-vergelijking {
    font-size: 3rem;
    width: 65%;
    margin: 0 auto 25px;
}
.vergelijking-wrapper .vergelijking-disclaimer {
	width: 65%;
    margin: 0 auto;
}

.vergelijking-logos {
    display: flex;
    width: 100%;
    justify-content: end;
}
.vergelijking-logos span { width: 12.5%;}
.vergelijking-logos span img { max-width: 100px !important;}

.vergelijking {
    display: flex;
    width: 100%;
    justify-content: space-between;
    padding: 25px 0;
    border-top: 1px solid grey;
}
.vergelijking span { 
	width: 12.5%;
    text-align: center;
	font-weight:600;
}
.vergelijking span:first-child {width: 50%;text-align:left;}
.vergelijking span:nth-child(2) {color:var(--rood1);}
.vergelijking.voordeel {padding-bottom: 0;}
.vergelijking.voordeel span {color: var(--groen1);font-weight:700}
.vergelijking.voordeel span:first-child { color: var(--zwart);}
.vergelijking-disclaimer em {font-size: 80%;}



/* Content templates ------------------------------------------------------------------
----------------------------------------------------------------------------------------------------------------------------------- */

section.wide, section.klein, article.wide, article.klein {
	display:flex;
	flex-wrap:wrap;
    width: calc(100% - 50px);
	max-width:1280px;
	margin: 0 auto;
	padding:50px 25px;
	position: relative;
}
section.klein {
	max-width:800px;
}
section.wide img, section.klein img {max-width:100%}
section.content-intro { 
	justify-content:center;
	text-align:center;
	padding-bottom: 0;
}
section.content-intro h1{ font-size:6rem;}
span.subkop {
    margin: 0 0 25px;
    font-size: 2.5rem;
}
section.content-intro img {width:100%;height:350px;object-fit:cover;}
.sluiten-inline-berekenen   {z-index:2;    max-height: 50px;}
.content-intro .inline-berekenen { margin-top: -50px;}

.content-main-1 ul {column-count:2;}

.inline-berekening  {
  	height: 0;
  	overflow: hidden;
	width: 100%;
  	transition: height 0.5s ease;
  	background-color: #FFFFFF;
  	position: relative;
 	display: flex;
 	flex-wrap: wrap;
}
.inline-berekening.open {
    overflow: visible;
    margin: 50px auto -75px;
    padding: 50px 20px;
	width: 100vw;
    max-width: 1280px;
	height:auto;
}
.inline-berekening.open:after {
    background: #FFFFFF;
    display: block;
    content: "";
    width: 150vw;
    left: -50vw;
    height: 100%;
    position: absolute;
    top: 0;
}
.inline-berekening .content {
    padding: 20px;
    z-index: 1;
    width: 100%;
}
section.usp {
	background: white;
    margin: 50px auto;
    max-width: 450px;
    padding: 50px;
    width: calc(100% - 50px);
}
section.usp div li {list-style:none;position:relative;padding:0 0 15px 20px;}
	    section.usp div li:before {
        content: "✔";
        display: block;
        background: var(--groen1);
        width: 30px;
        height: 25px;
        text-align: center;
        color: white;
        border-radius: 20px;
        padding-top: 5px;
        position: absolute;
        left: -20px;
        line-height: 1;
        top: 5px;
    }

section.leningeninfo {margin:50px auto;}
.leningen-lijst {list-style:none;column-count: 2;margin:0}

/* Rekenvoorbeeld
 ------------------------------------------ */

.rekentabel {
    background: white;
    border: 1px solid;
	border-bottom:0;
} 
.rekentabel div {
    padding: 5px;
    border-bottom: 1px solid;
}
.rekentabel span {
    width: calc(16.6% - 10px);
    display: inline-flex;
    justify-content: center;
    text-align: center;
	padding:5px;
	color:var(--zwart)
}
.tabel-omschrijving span {width: calc(16.6% - 15px);}


/* FAQ 
 -------------------------------------------------*/
.faq h2 {font-size:3rem;margin:0 0 25px}
.faq-blok {
    padding: 25px;
    background: white;
    margin: 0 0 25px;
    width: 100%;
    overflow: hidden;
    box-shadow: 3px 3px 10px #00000033;
}

.faq-vraag {
	font-size: 2rem;
    cursor: pointer;
    width: calc(100% - 50px);
    justify-content: space-between;
    display: flex;
	margin:0;
	padding:25px 0 25px 25px;
}
.faq-vraag i {transition: transform 0.3s ease;}
.faq-vraag i.rotated {transform: rotate(180deg);}
.faq-antwoord {height:0;overflow:hidden}
.faq-antwoord.open {height:auto;padding:25px;}



/* OFFERTE AANVRAGEN ------------------------------------------------------------------
----------------------------------------------------------------------------------------------------------------------------------- */

section.offerte-intro div.content-offerte {max-width:880px;text-align:center;margin:0 auto}
.offerte-intro p { width: 100%;position:relative;}
.offerte-intro li {list-style:none;position:relative;padding-left:20px;}
.offerte-intro li:before{
	    content: "✔";
        display: block;
        background: var(--groen1);
        width: 30px;
        height: 25px;
        text-align: center;
        color: white;
        border-radius: 20px;
        padding-top: 5px;
        position: absolute;
        left: -20px;
        line-height: 1;
        top: 5px;
}

.berekenformulier {max-width:1280px;margin:0 auto}

/* Keuzes
----------------------------------------------------------------------------------------------------------------------------------- */
section.keuzes {
    column-gap: 20px;
	justify-content: center;
}
.hp-intro-content.voertuigen h1 {width:100%}
.keuze {
    width: calc(33% - 20px);
    display: flex;
    flex-wrap: wrap;
    background: white;
	margin-bottom:25px;
	box-shadow:none
}
.keuze:hover{box-shadow:3px 3px 10px #00000033}
.keuze div {
    padding: 0 25px;
    text-align: center;
	color:var(--zwart);
	display:flex;
	flex-wrap:wrap;
}
.keuze h3 {
    color: var(--rood1);
    font-size: 2.4rem;
}
.keuze b{width:100%;font-size:1.8rem;padding-bottom:10px}
.keuze img {
    height: 320px;
    object-fit: cover;
}
.keuze .knop-rood {
    font-size: 1.6rem;
    border: none;
    padding: 10px 30px;
    width: 100%;
    text-align: center;
    justify-content: center;
}

/* OVER ONS ------------------------------------------------------------------
----------------------------------------------------------------------------------------------------------------------------------- */

section.dubbel {
    display: flex;
    flex-wrap: wrap;
    column-gap: 100px;
}
section.dubbel div {width: calc(50% - 50px);}

section.overons-redenen {
    background: white;
    margin: 50px auto;
    padding: 100px;
    max-width: 1080px;
}
.overons-redenen h3 {
    font-weight: 500;
    font-size: 3rem;
}

.partner-logos {width: 100%;padding:50px 0;}
.partner-logos ul {
    list-style: none;
    margin: 0 auto;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    column-gap: 25px;
    align-items: center;
}
.partner-logos li {width: calc(33% - 15px);}
.partner-logos li img {width:180px}
section.samenwerken {
    text-align: center;
    display: flex;
    justify-content: center;
}
.samenwerken-links {
    display: flex;
    flex-wrap: wrap;
    column-gap: 25px;
}
.samenwerken .knop-rood, .samenwerken .knop-groen {font-size: 2rem;}
.samenwerken .knop-rood:after, .samenwerken .knop-groen:after {height:25px; width:30px;margin-left:20px}

.brochures-blok {height:0;display:none;position:relative}
.brochures-blok.open {height: auto;display:block;}

.brochures-blok.open div {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    column-gap: 25px;
}
a.brochure-btn {
    width: calc(50% - 75px);
    text-align: left;
    background: white;
    margin: 0 0 25px;
    padding: 25px;
    display: flex;
    flex-wrap: wrap;
    align-items: anchor-center;
    color: var(--zwart);
	box-shadow:none;
}
a.brochure-btn:hover {box-shadow:3px 3px 10px #00000033}
.brochures-blok.open div img {width: 75px;}
.brochures-blok.open div span {
    width: calc(100% - 95px);
    display: inline-block;
    margin-left: 20px;
}

/* Vacatures ------------------------------------------------------------------
----------------------------------------------------------------------------------------------------------------------------------- */
.vacature-wrapper {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin: 50px 0;
	column-gap: 25px;
}

article.vacature-content {
    background: white;
    margin: 50px auto;
}

.vacature-item {
    background: white;
    width: calc(30% - 50px);
    padding: 25px 25px 40px;
	color:var(--zwart);
	box-shadow: none;
}
.vacature-item:hover {box-shadow:3px 3px 10px #00000033}
.vacature-item h3     {margin: 0 0 15px;font-size: 3rem;height:70px}
.vacature-item p {margin-bottom: 35px;height:95px}
.leesmeervacature {
    background: var(--rood1);
    padding: 10px;
    color: white;
    font-weight: 700;
    border-bottom: 5px solid var(--rood2);
    width: calc(100% - 20px);
    display: block;
    text-align: center;
}
.leesmeervacature:hover{background-color: var(--rood2);}

/* FORMS 
 * -------------------------------------------------------------------- */
form input, form select {
    padding: 15px;
    border: 2px solid #cecece;
	width:calc(100% - 30px);
}
form input[type=submit] {width:auto;margin:0 auto !important;border:none}
form p {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
	column-gap:20px;
}
.contactfooter form span {
    font-size: 2rem;
    width: calc(50% - 20px);
    display: flex;
    margin: 0 0 25px;
}
.contactfooter form span.wpcf7-checkbox, .contactfooter form span.wpcf7-list-item, .contactfooter form span.wpcf7-list-item-label {
    width: 100%;
	margin-bottom:0;
    align-items: center;
}
.contactfooter form span.wpcf7-list-item-label {padding-left: 15px;}
input[type="checkbox"] { width: 50px; height: 50px;}
.contactfooter form span.wpcf7-spinner {
    width: 24px;
    display: inline-block;
    margin: 0;
}

span.wpcf7-not-valid-tip {width: 100% !important;}
.wpcf7-response-output {
    background: white;
    padding: 15px !important;
    box-shadow: 3px 3px 10px #00000033;
    text-align: center;
}


/* Klant aanmelden form */
.klant-aanmeldform p {
    justify-content: flex-start;
    flex-wrap: nowrap;
}
.klant-aanmeldform div {margin:10px 0}
.klant-aanmeldform div span {width:100%;}
.klant-aanmeldform div:first-child span:nth-child(1), .klant-aanmeldform div:first-child span:nth-child(2) {width: 30%;}
.klant-aanmeldform div:nth-child(3) span:nth-child(2), .klant-aanmeldform div:nth-child(3) span:nth-child(3) {width: 30%;}
.klant-aanmeldform div:nth-child(4) span:nth-child(1) {width:30%}
.klant-aanmeldform textarea {width:calc(100% - 30px);padding:15px; border: 2px solid #cecece;}
.klant-aanmeldform .wpcf7-list-item {
    width: 20%;
    display: inline-flex;
	margin:0;
}


/* footer form */

.bellen-form, .terugbellen-form  {
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    z-index: 9;
    background: white;
    display: none;
    flex-wrap: wrap;
    justify-content: center;
	align-content: flex-start;
	text-align:center;
}
.bellen-form.open, .terugbellen-form.open {display:flex}
.top-form {
    width: 100%;
    background: #F6F9FF;
    height: 25px;
    padding: 15px;
    margin-bottom: 50px;
}
.bellen-form-close, .terugbellen-form-close {
    width: 25px;
    display: block;
	float:right;
}
.bellen-form img, .terugbellen-form img {
    width: 90px;
    height: 90px;
}
.bellen-form-close img, .terugbellen-form-close img  {
    width: 20px;
    height: 20px;
}
.bellen-form p, .bellen-form span, .terugbellen-form p, .terugbellen-form span {width: 100%;}

.form-icon {margin-bottom:50px;}



.bellen-form p img, .terugbellen-form p img  { width:25px; height:auto;padding-right:15px;}
span.formkop {
    font-size: 3.4rem;
    width: 100%;
    font-weight: 300;
    margin-bottom: 25px;
}
.bellen-form a p, .terugbellen-form a p {width:100%}
.bellen-form a p {
    text-align: left;
    width: 60%;
}
.bellenform-btn {padding-left: 70px;}
.bellenform-btn:after {
    background: url(/wp-content/uploads/2025/05/telefoon-wit.svg);
    background-size: cover;
    width: 40px;
    margin: 0;
    left: 15px;
    position: absolute;
    height: 40px;
}
.terugbelformulier {width:90%;}

.terugbellen-form  .top-form {margin-bottom:25px}
.terugbellen-form img {margin-bottom:25px}
.terugbellen-form form p { width: 100%; text-align: center;column-gap:normal}
.terugbellen-form form .wpcf7-checkbox {display: flex;}
.terugbellen-form form .wpcf7-list-item {
    display: flex;
    align-items: center;
}
.terugbellen-form form input[type=submit] {
	border-bottom:5px solid var(--groen2);
	width:100%;
}
.terugbellen-form .wpcf7-form-control-wrap {
    margin-bottom: 20px;
}


/* TRUSTPILOT 
 * --------------------------------------------- */

.trustpilot-widget, .trustpilot-widget iframe {max-width:100%;}
.hp-trustpilot h2, .hp-trustpilot h2 b {
    font-weight: 300 !important;
    font-size: 6rem;
    line-height: 1.1;
    margin: -50px 0 50px;
}

/* FOOTER ------------------------------------------------------------------
----------------------------------------------------------------------------------------------------------------------------------- */

section.contactfooter {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
    width: calc(100% - 50px);
    max-width: 1280px;
    margin: 0 auto;
    padding: 100px 25px;
    position: relative;
}
.contactfooter h2, .contactfooter h2 strong {
	font-weight: 300 !important;
    font-size: 6rem;
    line-height: 1.1;
    margin: 0px 0 50px;
}
section.contactfooter span {font-size:3rem}
.contactfooter i {font-style: normal;;color:var(--rood1);}

.contactform-footer {
  	height: 0;
  	overflow: hidden;
	width: 100%;
  	transition: height 0.5s ease;
  	background-color: #F2F2F2;
  	position: relative;
 	display: flex;
 	flex-wrap: wrap;
}
.contactform-footer.open {
    height: 100%;
    overflow: visible;
    margin: 50px auto;
    padding: 50px 20px;
}
.contactform-footer.open:after {
    background: #f2f2f2;
    display: block;
    content: "";
    width: 150vw;
    left: -50vw;
    height: 100%;
    position: absolute;
    top: 0;
}
.contactform-footer .content {
    padding: 20px;
    z-index: 1;
    width: calc(100% - 40px);
    text-align: center;
}
.contact-form-btn {
    background: var(--zwart);
}
.contact-form-btn:before {background: var(--groen1);}

.footer-contact {
    width: 100%;
    padding: 50px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.footer-contact a {
    display: flex;
    flex-flow: column;
    align-self: baseline;
    font-size: 3rem;
    color: var(--groen1);
    margin: 0 50px;
}
.footer-contact img {
    width: 120px;
    padding: 0 50px 25px;
}

footer {
    width: calc(100% - 50px);
    max-width: calc(1280px - 50px);
    margin: 50px auto;
	padding: 0 25px;
    display: flex;
    flex-wrap: wrap;
}
.footer-columns {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}
.footer-1, .footer-2, .footer-3 {
    width: 20%;
}
.footer-1 {text-align:center;}
.footer-columns li {list-style: none;}
.footer-columns h4 {font-size:2.4rem;margin-top:0;    margin-bottom: 1rem;}
.footer-columns h4 strong{color:var(--rood1);font-weight:700;}
.footer-columns a {color:var(--rood2);}

#menu-footer-menu {margin:0}
#menu-footer-menu  li {line-height:1.5;}

.footer-vergunnning {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    text-align: center;
	font-size:80%;
    margin: 50px 0;
	position:relative;
	padding:50px 20px;
}

.footer-vergunnning .vergunning-icons {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-evenly;
    width: 100%;
    position: relative;
    align-items: center;
	margin:25px auto;
}
.vergunning-icons span {position: relative;}
.vergunning-icons img { width: 100px;}
.tooltip {
    position: absolute;
    width: 400px;
    background: #f2f2f2;
    padding: 15px;
    bottom: 50px;
    right: calc(50% - 200px);
    border-radius: 5px;
    font-weight: 600;
	display:none;
}
.vergunning-icons span:hover .tooltip {display:block;}

.disclaimers {
    text-align: center;
	padding:0 25px;
	font-size:80%;
}
.disclaimers a {color:var(--rood2);}
.disclaimer-downloads {
    display: flex;
    justify-content: space-around;
	flex-wrap: wrap;
}
.disclaimer-downloads a {
    display: flex;
    align-items: center;
}
.disclaimer-downloads a img {
    height: 50px;
    padding-right: 15px;
}




/* RESPONSIVE 
 * --------------------------------------------- */

.mob {display:none !important}

@media (max-width:1400px){

}

@media (min-width:1240px) {
	.lenenkostgeld-top {
		width: 100%;
		text-align: center;
		padding: 5px 0;
		border-bottom: 1px solid #3a3a3a;

	}
	li ul li ul li a.mega-menu-link {padding-left: 20px !important;}
	a.mega-menu-link:before {
		padding: 4px;
		display: inline-block;
		-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);
		border: solid #fff;
		border-width: 0 1px 1px 0;
		content: "";
		margin-top: 8px !important;
		position:absolute !important;
		left:0 !important;
	}
	.mobiel-menu {display:none}
	.offerte-menu {
		background: var(--rood2) !important;
		padding: 0 30px !important;
		height: 50px !important;
		margin-left:50px !important
	}
	.offerte-menu:after{
		width:100%;
		height:10px;
		background:var(--rood1);
		position:absolute;
		bottom:0;
		left:0;
		content:"";
		display:block !important;
	}
	.offerte-menu:hover:after {height:100%;}
	.offerte-menu a {
		color: white !important;
		font-size: 1.6rem !important;
		font-weight: 600 !important;
		text-transform: capitalize !important;
		height: 40px !important;
		display: flex !important;
		align-items: center;
		z-index:2;
	}
}



@media (max-width:1280px){
	
	header {
		position: fixed;
		z-index:99;
		bottom: 0;
		width: 100%;
		background: white;
	}
	.header-outer {position:relative !important;transform:none !important}
	.header-wrap { flex-direction: row-reverse;padding:0;width:100%}
	.main-menu-desktop, .lenenkostgeld-top, .placeholder{display:none}
	
	.mobiel-menu {
		 display: inline-flex;
        justify-content: space-around;
        width: 100%;
        align-items: center;
        height: 60px;
	}
	.mobiel-menu .main-menu {
		width: 25%;
		display: flex;
        justify-content: center;
	}
	.mega-menu-toggle { width: 50px;}
	.mega-menu-item-type-widget {padding: 0 5px !important;}
	li#mega-menu-item-116 {margin-top: 45px !important;}
	.mobiel-menu a {width: 20%;}
	.site-logo {display:none;}
	.mobiel-head {
		display: flex;
		justify-content: center;
		flex-direction: column;
		text-align:center;
	}
	.mobiel-head img  {
		max-height: 45px;
        object-fit: contain;
        padding: 10px;
	}
	.mobiel-head div {background: white;}
	.mobiel-head div img {max-width:75%;}
	a.offerte-btn {
		height: calc(100% - 10px);
		width:30%;
		display: flex	;
		align-items: center;
		justify-content: center;
		background: var(--rood1);
		color: white;
		text-align: center;
		font-size: 1.6rem;
		border-bottom: 10px solid var(--rood2);
	}
	
	.topbtn {bottom:70px;right:10px}
}

@media (min-width:768px) and (max-width:1024px) {
	
	.content-wit {width:50%;}
}

@media (max-width:960px){
	
	.rekentabel {
		width: 850px;
		overflow: scroll;
	}
	.rekentabel div {width: 850px;}
	
}

@media (max-width:768px)
{
	.mob {display:inherit !important;}
	.desktop {display:none !important}
	h4.mega-block-title {
		color: var(--rood1) !important;
		padding-top: 10px !important;
	}
	section.hp-intro {
		position: relative;
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	section.content-intro {
		position: relative;
		width: calc(100% - 50px);
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		margin:25px 0;
	}
    .hp-intro-content {
        padding: 180px 20px 50px;
        background-size: cover;
		background-position:center;
    }
	.hp-intro-content h1, .hp-intro-content h1 strong {
        color: white !important;
        font-size: 3.5rem;
        line-height: 5rem;
        width: 90%;
        text-shadow: 2px 2px 2px #000000aa;
        font-weight: 700;
    }
	.content-wit {
     	width:100%;
        padding: 30px;
        left: 0 !important;
        top: -25px;
        z-index: 2;
    }
	.knop-rood, .knop-groen  {
		font-size: 1.8rem;    
		padding: 15px 0 25px;
	    text-align: center;
        justify-content: center;
		width: 100%;
	}
	a.knop-rood:after {
		height: 25px;
		width: 30px;
	}
	.knop-rood p {font-size:1.8rem;}
	a.knop-rood:after {margin-left:10px}
		.content-wrapper {padding-top: 0;}
	section.hp-intro2 {
		position: relative;
		display: flex;
		flex-wrap: wrap;
	}
	section.hp-intro2  {
		padding: 25px;
        background: white;
        max-width: 100%;
	}
	section.hp-intro2 div li {list-style:none;position:relative;padding:0 0 15px 20px;}
	    section.hp-intro2 div li:before {
        content: "✔";
        display: block;
        background: var(--groen1);
        width: 30px;
        height: 25px;
        text-align: center;
        color: white;
        border-radius: 20px;
        padding-top: 5px;
        position: absolute;
        left: -20px;
        line-height: 1;
        top: 5px;
    }
	
	.offerte-intro h1, .offerte-intro .subkop {text-align:center;}
	
	.inline-berekening.open {margin:0;padding:0;}
	.inline-berekening .content {padding:0}
	
	.pic-right.over .content-image {left: 0;}
	section.overons-redenen {padding: 50px;margin-top:0;width: calc(100% - 100px);}
	section.dubbel div {width:100%}
	section.overons-foto {padding-bottom: 0;}
	a.brochure-btn {width: 100%;}
	
	.vacature-item {width:calc(100% - 50px)}
	
	.keuze {width: calc(100% - 20px);}
	
	/* FORMS */
	
	.contactfooter form span {width:100%}
	form input[type=submit] {font-size:2.5rem;}
	.klant-aanmeldform p {flex-wrap:wrap;}
	.klant-aanmeldform div span {width:calc(100% - 30px) !important;margin-bottom:10px}
	    .klant-aanmeldform input[type=submit] {
        font-size: 2rem;
        padding: 15px;
        margin: 0 !important;
        width: calc(100% - 30px);
    }
	.klant-aanmeldform .wpcf7-list-item input {width: 25%;height: 25px;margin-top: 5px;}
	/* FOOTER */

	.footer-1, .footer-2, .footer-3, .footer-4 {width:100%;padding:0 25px;margin-bottom: 10px;}
	.footer-1 {margin-bottom:25px}
	.footer-contact {justify-content:start}
	.footer-contact a {        
		margin: 20px 0;
        display: inline-flex;
        font-size: 2.6rem;
        flex-flow: nowrap;
        align-items: center;
        align-self: center;
	}
	.footer-contact img {margin:0 auto;max-width: 50px !important;padding: 0 25px 10px;}
	

}
@media (max-width: 600px) {
	img {
		object-fit: cover;
		max-width: 100%;
	}
	h1, h2 {
		font-size: 3.2rem;
		line-height: 35px;
	}

	
	
		section.center {padding:50px 20px;}
	.pic-right .content-wrapper, .pic-left .content-wrapper {justify-content:center;}
	.pic-right, .pic-left {flex-direction: column-reverse;}
	.pic-right .content-image, .pic-left .content-image {
		position: relative;
		top: inherit;
		right: inherit;
		width: 100vw;
		height: 250px;
		z-index: 0;
	}
	.content-wrapper {padding:0px}

	
	
	/* HOMEPAGE */
	.hp-intro2.mob div {margin-top: 25px;}
	.hp-triple {column-gap:10px}
	.hp-triple span {
		display: block;
		font-size: 1.6rem;
	}
	.hp-triple span.percentage {font-size: 3rem;}
	.triple-groot {width: 40%;}
	.vergelijking-blok {padding:20px 5px}
	.vergelijking {flex-wrap:wrap;}
	.vergelijking-logos {padding-bottom:15px}
	.vergelijking-logos span {font-size: 1.2rem;}
	.vergelijking-logos span img {max-height: 30px;}
	.vergelijking span, .vergelijking-logos span {width:25%}
	.vergelijking span:first-child {width:100%;padding-bottom:15px;text-align:center;font-weight: 300;font-size: 1.4rem;}
	.vergelijking-wrapper .intro-vergelijking, .vergelijking-wrapper .vergelijking-disclaimer {width:100%;}
	.vergelijking-wrapper .intro-vergelijking {font-size:1.8rem}

	.leningen-lijst {column-count:1}

}


@media (max-width:480px){
	
	
	h1, h2 {
		font-size: 3.2rem;
		line-height: 35px;
	}
	
	.mobiel-head img {width: 300px;}
	section.center-klein {padding:50px 20px}
	
	
	/* HOMEPAGE */

	section.hp-intro {
		position: relative;
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
    .hp-intro-content {
        padding: 180px 20px 50px;
        background-size: cover;
    }
	.hp-intro-content h1, .hp-intro-content h1 strong {
        color: white !important;
        font-size: 3.5rem;
        line-height: 5rem;
        width: 90%;
        text-shadow: 2px 2px 2px #000000aa;
        font-weight: 700;
    }
	.hp-intro .knop-rood {        
		width: calc(100% - 50px);
        margin: -20px 25px 0;
	}
	.hp-trustpilot-intro {margin: 25px 0 -45px;}
	
	
	.pic-left .content-wit, .pic-right .content-wit {text-align:center}
	.triple-groot {width: 35%;}
	
	/* CONTENT */
	
	section.content-intro {padding-top:15px}
	section.content-intro h1 {font-size:4.6rem;line-height:1}
	section.content-main-1 {padding-top: 0;}
	.content-main-2 {padding:50px 25px}
	.partner-logos ul {
		padding: 0 50px;
		width: calc(100% - 100px);
	}
	.partner-logos li {width:calc(50% - 15px)}
	
	section.leningeninfo {margin:25px auto;}
	.hp-trustpilot h2, .hp-trustpilot h2 b, .vergelijking-wrapper h2, .contact-footer h2, .contact-footer h2 b {font-size:5rem;margin: 0px 0 50px;}
	section.contactfooter span {font-size:2rem}
	/* FOOTER */
	footer {overflow:hidden;padding-bottom:60px;}
	.vergunning-icons img {width:80px}
	.disclaimer-downloads a {width:100%;margin-bottom:15px}
	section.contactfooter {padding:25px}
}