/* Modal base styles */
.modal1-is-active {
  overflow: hidden;
}

.modal1 {
    display: none;
}

.modal1--active {
  visibility: visible;
}
.modal1__window {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  backface-visibility: hidden;
  background: #fff;
  height: auto;
  left: 50%;
  max-height: 100%;
  max-width: 800px;
  min-height: 300px;
  /*opacity: 0;*/
  overflow-y: auto;
  position: fixed;
  top: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  -webkit-transition: all .5s ease;
  -moz-transition: all .5s ease;
  -ms-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
  width: 100%;
  z-index: 1041;
  font-size:13px;
  font-family:sans-serif;
  box-shadow:#000 0 0 7px 0;
}
.modal1__window-lr {width:900px;}
.modal1--active .modal1__window {
  opacity: 1;
}
.modal1__header {
  background: #5a6db9;
  color: #fff;
  padding: 0.7rem;
}
.modal1__title {
  /*font-size: 1rem;*/
  margin:0px;
  padding:0px;
  font-weight:600;
  color: #fff !important;
  font-size:15px;
}
.modal1__close-btn {
  background: transparent;
  cursor: pointer;
  position: absolute;
  right: 10px;
  top: 9px;
  border:0px;
  color:#fff;
  font-size:15px;
  font-weight:600;
  border: none;
  outline:none;
}
.modal1__close-btn:hover {
    border: 0px solid #777a8a;
    color: #b1b1b1;
    background: transparent !important;
    
    -webkit-box-shadow: 0px 2px 2px 0 rgba(0,0,0,0);
    box-shadow: 0px 2px 2px 0 rgba(0,0,0,0);
}
.modal1__close-icon {
  fill: #fff;
  height: 20px;
  width: 20px;
}

.modal1__content {
  padding: 1rem;
}
.modal1__overlay {
  background: #000;
  height: 100%;
  left: 0;
  opacity: 0;
  position: fixed;
  top: 0;
  -webkit-transition: all .5s ease;
  -moz-transition: all .5s ease;
  -ms-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
  width: 100%;
  visibility: hidden;
  z-index: 1000;
}
.modal1--active .modal__overlay {
  opacity: .75;
  visibility: visible;
}

/* Modal transitions */
.modal1--scale-up .modal__window {
  -webkit-transform: translateX(-50%) translateY(-50%) scale(.75);
  -moz-transform: translateX(-50%) translateY(-50%) scale(.75);
  -ms-transform: translateX(-50%) translateY(-50%) scale(.75);
  -o-transform: translateX(-50%) translateY(-50%) scale(.75);
  transform: translateX(-50%) translateY(-50%) scale(.75);
}
.modal1--scale-up.modal--active .modal__window {
  -webkit-transform: translateX(-50%) translateY(-50%) scale(1);
  -moz-transform: translateX(-50%) translateY(-50%) scale(1);
  -ms-transform: translateX(-50%) translateY(-50%) scale(1);
  -o-transform: translateX(-50%) translateY(-50%) scale(1);
  transform: translateX(-50%) translateY(-50%) scale(1);
}
.sml{width:500px; min-width:500px;}
.lrg{width:1000px; min-width:1000px;}
.ex-lrg{width:1200px; min-width:1200px;}


@media (max-width: 980px) {
.ex-lrg{margin: 2% 0 !important; min-width: 95%;}
.lrg{margin: 2% 0 !important; min-width: 95%;}
.sml{margin: 2% 0 !important; min-width: 95%;}
}

@media (max-width: 640px) {
.modal1__window {margin: 2% 0 !important; width: 95%;}
.modal1--scale-up.modal--active .modal__window {
  -webkit-transform: translateX(-50%) translateY(-50%) scale(1);
  -moz-transform: translateX(-50%) translateY(-50%) scale(1);
  -ms-transform: translateX(-50%) translateY(-50%) scale(1);
  -o-transform: translateX(-50%) translateY(-50%) scale(1);
  transform: translateX(-50%) translateY(-50%) scale(1);
}
.ex-lrg{margin: 2% 0 !important; min-width: 95%;}
.lrg{margin: 2% 0 !important; min-width: 95%;}
.sml{margin: 2% 0 !important; min-width: 95%;}
}