/*
 Theme Name:   Magneet Agency Child
 Theme URI:    https://bureaumagneet.nl/
 Description:  Thema voor custom code
 Author:       Magneet Agency
 Author URI:   https://bureaumagneet.nl/
 Template:     bricks
 Version:      januari 2024
 Text Domain:  bricks
*/

/* Hero-achtergrond container met video */
#brxe-pojwdn {
  position: relative;
}

/* Wrapper die Bricks gebruikt voor de background video */
#brxe-pojwdn .bricks-background-video-wrapper {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;   /* centreer de iframe */
  overflow: hidden;      /* zwarte balken blijven netjes binnen */
  background: #000;
}

/* Forceer 'contain' gedrag op de iframe en override inline width/height */
#brxe-pojwdn .bricks-background-video-wrapper iframe {
  /* inline styles van Bricks overriden */
  width: auto !important;
  height: auto !important;

  /* 16:9 in z’n geheel tonen (contain) */
  width: min(100vw, calc(100dvh * 16 / 9)) !important;
  height: min(100dvh, calc(100vw * 9 / 16)) !important;

  /* optioneel: verzeker 16:9 voor browsers die aspect-ratio op iframe snappen */
  aspect-ratio: 16 / 9;
}



/* Menu */

li#menu-item-3814-en, li#menu-item-4535-nl {
    display: flex
;
}

.lang-item img {
  width: 25px !important; /* vervang 32 door jouw gewenste breedte */
  height: auto !important; /* houdt de verhouding goed */
  border-radius: 10px;
}

li#menu-item-3814-nl {
    display: flex;
}


/*Tagline*/
.tagline{
	color:#F39E12;
	font-size:16px!important;
	font-weight:400;
	margin-bottom:0px;
}

/*Section aanpassen media*/
.s-bm-media-klein {
width: 100%;
}

.c-bm-media-klein {
width: 100%;
max-width: 1280px;
align-content: center;
}

.mc-bm-media-klein {
width: 100%;
max-width: 800px;
}

.s-bm-media-groot {
width: 100%;
display: flex;
justify-content: center;
}

.c-bm-media-groot {
width: 100%;
max-width: 1280px;
}

.mc-bm-media-groot {
width: 100%;
}

.s-bm-media-fullscreen {
width: 100%;
}

.c-bm-media-fullscreen {
width: 100%;
}

.mc-bm-media-fullscreen {
width: 100%;
}

.iframe-img-bm-media{
	border-radius:50px;
	object-fit: cover;
	width:100%;
}

.iframe-img-bm-media-klein {
	width:100%;
	object-fit: cover;
}

.iframe-img-bm-media-groot {
	width: 100%;
	height: 720px;
	object-fit: cover;

}

.iframe-img-bm-media-fullscreen {
	width:100%;
	min-width:100%;
	height:720px;
}

/*Placeholder*/
.media-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
}

.media-v-play-btn {
    font-size: 10rem;
}

/*Grid classes*/
.twee-items{
	grid-template-columns:repeat(auto-fill, minmax(490px, 1fr));
}

.drie-items{
	grid-template-columns:repeat(auto-fill, minmax(390px, 1fr));
}

.vier-items{
	grid-template-columns:repeat(auto-fill, minmax(290px, 1fr));
}

/*Bovenruimte*/
.ge-top{
	padding-top:0rem;
}

.k-top{
	padding-top:clamp(2rem, calc(2rem + ((1vw - 0.32rem) * 1.0417)), 3rem);
}

.m-top{
	padding-top:clamp(3rem, calc(3rem + ((1vw - 0.32rem) * 3.125)), 6rem);
}

.gr-top{
	padding-top:clamp(5rem, calc(5rem + ((1vw - 0.32rem) * 4.1667)), 9rem);
}
/*Onderruimte*/
.ge-bottom{
	padding-bottom:0rem;
}

.k-bottom{
	padding-bottom:clamp(2rem, calc(2rem + ((1vw - 0.32rem) * 1.0417)), 3rem);
}

.m-bottom{
	padding-bottom:clamp(3rem, calc(3rem + ((1vw - 0.32rem) * 3.125)), 6rem);
}

.gr-bottom{
	padding-bottom:clamp(5rem, calc(5rem + ((1vw - 0.32rem) * 4.1667)), 9rem);
}

/*CTA*/
.bm-header-cta-container {
    display: flex;
    flex-direction: row;
    align-items: center;	
    gap: 10px;
}

.cta-container {
    display: flex;
    gap: 10px;
	margin-top:2rem;
}

.cta-space {
	margin-top: 2rem;
}

.pri-cta, .sec-cta {
    padding: 8px 30px!important;
	font-weight:bold!important;
    border-radius:30px 0px 30px 0px!important;
	transition: all .3s ease-in-out;
	display: flex;
    align-items: center;
    gap: 5px;
	border:1px solid;
	justify-content:center;
}

.pri-cta {
    background-color: #004063;
    color: #fff;
	border-color:#004063;
}

.sec-cta {
    background-color: #F39E12!important;
    color: #ffffff!important;
	border-color:#F39E12!important;
}

.pri-cta:hover {
    background-color: #003552;
    color: #fff;
}

.sec-cta:hover {
    background-color: #E9940C!important;
    color: #fff!important;
}

.button-icon {
    width: 15px;
    height: 15px;
	fill:currentColor;
	display: flex;
}

.vacature-btn-wrap {
    padding-top: 2rem;
    place-self: flex-end;
    color: #F39E12;
    font-size: 26px;
    font-weight: 600;
}

.vacature-btn{
	display:flex;
	gap:15px;
	transition: all .3s ease-in-out;
}

.vacature-btn img{
	transition: all .3s ease-in-out;
}

.vacature-btn:hover{
	color:#004063;
}

.vacature-btn:hover img{
	transform:rotate(-45deg);
}

/* Embed code */
.embed-container { 
    position: relative; 
    overflow: hidden;
    padding-top: 56.25%; /* voor 16:9 verhouding */
    height: 100%;
    width: 100%;
} 

.embed-container iframe,
.embed-container object,
.embed-container embed { 
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Grid */
.bm-grid-items-container {
	display: grid;
	gap: 30px;
	width:100%;
}

.bm-grid-items-ctn h3 {
    color: #004063;
    font-size: 20px;
	padding-bottom:1rem;
}

.bm-grid-items-ctn p {
    font-size: 18px;
}

.bm-grid-items-content {
    padding: 90px 50px 50px;
    border-radius: 50px;
    position: relative;
}

img.bm-grid-items-img {
    position: absolute;
    top: -35px;
    right: 190px;
}

/* Tekst */
/* Standaard styling voor de tekstcontainer */
.bm-t-container {
    /* Andere stijlen die je mogelijk al hebt ingesteld. */
	color:#004063;
	width:100%;
}

.bm-t-container h2{
	margin-top:0;
}

/* Als centreren is ingeschakeld */
.bm-t-center {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
	justify-items:center;
}

.bm-t-center .d-t-wrap > p{
	max-width:900px;
}

.d-t-wrap h2{
	font-size:30px;
}

/* Stijlen om de knoppen te centreren wanneer tekst gecentreerd is */
.bm-t-center .cta-container {
    text-align: center; /* dit is om de knoppen te centreren */
	justify-content:center;
}

/* Als rechts tekst is ingeschakeld */
.bm-t-right .d-t-text-wrap {
    max-width: 953px;
}

.bm-t-container.bm-t-right {
    align-self: self-end;

    color: #004063;

	justify-items:flex-end;
}

.bm-t-container.bm-t-right p{
	    font-size: clamp(25px, calc(1.5625rem + ((1vw - 5.12px) * 0.8523)), 37px) !important;
	    line-height: 150%;
    font-weight: 300;
	max-width:revert;
}

/* Tekst met media */
.s-t-img{
	border-radius:50px;
	
}

.s-t-img p{
	font-size:18px;
}

.t-extra-grid {
	padding-top:45px;
    display: grid;
    width: 100%;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.t-extra-grid h3{
	font-size:22px;
	color:#004063;
}

.t-extra-grid p{
	font-size:16px;
}

/* Basisopmaak voor de container */
.brxe-container.c-t-img {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    grid-column-gap: 30px;
    grid-row-gap: 30px;
	align-items: center;
}

/* Standaard opmaak voor afbeeldingen */
.dr-t-img img.t-img {
    width: 100%;
}

/* Als huisstijl is ingeschakeld */
.dr-t-img img.t-img.tidesign {
    width: 100%;
    height: 440px;
    object-fit: cover;
}

/* Standaard order voor kinderelementen */
.brxe-container.c-t-img .dl-t-img {
    order: 0;
}
.brxe-container.c-t-img .dr-t-img {
    order: 1;
}

/* Wanneer de volgorde is veranderd */
.brxe-container.c-t-img.t-img-order .dl-t-img {
    order: 1;
}
.brxe-container.c-t-img.t-img-order .dr-t-img {
    order: 1;
}

/*andere styling voor mobiel*/
@media screen and (max-width: 992px) { /* Pas deze breakpoint aan indien nodig */
    .mobile-order {
        display: flex;
        flex-direction: column;
    }

    .mobile-order .<?php echo $text_class; ?> {
        order: 2;
    }

    .mobile-order .<?php echo $base_class; ?> {
        order: 1;
    }
		.bm-grid-items-ctn > *:nth-child(2){
		text-align: center;
	}

}

/*Wanneer fullscreen is ingeschakeld*/
.t-m-section-full {
    padding: 0rem!important;
	height:90vh;
}

.t-m-fullscreen {
    width: 100%!important;
	padding: 0rem!important;
	height:100%;
}

.t-m-fullscreen .t-img-text {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
}

.t-m-fullscreen .t-m-fullscreen-center {
    max-width: 500px;
}

.t-m-fullscreen .bm-media{
	height:100%;
	min-height:100%;
}

.t-m-fullscreen .iframe-img-bm-media {
    min-width: 100%;
	min-height:100%;
}



.bm-media{
	height: 100%;
	border-radius: 25px;
	display:flex;
}

/* Zoekresultaten */
.bm-search-results {
    margin: 20px 0;
    padding: 0;
}

.bm-search-result {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 30px;
    border-bottom: 1px solid #e5e5e5;
    padding-bottom: 20px;
}

.bm-search-result-image {
    flex: 1 1 100px;
    margin-right: 20px;
}

.bm-search-result-image img {
    max-width: 100%;
    height: auto;
}

.bm-search-result-content {
    flex: 1 1 calc(100% - 120px);
}

.bm-search-result-content h3 {
    font-size: 20px;
    margin-top: 0;
    margin-bottom: 10px;
}

.bm-search-excerpt {
    font-size: 14px;
    color: #666;
    margin-bottom: 15px;
}

/* Overzicht */
.c-ovz h2 {
    margin-bottom: 2rem;
}

.cta-container.ovz-cta {
    width: 100%;
    justify-content: center;
}

.bm-ovz-container {
    display: grid;
	width: 100%;
	gap: 30px;
}

.ovz-tt-wrap, .ovz-tekst, .bm-ovz-content, .h-vacatures-titel, .vacature-titel, .vacature-intro, .vacature-meta, .t-img-text, .bt-nieuws-ovz-excerpt, .bm-grid-items-ctn, .client-logos-t-wrap, .team-card__desc, .h-cf-titel, .bt-cf, .d-cf-info-wrap {
    color: #004063;
}

.bm-ovz-img-wrapper .bm-ovz-title h3 {
	font-size: 18px;
}

.bm-ovz-img-wrapper {
    display: block;
    overflow: hidden; /* Voor het geval dat je specifieke styling of extra bescherming tegen overloop wilt toevoegen */
}

.bm-ovz-block:hover .bm-ovz-img {
    transform: scale(1.1); /* Inzoomen met een factor van 1.1 */
}

.bm-ovz-content {
	margin:4rem;
    padding: 3rem 4rem;
	background-color:#fff;
	border-radius:50px;
	position:absolute;
	bottom:0;
}

.bm-ovz-excerpt {
    font-size:18px;
	font-weight:300;
	line-height:150%;
}

.ter-cta {
	font-weight: 700;
	font-style: italic;
	color: var(--bricks-color-suagdr);
    display: inline-block;
    margin-top: 5px; /* wat ruimte tussen de titel en de knop */
}

.bm-ovz-block:hover .ter-cta {
    color: #ff0000;
}

.bm-ovz-block {
    border-radius: 50px;
    overflow: hidden;
	background-color: #cccccc;
	height:575px;
	position:relative;
}


.bm-ovz-content span {
    position: absolute;
	bottom:0;
    right: 0;
}

.bm-ovz-title {
	font-size: 26px;
}

.bm-ovz-container {
    margin-bottom: clamp(3rem, calc(3rem + ((1vw - 0.48rem) * 2.5)), 5rem);
}

.cta-container.ovz-cta-c {
    width: 100%;
    justify-content: center;
}

.ovz-tekst {
    width: 100%;
    max-width: 580px;
}

.ovz-tekst-wrap {
    display: flex;
    align-items: flex-start;
    width: 100%;
    justify-content: space-between;
	margin-bottom:5rem;
}

.ovz-tt-wrap h2 {
    margin-top: 0;
}

/*Slider*/
ul#custom-slider-list {
    max-height: 500px;
}

img.slider-img {
    height: 100%;
    width: 100%;
    object-fit: cover;
	border-radius:50px;
}

/*slider knoppen*/
.verhalen-arrow{
  bottom:55px;
  right:60px;
}

.custom-arrows {
  display: flex;
  justify-content: center;
  gap: 12px; /* ruimte tussen de twee knoppen */
  margin-top: 20px; /* afstand tot de slider */
  position: absolute;
  bottom: 30px;
  right: 65px;
}

.custom-arrows button {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.splide__arrow--next {
    right: 0rem!important;
}


/*Vacature ovz*/
.vacature-overzicht {
    width: 100%;
	padding-top:30px;
}

.vacature-lijst {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.vacature-card {
    background-color: #FBDFB1;
    border-radius: 50px;
    padding:40px 80px;
	position:relative;
}

.vacature-tag {
    background-color: #004063;
    color: #fff;
    border-radius: 50px;
    padding: 5px 20px;
	font-size:17px;
	font-weight:700;
}

.vacature-tags {
    position: absolute;
    right: 35px;
}

.vacature-meta-item {
    display: flex;
	gap:10px;
}

.vacature-intro {
    padding-top: 1rem;
	line-height:150%;
}

.vacature-meta {
    display: flex;
    gap: 30px;
    padding-top: 11px;
    padding-bottom: 30px;
}

footer.vacature-footer {
    width: 100%;
    max-width: 220px;
}

/*Geschiedenis*/
.x-content-timeline_line {
    left: 10px !important;
}

.brxe-xcxjfh .brxe-xbmdoi.brxe-xcontenttimeline .x-content-timeline_list[data-x-horizontal="true"] .x-content-timeline_item{
	align-items:start;
}

/*Hero 3 USP*/
.usp-list {
    padding: 3rem 10rem;
    display: flex;
    justify-content: space-between;
	align-items:center;
}

.usp-list p {
    margin: 0;
    display: flex;
    gap: 15px;
    align-items: center;
}

/*Klanten slider*/
.client-logos-widget{
	width:100%;
}

.client-logo-wrap{
    height: 170px;
    align-content: center;
    width: 100%;
    text-align: center;
	padding:1rem;
}

.client-logo-wrap img{
	width:100%;
  height:100%;
  object-fit:contain;
}

.cl-prev, .cl-next {
    background-color: transparent;
}

.client-logos-bar {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding-bottom:60px;
}

.client-logos-t-wrap {
    width: 100%;
    max-width: 295px;
}

/*Hero 3 scroll*/
.img-hero-3-arrow {
    position: absolute;
    bottom: -20px;
    left: calc(50% - 20px); /* voor het centreren */
    transform: rotate(90deg);
}

/*Media*/
@media screen and (max-width: 992px) {
	div#custom-slider {
		padding: 2rem 0;
	}
	
	ul#custom-slider-list{
		max-height: 360px !important;
		gap:revert;
	}
	
    .iframe-img-bm-media-groot, .iframe-img-bm-media {
        max-height: 300px;
        width: 100%;
		height:100%;
    }
	.ovz-tekst-wrap{
		flex-direction:column;
	}
	
	.bm-ovz-block{
		height:375px;
	}
	
	.vacature-meta{
		flex-direction:column;
		gap:0;
	}
	
	.vacature-tags{
		position:revert;
		right:revert;
	}
	
	.vacature-titel{
		padding-top:2rem;
		font-size:25px;
		overflow-wrap: break-word;
	}
	
	.vacature-card{
		padding:3rem 3rem;
	}
	
	.bm-ovz-container{
		display:flex;
		flex-direction:column;
	}
	.bm-ovz-content{
		margin:2rem;
		padding:2rem;
	}
	.d-t-text-wrap{
		flex-direction:column;
		gap:30px!important;
	}
	.bm-grid-items-container{
		display:flex;
		flex-direction:column;
		gap:50px;
	}
	.bm-grid-items-content{
		padding:3rem 3rem;
	}
	img.bm-grid-items-img{
		right:38%;
	}
	.client-logos-bar{
		flex-direction:column;
		padding-bottom:30px!important;
		align-items:flex-start!important;
	}
	.ly-spec-row {
    	flex-direction:column;
		gap: 30px!important;
		width: 100%;
	}
	.custom-arrows {
		bottom: -30px!important;
		left: 43px;
		right:revert!important;
	}
	.bm-t-container.bm-t-right{
		font-size:25px;
	}
	.ly-slide-inner{
		padding:3rem!important;
		margin-left:0!important;
	}
	.fullscreen-slider{
		bottom:4rem!important;
		left:6rem!important;
	}
	.post-tags-label{
		flex-wrap:wrap;
		gap:15px!important;
	}
	.ly-fullscreen-slider-wrap .ly-slide {
		height: 80vh !important;
	}
	.usp-list {
		padding: 3rem 3rem!important;
		align-items: flex-start!important;
		flex-direction: column!important;
	}
	.d-vacature-a-grid.brxe-div, .d-vacature-a-item-info-wrap.brxe-div{
		display:flex!important;
		flex-direction:column;
	}
	.d-vacature-a-item.brxe-div{
		padding:8rem 3rem 5rem 3rem!important;
	}
	.verhalen-arrow {
		bottom: 30px!important;
		right: 65px!important;
		left:revert!important;
	}
	.d-verhalen-titel-wrap.brxe-div{
		padding-bottom:6rem!important;
	}
	.verhalen-slide__content{
		padding:3rem!important;
	}
	.d-vacature-a-t-wrap.brxe-div{
		flex-direction:column!important;
	}
	.t-extra-grid{
		padding-top:2rem;
		gap:1.5rem;
	}
}

.ly-spec-row {
	width: 100%;
}

@media (max-width: 400px) {
    #brxe-hcpxak > .x-splide__arrows .splide__arrow--prev {
        margin-left: 190px!important;
    }
}

.s-tekst, .s-teksten-imgs, #brx-content > section.brxe-section.s-ovz.gr-top.m-bottom{
  background-color:white
}


.s-tekst, .s-teksten-imgs, #brx-content > section.brxe-section.s-ovz.gr-top.m-bottom{
  background-color:white
}


/* figma changes */
/* text-media */

.s-t-img p{
  max-width: 500px
}

.s-t-img h2{
  max-width: 430px;
  font-weight: 900;
  font-size: clamp(3rem, calc(3rem + ((1vw - 0.32rem) * 0.6818)), 3.6rem);
}

.c-t-img{
  grid-column-gap: 125px;
}

/* ovz */
.ovz-tt-wrap h2{
  font-weight:900;
}

.ovz-tekst{
  color:black;
  font-weight:300;
}

/* vacature blok */
.h-vacatures-titel{
  font-weight:900;
}

/* LinkedIn blok */

.h-nieuws-ovz-titel{
  font-weight:900;
  padding-bottom: 45px;
}

.bt-nieuws-ovz-excerpt{
  font-weight: 300
}

.bt-nieuws-ovz-lees-meer{
  padding-top: 8px
}

/*Contact*/

.ff-cf-donker .ff-el-form-control {
    color: #000 !important;
}

.ff-el-form-control {
    color: #fff !important;
}

.ff-default .ff-el-form-control:focus {
    color: #fff;
}

/* Hero 2 */
.img-hero-2-1 iframe, .img-hero-2-2 iframe {
    height: 400px;
    border-radius: 50px;
}

/* kernwaarden blok */
img.bm-grid-items-img{
  right:0;
  left: 0;
  margin: auto; /* centreren */
}

/* Fusie blok */
.brxe-container.c-t-img{
  grid-column-gap: 60px;
}


.ff-default.ff-el-form-control{
  color: red !important;
}

.bm-t-small .d-t-wrap > p{
  font-size: 20px;
  max-width: 700px
}

#brxe-nvzhbx > h2{
  text-align: center;
  font-weight: 900;
}

.bt-h-hero-1 > h1 {
  max-width: 700px !important  
}

.d-hero-1-wrap{
    display: flex;
    align-items: flex-start;
    justify-content: center;
    width: 100%;
}

.bt-h-hero-1 > h1 {
  max-width: 700px !important  
}

.d-hero-1-wrap{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
}

#brxe-btzxch{
  border-top-right-radius:25px;
  border-top-left-radius: 25px;
  position: relative;
  z-index: 10;
}

.d-t-wrap{
	display: flex;
    flex-direction: column;
}

#brx-content > section.brxe-section.s-t-img.gr-top.gr-bottom{
/*   border-radius: 0px; /*dit moet nog gefixed worden, hoeken worden transparant als ze afgerond zijn*/ */
}


.img-hero-2-2 video {
    height: 400px;
    border-radius: 50px;
}

.c-machines{
width: 80vw !important
}

a.machine-link {
    position: relative;
    height: 100%;
    display: block;
}

/* uploadveld */
span.ff_upload_btn.ff-btn {
    border-color: #fff !important;
    color: #fff !important;
}

/* Team kaart contact */
 .team-card__email, .team-card__telnr{
   display: flex;
   flex-direction: row;
   gap: 8px;
   align-items: center;
   padding-top:2px;
   
   &>i{
     scale: 0.75;
     margin-left:-3px
   }
		 
}


/* SociableKit Linkedin Feed */
.sk-ww-linkedin-page-post {
    width: 100%;
}

.sk-posts-masonry img.emoji {
    width: 1em !important;
    height: 1em !important;
    display: inline !important;
}

#brxe-bkrrmw > div.sk-ww-linkedin-page-post > div.sk-posts-header,
#brxe-bkrrmw > div.sk-ww-linkedin-page-post > div.sk-posts-footer,
#brxe-bkrrmw > div.sk-ww-linkedin-page-post > div.sk_branding,
#brxe-bkrrmw > div.sk-ww-linkedin-page-post > div.sk_branding > a
{
  display:none !important;
  color:white !important;
}

#brxe-bkrrmw > div.sk-ww-linkedin-page-post > div.sk-posts-body > div{
	width:100%;
  max-width: 1280px;
}
  
 .team-card__email, .team-card__telnr{
   display: flex;
   flex-direction: row;
   gap: 8px;
   align-items: center;
   padding-top:2px;
   
   &>i{
     scale: 0.75;
     margin-left:-3px
   }
   
}

body .sk-ww-linkedin-page-post .sk-post-media.--video{
	height:190px!important;
	margin-top:0!important;
}

body .sk-scrollhover{
	scrollbar-gutter:revert!important;
}


/* Forceer 4 kolommen masonry via CSS columns */
.sk-posts-masonry {
  height: auto !important;           /* negeer inline height */
  column-count: 4 !important;        /* 4 kolommen */
  column-gap: 24px !important;       /* ruimte tussen kolommen */
}

/* Items kolomvriendelijk maken */
.sk-posts-masonry .sk-post-item {
  position: static !important;       /* weg met absolute posities */
  left: auto !important;
  top: auto !important;
  width: 100% !important;
  height:550px;
  display: inline-block !important;  /* nodig voor column-flow */
  break-inside: avoid !important;    /* voorkom breken in kolom */
  margin: 0 0 24px !important;       /* verticale spacing */
  opacity: 1 !important;             /* voor de zekerheid */
  background-color: #f1f2f3 !important;
  border-radius:50px !important;
  box-shadow:none !important;
  padding: 0 !important;
  &>:nth-child(1), &>:nth-child(2)>:nth-child(1)>:nth-child(1){
    padding:20px;
  }
  
  
  

  
}

/* Optioneel: responsive fallback (pas aan naar wens) */
@media (max-width: 1200px) {
  .sk-posts-masonry { column-count: 3 !important; }
}
@media (max-width: 900px) {
  .sk-posts-masonry { column-count: 2 !important; }
}
@media (max-width: 600px) {
  .sk-posts-masonry { column-count: 1 !important; }
}

/* Iframe/media netjes laten schalen in kolommen */
.sk-posts-masonry .sk-post-media,
.sk-posts-masonry iframe,
.sk-posts-masonry img {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
 
}

.sk-posts-masonry .sk-post-media.--image > *:not(:first-child) {
  display: none !important;
}
/* Verberg standaard alles */
.sk-posts-masonry .sk-post-item {
  display: none !important;
}

/* Toon alleen de laatste 4 */
.sk-posts-masonry .sk-post-item:nth-child(-n+4) {
  display: block !important;
}

.sk-post-body-full{
  display: -webkit-box;
  max-width: 300px;         /* breedte in pixels */
  -webkit-line-clamp: 5;    /* aantal regels */
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.sk-post-footer{
  display:none !important;
}

/* Beperk de body-tekst tot bv. 7 regels (pas aan naar wens) */
.sk-posts-masonry .sk-post-body-full {
  display: -webkit-box !important;
  -webkit-line-clamp: 5;          /* aantal regels */
  -webkit-box-orient: vertical;
  overflow: hidden !important;
}

/* Consistente typografie helpt dat de clamp voorspelbaar is */
.sk-posts-masonry .sk-post-body-full,
.sk-posts-masonry .sk-post-body-full p {
  line-height: 1.6 !important;
}

.sk-post-username{
  color: #004063 !important;
  font-size:16px;
}

.sk-post-item {
    overflow: hidden;
	height: 466px !important;
}
.sk-post-image-wrapper.--single {
    height: 400px;
    object-fit: cover;
}

.sk-post-body-full {
    font-family: "Noto sans";
    font-size: 14px !important;
}

/* Grid met afbeeldingen */
img.image.bricks-lazy-load-isotope.bricks-layout-inner.css-filter {
    border-radius: 50px;
}