.pageContainerClass {
    overflow: hidden
}

.pageContainerClass {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: 0 auto
}

body {
    -webkit-text-size-adjust: 100%;
    font-family: robotolight
}

#mobilenavbar {
    background: #34aadc none repeat scroll 0 0
}

.md-content h3 {
    background: #34aadc none repeat scroll 0 0;
    color: #0258a8
}

button {
    background: #fff;
    border: 1px solid #0077B6;
    border-radius: 4px;
    color: #0077B6;
    display: inline-block;
    font-family: RobotoLight;
    font-size: 18px;
    padding: 7px 15px;
    margin: 13px 0 0 0;
    height: 45.5px;
    outline: 0;
    -webkit-font-smoothing: subpixel-antialiased;
    -webkit-tap-highlight-color: transparent;
    width: 120px;
    min-width: 92px;
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
    -webkit-tap-highlight-color: transparent
}

#reg_button {
    height: 42px
}

.ASubmit_Button {
    float: left;
    margin-left: 14%;
    margin-top: -20px
}

button::-moz-focus-inner {
    border: 0
}

button:disabled:hover {
    background: #008b8b;
    color: #fff
}

#reges_button:hover {
    background: #008b8b;
    color: #fff
}

button:hover {
    background: #0258a8;
    color: #fff;
    font-weight: 600;
    outline: 0
}

button:active {
    position: relative;
    top: 0;
    outline: 0;
    border: 0
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0)
    }
    100% {
        -webkit-transform: rotate(360deg)
    }
}

@keyframes spin {
    0% {
        transform: rotate(0)
    }
    100% {
        transform: rotate(360deg)
    }
}

@font-face {
    font-family: RobotoLight;
    src: url(/tpl/css/Roboto-Light.ttf)
}

@font-face {
    font-family: RobotoRegular;
    src: url(/tpl/css/Roboto-Regular.ttf)
}

::-webkit-input-placeholder {
    color: #605b5b;
    font-family: robotolight
}

:-moz-placeholder {
    color: #605b5b;
    font-family: robotolight
}

::-moz-placeholder {
    color: #605b5b;
    font-family: robotolight
}

:-ms-input-placeholder {
    color: #605b5b;
    font-family: robotolight
}

.lgbox {
    display: table;
    height: 100%;
    width: 100%;
    z-index: 1000;
    font-family: RobotoLight
}

.lgbox_middle {
    display: table-cell
}

.lgbox_inner {
    margin-left: 3%;
    margin-top: 150px;
    width: 45%
}

#honeyPot {
    display: none
}

.langbox {
    position: absolute;
    bottom: 5%;
    right: 5%;
    color: #000
}

.langsel {
    font-family: robotolight;
    cursor: pointer;
    font-size: 11px
}

.lgbox_inner .inputbox {
    width: 90%;
    font-size: 16px
}

.lgbox_inner .errorbox {
    width: 90%;
    font-size: 16px
}

.but_txt, .close_but_txt {
    text-shadow: 0 0 0 #fff;
    font-family: poppins!important
}

#pass {
    padding-right: 20px!important
}

#pass:focus {
    padding-right: 20px!important
}

#pwph {
    padding: 4px 21px 4px 5px!important
}

#CurrentPhrase, #Expression, #uniqueWord {
    padding-right: 22px!important
}

.twoFAMessageClass {
    display: block;
    position: absolute;
    margin-top: -24px;
    font-size: 15px
}

.popup {
    position: relative;
    display: inline-block;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.popuptext, .popuptext2, .popuptext3 {
    width: 248px;
    background-color: #000;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 8px 0;
    position: absolute;
    z-index: 1;
    left: 40%;
    margin: -44px 0 0 55%
}

.popuptext2 {
    margin: -47px 0 0 5.6%
}

.popuptext3 {
    margin: -8.5% 0 0 54.6%
}

.popuptext2::after, .popuptext3::after, .popuptext::after {
    content: "";
    position: absolute;
    top: 41%;
    left: -4%;
    margin-left: -1px;
    border-width: 5px;
    border-style: solid;
    border-color: #000 transparent transparent transparent;
    -ms-transform: rotate(92deg);
    -webkit-transform: rotate(92deg);
    transform: rotate(92deg)
}

.signup_button {
    float: left;
    margin-left: 97%;
    margin-top: -42px;
    width: 90%;
    outline: 0;
    border: 0
}

.lgbox_inner button {
    padding: 2px 15px;
    height: 29px
}

.signupbox {
    float: left;
    width: 100%
}

#signupname {
    width: 42%
}

#signupemail {
    margin-left: 5.3%;
    width: 42%
}

.signup_button {
    position: relative;
    border: 0;
    outline: 0!important
}

.lock {
    margin: -9px 0 -26px 39px
}

.error {
    visibility: hidden
}

#error_name {
    color: red;
    font: 16px arial, sans-serif;
    position: absolute;
    text-align: center;
    max-width: 50%;
    width: auto;
    margin-top: 5px;
    margin-left: 5px;
    visibility: hidden
}

#divsignuperror_email, #divsignuperror_email_inuse {
    color: red;
    font: 16px arial, sans-serif;
    position: absolute;
    text-align: center;
    max-width: 50%;
    width: auto;
    margin-top: -24px;
    margin-left: 22%;
    visibility: hidden
}

#error_email, #error_email_inuse {
    visibility: hidden
}

#signupMessage {
    color: #101010;
    float: left;
    font-family: RobotoLight;
    margin-top: 10%;
    position: relative
}

.login_button {
    float: left;
    width: 100%;
    border: 0;
    outline: 0
}

.signup_button {
    position: relative;
    float: left;
    width: 100%;
    top: 7%;
    border: 0;
    outline: 0!important
}

a:link {
    padding: 1%;
    font-weight: 700;
    text-decoration: none;
    color: #000
}

a:visited {
    text-decoration: none
}

a:active {
    text-decoration: underline
}

#lock {
    float: right;
    margin-top: 205px;
    width: 16px;
    position: relative;
    margin-right: 33px
}

@media only screen and (min-width:300px) and (max-width:500px) {
    #lock {
        float: right;
        margin-top: 23px;
        width: 16px;
        position: relative
    }
}

.showHidePass {
    margin-left: -8%;
    margin-top: 59px;
    position: absolute;
    width: 16px
}

.showHidePass {
    top: -18vw;
    position: relative
}

@media only screen and (max-width:1000px) {
    .keyboardimg2 {
        margin-left: 43vw;
        margin-right: 6%;
        margin-top: -9.5vw!important
    }
}

@media only screen and (min-width:450px) and (max-width:699px) {
    .showHidePass {
        position: relative
    }
    .keyboardimg2 {
        margin-left: 31vw;
        margin-right: 6%;
        margin-top: -5.5vw!important
    }
}

@media only screen and (min-width:700px) and (max-width:999px) {
    .keyboardimg2 {
        margin-left: 29vw!important;
        margin-right: 15%!important;
        margin-top: -5.2vw!important
    }
}

.lockForB2B {
    left: -10.7%;
    float: right;
    position: relative!important
}

.lock_align {
    background-color: #fff;
    border-width: medium medium 1px;
    float: right;
    margin-top: -26px;
    position: relative;
    width: 16px;
    margin-right: 3px
}

.lock_align_settings {
    background-color: #fff;
    border-width: medium medium 1px;
    float: right;
    margin-top: -27px;
    position: relative;
    width: 16px;
    margin-right: 4px
}

@media only all and (max-width:1000px) {
    .lockForB2B {
        left: 0
    }
    #pwph {
        padding: 4px 19px 4px 5px!important
    }
    .popuptext {
        min-width: 10%;
        left: 8%;
        margin: -118px 0 0 0;
        font-size: 71%;
        padding: 7px
    }
    .popuptext::after {
        top: 100%;
        left: 49%;
        -ms-transform: rotate(-3deg);
        -webkit-transform: rotate(-3deg);
        transform: rotate(-3deg)
    }
    .lgbox_middle {
        vertical-align: middle
    }
    .lgbox_inner .errorbox {
        width: 100%;
        font-size: 16px
    }
    .lgbox_inner .inputbox {
        font-size: 16px;
        width: 100%;
        float: left
    }
    .ASubmit_Button {
        float: none;
        padding-top: 26px
    }
    #lock {
        margin-right: 0
    }
    .lgbox_inner {
        margin-left: auto;
        margin-right: auto;
        width: 50%;
        top: 50%;
        margin-top: 0;
        max-width: 350px
    }
    .signinbutton {
        padding: 7px 41.85%;
        border: 0;
        outline: 0!important
    }
    .inputbox {
        border-bottom: 1px solid #c4c4c4;
        width: 100%;
        padding: 4px 6px 4px 5px!important
    }
    .inputbox:focus {
        border-bottom: 1px solid #7bc1f7;
        width: 100%;
        padding: 4px
    }
    .errorbox {
        border-bottom: 1px solid red;
        width: 100%;
        padding: 4px;
        float: left
    }
    .lock_align {
        margin-top: -27px
    }
    .lock_align_settings {
        width: 21px;
        margin-top: -30px
    }
    #signupname {
        width: 100%
    }
    #signupemail {
        width: 100%
    }
    .login_button, .signup_button {
        float: left;
        margin-left: 0;
        margin-top: 2%;
        width: 100%;
        border: 0;
        outline: 0!important
    }
    #signupemail {
        margin-left: 0;
        margin-top: 10px
    }
    .lgbox_inner button {
        padding: 3px
    }
}

@media only screen and (min-device-width:320px) and (max-device-width:568px) and (-webkit-min-device-pixel-ratio:2) {
    .popuptext {
        left: 9%;
        margin: -113px 0 0 0;
        font-size: 71%
    }
    .popuptext::after {
        top: 100%;
        left: 49%;
        -ms-transform: rotate(-3deg);
        -webkit-transform: rotate(-3deg);
        transform: rotate(-3deg)
    }
}

@media only all and (max-width:450px) {
    .lgbox_inner {
        width: 70%
    }
    .popuptext {
        width: 75%;
        left: 9%;
        margin: -121px 0 0 0;
        font-size: 71%
    }
    .popuptext::after {
        top: 100%;
        left: 49%;
        -ms-transform: rotate(-3deg);
        -webkit-transform: rotate(-3deg);
        transform: rotate(-3deg)
    }
}

@media only screen and (min-width:1520px) {
    #lock, .lock_align_settings {
        margin-top: 57.5%!important;
        width: 18px;
        -webkit-transform: initial;
        transform: initial
    }
}

@media only all and (max-width:331px) {
    #error_name {
        max-width: 70%
    }
}

#loadOverlay {
    display: none
}