.newsletter-popup{
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50% , calc(-50% + 56px));
	width: 900px !important;
	max-width: 90vw !important;
	background-color: #fff !important;
    min-height: 300px;
    z-index: 100 !important;
	flex-wrap: nowrap !important;
	opacity: 0;
	transition: 300ms ease;
	pointer-events: none !important;
}

.newsletter-popup.active{
	opacity: 1;
	transform: translate(-50% , calc(-50% + 0px));
	transition: 300ms ease;
	pointer-events: all !important;
}

.newsletter-popup-form{
    flex-direction: column !important;
	justify-content: center !important;
	gap: 10px !important;
}

.close-newsletter-popup{
	position: absolute;
    top: 16px;
    right: 16px;
    background-color: #000;
    color: #fff;
    padding: 5px 10px;
    cursor: pointer;
	transition: 200ms;
}

.close-newsletter-popup:hover{
	opacity: .7;
	transition: 200ms;
}

@media only screen and (max-width: 767px) and (min-width: 0px){
	.newsletter-popup{
		width: calc(100% - 40px) !important;
		max-width: 500px !important;
		flex-direction: column-reverse !important;
	}

	.newsletter-image figure{
		width: 100% !important;
	}

	.newsletter-image figure img{
		width: 100% !important;
		max-height: 400px !important;
		object-fit: cover !important;
	}
}