JSFiddle - React, Tailwind, and code Playground

HTML

<header class="center">
    <div class="top_header clearfix">
        <nav class="menu">
            <ul>
                <li><a href="#">О компании</a></li>
                <li>
                    <a href="#">Услуги</a>
                    <ul class="dropdown">
                        <li><a href="#">Мультимодальные перевозки</a></li>
                        <li><a href="#">Сборные грузы</a></li>
                        <li><a href="#">Морские перевозки</a></li>
                        <li><a href="#">Железнодорожные перевозки</a></li>
                        <li><a href="#">Автомобильные перевозки</a></li>
                        <li><a href="#">Таможенно брокерские услуги</a></li>
                    </ul>
                </li>
                <li><a href="#">Отзывы</a></li>
                <li><a href="#">Вопросы и ответы</a></li>
                <li><a href="#">Статьи</a></li>
                <li><a href="#">информация</a></li>
            </ul>
        </nav>
    </div>
    <div class="low_header"></div>
</header>

CSS

html, body, div, span, h1, h2, h3, h4, h5, h6, p, em, img, strong, sub, sup, b, u, i, dl, dt, dd, ol, ul, li, fieldset, form, label, table, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;

  font-size: 100%;
  vertical-align: baseline;

  background: transparent;

  outline: 0;
}

a {
  margin: 0;
  padding: 0;

  font-size: 100%;
  vertical-align: baseline;

  background: transparent;

  outline: none;
}

table {
  border-spacing: 0;
  border-collapse: collapse;
}

td, td img {
  vertical-align: top;
}

input, select, button, textarea {
  margin: 0;

  font-size: 100%;

  outline: none;
}

input[type="text"], input[type="password"], textarea {
  padding: 0;
}

input[type="checkbox"] {
  vertical-align: bottom;
}

input[type="radio"] {
  vertical-align: text-bottom;
}

sub {
  vertical-align: sub;

  font-size: smaller;
}

sup {
  font-size: smaller;
  vertical-align: super;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

nav ul {
  list-style: none;
}

html {
  min-height: 100%;
}

body {
  min-height: 100%;

  font-family: 'Open Sans', sans-serif;
  text-align: left;

  color: #000;
}

a, a:visited {
  text-decoration: underline;

  color: #e6618c;
}

a:hover {
  text-decoration: none;

  color: #fdf208;
}

a:focus, a:active {
  text-decoration: underline;

  color: #c83867;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Exo 2', sans-serif;
  font-weight: normal;
}

img {
  max-width: 100%;
}

.clr {
  clear: both;
}

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

.center {
  max-width: 1600px;
  margin: 0 auto;
}

.logo {
  float: left;

  margin: 10px 0 25px 70px;
}

.top_header {
  height: 80px;
}

.menu {
  float: right;

  margin: 35px 70px 35px 0;
}

.menu > ul > li {
  position: relative;
  float: left;

 ...