From 63b1b7a8aae6014711c4ab7096418704be7c2225 Mon Sep 17 00:00:00 2001
From: Daiana Kutasevych <dayasya2@gmail.com>
Date: Mon, 19 Aug 2024 16:37:42 +0100
Subject: [PATCH] fix footer

---
 css/styles.css   |  8 +++++---
 images/icons.svg | 10 +++++-----
 index.html       | 18 ++++++++----------
 3 files changed, 18 insertions(+), 18 deletions(-)

diff --git a/css/styles.css b/css/styles.css
index 17b8b60..118dc7d 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -421,9 +421,11 @@ img {
 
 .footer .container {
   display: flex;
+  align-items: baseline;
 }
 
 .footer-text-wrap {
+  margin-right: 120px;
 }
 
 .footer-logo {
@@ -450,7 +452,6 @@ img {
 }
 
 .footer-socials-wrap {
-  margin-left: 120px;
   max-width: 208px;
 }
 .footer-social-title {
@@ -478,10 +479,11 @@ img {
   transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1);
 }
 .footer-socials-icon {
-  fill: white;
+  fill: #f4f4fd;
 }
 
 .footer-list-link:hover,
-.footer-list-link:focus {
+.footer-list-link:focus,
+.footer-list-link:active {
   background-color: #31d0aa;
 }
diff --git a/images/icons.svg b/images/icons.svg
index c7f79f4..c5f3814 100644
--- a/images/icons.svg
+++ b/images/icons.svg
@@ -1,17 +1,17 @@
 <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" style="position:absolute;width:0;height:0;overflow:hidden">
   <defs>
     <symbol id="linkedin-icon" viewBox="0 0 32 32">
-      <path fill="#f4f4fd" d="M31.992 32v-.001H32V20.263c0-5.741-1.236-10.164-7.948-10.164-3.227 0-5.392 1.771-6.276 3.449h-.093v-2.913h-6.364v21.364h6.627V21.42c0-2.785.528-5.479 3.977-5.479 3.399 0 3.449 3.179 3.449 5.657v10.401h6.62zM.528 10.636h6.635V32H.528V10.636zM3.843 0C1.722 0 0 1.721 0 3.843s1.721 3.879 3.843 3.879c2.121 0 3.843-1.757 3.843-3.879A3.846 3.846 0 0 0 3.843 0z" style="fill:var(--color1, #f4f4fd)"/>
+      <path  d="M31.992 32v-.001H32V20.263c0-5.741-1.236-10.164-7.948-10.164-3.227 0-5.392 1.771-6.276 3.449h-.093v-2.913h-6.364v21.364h6.627V21.42c0-2.785.528-5.479 3.977-5.479 3.399 0 3.449 3.179 3.449 5.657v10.401h6.62zM.528 10.636h6.635V32H.528V10.636zM3.843 0C1.722 0 0 1.721 0 3.843s1.721 3.879 3.843 3.879c2.121 0 3.843-1.757 3.843-3.879A3.846 3.846 0 0 0 3.843 0z" />
     </symbol>
     <symbol id="facebook-icon" viewBox="0 0 32 32">
-      <path fill="#f4f4fd" d="M21.329 5.313h2.921V.225C23.746.156 22.013 0 19.994 0c-4.212 0-7.097 2.649-7.097 7.519V12H8.249v5.688h4.648V32h5.699V17.689h4.46l.708-5.688h-5.169V8.082c.001-1.644.444-2.769 2.735-2.769z" style="fill:var(--color1, #f4f4fd)"/>
+      <path d="M21.329 5.313h2.921V.225C23.746.156 22.013 0 19.994 0c-4.212 0-7.097 2.649-7.097 7.519V12H8.249v5.688h4.648V32h5.699V17.689h4.46l.708-5.688h-5.169V8.082c.001-1.644.444-2.769 2.735-2.769z"/>
     </symbol>
     <symbol id="twitter-icon" viewBox="0 0 32 32">
-      <path fill="#f4f4fd" d="M32 6.078c-1.19.522-2.458.868-3.78 1.036a6.523 6.523 0 0 0 2.886-3.626 13.11 13.11 0 0 1-4.16 1.588A6.574 6.574 0 0 0 22.154 3c-3.632 0-6.556 2.948-6.556 6.562 0 .52.044 1.02.152 1.496-5.454-.266-10.28-2.88-13.522-6.862a6.605 6.605 0 0 0-.898 3.316 6.57 6.57 0 0 0 2.914 5.452 6.479 6.479 0 0 1-2.964-.808v.072c0 3.188 2.274 5.836 5.256 6.446a6.548 6.548 0 0 1-1.72.216 5.8 5.8 0 0 1-1.242-.112c.85 2.598 3.262 4.508 6.13 4.57a13.182 13.182 0 0 1-8.134 2.798c-.538 0-1.054-.024-1.57-.09A18.469 18.469 0 0 0 10.064 29c12.072 0 18.672-10 18.672-18.668 0-.29-.01-.57-.024-.848A13.087 13.087 0 0 0 32 6.078z" style="fill:var(--color1, #f4f4fd)"/>
+      <path d="M32 6.078c-1.19.522-2.458.868-3.78 1.036a6.523 6.523 0 0 0 2.886-3.626 13.11 13.11 0 0 1-4.16 1.588A6.574 6.574 0 0 0 22.154 3c-3.632 0-6.556 2.948-6.556 6.562 0 .52.044 1.02.152 1.496-5.454-.266-10.28-2.88-13.522-6.862a6.605 6.605 0 0 0-.898 3.316 6.57 6.57 0 0 0 2.914 5.452 6.479 6.479 0 0 1-2.964-.808v.072c0 3.188 2.274 5.836 5.256 6.446a6.548 6.548 0 0 1-1.72.216 5.8 5.8 0 0 1-1.242-.112c.85 2.598 3.262 4.508 6.13 4.57a13.182 13.182 0 0 1-8.134 2.798c-.538 0-1.054-.024-1.57-.09A18.469 18.469 0 0 0 10.064 29c12.072 0 18.672-10 18.672-18.668 0-.29-.01-.57-.024-.848A13.087 13.087 0 0 0 32 6.078z"/>
     </symbol>
     <symbol id="instagram-icon" viewBox="0 0 32 32">
-      <path fill="#f4f4fd" d="M31.969 9.408c-.075-1.7-.35-2.869-.744-3.882a7.803 7.803 0 0 0-1.85-2.838A7.867 7.867 0 0 0 26.543.844C25.524.45 24.361.175 22.661.1 20.948.019 20.404 0 16.06 0s-4.888.019-6.595.094c-1.7.075-2.869.35-3.882.744a7.803 7.803 0 0 0-2.838 1.85A7.867 7.867 0 0 0 .901 5.52C.507 6.539.232 7.702.157 9.402c-.081 1.713-.1 2.257-.1 6.601s.019 4.888.094 6.595c.075 1.7.35 2.869.744 3.882a7.895 7.895 0 0 0 1.85 2.838 7.867 7.867 0 0 0 2.832 1.844c1.019.394 2.182.669 3.882.744 1.706.075 2.25.094 6.595.094s4.888-.019 6.595-.094c1.7-.075 2.869-.35 3.882-.744a8.181 8.181 0 0 0 4.682-4.682c.394-1.019.669-2.182.744-3.882.075-1.707.094-2.25.094-6.595s-.006-4.888-.081-6.595zm-2.882 13.065c-.069 1.563-.331 2.407-.55 2.969a5.31 5.31 0 0 1-3.038 3.038c-.563.219-1.413.481-2.969.55-1.688.075-2.194.094-6.464.094s-4.782-.019-6.464-.094c-1.563-.069-2.407-.331-2.969-.55a4.926 4.926 0 0 1-1.838-1.194 4.974 4.974 0 0 1-1.194-1.838c-.219-.563-.481-1.413-.55-2.969-.075-1.688-.094-2.194-.094-6.464s.019-4.782.094-6.464c.069-1.563.331-2.407.55-2.969a4.868 4.868 0 0 1 1.2-1.838A4.974 4.974 0 0 1 6.639 3.55c.563-.219 1.413-.481 2.969-.55 1.688-.075 2.194-.094 6.464-.094 4.276 0 4.782.019 6.464.094 1.563.069 2.407.331 2.969.55a4.914 4.914 0 0 1 1.838 1.194 4.974 4.974 0 0 1 1.194 1.838c.219.563.481 1.413.55 2.969.075 1.688.094 2.194.094 6.464s-.019 4.77-.094 6.458z" style="fill:var(--color1, #f4f4fd)"/>
-      <path fill="#f4f4fd" d="M16.059 7.783c-4.538 0-8.22 3.682-8.22 8.22s3.682 8.22 8.22 8.22 8.22-3.682 8.22-8.22-3.682-8.22-8.22-8.22zm0 13.552a5.333 5.333 0 0 1 0-10.664 5.333 5.333 0 0 1 0 10.664zM26.524 7.458a1.919 1.919 0 1 1-3.838 0 1.919 1.919 0 0 1 3.838 0z" style="fill:var(--color1, #f4f4fd)"/>
+      <path d="M31.969 9.408c-.075-1.7-.35-2.869-.744-3.882a7.803 7.803 0 0 0-1.85-2.838A7.867 7.867 0 0 0 26.543.844C25.524.45 24.361.175 22.661.1 20.948.019 20.404 0 16.06 0s-4.888.019-6.595.094c-1.7.075-2.869.35-3.882.744a7.803 7.803 0 0 0-2.838 1.85A7.867 7.867 0 0 0 .901 5.52C.507 6.539.232 7.702.157 9.402c-.081 1.713-.1 2.257-.1 6.601s.019 4.888.094 6.595c.075 1.7.35 2.869.744 3.882a7.895 7.895 0 0 0 1.85 2.838 7.867 7.867 0 0 0 2.832 1.844c1.019.394 2.182.669 3.882.744 1.706.075 2.25.094 6.595.094s4.888-.019 6.595-.094c1.7-.075 2.869-.35 3.882-.744a8.181 8.181 0 0 0 4.682-4.682c.394-1.019.669-2.182.744-3.882.075-1.707.094-2.25.094-6.595s-.006-4.888-.081-6.595zm-2.882 13.065c-.069 1.563-.331 2.407-.55 2.969a5.31 5.31 0 0 1-3.038 3.038c-.563.219-1.413.481-2.969.55-1.688.075-2.194.094-6.464.094s-4.782-.019-6.464-.094c-1.563-.069-2.407-.331-2.969-.55a4.926 4.926 0 0 1-1.838-1.194 4.974 4.974 0 0 1-1.194-1.838c-.219-.563-.481-1.413-.55-2.969-.075-1.688-.094-2.194-.094-6.464s.019-4.782.094-6.464c.069-1.563.331-2.407.55-2.969a4.868 4.868 0 0 1 1.2-1.838A4.974 4.974 0 0 1 6.639 3.55c.563-.219 1.413-.481 2.969-.55 1.688-.075 2.194-.094 6.464-.094 4.276 0 4.782.019 6.464.094 1.563.069 2.407.331 2.969.55a4.914 4.914 0 0 1 1.838 1.194 4.974 4.974 0 0 1 1.194 1.838c.219.563.481 1.413.55 2.969.075 1.688.094 2.194.094 6.464s-.019 4.77-.094 6.458z" />
+      <path d="M16.059 7.783c-4.538 0-8.22 3.682-8.22 8.22s3.682 8.22 8.22 8.22 8.22-3.682 8.22-8.22-3.682-8.22-8.22-8.22zm0 13.552a5.333 5.333 0 0 1 0-10.664 5.333 5.333 0 0 1 0 10.664zM26.524 7.458a1.919 1.919 0 1 1-3.838 0 1.919 1.919 0 0 1 3.838 0z"/>
     </symbol>
     <symbol id="astronaut-icon" viewBox="0 0 32 32">
 <path fill="#4d5ae5" style="fill: var(--color1, #4d5ae5)" d="M31.974 4.524c-0.063-0.193-0.229-0.333-0.43-0.363l-1.91-0.278-0.855-1.731c-0.179-0.365-0.777-0.365-0.956 0l-0.855 1.731-1.91 0.278c-0.201 0.029-0.367 0.17-0.431 0.363-0.062 0.193-0.011 0.405 0.135 0.547l1.383 1.348-0.326 1.903c-0.034 0.2 0.048 0.402 0.212 0.522 0.166 0.121 0.382 0.135 0.562 0.040l1.709-0.899 1.709 0.899c0.078 0.041 0.164 0.061 0.249 0.061 0.11 0 0.221-0.034 0.314-0.102 0.164-0.119 0.246-0.322 0.212-0.522l-0.326-1.903 1.383-1.348c0.145-0.142 0.197-0.354 0.135-0.547zM29.511 5.851c-0.125 0.122-0.183 0.299-0.153 0.472l0.191 1.114-1-0.526c-0.078-0.041-0.163-0.061-0.249-0.061s-0.17 0.020-0.249 0.061l-1.001 0.526 0.191-1.114c0.030-0.173-0.028-0.349-0.153-0.472l-0.81-0.789 1.119-0.163c0.174-0.025 0.324-0.134 0.402-0.292l0.5-1.013 0.5 1.013c0.078 0.157 0.228 0.267 0.402 0.292l1.119 0.163-0.809 0.789z"></path>
diff --git a/index.html b/index.html
index 1fe7709..bbf22d9 100644
--- a/index.html
+++ b/index.html
@@ -132,30 +132,28 @@ <h3 class="team-list-title">Mark Guerrero</h3>
                   <li class="team-socials-item">
                     <a class="socials-list-link">
                       <svg class="socials-icon" width="16" height="16">
-                        <use
-                          href="./images/icons-defs.svg#instagram-icon"
-                        ></use>
+                        <use href="./images/icons.svg#instagram-icon"></use>
                       </svg>
                     </a>
                   </li>
                   <li class="team-socials-item">
                     <a class="socials-list-link">
                       <svg class="socials-icon" width="16" height="16">
-                        <use href="./images/icons-defs.svg#twitter-icon"></use>
+                        <use href="./images/icons.svg#twitter-icon"></use>
                       </svg>
                     </a>
                   </li>
                   <li class="team-socials-item">
                     <a class="socials-list-link">
                       <svg class="socials-icon" width="16" height="16">
-                        <use href="./images/icons-defs.svg#facebook-icon"></use>
+                        <use href="./images/icons.svg#facebook-icon"></use>
                       </svg>
                     </a>
                   </li>
                   <li class="team-socials-item">
                     <a class="socials-list-link">
                       <svg class="socials-icon" width="16" height="16">
-                        <use href="./images/icons-defs.svg#linkedin-icon"></use>
+                        <use href="./images/icons.svg#linkedin-icon"></use>
                       </svg>
                     </a>
                   </li>
@@ -436,28 +434,28 @@ <h3 class="product-list-title">Online Courses</h3>
             <li class="footer-socials-item">
               <a class="footer-list-link">
                 <svg class="footer-socials-icon" width="24" height="24">
-                  <use href="./images/icons-defs.svg#instagram-icon"></use>
+                  <use href="./images/icons.svg#instagram-icon"></use>
                 </svg>
               </a>
             </li>
             <li class="footer-socials-item">
               <a class="footer-list-link">
                 <svg class="footer-socials-icon" width="24" height="24">
-                  <use href="./images/icons-defs.svg#twitter-icon"></use>
+                  <use href="./images/icons.svg#twitter-icon"></use>
                 </svg>
               </a>
             </li>
             <li class="footer-socials-item">
               <a class="footer-list-link">
                 <svg class="footer-socials-icon" width="24" height="24">
-                  <use href="./images/icons-defs.svg#facebook-icon"></use>
+                  <use href="./images/icons.svg#facebook-icon"></use>
                 </svg>
               </a>
             </li>
             <li class="footer-socials-item">
               <a class="footer-list-link">
                 <svg class="footer-socials-icon" width="24" height="24">
-                  <use href="./images/icons-defs.svg#linkedin-icon"></use>
+                  <use href="./images/icons.svg#linkedin-icon"></use>
                 </svg>
               </a>
             </li>