html {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

body {
    width: 100%;
    height: 100%;
}

div.main {
    width: 900px;
    height: 100%;
    margin: 0 auto;
    position: relative;
}

div.main div.container {
    width: 100%;
    height: 500px;
    top: 50%;
    left: 0;
    margin-top: -230px;
    position: absolute;
}

div.container div.logo {
    float: left;
    width: 500px;
    height: 500px;
    padding: 5px;
    position: absolute;
    top:50%;
    left:50%;
    margin-left: -250px;
    margin-top: -300px;
    -webkit-perspective: 1200px;
    -moz-perspective: 1200px;
    -o-perspective: 1200px;
    -ms-perspective: 1200px;
    perspective: 1200px;
}

div.back div.back-container {
    width: 485px;
    height: 485px;
    border: 3px solid #fff;
    border-radius: 50%;
    position: absolute;
    top: 4px;
    left: 4px;
}

#logined-container {
    background: #00a0e3 url('/images/themes/cyan/cabinet-logo.png') no-repeat center center;
    position:relative;
}
#login-container {
    position:relative;
}
#changepswd-container {
    position:relative;
}
#forgot-container {
    position:relative;
}
#reg-container {
    position:relative;
}

#login div.front {
    border: 0px solid #00a0e3;
    border-radius: 50%;
    background: #00a0e3 url('/images/themes/cyan/cabinet-logo.png') no-repeat center center;
    width: 500px;
    height: 500px;

}
#login div.back
{
    border: 0px solid #00a0e3;
    border-radius: 50%;
    background: #00a0e3;
    width: 500px;
    height: 500px;
    position: relative;
}

div.container #login div.title {
    width: 100%;
    font: 48px 'Times New Roman', sans-serif;
    margin-top: 20px;
    color: #fff;
    text-align: center;
    float: left;
}

div.container #login div.title span {
    font-size: 24px;
}


/* circle buttons */
div.container div.bcircle {
    float: left;
    width: 55px;
    height: 55px;
    /*margin: 0px;*/
    padding: 5px;
    border: 6px #fff solid;
    background: #fff;
    border-radius: 50%;
    position:absolute;
    /* from "logo" container */
    margin-left: 200px;
    margin-top: -50px;
}

div.container div.bregister {
    left: 40px;
    top: 40px;
}

div.container div.bregister-faq {
    left: 40px;
    top: 40px;
}

div.container div.bforgotpswd {
    left: -30px;
    top: 216px;
}

div.container div.bforgotpswd-faq {
    left: -30px;
    top: 216px;
}

div.container div.bprev {
    left: -30px;
    top: 216px;
    display: none;
    opacity: 0;
}

div.container div.bhelp {
    left: 40px;
    top: 382px;
}

div.container div.bhelp-faq {
    left: 40px;
    top: 382px;
}

div.container div.blogin {
    left: 460px;
    top: 216px;
}

div.container div.blogin-faq {
    left: 460px;
    top: 216px;
}

div.container div.bnext {
    left: 460px;
    top: 216px;
    display: none;
    opacity: 0;
}

div.container div.bok {
    left: 460px;
    top: 216px;
    display: none;
    opacity: 0;
}

div.container div.benter {
    left: 460px;
    top: 216px;
    display: none;
    opacity: 0;
}

div.container div.benter-faq {
    left: 460px;
    top: 216px;
}

div.container div.bcircle div.scircle {
    float: left;
    width: 55px;
    height: 55px;
    padding: 5px;
    border: 4px solid #00a0e3;
    background: #fff;
    border-radius: 50%;
    cursor: pointer;
    position: absolute;
    margin-left: -9px;
    margin-top: -9px;
}

div.container div.hint {
    width: 90px;
    height: 24px;
    position: absolute;
    left: 50%;
    top: 100%;
    font: 14px Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #fff;
    float: left;
}

div.container div.scircle div.help-hint {
    margin-left: 45px;
    margin-top: -40px;
}

div.container div.scircle div.forgot-hint {
    margin-left: 20px;
}

div.container div.scircle div.login-hint {
    margin-left: -60px;
}

div.container div.scircle div.register-hint {
    margin-left: 10px;
    margin-top: 5px;
}

div.container div.bcircle div.sregister {
    background: #fff url('/images/themes/cyan/icon-registration.png') no-repeat center center;
}

div.container div.bcircle div.sforgotpswd {
    background: #fff url('/images/themes/cyan/icon-forgotpswd.png') no-repeat center center;
}

div.container div.bcircle div.shelp {
    background: #fff url('/images/themes/cyan/icon-help.png') no-repeat center center;
}

div.container div.bcircle div.slogin {
    background: #fff url('/images/themes/cyan/icon-login.png') no-repeat center center;
}
div.container div.bcircle div.snext {
    background: #fff url('/images/themes/cyan/icon-arrow-right.png') no-repeat center center;
}
div.container div.bcircle div.sok {
    background: #fff url('/images/themes/cyan/icon-ok.png') no-repeat center center;
}
div.container div.bcircle div.sprev {
    background: #fff url('/images/themes/cyan/icon-arrow-left.png') no-repeat center center;
}

div.container div.bcircle div.senter {
    background: #fff url('/images/themes/cyan/icon-enter.png') no-repeat center center;
}

div.container div.orgs-logo-list {
    width: 480px;
    height: 24px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: 250px;
    margin-left: -230px;
}

div.container div.orgs-logo-list div.progmatik {
    width: 100px;
    height: 24px;
    float: left;
    background: url('/images/progmatik-logo.png') no-repeat;
    margin-right: 5px;
    cursor: pointer;
}

div.container div.orgs-logo-list div.gazprombank {
    width: 110px;
    height: 24px;
    float: left;
    background: url('/images/gazprombank-logo.png') no-repeat;
    cursor: pointer;
}

div.container div.orgs-logo-list div.client-logo {
    width: 110px;
    height: 24px;
    float: left;
    cursor: pointer;
}

div.container div.orgs-logo-list div.visa{
    width: 60px;
    height: 24px;
    float: left;
    background: url('/images/visa-logo.png') no-repeat;
    cursor: pointer;
}

div.container div.orgs-logo-list div.mastercard{
    width: 45px;
    height: 24px;
    float: left;
    background: url('/images/mastercard-logo.png') no-repeat;
    margin-right: 5px;
    cursor: pointer;
}

div.container div.orgs-logo-list div.peace{
    width: 45px;
    height: 24px;
    float: left;
    background: url('/images/peace.png') no-repeat;
    margin-right: 5px;
    cursor: pointer;
background-size: contain;
    background-position: 0 5px;
}

div.container div.orgs-logo-list div.ssl{
    width: 40px;
    height: 24px;
    float: left;
    background: url('/images/ssl-logo.png') no-repeat;
}

#header {
    border-bottom: 1px solid #0391cd;
}

#footer {
    width: 1000px;
    color: #333;
    font: 13px normal Helvetica, Arial, sans-serif;
    margin: 0 0 14px 0;
    text-align: center;
    float: left;
}

#footer a{
    color: #333;
    font: 13px normal Helvetica, Arial, sans-serif;
}

#loginForm {
    width: 350px;
    text-align: center;
    position: absolute;
    top: 215px;
    left: 80px;
}
#pswdForm {
    width: 350px;
    text-align: center;
    position: absolute;
    top: 220px;
    left: 80px;

}

#login div.login-title {
    border-bottom: #fff 2px solid;
    height: 36px;
    position: absolute;
    top: 140px;
    left:120px;
}

span.changepswd-title {
    height: 36px;
    width: 350px;
    position: absolute;
    top: 140px;
    left: 70px;
    text-align: center;
    color: #fff;
    font: 16px Arial, Helvetica, sans-serif;
}

#login div.login-title span {
    color: #fff;
    font: 24px normal Helvetica, Arial, sans-serif;
}

#login div.login-title div.login-logo {
    width: 52px;
    height: 32px;
    background: #00a0e3 url('/images/themes/cyan/login_52x32.png') no-repeat center center;
    float: left;
    margin-bottom: 3px;
}

#error-modal-content {
    display: none;
}

#register-modal-content {
    display: none;
}

#forgot-modal-content {
    display: none;
}

#help-modal-content {
    display: none;
}
/*
div.login-ajaxloader {
    height: 20px;
    width: 240px;
    position: absolute;
    top: 100px;
    left: 50%;
    margin-left: -110px;
    background: url('/images/themes/cyan/ajax-loader-small.gif') no-repeat 5px 3px;
    border-radius: 5px;
    font: 12px normal Helvetica, Arial, sans-serif;
    color: #fff;
    padding-top: 3px;
    padding-left: 20px;
    float: right;
    display: none;
}
*/

div.login-error {
    min-height: 26px;
    width: 273px;
    position: absolute;
    left: 38px;
    top: -26px;
    border-radius: 5px;
    font: 15px normal Helvetica, Arial, sans-serif;
    color: #fff;
    padding-top: 3px;
    text-align: center;
    float: right;
    display: none;
}
/*
div.change-ajaxloader {
    height: 20px;
    width: 240px;
    position: absolute;
    top: 100px;
    left: 50%;
    margin-left: -110px;
    background: url('/images/themes/cyan/ajax-loader-small.gif') no-repeat 5px 3px;
    border-radius: 5px;
    font: 12px normal Helvetica, Arial, sans-serif;
    color: #fff;
    padding-top: 3px;
    padding-left: 20px;
    float: right;
    display: none;
}*/

div.change-error {
    height: 36px;
    width: 240px;
    position: absolute;
    top: 100px;
    left: 50%;
    margin-left: -100px;
    border-radius: 5px;
    font: 12px normal Helvetica, Arial, sans-serif;
    color: #fff;
    padding-top: 3px;
    text-align: center;
    float: right;
    display: none;
}
/*
div.redirect {
    width: 250px;
    margin: 0 auto;
    margin-top: 40px;
    font: 20px normal Helvetica, Arial, sans-serif;
    color: #fff;
    background: url('/images/themes/cyan/ajax-loader-big-w.gif') no-repeat left center;
    padding-left: 30px;
    text-align: center;
}*/

label {
    font: 20px normal Helvetica, Arial, sans-serif;
    color: #fff;
    width: 120px;
}

#regForm {
    width: 350px;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -35px;
    margin-left: -175px;
}

#username, #userpswd, #serial, #num, #captcha, #pswd, #pswd1 {
    background: transparent;
}

input {
    background-color: #fff;
    border: 1px #c0c0c0 solid;
    font: 18px normal Helvetica, Arial, Courier New, Courier, monospace;
    color: #0391cd;
    margin-bottom: 2px;
    border-radius: 5px;
    text-align: center;
    position: relative;
    z-index: 2;
}
input.default {
    background-color: #fff;
    border: 1px #c0c0c0 solid;
    font: 18px normal Helvetica, Arial, Courier New, Courier, monospace;
    color: #a0a0a0;
    margin-bottom: 2px;
    border-radius: 5px;
}

input.disabled {
    background-color: #edf1f6;
    border: 1px #c0c0c0 solid;
    font: 18px normal Helvetica, Arial, Courier New, Courier, monospace;
    color: #a0a0a0;
    margin-bottom: 2px;
    border-radius: 5px;
    cursor: default;
}

input[type=submit] {
    cursor: pointer;
}

input[type=button] {
    cursor: pointer;
}
/*
div.buttons {
    margin-right: 35px;
    float: right;
}
*/

#fstep_1, #fstep_2, #fstep_3, #rstep_1, #rstep_2, #rstep_3, #rstep_4, #rstep_5, #rstep_6, #rstep_7 {
    position: relative;
}
#fstep_2, #fstep_3, #rstep_1, #rstep_2, #rstep_3, #rstep_4, #rstep_5, #rstep_6, #rstep_7  {
    display: none;
}

#rstep_4 {
    top: -35px;
}

#rstep_5 {
    top: -55px;
}

#rstep_6 {
    top: -35px;
}

#forgot-container span.forgot-title {
    color: #fff;
    font: 28px normal Helvetica, Arial, sans-serif;
    position: absolute;
    top: 80px;
    left: 90px;
}

#logined-container div.title {
    color: #fff;
    font: 16px normal Helvetica, Arial, sans-serif !important;
    position: relative;
    top: 370px;
    left: 0;
    width: 100%;
    padding: 0 auto;
}

.forgot-fstep-title {
    color: #fff;
    font: 18px normal Helvetica, Arial, sans-serif;
    text-align: center;
    position: relative;
    left: 0;
    width: 100%;
    margin: 0 auto;
}

span.reg-rstep-title {
    color: #fff;
    font: 18px normal Helvetica, Arial, sans-serif;
    text-align: center;
}
/*
div.forgot-ajaxLoader {
    color: #fff;
    min-height: 32px;
    min-width: 200px;
    padding-left: 30px;
    padding-top: 16px;
    font: 12px normal Helvetica, Arial, sans-serif;
    position: absolute;
    top: 300px;
    left: 120px;
    text-align: center;
    background: url('/images/themes/cyan/ajax-loader-small.gif') no-repeat left center;
    display: none;
}*/

#fstep_2 div.forgot-ajaxLoader {
    top: 320px;
    left: 120px;
}

div.forgot-errmsg {
    color: #fff;
    min-height: 32px;
    min-width: 200px;
    padding-left: 5px;
    padding-top: 16px;
    font: 12px normal Helvetica, Arial, sans-serif;
    position: absolute;
    top: 300px;
    left: 120px;
    text-align: center;
    display: none;
}

#fstep_2 div.forgot-errmsg {
    top: 320px;
    left: 120px;
}

#reg-container div.reg-errmsg {
    /*color: #fff;*/
    min-height: 26px;
    width: 100%;
    padding-top: 16px;
    font: 14px normal Helvetica, Arial, sans-serif;
    float: left;
    margin: 0 auto;
    text-align: center;
    display: none;
}

#forgotForm input {
    top: -26px;
    width: 280px;
    text-align: center;
    background-color: transparent;
    color: #00a0e3;
}

#fstep_2 div.kassa_back {
    color: #fff;
    font: 16px normal Helvetica, Arial, sans-serif;
    position: absolute;
    max-width: 350px;
    top: 200px;
    left: 80px;
    text-align: center;
    display: none;
}
#fstep_2 div.phone_back {
    position: absolute;
    min-width: 64px;
    min-height: 64px;
    top: 220px;/*300px;*/
    left: 150px;
    border: solid #fff 2px;
    border-radius: 4px;
    text-align: center;
    background: #00a0e3 url('/images/themes/cyan/phone-18x36-w.png') no-repeat center center;
    cursor: pointer;
    display: none;
}
#fstep_2 div.email_back {
    position: absolute;
    min-width: 64px;
    min-height: 64px;
    border: solid #fff 2px;
    border-radius: 4px;
    top: 220px;/*300px;*/
    left: 270px;
    text-align: center;
    background: #00a0e3 url('/images/themes/cyan/email-29x29-w.png') no-repeat center center;
    cursor: pointer;
    display: none;
}
/*
#fstep_2 input {
    position: absolute;
    text-align: center;
    color: #00a0e3;
    font: 18px normal Helvetica, Arial, sans-serif;
}*/

#reg-container span.reg-title {
    color: #fff;
    font: 28px normal Helvetica, Arial, sans-serif;
    position: absolute;
    top: 50px;
    left: 150px;
    max-width: 200px;
}

select {
    text-align: center;
    color: #00a0e3;
    background-color: #fff;
    border: 1px #00a0e3 solid;
    border-radius: 4px;
    font: 16px normal Helvetica, Arial, sans-serif;
    width: 250px;
    margin-top: 10px;
}

select.disabled {
    text-decoration: none;
    background-color: #ddd;
    border: 1px #00a0e3 solid;
    border-radius: 4px;
    color: #898989;
    margin-bottom: 2px;
}

#rstep_1 #street {
    /*position: absolute;
    top: 240px;
    left: 120px;*/
}

#rstep_2 #build {
    /*position: absolute;
    top: 240px;
    left: 120px;*/
}

#rstep_3 #appart {
    /*position: absolute;
    top: 240px;
    left: 120px;*/
}
/*
#ajaxLoader {
    display: none;
    background: url("/images/themes/cyan/ajax-loader-small.gif") no-repeat scroll 0% 0% transparent;
    min-height: 16px;
    min-width: 16px;
    position: relative;
    top: 3px;
}
*/

input.phone_recovery {
    width: 290px;
}
input.email_recovery {
    width: 290px;
}

div.client-title {
    width: 100%;
    font: 24px 'Times New Roman', sans-serif;
    margin-top: 80px;
    color: #fff;
    text-align: center;
    float: left;
}

div.loading {
    background: url('/images/loading.gif') no-repeat 0 0px;
    width: 32px;
    height: 32px;
    display: none;
    position: absolute;
    left: 229px;
    bottom: 80px;
}

#errorDialog {
    position: relative;
}

#errorDialog span {
    width: 100%;
    height: 50px;
    display: block;
    position: relative;
    top: 80px;
    text-align: center;
}

#errorDialog div#err-msg {
    color: #ffffff;
    min-height: 26px;
    width: 100%;
    padding: 0px; /*-top: 16px;*/
    font: 14px normal Helvetica, Arial, sans-serif;
    float: left;
    margin: 0 auto;
    text-align: center;
    position: relative;
    top: 150px;
}

#errorDialog img {
    position: relative;
    left: 0px;
    top: 0px;
}


.passchecker {
    width: 20px;
    position: relative;
    margin: 0px;
    padding: 0px;
    display: block;
}
.passchecker label {
    width: 20px;
    height: 20px;
    cursor: pointer;
    position: absolute;
    top: 0;
    left: 0;
/*    background: #fcfff4;
    background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);*/
    background: #ffffff;
    border-radius: 4px;
}
.passchecker label:after {
    content: '';
    width: 9px;
    height: 5px;
    position: absolute;
    top: 4px;
    left: 4px;
    border: 3px solid #00a0e3;
    border-top: none;
    border-right: none;
    background: transparent;
    opacity: 0;
    transform: rotate(-45deg);
}
/*
.squaredFour label:hover::after {
    opacity: 0.5;
}*/
.passchecker input {
    visibility: hidden;
}
.passchecker input:checked + label:after {
    opacity: 1;
}


.coinside span.title {
    color: #fff;
    font: 28px normal Helvetica, Arial, sans-serif;
    position: absolute;
    top: 80px;
    width: 100%;
    text-align: center;
}

#errorDialog span.title {
    left: 0;
    top: 80px;
}

div.input_block input
{
    top: -26px;
    width: 280px;
    left: 0px;
    text-align: center;
    background-color: transparent;
    color: #00a0e3;
    height: 22px;
}

div.input_block {
    position: relative;
    left: 0px;
    width: 281px;
    height: 26px;
    margin: 0 auto;
}

div.bghint {
    top: 0px;
    left: 0px;
    background-color: #fff;
    z-index: 0;
    position: relative;
    width: 282px;
    height: 26px;
    font: 18px normal Helvetica, Arial, Courier New, Courier, monospace;
    color: #a0a0a0;
    border-radius: 5px;
    text-align: center;
    line-height: 26px;
}

#errarea {
    margin-top: 100px;
}

#errarea span {
    width: 100%;
    display: block;
    text-align: center;
    margin: 0px;
}

#errarea img {
    margin: 0 auto;
}

#err-msg {
    color: #ffffff;
    font: 18px normal Helvetica, Arial, Courier New, Courier;
    text-align: center;
    margin: 50px auto 0;
    width: 400px;
}

div.step_1_description {
    color: #ffffff;
    font: 18px normal Helvetica, Arial, Courier New, Courier;
    text-align: center;
    margin: 50px auto 0;
    width: 350px;
}

div.uktitle
{
    display: none;
}

div.agreement {
   height: 250px;
   max-height: 250px;
   margin-top: -90px;
   overflow-y: auto;
   color: #fff;
}