Типографика

Размеры и начертания шрифтов для конкретного использования, а также вертикальный ритм.

Медиапроекты

Используются шрифты Roboto и Roboto Slab.

Для основного текста показываются разные начертания и шрифты для разных платформ:

— Windows Vista и старше: Roboto Regular;
— MacOS: Roboto Light;
— Windows XP: Arial.

Заголовок нулевого уровня до 1280px
@fontH0Media
font-size: 44px;
line-height: 52px;
font-weight: bold;
Заголовок нулевого уровня на 1024px
@fontH0ResponsiveMedia
font-size: 40px;
line-height: 48px;
font-weight: bold;
Заголовок первого уровня до 1280px
@fontH1Media
font-size: 32px;
line-height: 40px;
font-weight: bold;
Заголовок первого уровня на 1024px
@fontH1ResponsiveMedia
font-size: 30px;
line-height: 40px;
font-weight: bold;
Заголовок второго уровня до 1280px
@fontH2Media
font-size: 24px;
line-height: 32px;
font-weight: bold;
Заголовок второго уровня на 1024px
@fontH2ResponsiveMedia
font-size: 20px;
line-height: 28px;
font-weight: bold;
Заголовок третьего уровня до 1280px
@fontH3Media
font-size: 20px;
line-height: 28px;
font-weight: bold;
Заголовок третьего уровня на 1024px
@fontH3ResponsiveMedia
font-size: 17px;
line-height: 24px;
font-weight: bold;
Заголовок четвертого уровня до 1280px
@fontH4Media
font-size: 17px;
line-height: 24px;
font-weight: bold;
Заголовок четвертого уровня на 1024px
@fontH4ResponsiveMedia
font-size: 15px;
line-height: 20px;
font-weight: bold;
Основной наборный текст до 1280px
@fontBodyMedia
font-size: 17px;
line-height: 24px;
font-weight: regular (Windows) / light (OSX);
Основной наборный текст на 1024px
@fontBodyResponsiveMedia
font-size: 15px;
line-height: 20px;
font-weight: regular (Windows) / light (OSX);
Шрифт для ссылок в списке
@fontLinkSecondaryMedia
font-size: 15px;
line-height: 20px;
font-weight: regular (Windows) / light (OSX);
Шрифт для ссылок возле картинок
@fontLinkMedia
font-size: 17px;
line-height: 24px;
font-weight: regular (Windows) / light (OSX);
Шрифт для сносок
@fontFootnoteMedia
font-size: 13px;
line-height: 20px;
font-weight: regular (Windows) / light (OSX);
Цитата полноэкранная до 1280px
@fontQuoteFullscreenMedia
font-size: 32px;
line-height: 40px;
font-family: slab;
Цитата полноэкранная на 1024px
@fontQuoteFullscreenResponsiveMedia
font-size: 30px;
line-height: 40px;
font-family: slab;
Шрифт для оформления цитат
@fontQuoteMedia
font-size: 30px;
line-height: 40px;
font-family: slab;
Шрифт для оформления лида до 1280px
@fontLeadMedia
font-size: 20px;
line-height: 28px;
font-family: slab;
Шрифт для оформления лида на 1024px
@fontLeadResponsiveMedia
font-size: 17px;
line-height: 24px;
font-family: slab;
Шрифт для текста в карточках до 1280px
@fontCardMedia
font-size: 17px;
line-height: 24px;
font-family: slab;
Шрифт для текста в карточках на 1024px
@fontCardResponsiveMedia
font-size: 15px;
line-height: 20px;
font-family: slab;
Шрифт для текста в тегах
@fontTagMedia
font-size: 10px;
line-height: 12px;
font-family: slab;
font-weight: bold;
text-transform: uppercase;
letter-spacing: 0.5;
Шрифт для пояснений к рейтингам
@fontRatingMedia
font-size: 10px;
line-height: 12px;
font-weight: normal;
Шрифт в кнопках и инпутах
@fontControlMedia
font-size: 15px;
line-height: 20px;
font-weight: regular (Windows) / light (OSX);
Шрифт во вкладках
@fontTabMedia
font-size: 17px;
line-height: 24px;
font-weight: regular (Windows) / light (OSX);
Шрифт активной вкладки
@fontTabActiveMedia
font-size: 17px;
line-height: 24px;
font-weight: bold;