body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    padding-top: 60px;
  }
  
  main {
    flex-grow: 1;
  }

  .gallery {
    font-size: 50px;
  }
  
  footer {
    background-color: rgb(240, 240, 240);
    padding: 1rem;
  }

  .carousel-inner {
    display: flex;
    align-items: center; /* Vertically align the content */
  }
  
  .carousel-item {
    text-align: center; /* Horizontally align the content */
  }
  
  .carousel-control-prev-icon,
  .carousel-control-next-icon {
    background-color: black;
    width: 100px;
    height: 100px;
  }
  
  .carousel-control-prev,
  .carousel-control-next {
    width: 100px;
    top: calc(50% - 50px);
  }
  
  .carousel-control-prev {
    transform: translateX(-70%);
  }
  
  .carousel-control-next {
    transform: translateX(70%);
  }

  .carousel-indicators {
    position: relative;
    bottom: -15px; /* Adjust this value to move the indicators up or down */
    transform: translateY(50%); /* Use translateY to control the vertical position */
  }

  @media screen and (max-width: 768px) {
    .carousel-indicators {
      position: relative;
      bottom: -15px; /* Adjust this value to move the indicators up or down */
      transform: translateY(150%); /* Use translateY to control the vertical position */
    }

    .carousel-control-prev,
    .carousel-control-next {
      width: 100px;
      top: calc(50% - 50px);
    }
    
    .carousel-control-prev {
      transform: translateX(-40%);
    }
    
    .carousel-control-next {
      transform: translateX(40%);
    }
  }