add media-quries

style.scss

@@ -300,6 +300,7 @@ footer {
   }
 
   .item {
+    margin-right: 5px;
     a {
       display: block;
       width: 25px;
@@ -381,15 +382,15 @@ footer {
       margin-left: 15px;
     }
 
-    .card-inf__item::before{
+    .card-inf__item::before {
       left: -15px;
     }
 
-    .date::before{
+    .date::before {
       content: url("../icons/calendar2.svg");
     }
 
-    .people::before{
+    .people::before {
       content: url("../icons/people.svg");
     }
   }
@@ -458,3 +459,114 @@ footer {
     background-color: rgba(141, 97, 2, 0.468);
   }
 }
+
+@media (max-width: 1024px) {
+  .cards {
+    grid-template-columns: repeat(2, 49%);
+    grid-column-gap: 20px;
+  }
+
+  .about {
+    &-more {
+      flex-direction: column;
+      align-items: center;
+    }
+
+    &__image {
+      margin-bottom: 20px;
+    }
+
+    &-text {
+      width: 100%;
+
+      .card-inf__item {
+        margin-top: 10px;
+      }
+      .enroll{
+        margin-top: 10px;
+      }
+    }
+  }
+}
+
+@media (max-width: 820px) {
+  .settings-rest {
+    width: 50%;
+  }
+  .nav-header {
+    width: 50%;
+  }
+  .footer {
+    .about {
+      width: 40%;
+    }
+  }
+}
+
+@media (max-width: 640px) {
+  header {
+    height: 90px;
+  }
+
+  .header {
+    flex-direction: column;
+    justify-content: center;
+    padding-top: 10px;
+  }
+
+  .nav-header {
+    margin-top: 10px;
+    width: 80%;
+  }
+
+  .sort {
+    margin-top: 5px;
+  }
+
+  .settings-rest {
+    flex-wrap: wrap;
+
+    p {
+      margin-left: 20px;
+      margin-top: 5px;
+    }
+
+    .ended {
+      margin-left: 27px;
+    }
+  }
+
+  .about__image{
+    width: 100%;
+  }
+
+  .logo {
+    text-align: center;
+  }
+  .footer {
+    display: block;
+
+    .text {
+      width: 100%;
+    }
+
+    .networks {
+      width: 100%;
+      margin: 0 auto;
+
+      .text {
+        text-align: center;
+      }
+
+      .social {
+        width: 40%;
+        margin: 0 auto;
+      }
+    }
+
+    .about {
+      width: 60%;
+      margin: 0 auto;
+    }
+  }
+}