/** TIPS: 
1. The carousel shouldn't be in any other div, like for example div with class container. 
2. You can align image position in classes bg1, bg2, bg3 using css background-position.
*/
/* Carousel 100% Fullscreen */
html,
body {
  height: 100%;
  margin: 0;
  padding: 0;
}
.carousel,
.item,
.active {
  height: 100%;
}
.carousel-inner {
  height: 100%;
}
/* .carousel {
  margin-bottom: 60px;
} */
.carousel-caption {
  z-index: 10;
}
.carousel .item {
  background-color: #777;
}
.carousel .carousel-inner .bg {
  background-repeat: no-repeat;
  background-size: cover;
}
.carousel .carousel-inner .bg1 {
  background-image: url('/assets/img/banner/2.jpeg');
  background-position: center top;
}
.carousel .carousel-inner .bg2 {
  background-image: url('/assets/img/banner/3.jpeg');
  background-position: center center;
}
.carousel .carousel-inner .bg3 {
  background-image: url('/assets/img/banner/4.jpeg');
  background-position: center bottom;
}