/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

body {
  /* Set the path to your image */
  background-image: url('https://wallpapercave.com/wp/wp3103079.jpg');

  /* Prevent the image from repeating like a grid */
  background-repeat: no-repeat;

  /* Scale the image to completely cover the element */
  background-size: cover;

  /* Center the image horizontally and vertically */
  background-position: center;

  /* Optional: Keep the image fixed in place while scrolling */
  background-attachment: fixed;
  
  /* Apply a default font to the entire webpage */
  font-family: Courier, Lucida, Georgia;

}

/* Apply a specific font to headings only */
  h1,h2,h3 {font-family: "Courier New", Lucida, Georgia;
}

.larger_link {
  font-size: 18px;
}






<!-- Markup: <div class="fx-softblur">FOCUS</div> -->

/* Colour tokens — override to re-skin the effect:
   --ink    main text colour (defaults to currentColor)
   --ink-2  primary accent   --ink-3  secondary accent */
:root { --ink: currentColor; --ink-2: #FF4FD8; --ink-3: #4FF8FF; }

/* 46 Soft-Blur — a modern bloom effect that breathes between crisp and hazy */
.fx-softblur {
  font: 600 14px/1.05 "JetBrains Mono", monospace;
  letter-spacing: .1em;
  color: var(--ink);
  text-shadow:
    0 0 0 var(--ink),
    0 0 18px color-mix(in srgb, var(--ink-2) 45%, transparent),
    0 0 34px color-mix(in srgb, var(--ink-3) 35%, transparent);
  animation: fx-softblur 3.2s ease-in-out infinite;
}
@keyframes fx-softblur {
  0%, 100% { filter: blur(0); opacity: 1; transform: scale(1); }
  50%      { filter: blur(2.4px); opacity: .72; transform: scale(1.045); }
}