.highlight-hover-effect {
width: 100%;
max-width: 100%;
}
.highlight-hover-effect > .highlight-hover-effect-child {
padding: 0 calc(20px - 0.32em) 0 20px;
text-align: justify;
}
.highlight-hover-effect p {
display: inline;
line-height: 20px;
background-image: linear-gradient(to bottom, #f5f5f5 0%, #f5f5f5 100%);
background-size: 0 100%;
background-repeat: no-repeat;
background-position: 0 0;
overflow: hidden;
padding: 2px 0;
transition: background-size .8s linear .5s, box-shadow .5s ease-out;
}
.highlight-hover-effect:hover p {
background-size: 100% 100%;
box-shadow: calc(20px - 0.32em) 0 0 #f5f5f5, -20px 0 0 #f5f5f58;
transition: background-size .8s linear, box-shadow .5s ease-out .8s;
}