
.greenbutton{ position: absolute; top: 35%; right: 20%; background: var(--green); color: #ffffff; text-decoration: none; width: 300px; height: 300px; border-radius: 100%; display: flex; align-items: center; text-align: center; padding: 20px; font-size: 2.6rem; font-weight: 700; transform: rotate(15deg); transition: all 0.5s; z-index: 99; }


.photobanner{ position: relative; padding: 0; }
.photobanner:before{ content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgb(255,255,255);
background: linear-gradient(190deg, rgba(255,255,255,0) 40%, rgba(51,51,51,0.5) 80%, rgba(0,0,0,0.5) 100%); }
.photobanner img{ height: calc(100vh - 200px); object-fit: cover; width: 100%; }
.photobanner .content{ position: absolute; bottom: 0; left: 0; width: 100%; padding: 100px 0; }
.photobanner .content h1{ font-size: 4.5rem; color: #ffffff; line-height: 1; margin-bottom: 15px; width: 55%; }
.photobanner .content h3{ font-size: 2.0rem; font-weight: normal; font-style: italic; color: #ffffff; margin: 0; width: 55%; }

/* ============================================
		CONTENT
=============================================*/


.container-fluid.content > .row{ margin-bottom: 0; } 

.container-fluid.content .row{  }
.container-fluid.content .row.nopadding .col-lg-6,
.container-fluid.content .row.nopadding .col-lg-8,
.container-fluid.content .row.nopadding .col-lg-4{ padding: 0; display: flex; align-items: center; }

.container-fluid.content .calltoaction{ position: absolute; top: 25%; right: 10%; background: var(--green); color: #ffffff; text-decoration: none; width: 150px; height: 150px; border-radius: 100%; display: flex; align-items: center; text-align: center; font-size: 1.3rem; font-weight: 700; transform: rotate(15deg); transition: all 0.5s; }
.container-fluid.content .calltoaction:hover{ transform: rotate(15deg) scale(1.1); }

.container-fluid.content .block.content.text{ padding: 50px 100px 50px calc(var(--rest-half) + 4px); }
.container-fluid.content .order-lg-2 .block.content.text{ padding: 50px calc(var(--rest-half) + 4px) 50px 100px ; }
.container-fluid.content .order-lg-2 .block.content.text2 { padding: 50px 0 50px 100px ; }
.container-fluid.content .block.list.brand-small{ padding: 0 100px 50px calc(var(--rest-half) + 4px); }

.block.html.image{ height: 100%; width: 100%; }
.block.html.image img{ height: 100%; object-fit: cover; max-width: none; width: 100%; }

.photoright.bottom .block.html.image img{ border-bottom-left-radius: 100px; border-top-left-radius: 0; }
.photoright.top .block.html.image img{ border-bottom-left-radius: 0; border-top-left-radius: 100px; }

.row.image-runout .block.html.image.small { min-height: unset; }

.block.list.news .listitem{ margin-bottom: 50px; }
.block.list.news .label{ position: absolute; top: 20px; right: 0; border-top-left-radius: 15px; border-bottom-left-radius: 15px; padding: 3px 20px 3px 25px; font-weight: bold; }
.block.list.news .label.bouwupdate{ background: var(--grey); }
.block.list.news .label.nieuws{ background: var(--darkblue); display: block; }

.vacatures{ justify-content: center; }
.vacatures .item { margin-bottom: 75px; }
.vacatures .item a { color: var(--blue); box-shadow: 0 3px 6px rgb(0 0 0 / 15%); transition: box-shadow 0.3s; text-decoration: none; }
.vacatures .item a:hover { box-shadow: 0 5px 20px rgb(0 0 0 / 35%); }
.vacatures .item .img-wrap { overflow: hidden; position: relative; }
.vacatures .item .img-wrap img { transition: transform 0.3s; }
.vacatures .item a:hover .img-wrap img { transform: scale(1.05); }
.vacatures .item .content { background: #fff; background: var(--red); padding: 15px 25px 15px 25px;  }
.vacatures .item .content .title-wrap { text-align: center; }
.vacatures .item .content .title-wrap h3 { color: #fff; font-size: 1.25rem; margin-bottom: 0; line-height: 1.2; margin-top: 0; display: flex; flex-direction: column; justify-content: center; }
.vacatures .item .content .btn-wrap { margin-bottom: -15px; transform: translate(0,50%); text-align: center; }
.vacatures .item .content .btn-wrap .btn.btn-secondary{ margin: 0; }

.block.content.entries{ width: 75%; margin: 0 auto; }
.block.list.entries{ gap: 30px 0; }
.block.list.entries .item{ position: relative; }
.block.list.entries .item figure{ margin-bottom: 0; }
.block.list.entries .item .content{ position: absolute; bottom: 0; left: 0; }

.block.list.photos{ margin: 0 -10px; }
.block.list.photos .item { margin: 0 10px; overflow: hidden; }
.block.list.photos .item img{ transition: all 0.5s ease-in-out; }
.block.list.photos .item:hover img{ -moz-transform: scale(1.08); -webkit-transform: scale(1.08); transform: scale(1.08); }
.block.list.photos .item .wrapper { height: 100%; display: flex; flex-direction: column; justify-content: space-between; }


/*
.block.html.quote h2 { font-size: 4.3rem; margin: 0; }
.block.html.quote h3 { font-size: 2.5rem; margin: 0; }

.block.list.specs { padding-left: var(--rest-half); padding-bottom: 100px; }
.block.list.specs .item { border: 1px solid var(--darkblue); margin: 0 10px; overflow: hidden; }
.block.list.specs .item:hover { cursor: pointer; }
.block.list.specs .item img{ transition: all 0.5s ease-in-out; }
.block.list.specs .item:hover img{ -moz-transform: scale(1.08); -webkit-transform: scale(1.08); transform: scale(1.08); }
.block.list.specs .item .wrapper { height: 100%; display: flex; flex-direction: column; justify-content: space-between; }
.block.list.specs .item .content { text-align: center; }
.block.list.specs .item .content .text { margin-bottom: 20px; }
.block.list.specs .slick-track { padding-bottom: 10px; }
.block.list.specs .slick-arrow { top: unset; bottom: 10px; background: var(--red); padding: 10px 50px; border-radius: 50px; width: unset; height: unset; border: 1px solid transparent; }
.block.list.specs .slick-arrow i { color: #ffffff; font-size: 30px; transition: all 0.5s ease-in-out; }
.block.list.specs .slick-disabled { opacity: 0; }
.block.list.specs .slick-arrow.slick-prev {left: unset; right: calc(var(--rest-half) + 130px + 25px);}
.block.list.specs .slick-arrow.slick-next { right: var(--rest-half);}
.block.list.specs .slick-arrow.slick-next.slick-disabled { pointer-events: none; }
.block.list.specs:has(.slick-arrow.slick-next.slick-disabled) .slick-arrow.slick-prev {right: var(--rest-half);}
.block.list.specs:has(.slick-slide[data-slick-index="5"]) .slick-arrow { transition: all 0.5s ease-in-out; }
.block.list.specs .slick-arrow:hover {  background: transparent; border-color: var(--red); }
.block.list.specs .slick-arrow:hover i { color: var(--red); }

.block.html.min-mt { margin-top: -35px; transition: all 0.3s ease-in-out; }

.modal#koopgids .modal-header h5{ font-weight: bold; }
.modal#koopgids .modal-body{ padding: 20px 30px; }
.modal#koopgids #mc_embed_signup form{ margin: 0; }
.modal#koopgids #mc_embed_signup .mc-field-group input[type='checkbox']{ float: left; margin-top: 8px; margin-right: 10px; width: auto; }
.modal#koopgids #mc_embed_signup .mc-field-group label{ font-weight: bold; }
.modal#koopgids #mc_embed_signup .asterisk{ margin-left: 5px; }
.modal#koopgids .block.form .form-group > .row { flex-direction: column; }
.modal#koopgids .block.form .form-group .form_field_name { width: 100%; }
.modal#koopgids .block.form .form-group .form_field_entry { width: 100%; }
.modal#koopgids .content__gdpr fieldset{ font-weight: bold; }
.modal#koopgids .button{ font-size: 1.2rem !important; font-weight: 700; padding: 8px 25px; background: var(--red); border-color: var(--red); color: #ffffff !important; border-radius: 50px; height: auto; }
.modal#koopgids .button:hover{ background: var(--darkblue); border-color: var(--white); color: #ffffff !important; }

.block.html.bigimage .logo{ position: absolute; right: 5%; top: 5%; }
.block.html.bigimage .logo img{ max-width: 275px; height: auto; }

.block.html.bike img { width: 100%; height: auto; }

.block.list.brand.multiple-items { padding: unset; }
.block.list.brand.multiple-items .item { background: #ffffff; }

.row.bluebanner h2 { text-wrap: balance; }

.block.html.karo-bike{ position: relative; max-width: 700px; }
.block.html.karo-bike .image{ margin-bottom: 30px; }
.block.html.karo-bike .price{ position: absolute; top: 0; right: 0; }

.block.html.karo-bike .image.fadeIn{ -webkit-animation-duration: 2s; animation-duration: 2s; }
.block.html.karo-bike .price.bounceIn{ animation-delay: 1s; } */

/* =========================================================== */
/* ======================= KLANTPAGINA ======================= */
/* =========================================================== */
/* .block.html.custom-logo{ height: 100%; display: flex; justify-content: right; align-items: center; }
.block.html.custom-logo .image{ margin: 25px 0; }
.block.html.custom-logo .image img{ filter: brightness(0) saturate(100%) invert(100%) sepia(15%) saturate(1484%) hue-rotate(99deg) brightness(107%) contrast(116%); }

.container-fluid.content > .row.banner{ margin-bottom: 0; }
.container-fluid.content .row.behind-blue .block.content{ margin-top: 50px; }
.container-fluid.content .row.behind-blue .block.html.image img{ border-bottom-left-radius: 100px; }

.block.list.custom-advant{ margin-top: 50px; }
.block.list.custom-advant .item{ position: relative; padding-left: 50px; margin-bottom: 50px; }
.block.list.custom-advant .item:before{ content: url(/media/2023-08/bullit.svg); position: absolute; top: 5px; left: 0; }
.block.list.custom-advant .item h3{ margin: 0 0 5px 0; }

.block.content ul{ padding-left: 0; margin-top: 25px; }
.block.content ul li{ position: relative; padding-left: 50px; margin-bottom: 25px; }
.block.content ul li:before{ content: url(/media/2023-08/bullit.svg); position: absolute; top: 0px; left: 0; } */



/* ===================== BIG PHOTO ===================== */
/* .row.bluebanner{ margin-top: 50px; } */


/* ============================================
		MOBIEL
=============================================*/

/* --------------------------------------- */
@media only screen and (max-width: 1599px){
	.greenbutton{ width: 250px; height: 250px; font-size: 2.0rem; right: 10%; }

	.photobanner .content{ padding: 50px 0; }
	.photobanner .content h1 { font-size: 4.0rem; }
}
/* --------------------------------------- */
@media only screen and (max-width: 1399px){
	.container-fluid.content .block.content.text{ padding: 50px 50px 50px calc(var(--rest-half) + 4px); }
	.container-fluid.content .order-lg-2 .block.content.text{ padding: 50px calc(var(--rest-half) + 4px) 50px 50px ; }
	.container-fluid.content .order-lg-2 .block.content.text2{ padding: 50px 0 50px 50px ; }
	.container-fluid.content .block.list.brand-small{ padding: 0 50px 50px calc(var(--rest-half) + 4px); }
}
/* --------------------------------------- */
@media only screen and (max-width: 1199px){
	.greenbutton{ top: 25%; }
	.photobanner .content h1{ width: 70%; }
	.photobanner .content h3{ width: 70%; }

	.row.bluebanner{ margin-top: 0; }
	.block.html.min-mt { margin-top: 0; }
	.block.html.quote h2 { font-size: 2rem; }
	.block.html.quote h3 { font-size: 1.5rem; }
}
/* --------------------------------------- */
@media only screen and (max-width: 991px){
	.greenbutton{ width: 180px; height: 180px; font-size: 1.6rem; right: 5%; }

	.photobanner .content h1{ font-size: 3.5rem; }

	
	.container-fluid.content .block.content.text{ max-width: var(--container-width); width: 100%; margin: 0 auto; padding: 50px 12px; }
	.container-fluid.content .order-lg-2 .block.content.text{ max-width: var(--container-width); width: 100%; margin: 0 auto; padding: 50px 12px; }
	.container-fluid.content .order-lg-2 .block.content.text2{ padding: 50px 0; }
	.container-fluid.content .block.list.brand-small{ max-width: var(--container-width); width: 100%; margin: 0 auto; padding: 0 12px 50px 12px; }
	.container-fluid.content .row.behind-blue .block.html.image img{ border-bottom-left-radius: 0; }
	.block.list.specs { padding-left: 0; }
	.block.list.specs .item { min-height: 450px; }
	.photoright.bottom .block.html.image img { border-bottom-left-radius: 0; }
	
	.block.html.bigimage{ height: 60vh; }
	.block.html.bigimage img{ height: 60vh; }
	.block.html.bigimage .logo{ right: unset; left: 5%; top: 5%; }
	.block.html.bigimage .logo img{ max-width: 150px; }

	.block.content.entries{ width: 100%; margin: 0 auto; }
	.block.list.entries .item .content img{ width: 90%; }
	
}
/* --------------------------------------- */
@media only screen and (max-width: 767px){
	.greenbutton{ top: 20%; }
	.photobanner .content{ padding: 50px 0; }
	.photobanner .content h1{ font-size: 2.5rem; width: 100%; }
	.photobanner .content h3{ font-size: 1.5rem; width: 100%; }

	.block.list.custom-advant .item{ margin-bottom: 20px; }

	.block.list.entries{ gap: 20px 0; }
}
/* --------------------------------------- */
@media only screen and (max-width: 575px){
	.greenbutton{ top: 20%; width: 125px; height: 125px; font-size: 1.1rem; }
	.photobanner .content{ padding: 50px 0; }	
	
	.block.html.quote h2 { font-size: 1.6rem; }
	.block.html.quote h3 { font-size: 1.2rem; }
	
	.block.html.bigimage .logo img { max-width: 100px; }

	.block.list.specs .item { min-height: 300px; }
}
/* --------------------------------------- */
@media only screen and (max-width: 479px){
	.photobanner .content h1{ font-size: 2.3rem; width: 100%; }
	.photobanner .content h3{ font-size: 1.3rem; width: 100%; }

	.container-fluid.content .calltoaction{ top: 20%; width: 130px; height: 130px; font-size: 1.1rem; }
	.container-fluid.content .block.content.text{ padding: 25px 12px; }
	.container-fluid.content .order-lg-2 .block.content.text{ padding: 25px 12px; }	
	.container-fluid.content .order-lg-2 .block.content.text2{ padding: 25px 0; }
	.container-fluid.content .block.list.brand-small{ padding: 25px 12px; }
	.block.html.bigimage { height: 40vh; }
	.block.html.bigimage img { height: 40vh; }
	.block.list.entries .item .content{ left: -1.5px; }

}