@font-face {
font-family: "serif-font";
src: url(//www.ydkwonen.nl/wp-content/themes/twentyseventeen-child/fonts/PlayfairDisplay-Italic.woff2) format("woff2"), url(//www.ydkwonen.nl/wp-content/themes/twentyseventeen-child/fonts/PlayfairDisplay-Italic.woff) format("woff");
font-style: normal;
font-weight: normal !important;
}
@font-face {
font-family: "light";
src: url(//www.ydkwonen.nl/wp-content/themes/twentyseventeen-child/fonts/opensans-light-webfont.woff2) format("woff2"), url(//www.ydkwonen.nl/wp-content/themes/twentyseventeen-child/fonts/opensans-light-webfont.woff) format("woff");
font-style: normal;
font-weight: normal !important;
}
@font-face {
font-family: "regular";
src: url(//www.ydkwonen.nl/wp-content/themes/twentyseventeen-child/fonts/opensans-regular-webfont.woff2) format("woff2"), url(//www.ydkwonen.nl/wp-content/themes/twentyseventeen-child/fonts/opensans-regular-webfont.woff) format("woff");
font-style: normal;
font-weight: normal !important;
}
@font-face {
font-family: "semibold";
src: url(//www.ydkwonen.nl/wp-content/themes/twentyseventeen-child/fonts/opensans-semibold-webfont.woff2) format("woff2"), url(//www.ydkwonen.nl/wp-content/themes/twentyseventeen-child/fonts/opensans-semibold-webfont.woff) format("woff");
font-style: normal;
font-weight: normal !important;
}
@font-face {
font-family: "bold";
src: url(//www.ydkwonen.nl/wp-content/themes/twentyseventeen-child/fonts/OpenSans-Bold.woff2) format("woff2"), url(//www.ydkwonen.nl/wp-content/themes/twentyseventeen-child/fonts/OpenSans-Bold.woff) format("woff");
font-style: normal;
font-weight: normal !important;
}
@font-face {
font-family: "extrabold";
src: url(//www.ydkwonen.nl/wp-content/themes/twentyseventeen-child/fonts/OpenSans-ExtraBold.woff2) format("woff2"), url(//www.ydkwonen.nl/wp-content/themes/twentyseventeen-child/fonts/OpenSans-ExtraBold.woff) format("woff");
font-style: normal;
font-weight: normal !important;
}
body {
font-family: "regular";
}
h1, h2, h3, h4, h5, h6, p, li, td, a {
font-weight: 400 !important;
}
h1 {
font-size: 50px;
line-height: 60px;
font-family: "light";
margin: 0px;
margin-bottom: 20px !important;
color: black;
}
@media screen and (max-width: 1040px) {
h1 {
font-size: 48px;
line-height: 52px;
}
}
@media screen and (max-width: 767px) {
h1 {
font-size: 48px;
line-height: 52px;
}
}
@media screen and (max-width: 480px) {
h1 {
font-size: 34px;
line-height: 38px;
}
}
@media screen and (min-width: 320px) and (max-width: 812px) and (orientation: landscape) {
h1 {
font-size: 30px;
line-height: 34px;
}
}
@media screen and (max-width: 767px) {
.single-post h1, .single-post h2 {
font-size: 20px;
line-height: 24px;
margin: 0px;
margin-bottom: 10px !important;
}
}
@media screen and (max-width: 480px) {
.single-post h1, .single-post h2 {
font-size: 18px;
line-height: 24px;
}
}
h2 {
font-size: 36px;
line-height: 48px;
font-family: "light";
margin: 0px;
margin-bottom: 20px !important;
color: black;
}
@media screen and (max-width: 1040px) {
h2 {
font-size: 36px;
line-height: 48px;
}
}
@media screen and (max-width: 767px) {
h2 {
font-size: 32px;
line-height: 46px;
}
}
@media screen and (max-width: 480px) {
h2 {
font-size: 26px;
line-height: 32px;
}
}
@media screen and (min-width: 320px) and (max-width: 812px) and (orientation: landscape) {
h2 {
font-size: 30px;
line-height: 34px;
}
}
.content-bottom-widgets h2 {
font-size: 18px;
}
.nieuwsblok .wpb_widgetised_column .wpb_wrapper, #rpwe_widget-2 h2 {
font-size: 20px;
font-family: "bold";
text-transform: uppercase;
line-height: inherit !important;
}
@media screen and (max-width: 767px) {
.sidebar-news h2, .post-sidebar-custom h2, .mailchimp h2 {
font-size: 16px !important;
line-height: 20px !important;
}
.nieuwsblok .wpb_widgetised_column .wpb_wrapper, #rpwe_widget-2 h2 {
font-size: 16px;
line-height: 20px;
}
}
@media screen and (max-width: 480px) {
.sidebar-news h2, .post-sidebar-custom h2, .mailchimp h2 {
font-size: 16px !important;
line-height: 20px !important;
}
.nieuwsblok .wpb_widgetised_column .wpb_wrapper, #rpwe_widget-2 h2 {
font-size: 16px;
line-height: 16px;
}
}
h3 {
font-size: 20px;
line-height: 24px;
font-family: "light";
font-weight: normal;
margin: 0px;
margin-bottom: 10px !important;
color: black;
}
h3 strong {
font-family: "bold";
}
@media screen and (max-width: 1040px) {
h3 {
font-size: 24px;
line-height: 28px;
}
}
@media screen and (max-width: 767px) {
h3 {
font-size: 20px;
line-height: 24px;
margin-bottom: 20px !important;
}
}
@media screen and (max-width: 480px) {
h3 {
font-size: 18px;
line-height: 24px;
margin-bottom: 15px !important;
}
}
@media screen and (min-width: 320px) and (max-width: 812px) and (orientation: landscape) {
h3 {
font-size: 20px;
line-height: 22px;
margin-bottom: 15px !important;
}
}
h4, .gdprc_item__label {
font-size: 22px;
line-height: 28px;
font-family: "light";
margin: 0px;
margin-bottom: 10px !important;
color: black;
}
h4 strong, .gdprc_item__label strong {
font-family: "bold";
}
@media screen and (max-width: 1040px) {
h4, .gdprc_item__label {
font-size: 22px;
line-height: 28px;
}
}
@media screen and (max-width: 767px) {
h4, .gdprc_item__label {
font-size: 20px;
line-height: 26px;
}
}
@media screen and (max-width: 480px) {
h4, .gdprc_item__label {
font-size: 16px;
line-height: 16px;
}
}
h5 {
font-size: 18px;
line-height: 28px;
font-family: "bold";
}
@media screen and (max-width: 1040px) {
h5 {
font-size: 16px;
line-height: 24px;
}
}
@media screen and (max-width: 767px) {
h5 {
font-size: 14px;
line-height: 28px;
}
}
p, .screen-reader-text, .gdprc_items p, .social-info {
font-family: "regular";
font-size: 11px;
line-height: 1.6em;
margin: 0px;
}
p:empty {
display: none !important;
}
.last h1, .last h2, .last h3, .last h4, .last h5, .last h6, .last li, .last td, .last ul, .last a, .last p {
margin-bottom: 0px !important;
}
td, label, textarea, input {
font-family: "regular";
font-size: 18px;
margin: 0px;
}
@media screen and (max-width: 1040px) {
td, label, textarea, input {
font-size: 18px;
}
}
@media screen and (max-width: 767px) {
td, label, textarea, input {
font-size: 18px;
}
}
@media screen and (max-width: 480px) {
td, label, textarea, input {
font-size: 14px;
}
}
li {
font-family: "regular";
font-size: 18px;
line-height: 28px;
margin: 0px;
margin-bottom: 0px !important;
}
@media screen and (max-width: 1040px) {
li {
font-size: 18px;
line-height: 24px;
}
}
@media screen and (max-width: 767px) {
li {
font-size: 18px;
line-height: 20px;
}
}
@media screen and (max-width: 480px) {
li {
font-size: 14px;
line-height: 20px;
}
}
a {
cursor: pointer;
text-decoration: none;
color: black;
transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
}
.rpwe-block a {
font-size: 12px;
}
.nieuwsblok .rpwe-block h3, .single .rpwe-block h3 {
font-size: 10px !important;
}
.standard-button p {
height: auto;
-webkit-line-clamp: unset;
-webkit-box-orient: unset;
overflow: unset;
text-overflow: unset;
display: inline-block;
}
.cta-flavour-1 .standard-button a, .cta-flavour-1 .vc_btn3.vc_btn3-color-juicy-pink, .cta-flavour-1 .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat {
font-family: "bold";
display: inline-block;
border: 1px solid white;
background-color: transparent;
color: white;
line-height: 30px;
padding: 0px 20px;
text-decoration: none;
font-size: 16px;
overflow-x: hidden;
position: relative;
border-radius: 0px;
cursor: pointer;
transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
}
.cta-flavour-1 .standard-button a:hover, .cta-flavour-1 .standard-button a:active, .cta-flavour-1 .vc_btn3.vc_btn3-color-juicy-pink:hover, .cta-flavour-1 .vc_btn3.vc_btn3-color-juicy-pink:active, .cta-flavour-1 .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat:hover, .cta-flavour-1 .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat:active {
background-color: white;
color: #4b3e26;
text-decoration: none;
}
@media screen and (max-width: 1040px) {
.cta-flavour-1 .standard-button a, .cta-flavour-1 .vc_btn3.vc_btn3-color-juicy-pink, .cta-flavour-1 .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat {
font-size: 14px;
}
}
@media screen and (max-width: 767px) {
.cta-flavour-1 .standard-button a, .cta-flavour-1 .vc_btn3.vc_btn3-color-juicy-pink, .cta-flavour-1 .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat {
font-size: 12px;
}
}
@media screen and (max-width: 480px) {
.cta-flavour-1 .standard-button a, .cta-flavour-1 .vc_btn3.vc_btn3-color-juicy-pink, .cta-flavour-1 .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat {
font-size: 14px;
}
}
.mc-button {
font-family: "bold" !important;
display: inline-block;
border: 1px solid white !important;
background-color: transparent !important;
color: white !important;
border-radius: 0px;
transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
cursor: pointer !important;
}
.mc-button:hover, .mc-button:active {
background-color: white !important;
color: black !important;
text-decoration: none;
}
.standard-button a, .vc_btn3.vc_btn3-color-juicy-pink, .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat, .mc-button, .wpcf7-submit, .search-submit, #pushMapUp, #ydk-showcontact {
font-family: "bold";
display: inline-block;
border: 1px solid white;
background-color: transparent;
color: white;
line-height: 40px;
padding: 0px 20px;
text-decoration: none;
font-size: 18px;
overflow-x: hidden;
position: relative;
z-index: 999999;
border-radius: 0px;
cursor: pointer;
transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
overflow: hidden;
}
.standard-button a:hover, .standard-button a:active, .vc_btn3.vc_btn3-color-juicy-pink:hover, .vc_btn3.vc_btn3-color-juicy-pink:active, .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat:hover, .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat:active, .mc-button:hover, .mc-button:active, .wpcf7-submit:hover, .wpcf7-submit:active, .search-submit:hover, .search-submit:active, #pushMapUp:hover, #pushMapUp:active, #ydk-showcontact:hover, #ydk-showcontact:active {
text-decoration: none;
}
.standard-button a span, .vc_btn3.vc_btn3-color-juicy-pink span, .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat span, .mc-button span, .wpcf7-submit span, .search-submit span, #pushMapUp span, #ydk-showcontact span {
position: relative;
z-index: 9999;
}
.standard-button a:after, .vc_btn3.vc_btn3-color-juicy-pink:after, .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat:after, .mc-button:after, .wpcf7-submit:after, .search-submit:after, #pushMapUp:after, #ydk-showcontact:after {
content: "";
display: inline-block;
height: 100px;
width: 20px;
background-color: rgba(255, 255, 255, 0.5);
transform: rotate(30deg);
position: absolute;
left: -50px;
top: -30px;
transition: all 0.4s ease-in-out;
}
.standard-button a:hover:after, .vc_btn3.vc_btn3-color-juicy-pink:hover:after, .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat:hover:after, .mc-button:hover:after, .wpcf7-submit:hover:after, .search-submit:hover:after, #pushMapUp:hover:after, #ydk-showcontact:hover:after {
left: 110%;
}
@media screen and (max-width: 1040px) {
.standard-button a, .vc_btn3.vc_btn3-color-juicy-pink, .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat, .mc-button, .wpcf7-submit, .search-submit, #pushMapUp, #ydk-showcontact {
font-size: 18px;
}
}
@media screen and (max-width: 767px) {
.standard-button a, .vc_btn3.vc_btn3-color-juicy-pink, .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat, .mc-button, .wpcf7-submit, .search-submit, #pushMapUp, #ydk-showcontact {
font-size: 18px;
}
}
@media screen and (max-width: 480px) {
.standard-button a, .vc_btn3.vc_btn3-color-juicy-pink, .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat, .mc-button, .wpcf7-submit, .search-submit, #pushMapUp, #ydk-showcontact {
font-size: 14px;
}
}
#pushMapUp, #ydk-showcontact {
width: 50px;
height: 50px;
padding: 0px;
border-radius: 50%;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row;
flex-direction: row;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
}
#pushMapUp svg, #ydk-showcontact svg {
font-size: 32px !important;
}
.pink-background .standard-button a, .pink-background .vc_btn3.vc_btn3-color-juicy-pink, .pink-background .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat {
font-family: "bold";
display: inline-block;
border: 1px solid white;
background-color: #4b3e26;
color: white;
line-height: 40px;
padding: 0px 20px;
text-decoration: none;
font-size: 16px;
overflow-x: hidden;
position: relative;
border-radius: 0px;
cursor: pointer;
transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
}
.pink-background .standard-button a:hover, .pink-background .standard-button a:active, .pink-background .vc_btn3.vc_btn3-color-juicy-pink:hover, .pink-background .vc_btn3.vc_btn3-color-juicy-pink:active, .pink-background .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat:hover, .pink-background .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat:active {
background-color: white;
color: #4b3e26;
text-decoration: none;
}
@media screen and (max-width: 1040px) {
.pink-background .standard-button a, .pink-background .vc_btn3.vc_btn3-color-juicy-pink, .pink-background .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat {
font-size: 14px;
}
}
@media screen and (max-width: 767px) {
.pink-background .standard-button a, .pink-background .vc_btn3.vc_btn3-color-juicy-pink, .pink-background .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat {
font-size: 12px;
}
}
@media screen and (max-width: 480px) {
.pink-background .standard-button a, .pink-background .vc_btn3.vc_btn3-color-juicy-pink, .pink-background .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat {
font-size: 12px;
}
} .webshop-button {
position: absolute;
right: 0;
}
.webshop-button a {
border: 1px solid black;
border-radius: 1rem;
padding: 10px 20px;
text-decoration: none;
position: absolute;
right: 20px;
top: 20px;
z-index: 999999;
background: #c9c4b9;
color: black;
box-shadow: none !important;
}
.webshop-button a:hover {
color: #c9c4b9;
cursor: pointer;
background: black;
box-shadow: none !important;
}
@media screen and (max-width: 480px) {
.webshop-button a {
right: 30px;
}
}
*, *:before, *:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
html, body {
width: 100%;
overflow-x: hidden;
background: #c9c4b9;
}
#page {
max-width: 1600px;
margin: 0 auto;
}
.entry-header {
display: none;
}
.wrap {
max-width: none;
padding: 0;
}
.entry-content a img {
-webkit-box-shadow: none;
box-shadow: none;
}
@media screen and (min-width: 768px) {
#hoofdlogo {
display: block !important;
}
}
.site-content-contain {
background: #c9c4b9;
}
.hidden {
display: none !important;
}
.cursorpointer {
cursor: pointer;
}
.site-footer {
margin: 0;
border-top: none;
}
.site-footer .wrap {
padding: 0;
}
#menutoggle {
position: absolute;
top: 50px;
right: 50px;
display: block;
font-family: "serif-font";
font-size: 20px;
color: white;
text-shadow: 0px 0px 10px black;
}
@media screen and (max-width: 767px) {
#menutoggle {
top: -500px;
}
}
@media screen and (max-width: 600px) {
#menutoggle {
top: -420px;
}
}
@media screen and (max-width: 490px) {
#menutoggle {
top: -350px;
}
}
@media screen and (max-width: 405px) {
#menutoggle {
top: -315px;
}
}
@media screen and (max-width: 365px) {
#menutoggle {
top: -280px;
}
}
.main-menu {
margin-bottom: 50px;
padding: 20px;
background: rgba(255, 255, 255, 0.4);
max-width: 200px;
}
@media screen and (max-width: 767px) {
.main-menu {
margin-bottom: 0;
}
}
@media screen and (max-width: 767px) {
.main-menu h2 {
font-size: 20px;
line-height: 20px;
}
}
.main-menu a {
display: block;
font-family: "serif-font";
font-size: 20px;
box-shadow: none;
}
@media screen and (max-width: 767px) {
.main-menu a {
font-size: 16px;
}
}
.menu-disclaimer {
padding: 20px;
max-width: 200px;
}
.menu-disclaimer a {
font-size: 12px;
display: block;
box-shadow: none;
}
@media screen and (max-width: 767px) {
.colophone:not(.menu-disclaimer) {
margin-left: auto;
max-width: 200px;
padding: 20px;
}
}
.mobile-home {
display: none;
}
@media screen and (max-width: 1040px) {
.mobile-home {
display: block;
}
}
.mobile-home .logo {
position: relative;
top: 20px;
left: 20px;
}
.mobile-home .logo img {
height: 120px;
}
.mobile-home .logo a {
text-decoration: none;
-webkit-box-shadow: none;
box-shadow: none;
}
.homeblok {
height: 100vh;
min-height: 1024px;
position: relative;
margin-bottom: 30px;
}
.homeblok h2 {
font-size: 30px;
}
@media screen and (max-width: 1040px) {
.homeblok {
height: auto;
min-height: 0;
}
}
@media screen and (max-width: 767px) {
.homeblok {
height: auto;
min-height: 0;
}
}
.homeblok .image {
height: 100%;
}
@media screen and (max-width: 1355px) {
.homeblok .image {
width: 75%;
}
}
@media screen and (max-width: 892px) {
.homeblok .image {
width: 70%;
}
}
@media screen and (max-width: 767px) {
.homeblok .image {
width: 0px;
height: 0px;
background: none !important;
min-height: 0;
overflow: visible;
position: absolute;
top: 0;
right: 0;
}
}
.homeblok .image > .vc_column-inner {
padding-top: 0;
height: 100%;
background-size: cover;
background-position: center;
}
@media screen and (max-width: 1040px) {
.homeblok .image > .vc_column-inner {
background-size: contain;
background-repeat: no-repeat;
}
}
.homeblok .content {
height: 100%;
}
@media screen and (max-width: 1355px) {
.homeblok .content {
width: 25%;
}
}
@media screen and (max-width: 892px) {
.homeblok .content {
width: 30%;
}
}
@media screen and (max-width: 1040px) {
.homeblok .content {
width: 100%;
background-size: contain;
background-repeat: no-repeat;
background-position-y: bottom;
}
}
.homeblok .content .logo {
margin-top: 30px;
}
@media screen and (max-width: 1040px) {
.homeblok .content .logo {
position: absolute;
display: none;
}
}
.homeblok .content .logo a {
text-decoration: none;
-webkit-box-shadow: none;
box-shadow: none;
}
.homeblok .content .logo img {
height: auto;
width: 100%;
max-width: 100%;
padding-left: 20px;
padding-right: 20px;
}
@media screen and (max-width: 1040px) {
.homeblok .content .logo img {
height: 110px;
}
}
@media screen and (max-width: 1040px) {
.homeblok .content a img {
box-shadow: none;
}
}
.homeblok .content .contact {
position: absolute;
bottom: 0;
padding: 0 50px;
width: 100%;
}
@media screen and (max-width: 1040px) {
.homeblok .content .contact {
bottom: auto;
position: static;
}
}
.homeblok .content .contact p {
text-align: right;
}
.homeblok .content .contact .colophone {
margin-bottom: 40px;
}
@media screen and (max-width: 1040px) {
.homeblok .content .contact .colophone.menu-disclaimer {
margin: 0;
}
}
.homeblok .content .contact .socials {
text-align: right;
}
@media screen and (max-width: 1040px) {
.homeblok .content .contact .socials {
padding-right: 20px;
}
}
.homeblok .content .contact .socials a {
box-shadow: none;
}
.homeblok .content .contact .socials img {
height: 25px;
width: 30px;
}
@media screen and (max-width: 1040px) {
.homeblok .content .contact .socials img {
width: auto;
background: white;
}
}
@media screen and (max-width: 1040px) {
.homeblok .content .sidemenu {
bottom: auto;
}
}
.introblok {
height: 100vh;
min-height: 1024px;
position: relative;
margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
.introblok {
height: auto;
}
}
@media screen and (max-width: 480px) {
.introblok {
height: auto;
}
}
.introblok .image {
height: 100%;
}
@media screen and (max-width: 767px) {
.introblok .image {
height: 400px;
}
}
@media screen and (max-width: 480px) {
.introblok .image {
height: 320px;
}
}
.introblok .image > .vc_column-inner {
padding-top: 0;
height: 100%;
width: 100%;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
@media screen and (max-width: 767px) {
.introblok .image .logo {
display: none;
}
}
.introblok .image .logo a {
text-decoration: none;
-webkit-box-shadow: none;
box-shadow: none;
}
.introblok .image .logo img {
height: auto;
width: 125px;
max-width: 100%;
margin-left: 20px;
margin-top: 20px;
}
.introblok .content {
height: 100%;
padding-left: 40px;
padding-right: 20px;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
}
@media screen and (max-width: 767px) {
.introblok .content {
height: auto;
}
}
@media screen and (max-width: 480px) {
.introblok .content {
height: auto;
}
}
.introblok .content p {
font-family: "regular";
font-size: 14px;
margin-bottom: 20px;
}
.introblok .content strong {
font-family: "light";
font-size: 25px;
}
.introblok .content h1 {
font-family: "light";
font-size: 25px;
text-transform: uppercase;
}
.introblok .content .quote {
padding: 30px;
}
.introtext {
padding-left: 10px;
}
.introtext h1 {
font-size: 20px;
line-height: 24px;
font-family: "regular";
}
.introtext p {
font-family: "regular";
font-size: 18px;
}
.stijlblok {
height: 100vh;
min-height: 1024px;
position: relative;
margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
.stijlblok {
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-align-items: stretch;
align-items: stretch;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
}
}
.stijlblok .image {
height: 100%;
}
@media screen and (max-width: 767px) {
.stijlblok .image {
height: 50%;
}
}
.stijlblok .image > .vc_column-inner {
padding-top: 0;
height: 100%;
background-size: contain;
background-position-x: center;
background-position-y: center;
background-repeat: no-repeat;
}
.stijlblok .content {
height: calc(100% - 50px);
margin-top: 50px;
}
@media screen and (max-width: 767px) {
.stijlblok .content {
height: 50%;
order: 2;
}
}
.stijlblok .content > div {
height: 100%;
width: calc(100% - 50px);
margin-right: 50px;
background-size: 100% 50%;
background-position-y: top;
background-repeat: no-repeat;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row;
flex-direction: row;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
}
@media screen and (max-width: 767px) {
.stijlblok .content > div {
background-size: auto 50%;
}
}
@media screen and (max-width: 480px) {
.stijlblok .content > div {
background-size: auto 30%;
}
}
.stijlblok .content .quote {
padding: 30px;
margin-bottom: 0;
width: 90%;
}
@media screen and (max-width: 767px) {
.stijlblok .content .quote {
width: 100%;
padding: 10px;
}
}
.stijlblok .content .quote p {
font-family: "regular";
font-size: 20px;
margin-bottom: 20px;
}
@media screen and (max-width: 767px) {
.stijlblok .content .quote p {
font-size: 16px;
}
}
.stijlblok .content .quote p a {
font-family: "light";
font-size: 15px;
margin-top: 30px;
}
.stijlblok .content .quote h2 {
font-family: "light";
font-size: 25px;
text-transform: uppercase;
}
.stijlblok .content .logo {
position: absolute;
top: 0;
z-index: 2;
}
@media screen and (max-width: 767px) {
.stijlblok .content .logo {
display: none;
}
}
.stijlblok .content .logo a {
text-decoration: none;
-webkit-box-shadow: none;
box-shadow: none;
}
.stijlblok .content .logo img {
height: auto;
width: 125px;
max-width: 100%;
margin-left: 20px;
margin-top: 20px;
}
@media screen and (max-width: 767px) {
.stijlblok .content .logo img {
margin-top: 100px;
}
}
@media screen and (max-width: 480px) {
.stijlblok .content .logo img {
width: 96px;
}
}
.project1blok {
height: 1024px;
position: relative;
margin-bottom: 30px;
}
@media screen and (max-width: 1200px) {
.project1blok {
height: 800px;
}
}
@media screen and (max-width: 892px) {
.project1blok {
height: 625px;
}
}
@media screen and (max-width: 767px) {
.project1blok {
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-align-items: stretch;
align-items: stretch;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
height: 786px;
margin-bottom: 130px;
}
}
@media screen and (max-width: 480px) {
.project1blok {
height: 547px;
}
}
.project1blok .image {
height: 100%;
background-size: contain;
background-repeat: no-repeat;
background-position: right center;
background-image: url(//www.ydkwonen.nl/wp-content/uploads/ydk-wonen-website-afbeelding-5-1200x1030.jpg);
}
@media screen and (max-width: 1355px) {
.project1blok .image {
width: 75%;
}
}
@media screen and (max-width: 892px) {
.project1blok .image {
width: 70%;
}
}
@media screen and (max-width: 767px) {
.project1blok .image {
height: 640px;
width: 100%;
background-position: center center;
}
}
@media screen and (max-width: 480px) {
.project1blok .image {
height: 415px;
}
}
.project1blok .image > .vc_column-inner {
padding-top: 0;
height: 100%;
}
.project1blok .image.sample1 {
background-image: url(//www.ydkwonen.nl/wp-content/uploads/ydk-wonen-website-afbeelding-5-1200x1030-detail-1.jpg);
}
.project1blok .image.sample2 {
background-image: url(//www.ydkwonen.nl/wp-content/uploads/ydk-wonen-website-afbeelding-5-1200x1030-detail-2.jpg);
}
.project1blok .content {
height: 100%;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
}
@media screen and (max-width: 1355px) {
.project1blok .content {
width: 25%;
}
}
@media screen and (max-width: 892px) {
.project1blok .content {
width: 30%;
}
}
@media screen and (max-width: 767px) {
.project1blok .content {
height: 146px;
width: 100%;
}
}
@media screen and (max-width: 480px) {
.project1blok .content {
height: 132px;
}
}
.project1blok .content p {
font-family: "serif-font";
font-size: 20px;
}
.project1blok .content h2 {
font-family: "light";
font-size: 25px;
text-transform: uppercase;
margin-bottom: 0 !important;
}
.project1blok .content .quote {
padding: 30px;
margin-bottom: 0;
}
.project1blok .content .text {
padding: 0 30px;
}
@media screen and (max-width: 767px) {
.project1blok .content .text {
width: calc(100% - 100px);
}
}
.project1blok .content .text p {
font-family: "light";
font-size: 15px;
}
@media screen and (max-width: 767px) {
.project1blok .content .logo {
display: none;
}
}
.project1blok .content .logo a {
text-decoration: none;
-webkit-box-shadow: none;
box-shadow: none;
}
.project1blok .content .logo img {
height: auto;
width: 125px;
max-width: 100%;
margin-left: 20px;
margin-top: 20px;
}
.project1blok .content .imagebuttons {
position: absolute;
bottom: 0;
right: 30px;
}
.project1blok .content .imagebuttons .cursorpointer {
display: inline-block;
}
@media screen and (max-width: 767px) {
.project1blok .content .imagebuttons {
position: absolute;
bottom: 0;
right: auto;
left: 30px;
z-index: 2;
top: 800px;
width: 300px;
}
}
@media screen and (max-width: 480px) {
.project1blok .content .imagebuttons {
top: 560px;
}
}
.project2blok {
height: 1024px;
position: relative;
margin-bottom: 30px;
}
@media screen and (max-width: 1200px) {
.project2blok {
height: 800px;
}
}
@media screen and (max-width: 892px) {
.project2blok {
height: 625px;
}
}
@media screen and (max-width: 767px) {
.project2blok {
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-align-items: stretch;
align-items: stretch;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
height: 786px;
margin-bottom: 130px;
}
}
@media screen and (max-width: 480px) {
.project2blok {
height: 547px;
}
}
.project2blok .image {
height: 100%;
background-size: contain;
background-repeat: no-repeat;
background-position: left center;
background-image: url(//www.ydkwonen.nl/wp-content/uploads/ydk-wonen-website-afbeelding-8-1200x1030.jpg);
}
@media screen and (max-width: 1355px) {
.project2blok .image {
width: 75%;
}
}
@media screen and (max-width: 892px) {
.project2blok .image {
width: 70%;
}
}
@media screen and (max-width: 767px) {
.project2blok .image {
height: 640px;
width: 100%;
background-position: center center;
order: 2;
}
}
@media screen and (max-width: 480px) {
.project2blok .image {
height: 415px;
}
}
.project2blok .image > .vc_column-inner {
padding-top: 0;
height: 100%;
}
.project2blok .image.sample1 {
background-image: url(//www.ydkwonen.nl/wp-content/uploads/ydk-wonen-website-afbeelding-8-1200x1030-detail-1.jpg);
}
.project2blok .image.sample2 {
background-image: url(//www.ydkwonen.nl/wp-content/uploads/ydk-wonen-website-afbeelding-8-1200x1030-detail-2.jpg);
}
@media screen and (max-width: 767px) {
.project2blok .image .logo {
display: none;
}
}
.project2blok .image .logo a {
text-decoration: none;
-webkit-box-shadow: none;
box-shadow: none;
}
.project2blok .image .logo img {
height: auto;
width: 125px;
max-width: 100%;
margin-left: 20px;
margin-top: 20px;
}
.project2blok .content {
height: 100%;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
}
@media screen and (max-width: 1355px) {
.project2blok .content {
width: 25%;
}
}
@media screen and (max-width: 892px) {
.project2blok .content {
width: 30%;
}
}
@media screen and (max-width: 767px) {
.project2blok .content {
height: 146px;
width: 100%;
}
}
@media screen and (max-width: 480px) {
.project2blok .content {
height: 132px;
}
}
.project2blok .content p {
font-family: "serif-font";
font-size: 20px;
}
.project2blok .content h2 {
font-family: "light";
font-size: 25px;
text-transform: uppercase;
margin-bottom: 0 !important;
}
.project2blok .content .quote {
padding: 30px;
margin-top: 175px;
}
@media screen and (max-width: 767px) {
.project2blok .content .quote {
margin-top: 0;
}
}
.project2blok .content .text {
padding: 0 30px;
}
@media screen and (max-width: 767px) {
.project2blok .content .text {
width: calc(100% - 100px);
}
}
.project2blok .content .text p {
font-family: "light";
font-size: 15px;
}
.project2blok .content .imagebuttons {
position: absolute;
bottom: 0;
left: 30px;
}
.project2blok .content .imagebuttons .cursorpointer {
display: inline-block;
}
@media screen and (max-width: 767px) {
.project2blok .content .imagebuttons {
position: absolute;
bottom: 0;
right: auto;
left: 30px;
z-index: 2;
top: 800px;
width: 300px;
}
}
@media screen and (max-width: 480px) {
.project2blok .content .imagebuttons {
top: 560px;
}
}
.project3blok {
height: 1024px;
position: relative;
margin-bottom: 30px;
}
@media screen and (max-width: 1200px) {
.project3blok {
height: 800px;
}
}
@media screen and (max-width: 892px) {
.project3blok {
height: 625px;
}
}
@media screen and (max-width: 767px) {
.project3blok {
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-align-items: stretch;
align-items: stretch;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
height: 786px;
margin-bottom: 130px;
}
}
@media screen and (max-width: 480px) {
.project3blok {
height: 547px;
}
}
.project3blok .image {
height: 100%;
background-size: contain;
background-repeat: no-repeat;
background-position: right center;
background-image: url(//www.ydkwonen.nl/wp-content/uploads/ydk-wonen-website-afbeelding-17-1200x880-detail-2.jpg);
}
@media screen and (max-width: 1355px) {
.project3blok .image {
width: 75%;
}
}
@media screen and (max-width: 892px) {
.project3blok .image {
width: 70%;
}
}
@media screen and (max-width: 767px) {
.project3blok .image {
height: 640px;
width: 100%;
background-position: center center;
}
}
@media screen and (max-width: 480px) {
.project3blok .image {
height: 415px;
}
}
.project3blok .image > .vc_column-inner {
padding-top: 0;
height: 100%;
}
.project3blok .image.sample1 {
background-image: url(//www.ydkwonen.nl/wp-content/uploads/ydk-wonen-website-afbeelding-17-1200x880-detail-3-1-1.jpg);
}
.project3blok .image.sample2 {
background-image: url(//www.ydkwonen.nl/wp-content/uploads/ydk-wonen-website-afbeelding-17-1200x880-detail-1.jpg);
}
.project3blok .content {
height: 100%;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
}
@media screen and (max-width: 1355px) {
.project3blok .content {
width: 25%;
}
}
@media screen and (max-width: 892px) {
.project3blok .content {
width: 30%;
}
}
@media screen and (max-width: 767px) {
.project3blok .content {
height: 146px;
width: 100%;
}
}
@media screen and (max-width: 480px) {
.project3blok .content {
height: 132px;
}
}
.project3blok .content p {
font-family: "serif-font";
font-size: 20px;
}
.project3blok .content h2 {
font-family: "light";
font-size: 25px;
text-transform: uppercase;
margin-bottom: 0 !important;
}
.project3blok .content .quote {
padding: 30px;
margin-bottom: 0;
}
.project3blok .content .text {
padding: 0 30px;
}
@media screen and (max-width: 767px) {
.project3blok .content .text {
width: calc(100% - 100px);
}
}
.project3blok .content .text p {
font-family: "light";
font-size: 15px;
}
@media screen and (max-width: 767px) {
.project3blok .content .logo {
display: none;
}
}
.project3blok .content .logo a {
text-decoration: none;
-webkit-box-shadow: none;
box-shadow: none;
}
.project3blok .content .logo img {
height: auto;
width: 125px;
max-width: 100%;
margin-left: 20px;
margin-top: 20px;
}
.project3blok .content .imagebuttons {
position: absolute;
bottom: 0;
right: 30px;
}
.project3blok .content .imagebuttons .cursorpointer {
display: inline-block;
}
@media screen and (max-width: 767px) {
.project3blok .content .imagebuttons {
position: absolute;
bottom: 0;
right: auto;
left: 30px;
z-index: 2;
top: 800px;
width: 300px;
}
}
@media screen and (max-width: 480px) {
.project3blok .content .imagebuttons {
top: 560px;
}
}
.project4blok {
height: 1024px;
position: relative;
margin-bottom: 30px;
}
@media screen and (max-width: 1200px) {
.project4blok {
height: 800px;
}
}
@media screen and (max-width: 892px) {
.project4blok {
height: 625px;
}
}
@media screen and (max-width: 767px) {
.project4blok {
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-align-items: stretch;
align-items: stretch;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
height: 786px;
margin-bottom: 130px;
}
}
@media screen and (max-width: 480px) {
.project4blok {
height: 547px;
}
}
.project4blok .image {
height: 100%;
background-size: contain;
background-repeat: no-repeat;
background-position: left center;
background-image: url(//www.ydkwonen.nl/wp-content/uploads/ydk-wonen-website-afbeelding-14-1200x1030.jpg);
}
@media screen and (max-width: 1355px) {
.project4blok .image {
width: 75%;
}
}
@media screen and (max-width: 892px) {
.project4blok .image {
width: 70%;
}
}
@media screen and (max-width: 767px) {
.project4blok .image {
height: 640px;
width: 100%;
background-position: center center;
order: 2;
}
}
@media screen and (max-width: 480px) {
.project4blok .image {
height: 415px;
}
}
.project4blok .image > .vc_column-inner {
padding-top: 0;
height: 100%;
}
.project4blok .image.sample1 {
background-image: url(//www.ydkwonen.nl/wp-content/uploads/ydk-wonen-website-afbeelding-14-1200x1030-detail-1.jpg);
}
.project4blok .image.sample2 {
background-image: url(//www.ydkwonen.nl/wp-content/uploads/ydk-wonen-website-afbeelding-14-1200x1030-detail-2.jpg);
}
@media screen and (max-width: 767px) {
.project4blok .image .logo {
display: none;
}
}
.project4blok .image .logo a {
text-decoration: none;
-webkit-box-shadow: none;
box-shadow: none;
}
.project4blok .image .logo img {
height: auto;
width: 125px;
max-width: 100%;
margin-left: 20px;
margin-top: 20px;
}
.project4blok .content {
height: 100%;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
}
@media screen and (max-width: 1355px) {
.project4blok .content {
width: 25%;
}
}
@media screen and (max-width: 892px) {
.project4blok .content {
width: 30%;
}
}
@media screen and (max-width: 767px) {
.project4blok .content {
height: 146px;
width: 100%;
}
}
@media screen and (max-width: 480px) {
.project4blok .content {
height: 132px;
}
}
.project4blok .content p {
font-family: "serif-font";
font-size: 20px;
}
.project4blok .content h2 {
font-family: "light";
font-size: 25px;
text-transform: uppercase;
margin-bottom: 0 !important;
}
.project4blok .content .quote {
padding: 30px;
margin-top: 175px;
}
@media screen and (max-width: 767px) {
.project4blok .content .quote {
margin-top: 0;
}
}
.project4blok .content .text {
padding: 0 30px;
}
@media screen and (max-width: 767px) {
.project4blok .content .text {
width: calc(100% - 100px);
}
}
.project4blok .content .text p {
font-family: "light";
font-size: 15px;
}
.project4blok .content .imagebuttons {
position: absolute;
bottom: 0;
left: 30px;
}
.project4blok .content .imagebuttons .cursorpointer {
display: inline-block;
}
@media screen and (max-width: 767px) {
.project4blok .content .imagebuttons {
position: absolute;
bottom: 0;
right: auto;
left: 30px;
z-index: 2;
top: 800px;
width: 300px;
}
}
@media screen and (max-width: 480px) {
.project4blok .content .imagebuttons {
top: 560px;
}
}
.sliderblok {
height: auto;
position: relative;
margin-bottom: 30px;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row;
flex-direction: row;
-webkit-align-items: stretch;
align-items: stretch;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
.sliderblok .image {
height: 100%;
background-size: cover;
}
@media screen and (max-width: 767px) {
.sliderblok .image {
width: 100%;
height: 70%;
order: 2;
}
}
.sliderblok .image > .vc_column-inner {
padding-top: 0;
height: 100%;
}
.sliderblok .content {
height: 100%;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: flex-start;
justify-content: flex-start;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
}
@media screen and (max-width: 767px) {
.sliderblok .content {
width: 100%;
height: 30%;
order: 1;
}
}
.sliderblok .content p {
font-family: "serif-font";
font-size: 20px;
}
.sliderblok .content h2 {
font-family: "light";
font-size: 25px;
text-transform: uppercase;
margin-bottom: 0 !important;
}
.sliderblok .content .quote {
padding: 30px;
}
.sliderblok .content .text {
padding: 0 30px;
}
.sliderblok .content .text p {
font-family: "light";
font-size: 15px;
}
.sliderblok .content .logo a {
text-decoration: none;
-webkit-box-shadow: none;
box-shadow: none;
}
.sliderblok .content .logo img {
height: auto;
width: 125px;
max-width: 100%;
margin-left: 20px;
margin-top: 20px;
}
.contactblok {
height: 900px;
position: relative;
}
@media screen and (max-width: 767px) {
.contactblok {
height: auto;
}
}
.contactblok .image {
height: 100%;
}
@media screen and (max-width: 767px) {
.contactblok .image {
height: 500px;
}
}
@media screen and (max-width: 480px) {
.contactblok .image {
height: 350px;
}
}
.contactblok .image > .vc_column-inner {
padding-top: 0;
height: 100%;
background-size: contain;
background-position-x: center;
background-position-y: 60%;
background-repeat: no-repeat;
width: 100%;
}
.contactblok .image .logo a {
text-decoration: none;
-webkit-box-shadow: none;
box-shadow: none;
}
.contactblok .image .logo img {
height: auto;
width: 125px;
max-width: 100%;
margin-left: 20px;
margin-top: 20px;
}
@media screen and (max-width: 767px) {
.contactblok .image .logo {
display: none;
}
}
.contactblok .content {
height: 100%;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-align-items: flex-start;
align-items: flex-start;
-webkit-justify-content: center;
justify-content: center;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
}
.contactblok .content > div {
max-width: 700px;
}
.contactblok .content p {
font-family: "serif-font";
font-size: 20px;
}
.contactblok .content h2 {
font-family: "light";
font-size: 25px;
text-transform: uppercase;
}
.contactblok .content .quote {
padding: 30px;
}
.contactblok .content label {
font-family: "light";
font-size: 15px;
width: calc(100% - 50px);
margin: 10px auto 0;
}
.contactblok .content form {
position: relative;
}
.contactblok .content textarea {
height: 150px;
}
.contactblok .content .captcha-image {
border: none;
}
.contactblok .content .disclaimers {
position: absolute;
bottom: 0px;
right: 40px;
text-align: right;
font-family: "light";
font-size: 15px;
line-height: 35px;
}
@media screen and (max-width: 480px) {
.contactblok .content .disclaimers {
position: static;
margin-left: 30px;
text-align: left;
}
}
.contactblok .content input[type="submit"] {
z-index: 1;
}
.contactblok .captcha-image label > input:checked + svg, .contactblok .captcha-image label > input:focus + svg {
border: 2px solid black;
}
.contactblok .captcha-image .cf7ic_instructions span {
font-family: "bold";
color: black;
}
.black-overlay {
background-color: rgba(0, 0, 0, 0.8);
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: 20;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
}
.black-overlay .popup {
position: relative;
padding: 30px;
background: white;
height: 600px;
width: 650px;
max-height: 100vh;
max-width: 100vw;
overflow: scroll;
}
.black-overlay .popup h2 {
font-family: "serif-font";
font-size: 30px;
}
.black-overlay .popup p, .black-overlay .popup ul li {
font-family: "light";
font-size: 12px;
}
.black-overlay .popup ul {
margin-left: 30px;
}
.black-overlay .popup .closepopup {
position: absolute;
top: 10px;
right: 20px;
display: inline-block;
box-shadow: none;
}