/*
 * content.css — Kessens
 *
 * Overgenomen uit het Miami-thema, maar alleen de rules die op de
 * daadwerkelijk gebruikte pagina's aangesproken worden. Gemeten tegen
 * de gerenderde HTML van /, /jobs/, /nieuws/ en de vacaturepost:
 * 59 van 1134 rules in miami/style.css, 22 van 55 in miami_child.
 *
 * Wat hier NIET in zit is de header- en menu-CSS van Miami — die is
 * vervangen door style.css van dit thema.
 */

/* ---- webfont, meegekopieerd uit miami_child ---- */


/* ---- overgenomen uit miami/style.css ---- */

.alignnone {
	margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 20px;
}

a img.alignnone {
	margin: 5px 20px 20px 0;
}

a img.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 20px;
}


iframe {
	border: none !important;
}


/* De color stond hier op #33bfd8 (Miami's demo-cyaan) en is naar
   style.css verhuisd als --kes-link. */
a {
	outline: none;
}

a:focus,
a:active {
	outline: 0;
}

a:hover {
	text-decoration: none !important;
	color: #333;
}

.airy_headline {
	position: relative;
	padding-bottom: 11px;
	font-size: 29px;
	line-height:32px;
	font-weight: 700;
	letter-spacing:2px;
	text-transform: uppercase;
	margin-bottom:31px;
}

.textaligncenter {
	text-align: center;
}

.headerunderline {
	position: relative;
}

.headerunderline:after {
	content:" ";
	width:30px;
	height:2px;
	position:absolute;
	bottom:0px;
	left:50%;
	margin-left:-15px;
}

.textaligncenter.headerunderline:after {
	left:50%;
	margin-left:-15px;
}

.content_max_width {
	margin:auto;
}

.tp_vc_mw_rowinner .vc_row.wpb_row {
	background:transparent !important;
	padding:0 !important;
	border:none !important;
}

.wpb_wrapper {
	position: relative;
}

.headerunderline:after {
	background-color:#333;
}

.lightondark .headerunderline:after {
	background-color:#fff;
}

.lightondark,
.lightondark p,
.lightondark h1,
.lightondark h2,
.lightondark h3,
.lightondark span,
.lightondark a {
	color:#fff;
}

.tp_vc_mw_rowwrapper {
	position: relative;
}

.tp_vc_mw_rowwrapper {
	padding:0px 40px;
}

@media only screen and (max-width: 992px) {
	.tp_vc_mw_rowwrapper {
		padding:0px 20px;
	}

	.postthumb {
		width: 75px !important;
	}

	.postthumb img {
		width: 50px;
	}

	.postshortcode {
		padding: 20px 30px !important;
	}

}

@media only screen and  (max-width: 767px) {
	.tp_vc_mw_rowwrapper {
		padding:0px 20px;
	}

}

@media only screen and  (max-width: 480px) {
	.tp_vc_mw_rowwrapper {
		padding:0px 20px;
	}

	.postshortcode .postthumb {
		display: none;
	}

	.blog_post_title,
.blog_post_title a,
.blog_post_title a:hover {
		font-size: 22px !important;
	}

}

@media only screen  and (max-width: 768px) {
	.wpb_row {
		margin-bottom: 0px !important;
	}

	.wpb_column {
		margin-bottom:35px !important;
	}

}

.tp_vc_mw_rowwrapper .tp_vc_mw_rowwrapper {
	padding:0px !important;
}

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

.blog_post_title,
.blog_post_title a,
.blog_post_title a:hover {
	color:#333;
	font-size:27px;
	line-height:40px;
	font-weight:600;
	display: inline-block;
	margin-top:0px;
}

.blog_post_meta_line {
	padding-right:163px;
	min-height: 33px;
}

.single-post .blog_post_meta_line {
	padding-right:62px;
}

.blog_post_meta_line.small {
	min-height: 0;
	margin-top: 10px;
	padding-right:0px;
}

.blog_post_title.small,
.blog_post_title.small a,
.blog_post_title.small a:visited {
	font-size:21px;
	line-height:26px;
	width: 100%;
	-webkit-transition: color 0.3s ease-in-out;
	-moz-transition: color 0.3s ease-in-out;
	-o-transition: color 0.3s ease-in-out;
	-ms-transition: color 0.3s ease-in-out;
}

.blog_post_title.small {
	margin-top: 5px;
	margin-bottom: 10px !important;
}

.postshortcode {
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	padding: 35px 40px;
	background: #f5f5f5;
	-webkit-transition: background-color 0.3s ease-in-out;
	-moz-transition: background-color 0.3s ease-in-out;
	-o-transition: background-color 0.3s ease-in-out;
	-ms-transition: background-color 0.3s ease-in-out;
	margin-bottom: 0px !important;
}

.postshortcode:hover {
	background: #141437;
	color: #fff;
}

.blog_post_content.small {
	display: table-cell;
	font-size: 15px;
	vertical-align: top;
	-webkit-transition: color 0.3s ease-in-out;
	-moz-transition: color 0.3s ease-in-out;
	-o-transition: color 0.3s ease-in-out;
	-ms-transition: color 0.3s ease-in-out;
}

.postthumb {
	display: table-cell;
	width: 105px;
}

.postthumb img {
	margin-top: 12px;
}

.postshortcode a.postlink {
	color: #333;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 1px;
	margin-top: 20px;
	float: left;
	position: relative;
	-webkit-transition: color 0.3s ease-in-out;
	-moz-transition: color 0.3s ease-in-out;
	-o-transition: color 0.3s ease-in-out;
	-ms-transition: color 0.3s ease-in-out;
}

.postshortcode a.postlink:after {
	content:" ";
	width:30px;
	height:2px;
	position:absolute;
	top:-5px;
	left:1px;
	margin-left:0;
	background: #333;
	-webkit-transition: width 0.5s ease-in-out, background-color 0.5s ease-in-out;
	-moz-transition: width 0.5s ease-in-out, background-color 0.5s ease-in-out;
	-o-transition: width 0.5s ease-in-out, background-color 0.5s ease-in-out;
	-ms-transition: width 0.5s ease-in-out, background-color 0.5s ease-in-out;
}

.postshortcode:hover a.postlink:after {
	width: 100%;
	background: #fff;
}

.postshortcode:hover a.postlink {
	color: #fff;
}

.postshortcode:hover .blog_post_title.small a {
	color: #fff;
}

.postshortcode:hover .blog_post_meta_line.small span {
	color: #999;
	-webkit-transition: color 0.3s ease-in-out;
	-moz-transition: color 0.3s ease-in-out;
	-o-transition: color 0.3s ease-in-out;
	-ms-transition: color 0.3s ease-in-out;
}

.postshortcode:hover .blog_post_meta_line.small span:hover {
	color:#fff;
}

.rowbgimage_overlay {
	position: absolute;
	top: 0px;
	left: 0;
	z-index: 0;
	width: 100%;
	height: 100%;
}


/* ---- overgenomen uit miami_child/style.css ---- */


.wpb_row,
.wpb_content_element {
	margin-bottom: 0 !important;
}


.textaligncenter {
	text-align: center;
}

.blog_post_title,
.blog_post_title a,
.blog_post_title a:hover {
	color: #141437 !important;
}

.home-job {
	max-width: 600px;
	margin: auto;
}

.home-job .blog_post_title {
	display: none;
}

.home-job .postshortcode:not(:hover) {
	background: #f2f2f2;
}


#lang_sel_list ul li {
	background-color: transparent;
}

#lang_sel_list a,
#lang_sel_list a:visited {
	background: transparent;
}

#lang_sel_list ul a {
	background: transparent;
}

.vc_carousel-slideline {
	text-align: center;
}

.vc_images_carousel {
	max-width: 100%;
}

.vc_carousel-slideline .vc_carousel-slideline-inner > .vc_item {
	visibility: visible;
	display: flex;
	align-items: center;
	justify-content: center;
}

.vc_carousel-slideline .vc_carousel-slideline-inner img {
	max-width:100%;
	height: auto;
}

.vc_images_carousel .vc_carousel-control {
	width: 0 !important;
	height: 0 !important;
	opacity: 1 !important;
}

/* miami_child zette 30px + margin-left:-15px conform Bootstrap 3 en
   liet margin-top, margin-right, font-size en line-height aan
   bootstrap.min.css over. Dat laden we niet terug (alleen hidden-xs is
   nog in gebruik), dus die waarden staan hier expliciet. */
.vc_images_carousel .vc_carousel-control .icon-next,
.vc_images_carousel .vc_carousel-control .icon-prev {
	border-radius: 50%;
	background: #141437;
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 30px !important;
	height: 30px !important;
	line-height: 1;
	margin-left: -15px !important;
	margin-top: -15px !important;
}

/* .icon-next hangt aan right:50%, dus die heeft margin-right nodig —
   miami_child overschreef alleen margin-left, waardoor de rechtercirkel
   5px asymmetrisch stond. */
.vc_images_carousel .vc_carousel-control .icon-next {
	margin-right: -15px !important;
}

/* De plugin zet :before op position:relative met top:-10px, en
   miami_child stemde dat af op -2px. Met echte flex-centring is die
   nudge niet meer nodig — anders telt hij dubbel. */
.vc_images_carousel .vc_carousel-control .icon-next:before,
.vc_images_carousel .vc_carousel-control .icon-prev:before {
	color: #fff;
	position: static !important;
	top: auto !important;
	/* bootstrap3/less/carousel.less:246 — 30px bij >=768px. miami_child
	   liet die waarde aan Bootstrap over; wij laden dat niet, dus hier. */
	font-size: 30px;
	line-height: 1;
	/* Optische correctie. Flex centreert de regelbox, niet de inkt, en de
	   inkt van U+2039/U+203A zit in een serif-face onder het midden van
	   de em-box. Opgemeten op 3px te laag; transform verschuift zonder
	   de layout te raken. */
	transform: translateY(-3px);
}



/* ---- enige Bootstrap-utility die nog in de content zit ---- */

@media (max-width: 767px) {
	.hidden-xs {
		display: none !important;
	}
}


/* ---- uit de Customizer-CSS van miami_child (post 1640) ---- */

/* De country-phone-field-plugin zet een vlag-dropdown vóór het veld;
   zonder deze padding valt de tekst eronder. */
.wpcf7-validates-as-phonetext {
	padding-left: 47px !important;
}


/* ---- WPBakery's 35px op gevulde rijen uitgezet ---- */

/* js_composer.min.css zet padding-top:35px op de kolom-inner van elke rij
   met een achtergrondvulling:
     .vc_row-has-fill > .vc_column_container > .vc_column-inner
     .vc_row-has-fill + .vc_row > .vc_column_container > .vc_column-inner
     .vc_row-has-fill > .vc_vc_column_inner > .vc_column_container > .vc_column-inner
   Dat gaf de witruimte boven de slider. Miami had die 35px ook, dus dit is
   een bewuste wijziging en geen herstel.

   Afgebakend met body.home: alleen de zes rijen op de homepage. Foto's en
   Contact hebben elk ook een gevulde rij en die houden hun 35px. */

body.home .vc_row-has-fill > .vc_column_container > .vc_column-inner,
body.home .vc_row-has-fill + .vc_row > .vc_column_container > .vc_column-inner,
body.home .vc_row-has-fill > .vc_row > .vc_vc_column > .vc_column_container > .vc_column-inner,
body.home .vc_row-has-fill > .vc_vc_column_inner > .vc_column_container > .vc_column-inner {
	padding-top: 0;
}
