ali2210/WizDwarf

.company-logo-image{
    display: flex;
    position: absolute;
    top: 394px;
    left: 520px;
    color: purple;
}
.zoom {
    padding: 50px;
    background-color: white;
    transition: transform .2s; /* Animation */
    width: 150px;
    height: 150px;
    margin: 0 auto;
    cursor: progress;
    cursor: wait;
  }
  .zoom:hover {
    transform: scale(1.5); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
  }

  body {
     /* background: #333;  */
    display: flex;
    justify-content: center;
  }
  
  /* DEMO-SPECIFIC STYLES */
  .typewriter h4 {
    color: purple;
    font-family: monospace;
    overflow: hidden; /* Ensures the content is not revealed until the animation */
    border-right: .15em solid orange; /* The typwriter cursor */
    white-space: nowrap; /* Keeps the content on a single line */
    margin: 0 auto; /* Gives that scrolling effect as the typing happens */
    letter-spacing: .15em; /* Adjust as needed */
    animation: 
      typing 3.5s steps(30, end),
      blink-caret .5s step-end infinite;
  }
  
  .container-text{
    display: flex;
    position: absolute;
    top: 233px;
    justify-content: center;
  }

  .link{
    color: purple;
    margin-top: 65px;
    display: flex;
    position: relative;
    left: -137px;
  }
  /* The typing effect */
  @keyframes typing {
    from { width: 0 }
    to { width: 100% }
  }
  
  /* The typewriter cursor effect */
  @keyframes blink-caret {
    from, to { border-color: transparent }
    50% { border-color: orange }
  }

  .versions{
    display: flex;
    position: absolute;
    top: 100px;
    left: 6px;
  }

  /* .credit{
    display: flex;
    position: absolute;
    top:3px;
    left:236px;
  } */
  
  .version{
    display: flex;
    position: relative;
    top: 103px;
    left: -98px;
    color:purple;
  }
  
  .init{
    display: flex;
    position: absolute;
    top: 12px;
    left: -3px;
    color: purple;
    font-family:fantasy;
    font-weight:bolder;
  }