JSFiddle - React, Tailwind, and code Playground

by Kocsten

HTML

<nav id="kitesanulan-1">
  <a class="wakilastumib-1" href="http://zornet.ru/load/81">ZORNET.RU</a>
  <a class="wakilastumib-1" href="http://zornet.ru/load/142">Скрипты</a>
  <a class="wakilastumib-1" href="http://zornet.ru/load/145">Шаблоны</a>
  <a class="wakilastumib-1" href="http://zornet.ru/news/">Дизайн</a>
</nav>

<nav id="kitesanulan-2">
  <a class="wakilastumib-2" href="#">ZORNET.RU</a>
  <a class="wakilastumib-2" href="#">Скрипты</a>
  <a class="wakilastumib-2" href="#">Шаблоны</a>
  <a class="wakilastumib-2" href="#">Дизайн</a>
</nav>

<nav id="kitesanulan-3">
  <a class="wakilastumib-3" href="#">ZORNET.RU</a>
  <a class="wakilastumib-3" href="#">Скрипты</a>
  <a class="wakilastumib-3" href="#">Шаблоны</a>
  <a class="wakilastumib-3" href="#">Дизайн</a>
</nav>

CSS

@import url(https://fonts.googleapis.com/css?family=Raleway);
body {
  margin: 0px;
}
nav {
  margin-top: 40px;
  padding: 24px;
  text-align: center;
  font-family: Raleway;
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.5);
}
#kitesanulan-1 {
  background: #358e5b;
}
#kitesanulan-2 {
  background: #2f4779;
}
#kitesanulan-3 {
  background: #bb830a;
}

.wakilastumib-1 {
  transition: 0.3s ease;
  background: #358e5b;
  color: #eaeaea;
  font-size: 20px;
  text-decoration: none;
  border-top: 4px solid #35905c;
  border-bottom: 4px solid #36965f;
  padding: 20px 0;
  margin: 0 20px;
}
.wakilastumib-1:hover {
  border-top: 4px solid #f7f4ef;
  border-bottom: 4px solid #f7f5f3;
  padding: 6px 0; 
}

.wakilastumib-2 {
    transition: 0.6s;
    color: #fbf5f5;
    font-size: 19px;
    text-decoration: none;
    border-right: 2px dotted transparent;
    padding: 29px 7px 0 9px;
    margin: 0 10px;
}
.wakilastumib-2:hover {
    border-right: 2px dotted #f5f1f1;
    padding-bottom: 24px;
}
.wakilastumib-3 {
    transition: 0.4s;
    color: #f1eeee;
    font-size: 19px;
    text-decoration: none;
    padding: 0 9px;
    margin: 0 9px;
}
.wakilastumib-3:hover {
    background-color: #fdfafa;
    color: #a2720c;
    padding: 23px 9px;
}