  /* Define CSS variables for width and height adjustments */
  .custom-image {
    --custom-width: 70%;
    --custom-height: 140%; /* Increased by 20% (initial height + 20%) */
  }

  .service-container{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 80%; /* Set the container width to 80% */
    margin: 0 auto; /* Center the container horizontally */
  }

  .two-coloumns{
    width: 48%; /* Adjust width as needed */
    padding: 10px;
    border: 1px solid #ccc;
    box-sizing: border-box;
  }


  .navbar{
    z-index: 1; /* Set a higher value than your carousel z-index */
  }

  #animation-carousel {
    z-index: 0; /* Set a lower value than your navbar z-index */
  }

  .carosel-text{
    
  }