.lettering:after{
    content: '';
     display: inline-block;
     animation: cursor 0.4s infinite;
   }
 
   /* The typewriter cursor effect */
   @keyframes cursor {
     0% { opacity: 1; }
       49% { opacity: 1; }
       50% { opacity: 0; }
       100% { opacity: 0; }
   }

   #ferramenta{
    opacity: 0;
   }

   #icons-principal{
    opacity: 0;
   }

  #ferramenta.fade-in{
    opacity: 1;
  }
  #icons-principal.fade-in{
    opacity: 1;
  }

   .fade-in{
        animation: fadeIn 0.8s;
        opacity: 1;
   }

   @keyframes fadeIn {
        from {
            opacity: 0;
        }
        to {
            opacity: 1;
        }
   }