@media работает только на одну страницу

пишу адаптацию для мобильной версии сайта. У меня на сайте находятся карточки которые выстроены по три в ряд, для мобильной версии хочу чтобы они стояли одна в ряду. Так работает только для одной из страниц, на трех других они выстраиваются по две в ряд и заметно уменьшают размер текста. Пробовал копировать код с первой страницы на другие, хотя код там и так одинаковый, все равно выстраиваются по две в ряд. Самый нижний код- работает, тот что над ним, нет.

На всякий пожарный напишу еще раз. Есть 4 страницы, на каждой странице по пять карточек с животными (в примерах ниже одна такая карточка), при уменьшении экрана до мобильной версии (425px) все карточки должны выстраиваться в один ряд. Нижняя часть кода так и делает, а верхний выстраивает карточки по две в ряд, что мне не подходит.

Сейчас посмотрел код через браузер, @media screen and (max-width:425px) работает только на первой странице, на трех других он не применяется.

@media screen and (max-width: 1024px), (min-width:426px) {
  .news-row {
    overflow-x: hidden;
    grid-auto-flow:row;
    grid-template-columns: repeat(2, 1fr);
  }
  .news-item {
    min-width: auto;
  }
}
@media screen and (max-width:425px) {
  .header__logo {
    font-size: 35px;
  }
  .description {
    font-size: 16px;
  }
  .news-row {
    overflow-x: hidden;
    grid-auto-flow:row;
    grid-template-columns: 1fr;
  }
  .nav_link {
    font-size: 15px;
    padding: 17px 3px;
  }
  .news-item {
    margin: auto;
  }
}
.news-item{
  border-color: #f6f6f6;
  border-radius: 20px;
  min-height: 150px;
  width: 357px;
  padding: 50px 3px 50px 30px;
  min-width: auto;
  margin: 0 0 0 70px;
}
<section class="turtle">
  <div class="container5">
  <div class="news-row">

<article class="news-item">
        <div class="news_thumb">
          <img src="../ReptHelp/assets/images/asian-turtle.jpg" alt="миниатюра">
        </div>
        <h3 class="news-title">
          <a class="post" href="poloz.html">Среднеазиатская черепаха</a>
        </h3>
          <div class="news-description">
          </div>
      </article>
</div>
</div>
</section>
<section class="lizard">
    <div class="container3">
    <div class="news-row">
     <!-- //* первый *// -->
        <article class="news-item">
          <div class="news_thumb">
            <img src="../ReptHelp/assets/images/lizard/eu.jpg" alt="миниатюра">
          </div>
          <h3 class="news-title">
            <a class="post" href="eublefar.html">Эублефар</a>
          </h3>
            <div class="news-description">
              Маленький питомец, который не оставит вас равнодушным 
            </div>
        </article>
  </div>
  </div>
</section>

Ответы (0 шт):