Use a CSS Class to Style an Element get stacked

Tell us what’s happening:

I stacked in this question I want the result to be red but it remains black
So how can I change the “catphoto app to red”

Your code so far

<style>
 Class.red-text{color:red;}
</style>
<h2>catphotoApp</h2>

<p>Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>

Your browser information:

Your Browser User Agent is: Mozilla/5.0 (Linux; Android 6.0.1; SM-A500FU Build/MMB29M) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.107 Mobile Safari/537.36.

Link to the challenge:
https://www.freecodecamp.org/challenges/use-a-css-class-to-style-an-element

You need to pay attention to the lesson information. You define CSS classes by putting a dot in front of the name, like so .my-css-class . You don’t need to write ‘Class’ or anything. Then you apply it to an element like this

<p class="my-css-class"></p>