JSFiddle - React, Tailwind, and code Playground

HTML

<div class="right_area">
    <h3>ЗАДАТЬ ВОПРОС</h1>

    <form method="post" id="sc_form">        

        <input name="organization" placeholder="ФИО/Наименование организации" required></input>
        <input name="phone" placeholder="Контактный телефон" required></input>   
        <div class="radio-group">     
            <input type="radio" name="phone" id="send" value="send"></input>
            <label for="send">Вы отправитель</label>
        </div>
        <div class="radio-group">
            <input type="radio" name="phone" id="get" value="get"></input>
            <label for="get">Вы получатель</label>
        </div>
        <input name="from" placeholder="Пункт отправления" required></input>
        <input name="to" placeholder="Пункт назначения" required></input>
        <input name="weight" placeholder="Масса (кг)" required></input>
        <input name="volume" placeholder="Объём (м)" required></input>

        <input type="submit" name="send" value="Отправить" id="send-button" />

    </form>
</div>

CSS

body, html{
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  font-family: "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;
  line-height: 1.5;
}

h3{
  font-size: 16px;
  font-family: Prosto_One;
  color: #292929;
}

.wrapper{
  width: 800px;
  min-height: 100%;
  margin: 0 auto -100px;
  -webkit-box-shadow: 0px 0px 20px 0px rgba(128,128,128,1);
  -moz-box-shadow: 0px 0px 20px 0px rgba(128,128,128,1);
  box-shadow: 0px 0px 20px 0px rgba(128,128,128,1);
}

.header{
  width: 800px;
  height: 296px;
  background: url(../images/header.jpg) no-repeat;
  position: relative;
}

.buttons{
  text-align: center;
  position: absolute;
  bottom:0px;
  width: 100%;
}

.nav{
  margin: 0 auto;
  padding: 0;
}

li{
  list-style-image: url(../images/list.jpg);
  padding: 0 0 12px 0;
  list-style-position: inside;
  text-indent: 10px;
}

ul{
  padding: 0;
}


ul.nav > li{
  display: inline-block;   /* You can also add some margins here to make it look prettier */
  *display:inline; /* this fix is needed for IE7- */  
  padding: 0;
  list-style-position: outside;
  text-indent: 0;
}


.header_link{
  width: 150px;
  height: 40px;
  display: inline-block;
  color: #fff;
  line-height: 40px;
  text-align: center;
  text-decoration: none;
  background-color: #48ac3c;
  background: #81dd76; /* Old browsers */
  background: -moz-linear-gradient(top,  #81dd76 0%, #65c859 54%, #48ac3c 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#81dd76), color-stop(54%,#65c859), color-stop(100%,#48ac3c)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #81dd76 0%,#65c859 54%,#48ac3c 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #81dd76 0%,#65c859 54%,#48ac3c 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #81dd76 0%,#65c859 54%,#48ac3c 100%); /* IE10+ */
  background: linear-gradient(to bottom,  #81dd76 0%,#65c859 54%,#48ac3c...