*, *:before, *:after{
    box-sizing: border-box;
}

body{
    display:flex;
    flex-wrap:wrap;
    justify-content: center;
    align-items: center;
    background-color: maroon;
}

img{
    display:block;
    margin:8px;
    border:2px solid #1000;
    box-shadow: 3px 3px 8px rgba( 0,0,0, .5);
    border-radius:5px;
    max-width:200%;
    height:auto;
    filter:grayscale(100%);
    transition: .7s;
}


img:hover{
    max-width:210%;
    filter:grayscale(0%);
    transform: scale(1.2);
    z-index:10;
    transition: .7s transform ease-in-out;
}