body
{
  background      : no-repeat center fixed;
  background-size : cover;
  height          : 100vh;
}

.fon
{
  background : rgba(0, 0, 0, 0.51);
  position   : fixed;
  top        : 0;
  left       : 0;
  width      : 100%;
  height     : 100%;
}

.form-box
{
  position      : absolute;
  top           : 50%;
  left          : 50%;
  margin        : -230px 0 0 -207px;
  width         : 414px;
  height        : 460px;
  padding       : 35px;

  background    : rgba(255, 255, 255, 0.8);
  border-radius : 10px;
}

.site-login
{
  padding-top : 30px;
}

.site-login label
{
  font-weight : normal;
  font-size   : 14px;
  line-height : 16px;

  color       : #000;
}

.site-login [type="text"],
.site-login [type="password"]
{
  height        : 51px;

  background    : #fff;
  border        : 1px solid #fff;
  border-radius : 5px;
}

.site-login a
{
  font-size       : 14px;
  line-height     : 34px;
  text-decoration : underline;
  color           : #444;
}

.site-login a.error 
{
  text-decoration: none;
  color: #1b5fa2;
  font-weight: bold;
}

.site-login a:hover,
.site-login a:focus,
.site-login a:active
{
  color : #444;
}

@media (max-width : 767px)
{
  .form-box
  {
    margin : 0 20px;
    top    : 20px;
    left   : 0;
    width  : calc(100% - 40px);
  }
}