<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<title></title>
<style>
@import url('https://fonts.googleapis.com/css?family=Cantata+One|Noto+Serif|PT+Serif|Tinos|Unna&display=swap');
body { font-family: 'Cantata One', serif; }
#footer { width: 100%; border: 1px solid #ccc; -webkit-border-radius: 15px/12px; -moz-border-radius: 15px/12px; border-radius: 15px/12px; text-align: center; padding: 5px; }
#copy_host_year { border: 1px solid #ccc; -webkit-border-radius: 15px/12px; -moz-border-radius: 15px/12px; border-radius: 15px/12px; display: inline-block; }
#copy { border: 1px solid #f00; font-size: 300%; font-family: 'Cantata One', serif; display: inline-block; -webkit-transform: rotateY(180deg);} -moz-transform: rotateY(180deg);} -o-transform: rotateY(180deg);} -ms-transform: rotateY(180deg);} transform: rotateY(180deg); }
#year_start { font-weight: bold; font-size: 50px; font-family: 'Noto Serif', serif;}
</style>
<script src="/js/host_year.js"></script>
</head>
<body>
<div id="footer">
<div id="copy_host_year">
<span id="copy">©</span>
<span id="host"></span><br>
<span id="year_start"></span>
</div>
<div id="kalendar">
</div>
</div>
<span style="font-family: 'PT Serif', serif; font-weight: bold; ">0 1 2 3 4 5 6 7 8 9«г»</span><br>
Aa Bb Сс Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Оо Рр Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz<br>
Аа Бб Вв Гг Ґґ Дд Ее Ёё Жж Зз Ии Йй Її Іі Кк Лл Мм Нн Оо Пп Рр Сс Тт Уу Ўў Фф Хх Цц Чч Шш Щщ Ъъ Ыы Ьь Ээ Єє Юю Яя
</body>
</html>
почему в 22 строке шрифт не срабатывает, а в 27 всё работает?