.libertinus-mono-regular {
      font-family: "Libertinus Mono", monospace;
      font-weight: 400;
      font-style: normal;
      color: white;
    }

    .title {
      border-bottom: 2px dotted #ccc; /* dotted line under the title */
      padding-bottom: 0.3em;           /* some space between text and line */
      display: inline-block;           /* shrink width to text */
      color: white;
    } 



   .subtitle {                    
      font-size: 1.5em;
      font-weight: 300;
      color: #ccc;
      opacity: 1;
      transition: opacity 1s ease;
      min-height: 1.5em;
    } 

  #subtitle {
  font-family: 'Courier New', monospace;
  color: #0ff;
  text-shadow: 0 0 2px #0ff, 0 0 10px #00f, 0 0 20px #0ff;
  animation: flicker 2s infinite;
  }

  @keyframes flicker {
      0%   { opacity: 1; }
      50%  { opacity: 0.95; }
    60%  { opacity: 0.85; }
  100% { opacity: 1; }
}


    .subtitle {                    
      font-size: 1.5em;
      font-weight: 300;
      color: #ccc;
      opacity: 1;
      transition: opacity 1s ease;
      min-height: 1.5em;
    }

    body {
      margin: 0;
      padding: 0;
      background-image: linear-gradient(to right top, #210c18, #220e1e, #211024, #1e132a, #191631, #121934, #091c35, #001f36, #002130, #002125, #002018, #081e07);
      /* Old commented backgrounds removed for clarity */
      color: #ffffff;
      font-family: Arial, sans-serif;
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
      flex-direction: column;
      text-align: center;
    }

    h1.title {
      font-size: 3rem;
      margin-bottom: 0.5rem;
    }
	
	.landing-pic {
	  display: block;
	  margin: 0 auto;
	  width: 220px;       /* Adjust size as needed */
	  height: 220px;
	  border-radius: 50%; /* Makes it perfectly circular */
	  object-fit: cover;  /* Ensures the image fills the circle properly */
      /* display: block; */
      /* margin: 0 auto; */
      /* max-width: 150px; */
      /* height: auto; */
    }