CSS, Codepen and Elementor

Does anyone know why the following CSS animation doesn't work?

.btn hover {

box-shadow: 0 6px 18px 0 rgba(#000, 0.1);

transform: translateY(-6px);


&–transparent {

color: $primary;

background-color: transparent;


I'm trying to apply the 'Transform + Shadow' effect seen on button 5

I don't want any of the button styling, I just want to take the animation and apply it to my own button.

Is something like this possible?

I have named my button class, btn to follow the HTML and applied the following code in Elementor.

Nothing happens and it throws up the following errors:

Expected end of value but found 'rgba (#000 , 0.1)

Unexpected token '&' at line 5, col 3.

Unexpected token '-' at line 5, col 4.

Unexpected token '$' at line 6, col 12.

Written by Odikadoo

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Elementor is completely broken in a fresh WP site

How do I make underline for menus with submenus?