.project-preview_container {

display: flex;
flex-direction: row;
flex-wrap: wrap;

}

.project-preview {

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

}

.project-preview:hover {

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

}

.project-preview-image {

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

}

.project-preview-text {

flex: 1;
padding: 10px;

}

.project-preview-title {

color: #3B5998;
font-size: 24px;
font-weight: bold;
text-align: center;

}

.project-preview-title:hover {

text-decoration: underline;

}

.project-preview-tagline {

margin-top: 16px;

}