body {
    width: 100%;
}

html { 
  scroll-padding-top: 125px; 
}

hr {
  border: none;
  height: 2px;
  color: #979797;
  background-color: #979797;
  opacity: 0.5;
 }


.carousel-inner {
    height: 0;
    padding-bottom: 50%; /* this sets carousel aspect ratio (4:1 here) */
  }
  
  .carousel-item {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
  }
  
  .carousel-item img {
    height: 100%; /* Bootstrap handles width already */
    object-fit: cover; /* or 'contain' if you want stretch instead of crop */
  }