.loginBody{height: 100%; width: 100%; padding: 0px !important;}
.loginPage{position: relative; height: 100%;}
.loginBG{width: 100%; height: 100%; background-color: #000000;}
.loginBG img{display: block; width: 100%; height: 100%; object-fit: cover; object-position: left top;}

.loginPage .tzurLogo{position: absolute; right: 66px; bottom: 20px; padding: 0; white-space: nowrap;}

.loginContent_centered{padding: 100px 200px 0px;}

.loginContent{position: absolute; right: 0; left: 0; top: 0; bottom: 35px; overflow-x: hidden; overflow-y: auto;}
.loginContent *:focus{outline-color: white;}

.loginFrame{width: 540px; position: relative;}
.loginHeader{padding: 0px 0px 0px; text-align: center;}
.loginHeader a{display: inline-block; text-decoration: none;}
.loginHeader a img{display: block; max-width: 172px;}
.loginProcess{position: relative;}
.loginInProcess{position: absolute; left: 0; top: 0;}
.loginForm{padding: 20px 0px 0px 0px; width: 100%;}
.loginForm h1{color: white; text-align: center; font-size: 48px; line-height: 48px;}
.loginForm ul{padding: 13px 0px 0px 0px;}
.loginForm li{padding: 15px 0px 0px 0px;}
.loginForm li label{display: block; position: relative;}
.loginForm li label .labelText{pointer-events: none; position: absolute; left: 20px; top: 18px; padding-left: 40px; z-index: 1; font-size: 24px; font-weight: 300; transition: all 0.3s ease-in-out;}
.loginForm li label.activeInput span.labelText{top: 4px; font-size: 16px; font-weight: 400; padding-left: 24px;}
.loginForm li label input{-webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 14px; width: 100%; height: 70px; border: 0; padding-top: 12px; text-indent: 43px; font-size: 24px; font-weight: 300; box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.6);}
.loginForm li label .labelText:before{content: ''; font-family: 'icomoon' !important; position: absolute; left: 0; top: 50%; transform: translate(0, -50%);}
.loginForm li.loginForm_group label .labelText:before{content: '\e92f'; font-size: 1em; color: #7f5ed4;}
.loginForm li.loginForm_user label .labelText:before{content: '\e927'; font-size: 0.9em; color: #007e8a;}
.loginForm li.loginForm_password label .labelText:before{content: '\e92e'; font-size: 0.9em; color: #c94092;}

.loginForm_error{color: white; font-size: 16px; padding: 8px 0px 0px 20px; margin-left: 15px; position: relative;}
.loginForm_error:before{content: "\e930"; font-family: 'icomoon' !important; position: absolute; left: 0;}
.loginForm_submit{padding: 15px 0px 0px 0px;}
.loginForm_submit button{width: 100%; height: 70px; border: 0px; border-radius: 14px; background-color: #1b72e4; color: white; font-weight: bold; font-size: 24px;}

.loginSMSCode{padding-top: 70px; width: 100%;}
.loginBack{padding: 0px 0px 12px 15px;}
.loginBack a{display: inline-block; text-decoration: none; color: white; font-weight: 700; font-size: 18px; position: relative; padding-left: 16px;}
.loginBack a:before{content: '\e901'; font-family: 'icomoon' !important; font-size: 0.5em; position: absolute; left: 0; top: 7px; transform: rotate(90deg);}

.loginSMSFrame{border-radius: 14px; background-color: white; box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.6); padding: 28px 30px 20px;}
.loginSMSFrame *:focus{outline-color: black;}
.loginSMSFrame h2{text-align: center; font-size: 32px; line-height: 36px;}

.loginSMSForm{padding: 18px 0px 0px;}
.loginSMSForm label{display: block; position: relative;}
.loginSMSForm label .labelText{pointer-events: none; position: absolute; left: 20px; top: 15px; z-index: 1; font-size: 20px; font-weight: 300; transition: all 0.3s ease-in-out;}
.loginSMSForm label.activeInput span.labelText{top: 4px; font-size: 16px; font-weight: 400;}
.loginSMSForm label input{-webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 14px; width: 100%; height: 56px; border: 1px solid #abadb3; padding-top: 12px; text-indent: 20px; font-size: 20px; font-weight: 300;}

.loginSMSSubmit{padding: 15px 0px 0px 0px;}
.loginSMSSubmit button{width: 100%; height: 56px; border: 0px; border-radius: 14px; background-color: #1b72e4; color: white; font-weight: bold; font-size: 20px;}
.loginSMSForm .loginForm_error{color: #2b2d3a;}
.loginSMSAgain{padding-top: 12px; text-align: center; font-size: 20px;}
.loginSMSAgain a{text-decoration: underline;}

@media screen and (max-width: 1400px) {
 .loginContent_centered{padding: 40px 66px 0px;}
 .loginForm{padding: 24px 0px 0px 0px;}
 .loginSMSCode{padding-top: 36px;}
}

@media screen and (max-width: 1280px) {
 .loginContent_centered{padding: 40px 40px 0px;}
 .loginPage .tzurLogo{right: 40px; bottom: 15px;}
}

@media screen and (max-width: 1024px) {
 .loginBG img{object-position: center top;}

 .loginForm h1{font-size: 36px; line-height: 40px;}

 .loginForm li label .labelText{top: 14px; font-size: 20px; padding-left: 30px;}
 .loginForm li label.activeInput span.labelText{padding-left: 24px;}
 .loginForm li label input{height: 54px; text-indent: 43px; font-size: 20px; padding-top: 18px;}
 .loginForm_submit button{height: 54px; font-size: 20px;}
}

@media screen and (max-width: 767px) {
 .loginContent_centered{padding: 12px 18px 0px;}
 .loginHeader{text-align: left;}
 .loginHeader a img{display: block; max-width: 172px;}
 
 .loginBG img{opacity: 0.6;}
 
 .loginForm h1{text-align: left;}
 .loginPage .tzurLogo{left: 50%; bottom: 12px; transform: translate(-50%, 0);}
 .loginPage .tzurLogo a{color: white;}
 .loginForm{padding-top: 16px;}
 .loginForm ul{padding-top: 0px;}
}

@media screen and (max-width: 480px) {
 .loginFrame{width: 100%;}
 .loginForm h1{font-size: 30px; line-height: 36px;}
 .loginForm{padding-top: 8px;}
 .loginForm_error{font-size: 14px; padding: 8px 0px 0px 20px; margin-left: 8px;}
 
 .loginSMSCode{padding-top: 20px;}
 .loginSMSFrame{padding: 28px 20px 20px;}
 .loginSMSFrame h2{font-size: 28px; line-height: 30px;}
 
}

.eye {
    position: relative;
    right: -90%;
    top: -45px;
    cursor: pointer;
}