/*!
 * Modals v10.1.2: Simple modal dialogue pop-up windows
 * (c) 2017 Chris Ferdinandi
 * MIT License
 * http://github.com/cferdinandi/modals
 */

/**
 * Modal windows
 */
/* line 4, /Users/cferdinandi/Sites/modals/src/sass/components/_modals.scss */
.modal {
  background-color: #ffffff;
  border: 0.0725em solid #e5e5e5;
  border-radius: 0.0725em;
  box-shadow: 0 0.25em 0.5em rgba(0, 0, 0, 0.3);
  display: none;
  max-width: 100%;
  padding: 0.5em 1em;
  visibility: hidden;
  z-index: 9999;
}

@media (min-width: 40em) {
  /* line 4, /Users/cferdinandi/Sites/modals/src/sass/components/_modals.scss */
  .modal {
    max-width: 98%;
  }
}

/* line 19, /Users/cferdinandi/Sites/modals/src/sass/components/_modals.scss */
.modal.active {
  display: block;
  height: 100%;
  left: 0;
  max-height: 100%;
  overflow: auto;
  position: fixed;
  right: 0;
  top: 0;
  visibility: visible;
  -webkit-overflow-scrolling: touch;
}

@media (min-width: 30em) {
  /* line 19, /Users/cferdinandi/Sites/modals/src/sass/components/_modals.scss */
  .modal.active {
    height: auto;
    left: 3%;
    margin-left: auto;
    margin-right: auto;
    right: 3%;
    top: 50px;
  }
}

@media (min-width: 40em) {
  /* line 19, /Users/cferdinandi/Sites/modals/src/sass/components/_modals.scss */
  .modal.active {
    left: 8%;
    right: 8%;
  }
  /* line 44, /Users/cferdinandi/Sites/modals/src/sass/components/_modals.scss */
  .modal.active.modal-medium {
    width: 35em;
  }
  /* line 48, /Users/cferdinandi/Sites/modals/src/sass/components/_modals.scss */
  .modal.active.modal-small {
    width: 25em;
  }
}

/* line 54, /Users/cferdinandi/Sites/modals/src/sass/components/_modals.scss */
.modal:focus {
  outline: none;
}

/**
 * Modal background
 */
/* line 63, /Users/cferdinandi/Sites/modals/src/sass/components/_modals.scss */
.modal-bg {
  background-color: #272727;
  bottom: 0;
  position: fixed;
  left: 0;
  opacity: .9;
  right: 0;
  top: 0;
  z-index: 9998;
}

/**
 * Close button
 */
/* line 78, /Users/cferdinandi/Sites/modals/src/sass/components/_modals.scss */
.close {
  color: #808080;
  cursor: pointer;
  float: right;
  font-weight: bold;
  font-size: 1.5em;
  text-decoration: none;
}

/* line 86, /Users/cferdinandi/Sites/modals/src/sass/components/_modals.scss */
.close:hover {
  color: #5a5a5a;
  cursor: pointer;
}