JSFiddle - React, Tailwind, and code Playground
HTML
<div class="form">
<div class="form__title">
Здравствуйте, Для подтверждения участия заполните анкету
</div>
<form action="/conf/confirmation/thanks.php" method="post">
<div class="form_item">
<label class="form_left__item" for="qualify-form_employees_count">Название вашей компании
</label>
<div class="form_right__item">
<input class="form_input" id="qualify-form_employees_count" autocomplete="off">
</div>
</div>
<div class="form_item">
<div class="form_left__item align_top">Ваша роль в компании</div>
<div class="form_right__item">
<label><input class="form_input__radio" type="radio" id="" >Директор/топ-менеджер</label><br>
<label><input class="form_input__radio" type="radio" id="" >Руководитель отдела</label><br>
<label><input class="form_input__radio" type="radio" id="" >Сотрудник отдела продаж</label><br>
<label><input class="form_input__radio" type="radio" id="" >Другое</label>
</div>
</div>
...
CSS
* {
padding: 0;
margin: 0;
box-sizing: 0;
}
body {
background: #1a485f;
color: #fff;
}
.page_confirmation { width: 100%; }
.container {
width: 960px;
margin: 0 auto;
}
.header {
font-size: 0;
padding: 25px 0 0 0;
}
.content__title {
font: 400 68px/100% neuronextrabold, arial, sans-serif;
text-align: left;
padding: 20px 0;
}
.content__desc {
font: 400 36px/100% neuronextrabold, arial, sans-serif;
text-align: center;
letter-spacing: 1px;
padding: 0 0 16px 0;
}
.content__text {
font: 400 20px/130% neuronregular, arial, sans-serif;
padding: 0 0 20px 0;
}
.row {
width: 100%;
margin: 0 auto;
font-size: 0;
padding: 0 0 40px 0;
}
.row_speaker {
width: 100%;
margin: 0 auto;
font-size: 0;
padding: 0 0 0 30px;
}
.row__left {
display: inline-block;
width: 495px;
font: 400 24px/100% neuronextrabold, arial, sans-serif;
vertical-align: top;
color: #111;
}
.row__right {
display: inline-block;
width: 465px;
vertical-align: top;
}
.speaker__text {
display: inline-block;
font: 400 16px/120% neuronregular, arial, sans-serif;
width: 50%;
vertical-align: middle;
padding: 0 0 0 20px;
& span { font: 400 24px/120% neuronregular, arial, sans-serif; }
}
.row_right__content {
padding: 20px 60px 0 60px;
font: 400 40px/120% neuronregular,arial,sans-serif;
}
.footer {
width: 100%;
background: #fff;
font-size: 0;
height: 100px;
}
.footer__text {
display: inline-block;
font: 400 16px/18px pf_din_text_comp_proregular, arial, sans-serif;
color: #1e2325;
width: 320px;
text-align: center;
& a {
color: #c4c6c9;
text-decoration: none;
}
}
.footer__contacts {
display: inline-block;
font: 400 20px/28px pf_din_text_comp_proregular, arial, sans-serif;
color: #1e2325;
text-align: right;
width: 320px;
& a {
font: 400 14px/100%...