@charset "UTF-8"

.grid-item {
    width: 10%;
    height: 10%;
    object-fit: cover;
    object-position: center;
    filter: grayscale(10%);
}

/*
DESKTOP SIZE
*/

@media (min-width: 600px) {
    .grid-item{
        transition-delay: 0.1s;
        transition-duration: 0.7s;
  
    }
    .grid-item:hover{
        filter: grayscale(0);
        box-shadow: 3px 3px 3px 3px burlywood;
        transform: scale(1.4,1.4);
        position: relative;
        overflow: hidden;
    }
}