body {
    font-family: "Lato", sans-serif;
  }
  .mySlides {
    display: none;
  }

  .rounded-image {
    width: 60%; /* Adjust the width as needed */
    border-radius: 33px; /* Rounded corner radius */
    margin-bottom: 33px; /* Margin to separate from content below */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Horizontal offset, vertical offset, blur radius, color */
  }

  .zoom-effect {
    transition: transform 0.3s ease; /* Smooth transition for zoom effect */
  }

  .zoom-effect:hover,
  .zoom-effect:focus {
    transform: scale(
      1.2
    ); /* Scale the image to 120% of its original size */
  }

  /* This CSS class adds bottom margin */
  .margin-bottom {
    margin-bottom: 50px; /* Adjust the pixel value to increase or decrease the space */
  }

  /* Style for smaller screens (e.g., tablets and large phones) */
  @media only screen and (max-width: 600px) {
    .w3-half {
      width: 50% !important; /* Forces 50% width */
    }
  }

  /* Existing styles */
  .w3-third {
    width: 25%; /* Default style for larger screens */
  }

  /* Styles for smaller screens */
  @media only screen and (max-width: 600px) {
    .w3-third {
      width: 50% !important; /* Overrides to two columns on smaller screens */
    }
  }

  .w3-long {
        width: 75%;
        /* Default style for larger screens */
        margin-left: auto;
        margin-right: auto;
      
  }