.project {
    border-radius: 8px;
    background-color: hsl(0, 0%, 97.5%);
    border: 1px solid hsl(0, 0%, 95%);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 320px;
    transition: .2s;
}

.project:hover {
    transform: translateY(-4px);
    -webkit-box-shadow: 0px 5px 10px -2px hsla(0, 0%, 0%, 20%); 
    box-shadow: 0px 5px 10px -3px hsla(0, 0%, 10%, 20%);
}

.project .top {
    max-width: 100%;
}

.project .top img {
    width: 100%;
    border-radius: 8px 8px 0 0;
    max-height: 160px;
    object-fit: cover;
}

.project .top .project-data {
    padding: 8px;
}

.project .bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px;
}