В файле media заданы размеры шрифтов в зависимости от ширины экрана:

 @media only screen and (max-width: 1100px) {
    p, a  {font-size: 13px; }
}
 
@media only screen and (max-width: 1000px) {
    p, a  {font-size: 12px; }
} 

То есть, при ширине экрана до 1000 пикселей будет шрифт 12рх, а при ширине до 1100 пикселей будет шрифт 13рх.

Так оно и происходит и все стили, содержащие выраженный в процентах значения font-size, послушно следуют этому правилу.

А вот с h1, h2, h3 проблема! Эти параметры заданы так:

h1, h2, h3 {font-weight:bold; font-size:100%} 

<h1> Наш клуб</h1> 

Но их размер остается неизменным!

И только если внести h1, h2, h3 в media, соответствующий текст начинает меняться в размерах аналогично другим классам.

Почему так?
Что, h1, h2, h3 - они какие-то особенные?

Нет, просто браузер выполняет твои установки в css, т.к. эти тэги не внесены в @media, то и с какого рожна у них должно что-то меняться.

_____________
Gear Framework
Gear Framework на Github

Вот есть класс:

.dalee {font-size:100%; text-align: right;} 
h1, h2, h3 {text-align:center; font-size:100%} 

Если я правильно понимаю, то здесь размер шрифта исчисляется от заданного в браузере по умолчанию или назначенного исходного значения.
Можно ли эту назначенную величину занести в медиа, чтобы при изменении ширины экрана автоматически изменялись все шрифты во всех коассах и тегах, исчисляемые в процентах?

Вот такая комбинация почему-то не распростраяет свое действие на теги Н1, Н2, Н3:

@media only screen and (max-width: 1100px) { 
        p, a  {font-size: 13px; } 
html, body  {font-size:13px} 
}

Владимир55
При 100% размер берётся от размера шрифта родительского элемента.

_____________
Gear Framework
Gear Framework на Github