body {
    margin: 0;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background-color: #ffffff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100vh;
  }

  .splash-container {
    text-align: center;
    width: 100%;
    max-width: 400px;
  }

  .splash-image {
    width: 100%;
    height: auto;
    border-radius: 20px;
  }

  .logo-section {
    margin-top: 20px;
  }

  .logo {
    width: 150px;
    margin-bottom: 20px;
  }

  .button{
    padding: 12px 24px;
    background-color: #002366;
    color: #fff;
    border: none;
    border-radius: 25px;
    font-size: 16px;
    width:70%;
    cursor: pointer;
  }

  button:hover {
    background-color: #001f4d;
  }
  /* Loader styles */
    .loader-overlay {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: #fff; /* you can match with your splash background */
      display: flex;
      justify-content: center;
      align-items: center;
      z-index: 9999;
    }

    .loader {
      position: relative;
      width: 120px;
      height: 120px;
    }

    .loader img {
      width: 70px;
      height: 70px;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      border-radius: 50%;
    }

    .spinner {
      width: 100%;
      height: 100%;
      border: 6px solid #ddd;
      border-top: 6px solid #3498db;
      border-radius: 50%;
      animation: spin 1s linear infinite;
    }

    @keyframes spin {
      0% { transform: rotate(0deg); }
      100% { transform: rotate(360deg); }
    }