add 2 sections

local/_front/css/style.css

@@ -4,6 +4,7 @@ header {
   top: 0px;
   left: 0px;
   width: 100%;
+  z-index: 2;
 }
 
 .top-menu {
@@ -37,9 +38,6 @@ header {
   grid-gap: 2em;
 }
 .block-banner h1 {
-  /*        position: relative;
-          top:100px;
-          left:auto;*/
   font-size: 65px;
   font-weight: 800;
   text-transform: uppercase;
@@ -127,31 +125,7 @@ header {
   color: var(--main-text-color);
   margin: 50px 50px;
 }
-.service-item {
-  /*        position: relative;
-          &::before {
-              content: "";
-              position: absolute;
-              top: 0;
-              left: 0;
-              width: 100%;
-              height: 100%;
-              background: {
-                  size: cover;
-                  position: center;
-                  image: url('../assets/services/1.png');
-              }
-              filter: brightness(28%);
-              z-index: 1;
-          }
-  */
-}
 .service-item:hover {
-  /*
-              &::before {
-                  filter: brightness(66%);
-              }
-  */
   cursor: pointer;
 }
 .service-item {
@@ -214,6 +188,97 @@ header {
   background-position: center;
 }
 
+.about_title {
+  text-transform: uppercase;
+  font-size: 35px;
+  font-weight: 500;
+  margin-top: 60px;
+  margin-bottom: 14px;
+  color: #E9E9E9;
+}
+.about p {
+  font-size: 20px;
+  color: white;
+  padding-right: 40px;
+}
+.about_image {
+  background-image: url(../assets/about/img.png);
+  background-size: cover;
+  background-position: center;
+  background-repeat: no-repeat;
+  height: 730px;
+}
+.about_text {
+  font-size: 20px;
+  color: #7E7E7E;
+}
+.about button {
+  width: 100%;
+  border: 1px solid #D9D9D9;
+  border-radius: 4px;
+  background-color: #212121;
+}
+.about button:hover {
+  background-color: #D9D9D9;
+}
+.about button {
+  color: #fff;
+}
+.about-feature {
+  position: relative;
+  top: -200px;
+  margin-bottom: -200px;
+}
+.about-feature_title {
+  border-bottom: 1px solid #fff;
+  color: #fff;
+  font-size: 30px;
+  font-weight: 400;
+  grid-gap: 0px;
+}
+.about-feature_title span {
+  float: left;
+  font-size: 109px;
+  font-weight: 400;
+}
+.about-feature_title .col {
+  display: inline-block;
+  vertical-align: middle;
+}
+.about-feature_text {
+  margin-top: 34px;
+  color: #7E7E7E;
+  font-size: 18px;
+  font-weight: 500;
+}
+
+.portfolio-header {
+  justify-content: space-between;
+}
+.portfolio_title {
+  text-transform: uppercase;
+  font-size: 35px;
+  font-weight: 600;
+  color: var(--main-text-color);
+  margin: 50px 50px;
+}
+.portfolio_buttons {
+  position: relative;
+  width: 130px;
+  margin-top: 1em;
+  margin-left: auto;
+  margin-right: 2em;
+}
+.portfolio_buttons button {
+  width: 60px;
+  height: 60px;
+  border: 3px solid #373737;
+  border-radius: 4px;
+}
+.portfolio_buttons button :hover {
+  border-color: #D9D9D9;
+}
+
 * {
   box-sizing: border-box;
   font-family: "Mulish", sans-serif;