body{
    background-color: #000;
  }
  .login-container {
    background-color: #26282f;
    margin-top: 60%;
    padding: 20px 30px 50px 30px;
    border-radius: 10px;
    position: relative;
  }
  @media (max-width: 768px) {
    .col-4{
      width: 100%;
    }
  }
  .login-container img{
    width: 100%;
  }
  @property --angle {
    syntax: "<angle>";
    initial-value: 0deg;
    inherits: false;
  }
  .login-container::before, .login-container::after{
    content: '';
    position:absolute;
    height: 102%;
    width: 102%;
    background-image: conic-gradient(from var(--angle), #ff4545,#00ff99,#3b536f,#ff0095,#ff4545);    
    top: 50%;
    left: 50%;
    
    transform: translate(-50%, -50%);
    z-index: -1;
    padding: 10px;
    border-radius: 10px;
    animation: 3s spiner linear infinite;
  }
  .login-container::before{
    filter: blur(1.5rem);
    opacity: 0.0;
  }
  @keyframes spiner {
      from{
          --angle:0deg;
      }
      to{
          --angle:360deg;
      }
  }
  .login-container h2{
    color: #fff;
    padding-bottom: 20px;
    padding-top: 20px;
  }
  .login-container #message{
    color: #fff;
  }