Загрузка данных

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
    <title>Вредные советы</title>
    <style>
        body {
            font-family: "Times New Roman", Times, serif;
            background-color: #f4f4f4;
            display: flex;
            justify-content: center;
            padding: 40px 20px;
        }

        /* Главный контейнер-документ */
        .document-container {
            background-color: #ffffff;
            border: 1px solid #333333;
            width: 550px;
            padding: 20px 25px;
            box-sizing: border-box;
        }

        /* Верхняя короткая линия */
        .top-line {
            width: 140px;
            height: 3px;
            background-color: #333333;
            margin: 0 auto 15px auto;
        }

        /* Блок с автором и названием книги */
        .header-text {
            margin-bottom: 8px;
        }

        .author {
            font-size: 14px;
            color: #000000;
            margin-bottom: 2px;
        }

        .book-title {
            font-size: 13px;
            text-transform: uppercase;
            font-weight: bold;
            color: #000000;
        }

        /* Средняя длинная линия */
        .middle-line {
            width: 100%;
            height: 1px;
            background-color: #333333;
            margin-bottom: 15px;
        }

        /* Блок со стихотворением */
        .poem {
            font-size: 14px;
            line-height: 1.4;
            color: #000000;
            margin-bottom: 20px;
        }

        /* Нижняя жирная линия */
        .bottom-line {
            width: 100%;
            height: 4px;
            background-color: #333333;
        }
    </style>
</head>
<body>

    <div class="document-container">
        <!-- Верхняя короткая линия -->
        <div class="top-line"></div>
        
        <!-- Автор и заголовок -->
        <div class="header-text">
            <!-- «Григорий Остер» -->
            <div class="author">&#1043;&#1088;&#1080;&#1075;&#1086;&#1088;&#1080;&#1081; &#1054;&#1089;&#1090;&#1077;&#1088;</div>
            <!-- «ВРЕДНЫЕ СОВЕТЫ» -->
            <div class="book-title">&#1042;&#1056;&#1045;&#1044;&#1053;&#1067;&#1045; &#1057;&#1054;&#1042;&#1045;&#1058;&#1067;</div>
        </div>
        
        <!-- Средняя разделительная линия -->
        <div class="middle-line"></div>
        
        <!-- Текст стиха -->
        <div class="poem">
            <!-- «Руками никогда нигде» -->
            &#1056;&#1091;&#1082;&#1072;&#1084;&#1080; &#1085;&#1080;&#1082;&#1086;&#1075;&#1076;&#1072; &#1085;&#1080;&#1075;&#1076;&#1077;<br>
            <!-- «Не трогай ничего.» -->
            &#1053;&#1077; &#1090;&#1088;&#1086;&#1075;&#1072;&#1081; &#1085;&#1080;&#1095;&#1077;&#1075;&#1086;.<br>
            <!-- «Не впутывайся ни во что» -->
            &#1053;&#1077; &#1074;&#1087;&#1091;&#1090;&#1099;&#1074;&#1072;&#1081;&#1089;&#1103; &#1085;&#1080; &#1074;&#1086; &#1095;&#1090;&#1086;<br>
            <!-- «И никуда не лезь.» -->
            &#1048; &#1085;&#1080;&#1082;&#1091;&#1076;&#1072; &#1085;&#1077; &#1083;&#1077;&#1079;&#1100;.
        </div>
        
        <!-- Нижняя жирная линия -->
        <div class="bottom-line"></div>
    </div>

</body>
</html>