@import url("colortext.css");
* {
  box-sizing: border-box;
  margin: 0;
  image-rendering: pixelated; /* Modern browsers */
  image-rendering: crisp-edges; /* Safari and older fallback */
}
@font-face {
  font-family: determination; /* set name */
  src: url(/assets/fonts/determination.ttf); /* url of the font */
}


body {
  text-rendering: optimizeSpeed;
  font-family: determination;
  background: #000;
    letter-spacing: 0px;
  color: #fff;
  display: grid;
  place-items: center;
  min-height: 100vh;
  padding: 1.5rem;

  background-image: url("/assets/images/bg.png");
  background-size: 128px;
}
main {
  border: 9px solid #fff;
  padding: 3rem;
  max-width: 40rem;
  width: 100%;
  background: #000;
  text-align: center;
  text-shadow: 3px 3px 0px #000096;
  filter: drop-shadow(2px 2px 0px #000096);
  
}
h1 {
  font-size: 36pt;
  margin-bottom: 0.75rem;
}
p {
  font-size: 18pt;
  margin-bottom: 1.5rem;
}
img {
  filter: drop-shadow(2px 2px 0px #000096);
  max-width: 100%;
  display: block;
  margin: auto;
}
a {
  color: #fff;
}
.image-grid {
    display: grid;
    /* Creates two columns that dynamically fit the exact width of your images */
    grid-template-columns: max-content max-content; 
    gap: 0; /* Removes all spaces and margins between the images */
    width: max-content;      /* Shrinks the grid container tightly around the images */
    margin: 0 auto;     
}

.image-grid img {
    /* Forces the layout engine to ignore structural scaling and use the original image file sizes */
    width: auto; 
    height: auto; 
    display: block; /* Removes the tiny default HTML bottom whitespace gap */
}


.plain-link {
  color: inherit;       /* Inherits text color from the parent element */
  text-decoration: none; /* Removes the underline */
  cursor: help;         /* Optional: changes pointer cursor back to text cursor */
}
