#card {   
    box-shadow: 0 5px 10px rgba(0,0,0,0.8);
    transform-origin: center top;
    transform-style: preserve-3d;
    transform: translateZ(0);
    transition: 0.3s;
}

    #card:after {
        content: '';
        z-index: 10;
        width: 200%;
        height: 100%;
        top: -90%;
        left: -20px;
        opacity: 0.1;
        transform: rotate(45deg);
        background: linear-gradient(to top, transparent, #fff 15%, rgba(255,255,255,0.5));
        transition: 0.3s;
    }

    #card:hover,
    #card:focus,
    #card:focus,
    #card:active {
        box-shadow: 0 8px 16px 3px rgba(0,0,0,0.6);
        transform: translateY(-3px) scale(1.05) rotateX(15deg);
    }