.main_box {
  position:absolute;
  width:90%;
  height:50%;
  top: 40%;;
  left: 50%;
  transform: translate(-50%, -50%);
  color:white;
  z-index:1000;
  font-size:30px;
  font-family: 'Anonymous Pro', monospace;
  font-weight: 700;
}

.enigme {
  display: flex;
  align-items: center;
  justify-items: center;
  justify-content: center;
}

.enigme_box {
  /* backdrop-filter: blur(10px); */
}

.form {
  display: flex;
  align-items: center;
  justify-items: center;
  justify-content: center;
  flex-direction: column;
  height: 100px;
    width: 100%;
}

body {
  background-color: #3e3e56;
}
.hide {
  display: none;
}



.glow-on-hover {
  width:90%;
  height:100%;
  border: none;
  outline: none;
  color: #000;
  background: #fff;
  cursor: pointer;
  position: relative;
  z-index: 0;
  border-radius: 10px;
  font-family: 'Anonymous Pro', monospace;
  font-size: 40px;

}

.glow-on-hover:before {
  content: '';
  background: linear-gradient(45deg, #00FF98, #00FF98, #00FF98, #00FF98, #00FF98, #00FF98, #00FF98, #00FF98, #00FF98);
  position: absolute;
  top: -2px;
  left:-2px;
  background-size: 400%;
  z-index: -1;
  filter: blur(5px);
  width: calc(100% + 4px);
  height: calc(100% + 4px);
  animation: glowing 20s linear infinite;
  opacity: 0;
  transition: opacity .3s ease-in-out;
  border-radius: 10px;
}

.glow-on-hover:active {
  color: #fff
}

.glow-on-hover:active:after {
  background: transparent;
}

.glow-on-hover:hover:before {
  opacity: 1;
}

.glow-on-hover:after {
  z-index: -1;
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  background: #FFF;
  left: 0;
  top: 0;
  border-radius: 10px;
}




#matrix {
  background-color: #3e3e56;
  -webkit-animation: blur 10s infinite;
          animation: blur 10s infinite;
  -webkit-animation-delay: 10s;
          animation-delay: 10s;
}
@-webkit-keyframes blur {
  0% {
    filter: url("#blur-horizontal");
  }
  2% {
    filter: url("#none");
  }
  5% {
    filter: url("#blur-horizontal");
  }
  7% {
    filter: url("#none");
  }
  10% {
    filter: url("#blur-horizontal");
  }
  12% {
    filter: url("#none");
  }
  58% {
    filter: url("#none");
  }
  60% {
    filter: url("#blur-vertical");
  }
  62% {
    filter: url("#none");
  }
  65% {
    filter: url("#blur-horizontal");
  }
  67% {
    filter: url("#none");
  }
  69% {
    filter: url("#blur-vertical");
  }
  72% {
    filter: url("#none");
  }
}
@keyframes blur {
  0% {
    filter: url("#blur-horizontal");
  }
  2% {
    filter: url("#none");
  }
  5% {
    filter: url("#blur-horizontal");
  }
  7% {
    filter: url("#none");
  }
  10% {
    filter: url("#blur-horizontal");
  }
  12% {
    filter: url("#none");
  }
  58% {
    filter: url("#none");
  }
  60% {
    filter: url("#blur-vertical");
  }
  62% {
    filter: url("#none");
  }
  65% {
    filter: url("#blur-horizontal");
  }
  67% {
    filter: url("#none");
  }
  69% {
    filter: url("#blur-vertical");
  }
  72% {
    filter: url("#none");
  }
}
@keyframes glowing {
  0% { background-position: 0 0; }
  50% { background-position: 400% 0; }
  100% { background-position: 0 0; }
}