body {
  margin: 0;
  padding: 0;
  background-color: #f0f0f0;
}
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
img {
  object-fit: contain;
}

/*Header styles*/

header {
  background-color: #000000;
  padding: 18px 7%;
}

@media (max-width: 1024px) {
  header {
    padding: 18px 50px;
  }
}
@media (max-width: 767px) {
  header {
    padding: 13px 30px;
  }
}

.header-main {
  max-width: 1700px;
  margin: auto;
}

.header-main img {
  width: 90px;
}
@media (max-width: 1024px) {
  .header-main img {
    width: 80px;
  }
}
@media (max-width: 767px) {
  .header-main img {
    width: 60px;
  }
}

/* Section Styles */

.main {
  max-width: 1600px;
  margin: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 70px 5%;
  min-height: calc(100vh - 100px);
}
@media (max-width: 1024px) {
  .main {
    min-height: calc(100vh - 86px);
    padding: 60px 20px;
  }
}
@media (max-width: 767px) {
  .main {
    min-height: calc(100vh - 59px);
  }
}

.main__top {
  margin-bottom: 50px;
}
@media (max-width: 767px) {
  .main__top {
    margin-bottom: 40px;
  }
}
.main__top img {
  width: 300px;
}
@media (max-width: 1024px) {
  .main__top img {
    width: 360px;
  }
}
@media (max-width: 767px) {
  .main__top img {
    width: 240px;
  }
}

.main__bottom {
  display: flex;
  column-gap: 20px;
}
.main__bottom img {
  width: 198px;
}
@media (max-width: 767px) {
  .main__bottom img {
    width: 140px;
  }
}
@media (max-width: 359px) {
  .main__bottom img {
    width: 120px;
  }
}