@import url(https://db.onlinewebfonts.com/c/72112afab388987941068c3f7a741a53?family=Mark+Pro+Heavy);

@font-face {
  font-family: 'AeogoBox';
  src: url('./AeogoBox.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

html, body {
    background-color: black;
    margin: 0;
    padding: 0;
    user-select: none;
}
.grid-noise-bg {
  position: absolute;
  width: 100vw;
  height: 100vh;
   display: flex;
  justify-content: center; /* horizontal */
  align-items: center;     /* vertical */
}

.grid-noise-bg::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAABcSURBVHgB7c8BEYAwDACxggxc4F8RKgYynl3iIMda656ZZ/7ui1yzgXM2IVIjUiNSI1IjUiNSI1IjUiNSI1IjUiNSI1IjUiNSI1IjUiNSI1IjUiNSI1IjUrNN5AXwWgeQrakuTQAAAABJRU5ErkJggg==');
  background-size: 57px;
  opacity: 0.6;
  z-index: -2;
  pointer-events: none;
/* box-shadow: 0px 90px 40px -50px #0E0F11 inset; */
}

.grid-noise-bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.3'/%3E%3C/svg%3E");
  z-index: -1;
  opacity: 0.7;
  pointer-events: none;
}
.content {
  text-align: center; /* Text in der Mitte */
  
}


h1 {
    color: #00FFE0;
    font-family: "AeogoBox";
    font-size: 4rem;  /* größer */
    margin: 0.2em 0;
}

h2 {
    color: white;
    font-family: "Mark Pro Heavy";
    font-size: 2rem;  /* etwas kleiner als H1 */
    margin: 0.2em 0;
}

h3 {
    color: #00FFE0;
    font-family: "Mark Pro Heavy";
    font-size: 1.5rem;  /* etwas kleiner als H1 */
    margin: 0.2em 0;
}