JSFiddle - React, Tailwind, and code Playground

HTML

<header id="header" class="header">
  <div class="container">
    <div class="img-box">
      <img src="https://live4fun.ru/data/old_pictures/img_15087463_213_5.jpg" alt="WAYUP" width="100"> </div>


    <div class="offer">
      <div class="title">
        С помощью верстки
        я создам ту жизнь, о которой
        мечтаю!
      </div>
      <p class="intro">
        Мои стремления + настойчивость позволят мне достичь чего угодно. Я не верю в это. Я знаю это на 100%. Меня не остановить!
      </p>
      <a href="#" class="btn">Двигаться к мечте!</a>
    </div>
    <div class="img-box">
      <img src="https://live4fun.ru/data/old_pictures/img_15087463_213_5.jpg" alt="desktop" class="desktop" width="100px">
    </div>

  </div>

</header>

<section id="learn" class="learn">
  <div class="container">

  </div>
</section>
<section id="mail" class="mail">
  <div class="container">

  </div>
</section>
<footer id="footer" class="footer">

  <div class="container">
  </div>
</footer>

CSS

body {
  padding: 0;
  margin: 0;
}
img {
  max-width: 100%;
}

.container {
  display: flex;
  width: 1170px;
  margin: auto;
}

.header {
  background: linear-gradient(to right, rgba(73, 155, 234, 1) 0%, rgba(32, 124, 229, 1) 100%);
  padding-top: 62px;
  color: white;

}