.vanilla-api-error-modal-width {
  width: 100%
}

@media (min-width: 1026px) {
  .vanilla-api-error-modal {
    padding-top: 165px;
    overflow-y: auto;
  }

  .vanilla-api-error-modal-width {
    width: 730px;
    margin: 0 auto;
  }

  vanilla-api-error-modal::-webkit-scrollbar {
    width: 0;
  }
}

#vanilla-api-error-modal-content {
  max-height: 105vh;
  overflow-y: auto;
  position: fixed;
  top: 0;
  width: 100%;
  background-color: #fefefe;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  -webkit-animation-name: animatetop;
  -webkit-animation-duration: 0.4s;
  animation-name: animatetop;
  animation-duration: 0.4s;
}

@media (min-width: 1026px) {
  #vanilla-api-error-modal-content {
    max-height: none;
    overflow: hidden;
    position: relative;
    top: 0;
    background-color: #fefefe;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    -webkit-animation-name: animatetop;
    -webkit-animation-duration: 0.4s;
    animation-name: animatetop;
    animation-duration: 0.4s;
  }
}

@keyframes animatetop {
  from {
    top: -300px;
    opacity: 0
  }

  to {
    top: 0;
    opacity: 1
  }
}