/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/

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

.modal {font-family: 'circe-regular',helvetica,arial,sans-serif;}
.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;z-index:999999;}
.modal__container { background-color: #fff;padding: 30px 37px;max-width: 350px;max-height: 100vh;border-radius: 4px;overflow-y: auto;-webkit-overflow-scrolling: touch;box-sizing: border-box;position:relative;}
.modal__header {display: flex;justify-content: space-between;align-items: center;}
.modal__title { margin-top: 0;margin-bottom: 0;font-weight: 600;font-size: 1.25rem;line-height: 1.25;color: #00449e;box-sizing: border-box;}
.modal__close {background: transparent;border: 0;position:absolute;top:10px;right:10px;cursor:pointer;}
.modal__header .modal__close:before { content: "\2715"; font-size:25px; color:#808080;}
.modal__header .modal__close:hover:before { content: "\2715"; font-size:25px; color:#2f2f2f;}
.modal__content {margin-top: 0rem;margin-bottom: 0rem;}

@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;
}
