html,body {
    margin:0;
    padding:0;
    width:100%;
    height:100%;
     overflow: hidden;
  }
  
  #gradient-canvas {
    width:100%;
    height:100%;
    --gradient-color-1: #4A00E0; 
    --gradient-color-2: #021B79;  
    --gradient-color-3: #021B79; 
    --gradient-color-4: #4A00E0;
  }
  
  
  .card{
      height: 400px;
      width: 800px;
      background-color: rgba(255, 255, 255, 0.1);
      -webkit-backdrop-filter: blur(20px);
              backdrop-filter: blur(20px);
      position: absolute;
       margin: auto;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;
      border-radius: 8px;
      box-shadow: 20px 20px 22px rgba(0,0,0,0.2);
      font-family: 'Poppins',sans-serif;
  }
  
  
  h6{
      margin: 0;
  }
  .desc{
      width: 100%;
      text-align: center;
      position: absolute;
      top: 160px;
  }
  .primary-text{
      color: rgba(255, 255, 255, 0.8);
      font-size: 125px;
      font-weight: 600;
      letter-spacing: 0.7px;
      margin: -53px 0;
  }
  .secondary-text{
      color: rgba(255, 255, 255, 0.8);
      font-weight: 400;
      font-size: 17px;
      letter-spacing: 1px;
      margin: 18px 0;
  }
  
  @-webkit-keyframes fade {
      0%, 100% {
          opacity: 0;
      }
      50% {
          opacity: 1;
      }
  }
  
  @keyframes fade {
      0%, 100% {
          opacity: 0;
      }
      50% {
          opacity: 1;
      }
  }