@media screen and (max-width: 1150px) {
  .img-overlay {
    left: 10%;
  }
  .cost-block-calc select {
    width: 8em;
    font-size: 0.9em;
  }
}

@media screen and (max-width: 1000px) {
  .box {
    font-size: 2em;
  }
  .img-overlay {
    left: 7%;
  }
}

@media screen and (max-width: 888px) {
  .gallery-image-gallery {
    --galleryWidth: 45vw;
  }
  .img-overlay {
    left: 7%;
  }
  .btn-responsive {
    max-width: min-content;
  }
  .gallery-block {
    font-size: 1.5em;
  }
}

@media screen and (max-width: 768px) {
  .gradient-border-cost-calc {
    font-size: 1.3em;
  }
  .navbar ul.nav li {
    text-align: center;
  }
  .navbar ul.nav li button {
    margin: 1em 0;
  }
  .jumbotron {
    font-size: 14px;
    padding: 6em 0 4em;
  }
  .benefit {
    margin-bottom: 2em;
  }
  /* matches 'btn-xs' */
  .btn-responsive {
    padding: 6px 11px;
    font-size: 18px;
    line-height: 1.5;
    border-radius: 7px;
    max-width: min-content;
    -webkit-animation: glow-responsive 2s linear infinite;
          animation: glow-responsive 2s linear infinite;
  }
  @-webkit-keyframes glow-responsive {
    0% {
      /* box-shadow: 0 0 0 0 #DD58D6; */
      padding: 6px 11px;
      margin: 0px 0px;
    }
    50% {
      /* box-shadow: 0 0 40px 0 #DD58D6; */
      padding: 12px 22px;
      margin: -6px -11px;
    }
  }
  
  @keyframes glow-responsive {
    0% {
      /* box-shadow: 0 0 0 0 #DD58D6; */
      padding: 6px 11px;
      margin: 0px 0px;
    }
    50% {
      /* box-shadow: 0 0 40px 0 #DD58D6; */
      padding: 12px 22px;
      margin: -6px -11px;
    }
  }
  .footer-banner-left {
    font-size: 12px;
  }
  .footer-banner-right {
    font-size: 12px;
  }
  .our-arenas {
    font-size: 1em;
  }
  .image-container img {
    width: 80vw;
  }
  .image-container button {
    width: auto;
  }
  
  .relative-image-box {
    justify-content: center;
    display: grid;
    grid-row-gap: 40px;
  }
  .box {
    font-size: 1.7em;
    max-width: 50vw;
  }
  .price-block {
    flex-direction: column-reverse;
    align-items: center;
  }
  .gallery-block {
    font-size: 1.4em;
  }
  .cost-block-desc {
    width: 90%;
    margin-bottom: 15px;
  }
  .middle {
    margin-top: 20px;
  }
  .cost-block-desc-small {
    text-align: center;
  }
  .cost-block-desc-small p {
    text-align: center;
  }
  .p-lefttocenter {
    text-align: center;
  }
  .gallery-image-gallery {
    --galleryWidth: 40vw;
  }
  .img-overlay {
    left: 7%;
  }
}

@media screen and (max-width: 600px) {
  .box {
    font-size: 1.5em;
  }
  .gallery-image-gallery {
    --galleryWidth: 40vw;
  }
  .img-overlay {
    left: 7%;
  }
  .btn-responsive {
    font-size: 15px;
  }
}

@media screen and (max-width: 500px) {
  body {
    font-size: 12px;
  }
  .jumbotron {
    font-size: 12px;
  }
  footer .pull-right {
    display: none;
  }
  .footer-banner-left {
    display: none;
  }
  .footer-banner-right {
    display: none;
  }
  .our-arenas {
    font-size: 0.8em;
  }
  .box {
    font-size: 1.4em;
  }
  .gallery-image-gallery {
    --galleryWidth: 80vw;
  }
  .img-overlay {
    left: 3%;
  }
  .gallery-block {
    font-size: 1.2em;
  }
  .btn-responsive {
    padding: 4px 9px;
    font-size: 13px;
    line-height: 1.5;
    border-radius: 7px;
    max-width: min-content;
    -webkit-animation: glow-responsive 2s linear infinite;
          animation: glow-responsive 2s linear infinite;
  }
  @-webkit-keyframes glow-responsive {
    0% {
      /* box-shadow: 0 0 0 0 #DD58D6; */
      padding: 4px 9px;
      margin: 0px 0px;
    }
    50% {
      /* box-shadow: 0 0 40px 0 #DD58D6; */
      padding: 8px 18px;
      margin: -4px -9px;
    }
  }
  
  @keyframes glow-responsive {
    0% {
      /* box-shadow: 0 0 0 0 #DD58D6; */
      padding: 4px 9px;
      margin: 0px 0px;
    }
    50% {
      /* box-shadow: 0 0 40px 0 #DD58D6; */
      padding: 8px 18px;
      margin: -4px -9px;
    }
  }
}


@media screen and (max-width: 400px) {
  .img-overlay {
    left: 0%;
  }
  .popup-content h2 {
    font-size: 20px;
  }
}