/* https://fonts.googleapis.com/css?family=Ubuntu:400,300,700 */
/* cyrillic */
@font-face {
    font-family: 'Ubuntu';
    font-style: normal;
    font-weight: 300;
    src: local('Ubuntu Light'), local('Ubuntu-Light'), url(4iCv6KVjbNBYlgoC1CzjtGyNL4U.woff2) format('woff2');
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* cyrillic */
@font-face {
    font-family: 'Ubuntu';
    font-style: normal;
    font-weight: 400;
    src: local('Ubuntu Regular'), local('Ubuntu-Regular'), url(4iCs6KVjbNBYlgoKew72j00.woff2) format('woff2');
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* cyrillic */
@font-face {
    font-family: 'Ubuntu';
    font-style: normal;
    font-weight: 700;
    src: local('Ubuntu Bold'), local('Ubuntu-Bold'), url(4iCv6KVjbNBYlgoCxCvjtGyNL4U.woff2) format('woff2');
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin */
@font-face {
    font-family: 'Ubuntu';
    font-style: normal;
    font-weight: 300;
    src: local('Ubuntu Light'), local('Ubuntu-Light'), url(4iCv6KVjbNBYlgoC1CzjsGyN.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin */
@font-face {
    font-family: 'Ubuntu';
    font-style: normal;
    font-weight: 400;
    src: local('Ubuntu Regular'), local('Ubuntu-Regular'), url(4iCs6KVjbNBYlgoKfw72.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin */
@font-face {
    font-family: 'Ubuntu';
    font-style: normal;
    font-weight: 700;
    src: local('Ubuntu Bold'), local('Ubuntu-Bold'), url(4iCv6KVjbNBYlgoCxCvjsGyN.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.clearfix { display: block }

.clearfix:after {
    clear: both;
    content: "";
    display: block;
    height: 0;
    visibility: hidden
}

html {
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    font-family: sans-serif;
}

body { margin: 0 }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block }

audio, canvas, progress, video {
    display: inline-block;
    vertical-align: baseline
}

audio:not([controls]) {
    display: none;
    height: 0
}

[hidden], template { display: none !important; }

a:active, a:hover { outline: 0 }

abbr[title] { border-bottom: 1px dotted }

b, strong { font-weight: 700 }

dfn { font-style: italic }

h1 {
    font-size: 2em;
    margin: .67em 0
}

mark {
    background: #ff0;
    color: #000
}

small { font-size: 80% }

sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sup { top: -.5em }

sub { bottom: -.25em }

img { border: 0 }

svg:not(:root) { overflow: hidden }

figure { margin: 1em 40px }

hr {
    box-sizing: content-box;
    height: 0
}

pre { overflow: auto }

code, kbd, pre, samp {
    font-family: monospace;
    font-size: 1em
}

button, input, optgroup, select, textarea {
    color: inherit;
    font: inherit;
    margin: 0;
    outline: 0
}

button { overflow: visible }

button, select { text-transform: none }

button, html input[type=button], input[type=reset], input[type=submit] {
    -webkit-appearance: button;
    cursor: pointer
}

button[disabled], html input[disabled] { cursor: default }

button::-moz-focus-inner, input::-moz-focus-inner {
    border: 0;
    padding: 0
}

input { line-height: normal }

input[type=checkbox], input[type=radio] {
    box-sizing: border-box;
    padding: 0
}

input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { height: auto }

input[type=search] {
    -webkit-appearance: textfield;
    box-sizing: content-box
}

input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration { -webkit-appearance: none }

fieldset {
    border: 1px solid silver;
    margin: 0 2px;
    padding: .35em .625em .75em
}

legend {
    border: 0;
    padding: 0
}

textarea { overflow: auto }

optgroup { font-weight: 700 }

table {
    border-collapse: collapse;
    border-spacing: 0
}

td, th { padding: 0 }

html {
    color: #000;
    font: 300 normal 14px/1.28 Ubuntu, 'Segoe UI', Tahoma, Arial, Verdana, sans-serif;
}

body, html { height: 100% }

body {
    background: #fff;
    min-height: 100%;
    min-width: 980px
}

.auth {
    background: url(../images/login/auth-bg.jpg) 50% 50% no-repeat;
    background-size: cover;
    height: 100%;
    text-align: center;
    width: 100%;
}

.auth:after {
    content: ' ';
    height: 100%
}

.auth .auth_form, .auth:after {
    display: inline-block;
    vertical-align: middle
}

.auth .auth_form {
    background: hsla(0, 0%, 100%, .5);
    color: #fff;
    padding: 8px;
    text-align: left;
    width: 496px
}

.auth .auth_form form { background: rgba(68, 144, 226, .9) }

.auth .auth_form form .header {
    background: url(../images/login/logo.png) 39px 27px no-repeat;
    border-bottom: 1px solid hsla(0, 0%, 100%, .25);
    font-size: 25px;
    padding: 35px 10px 35px 167px;
}

.auth .auth_form form .body { padding: 43px 42px }

.auth .auth_form form .body label {
    display: block;
    margin-bottom: 25px;
    position: relative
}

.auth .auth_form form .body label:last-child { margin-bottom: 62px }

.auth .auth_form form .body label input {
    background: 0;
    border: 0;
    border-bottom: 1px solid hsla(0, 0%, 100%, .5);
    color: #fff;
    font-size: 16px;
    outline: 0;
    padding: 9px 9px 9px 44px;
    width: 100%;
}

.auth .auth_form form .body label input::-webkit-input-placeholder {
    color: #fff;
    font-size: 16px
}

.auth .auth_form form .body label input:-moz-placeholder, .auth .auth_form form .body label input::-moz-placeholder {
    color: #fff;
    font-size: 16px
}

.auth .auth_form form .body label input:-ms-input-placeholder {
    color: #fff;
    font-size: 16px
}

.auth .auth_form form .body label.login input { background: url(../images/login/login-ico.png) 4px 5px no-repeat }

.auth .auth_form form .body label.pass input { background: url(../images/login/pass-ico.png) 6px 4px no-repeat }

.err_msg {
    color: red;
    font-size: 13px;
    line-height: 20px;
    background-color: rgba(255, 255, 255, 0.5);
    padding: 10px;
    text-align: center;
    border-bottom: 1px solid red;
}

.migration_warning_msg {
    color: #ffe564;
    padding: 5px 0;
    font-size: 11pt;
    font-weight: 400;
    text-align: center;
}

.auth .auth_form form .body label.error input {
    border-color: red;
    color: red
}

.auth .auth_form form .body label.error input::-webkit-input-placeholder { color: red }

.auth .auth_form form .body label.error input:-moz-placeholder, .auth .auth_form form .body label.error input::-moz-placeholder { color: red }

.auth .auth_form form .body label.error input:-ms-input-placeholder { color: red }

.auth .auth_form form .body label.error .err_msg { display: block }

.auth .auth_form form .body button {
    background: #fff;
    border: 0;
    border-radius: 4px;
    box-shadow: 0 18px 38px -22px rgba(0, 0, 0, .75);
    color: #4490e2;
    display: block;
    font-size: 18px;
    font-weight: 300;
    height: 60px;
    line-height: 60px;
    outline: 0;
    text-transform: uppercase;
    width: 100%;
    margin-top: 10px;
    margin-bottom: 5px;
}

.auth .auth_form form .body button.cancel {
    background: #FFEFEF;
    color: #E24444;
}

.auth .auth_form form .body button:hover { background: #dee5ee }

.auth .auth_form form .body button:active { box-shadow: none }

.loader {
    height: 4px;
    background-color: transparent;
    background-color: rgba(0, 0, 0, .15);
    position: absolute;
    overflow: hidden;
    z-index: 99999;
}

    .loader:before {
        display: block;
        position: absolute;
        content: "";
        left: -200px;
        width: 200px;
        height: 4px;
        background-color: #B4CBE4;
        -webkit-animation: loading 2s linear infinite;
        -moz-animation: loading 2s linear infinite;
        -ms-animation: loading 2s linear infinite;
        -o-animation: loading 2s linear infinite;
        animation: loading 2s linear infinite;
    }

@keyframes loading {
    from {
        left: -200px;
        width: 30%;
    }

    50% {
        width: 30%;
    }

    70% {
        width: 70%;
    }

    80% {
        left: 50%;
    }

    95% {
        left: 120%;
    }

    to {
        left: 100%;
    }
}

.pass_forgot {
    text-align: right;
    padding: 8px;
    font-size: 12pt;
}

.pass_forgot a {
    color: #fff;
}
.mail-link {
    text-align: center;
    padding: 8px 0px;
    font-size: 12pt;
}
.mail-link a:link,
.mail-link a:visited,
.mail-link a:active {
    color: #fff;
}

@-webkit-keyframes autofill_login {
    to {
        color: #FFF;
        background: url(../images/login/login-ico.png) 4px 5px no-repeat;
    }
}
@-webkit-keyframes autofill_password {
    to {
        color: #FFF;
        background: url(../images/login/pass-ico.png) 4px 5px no-repeat;
    }
}

input[name=login]:-webkit-autofill,
input[name=login]:-webkit-autofill:hover,
input[name=login]:-webkit-autofill:focus,
input[name=login]:-webkit-autofill:active {
    -webkit-animation-name: autofill_login;
    -webkit-animation-fill-mode: both;
}

input[name=password]:-webkit-autofill,
input[name=password]:-webkit-autofill:hover,
input[name=password]:-webkit-autofill:focus,
input[name=password]:-webkit-autofill:active {
    -webkit-animation-name: autofill_password;
    -webkit-animation-fill-mode: both;
}


a.infoicon { display: inline-block; width: 30px; height: 60px; }

[class^=infoicon-] {
    display: inline-block;
    background-image: url(../images/tb-icons.png);
    width: 30px;
    height: 30px;
}

a.infoicon .infoicon-inner {  background-position: -30px -30px }

a.infoicon .infoicon-inner:hover { background-position: 0 -30px }

.button-with-infoicon {
    display: inline-block !important;
    width: calc(100% - 35px) !important;
}

.tooltip{
    position: absolute;
    padding: 10px 13px;
    z-index: 2;

    color: #303030;
    background-color: #f5f5b5;
    border: 1px solid #DECA7E;

    font-family: sans-serif;
    font-size: 12px;
    line-height: 18px;
    text-align: center;
}

.tooltip h3{
    margin: 0 0 5px;
    text-align: left;
}