CSS - Vihan

 

**** HTML:

<div class="team-item">
<div class="team-image">
<img src="team1.jpg">
</div>
</div>

****CSS:

.team-item {

    position: relative;

    text-align: center;

}

.team-image:after {

    position: absolute;

    background: transparent;

    content: " ";

    display: block;

    height: 100%;

    width: 100%;

    top: 0;

    left: 0;

    z-index: 1;

}

.team-image {

    position: relative;

    overflow: hidden;

}

.team-image:after {

    transition: all 0.3s ease-in-out 0s;

}

.team-item:hover .team-image:after {

    background: rgba(0, 0, 0, .6);

}