body{
  background: hsl(240, 2%, 12%);
  align-content: center;
  text-align:center;
}

p,h2, h1 { align-content:center; color:#EFE9E0;}
input[type="text"][type="submit"]{
    border-radius: 20px;
    border: 1px solid hsl(0, 0%, 22%);
}
.formBox {
  background: hsl(240, 2%, 12%);
  border: 1px solid hsl(0, 0%, 22%);
  border-radius: 20px;
  padding: 15px;
  box-shadow: -4px 8px 24px hsla(0, 0%, 0%, 0.25);
  z-index: 1;
}
.formBox, input[type="text"][type="submit"] {
  position: relative;
  align-content:center;
  text-align:center;
  width:300px;
  margin:0 auto;
  background: hsl(240, 2%, 12%);
  z-index: 1;
}
input[type="text"][type="submit"] {background:transparent; width:300px; border:none;}
label, input[type="text"][type="submit"] {text-align:center; align-content:center; color:#EFE9E0;}
.formBox::before,input[type="text"][type="submit"]::before{
  content: '';
  position: absolute;
  inset: -2px;
  background: linear-gradient(90deg, 
      hsl(232, 58%, 38%), 
      hsl(142, 61%, 29%), 
      hsl(232, 58%, 38%));
  border-radius: inherit;
  z-index: -1;
  animation: rotate 4s linear infinite;
  background-size: 200% 100%;
}

.formBox::after,input[type="text"][type="submit"]::after {
  content: '';
  position: absolute;
  inset: 1px;
  background: hsl(240, 2%, 12%);
  border-radius: inherit;
  z-index: -1;
}

@keyframes rotate {
  0% {
    background-position: 0% center;
  }
  100% {
    background-position: -200% center;
  }
}