/* .box{
    padding-top:30px;
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
  } */
  .box{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .card{
    position:relative;
    width:330px;
    height:370px;
    background: #fff;
    margin:1.5em auto;
    border-radius:5px;
    box-shadow:0 8px 15px rgba(0,0,0,.2);
  }
  .card:before,
  .card:after 
  {
    content:"";
    position:absolute;
     background: #ccc;
     background: #3e3b41;
     background: #ff9e00;
     background: #03071e;
    transition: 0.4s;
    width:100%;
    height:100%;
    z-index:-1;
     border-radius:5px;
    box-shadow:0 2px 10px rgba(0,0,0,.2);
  
  }
  .card:hover:after{
    transform:rotate(10deg);
     box-shadow: 0 2px 20px rgba(0,0,0,.2);
  }
  
    .card:hover:before{
    transform:rotate(20deg);
      box-shadow: 0 2px 20px rgba(0,0,0,.2); 
  }
  .card .imgBx{
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    background: #212121;
    transition: 0.5s;
    z-index: 1;
    }
  .card:hover .imgBx
    {
      bottom: 100px;
    }
   .card .imgBx img{
        position: absolute;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
   .card .details{
        position :absolute;
        left: 10px;
        right: 10px;
        bottom: 10px;
        height: 80px;
        font-weight: 700;
        text-align: center;
        color: #03071e;
        /* background-color: yellow; */
        z-index: 0;
    }
  
    .card .details h4{
     margin: 0;
     padding: 0;
     font-weight: 500;
     font-size: 16px;
     
     text-transform: uppercase;
    } 
  
    .card .details h4 span{
    font-weight: 500;
    font-size: 16px;
    color: #f38695;
    display: block;
    margin-top: 5px;
     } 

     .card .details h4 span a img{
         /* background: #000; */
         width: 25px;
         margin: 0 .8em;
     }
    @media only screen and (max-width: 700px){
      .box{
        display: flex;
        /* flex-direction: column; */
        /* padding: 0 2em; */
      }
      .card{
        width:300px;
        height:350px;
      }
    }