@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300..600&display=swap');

body {
	font-family: "Roboto", sans-serif;
	font-optical-sizing: auto;
	font-weight: 300;
	font-style: normal;
	font-variation-settings: "wdth" 100;
	line-height: 1.5;
	text-rendering: optimizeLegibility !important;
	-webkit-font-smoothing: antialiased !important;
	background: #ffffff;
}

#no-title-page-wrapper > .container {
	max-width: 1140px !important;
	padding: 0px !important;
}

b, strong {
	font-weight: 600 !important;
}

h1 {
	font-weight: 300;
	color: #e7aa00;
	font-size: 35pt;
}

h1 b, h1 strong {
	color: #853c28;
}

.titel-groot h1, .titel-groot h1 strong, .titel-groot h1 b {
	font-size: 65px;
	color: #ffffff !important;
}

h2 {
	font-weight: 400;
	color: #853c28;
	font-size: 20pt;
	margin-bottom: 1.5rem;
}

.quote h2 {
	font-style: italic;
}

h3 {
	font-weight: 400;
	font-size: 1rem;
}

ul {
	padding-left: 18px;
}

a {
	color: #ffffff;
}

.wit, .wit h1, .wit h2, .wit h3, .wit h4, .wit h5, .wit h6, .wit p {
	color: #ffffff !important;
}

a[href ^= 'tel:'] {
	background-color: #853c28;
	padding: 10px 20px;
	border-radius: 200px;
	text-decoration: none;
}

a[href ^= 'tel:']:hover {
	background-color: #688c47;
	color: #ffffff;
	text-decoration: none;
}

#navigatie .nav-element, #navigatie .nav-element a {
	color: #ffffff;
	text-decoration: none;
}

#navigatie .nav-element a:hover {
	color: #fad282 !important;
}

#wrapper-footer a {
	color: #000000 !important;
	text-decoration: none !important;
	display: block;
}

#wrapper-footer a:hover {
	color: #853c28;
	text-decoration: none !important;
}

/* Buttons */
a.vc_general.vc_btn3, .button {
	background: #f7ebd9;
	border-color: #853c28;
	padding: 10px 20px !important;
	color: #853c28 !important;
	font-size: 1rem;
	font-weight: 300;
	border: double 4px transparent !important;
	border-radius: 80px !important;
	background-image: -webkit-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(247,235,217,1) 60%), -webkit-linear-gradient(61deg, rgba(255,255,255,1) 0%, rgba(250,210,130,1) 25%, rgba(250,210,130,1) 70%, rgba(133,60,40,1) 100%) !important;
	background-image: -o-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(247,235,217,1) 60%), -o-linear-gradient(61deg, rgba(255,255,255,1) 0%, rgba(250,210,130,1) 25%, rgba(250,210,130,1) 70%, rgba(133,60,40,1) 100%) !important;
	background-image: linear-gradient(to right, rgba(255,255,255,1) 0%, rgba(247,235,217,1) 60%), linear-gradient(151deg, rgba(255,255,255,1) 0%, rgba(250,210,130,1) 25%, rgba(250,210,130,1) 70%, rgba(133,60,40,1) 100%) !important;
	background-origin: border-box !important;
	background-clip: padding-box, border-box !important;
}

a.vc_general.vc_btn3:hover, .button:hover {
	background: #853c28;
	color: #f7ebd9 !important;
	background-image: -webkit-linear-gradient(left, rgba(133,60,40,0.8) 0%, rgba(133,60,40,1) 60%), -webkit-linear-gradient(61deg, rgba(255,255,255,1) 0%, rgba(250,210,130,1) 25%, rgba(250,210,130,1) 70%, rgba(133,60,40,1) 100%) !important;
	background-image: -o-linear-gradient(left, rgba(133,60,40,0.8) 0%, rgba(133,60,40,1) 60%), -o-linear-gradient(61deg, rgba(255,255,255,1) 0%, rgba(250,210,130,1) 25%, rgba(250,210,130,1) 70%, rgba(133,60,40,1) 100%) !important;
	background-image: linear-gradient(to right, rgba(133,60,40,0.8) 0%, rgba(133,60,40,1) 60%), linear-gradient(151deg, rgba(255,255,255,1) 0%, rgba(250,210,130,1) 25%, rgba(250,210,130,1) 70%, rgba(133,60,40,1) 100%) !important;
}

.vc_btn3-container {
	position: absolute;
	right: 80px;
	bottom: 40px;
}

/* Navbar */
#wrapper-navbar {
	z-index: 9;
	width: 100%;
}

#wrapper-navbar.fixed {
	position: absolute;
	top: 75px;
}

#wrapper-navbar.sticky {
	position: fixed;
	top: 0px;
}

#navigatie {
	position: relative;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	max-width: 1140px;
	padding: 20px 40px;
	background-color: #853c28;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
	transition: all 0.2s;
}

.fixed #navigatie{
	border-radius: 15px;
}

.sticky #navigatie {
	border-radius: 0px 0px 15px 15px;
}

#navigatie table {
	width: 100%;
	text-align: center;
}

.nav-logo {
	width: 200px;
	position: relative;
}

.nav-logo img {
	position: absolute;
	width: 180px;
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;
	bottom: -75px;
	transition: all 0.2s;
}

.sticky .nav-logo img {
	width: 150px;
}

/* Algemeen */
.vc_row.vc_row-has-fill {
	background-position: center center !important;
}

.hide {
	display: none !important;
	width: 0px !important;
	height: 0px !important;
	opacity: 0 !important;
}

.logged-in .hide.admin-show {
	display: block !important;
	width: auto !important;
	height: auto !important;
	opacity: 1 !important;
}

/* Kaders */
.vc_row {
	overflow: visible !important;
}

.vc_row .vc_column-inner {
	background-clip: content-box;
	
}

.vc_row .vc_column-inner > .wpb_wrapper {
	background-color: #ffffff;
	border-radius: 15px;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
	height: 100%;
	overflow: hidden;
}

.vc_row .vc_column-inner > .wpb_wrapper .vc_row .vc_column-inner > .wpb_wrapper, .geen-kader {
	border-radius: 0px !important;
	box-shadow: none !important;
}

.vc_row .wpb_text_column {
	padding: 40px;
	margin-bottom: 0px;
}

.vc_row.geen-kader .vc_column-inner > .wpb_wrapper {
	border-radius: 0px;
	box-shadow: none !important;
	background-color: transparent;
}

.geen-padding, .vc_row.geen-padding .wpb_text_column {
	padding: 0px !important;
}

.wpb_single_image {
	margin-bottom: 0px !important;
}

.plattegrond-groot {
	display: none;
}

.plattegronden {
	padding-left: 20px;
	padding-right: 55px;
	padding-bottom: 40px;
}

.plattegronden table {
	width: 100%;
}

.rar-types .types table {
	width: auto !important;
}

.plattegronden table td {
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
	text-align: center;
}

.grote-plattegronden {
	border: 1px solid rgba(0,0,0,0.2);
	border-radius: 15px;
    padding-top: 40px;
    padding-bottom: 40px;
	min-height: 250px !important;
}

.grote-plattegronden > div > div {
	background-image: url('../img/Tekst.svg');
	background-position: center center;
	background-size: contain;
	background-repeat: no-repeat;
}

#default-image {
	display: block;
	padding: 80px;
}

#default-image img {
	width: 100%;
}

.plattegronden .types img {
	transition: all 0.2s;
	width: 100%;
	max-width: 185px;
}

.plattegronden .types img:hover {
	cursor: pointer !important;
	transform: scale(105%);
	transition: all 0.2s;
}

.app-noordpijl img, .rar-noordpijl img {
	width: 75px;
	margin-top: 20px;
	margin-left: 20px;
}

.verdieping-knoppen {
	text-align: center;
}

.verdieping-knoppen button {
	border: 0 !important;
	padding-left: 10px !important;
	padding-right: 10px !important;
	margin-bottom: 40px;
	font-family: "Roboto", sans-serif;
	font-weight: 300;
	font-style: normal;
	background: transparent !important;
}

.verdieping-knoppen button.active {
	font-weight: 400;
	color: #853c28;
}

.verdieping-knoppen button:hover {
	color: #853c28;
}

.app-prijs, .rar-prijs {
	position: absolute;
	bottom: 50px;
	right: 0px;
	width: 250px;
}

.vc_row .button-prijslijst .vc_column-inner > .wpb_wrapper {
	background-color: #853c28 !important;
	background-image: url('../img/prijslijst.png') !important;
	background-position: center right !important;
	background-size: contain !important;
	background-repeat: no-repeat !important;
	margin-bottom: 1.5rem;
	width: 100%;
}

.vc_row .button-brochure .vc_column-inner > .wpb_wrapper {
	background-color: #688c47 !important;
	background-image: url('../img/dwingel_brochure-mockup.png') !important;
	background-position: center right !important;
	background-size: contain !important;
	background-repeat: no-repeat !important;
	margin-bottom: 1.5rem;
	width: 100%;
}

.vc_row .button-inschrijven .vc_column-inner > .wpb_wrapper {
	background-color: #853c28 !important;
	background-image: url('../img/inschrijven.png') !important;
	background-position: center right !important;
	background-size: contain !important;
	background-repeat: no-repeat !important;
	margin-bottom: 1.5rem;
	width: 100%;
}

.vc_row .button-app-brochure .vc_column-inner > .wpb_wrapper, .vc_row .button-rar-brochure .vc_column-inner > .wpb_wrapper {
	background-color: #f7ebd9 !important;
	background-image: url('../img/woonwensen.png') !important;
	background-position: center right !important;
	background-size: contain !important;
	background-repeat: no-repeat !important;
	margin-bottom: 1.5rem;
	width: 100%;
}

.button-brochure .wpb_wrapper, .button-prijslijst .wpb_wrapper, .button-inschrijven .wpb_wrapper {
	color: #ffffff;
	border-radius: 15px;
	font-weight: 400;
	font-size: 20pt;
	padding: 20px;
	margin-bottom: 1.5rem;
}

.button-app-brochure .wpb_wrapper, .button-rar-brochure .wpb_wrapper {
	color: #853c28;
	border-radius: 15px;
	font-weight: 400;
	font-size: 20pt;
	padding: 20px;
	margin-bottom: 1.5rem;
}

.button-brochure a, .button-prijslijst a, .button-inschrijven a {
	color: #ffffff !important;
	text-decoration: none !important;
}

.button-app-brochure a, .button-rar-brochure a {
	color: #853c28 !important;
	text-decoration: none !important;
}

.button-brochure a:hover, .button-prijslijst a:hover, .button-inschrijven a:hover {
	color: #e7aa00 !important;
	text-decoration: none !important;
}

.button-brochure .wpb_wrapper .wpb_text_column, .button-prijslijst .wpb_wrapper .wpb_text_column, .button-inschrijven .wpb_wrapper .wpb_text_column, .button-rar-brochure .wpb_wrapper .wpb_text_column, .button-app-brochure .wpb_wrapper .wpb_text_column {
	background-color: transparent !important;
	padding: 0px !important;
}

.bruin-kader .wpb_content_element {
	background-color: #853c28 !important;
	color: #ffffff !important;
}

.bruin-kader .wpb_content_element h1, .bruin-kader .wpb_content_element h2, .bruin-kader .wpb_content_element span {
	color: #ffffff !important;
}

.creme-kader .wpb_content_element {
	background-color: #f7ebd9 !important;
}

/* Homepage */
.header, .header > .wpb_column {
	height: 850px;
}

.homepage.header.vc_row.vc_row-has-fill {
	background-position-y: -100px !important;
}


/*.header:after {
	position: absolute;
	width: 100%;
	bottom: 0px;
	left: 0px;
	right: 0px;
	height: 50px;
	background-image: linear-gradient(rgba(255,255,255,0) 0%, rgba(255,255,255,1)100%) !important;
}*/

.header .titel {
	position: absolute;
	bottom: 70px;
	width: 330px;
	z-index: 1;
	background-color: #853c28;
	border-radius: 15px !important;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.2) !important;
}

.header .verkoop-gestart:after {
	content: '';
	width: 150px;
	height: 150px;
	background-image: url('../img/verkoop-gestart.svg') !important;
	background-position: bottom right !important;
	background-size: contain !important;
	background-repeat: no-repeat !important;
	position: absolute;
	bottom: -20px;
	right: -80px;
}

.header .nog-enkele-te-koop:after {
	content: '';
	width: 150px;
	height: 150px;
	background-image: url('../img/nog-enkele-te-koop.svg') !important;
	background-position: bottom right !important;
	background-size: contain !important;
	background-repeat: no-repeat !important;
	position: absolute;
	bottom: -20px;
	right: -80px;
}

.header .beschikbaarheid-app:after {
	content: '';
	width: 150px;
	height: 150px;
	background-image: url('../img/beschikbaarheid-app.svg') !important;
	background-position: bottom right !important;
	background-size: contain !important;
	background-repeat: no-repeat !important;
	position: absolute;
	bottom: -20px;
	right: -80px;
}

.header .beschikbaarheid-rar:after {
	content: '';
	width: 150px;
	height: 150px;
	background-image: url('../img/beschikbaarheid-rar.svg') !important;
	background-position: bottom right !important;
	background-size: contain !important;
	background-repeat: no-repeat !important;
	position: absolute;
	bottom: -20px;
	right: -80px;
}

.titel-wrapper {
	width: 100%;
	max-width: 1200px;
	float: none !important;
	margin-left: auto;
	margin-right: auto;
	padding-left: 30px !important;
	padding-right: 30px !important;
}

.titel h1 strong {
	color: #ffffff;
}

.header .titel-groot {
	position: absolute;
	top: 200px;
	padding-left: 0px;
	width: 500px;
	z-index: 1;
	text-shadow: 0px 0px 20px rgba(0,0,0,0.5);
}

.header .titel-groot.rar-woningen {
	width: 800px;
}

.header .vc_column-inner, #no-title-page-wrapper, .vc_tta-container, .vc_tta-panel-body, .vc_tta.vc_general .vc_tta-panel-body {
	padding-top: 0px !important;
	margin-top: 0px !important;
	border: none !important;
}

.vc_tta-panel {
	height: 850px !important;
	width: 0px !important;
	float: left;
	opacity: 0;
	transition: opacity 0.5s;
    -webkit-transition:opacity .5s;
    -moz-transition: opacity 0.5s;
	overflow: hidden;
}

.vc_tta-panel.vc_active {
	height: 850px !important;
	width: 100% !important;
	opacity: 1;
	transition:opacity 0.5s;
    -webkit-transition:opacity .5s;
    -moz-transition: opacity 0.5s;
	overflow: hidden;
}

.vc_tta-panel .vc_tta-panel-body {
	display: block !important;
	height: 850px !important;
	width: 0px !important;
}

.vc_tta-panel.vc_active .vc_tta-panel-body {
	height: 850px !important;
	width: 100% !important;
}

.energielabel-img {
	position: absolute;
	right: 60px;
	top: 240px;
}

.energielabel-img img {
	width: 100px;
	height: 100px;
}

.no-padding-top {
	margin-top: -40px;
}

.contact-blok {
	overflow: visible;
	position: absolute;
	right: 16px;
	bottom: 50px;
	z-index: 2;
	padding: 0px !important;
}

.contact-blok .wpb_wrapper {
	background-color: #e7aa00 !important;
	border-radius: 15px;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
	padding: 25px !important;
}

.vc_row .vc_column-inner > .wpb_wrapper .vc_row .schaduw .vc_column-inner > .wpb_wrapper, .vc_row .schaduw .vc_column-inner > .wpb_wrapper {
	border-radius: 15px !important;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.2) !important;
	overflow: visible !important;
}

.schaduw, .schaduw .vc_column-inner {	
	overflow: visible !important;
}

.no-margin-bottom, .no-margin-bottom .vc_column-inner > .wpb_wrapper {
	margin-bottom: 0px !important;
}

.meer-info .vc_column-inner > .wpb_wrapper {
	background-color: #e7aa00 !important;
	background-image: url('../img/tel.png') !important;
	background-position: bottom right !important;
	background-size: 44% !important;
	background-repeat: no-repeat !important;
}

.meer-info-button {
    bottom: 0px !important;
}

.logo-makelaar {
	max-width: 180px;
	margin-left: 40px;
	margin-bottom: 40px !important;
}

#close-news-icon {
    position: absolute;
    top: 15px;
    right: 0px;
    background-color: #853c28;
    font-size: 10px;
    border-radius: 100px;

}

#close-news-icon > div {
    height: 30px;
    width: 30px;
}

#close-news-icon:hover {
    cursor: pointer !important;
    background-color: #e7aa00;
}

@media only screen and (max-width: 991px) {
    .vc_btn3-container.meer-info-button {
        /* position: relative !important; */
        right: 80px;
    }
    .vc_row .wpb_text_column.nieuwsbericht {
        padding-bottom: 40px;
    }
}

@media only screen and (max-width: 600px) {
    #nieuwsmelding {
        padding-left: 15px;
        padding-right: 15px;
    }
}


@media only screen and (max-width: 575px) {
    #nieuwsmelding {
        padding-left: 35px;
        padding-right: 35px;
    }
}

/* marge onderkant voor buttons */
.home-types .wpb_text_column, .groen-kader .wpb_text_column {
	/* margin-bottom: 85px; */
}

.home-tekstblok-1 .vc_column_container>.vc_column-inner {
	padding-right: 0px;
}

.home-tekstblok-1 .wpb_column:first-child .vc_btn3-container {
	right: 50px !important;
}

.home-tekstblok-1, .home-tekstblok-1 h2, .home-tekstblok-1 h3, .home-tekstblok-1 p, .vc_row.home-tekstblok-1 .vc_column-inner > .wpb_wrapper {
	color: #ffffff !important;
	background-color: #853c28;
}

.groen-kader h2, .groen-kader h3, .groen-kader p, .vc_row.groen-kader .vc_column-inner > .wpb_wrapper {
	color: #ffffff !important;
	background-color: #688c47;
}

.home-locatie .vc_column-inner {
	padding: 0px !important;
	min-height: 350px;
}

.locatie-kaart {
	margin-bottom: 0px !important;
	padding-right: 15px !important;
}

.locatie-kaart .wpb_wrapper {
	padding: 0px !important;
}

.locatie-kaart, .locatie-kaart > div, .locatie-kaart > div > div {
	position: relative;
	height: 100%;
} 

.locatie-kaart iframe {
	position: absolute;
	height: 100%;
	min-height: 500px;
}

.home-groen-kader-image {
	min-height: 350px;
}

.home-tekstblok-1 .vc_do_btn {
	margin-bottom: 0px !important;
}

.contact-kader-image {
	min-height: 350px;
	border-radius: 15px;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
}

.inschrijfformulier {
	padding: 0px 20px 40px 40px;
	display: inline-block;
}

.inschrijfformulier input {
	background: #f7ebd9;
	border: 0px !important;
	border-radius: 50px;
	color: #853c28;
	font-weight: 300 !important;	
	padding: 10px 20px;
	width: 100%;
	margin-bottom: 10px;
}

.inschrijfformulier input::placeholder {
	color: #853c28 !important; 
	font-weight: 300 !important;
}

.image-padding > div > div {
	padding: 40px 40px 40px 0px !important;
}

.inschrijven {
	padding-bottom: 40px;
}

.invulvelden {
	width: 50%;
	float: left;
	padding-right: 20px;	
}

.checkboxen {
	position: relative;
	width: 50%;
	float: left;
	padding-left: 20px;	
}

.checkbox {
	display: block;
	position: relative;
	padding-left: 35px;
	margin-bottom: 12px;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

/* Hide the browser's default checkbox */
.checkbox input {
	position: absolute;
	opacity: 0;
	cursor: pointer;
	height: 0;
	width: 0;
}

/* Create a custom checkbox */
.checkmark {
	position: absolute;
	top: 0;
	left: 0;
	height: 25px;
	width: 25px;
	background-color: #f7ebd9;
	border-radius: 7px;
}

/* On mouse-over, add a grey background color */
.checkbox:hover input ~ .checkmark {
	background-color: #853c28;
}

/* When the checkbox is checked, add a blue background */
.checkbox input:checked ~ .checkmark {
	background-color: #853c28;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
	content: "";
	position: absolute;
	display: none;
}

/* Show the checkmark when checked */
.checkbox input:checked ~ .checkmark:after {
	display: block;
}

/* Style the checkmark/indicator */
.checkbox .checkmark:after {
	left: 9px;
	top: 5px;
	width: 7px;
	height: 11px;
	border: solid white;
	border-width: 0 3px 3px 0;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}

/* Footer */
#wrapper-footer {
	padding: 0px !important;
	margin-top: 20px;
}

.logorij {
	background-image: url(https://www.de-dwingel.nl/wp-content/uploads/2025/03/creme-bottom.png) !important;
	background-position: center center !important;
	background-repeat: repeat !important;
	height: 150px;
	padding-top: 43px;
	font-size: 0.8rem;
	color: #f7ebd9;
}

.logobalk {
	position: relative;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	max-width: 1140px;
	padding: 20px 40px;
	background-color: #853c28;
	border-radius: 15px;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
}

.logobalk table {
	width: 100%;
}

.footer-logo img {
	width: 150px;
	text-align: center;
	top: -45px;
	position: absolute;
	margin-left: auto;
	margin-right: auto;
	left: 0;
	right: 0;
}

.copyright {
	width: 50%;
	padding-right: 80px;
}

.samenwerking {
	width: 50%;
	padding-left: 80px;
	text-align: right;
}

.navrij {
	background-image: url(https://www.de-dwingel.nl/wp-content/uploads/2025/03/creme.png) !important;
	background-position: center center !important;
	background-repeat: repeat !important;
	padding-bottom: 40px;
}

#wrapper-footer .col-md-12 {
	position: relative;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	max-width: 1140px;
}

.disclaimer {
	color: #853c28;
	font-size: 0.8rem;
	margin-top: 40px;
}

/* Mobile menu */
* {
  margin: 0;
  padding: 0; 
}

#mobile-menu-toggle {
	width: 25px;
	height: 25px;
	position: relative;
	margin-left: auto;
	margin-right: 0px;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	-o-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
	display: none !important;
	opacity: 0 !important;
}

#mobile-menu-toggle span {
	cursor: pointer;
	display: block;
	position: absolute;
	height: 3px;
	width: 100%;
	background: #ffffff;
	border-radius: 9px;
	opacity: 1;
	left: 0;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .25s ease-in-out;
	-moz-transition: .25s ease-in-out;
	-o-transition: .25s ease-in-out;
	transition: .25s ease-in-out;
}

#mobile-menu-toggle:hover span {
	background: #fad282;
}

#mobile-menu-toggle span:nth-child(1) {
	top: 0px;
}

#mobile-menu-toggle span:nth-child(2),#mobile-menu-toggle span:nth-child(3) {
	top: 8px;
}

#mobile-menu-toggle span:nth-child(4) {
	top: 16px;
}

#mobile-menu-toggle.open span:nth-child(1) {
	top: 8px;
	width: 0%;
	left: 50%;
}

#mobile-menu-toggle.open span:nth-child(2) {
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
}

#mobile-menu-toggle.open span:nth-child(3) {
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

#mobile-menu-toggle.open span:nth-child(4) {
	top: 18px;
	width: 0%;
	left: 50%;
}


/* Responsive */
@media only screen and (max-width: 950px) {
	.nav-element {
		font-size: 0.8rem;
	}	
	
	/* .header, .header > .wpb_column {
		height: 550px;
	}*/
	
	.header .vc_empty_space/*,
	.vc_tta-panel,
	.vc_tta-panel.vc_active,
	.vc_tta-panel .vc_tta-panel-body,
	.vc_tta-panel.vc_active .vc_tta-panel-body*/ {
		height: 550px !important;
	}
	
	.header, .header > .wpb_column {
		height: 710px;
	}
	
	.header .titel {
		position: unset !important;
		bottom: 0;
	}	
	
	.header .titel-wrapper {
		margin-top: -50px;
	}
	
	.titel, .titel-groot {
		width: 100% !important;
	}
	
	.header .verkoop-gestart:after, .header .beschikbaarheid-app:after, .header .beschikbaarheid-rar:after {
		top: -120px !important;
		right: 15px !important;
		bottom: inherit !important;
	}
	

}

@media only screen and (max-width: 840px) {
	#wrapper-navbar {
		position: absolute !important;
		top: 0px !important;
	}

	#navigatie {
		border-radius: 0px 0px 15px 15px !important;
		transition: all 0.2s;
	}
	
	#mobile-menu-toggle {
		display: block !important;
		opacity: 1 !important;
	}
	
	.nav-logo img, .sticky .nav-logo img {
		position: absolute;
		width: 180px;
		left: 0;
		right: 0;
		margin-left: auto;
		margin-right: auto;
		bottom: -75px;
		bottom: auto;
		transition: all 0.2s;
	}
	
	.nav-logo {
		position: absolute;
		top: -25px;
		right: 0;
		left: 0;
		margin-left: auto;
		margin-right: auto;
	}
	
	.nav-element {
		display: none;
		height: 0px;
		transition: all 0.2s;
		margin-top: 10px;
		font-size: 1rem;
		width: 100%;
	}
	
	#mobile-menu-toggle.open ~ table .nav-element {
		display: block;
		height: auto;
		transition: all 0.2s;
	}

	.nav-items {
		margin-top: 0px;
		transition: all 0.2s;
	}
	
	#mobile-menu-toggle.open ~ .nav-items {
		margin-top: 100px;
		transition: all 0.2s;
	}
}
	

@media only screen and (max-width: 767px) {
	.titel-groot h1, .titel-groot h1 strong, .titel-groot h1 b {
		font-size: 55px;
		width: 100%;
	}
	
	.titel h1 {
		font-size: 35pt;
		width: 100%;
	}
	
/*	.appartementen .titel-groot {
		overflow-wrap: break-word;
		word-wrap: break-word;
		hyphens: auto;
	}
*/	
	
	.invulvelden, .checkboxen {
		padding: 0px !important;
		width: 100%;
	}
	
	.checkboxen {
		margin-top: 20px;
		margin-bottom: 10px;
	}
	
	.image-padding > div > div {
		padding: 40px 40px 40px 40px !important;
	}
	
	.nav-logo img, .sticky .nav-logo img {
		width: 150px;
	}
	
	.nav-logo {
		top: -25px;
	}
	
	.header .titel-groot {
		bottom: 0px;
		top: auto;
	}
	
	.contact-blok {
		width: 100%;
		padding-left: 31px !important;
		bottom: -200px !important;
	}
		
	.grote-plattegronden {
		margin-top: 40px;
	}
	
	.plattegronden {
		padding-left: 40px;
		padding-right: 40px;
		padding-bottom: 40px;
	}
	
	.button-brochure .wpb_wrapper, .button-prijslijst .wpb_wrapper, .button-inschrijven .wpb_wrapper {
		padding: 10px !important;
	}
	
	.vc_row .button-prijslijst .vc_column-inner > .wpb_wrapper, 
	.vc_row .button-brochure .vc_column-inner > .wpb_wrapper, 
	.vc_row .button-inschrijven .vc_column-inner > .wpb_wrapper {
		background-position: 125% center !important;
	}

}

@media only screen and (max-width: 575px) {
	.quote.geen-padding .wpb_text_column {
		padding-left: 40px !important;
		padding-right: 40px !important;
	}
	
	.homepage.header.vc_row.vc_row-has-fill {
		background-position-y: -50px !important;
	}

}

@media only screen and (max-width: 540px) {
	.titel-groot h1, .titel-groot h1 strong, .titel-groot h1 b {
		font-size: 40px;
	}
	
	.titel h1 {
		font-size: 30pt;
	}
	
	h2 {
		font-size: 18pt;
	}
	
	.logobalk {
		padding: 20px 20px;
	}
	
	.copyright {
		padding-right: 50px;
	}
	
	.samenwerking {
		padding-left: 50px;
	}
	
	.footermenu {
		margin-top: 40px;
	}
	
	.footer-logo img {
		width: 100px;
	}
	
	.vc_row .wpb_text_column {
		padding: 20px 20px 20px 20px;
	}
}

@media only screen and (max-width: 400px) {
	.footermenu {
		margin-top: 80px;
	}

}

@media only screen and (min-width: 1600px) {
	.homepage.header.vc_row.vc_row-has-fill {
		background-position-y: -240px !important;
	}
}

@media only screen and (min-width: 1900px) {
	.header, .header > .wpb_column {
		height: 1000px;
	}
	
	.header .vc_empty_space,
	.vc_tta-panel,
	.vc_tta-panel.vc_active,
	.vc_tta-panel .vc_tta-panel-body,
	.vc_tta-panel.vc_active .vc_tta-panel-body {
		height: 1000px !important;
	}
	
	.homepage.header.vc_row.vc_row-has-fill {
		background-position-y: -300px !important;
	}
}