.card {
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    transition: 0.3s;
    width: 25%;
    top:-300px;
    padding: 2px 2px 2px 2px;
    margin-left:70%;
  
    text-align: center;
    background: linear-gradient(to bottom right, rgb(212, 12, 238), rgb(104, 224, 245));
  }
  
  .card:hover {
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
  }
  .card h5{
    border: 1px #000;
    height:40px;
    background-color: #fff;
    border-radius:3px;
    text-align: center;
    padding-top:4px;
    font-weight: 550;
  }
  
  .container {
    padding: 2px 16px;
  }

  @media (max-width:768px){
    .card{
      width:250px;
      height:410px;
      margin-left:30px;
      margin-top:130px;
     
       }
      
  }

 
  .bg-text{
    height:100%;
    width:100%;
    margin-top:130px;
    background: linear-gradient(to bottom right, rgb(252, 245, 208), rgba(184, 184, 184, 0.74)) ;
    padding-left:25px;  
    color:rgb(15, 15, 15);  
  }
  .bg-text ul{
    padding-left:40px;
    line-height: 3;
    font-size: 20px;
  }
  
  @media (max-width:768px){
    .bg-text{
      margin-top:150px;
      font-size:5px;
      
    }

    }