/**************************\
  Basic Modal Styles
\**************************/

.modal{
    display: none;
	/* position: fixed;
	width: 100%;
    height: 100%;
	max-height: 100vh;
    top: 0;
    right: 0;
    bottom: 0;
	padding: 16px;
    left: 0;
    z-index: 1050;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
    outline: 0; */
}
.modal.is-open {
	display: flex;
	flex-direction: column;
    align-items: center;
    justify-content: center;
}

.modal__overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(80,26,122,0.1);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index:21;
  overflow-y: scroll;
}

/* .modal__overlay {
  position: relative;
  background: rgba(30,36,49,0.3);
  z-index:1;
} */
.modal__container {
  position: relative;
  width:100%;
  background-color: #fff;
  max-width: 520px;
  height: 100%;
  /* max-height: 100vh; */
  /* border-radius: 12px; */
  overflow-y: auto;
  /* margin: 0 24px; */
}

/* .modal__container footer{
    height: 154px;
    background-image: url(../img/Pattern3.svg);
    background-size: 250%;
    background-repeat: no-repeat;
    background-color: #073135;
    background-position: 50% 40%;
} */
.modal__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 24px;
  border-bottom: 1px solid #E4DCEB;
}
.modal .modal__header .h2{
  color:#1f284c;
}
/* .modal__close {
  background: transparent;
  border: 0;
} */
.modal__close:focus-visible  {
  outline:none;
}

/* .modal__header .modal__close:before {
	display:inline-block;
	content: "\2715";
	font-weight:bold;
	padding:12px 15px;
	cursor:pointer;
	color:#198665;
	font-size: 20px;
} */

.modal__content {
	padding: 16px 24px;
	height: 100%;
	max-height: 700px;
	max-height: calc(100vh - 138px);
	overflow-y:scroll;
	line-height: 1.5;
	color: rgba(0,0,0,.8);
  
}
.modal__content .h1{
  margin: 0 0 24px;
}
.modal__footer {
	display:flex;
	justify-content: space-between;
	align-items:center;
	padding: 16px 24px;
	background-color: #fff;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;	
	border-top: 1px solid #E4DCEB;
}



/* Larger than sm 992 */
@media (min-width: 768px) {
	.modal__container {
		width: 720px;
		height: auto;
		border-radius: 15px;
		max-width: none;
	}
	.modal-sm .modal__container {
		width: 453px;
	}
	.modal__header {
	  display: flex;
	  justify-content: space-between;
	  align-items: center;
	  padding: 16px 24px;
	  border-bottom: 1px solid #E4DCEB;
	}
	.modal__content{
		max-height: calc(85vh - 170px);
	}
	.modal__footer {
		padding: 24px;
	}
	/* body.modal-open{
		overflow:hidden;
	} */
	
}
@media (max-width: 767px) {
	body.modal-open{
		height: 100%;
		width: 100%;
		position: fixed;
	}
}

/**************************\
  Demo Animation Style
\**************************/
/* @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%); }
}

.micromodal-slide {
  display: none;
}

.micromodal-slide.is-open {
  display: block;
}

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

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

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

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

.micromodal-slide .modal__container,
.micromodal-slide .modal__overlay {
  will-change: transform;
} */