JSFiddle - React, Tailwind, and code Playground
HTML
<div class="contblock">
<a href="#" title="">
<div class="contbottom anim">Подробнее</div>
</a>
</div>
CSS
*{
margin:0;
padding:0;
}
.contblock{
width:90%;
margin:20px auto;
margin-bottom: 40px;
background:#3B516B;
padding:50px 20px ;
}
a{
display:block;
color:#fff;
}
.contbottom{
background:#112236;
float: right;
display: inline-block;
height:35px;
line-height:35px;
text-align: center;
padding: 0 15px 0 15px;
color: #ffffff;
font-size:12px;
text-transform: uppercase;
font-weight:600;
}
.contblock:hover{
box-shadow:0 0 10px #000;
}
.contbottom:hover .contblock {
-webkit-box-shadow: 0px 0px 10px 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow: 0px 0px 10px 0px rgba(50, 50, 50, 0.75);
box-shadow: 0px 0px 10px 0px rgba(250,250,250, 1);
}