.tiles {
    display: -moz-flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: relative;
    flex-direction: column;
    -moz-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap; 
}

.image_wrapper {
  position: relative;
   max-height:420px;
   display: inline-block;
   text-align: center;
}

.image {
    position: relative;
    display: block;
    
    border-radius: 5px;
    overflow: hidden; 
    max-height:420px;  
     
   
}

.image img {
			display: block;
            width: 100%;
            height:100%;
           
        }    
    
		
.image:before {
  content:'';
display: block;
     position: absolute;
    background-image: url("images/zoom_icon.webp");
    background-position: center center;
    background-size: contain; 
   top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  
    z-index: 1;
    opacity:0;
    
    transition: opacity 1s;
    }
            
.image:hover {
   transform: scale(1.1);
   transition: 1s ease;
/*     box-shadow: 0px 2px 5px rgba(0,0,0,.75); */
     border-radius: 10px;
    }

.image:hover:before {
   opacity: 1;
   }