/*midtile sideby start*/
.midtile-sideby{
	position: relative;
	display: flex;
	padding: var(--side-padding);
	padding-top: 100px;
	padding-bottom: 100px;
}

.midtile-sideby--reverse .midtile-sideby__wrapper{
	flex-direction: row-reverse;
}

.midtile-sideby__accent{
	position: absolute;
	width: 50%;
	top: -100px;
	z-index: -1;
	left: 0px;
	top: 65px;
}

.midtile-sideby__accent-img{
	width: 100%;
}

.midtile-sideby__wrapper{
	display: flex;
	background-color: var(--charcoal);
	border-radius: var(--tile-radius);
}

.midtile-sideby__content{
	width: 50%;
	padding: 30px;
	background-color: var(--charcoal);
	border-radius: 20px 0px 0px 20px;
	justify-content: center;
	display: flex;
	flex-direction: column;
	vertical-align: center;
}

.midtile-sideby--reverse .midtile-sideby__content{
	border-radius: 0px 20px 20px 0px;
}

.light-tile .midtile-sideby__content{
	background-color: var(--off-white);
}

.midtile-sideby__media{
	display: flex;
	width: 50%;
	border-radius: 0px 20px 20px 0px;
	overflow: hidden;
	height: 100%;
}

.midtile-sideby__media img{
	display: flex;
	object-fit: cover;
	object-position: center;
	border-radius: 0;
	width: 100%;
	height: 100%;
	aspect-ratio: 1;
}

.midtile-sideby--reverse .midtile-sideby__media{
	border-radius: 20px 0px 0px 20px;
}

.midtile-sideby--reverse .midtile-sideby__media{
	border-radius: 20px 0px 0px 20px;
}

.midtile-sideby__media video{
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	aspect-ratio: 1;
}

@media(width > 1920px){
	.midtile-sideby{
		padding-inline: 0;
	}
	
	.midtile-sideby__wrapper{
		max-width: 1650px;
		margin-inline: auto;
	}
}

@media(max-width: 1050px){
	.midtile-sideby{
		padding-block: 50px;
	}
	
	.midtile-sideby__accent{
		top: 3%;
		left: 0;
		width: 75%;
	}
	
	.midtile-sideby__wrapper{
		flex-direction: column-reverse; 
		overflow: hidden;
	}
	
	.midtile-sideby__content{
		width: 100%;
	}
	
	.midtile-sideby__media{
		width: 100%;
		border-radius: 0;
	}
	
	.midtile-sideby__media video{
		aspect-ratio: 2;
	}
	
	.midtile-sideby__media img{
		aspect-ratio: 2;
	}
	
	.midtile-sideby--reverse .midtile-sideby__wrapper{
		flex-direction: column-reverse;
	}
	
	.midtile-sideby--reverse .midtile-sideby__media{
		border-radius: 0;
	}
}
@media(max-width: 768px){
	.midtile-sideby{
		padding: 0;
	}
	
	.midtile-sideby__wrapper{
		border-radius: 0;
	}
	
	.midtile-sideby__content{
		padding: var(--side-padding);
		padding-block: 50px;
	}
}


/*midtile sideby end*/