Есть анимация, я хочу обернуть во внешний блок и при наведении на внешний блок вызывалась эта анимация, как можно это сделать?
.rectangle-button {
border: 5px solid #FF4218;
box-sizing: border-box;
Width:155px;
Height: 40px;
margin-left:58px;
margin-top:45px;
margin-bottom:19px;
font-family: Montserrat;
font-style: normal;
font-weight: bold;
font-size: 16px;
line-height: 50px;
display:inline-flex;
align-items: center;
text-align: center;
justify-content: center;
text-transform: uppercase;
color: #FFFFFF;
transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
position: relative;
}
.rectangle-button:hover {
background-color: transparent;
text-shadow: nthree;
}
.rectangle-button:hover:before {
left: 0%;
right: auto;
width: 100%;
}
.rectangle-button:before{
display: block;
position: absolute;
top: 0px;
right: 0px;
height: 100%;
width: 0px;
z-index: -1;
content: '';
color: #000 !important;
background: #FF4218;
transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
}
<div class="col-md-12 pl-0 zindex"><div class="rectangle-button">Купить</div></div>