Animate icons on load using a code block

Hi,

I have a code block with the following HTML to display an icon:

<span class="material-icons-outlined-blue">call</span>

And CSS to style the icon:

.material-icons-outlined-blue {
  font-family: 'Material Icons Outlined';
  font-weight: 100;
  font-style: normal;
  font-size: 24px;  /* Preferred icon size */
  display: inline-block;
  color: #000840;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
  padding-left: 0.1 em;

}
 

However, when the page loads the icons do not animate like the text and images on the page. I guess this is because its a code block, and the Squarespace animation is not being applied.

How can I get the code block to animate on page load, so that it works the same as the Squarespace elements?

URL: https://orb-robin-wn9f.squarespace.com/locations

Password: 1ndigo