html {
    background: radial-gradient(circle, #545c61 0%, #172930 100%);
}
body {
    display: flex;
    min-height: 100vh;
    justify-content: center;
    align-items: center;
    align-content: center;
    background: #545c61;
    background: radial-gradient(circle, #545c61 0%, #172930 100%);
    flex-wrap: wrap;
    overflow-x: auto;
  }
  
  .card3d {
    margin: 20px;
    padding-bottom: 10px;
    transform: scale(1);
    perspective: 600px;
  }
  
  .card3d:hover {
    z-index: 10;
    transform: scale(1.3);
  }
  .card3d:active {
    z-index: 10;
    transform: scale(1.3);
  }
  @media(hover: none){
    .card3d:active {
        z-index: 10;
        transform: scale(1.3);
      }
}
  
  .card3d,
  .card3d img {
    transition: all 250ms ease-out;
  }