body {
        font-family: Arial, sans-serif;
        margin: 0;
        padding: 0;
        line-height: 1.6;
      }

      main h1 {
        margin-bottom: 30px;
      }

      main p {
        margin-bottom: 20px;
      }

      main {
        padding: 20px;
        max-width: 1000px;
        margin: 0 auto;
        background-color: white;
        border-radius: 10px;
      }

      #progressBar {
      position: fixed;
      top: 0;
      left: 0;
      width: 0%;
      height: 8px;
      background-color: #f76b45;
      z-index: 9999;

    }

      .circle {
      position: absolute;
      width: 25px;
      height: 25px;
      border-radius: 50%;
      pointer-events: none;
      background: radial-gradient(circle, rgba(73, 232, 247, 0.466), rgba(141, 38, 172, 0.5));
      transition: transform 0.1s, left 0.1s, top 0.1s;
    }

    .circle-container {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      pointer-events: none;
      z-index: 9999;
    }

    @media (max-width: 720px) {
      .circle-container{
        display: none;
      }
    }

      h1,
      h2 {
        color: #333;
        margin-bottom: 10px;
      }

      a {
        color: #007bff;
        text-decoration: none;
      }

      a:hover {
        text-decoration: underline;
      }

      ul {
        list-style-type: disc;
        margin-left: 20px;
      }

      li {
        margin: 10px 0;
      }

      
.unique-popup-message {
  position: fixed; /* Change to fixed positioning */
  top: 30px; /* Adjust this value to be below the navbar */
  right: 2px; /* Adjust this value for the desired distance from the right edge */
  width: 300px; /* Adjust width as needed */
  transform: translateX(0); /* Center the popup horizontally */
  background-color: #a4d8ff;
  color: #131722;
  padding: 11px;
  border-radius: 5px;
  text-align: center;
  z-index: 1000;
  box-sizing: border-box;
  overflow: hidden; /* Hide the expanding border animation */
  position: relative;
}

.border-animation {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 7px; /* Same height as the border */
  background-color: rgb(4, 0, 128);
  width: 100%;
  transform-origin: right; /* Start shrinking from the right */
}

@keyframes borderAnimation {
  from {
    transform: scaleX(0); /* Full width initially */
  }
  to {
    transform: scaleX(1); /* Shrink to zero width */
  }
}

        .Lastupdate {
          margin-top: 18px;
          font-size: 20px !important;
          font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif, serif !important;
          font-weight: 500;
          margin-bottom: 15px;
          color: rgb(91, 91, 91) !important;
        }

        #last-updated-date {
          font-size: 18px;
          color: rgb(87, 87, 87) !important;
        }