<?if($SOCIAL_LOGIN$ && ($ONLY1STEP$ || $STEP$==1))?><div class="cell-title"><div><strong><b>Регистрация через соц сети</b></strong></div></div><?endif?>
<?if($STEP$==2)?><div class="cell-title"><div><strong>Заполните ваши данные</strong></div></div><?endif?>


<br><br><br><?if($PAGE_ID$ == 'register')?>
<div id="adas" style="margin-left:203px;"><?if($SOCIAL_LOGIN$ && ($ONLY1STEP$ || $STEP$==1))?>
  <?if($LOGIN_UID$)?>$LOGIN_UID$<?endif?>
  <?if($LOGIN_FB$)?>$LOGIN_FB$<?endif?>
  <?if($LOGIN_VK$)?>$LOGIN_VK$<?endif?>
  <?if($LOGIN_GOOGLE$)?>$LOGIN_GOOGLE$<?endif?>
  <?if($LOGIN_YANDEX$)?>$LOGIN_YANDEX$<?endif?>
  <?if($LOGIN_TWITTER$)?>$LOGIN_TWITTER$<?endif?></div>


<div class="cell-title"><div><strong>или через форму на сайте</strong></div></div>
<div class="uf-reg-wrap">
  <form id="uf-register" method="post" autocomplete="off" action="">
  <div class="clear"></div>
  <?endif?>
  <div class="uf-fields-wrap">
  <?if($SOCIAL_LOGIN$ && ($ONLY1STEP$ || $STEP$==1))?><?endif?>
  <?if($EMAIL$)?>
  <div class="uf-field">
  <label>Email</label>$EMAIL$
  <span class="uf-status-icon text-field" id="uf-email-status-icon"><span class="uf-status"><i></i><p id="uf-email-status"></p></span></span>

  </div>
  <?endif?>

  <?if($PASSWORD$)?>
  <div class="uf-field">
  <label>Пароль</label>$PASSWORD$
  <span class="uf-status-icon text-field" id="uf-password-status-icon"><span class="uf-status"><i></i><p id="uf-password-status"></p></span></span>
  <input type="checkbox" id="uf-show-pass" onchange="document.getElementById('uf-password').type = this.checked ? 'text' : 'password'">
  <label for="uf-show-pass"><span id="uf-show-pass-icon"></span></label>
  </div>
  <?endif?>
  <?if($NAME$)?>
  <div class="uf-field">
  <label>Имя</label>$NAME$
  <span class="uf-status-icon text-field" id="uf-name-status-icon"></span>
  </div>
  <?endif?>

  <?if($SURNAME$)?>
  <div class="uf-field">
  <label>Фамилия</label>$SURNAME$
  <span class="uf-status-icon text-field" id="uf-surname-status-icon"></span>
  </div>
  <?endif?>

  <?if($NICK$)?>
  <div class="uf-field">
  <label>Никнейм</label>$NICK$
  <span class="uf-status-icon text-field" id="uf-nick-status-icon"><span class="uf-status"><i></i><p id="uf-nick-status"></p></span></span>
  </div>
  <?endif?>

  <?if($BIRTHDAY$)?>
  <div class="uf-field">
  <label>Дата рождения</label>$BIRTHDAY$
  <span class="uf-status-icon" id="uf-birthday-status-icon"></span>
  </div>
  <?endif?>
   
  <?if($GENDER$)?>
  <div class="uf-field">
  <label>Пол</label>$GENDER$
  <span class="uf-status-icon" id="uf-gender-status-icon"></span>
  </div>
  <?endif?>

  <?if($LOCATION$)?>
  <div class="uf-field">
  <label>Место проживания</label>$LOCATION$
  <span class="uf-status-icon" id="uf-location-status-icon"></span>
  </div>
  <?endif?>

  <?if($CAPTCHA$)?>
  <div class="uf-field">$CAPTCHA$
  <span class="uf-status-icon" id="uf-captcha-status-icon"><span class="uf-status"><i></i><p id="uf-captcha-status"></p></span></span>
  </div>
  <?endif?>

  <?if($TERMS$)?>
  <div class="uf-field">
  $TERMS$
  <span class="uf-status-icon" id="uf-terms-status-icon"></span>
  </div>
  <?endif?>
   
  <div id="uf-form-status"></div>$SUBMIT$
  </div>
  </form>
  <div style="clear:both"></div>
</div>

<style type="text/css">
.uf-reg-wrap { text-align: left; max-width: 600px; }
#uf-register .uf-field { margin: 15px 0 20px 0; white-space:nowrap }
#uf-register .uf-field>label { display:block; margin:3px 0; text-align:left }
#uf-register .uf-field input { width:85%; font-size:1em; padding-left:5px; padding-right:5px; }
#uf-register .uf-field img { vertical-align:middle;}
#uf-register input#uf-show-pass[type="checkbox"]{ display:none }
#uf-register input#uf-show-pass[type="checkbox"] + label span { display:inline-block; width:16px; height:16px; background:url(/.s/img/icon/social/pw.svg) no-repeat center center #c6c6c6; background-size:80% 80%; vertical-align:middle; margin-left:-23px; cursor:pointer; border-radius:10px }
#uf-register input#uf-show-pass[type="checkbox"] + label { display:inline-block }
#uf-register input#uf-show-pass[type="checkbox"]:checked + label span { background:url(/.s/img/icon/social/pw-s.svg) no-repeat center center #c6c6c6; background-size:80% 80% }
#uf-register .uf-changed input#uf-show-pass[type="checkbox"] + label span { margin-left:-38px;}
#uf-register .uf-status-icon { display:none; vertical-align:middle; width:16px; height:16px; background-repeat:no-repeat; background-size:cover; position:relative }
#uf-register .uf-status-icon.text-field { margin-left:-23px }
#uf-captcha-status-icon { margin-left:-193px }
#uf-captcha-img { width:125px; height:35px }
#uf-email-status-icon.fail, #uf-password-status-icon.fail, #uf-captcha-status-icon.fail { cursor:pointer }
#uf-register span.fail { display:inline-block; background-image:url(/.s/img/icon/social/fail.svg) }
#uf-register span.pass { display:inline-block; background-image:url(/.s/img/icon/social/pass.svg) }
#uf-register span.wait { display:inline-block; background-image:url(/.s/img/icon/ajsml.gif) }
#uf-register span.uf-status{ display:none; position:absolute; right:-15px; margin:0; z-index:5 }
#uf-register span.uf-status p { background-color:rgba(0,0,0,0.7); color:#fff; padding:5px 10px; white-space:nowrap; font:12px/29px 'Arial'; border-radius:3px; margin:6px 0 0 0; }
#uf-register span.uf-status i { float:right; margin-right:18px; display:block; width:0; height:0; border-left:6px solid transparent; border-right:6px solid transparent; border-bottom:6px solid rgba(0,0,0,0.7) }
#uf-register .uf-refresh { cursor:pointer }
#uf-captcha { width:80px!important }
#uf-register .captcha img { vertical-align:middle }
#uf-submit { margin:10px 0 10px 0; clear:both }
#uf-submit.disabled { opacity:0.2 }
#uf-register .uf-field input.uf-gender, #uf-register .uf-field input.uf-click { width:auto }
#uf-register .uf-field label.uf-inline-label, #uf-register .uf-field label#uf-terms-label { display:inline }
#uf-register .uf-fields-wrap, #uf-register .uf-soc-icons{ float:left; width:50%; padding:1px 0; margin-left: 315px; }
#uf-register .uf-soc-closeselect { display:none }
.uf-soc-icons ul { list-style-type:none; margin:0; padding:0 }
.uf-soc-icons ul li { text-align:left; float:left; width:50%; margin:2px 0 }
#uf-register .uf-soc-icons ul li b { font-weight:normal }  

@media screen and (max-width:768px) {
  .uf-reg-wrap { text-align:center }
  a.login-with i { width:44px; height:44px; border-radius:24px;}
  #uf-register .uf-fields-wrap, #uf-register .uf-soc-icons { float:none; width:100%;text-align:center }
  #uf-register .uf-reg-wrap, #uf-register .uf-field label, #uf-register .uf-field { text-align:center }
  #uf-register .uf-soc-icons ul { margin:0 auto; overflow:auto; display:inline-block }
  #uf-register .uf-soc-icons ul li { width:auto; margin:5px }
  #uf-register .uf-soc-icons a.login-with b { display:none }
  #uf-register .uf-soc-closeselect { display:block }
  #uf-register .uf-soc-openselect { display:none }
  #uf-register .uf-field input { padding:10px 4%; font-size:120%; margin:0 auto }
  #uf-submit { margin:0 auto }
  #uf-register input#uf-show-pass[type="checkbox"] + label span { margin-left:-38px }
  #uf-register .uf-changed input#uf-show-pass[type="checkbox"] + label span { margin-left:-60px;}
}
</style>
$JS_VALIDATOR$
<?endif?>

<?if($PAGE_ID$ == 'verify')?>
  <h2>Отлично!</h2>
  <h3>Теперь необходимо подтвердить e-mail адрес</h3>
  <div style="text-align:center; padding:20px;">На <b>$EMAIL$</b> было отправлено письмо с ссылкой для подтверждения регистрации.<br>Для завершения регистрации перейдите по ссылке из полученного письма.</div>
<?endif?>

<?if($PAGE_ID$ == 'confirm')?>
<h2>Подтверждение e-mail адреса</h2>
<div style="text-align:center; padding:20px;">
  <?if($CONFIRM_ERROR$)?>
  $CONFIRM_ERROR$
  <?else?>
  Поздравляем! Вы успешно подтвердили e-mail адрес<br><br>$LOGIN_UID$
  <?endif?>
  <br><br><a href="/">На главную</a>
</div>
<?endif?>