Tell us what’s happening:
When I put my code in everything looks right except the first one .hero-title appears black like it is not put in correctly.
Your code so far
@media only screen and (max-width: 550px) {
.hero-title {font-size: 6rem}
.hero-subtitle {font-size: 1.8rem}
.author {font-size: 1.8rem}
.quote {font-size: 1.8rem}
.list-title {font-size: 1.8rem}
.social-icons {font-size: 2rem}
.text {font-size: 1.6rem}}
Your browser information:
User Agent is: Mozilla/5.0 (X11; CrOS x86_64 14816.82.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/103.0.0.0 Safari/537.36
Challenge: Learn CSS Grid by Building a Magazine - Step 79
Link to the challenge: