.word {
    opacity:0;
    position:absolute;
    width: 100%;
    font-weight:bold;
  }

  .w1 {
    animation: w1anim 20s infinite;
  }
  
  .w2 {
    animation: w2anim 20s infinite;
  }
  
  .w3 {
    animation: w3anim 20s infinite;
  }
  
  .w4 {
    animation: w4anim 20s infinite;
  }
  
  .w5 {
    animation: w5anim 20s infinite;
  }

  
  
  @keyframes w1anim {
    0%{
      opacity: 0;
    }
    10%{
      opacity: 1;
    }
    20% {
      opacity:0;
    }
  }
  
  
  @keyframes w2anim {
    20%{
      opacity: 0;
    }
    30%{
      opacity: 1;
    }
    40% {
      opacity:0;
    }
  }
  
  @keyframes w3anim {
    40%{
      opacity: 0;
    }
    50%{
      opacity: 1;
    }
    60% {
      opacity:0;
    }
  }
  
  @keyframes w4anim {
    60%{
      opacity: 0;
    }
    70%{
      opacity: 1;
    }
    80% {
      opacity:0;
    }
  }
  
  @keyframes w5anim {
    80%{
      opacity: 0;
    }
    90%{
      opacity: 1;
    }
    100% {
      opacity:0;
    }
  }  
  


.home-container {
    padding: 30px 10px;
    text-align: center;
    position: fixed;
    top: var(--navbar-height);
    width: 100%;
}

.login-container {
    padding: 10px;
    text-align: center;
    position: fixed;
    top: var(--navbar-height);
    width: 100%;
}

.home-msg h1 {
    font-size: 20px;
    font-weight: bold;
    margin-top: 15px;
}

.home-msg h2 {
    font-size: 16px;
    margin-top: 15px;
}

.branch-select select {
    width: 80%;
    border-color: transparent;
    border-bottom: 2px solid var(--main-color);
    background: transparent;
    margin-top: 30px;
    margin-bottom: 30px;
}

.init-processes {
    text-align: center;
    padding: 10px;
}

.init-buttons-area {
    padding: 10px;
}

.init-buttons {
    text-align: center;
    margin-bottom: 10px;
}

.branch-image {
    position: fixed;
    bottom: 0px;
    left: 0px;
    width: 100%;
}

.init-buttons button {
    width: 80%;
}