.header2 {
      position: relative;
      height: 400px; /* Adjust the height as needed */
      background: url('/dA/44e0a65b22/ICW-Web-Header-Big.png?language_id=1') no-repeat center center; /* Path to your background image */
      background-size: cover;
      transition: background 0.5s ease-in-out; /* Add transition effect */
    }

    .overlay2 {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      background-color: rgba(255, 255, 255, 0.5); /* Optional: Add semi-transparent background to overlay */
    }

    .logo2 {
      width: auto; /* Adjust the size as needed */
      height: 200px;
      filter: drop-shadow(0 0 3px white);
      transition: opacity 0.5s ease-in-out; /* Add transition effect */
    }

    .header2:hover {
      background: white; /* Change to white on hover */
      transition: opacity 0.5s ease-in-out;
    }

    .header2:hover .logo2 {
      opacity: 0; /* Hide original logo */
    }

    .new-logo {
      display: none;
      position: absolute;
      width: auto;
      height: 200px; /* Initial height */
      transform: scale(1), transition:200%; /* Initial scale */
      transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out; /* Add transition effects */
    }

    .header2:hover .new-logo {
      display: block;
      opacity: 1;
      transform: scale(2); /* Scale to 2x */
      transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
    }

    .header2::after {
      content: '';
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      height: 5px; /* Adjust the height of the gradient as needed */
      opacity: 75%;
      background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)); /* Add gradient background */
    }