.post-preview {

display: flex;
flex-direction: row;
background-color: #FFF;
margin-bottom: 32px;
border-radius: 10px;
border: 1px solid #DDD;
overflow: hidden;
text-decoration: none;
box-shadow: 0 1px 1px 0 rgba(31, 35, 46, 0.15);
transition: all .3s ease;

}

.post-preview:hover {

transform: translate(0px, -2px);
box-shadow: 0 15px 45px -10px rgba(10, 16, 34, 0.2);

}

.post-preview-image {

width: 25%;
> span {
  width: 100%;
  height: 100%;
  display: block;
  background-size: cover;
  background-position: 50% 50%;
}

}

.post-preview-text {

flex: 1;
padding: 10px;

}

.post-preview-title {

color: #3B5998;
font-size: 24px;
font-weight: bold;
display: inline-block;

}

.post-preview-title:hover {

text-decoration: underline;

}

.post-preview-date {

font-size: 12px;
line-height: 100%;
color: #777;

}

.post-preview-tagline {

margin-top: 16px;
font-size: 16px;
color: #777;

}