.bc-mask-hover{
position: relative;
--easing: cubic-bezier(.165,.84,.44,1);
--duration: 0.6s;
}
.bc-mask-hover__title {
font-size: 36px;
line-height: 1.3;
}
.bc-mask-hover__title--2{
font-size: 36px;
line-height: 1.3;
}
.bc-mask-hover__content-wrapper{
position: absolute;
left: 0;
transition: clip-path var(--duration) var(--easing), -webkit-clip-path var(--duration) var(--easing);
background: #eb5939;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
z-index: 2;
}
.bc-mask-hover[data-type="fromTop"] .bc-mask-hover__content-wrapper{
top: 0;
-webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
}
.bc-mask-hover[data-type="fromCenter"] .bc-mask-hover__content-wrapper{
top: 50%;
-webkit-clip-path: polygon(0 50%, 100% 50%, 100% 50%, 0 50%);
clip-path: polygon(0 50%, 100% 50%, 100% 50%, 0 50%);
transform: translateY(-50%);
}
.bc-mask-hover[data-type="fromBottom"] .bc-mask-hover__content-wrapper{
top: 0;
-webkit-clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%);
clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%);
}
.bc-mask-hover:hover .bc-mask-hover__content-wrapper{
-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}
.brx-body.iframe .bc-mask-hover[data-openatbuilder="1"] .bc-mask-hover__content-wrapper{
-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}