/*
	Theme Name: VeerseKreek
	Author: Ramon Boonman, Maik van Lieshout | buro111
	Author URI: https://buro111.nl
	Description: VeerseKreek template voor WordPress
*/

	body {

}
/* Font */
h1,
header .headslider .slide span.headertext {font-family: 'Khand', sans-serif; letter-spacing: 2px; }
header .headslider .slide span.headertext { font-family: 'Khand', sans-serif; margin:90px 0; right:7%; font-size:42px; letter-spacing: 2px; }
.breadcrumbs {font-size: 13px; line-height: 13px; font-family:'Khand'; text-transform: uppercase; letter-spacing: 2px; margin-left:30px;}
.logolink {font-family: 'Khand', sans-serif; font-size: 40px; line-height: 40px; letter-spacing: 2px }
.scrollActive .logolink {font-size: 32px; line-height: 32px}
strong {font-family: 'Roboto Slab'}
.homepage header h1 {font-size: 50px; font-weight:100; line-height: 50px; margin-top:0; }
.page h1, .homepage h1 {font-size: 44px; line-height: 44px}
h3 {font-size: 32px; line-height: 32px; }
h4 {font-size: 16px; line-height: 16px;}
h5 {font-size: 16px; line-height: 16px; font-family: 'Glegoo'}
footer {font-size: 14px; line-height: 20px; font-family: 'Khand'}
.subscribe_button .button {font-family: 'Glegoo'}
.bold {font-family: 'Khand', sans-serif;font-weight:700;}
.highlight figure {font-size: 28px; line-height: 30px}
.highlight figure p {font-size: 14px; line-height: 15px}
.subscribe_button .button {font-size: 32px; line-height: 32px}
/*.subscribe_button_2 span {font-size: 32px; line-height: 64px}*/
.subscribe_button_2 span {font-size: 20px; line-height: 64px; text-transform: uppercase; letter-spacing: 2px; font-size: 17px; line-height: 48px; }
.quote span {font-size: 32px; line-height: 36px; font-family: 'Glegoo'}

/*.subscribe_button_2 svg {height: 47px; width: 175px; top: 0.35em; position: relative}*/
.subscribe_button_2 svg {height: 47px; width: 270px; top: 0.55em; position: relative}
.subscribe_button_2 {
    min-height: 55px;
}
.header-ctas { text-align:right; }
.header-ctas>div { padding:0; border:0; }
.wpml-ls-legacy-list-horizontal a { padding:0; margin-left:10px;}
.eigenschap {display: block; }
.eigenschap:before {    
    content: '';
    background-color: #fff;
    margin-right: 15px;
    width: 5px;
    height: 5px;
    top: 13px;
    display: block;
    position: relative;
    left: -15px;
}
.width-100p { width:100%; }

.ajax-woning .slick-slider {background-color: #beac94}

.gebr-button { text-align:left; padding-left:20px; }

span.wpcf7-list-item { margin:0; color:black;}
span.wpcf7-list-item-label { color:black; } 
@media (max-width: 1199px) {
    .subscribe_button_2 a {margin: 0 auto 25px}
    .subscribe_button_2 span {text-align: center; width: 100%}
    .subscribe_button_2 .padding-left-30 {padding-left: 15px}

    .spotlight .height-325 {height: auto}

    .highlights.padding-bottom-50 {padding-bottom: 0}
}

@media (max-width: 991px) {
    /* If it's stupid but it works, it isn't stupid. */
    body {background-position: -99999px -99999px;}
    body { background-image:none; }
    body:before {content: ""; background-image: inherit; position: fixed; top: 0; left: 0; height: 100vh; width: 100%; -webkit-background-size: cover !important; -moz-background-size: cover !important; -o-background-size: cover; background-size: cover !important; z-index: -1;}
    
    .logo {box-shadow: none}
    .mobileMenuToggler {position: relative; top: 25px}
    /*.container-fluid[class*="padding-"] {padding: 0 15px}*/
    header h1 br, header p br {display: none}
    h1, .page h1, .homepage h1, .homepage header h1 {font-size: 35px; line-height: 40px}

    .subscribe_button_2 a {margin: 25px auto 0}
    .subscribe_button_2 svg {width: 210px; top: 0.80em}
    .subscribe_button_2 span {font-size: 20px; line-height: 24px; text-align: center; width: 100%}
    .subscribe_button_2 .container {padding-bottom: 15px}

    .experience {padding-bottom: 0}
    .experience .display-md-flex {display: block; background: none; color: #495a63}
    .experience figure img {float: none; width: 100%}
    .experience figcaption {padding: 15px 0 0}
    .experience .padding-left-0 {padding-left: 15px} 
    .experience .padding-right-0 {padding-right: 15px}
    .experience .quote {height: auto; padding: 15px 0}
    .experience .display-flex div {flex: inherit}

    .text-img-left a.next,
    .text-img-right a.next {padding-right: 32px}

    .highlight {width: 100%}
    .highlight > div {display: inline-block; width: 100%; position: relative}
    .highlight figure {height: auto; min-height:0}
    .highlight figure img {max-width: 263px; float: left}
    .highlight figure figcaption {width: 50%; width: calc(100% - 263px); float: left}
    .highlight figure figcaption .button.next {right: 0; bottom: 0}

    .news-facebook .col-xs-12.padding-right-0 {padding-right: 15px}
    .woningdetail { font-size:15px; }
    .woningdetail .padding-left-0,
    .woningdetail .padding-right-0 {padding: 0}
    .woningdetail .col-xs-12 {padding-top: 15px}
    .projectenlijst { display:none; }
    .p-justify { text-a lign:left !important; }
    .p-justify p { text-align:left !important; }
    .mobile-button { padding-right:30px !important; margin-bottom:10px; }
    .mobile-margin { margin-top:20px; margin-bottom:20px;}
}

@media (max-width: 991px) and (min-width: 768px) {
    .text-img-right a.button.next {right: 0}
}

@media (max-width: 767px) {
	.text-img-left { margin-top:15px;margin-bottom:15px; }
	.text-img-right { margin-top:15px;margin-bottom:15px; }
    .mobileMenuToggler {top: 0; padding: 10px 0}
    .scrollActive .mobileMenuToggler {top: 0; padding: 15px 7.5px}
    .scrollActive .fixedheader .logolink {float: left}

    .logo {margin: 0 auto; width: 100%; max-width: 260px; text-align: center; display: block; padding: 5px 15px 0 }

    .container-fluid.padding-50-0 {padding: 0 15px}

    .subscribe_button_2 {padding-top: 15px}
    .subscribe_button_2 svg {display: none}
    .subscribe_button_2 a.button {margin-top: 15px}

    .highlight {margin-bottom: 15px}

    .woningen .height-100 {height: auto}
    .woningen .woning img {display: none}

    /*.columns {padding: 0}*/
}

@media (max-width: 572px) {
    .highlight {max-width: 293px; margin: 0 auto 15px; float: none}
    .highlight figure figcaption {width: 100%;}
}

@media (min-width:1920px) { 
	.slick-slide img { width:100%; }
}

form input, form textarea, form .wpcf7-list-item label {width: 100%; max-width: 100%; padding: 5px 10px; outline: none; border: 2px solid #fff}
form .wpcf7-list-item label:hover {cursor: pointer}
form .wpcf7-validation-errors,
form.invalid input.wpcf7-not-valid, form.invalid textarea.wpcf7-not-valid {border-color: red}
form label {margin: 0; width:100%;}
form .wpcf7-validation-errors {margin: 0; margin-top: 15px}
form span.wpcf7-not-valid-tip {display: none}
form input[type="checkbox"] {visibility: hidden; position: absolute; left: -9999px}
form .wpcf7-list-item {display: block; margin-bottom: 10px; color: #999; font-weight: bold}

form .wpcf7-list-item {
    display: block;
    margin-bottom: 10px;
    color: #fff;
    font-weight: bold;
}
form input, form textarea, form .wpcf7-list-item label {
    width: 100%;
    max-width: 100%;
    padding: 5px 10px;
    outline: none;
    border: 2px solid black;
}
form input[type="checkbox"] {
    visibility: hidden;
    position: absolute;
    left: -9999px;
}
.wpcf7-form-control-wrap input {
    max-width: 100%;
}
input:focus, textarea:focus, form .wpcf7-list-item label.active {
    border-color: #4c88a0;
    background-color: #ece6df;
}
.projectenlijst {
    padding:30px;
}
.projectenlijst h2 {
    margin-top:0;
}
.projectenlijst h4 {
    font-family:'Glegoo';
    font-size:18px;
    margin-top:2px;
    margin-bottom:5px;
}
.projectenlijst a {
    color:#646464
}
.center {
    text-align:center;
}
#map {
    height:400px;
}


.highlight { animation-duration:1.5s; }