/* default */
body{font-family:Century Gothic; font-size:15px; line-height:17px; color:#004C66; text-decoration:none; margin:0; width:100%; height:100%; float:left;}
a img {border:none;}
form{margin:0; padding:0px;}
p{margin:3px 0 5px 0; font-size:15px; line-height:17px; text-align:center; color:#004C66;}
a{font-family:Century Gothic; font-size:15px; line-height:17px; color:#004C66; text-decoration:none;}
a:hover{font-size:15px; line-height:17px; color:#1870E4; text-decoration:none;}

h1{width:100%; font-size:30px; line-height:30px; text-align:center; margin:0 0 16px 0; color:#004C66; font-weight:lighter; text-decoration:none; padding:0; float:left;}

.none_absolute{position:absolute; top:-9999px; left:-9999px;}

div.line50-1{width:50%; height:100vh; background:url(logo.svg) no-repeat center #004C66; background-size:contain; float:left;}
div.line50-2{width:50%; height:100vh; background:url(logo-bg.svg) no-repeat center #E2EAEE; background-size:133%; float:left;}

input.text{background:#fff; padding:0 0 0 36px; width:calc(100% - 38px); height:40px; border:1px solid #004C66; border-radius:10px; font-family:Arial; color:#004C66; outline:none; float:left;}
input.captcha{background:#fff; padding:0 0 0 36px; width:calc(100% - 184px); height:40px; border:1px solid #004C66; border-radius:10px 0 0 10px; font-family:Arial; outline:none; float:left;}

input.sub{background:url(enter.svg) no-repeat center, linear-gradient(#eff5f7,#c8d1d5); width:47px; height:47px; margin:16px 126.5px 0 126.5px; border:1px solid #c8d1d5; border-radius:24.5px; cursor:pointer; float:left;}
input.sub:hover{background:url(enter.svg) no-repeat center, linear-gradient(#fff,#eff5f7);}

a.recovery{width:100%; margin:14px 0 0 0; font-size:13px; line-height:13px; color:#999; text-align:center; float:left;}
a.recovery:hover{font-size:13px; line-height:13px; color:#004C66; text-decoration:underline;}

div.block{width:100%; max-width:300px; margin:16px 0 0 0; float:left;}

form{width:300px; height:250px; padding:40px 10px 0 10px; margin:calc(50vh - 158px) calc(50% - 160px); float:left;}

div.copy{width:100%; height:15px; font-size:13px; margin-bottom:29px; color:#999; text-align:center; float:left;}
div.copy a{font-size:13px; width:100%; height:15px; margin-bottom:29px; color:#999; text-decoration:underline;}
div.copy a:hover{color:#004C66;}

div.copy img{width:15px;}

div.captcha_speaker{width:14px; height:14px; padding:14px 0 14px 9px; background:#004C66; cursor:pointer; float:left;}
div.captcha_speaker svg{width:14px; height:14px; fill:#fff; opacity:0.77; float:left;}
div.captcha_speaker:hover svg{opacity:1;}

#speaker{cursor:pointer;}
#speaker_off{opacity:0.55; display:none;}

div.auth_user{width:20px; height:26px; margin:8px 0 8px 12px; background:url(auth_user.svg) no-repeat; position:absolute;}
div.auth_pass{width:20px; height:26px; margin:8px 0 8px 12px; background:url(auth_pass.svg) no-repeat; position:absolute; cursor:pointer;}
div.auth_pass1{width:20px; height:26px; margin:8px 0 8px 12px; background:url(auth_pass1.svg) no-repeat; position:absolute; cursor:pointer;}
div.auth_robot_captcha{width:20px; height:26px; margin:5px 0 5px 12px; background:url(robot_captcha.svg) no-repeat; position:absolute;}

div.form_captcha_img{width:100px; height:42px; padding:0; float:left;}
div.form_captcha_img img{width:100px; height:42px; position:absolute; border-radius:0 10px 10px 0;}

#block_for_form, #error{width:100%; margin-top:10px; float:left;}

@media screen and (max-width:720px){
form{width:300px; height:auto; padding:40px 10px 0 10px; margin:0 calc(50% - 160px) calc(100vh - 524px) calc(50% - 160px); float:left;}

div.line50-1{width:100%; height:200px; background:url(logo2.svg) no-repeat center #004C66; background-size:300px;}
div.line50-2{width:100%; height:calc(100vh - 200px);}
}





















.light {
    position:absolute;
    width: 0px;
    opacity:0.5;
    background-color: white;
    box-shadow: #fff 0px 0px 10px 2px;
    opacity: 0;
    top: 70vh;
    bottom: 0px;
    left: 0px;
    right: 0px;
    margin: auto;
}

.x1{
  -webkit-animation: floatUp 4s infinite linear;
  -moz-animation: floatUp 4s infinite linear;
  -o-animation: floatUp 4s infinite linear;
  animation: floatUp 4s infinite linear;
   -webkit-transform: scale(1.0);
   -moz-transform: scale(1.0);
   -o-transform: scale(1.0);
  transform: scale(1.0);
}

.x2{
  -webkit-animation: floatUp 7s infinite linear;
  -moz-animation: floatUp 7s infinite linear;
  -o-animation: floatUp 7s infinite linear;
  animation: floatUp 7s infinite linear;
  -webkit-transform: scale(1.6);
  -moz-transform: scale(1.6);
  -o-transform: scale(1.6);
  transform: scale(1.6);
  left: 15%;
}

.x3{
  -webkit-animation: floatUp 2.5s infinite linear;
  -moz-animation: floatUp 2.5s infinite linear;
  -o-animation: floatUp 2.5s infinite linear;
  animation: floatUp 2.5s infinite linear;
  -webkit-transform: scale(.5);
  -moz-transform: scale(.5);
  -o-transform: scale(.5);
  transform: scale(.5);
  left: -15%;
}

.x4{
  -webkit-animation: floatUp 4.5s infinite linear;
  -moz-animation: floatUp 4.5s infinite linear;
  -o-animation: floatUp 4.5s infinite linear;
  animation: floatUp 4.5s infinite linear;
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -o-transform: scale(1.2);
  transform: scale(1.2);
  left: -34%;
}

.x5{
  -webkit-animation: floatUp 7s infinite linear;
  -moz-animation: floatUp 7s infinite linear;
  -o-animation: floatUp 7s infinite linear;
  animation: floatUp 7s infinite linear;
  -webkit-transform: scale(1.9);
  -moz-transform: scale(1.9);
  -o-transform: scale(1.9);
  transform: scale(1.9);
  left: -57%;
}

.x6{
  -webkit-animation: floatUp 3s infinite linear;
  -moz-animation: floatUp 3s infinite linear;
  -o-animation: floatUp 3s infinite linear;
  animation: floatUp 3s infinite linear;
  -webkit-transform: scale(.8);
  -moz-transform: scale(.8);
  -o-transform: scale(.8);
  transform: scale(.8);
  left: -81%;
}

.x7{
  -webkit-animation: floatUp 5.3s infinite linear;
  -moz-animation: floatUp 5.3s infinite linear;
  -o-animation: floatUp 5.3s infinite linear;
  animation: floatUp 5.3s infinite linear;
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -o-transform: scale(1.2);
  transform: scale(1.2);
  left: 37%;
}

.x8{
  -webkit-animation: floatUp 4.7s infinite linear;
  -moz-animation: floatUp 4.7s infinite linear;
  -o-animation: floatUp 4.7s infinite linear;
  animation: floatUp 4.7s infinite linear;
  -webkit-transform: scale(1.7);
  -moz-transform: scale(1.7);
  -o-transform: scale(1.7);
  transform: scale(1.7);
  left: 62%;
}

.x9{
  -webkit-animation: floatUp 4.1s infinite linear;
  -moz-animation: floatUp 4.1s infinite linear;
  -o-animation: floatUp 4.1s infinite linear;
  animation: floatUp 4.1s infinite linear;
  -webkit-transform: scale(0.9);
  -moz-transform: scale(0.9);
  -o-transform: scale(0.9);
  transform: scale(0.9);
  left: 85%;
}

@-webkit-keyframes floatUp{
  0%{top: 100vh; opacity: 0;}
  25%{opacity:0.5;}
  50%{top: 0vh; opacity:0.4;}
  75%{opacity:0.1;}
  100%{top: -100vh; opacity: 0;}
}
@-moz-keyframes floatUp{
  0%{top: 100vh; opacity: 0;}
  25%{opacity:0.2;}
  50%{top: 0vh; opacity:0.5;}
  75%{opacity:0.8;}
  100%{top: -100vh; opacity: 0;}
}
@-o-keyframes floatUp{
  0%{top: 100vh; opacity: 0;}
  25%{opacity:0.4;}
  50%{top: 0vh; opacity:0.4;}
  75%{opacity:0.6;}
  100%{top: -100vh; opacity: 0;}
}
@keyframes floatUp{
  0%{top: 100vh; opacity: 0;}
  25%{opacity:0.3;}
  50%{top: 0vh; opacity:0.3;}
  75%{opacity:0.7;}
  100%{top: -100vh; opacity: 0;}
}