CSS Confusion

Question

Hi, I have a question.
I am a complete noob in programming, please bear with me.
While I play around with the CSS codes, I enter these codes:
body {
.pgrap {
font-style: "Times New Roman", serif;
font-size: x-large;
font-weight: bolder;
color: red;
}
}
.pgrap {
font-style: "Times New Roman", serif;
font-size: x-large;
font-weight: bolder;
color: red;
}
Somehow, those with the body {} tags don't reflect any changes on the CSS while those that are without body {} tags do.
I don't get it why the body {} tags won't function.

Answer 1

Hello.
That first css code you wrote is not actually CSS, it's SASS/SCSS.
SASS is used to write CSS codes faster and in better way like a programming language where you can have variables, loops etc.
But you can't directly run SASS on a website so you have to compile that code into normal CSS code which will look like the second code.
if you want to run it on Sololearn playground you have to use reference from this code
https://code.sololearn.com/WKNQYtDaiK6q/?ref=app

Answer 2

Thanks, Rick. i'll keep that in mind until I come to that part.