.lrblock .flex {
	display: flex;		
}
.lrblock .flex.right{
	flex-direction: column;
}
.flex.container.left .half.angle-custom{
	padding-right: 5%;
}
.flex.container.right .half.angle-custom{
	padding-left: 5%;
}
.flex.container.right .half.bodytext > *{
	margin-right: 80px;
}

.lrblock img.image-inline {
    object-fit: cover;
    width: 100%;
    object-position: 0 50%;
  }    
.lrblock .half {
	box-sizing: border-box;
	width: 100%;
  }
.lrblock .half.image{
	padding: 0;
	margin: 0;
}

.position-relative{position: relative;}
.lrimage-wrapper{
	margin-bottom: 20px;
}
.left .lrimage-wrapper img:first-child{
	left: -5%;
	opacity: 0.7;
	display: none;
}
.left .lrimage-wrapper img:nth-child(2){
	top: 10%;
	left: 5%;
}
.right .lrimage-wrapper img:first-child{
	right: -5%;
	opacity: 0.7;
	display: none;
}
.right .lrimage-wrapper img:nth-child(2){
	top: 10%;
	right: 5%;
}

.half.bodytext  ul {
	padding-left: 1.5em;
}

 
.text-on-image div.half {
	width: 100% ;
	position: relative;
	padding: 0;
	margin: 0;
}
 
div.flex.text-on-image {
	position: relative;
	margin-bottom: 2em;
}


.text-on-image div.half.bodytext {
	z-index: 3;
	top:  2em;
	left: 4em;
	position: absolute;
}

.text-on-image.center .half.bodytext {
	left: 0;
	text-align: center;
}


body div.black hr {
	border-color:  white;
	color: white;
}

 
div.flex.left-right:nth-child(odd){
	flex-direction: row-reverse ;
}

div.flex.left-right:nth-child(even){
	 background: white;
	 padding-top: 3em !important;
	 padding-bottom: 3em !important;
}

.black-background div.flex.left-right:nth-child(odd) .black {
	color:  white !important;
}


@media (min-width: 768px){
	.lrblock .flex {
		padding-left: 0;
		padding-right: 0;	
	}
	.lrblock .half {
		width: 50%;
	}
	.lrblock .flex.right{
		flex-direction: row-reverse;
	}
	.lrimage-wrapper{
		min-height: 485px;
	}
	.right .lrimage-wrapper img:first-child,
	.left .lrimage-wrapper img:first-child{
		display: block;
	}
	.lrimage-wrapper > *{position: absolute;}
	.flex.container.left .half.bodytext > *{
		margin-left: 80px;
	}
}

@media (max-width: 768px) {
	.lrblock .flex {	
		flex-direction: column;
		margin: 0 20px 20px 20px;	
	}
	.mosaic-width-full .lrblock {
		width: 100%; 
		margin-left: 0;
		margin-righ: 0;
	}
	div.half {
		width: 100%; 
		position: static;
		margin: 0;
		padding: 0;
		text-align: center;
		min-width: 100%;
	}
	div.half img[src$='.svg']{
		display: block;
		margin-bottom: 20px;
	}
	.half.bodytext {
		text-align: left !important;
		padding: 0 !important;	
	}
	.flex.padding-0.left .half.bodytext > *{
		margin-left: 0;
	}
	.lrimage-wrapper > *{position: initial;}
	.lrblock .congtainer.flex{
		padding: 15px !important;
	}
}