.modal-popup{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0,0,0,0.6);
	display: none;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	z-index: 10;
	margin:0;
}
.modal-popup.is-open{
	display:block;
}
.modal__overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0,0,0,0.6);
	display: flex;
	justify-content: center;
	align-items: center;
  }
.modal-popup .modal-popup-body{
	position:absolute;
	background:#ffffff;
	padding: 20px;
	width: 600px;
	z-index: 10;
}

.login #modal-popup-body-close{
	display:block!important;
	position:absolute;
	right: -10px;
	top: -10px;
	width: 20px;
	height: 20px;
	z-index: 20;
	background: #b21f29;
	cursor: pointer;
	border-radius: 60px;
}
#modal-popup-body-close:hover{
	opacity:0.6;
}
#modal-popup-body-close::before{
	position: absolute;
	left: 9px;
	top: 4px;
	content: ' ';
	height: 12px;
	width: 2px;
	background-color: #ffffff;
	transform: rotate(45deg);
}
#modal-popup-body-close::after{
	position: absolute;
	left: 9px;
	top: 4px;
	content: ' ';
	height: 12px;
	width: 2px;
	background-color: #ffffff;
	transform: rotate(-45deg);
}

.modal-popup-body h2{
	font-size: 18px;
	font-weight: 700;
	font-style: normal;
	letter-spacing: normal;
	line-height: normal;
	text-align: center;
	text-transform: uppercase;
	margin-bottom:20px;
}

@keyframes mmfadeIn {
    from { opacity: 0; }
      to { opacity: 1; }
}

@keyframes mmfadeOut {
    from { opacity: 1; }
      to { opacity: 0; }
}

@keyframes mmslideIn {
  from { transform: translateY(15%); }
    to { transform: translateY(0); }
}

@keyframes mmslideOut {
    from { transform: translateY(0); }
    to { transform: translateY(-10%); }
}

.modal-popup {
  display: none;
}

.modal-popup.is-open {
  display: block;
}

.modal-popup[aria-hidden="false"] .modal__overlay {
  animation: mmfadeIn .3s cubic-bezier(0.0, 0.0, 0.2, 1);
}

.modal-popup[aria-hidden="false"] .modal__container {
  animation: mmslideIn .3s cubic-bezier(0, 0, .2, 1);
}

.modal-popup[aria-hidden="true"] .modal__overlay {
  animation: mmfadeOut .3s cubic-bezier(0.0, 0.0, 0.2, 1);
}

.modal-popup[aria-hidden="true"] .modal__container {
  animation: mmslideOut .3s cubic-bezier(0, 0, .2, 1);
}

.modal-popup .modal__container,
.modal-popup .modal__overlay {
  will-change: transform;
}
