body{
    background-color:#191825
}

/* display background color black on navbar scroll */
.navbarScroll.navbarDark {
    background-color: black;
}

/* hero background image */
.bgimage {
    height:100vh;
    background-image: url("./imagens/dark-minimalist.jpg");
    position:relative;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100vw 100vh;
}
/* text css above hero image*/
.hero_title {
    font-size: 4.5rem;
}
.hero_desc {
    font-size: 2rem;
}
.hero-text {
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #79018C;
}
h1 {
    font-size: 12vmin;
    color: #79018C;;
    text-align: left;
    font-family: Lato, sans-serif;
    font-weight: 700;
}
#nome{
    margin-top: 40%;
    margin-left: 20%;
}
/* efeito typewriter */
@keyframes typing {
    0.0000%, 31.3488% { content: ""; }
    1.1395%, 30.2093% { content: "G"; }
    2.2791%, 29.0698% { content: "GR"; }
    3.4186%, 28.9302% { content: "GR4"; }
    4.5581%, 27.7907% { content: "GR4V"; }
    5.6977%, 26.6512% { content: "GR4V1"; }
    6.8372%, 20.5116% { content: "GR4V17"; }
    7.9767%, 19.3721% { content: "GR4V17Y"; }
  
    32.7674%{ content: ""; }
    33.9070%{ content: "G"; }
    34.0465%{ content: "Gr"; }
    35.1860%{ content: "Gra"; }
    36.3256%{ content: "Grav"; }
    37.4651%{ content: "Gravi"; }
    38.6047%{ content: "Gravit"; }
    39.7443%{ content: "Gravity"; }
}  
@keyframes blink {
    0%, 100% { opacity: 1; }
    50%{ opacity: 0; }
}
  
  .typewriter {
    --caret: currentcolor;
}
  
  .typewriter::before {
    content: "Gravity";
    animation: typing 13.5s;
}
  
  .typewriter::after {
    content: "";
    border-right: 1px solid var(--caret);
    animation: blink 0.5s linear infinite;
}
  
  .typewriter.thick::after {
    border-right: 1ch solid var(--caret);
}
  
  .typewriter.nocaret::after {
    border-right: 0;
}
  
  
  @media (prefers-reduced-motion) {
    .typewriter::after {
      animation: none;
}
    
    @keyframes sequencePopup {
      0%, 100% { content: "GR4V17Y"; }
      100% { content: "Gravity"; }
    }
  
    .typewriter::before {
      content: "Gr";
      animation: sequencePopup 12s linear infinite;
      animation-iteration-count: 1;
    }
}
  /**/

   .img-proto{
    margin-top: 16.5rem;
    animation: mover2 2s linear; 
    animation-iteration-count: 1;
    animation-fill-mode: both;
    animation-timing-function: linear;
  }

/* imagen do sobre */
.imagenSobrePagina {
    width: 100%;
    animation: mover 0.8s linear;
    animation-play-state: paused;
    animation-delay: calc(var(--scroll) * -1s);

    animation-iteration-count: 1;
    animation-fill-mode: both;
    
}
@keyframes mover {
    0% { opacity: 0; }
    100% { opacity: 1; }
    to {
      transform:translate(-200px);
    }
  }
   @keyframes mover2 {
    0% { opacity: 0; }
    to {
        transform:translate(-10px);
      }
    50% { opacity: 60%; }
    100%{ opcaity: 100%;}
    
  } 
