hover effect style : demo 2

HTML

                    

CSS

                    .box{
                        position: relative;
                    }
                    .box img{
                        width: 100%;
                        height:auto;
                    }
                    .option{
                        position: absolute;
                        top:5%;
                        left:5%;
                        width:90%;
                        height:90%;
                        background: rgba(255, 255, 255, 0.6);
                        text-align: center;
                        transform:scale(0);
                        transition: all 0.5s ease-in-out 0s;
                    }
                    .link{
                        position: relative;
                        top:40%;
                        display: inline-block;
                        padding: 7px 12px;
                        background: #a264bb;
                        color:#fff;
                        margin-right: 10px;
                    }
                    .link:hover{
                        color:#A264BB;
                        background: #fff;
                    }
                    .box:hover .option{
                        transform:scale(1);
                    }
                    @media only screen and (max-width: 990px){
                        .box{
                            margin-bottom: 20px;
                        }
                    }