Custom CSS only working in Editor not live.

Hello,

I am hoping some one can help me. I added some customer code for a hover to reveal effect. It was working yesterday and I log in to day and now it only works in the editor. I have not changed anything so I am not sure what is going on. Any help would be appreciated.

@media only screen and (min-width: 640px){
#block-yui_3_17_2_1_1696814915891_3894 {
opacity: 0;
 transition: opacity 1s
}

#block-yui_3_17_2_1_1696814915891_3894:hover {
opacity: 1;
transition: opacity 1s
}
}

1 hour ago, lsmith said:

Hello,

I am hoping some one can help me. I added some customer code for a hover to reveal effect. It was working yesterday and I log in to day and now it only works in the editor. I have not changed anything so I am not sure what is going on. Any help would be appreciated.

 

@media only screen and (min-width: 640px){
#block-yui_3_17_2_1_1696814915891_3894 {
opacity: 0;
 transition: opacity 1s
}

#block-yui_3_17_2_1_1696814915891_3894:hover {
opacity: 1;
transition: opacity 1s
}
}

Can you share your website URL?

Yes it is www.firstmiletherapy.com.

11 minutes ago, lsmith said:

Yes it is www.firstmiletherapy.com.

For which block did you add the css code? Can you send me a screenshot?

Yes I have attached an image. It is on the About Me page under the Guiding Principles. I circled in red.

Change your code to this

@media only screen and (min-width: 768px){
#block-yui_3_17_2_1_1696814915891_3894 {
opacity: 0 !important;
 transition: opacity 1s !important;
}

#block-yui_3_17_2_1_1696814915891_3894:hover {
opacity: 1 !important;
transition: opacity 1s !important;
}}