
/* --------------------------------- ModalWindow --------------------------------- */

.ui-modalWindow-Hide {
    position: fixed; /* Sit on top of the page content */
	
    display: flex;
	align-items: center;
	justify-content: center;
	flex-grow: 1;
	
    width: 0;	/* Hidden by default */
    height: 0;	/* Hidden by default */
    top: 0; 
    left: 0;

    background-color: rgba(255,255,255,0.97); 

    z-index: 31;   
    overflow: hidden;
 } 
.ui-modalWindow-Visible {
    width: 100%; /* Full width (cover the whole page) */
    height: 100%; /* Full height (cover the whole page) */  
	overflow: auto;
}
.ui-modalWindow-Content-Visible {
	width: 100%; /* Full width (cover the whole page) */
	
	padding-top: 50px;    /*interval for box-shadow*/
	padding-bottom: 50px;	/*interval for box-shadow*/
	
	position: relative;
	overflow: auto;
 }


/* --------------------------------- ModalWindow Full Page --------------------------------- */


.ui-modalWindow-fullPage-Hide {
    position: fixed;
    width: 0;	/* Hidden by default */
    height: 0;	/* Hidden by default */
    top: 0; 
    left: 0;
    z-index: 31;  
    overflow: hidden;
 }
.ui-modalWindow-fullPage-Visible {
    width: 100%; /* Full width (cover the whole page) */
    height: 100%; /* Full height (cover the whole page) */  
	overflow-y: auto;
}

.modalWindow-fullPage-Blue {
	background-image: url(images/Hero_Images.jpg);
	background-repeat: no-repeat;
	background-position: 30% bottom;
	background-size: cover;
}
.modalWindow-fullPage-White {
	background-color: rgba(255,255,255,0.99);
/*    -webkit-backdrop-filter: saturate(180%) blur(20px);*/
}

.ui-modalWindow-close-ico {
	position: absolute;
	display: block;
    right: 15px;
    top: 25px;
	width: 20px;
	height: 20px;
	background: url(images/ModalWindow_Close_Ico.svg);
	background-size: contain;
	cursor: pointer;
}
.ui-modalWindow-close-ico-outside {
	position: absolute;
	display: block;
    right: 15px;
    top: -45px;
	width: 20px;
	height: 20px;
	background: url(images/ModalWindow_Close_Ico.svg);
	background-size: contain;
	cursor: pointer;
}

.ui-modalWindow-close-ico-white {
	position: absolute;
	display: block;
    right: 15px;
    top: 25px;
	width: 20px;
	height: 20px;
	background: url(images/ModalWindow_Close_Ico_White.svg);
	background-size: contain;
	cursor: pointer;
}


/* --------------------------------- ModalWindow Animations --------------------------------- */

.ui-modalWindow-animation-ZoomIn {
	-webkit-animation-name: modal-zoomIn;
    -webkit-animation-duration: 0.6s;
    animation-name: zoomIn;
    animation-duration: 0.6s; 
}

@-webkit-keyframes modal-zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

@keyframes modal-zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

.ui-modalWindow-animation-FadeInTop {
    -webkit-animation-name: modal-FadeInTop;
    -webkit-animation-duration: 0.4s;
    animation-name: modal-FadeInTop;
    animation-duration: 0.4s; 
}

@-webkit-keyframes modal-FadeInTop{
    from {top: -300px; opacity: 0} 
    to {top: 0; opacity: 1}
}

@keyframes modal-FadeInTop {
    from {top: -300px; opacity: 0}
    to {top: 0; opacity: 1}
}


