worked on pagespeed

assets/css/filter.css

@@ -211,12 +211,12 @@
 }
 
 .filter__price_range {
-  flex-direction: column;
   position: relative;
   width: 100%;
   height: 5px;
   margin: 30px 0;
   background-color: #d4d4d4;
+  border-radius: 40px;
 }
 
 .filter__price_range input {
@@ -282,6 +282,8 @@ input[type="number"]::-webkit-inner-spin-button {
 .filter__quantity span {
   color: #0499dd;
   cursor: pointer;
+  font-weight: 600;
+  font-size: 18px;
 }
 
 .filter__transport,
@@ -403,6 +405,20 @@ input[type="number"]::-webkit-inner-spin-button {
   font-weight: 700;
   font-size: 18px;
   color: #0499dd;
+  display: flex;
+  align-items: center;
+}
+
+.excursion__info_price div img {
+  width: 22px;
+  height: 22px;
+  margin-right: 5px;
+}
+
+.excursion__info_price div:last-child img {
+  width: 15px;
+  height: 15px;
+  margin-right: 5px;
 }
 
 .excursion__info_price span {

assets/css/index.css

@@ -598,7 +598,7 @@
 .contacts {
   grid-area: contacts;
   background-position: center;
-  background-image: url(../img/contacts_background_new.jpeg);
+  background-image: url(../img/contacts_bg.webp);
   min-height: 640px;
   background-size: cover;
   position: relative;
@@ -695,10 +695,14 @@
 }
 
 .form__button {
-  margin: 80px 0px 0px;
+  margin: 80px 2px 2px;
   justify-self: left;
 }
 
+.form__button:hover {
+  transform: none;
+}
+
 @media screen and (max-width: 767px) {
   .form__button {
     margin: 40px 0px 0px;

assets/css/styles.css

@@ -181,7 +181,7 @@ h3 {
 
 /** ---- HEADER SECTION STYLES ---- **/
 .header {
-  background: url(../img/cite.jpg) 50% / cover no-repeat;
+  background: url(../img/cite.webp) 50% / cover no-repeat;
 
   grid-area: header;
   display: grid;
@@ -202,7 +202,6 @@ h3 {
   position: relative;
   z-index: 5;
   width: 40px;
-  align-items: center;
   transition: transform 0.3s;
   cursor: pointer;
 }
@@ -214,6 +213,8 @@ h3 {
 
 .header__logo img {
   max-width: 100%;
+  width: 40px;
+  height: 57px;
   display: block;
   object-fit: cover;
 }
@@ -236,6 +237,17 @@ h3 {
   align-items: center;
 }
 
+.header__vkontakte {
+  width: 32px;
+  height: 32px;
+}
+
+.header__facebook,
+.header__instagram {
+  width: 30px;
+  height: 30px;
+}
+
 /* ---- MOBILE-MENU SECTION STYLES ---- */
 @media screen and (max-width: 767px) {
   .menu__burger {
@@ -400,6 +412,13 @@ section {
   transition: transform 0.3s;
 }
 
+.footer__logo img {
+  width: 80px;
+  height: 114px;
+  max-width: 100%;
+  object-fit: contain;
+}
+
 .footer__logo:hover {
   transform: scale(1.1);
   transition: transform 0.3s;
@@ -446,27 +465,26 @@ section {
   margin-bottom: 8px;
 }
 
-.footer__social li > i,
-.footer__menu li > i,
-.footer__social_big li > i {
+.footer__social li > img,
+.footer__menu li > img,
+.footer__social_big li > img {
   margin-right: 5px;
+  width: 20px;
+  height: 20px;
 }
 
-.footer__social li > a,
-.footer__menu li > a,
-.footer__social_big li > a {
+.footer__menu .menu li a,
+.footer__social_big li a,
+.tels li a {
   color: #282828;
   text-decoration: none;
   cursor: pointer;
   transition: color 0.3s linear;
 }
 
-.footer__social li:hover,
-.footer__menu li:hover,
-.footer__social_big li:hover,
-.footer__social li a:hover,
-.footer__menu li a:hover,
-.footer__social_big li a:hover {
+.menu li:hover a,
+.footer__social_big li:hover a,
+.tels li:hover a {
   color: #ffc700;
   transition: color 0.3s linear;
   text-decoration: none;
@@ -483,6 +501,21 @@ section {
   transition: transform 0.3s;
 }
 
+.footer__vkontakte {
+  width: 38px;
+  height: 38px;
+}
+
+.footer__instagram {
+  width: 32px;
+  height: 32px;
+}
+
+.footer__facebook {
+  height: 30px;
+  width: 18px;
+}
+
 @media screen and (min-width: 768px) {
   .footer {
     grid-area: footer;
@@ -498,6 +531,13 @@ section {
     grid-column: 2;
   }
 
+  .footer__logo img {
+    width: 65px;
+    height: 93px;
+    max-width: 100%;
+    object-fit: contain;
+  }
+
   .footer__menu {
     grid-column: 3;
     padding-left: 40px;
@@ -536,6 +576,13 @@ section {
     padding: 1.5rem 0;
   }
 
+  .footer__logo img {
+    width: 80px;
+    height: 114px;
+    max-width: 100%;
+    object-fit: contain;
+  }
+
   .footer__menu {
     display: grid;
     grid-column: 3;

assets/js/filter.js

@@ -224,15 +224,21 @@ function outputExcursions(excursions) {
           <h3 class="excursion__title" id="${n.code}">${n.name}</h3>
           <div class="excursion__info">
             <div class="excursion__info_price">
-              <div><i class="fa-solid fa-coins"></i>${n.priceadult}</div>
+              <div><img src="assets/img/coins.svg" alt="coins" />${
+                n.priceadult
+              }</div>
               <span>Взрослый билет</span>
             </div>
             <div class="excursion__info_price">
-              <div><i class="fa-solid fa-coins"></i> ${n.pricechild}</div>
+              <div><img src="assets/img/coins.svg" alt="coins" />${
+                n.pricechild
+              }</div>
               <span>Детский билет</span>
             </div>
             <div class="excursion__info_price">
-              <div><i class="fa-regular fa-clock"></i>${n.duration}</div>
+              <div><img src="assets/img/clock.svg" alt="clock" />${
+                n.duration
+              }</div>
             </div>
           </div>
           <div class="excursion__description">${n.description.slice(