﻿body {
    background-color: white !important;
    margin: 0;
    font-family: Roboto Condensed Regular;
    font-size: 16px;
    color: #5E6A71;
    line-height: normal !important;
    background-image: none !important;
}

div, input {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

@font-face {
    font-family: Roboto Condensed Light;
    src: url(../Font/Roboto_Condensed/RobotoCondensed-Light.ttf);
}

@font-face {
    font-family: Roboto Condensed Bold;
    src: url(../Font/Roboto_Condensed/RobotoCondensed-Bold.ttf);
}

@font-face {
    font-family: Roboto Condensed Regular;
    src: url(../Font/Roboto_Condensed/RobotoCondensed-Regular.ttf);
}

/*@font-face { font-family: Signika Bold; src: url(../Font/Signika/Signika-Bold.ttf); }*/

@font-face {
    font-family: Signika Light;
    src: url(../Font/Signika/Signika-Light.ttf);
}

@font-face {
    font-family: Signika Semibold;
    src: url(../Font/Signika/Signika-Semibold.ttf);
}

.login-main-container {
    display: flex;
    height: 609px;
    min-height: 100vh;
    flex-wrap: nowrap;
}

.login-left-pane {
    width: 500px;
    flex-shrink: 0;
    flex-grow: 0;
    padding: 0 50px;
    display: flex;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
}

.flex-separator {
    flex-grow: 1;
}

.form-container {
    height: 584px;
    flex-grow: 0;
    width: 400px;
    padding: 50px 0;
}

.login-right-pane .form-container {
    padding-top: 56px !important;
    font-size: 24px !important;
    line-height: 33px !important;
}

.login-logo {
    margin: 5px 0;
}
.login-by-access-key-form,
.login-by-username-form {
    position: relative;
}

.login-right-pane {
    background-image: url("../Images/LoginPage/background-img.jpg");
    background-size: cover;
    flex-grow: 1;
    color: #FFFFFF;
    font-size: 22px;
    line-height: 27px;
    padding: 0 47px;
    display: flex;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
    font-family: "Roboto Condensed Light" !important;
}

.login-error,
.login-error.access-key,
.login-error.username,
.login-error.forgot-pwd,
.login-error.reset-pwd {
    position: absolute;
    top: 47px;
    width: 400px;
    text-align: center;
    border-radius: 2px;
    background-color: rgba(255, 106, 106, 0.18);
    color: #FF6A6A;
    padding: 10px 40px;
}

.login-error.login-info {
    background-color: rgba(0, 176, 202, 0.18) !important;
    color: #00B0CA !important;
}

.login-error.forgot-pwd,
.login-error.reset-pwd {
    position: static;
    top: 0;
    margin-top: 8px;
}

input.login {
    background-color: #FFFFFF;
    border: solid 2px #C9CDD0;
    border-radius: 2px;
    color: #5E6A71;
    font-family: "Roboto Condensed Regular";
    font-size: 16px;
    width: 400px;
    height: 40px;
    display: block;
    padding: 8px 15px;
}

input.login:focus {
    border-color: #00B0CA !important;
}

input.login.pwd {
    padding-right: 44px !important;
}

input.login::-webkit-input-placeholder { /* WebKit browsers */
    color: #C9CDD0;
}

input.login:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: #C9CDD0;
}

input.login::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #C9CDD0;
}

input.login:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #C9CDD0;
}

input.login[type="password"] {
    font-size: 22px !important;
}

input.login[type="password"]::-webkit-input-placeholder { /* WebKit browsers */
    font-size: 16px !important;
    top: -2px !important;
    position: relative;
}

input.login[type="password"]:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    font-size: 16px !important;
    top: -2px !important;
    position: relative;
}

input.login[type="password"]::-moz-placeholder { /* Mozilla Firefox 19+ */
    font-size: 16px !important;
    top: -2px !important;
    position: relative;
}

input.login[type="password"]:-ms-input-placeholder { /* Internet Explorer 10+ */
    font-size: 16px !important;
    top: -2px !important;
    position: relative;
}

input.login[type="password"]::-ms-input-placeholder { /* Edge */
    transform: scale(0.73) translateX(-3.9rem);
}

    input.login.validation,
    input.login.validation:focus { border-color: #FFA8A8 !important; }

.display-inline {
    display: inline-block;
}

.margin-bottom-8 {
    margin-bottom: 8px;
}

.margin-bottom-16 {
    margin-bottom: 16px;
}

.margin-bottom-32 {
    margin-bottom: 32px;
}

.margin-bottom-59 {
    margin-bottom: 59px;
}

.padding-top-127 {
    padding-top: 127px;
}

.padding-top-77 {
    padding-top: 77px;
}

.margin-top-16 {
    margin-top: 16px;
}

.margin-top-47 {
    margin-top: 47px;
}

.position-relative {
    position: relative;
}

.b-view-pwd {
    position: absolute;
    top: 8px;
    right: 15px;
    cursor: pointer;
}

.logincheckbox {
    display: inline-block;
    margin-top: 0 !important;
    padding-top: 0 !important;
    margin-bottom: 0 !important;
}

.logincheckbox input[type="checkbox"] {
    display: none;
}

.logincheckbox label {
    cursor: pointer;
    
    font-size: 16px;
    font-family: "Roboto Condensed Regular";
}

.logincheckbox input[type="checkbox"] + label span {
    display: inline-block;
    width: 19px;
    height: 19px;
    margin: 0 10px 0 -2px;
    vertical-align: top;
    cursor: pointer;
    background: url('../Images/LoginPage/checkbox-normal.svg') ;
}

.logincheckbox  input[type="checkbox"]:hover:not(:checked) + label span {
    background: url('../Images/LoginPage/checkbox-hover.svg') ;
}

.logincheckbox input[type="checkbox"]:checked + label span {
    background: url('../Images/LoginPage/checkbox-selected.svg') ;
}

a:not(.FormPopinTitleButtonSkin) {
    color: #00B0CA !important;
    font-family: "Roboto Condensed Regular" !important;
    
    text-decoration: none;
}

a:not(.FormPopinTitleButtonSkin):hover {
    color: #00B0CA !important;
    text-decoration: underline !important;
}

a.forgotPass {
    float: right !important;
}

label { font-weight: 400 !important; }

.text-center {
    text-align: center;
}

.btn-login {
    border-radius: 2px;
    border: solid 2px #00B0CA;
    color: #FFFFFF;
    background-color: #00B0CA;
    font-family: "Roboto Condensed Regular";
    font-size: 16px;
    padding: 8px 40px;
    cursor: pointer;
}

.btn-login:hover {
    background-color: #FFFFFF !important;
    color: #00B0CA !important;
}

.login-footer {
    color: #A6ACB0;
    font-size: 11px;
    padding-bottom: 12px;
    height: 25px;
    flex-grow: 0;
    margin-bottom: 20px;
}

.login-footer-MigrationAzure {
    color: #5e6a71;    
    padding-bottom: 12px;
    height: 60px;
    margin-bottom: 20px;
    opacity: 1;
    letter-spacing: 0px;
    line-height: 21px;
}

.login-footer-FontSize16 {
    font-size: 16px;
}

.login-footer-FontSize14 {
    font-size: 14px;
}

.login-footer-Padding {
    padding-left: 10px;
    padding-right: 10px;
}

.login-footer-BoxPopinSkin {
    background-color: #00B0CA;
    padding-left: 5px;
    padding-right: 10px;    
    height: 44px !important;
    line-height: 1 !important
}

.login-footer-Skin {    
    background-color: #F7F7F7;    
}

.divPrivacyPolicy {
    width: 790px;
    height: 440px;
    float: left;
    display: block;    
    overflow: hidden;
    border: 10px solid rgba(0, 0, 0, 0.15) !important;
}

.centered {
    width: 800px;
    height: 500px;
    position: absolute !important;
    top: 50%;
    left: 50%;
    margin-left: -320px; /* half width*/
    margin-top: -240px; /* half height*/
}

.forgot-pwd-form {
    position: relative;
}

.forgot-pwd-title-container {
    position: absolute;
    top: 20px;
    width: 100%;
}

.login-title {
    text-align: center;
    font-size: 20px;
    font-family: "Roboto Condensed Regular";
}

.login-message {
    margin-top: 16px;
    text-align: center;
    padding: 0 40px;
    font-family: "Roboto Condensed Regular";
}

#pwd-sec-strength.popover {
    left: 104% !important;
    top: -6px !important;
    padding:18px 18px 8px 18px !important;
    line-height: 20px !important;
    font-family: Roboto Condensed Regular !important;
    white-space: nowrap !important;
}

#pwd-sec-strength.popover .popover-title {
    padding: 0 !important;
    background-color: transparent !important;
    border-bottom: none !important;
    margin-bottom: 28px !important;
    white-space: nowrap !important;
}

#pwd-sec-strength.popover > .arrow {
    top: 12%;
    left: -11px;
    margin-top: -11px;
    border-right-color: #999;
    border-right-color: rgba(0,0,0,.25);
    border-left-width: 0;
}

#pwd-sec-strength.popover > .arrow:after {
    bottom: -10px;
    left: 1px;
    content: " ";
    border-right-color: #fff;
    border-left-width: 0;
}

.pwd-strength-check {
    height: 24px;
    width: 24px;
    margin-right: 12px;
}


div.box1 {
    background-color: #000000;
    border-radius: 4px 4px 4px 4px;
    box-shadow: 0 0 10px #000000;
    height: 310px;
    overflow: hidden;
    width: 448px;
}

div.box2 {
    background-color: #323A40;
    border-radius: 4px 4px 4px 4px;
    box-shadow: 0 0 10px #000000;
    height: 310px;
    opacity: 0.85;
    overflow: hidden;
    min-width: 216px;
}

div.box3 {
    background-color: #545B5F;
    border-radius: 4px 4px 4px 4px;
    box-shadow: 0 0 10px #000000;
    height: 88px;
    opacity: 0.7;
    overflow: hidden;
    width: 965px;
}

.txtReason {
    color: #FF0000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
}

.txtRemember {
    color: #FFFFFF;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
}

.newTitle {
    color: #FFFFFF;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 20px;
}

.textRed {
    font-family: Verdana, Times New Roman, Arial;
    font-size: 10px;
    color: Red;
}

.inputGC {
    background-image: -moz-linear-gradient(center top, #FFFFFF 0%, #DFDFDF 50%, #D1D1D1 51%, #D1D1D1 100%);
    border-radius: 2px 2px 2px 2px;
    border-style: none;
    color: #000000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    height: 31px;
    text-shadow: 0.07em 0.07em #FFFFFF;
    min-width: 118px;
}

.inputSub {
    background-image: -moz-linear-gradient(center top, #FFFFFF 0%, #DFDFDF 50%, #D1D1D1 51%, #D1D1D1 100%);
    border-radius: 2px 2px 2px 2px;
    border-style: none;
    color: #000000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    height: 31px;
    text-shadow: 0.07em 0.07em #FFFFFF;
    min-width: 118px;
}

.footer {
    color: #FFFFFF;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
}

a.link {
    color: #FFFFFF;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    text-decoration: none;
}

a.link:hover { text-decoration: underline; }

.TopRound5 {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.BottomRound4 {
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

.FormBox {
    font-size: 14px;
    height: 25px;
    padding-top: 5px;
    display: block;
    float: none;
    overflow: auto;
}

.FormBoxText {
    margin-left: 5px;
    margin-right: 10px;
    margin-top: 3px;
    margin-bottom: 2px;
    text-shadow: 0.25px 0.25px #FFFFFF;
    color: #FFFFFF;
    font-size: 14px;
}

.list {
    overflow-x: hidden;
    overflow-y: scroll;
}

.FormPopinBorder {
    float: left;
    display: block;
    margin: 10px;
    overflow: hidden; 
   
    box-shadow: 0px 1px 6px 1px #AAAAAA;
    -webkit-box-shadow: 0px 1px 6px 1px #AAAAAA;
    -moz-box-shadow: 0px 1px 6px 1px #AAAAAA;
    background-color: #F2F2F2;
}

.FormPopinTitle {
    margin-left: 5px;
    margin-right: 10px;
    margin-top: 3px;
    margin-bottom: 2px;
}

.BoxPopinSkin {
    background-color: #00B0CA;
    padding-left: 10px;
    padding-right: 10px;
    filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0, startColorStr=#262626, endColorStr=#AAAAA9);
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    -moz-border-top-left-radius: 4px;
    -moz-border-top-right-radius: 4px;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
}

div.Right { float: right; }

.FormPopinTitleButton { text-decoration: none; }

a.FormPopinTitleButtonSkin,
a.FormPopinTitleButtonSkin:hover {
    color: #FFFFFF !important;
    text-shadow: 1px 1px #000000;
}

.skin {
    border: solid 1px #FFFFFF;
    background-color: #F7F7F7;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}

.txtPrivacy {
    color: Black;
    font-size: 12px;
    margin-left: 20px;
    margin-right: 20px;
    margin-top: 10px;
    text-align: justify;
    font-family: Verdana, Times New Roman, Arial;
}

.Pictos {
    font-weight: normal;
    font-style: normal;
    line-height: normal;
    font-family: 'Pictos', sans-serif;
}

.ButtonFormat {
    cursor: hand;
    cursor: pointer;
    height: 20px;
    border-width: 2px;
    border-radius: 2px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    padding-left: 12px;
    padding-right: 12px;
    padding-top: 2px;
    padding-bottom: 5px;
    border: 0px;
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
    margin-left: 4px;
    margin-right: 8px;
    margin-top: 0px;
    margin-bottom: 0px;
}

.ButtonSkin {
    background-color: #4b4e4f;
    color: White;
    text-shadow: 1px 1px #000;
    background-image: -moz-linear-gradient(center bottom, #4b4e4f 0%, #4b4e4f 50%, #6f7273 51%, #8f9293 100%);
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #4b4e4f), color-stop(0.5, #4b4e4f), color-stop(0.51, #6f7273), color-stop(1, #8f9293));
    background-image: -moz-linear-gradient(center bottom, #4b4e4f 0%, #4b4e4f 50%, #6f7273 51%, #8f9293;
}

.textBlack {
    font-family: Verdana, Times New Roman, Arial;
    font-size: 10px;
}

.DivLabelBox {
    float: left;
    clear: left;
    display: block;
    padding-left: 10px;
    padding-top: 9px; /*line-height:20px;*/
}

.LabelBox {
    clear: left;
    float: left;
    text-align: right;
    width: 100%; /*line-height:24px;*/
}

.ControlBox {
    float: left;
    padding-left: 6px;
    padding-top: 5px;
    padding-bottom: 8px;
    padding-right: 8px; /*line-height:34px;*/
}

.BottomSpaceText { margin-bottom: 8px; }

input.textbox { border: 1px solid #AAAAA9; }