#blogPosts{
    display:inline-flex;
    flex-flow:column nowrap;
    list-style-type: none;
    padding:0;
    margin:0;
    width:100%;
}
.item{
    margin:0;
    padding:min(1em,2%);
    flex-grow:1;
    width:100%;
    height:auto;
    text-decoration:none;
    display:grid;
    grid-template-rows:100%;
    grid-template-columns:1fr 4fr;
}
.postImg{
    object-fit: cover;
    border-radius:80px;
    height:auto;
    width:100%;
}
.item:hover .postImg{
    animation: Grow 0.4s forwards;
}
.item:not(:hover) .postImg{
    animation:drop 0.3s forwards;
}
@keyframes Grow{
    0%{
        transform:translateY(0px);
        box-shadow:none;
        size:100%;  
    }
    30%{
        size:200%;
        box-shadow: 4px 9px 9px rgb(102, 102, 102);
        transform:translateY(-12px);
    }
    100%{
        transform:translateY(-5px);
        box-shadow: 4px 4px 4px rgb(102, 102, 102);
    }

}
@keyframes drop{
    0%{
        transform:translateY(-5px);
        box-shadow: 4px 4px 4px rgb(102, 102, 102);
        size:100%;  
    }
    100%{
        transform:translateY(0px);
        box-shadow:none;
        size:100%;  
    }
    
}