body.active-popup{
	overflow: hidden;
}

.layout_1,
.layout_3,
.layout_4{
	display: block;
	grid-row-gap: 20px;
}
.popup-modal__content.layout_3.video-media div.popup__content--container.video-media{
	max-height: 360px;
}
.popup-modal__content.layout_3.video-media,
.popup-modal__content.layout_4.video-media{
	margin: 10% auto;
	align-items: center;
}
.popup-modal__content.layout_4.video-media div.popup__content--container.video-media{
	max-height: 360px;
	overflow-y: scroll;
	padding: 0 30px;
}
.popup-modal__content.layout_1.image-media
.popup-modal__content.layout_4.video-media{
	grid-template-columns: 1fr 1fr;
	max-height: initial;
	align-items: center;
	grid-column-gap: 40px;
}

.popup-modal__content.layout_3{
	grid-template-columns: 1fr 2fr;
	grid-column-gap: 40px;
	display: grid;
}
.popup-modal__content.layout_5{
	display: grid;
	grid-row-gap: 30px;
}
.layout_5 div.popup__content--container{
	grid-row: 1;
}
.popup-modal__content.layout_4.image-media div.popup-modal__media{
	grid-column: 2;
}

.popup-modal__content.layout_4.image-media{
	grid-template-columns: 4fr 1fr;
	grid-column-gap: 40px;
	grid-auto-flow: dense;
	display: grid;
}
.popup__content--container {
	overflow-x: hidden;
}
.popup-modal-editor {
	padding: 10px;
	color: #fff;
	background-color: #425b76;
	position: relative;
	z-index: 3;
	text-align: center;
}
.popup-modal__media img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}
.popup-modal {    
	z-index: 999; 
}  

.popup-modal form {
	padding: 0;
}

.popup-modal {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;
	visibility: hidden;
	transition: opacity ease-in-out 0.3s;
	padding: 0;
}

.popup-modal.active {
	opacity: 1;
	visibility: visible;
}
.popup-modal .btn-close {
	position: absolute;
	width: 35px;
	cursor: pointer;
	z-index: 20;
}
.popup-open{
	overflow: hidden;
}
.popup-modal{
	overflow: hidden auto;
	z-index: 999; 
}
.popup-modal__content {
	transition: all ease-in-out 0.4s;
	max-width: 92%;
	overflow: auto;
	position: fixed;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	max-height: 85vh;
	margin: 0;
	max-width: 1236px;
	width: 92%;
	opacity: 0;
}
.popup-modal__content.layout_1{
	width: 92%;
}
.popup-modal__content.layout_1.video-media div.popup-modal__media,
.popup-modal__content.layout_1.image-media div.popup-modal__media img{
	margin-bottom: 20px;
}
.popup-modal__content.layout_3,
.popup-modal__content.layout_4{
	max-width: 1030px;
}
.active .popup-modal__content {
	opacity: 1;
}

.popup__content--text{
	border: none; 
}

{# --- start large screen breakpoint--- #}
@media screen and (min-width: 992px){
	.popup-modal__content.layout_3.video-media {
		grid-template-columns: 59% 1fr;
		align-content: center;
		align-items: center;
	}

	.popup-modal__content.layout_3.video-media div.popup__content--container.video-media{
		overflow-y: auto;
	}
}
{# --- Small screen breakpoint  --- #}
@media screen and (max-width: 1200px) {
	.popup-modal__content{
		max-width: calc(95% - 40px); 
	}
	.popup-modal__content.layout_4 .video-media {
		max-height: 498px;
		overflow-y: scroll;
	}
}
.popup-modal__content.layout_4.video-media div.popup-modal__media{
	grid-column: 2;
}
.popup-modal__content.layout_4.video-media div.popup__content--container.video-media{
	grid-column: 1;
	grid-row: 1;
}
.popup-modal__content.layout_4.video-media{
	display: grid;
	grid-template-columns: 1fr 59%;
	align-items: center;
}


{# --- Mobile Breakpoint --- #}
@media screen and (max-width: 768px) {
	.popup-modal__content.layout_4.video-media div.popup__content--container.video-media{
		padding: 0px;
	}
	.popup-modal__content.layout_4.video-media div.popup-modal__media {
		grid-column: initial;
	}
	.popup-modal__content.layout_4.video-media div.popup__content--container.video-media {
		max-height: initial;
		overflow: initial;
	}
	.popup-modal__content.layout_4.video-media {
		grid-template-columns: 1fr 1fr;
		max-height: initial;
		align-items: center;
	}
	.popup-modal__content.layout_4.image-media div.popup-modal__media {
		grid-column: initial;
	}
	.popup-modal__content.layout_4 div.popup__content--container.video-media {
		max-height: initial;
		overflow: initial;
	}
	.popup-modal__content.layout_3.video-media div.popup__content--container.video-media {
		max-height: initial;
	}
	.popup-modal .btn-close {
		width: 28px;
		cursor: pointer;
	}
}