.overlay {
  overflow: auto;
  position: fixed;
  top: 0;
  bottom: 110%;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 100;
  opacity: 0;
  background: #4D4D4D;
  transition: opacity 200ms linear, bottom 0s linear 200ms;
}
.overlay-open {
  bottom: 0;
  opacity: 1;
  transition: opacity 200ms linear, bottom 0s linear;
}
.overlay-view {
  overflow: hidden;
}
.overlay-form .overlay-inner {
  background: #FFF;
  margin: 5rem auto;
  padding: 4rem;
  max-width: 700px;
}

.admin-bar .overlay {
  top: 53px;
}

@media screen and (max-width: 782px) {
  .admin-bar .overlay {
    top: 46px;
  }
}
.overlay-trigger {
  transition: all 200ms linear;
}

.overlay-inner {
  border-radius: 4px;
  max-width: 38rem;
  margin: 5rem;
  padding: 2rem 4rem;
  background: #FFF;
}

.wide-overlay-inner{
  border-radius: 4px;
  max-width: 48rem;
  margin: 3rem;
  padding: 2rem 2rem;
  background: #FFF;
}

@media screen and (min-width: 52rem) {
  .wide-overlay-inner {
    margin-left: auto;
    margin-right: auto;
  }
}

@media screen and (min-width: 52rem) {
  .overlay-inner {
    margin-left: auto;
    margin-right: auto;
  }
}
