poss.css

*{
    margin: 0 auto;
    font-family: Arial, Helvetica, sans-serif;
}
.poss{
    width: 400px;
    height: 500px;
    position: relative;
    margin-top: 60px;
}
.poss img{
    width: 100%;
    height: 100%;
}
.poss:hover .butn{
    visibility: visible;

}
.poss:hover .layer{
    visibility: visible;
    transition: all ease 0.4s;
}
.layer{
    width: 100%;
    height: 100%;
    background: rgba(12, 11, 11, 0.7);
    position: absolute;
    top: 0px;
    visibility: hidden;
}
.butn{
    position: absolute;
    top: 0px;
    top: 228.335px;
    left: 130px;
    visibility: hidden;
    z-index: 2;

}
.butn a{
    padding: 10px 20px;
    background: rgba(216, 178, 9, 0.6);
    display: block;
    color: rgb(233, 227, 227);
    font-size: 20px;
    text-decoration: none;
    border-radius: 5px;
}