/* убираем отступы браузера */
body, html {
  margin: 0;
  padding: 0;
  height: 100%;
  background: black;
  font-family: monospace;
  overflow: hidden;
}

/* ASCII-анимация на фоне */
#ascii-bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  color: hsl(0, 0%, 55%);
}

#ascii {
  font-size: 12px;
  line-height: 10px;
  text-align: center;
}

#site-title {
  position: absolute;          /* поверх ASCII-анимации */
  top: 50%;                    /* по вертикали центр */
  left: 50%;                   /* по горизонтали центр */
  transform: translate(-50%, -50%); /* точно центрируем */
  color: white;                /* цвет текста */
  font-size: 48px;             /* размер текста, подбирай под свой сайт */
  font-family: Arial, sans-serif; /* любой читаемый шрифт */
  text-align: center;
  z-index: 10;                 /* чтобы быть поверх анимации */
  pointer-events: none;        /* чтобы клики проходили через текст, если нужно */
}

#footer-text {
  position: absolute;      /* поверх ASCII-анимации */
  bottom: 20px;            /* отступ от низа */
  left: 50%;               /* по горизонтали центр */
  transform: translateX(-50%); /* центрирование */
  color: gray;             /* серый цвет текста */
  font-size: 16px;         /* размер текста */
  font-family: Arial, sans-serif;
  z-index: 10;             /* поверх анимации */
  text-align: center;
  pointer-events: none;    /* чтобы клики проходили через текст */
}