/* FRM.LAYOUT | 99-FRM-LOGIN.PHP | COPYRIGHT REFLECTLAB.COM */
/* DEFAULT | 20210110.01034RZE */
/* ======================== */

.login-container {height: 0px;}
                  
/* ======================== */

/*DEFAULT*/
.login-container {overflow: hidden;}
.login-container {-webkit-transition: height .8s ease; transition: height .8s ease;/*duration linked to JS code > loginQr.js*/}

.login-container .login-step1-password.js_hidden {opacity: 0;}
.login-container .login-step1-password.js_hidden div {display: none;}
.login-container .login-step1-password {opacity: 1;}
.login-container .login-step1-password {-webkit-transition: opacity .2s ease; transition: opacity .2s ease;}

.login-container .field-label.login-label.label-back {text-align: left;}
/*.login-container input.button-back {opacity: 0.5;}*/
.login-container .login-step1 input.button-back, .login-container .login-step3 input.button-back {width: 87px;}

.login-container .login-step2 .qrlogin-container {position: relative;}

/*linked to and same as original qr-format / qr-size during generation (size=4)*/
/*.login-container .login-step2 .qrlogin-image {width: 195px; height: 195px;}*/
/*.login-container .login-step2 .qrlogin-image-block {width: 72px; height: 72px;}*/
/*.login-container .login-step2 .qrlogin-image-block.image-block-bottomleft {height: 48px;}*/
/*linked to and same as original qr-format / qr-size during generation (size=5)*/
.login-container .login-step2 .qrlogin-image {width: 260px; height: 260px;}
.login-container .login-step2 .qrlogin-image-block {width: 45px; height: 45px;}
.login-container .login-step2 .qrlogin-image-block.image-block-bottomleft {height: 48px;}
.login-container .login-step2 .qrlogin-icon {top: calc(50% - 70px); left: calc(50% - 70px); height: 140px; width: 140px; line-height: 140px;}
.login-container .login-step2 .qrlogin-icon.js_busy {line-height: 116px;}
/*linked to and same as original qr-format / qr-size during generation (size=6)*/
/*.login-container .login-step2 .qrlogin-image {width: 390px; height: 390px;}*/
/*.login-container .login-step2 .qrlogin-image-block {width: 72px; height: 72px;}*/
/*.login-container .login-step2 .qrlogin-image-block.image-block-bottomleft {height: 48px;}*/
/*.login-container .login-step2 .qrlogin-icon {top: calc(50% - 100px); left: calc(50% - 100px); height: 200px; width: 200px; line-height: 200px;}*/
/*.login-container .login-step2 .qrlogin-icon.js_busy {line-height: 176px;}*/

.login-container .login-step2 .qrlogin-image.js_disabled {opacity: 0.05;}
.login-container .login-step2 .qrlogin-image.js_hidden {opacity: 0;}
.login-container .login-step2 .qrlogin-image-block {position: absolute; background-color: white;}
.login-container .login-step2 .qrlogin-image-block.image-block-topleft {top: 0; left: 0;}
.login-container .login-step2 .qrlogin-image-block.image-block-topright {top: 0; right: 0;}
.login-container .login-step2 .qrlogin-image-block.image-block-bottomleft {bottom: 0; left: 0;}
.login-container .login-step2 .qrlogin-icon {position: absolute; background-color: rgba(255,255,255,0.7); text-align: center; font-weight: 600;}
.login-container .login-step2 .qrlogin-icon.js_success {font-size: 90px; color: rgba(20,130,22,1.00);}
.login-container .login-step2 .qrlogin-icon.js_busy {font-size: 90px; color: rgba(226,152,72,1.00);}
.login-container .login-step2 .qrlogin-icon.js_error {font-size: 90px; color: rgba(179,35,23,1.00);}
.login-container .login-step2 .form-field-center {width: 170px;}

/* ======================== */

.login-container .login-step2 .form-field-center {width: 110px;}
.login-container .login-step2 .button-refresh {margin-left: 30px;}