.overlay-container { position: relative; text-align: center; width: 100%; } .overlay-container .image { display: block; width: 100%; height: auto; } .overlay-container .overlay-mask { position: absolute; inset: 0; height: 100%; width: 100%; background-color: rgb(0 0 0 / 0%); color: rgb(0 0 0 / 0%); transition-property: color, background-color; transition-duration: 0.25s, 0.25s; transition-timing-function: ease-in-out; } .overlay-container:hover .overlay-mask { background-color: rgb(0 0 0 / 70%); color: rgb(255 255 255 / 100%); } .overlay-container .overlay-content { padding-left: 15%; padding-right: 15%; height: 100%; display: flex; flex-direction: column; justify-content: center; text-decoration: none; }