/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/

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

.k-top{
	padding-top:3rem;
}

.m-top{
	padding-top:6rem;
}

.gr-top{
	padding-top:9rem;
}
/*Onderruimte*/
.ge-bottom{
	padding-bottom:0rem;
}

.k-bottom{
	padding-bottom:3rem;
}

.m-bottom{
	padding-bottom:6rem;
}

.gr-bottom{
	padding-bottom:9rem;
}

/* Afbeelding blok */
.stretchen-img {
    width: 100%;
    height: auto;
}

.hs-img {
    width: 100%;
    height: 500px;
    object-fit: cover;
}

.centreren-img, .centreren-button-container {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.design-img {
/* Eventuele gemeenschappelijke stijlen voor de afbeelding */
}

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

.cta-container {
    display: flex;
    gap: 10px;
}

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

.pri-cta, .sec-cta {
	padding: 12px 36px;
    border-radius: 50px;
	transition: background-color 0.2s, color 0.2s;
}

.pri-cta {
    background-color: #ed642d;
    color: #fff;
	padding: 12px 36px;
    border-radius: 50px;
	font-weight: 500;
}

.sec-cta {
    background-color: #250c77;
    color: #fff;
	padding: 12px 36px;
    border-radius: 50px;	
	target:blank;
	font-weight: 500;
}

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

.sec-cta:hover {
    background-color: #4F20E9;
    color: #fff;
}

.bm-pri-i {
	margin-left: 5px;
}

.bm-sec-i {
	margin-left: 5px;
}

/* 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%;
}

/* Team */
.bm-teamleden-container {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
	grid-column-gap: 60px;
	grid-row-gap: 40px;
}

.bm-teamleden-img{
    height: 370px;
    width:100%;
    outline: none;
    vertical-align: middle;
    object-fit: cover;
    object-position:50% 50%;
	border-radius: 10px;
}
.bm-teamleden-content:nth-child(4) .bm-teamleden-img{
object-position: 31.8511% 49.726%!important;
}

.bm-teamleden-ctn {
    font-size: 16px;
}
.team-titel-container {
    width: 100%;
    display: flex;
    text-align: center;
    justify-content: center;
	margin-bottom:5rem;
	margin-top:5rem;
}
.team-titel{
	max-width:700px;
}
/* Tekst */
/* Standaard styling voor de tekstcontainer */
.bm-t-container {
    /* Andere stijlen die je mogelijk al hebt ingesteld. */
	font-size:18px;
}

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

/* Als smalle tekst is ingeschakeld */
.bm-t-small {
    max-width: 580px;
}

/* 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 */
}

/* Tekst met afbeelding */

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

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

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

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

.dl-t-img {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    height: 100%;
    justify-content: center;
}

/* 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: 0;
}

/* 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: 18px;
    color: #666;
    margin-bottom: 15px;
}

/* Overzicht */

.bm-ovz-container {
    display: grid;
	width: 100%;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    grid-column-gap: 30px;
    grid-row-gap: 30px;
}

.bm-ovz-block {

}

.bm-ovz-title {
    margin: 10px 0; /* wat ruimte tussen de afbeelding en de titel */
}

.ter-cta {
    display: inline-block;
    margin-top: 5px; /* wat ruimte tussen de titel en de knop */
}

.oranje-text{
	color:#ed642d;
}

.blauwe-text{
	color:#250c77;
}

/*Grid oranje*/
.bm-grid-oranje-item {
    background-color: #fff;
    padding: 2rem 2rem;
    width: 100%;
    max-width: 450px;
	display: flex;
	flex-direction: column;
    place-content: space-between;
	border-radius: 10px;
}

.bm-grid-blauw-item {
    background-color: #250C77;
    padding: 2rem 2rem;
    width: 100%;
    max-width: 450px;
	display: flex;
	flex-direction: column;
    place-content: space-between;
	color:#fff!important;
	border-radius: 10px;
}

.bm-grid-lichtblauw-item {
    background-color: #eceaf6;
    padding: 2rem 2rem;
    width: 100%;
    max-width: 450px;
	display: flex;
	flex-direction: column;
    place-content: space-between;
	color:#250c77!important;
	border-radius: 10px;
}

.bm-grid-oranje-wrapper, .bm-grid-blauw-wrapper, .bm-grid-lichtblauw-wrapper {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
    gap: 20px;
}

.bm-grid-oranje-onderwerp, .bm-grid-blauw-onderwerp, .bm-grid-lichtblauw-onderwerp{
	font-size:26px;
	font-weight:500;
	color: #250c77;
}

.bm-grid-blauw-onderwerp{
	color:#fff;
}

.bm-grid-lichtblauw-onderwerp{
	color:#250c77;
}

.bm-grid-oranje-tekst, .bm-grid-blauw-tekst, .bm-grid-lichtblauw-tekst{
	font-size:16px;
	font-weight:300;
	padding-top:0.5rem;
}

.bm-grid-oranje-knop, .bm-grid-blauw-knop, .bm-grid-lichtblauw-knop{
	padding:1rem 2rem;
	margin-top: 2rem;
	background-color:#250C77;
	color:#fff;
	font-size:16px;
	font-weight:500;
	width:100%;
	text-align:center;
	border-radius: 50px;
}

.bm-grid-blauw-knop{
	color:#250c77!important;
	background-color:#fff!important;
}

.bm-grid-oranje-tekstblok, .bm-grid-blauw-tekstblok, .bm-grid-lichtblauw-tekstblok {
    display: flex;
    flex-direction: column;
    align-items: center;
}

/*Blog slider*/
.bt-blog-slider-titel {
    font-size: clamp(3rem, calc(3rem + ((1vw - 0.48rem) * 2.5)), 4.8rem);
    font-weight: 500;
}

div#brxe-nrzuzq-track {
    background-color: #eceaf6;
}

/*Social grid blauw*/
.bm-social-grid-blauw-grid {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
    gap: 20px;
	margin-top:8rem;
}

.bm-social-grid-oranje-grid {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
    gap: 20px;
	margin-top:8rem;
}

.bm-social-grid-wit-grid {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(auto-fill, minmax(460px, 1fr));
    gap: 20px;
	margin-top:8rem;
	justify-items: center;
}

.bm-social-grid-blauw-item, .bm-social-grid-oranje-item {
    width: 400px;
}

.bm-social-grid-wit-item {
    width: 100%;
}

.bm-social-grid-blauw-container{
	width:100%;
}

.bm-social-grid-blauw-titel, .bm-social-grid-oranje-titel, .bm-social-grid-wit-titel {
    font-size: 45px;
    font-weight: 500;
    color: #250c77;
	padding-bottom:2rem;
}

.bm-social-grid-oranje-titel{
	color:#fff;
}

.bm-social-grid-wit-titel{
	color:#000;
}

.bm-social-grid-wit-container {
    width: 100%;
}

.bm-social-grid-oranje-button{
	background-color:#fff;
	color:#000;
}

.bm-social-grid-oranje-button:hover{
	background-color:#F7B9A1;
	color:#000;
}

p a{
	text-decoration:underline;
	color:#ED642E;
	font-weight:600;
}


/*Responsive*/
@media screen and (max-width: 992px){
	/*Team*/
	.bm-teamleden-content {
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	
	/*Cta container*/
	.cta-container {
		flex-direction: column;
	}
	
	/*Grids oranje, blauw, lichtblauw, wit*/
	.bm-grid-oranje-onderwerp, .bm-grid-blauw-onderwerp, .bm-grid-lichtblauw-onderwerp{
		font-size:clamp(2.7rem, calc(2.7rem + ((1vw - 0.48rem) * 2.9167)), 4.8rem);
		max-width:100%;
	}
	
	.bm-grid-oranje-knop, .bm-grid-blauw-knop, .bm-grid-lichtblauw-knop {
		max-width:90%;
	}
	
	.bm-social-grid-blauw-button, .bm-social-grid-oranje-button, .bm-social-grid-wit-button {
		padding: 2rem 2rem;
	}
	
	.bm-social-grid-blauw-item, .bm-social-grid-oranje-item, .bm-social-grid-wit-item {
		width: 100%;
		max-width: 300px;
	}
	.bm-social-grid-wit-grid {
		justify-items: revert;
	}
	
	/*Afbeelding & text*/
	.dl-t-img {
		flex-wrap: nowrap;
		align-items: start;
	}
}

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

.k-top{
	padding-top:3rem;
}

.m-top{
	padding-top:6rem;
}

.gr-top{
	padding-top:9rem;
}
/*Onderruimte*/
.ge-bottom{
	padding-bottom:0rem;
}

.k-bottom{
	padding-bottom:3rem;
}

.m-bottom{
	padding-bottom:6rem;
}

.gr-bottom{
	padding-bottom:9rem;
}

/*overzicht oranje*/
.bm-ovz-block-oranje {
  background-color: rgba(237, 100, 45, 0.45);
  width: 400px;
  height: 500px;
  border-radius: 30px;
  overflow: hidden;
}

.bm-ovz-img-oranje {
    height: 300px;
    width: 400px;
}

.bm-ovz-container-oranje {
    display: grid;
	width: 100%;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    grid-column-gap: 30px;
    grid-row-gap: 30px;
}

.bm-ovz-title-oranje {
  margin: 10px 0;
  margin-left: 20px;
  margin-top: 25px;
  height: 100px;
}

.ter-cta-oranje {
  background-color: #ed642d;
  color: #fff;
  padding: 12px 36px;
  border-radius: 50px;
  font-weight: 500;
  margin-left: 20px;
}