/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel {

}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  bottom: 10rem;
  z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel-item {
  height: 50vh;
  background-color: #376bf5;;
}

.carousel-item > img {
  position: absolute;
  bottom: 0;
  right: 0;
  /* height: 40vh; */
}


/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
  .carousel-item {
    height: 30vh;
  }
  .carousel-caption {
    bottom: 5rem;
  }
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
  .carousel-item {
    height: 65vh;
  }
  .carousel-caption {
    bottom: 8rem;
  }
}