body, html {
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: #050505;
  color: #dddddd;
  font-size: 12px;
  text-align: center;
}

@media (min-width: 400px) {
    body, html {
        font-size: 16px;
        text-align: start;
    },
}

h1 {
  color: #00aabb;
  margin: 0px;
  width: 100%;
}

p {
  text-align: justify;
}

.container1 {
  padding: 8px;
  display: flex;
  flex-direction: row;
  gap: 20px;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}


.container2 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width:400px;
  gap: 5px;
}



.blink-container {
  position: relative;
  height: 35px;
  font-family:Consolas,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New, monospace;
}

.blink-open, .blink-closed {
  position: absolute;
  top: 0;
  left: 0;
}

.blink-open {
  animation: blink 4s step-end infinite;
}

.blink-closed {
  opacity: 0;
  animation: blinkReverse 4s step-end infinite;
}

@keyframes blink {
  0%, 90% { opacity: 1; }
  90%, 100% { opacity: 0; }
}

@keyframes blinkReverse {
  0%, 90% { opacity: 0; }
  90%, 100% { opacity: 1; }
}