html {
    height: 100%;
  }
body { 
    background-color: white; 
    padding:10px; 
    /* width: 100%;
    height: 100%; */
}

.container {
    height: 97vh;
    width: 100%;
    display: flex;
    justify-content: center;
}

.ferrice {
    margin-top: auto;
    margin-bottom: auto;
}

canvas { 
    margin: auto;
}

.passkey {
    display: flex;
    justify-content: center;
    margin: 20px;
    font-size: 2rem;

}

.enterBtn {
    font-size: 1.5rem;
    text-align: center;
    color: #36A1B4;
    padding: 15px;
}

#enterBtn {
  padding: 5px;
}

.blinkBtn {
  border: 1px solid #36A1B4;
  border-radius: 7px;
}

.enterBtn:hover {
  cursor: pointer;
}

.blink {
    animation: blink 2s infinite;
  }
  
  @keyframes blink {
    0% {
      opacity: 1;
    }
    100% {
      opacity: 0;
      color: gray;
    }
  }