.container{position:relative;overflow:hidden}.image{display:block;width:100px;height:auto}.overlay{position:absolute;bottom:0;left:0;right:0;background-color:#8e9c78;overflow:hidden;width:100%;height:0;opacity:0;transition:height .5s ease,opacity .5s ease}.container:hover .overlay{height:100%;opacity:1}.overlay1{position:absolute;top:0;left:0;right:0;background-color:#8e9c78;overflow:hidden;width:100%;height:0;opacity:0;transition:height .5s ease,opacity .5s ease}.container:hover .overlay1{height:100%;opacity:1}.text{color:white;font-size:20px;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);text-align:center;background-color:#8e9c78;padding:10px 20px;line-height:1.4}