From afffeec98499de6d6ac8457d4b0562fac6504bda Mon Sep 17 00:00:00 2001
From: Ruslan Gaziev <grinrus@yandex.ru>
Date: Mon, 10 Jan 2022 16:23:35 +0300
Subject: [PATCH] =?UTF-8?q?=D0=92=D0=BD=D0=B5=D1=81=D0=B5=D0=BD=D1=8B=20?=
 =?UTF-8?q?=D0=B8=D1=81=D0=BF=D1=80=D0=B0=D0=B2=D0=BB=D0=B5=D0=BD=D0=B8?=
 =?UTF-8?q?=D1=8F=20=D0=BF=D0=BE=D1=81=D0=BB=D0=B5=20=D0=BF=D0=B5=D1=80?=
 =?UTF-8?q?=D0=B2=D0=BE=D0=B3=D0=BE=20=D1=80=D0=B5=D0=B2=D1=8C=D1=8E?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 index.html       | 90 ++++++++++++++++++++++++------------------------
 styles/style.css | 23 ++++++++-----
 2 files changed, 59 insertions(+), 54 deletions(-)

diff --git a/index.html b/index.html
index 2c954cd..fd83d6c 100644
--- a/index.html
+++ b/index.html
@@ -16,8 +16,8 @@ <h1 class="header__title">Научиться учиться</h1>
       <p class="header__subtitle">Какие современные и эффективные подходы к обучению вы можете использовать в своей жизни?
         <a class="header__link" href="#">Узнать &rarr;</a>
       </p>
-      <div class="header__squre-pic"></div>
-      <img class="header__main-illustration" alt="Ученик пришел домой" src="./images/header-image.png">
+      <div class="header__square-pic"></div>
+      <img class="header__main-illustration" alt="Картина Опять двойка" src="./images/header-image.png">
     </header>
 
     <main class="content">
@@ -86,73 +86,73 @@ <h3 class="table__heading">1889 год</h3>
       </section>
 
       <section class="feynman">
-        <h2 class="fyeman__title">Метод Фейнмана</h2>
-        <h3 class="feyman__subtitle">Выучить и не забыть.</h3>
-        <a class="feyman__link" href="#">Подробнее &rarr;</a>
+        <h2 class="fyenman__title">Метод Фейнмана</h2>
+        <p class="feynman__subtitle">Выучить и не забыть.</p>
+        <a class="feynman__link" href="#">Подробнее &rarr;</a>
       </section>
 
       <section class="kaufman">
 
         <div class="kaufman__triangle"></div>
 
-        <h2 class="section-title_theme_dark">Принципы обучения</h2>
+        <h2 class="section-title section-title_theme_dark">Принципы обучения</h2>
 
-        <p class="section-subtitle_theme_dark">от Джоша Кауфмана</p>
+        <p class="section-subtitle section-subtitle_theme_dark">от Джоша Кауфмана</p>
 
-        <div class="table__theme_dark">
+        <div class="table table_theme_dark">
 
-          <div class="table__cell_theme_dark">
-            <h3 class="table__heading_theme_dark">1</h3>
-            <p class="table__text_theme_dark">Выберите привлекательный проект.</p>
+          <div class="table__cell table__cell_theme_dark">
+            <h3 class="table__heading table__heading_theme_dark">1</h3>
+            <p class="table__text table__text_theme_dark">Выберите привлекательный проект.</p>
           </div>
 
-          <div class="table__cell_theme_dark">
-            <h3 class="table__heading_theme_dark">2</h3>
-            <p class="table__text_theme_dark">Сосредоточьтесь на каком-то одном навыке.</p>
+          <div class="table__cell table__cell_theme_dark">
+            <h3 class="table__heading table__heading_theme_dark">2</h3>
+            <p class="table__text table__text_theme_dark">Сосредоточьтесь на каком-то одном навыке.</p>
           </div>
 
-          <div class="table__cell_theme_dark">
-            <h3 class="table__heading_theme_dark">3</h3>
-            <p class="table__text_theme_dark">Определите целевой уровень мастерства.</p>
+          <div class="table__cell table__cell_theme_dark">
+            <h3 class="table__heading table__heading_theme_dark">3</h3>
+            <p class="table__text table__text_theme_dark">Определите целевой уровень мастерства.</p>
           </div>
 
-          <div class="table__cell_theme_dark">
-            <h3 class="table__heading_theme_dark">4</h3>
-            <p class="table__text_theme_dark">Разбейте навык на элементы.</p>
+          <div class="table__cell table__cell_theme_dark">
+            <h3 class="table__heading table__heading_theme_dark">4</h3>
+            <p class="table__text table__text_theme_dark">Разбейте навык на элементы.</p>
           </div>
 
-          <div class="table__cell_theme_dark">
-            <h3 class="table__heading_theme_dark">5</h3>
-            <p class="table__text_theme_dark">Приготовьте всё необходимое для занятий.</p>
+          <div class="table__cell table__cell_theme_dark">
+            <h3 class="table__heading table__heading_theme_dark">5</h3>
+            <p class="table__text table__text_theme_dark">Приготовьте всё необходимое для занятий.</p>
           </div>
 
-          <div class="table__cell_theme_dark">
-            <h3 class="table__heading_theme_dark">6</h3>
-            <p class="table__text_theme_dark">Устраните препятствия для занятий.</p>
+          <div class="table__cell table__cell_theme_dark">
+            <h3 class="table__heading table__heading_theme_dark">6</h3>
+            <p class="table__text table__text_theme_dark">Устраните препятствия для занятий.</p>
           </div>
 
-          <div class="table__cell_theme_dark">
-            <h3 class="table__heading_theme_dark">7</h3>
-            <p class="table__text_theme_dark">Выделите специальное время для занятий.</p>
+          <div class="table__cell table__cell_theme_dark">
+            <h3 class="table__heading table__heading_theme_dark">7</h3>
+            <p class="table__text table__text_theme_dark">Выделите специальное время для занятий.</p>
           </div>
 
-          <div class="table__cell_theme_dark">
-            <h3 class="table__heading_theme_dark">8</h3>
-            <p class="table__text_theme_dark">Создайте быстрые петли обратной связи.</p>
+          <div class="table__cell table__cell_theme_dark">
+            <h3 class="table__heading table__heading_theme_dark">8</h3>
+            <p class="table__text table__text_theme_dark">Создайте быстрые петли обратной связи.</p>
           </div>
 
-          <div class="table__cell_theme_dark">
-            <h3 class="table__heading_theme_dark">9</h3>
-            <p class="table__text_theme_dark">Занимайтесь по расписанию, короткими интенсивными интервалами.</p>
+          <div class="table__cell table__cell_theme_dark">
+            <h3 class="table__heading table__heading_theme_dark">9</h3>
+            <p class="table__text table__text_theme_dark">Занимайтесь по расписанию, короткими интенсивными интервалами.</p>
           </div>
 
-          <div class="table__cell_theme_dark">
-            <h3 class="table__heading_theme_dark">10</h3>
-            <p class="table__text_theme_dark">Уделяйте внимание количеству и скорости.</p>
+          <div class="table__cell table__cell_theme_dark">
+            <h3 class="table__heading table__heading_theme_dark">10</h3>
+            <p class="table__text table__text_theme_dark">Уделяйте внимание количеству и скорости.</p>
           </div>
         </div>
 
-        <img class="kaufman__triangle" alt="Синий треугольник" src="./images/kaufman-triangle.svg">
+        <div class="kaufman__triangle"></div>
 
       </section>
     </main>
@@ -161,13 +161,13 @@ <h3 class="table__heading_theme_dark">10</h3>
 
       <div class="footer__columns">
 
-        <div class="footer__column_content_copyright">
+        <div class="footer__column footer__column_content_copyright">
           <div class="logo logo_place_footer"></div>
           <p class="footer__author"> &copy; 2021. Руслан Газиев</p>
         </div>
 
-        <div class="footer__column_content_info">
-          <p class="footer__column-heading">О Практикуме</p>
+        <nav class="footer__column footer__column_content_info">
+          <h2 class="footer__column-heading">О Практикуме</h2>
             <ul class="footer__column-links">
               <li>
                 <a class="footer__column-link" href="#">Главная</a>
@@ -179,10 +179,10 @@ <h3 class="table__heading_theme_dark">10</h3>
                 <a class="footer__column-link" href="#">Наставник</a>
               </li>
             </ul>
-        </div>
+          </nav>
 
-        <div class="footer__column_content_social">
-          <p class="footer__column-heading">Соцсети</p>
+        <div class="footer__column footer__column_content_social">
+          <h2 class="footer__column-heading">Соцсети</h2>
           <ul class="footer__column-links">
             <li>
               <a class="footer__column-link" href="#"><img alt="Логотип Фейсбук" src="./images/facebook_color_white.svg"> Facebook</a>
diff --git a/styles/style.css b/styles/style.css
index fefc5f0..635c58a 100644
--- a/styles/style.css
+++ b/styles/style.css
@@ -45,7 +45,7 @@
   justify-content: center;*/
   line-height: 96px;
   font-size: 102px;
-  margin: 64px;
+  margin: 0 0 0 64px;
   z-index: 1;
 
   /*border: 1px solid red;*/
@@ -59,6 +59,7 @@
   line-height: 25px;
   font-size: 18px;
   z-index: 1;
+  margin: 0;
 
   /*border: 1px solid red;*/
 }
@@ -75,7 +76,7 @@
 }
 
 /* ниже мы привели пример двух селекторов, чтобы вы вспомнили запись элемента */
-.header__squre-pic {
+.header__square-pic {
   height: 568px;
   width: 568px;
   background-color: #2f80ed;
@@ -194,11 +195,11 @@
   line-height: 1.2;
   font-size: 18px;
   font-weight: normal;
-  margin-bottom: 20px;
+  margin: 20px 0 0 0;
 }
 
 .table__text:last-child {
-  margin-bottom: 0;
+  margin: 20px 0 0 0;
 }
 
 .feynman {
@@ -214,7 +215,7 @@
   position: relative;
 }
 
-.fyeman__title {
+.fyenman__title {
   /*display: block;*/
   line-height: 1.15;
   font-size: 120px;
@@ -226,7 +227,7 @@
   /*border: 1px solid red;*/
 }
 
-.feyman__subtitle {
+.feynman__subtitle {
   /*display: block;*/
   line-height: 51px;
   font-size: 36px;
@@ -237,7 +238,7 @@
   /*border: 1px solid red;*/
 }
 
-.feyman__link {
+.feynman__link {
   line-height: 51px;
   font-size: 36px;
   font-weight: normal;
@@ -286,7 +287,7 @@
   /*border: 1px solid red;*/
 }
 
-.table__theme_dark {
+.table_theme_dark {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
@@ -322,9 +323,11 @@
   }
 
 .kaufman__triangle {
+  background-image: url(../images/kaufman-triangle.svg);
+  background-size: cover;
   width: 877px;
   height: 877px;
-  color: #2f80ed;
+  /*color: #2f80ed;*/
   position: absolute;
   top: 0;
   right: -210px;
@@ -361,6 +364,8 @@
 
 .logo_place_footer {
   background-image: url(../images/logo_place_footer.svg);
+  width: 183px;
+  height: 35px;
 }
 
 .footer__author {