This snippet is used on the following knowledge base article - http://kb.wpbeaverbuilder.com/article/577-create-a-card-layout-for-posts-themer
.fl-post-grid-post {
-webkit-transition: all 0.5s ease;
transition: all 0.5s ease;
border-radius: 5px;
-webkit-box-shadow: 8px 14px 38px rgba(39, 44, 49, 0.06), 1px 3px 8px rgba(39, 44, 49, 0.03);
box-shadow: 8px 14px 38px rgba(39, 44, 49, 0.06), 1px 3px 8px rgba(39, 44, 49, 0.03);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.fl-post-grid-post:hover {
-webkit-transition: all 0.3s ease;
transition: all 0.3s ease;
-webkit-transform: translate3D(0, -1px, 0);
transform: translate3D(0, -1px, 0);
-webkit-box-shadow: 0 0 1px rgba(39, 44, 49, 0.1), 0 3px 16px rgba(39, 44, 49, 0.07);
box-shadow: 0 0 1px rgba(39, 44, 49, 0.1), 0 3px 16px rgba(39, 44, 49, 0.07);
}
.fl-post-grid-post a,
.fl-post-grid-post a:hover {
text-decoration: none;
}
.post-card-image-link {
overflow: hidden;
position: relative;
display: block;
border-radius: 5px 5px 0 0;
}
.post-card-image {
height: 150px;
background-position: center;
background-size: cover;
}
.post-card-content {
display: block;
padding: 25px;
font-size: 14px;
}
.post-card-content-link {
color: #15171a;
}
.post-card-content-link:hover {
text-decoration: none;
}
.post-card-category {
display: block;
margin-bottom: 4px;
letter-spacing: 0.5px;
text-transform: uppercase;
color: #999999;
font-size: 12px;
font-weight: 500;
line-height: 1;
}
.post-card-title {
margin-top: 0;
margin-bottom: 20px;
font-size: 18px;
font-weight: bold;
}