CSS not recognizing HTML Class

Hey, i just started with html and css and i’m having this issue. I checked the code and everything seems fine.
This is probably a rookie mistake, so i apologise in advance.

The class css is not recognizing is “encabezado-nosotros”

The css is supposed to change the “font-weight” from 700 (the h2 standard) to 300.

Html code:

<section class="contenedor seccion">
    <h2 class="encabezado-nosotros"> Más sobre nosotros </h2>
    <div class="iconos-nosotros">
      <div class="icono">
        <img src="/img/icono1.svg" alt="Ícono seguridad">
        <h3>Seguridad</h3>
        <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Vel quam eaque nobis minus consequuntur unde,
          eveniet
          aut quisquam. Similique commodi dolore iusto quas corrupti recusandae odio possimus quam et at.</p>
      </div>

      <div class="icono"> <img src="/img/icono2.svg" alt="Ícono precio">
        <h3>El mejor precio</h3>
        <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Minus ullam fuga possimus dolorum atque dolore
          debitis voluptas, dolores doloremque. Laudantium, corporis. Iure quidem repellat suscipit et aperiam illo
          perferendis accusamus?</p>
      </div>

      <div class="icono">
        <img src="/img/icono3.svg" alt="Ícono tiempo">
        <h3>A tiempo</h3>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorum blanditiis vero maiores consequatur quidem
          molestias temporibus similique? Eos ratione ipsa, obcaecati consequuntur eligendi aperiam, reiciendis qui enim
          sequi pariatur amet!</p>
      </div>
    </div>
  </section>

Css code:

/** Íconos nosotros **/

.encabezado-nosotros {
    font-weight: 300;
}

.iconos-nosotros {
    display: flex;
    justify-content: space-between;
}
.icono {
    flex-basis: calc(33.3% - 1rem);
    text-align: center;
}
.icono h3 {
    text-transform: uppercase;
}

Your code looks right to me and I even dumped it into Codepen and commented out the css code for class encabezado-nosotros to check if I could see the text changing from bold to less bold and I was able to.

What Editor are you using? Also, have you tried changing internet browsers? Some people in the forum have better success on Chrome over other browsers.

Is this a problem to a challenge? If so can you link the challenge in this forum. As @JohnJohn said, if it is still causing a problem, you can try using a different browser. Chrome is the official supported browser for FCC. Next time if it is a challenge and you need help, you can try using the Ask for Help Button on the challenge:

I don’t see why it shouldn’t work. If you add color: red to the selector does it change the text color?

Thank you for your response!
I’m on Google Chrome and i’m using Visual Studio Code as editor.
I tried changing the color and it does work! But, for some reason, it doesn’t change the font-weight: 300 ;. I tried using Internet Explorer and Firefox but the font weight still the same.

Also, the font-size is a h2 standar size, which i think is 1.5 em. I read on a forum that if the size was too small, it wouldn’t display the font weight, but it’s not my case.

I just “fixed it”. What i did was downloading a font in google fonts and added the 300 style to it. When i linked the font to the css, it recognized the “font-weight” and worked.
It seems that the probem was that the “default” style doesn’t support 300 weight, or something. Not really sure about how that works.
Thank you all for participating !