area-51/style.css

@import url("https://fonts.googleapis.com/css?family=Raleway:400,400i,700");
*,
*::before,
*::after {
  padding: 0;
  margin: 0 auto;
  box-sizing: border-box;
}

body {
  font-family: Raleway, sans-serif;
  background-color: #000;
  color: #fff;
  font-size: 24px;
}

/* unvisited link */
a:link {
  color: white;
}

/* visited link */
a:visited {
  color: white;
}

/* mouse over link */
a:hover {
  color: white;
  font-weight: bold;
}

/* selected link */
a:active {
  color: white;
}

.glow {
  background-color: white; /* for the 1px in the center */
  box-shadow: 0 0 50px 70px white;
}

.content {
  width: 95%;
  max-width: 40ch;
  padding: 0em 0em;
}

.marquee {
  position: relative;
  width: 100%;
  height: 2em;
  font-size: 5em;
  display: grid;
  place-items: center;
  overflow: hidden;
}
.marquee_text {
  position: absolute;
  min-width: 100%;
  white-space: nowrap;
  -webkit-animation: marquee 16s infinite linear;
          animation: marquee 16s infinite linear;
}
@-webkit-keyframes marquee {
  from {
    translate: 70%;
  }
  to {
    translate: -70%;
  }
}
@keyframes marquee {
  from {
    translate: 70%;
  }
  to {
    translate: -70%;
  }
}
.marquee_blur {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background-color: black;
  background-image: linear-gradient(to right, white, 1rem, transparent 50%), linear-gradient(to left, white, 1rem, transparent 50%);
  filter: contrast(15);
}
.marquee_blur p {
  filter: blur(0.07em);
}
.marquee_clear {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
}

.text {
  margin-block: 2em;
  padding: 2rem;
  filter: blur(0.8px);
  text-shadow: 2px 2px 4px #000000;
}

/* -- paprsky -- */
@keyframes rotate {
  to {
    transform: rotate(1turn);
  }
}

.light-rays {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: radial-gradient(#fff, black);
  overflow: hidden;
  --a: rgba(3, 10, 0, 0.1);
  --b: rgba(3, 10, 0, 1);
  --c: rgba(3, 10, 0, 0.5);
  --d: rgba(3, 10, 0, 0.68);
}

.light-rays:before,
.light-rays:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -100vmax;
  width: 200vmax;
  height: 200vmax;
  opacity: 0.5;
}

div:before {
  background: conic-gradient(
    var(--a),
    var(--b),
    var(--c),
    var(--d),
    var(--a),
    var(--d),
    var(--a),
    var(--d),
    var(--b),
    var(--c),
    var(--d),
    var(--a),
    var(--b)
  );
  animation: rotate 4s infinite;
}
div:after {
  background: conic-gradient(
    var(--c),
    transparent,
    var(--c),
    var(--a),
    transparent,
    var(--b),
    var(--c),
    transparent,
    var(--c),
    var(--a)
  );
  animation: rotate 2s 4s infinite reverse;
}