body{
  color: #ECEFFF;
  cursor: default;
}

.typewriter{
  padding: 0rem 0rem 5rem 1rem;
  display: flex;
  justify-content: center;
}

.typewriter h1{
  overflow: hidden;
  white-space: nowrap;
  border-right: 2px solid var(--type);
  animation: typing 3.5s steps(26) forwards, blink 1s step-end infinite;
}

@keyframes typing{
  from{
    width: 0;
  }
  to{
    width: 14.5ch;
  }
}

@keyframes blink{
  50%{
    border-color: transparent;
  }
}

h1,
h2,
h3,
h4,
p{
  padding: 1rem 0rem 0rem 1rem;
}

h1,
h2,
h3,
.star_h2{
  font-family: "Oooh Baby", cursive;
  cursor: default;
}

h1{
  font-size: 3rem;
  font-optical-sizing: auto;
  font-weight: 800;
}

h2,
.star_h2{
  font-weight: 700;
}

h2 {
  font-size: 2.5rem;
}

h3 {
  font-size: 2rem;
  font-weight: 600;
}

h4,
.star_h2 {
  font-size: 1.5rem;
}

h4{
  font-weight: 500;
}

p,
.btn{
  font-size: 1rem;
  font-weight: 400;
}

p,
ul,
.btn{
  font-family: "Comfortaa", sans-serif;
}

.link{
  color: #102542;
  font-weight: 400;
}

.link:hover{
  color: #9FA8DA;
}

.btn:hover,
.btn:focus{
  color: #202036 !important;
}

/*/*//*/*//*/*//*/*//*/*//*/*//*/*//*/*
RESPONSIVE
/*//*/*//*//*//*//*//*//*//*//*//*//*/
@media only screen and (max-width: 768px) {
  h1 { font-size: 2.25rem; }
  h2 { font-size: 2rem; }
  h3 { font-size: 1.75rem; }
  h4 { font-size: 1.25rem; }

  p,
  .btn{
    font-size: 0.95rem;
  }
}

@media only screen and (max-width: 576px) {
  h2 { font-size: 1.75rem; }
  h3 { font-size: 1.5rem; }
  h4 { font-size: 1.1rem; }

  p,
  .btn{
    font-size: 0.9rem;
  }
}

@media only screen and (max-width: 450px) {
  h1 { font-size: 2rem; }
  h2{ font-size: 1.5rem; }
  h4 { font-size: 1rem; }
}