/*
ver:0106
ver:0107
ver:0111
ver:0122
ver:0125
ver:0134
*/


#Login22 { margin: 200px auto 0px auto; width: 340px; box-sizing: border-box;  }
#Login22.Login22h1 { margin-top: 20px;  }
#Login22.Login22h2 { margin-top: 80px;  }

body.modelite #Login22 { margin-top: 55px; width: auto; max-width: 300px; }

#Login22 .logo { text-align: center; padding-bottom: 10px; }
#Login22 .logo img { max-width: 100%; }
#Login22 .image-sent { display: block; height: 50px; margin-bottom: 10px; background: url(image-sent2.png) center center no-repeat; }
#Login22 .image-progress { display: block; height: 60px; margin-bottom: 10px; background: url(image-progress.png) center center no-repeat; }
#Login22 .caption { text-align: center; font: normal normal normal 24px/29px Carmelit,Lato; color: #222325; padding-bottom: 30px; }
#Login22 .caption2 { text-align: center; font: normal normal normal 46px/55px Carmelit,Lato; color: #222325; padding-bottom: 0px; }
#Login22 .subcaption2 { text-align: center; font: normal normal normal 20px Carmelit,Lato; color: #222325; padding-bottom: 20px; }
#Login22 .caption3 { text-align: center; font: normal normal normal 28px/34px Carmelit,Lato; color: #222325; padding-bottom: 10px; }
#Login22 .text { text-align: center; font: normal normal normal 15px/19px Assistant; color: #707070; padding-bottom: 30px; }
#Login22 .text2 { text-align: center; font: normal normal normal 15px/19px Assistant; color: #222325; padding-bottom: 30px; }
#Login22 .input { position: relative; margin-bottom: 32px; }
#Login22 .input input[type=text] { padding: 0px 15px 0px 15px; box-sizing: border-box; width: 100%; height: 48px; border-radius: 3px; font: normal normal normal 15px/19px Assistant; color: #222325; }
#Login22 .input input[type=number] { appearance: none; -moz-appearance: textfield; padding: 0px 15px 0px 15px; box-sizing: border-box; width: 100%; height: 48px; border-radius: 3px; font: normal normal normal 15px/19px Assistant; color: #222325; }
#Login22 .input input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
#Login22 .input input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
#Login22 .input input[type=number] {  }
#Login22 .input input[type=password] { padding: 0px 15px 0px 15px; box-sizing: border-box; width: 100%; height: 48px; border-radius: 3px; font: normal normal normal 15px/19px Assistant; color: #222325; }
body.rtl #Login22 .input input[data-type=password] { padding-left: 48px; }
body.ltr #Login22 .input input[data-type=password] { padding-right: 48px; }
#Login22 .input select { color: #707070; padding: 0px 15px 0px 15px; box-sizing: border-box; width: 100%; height: 48px; border-radius: 3px; font: normal normal normal 15px/19px Assistant;  }
#Login22 .input[data-value=true] select { color: #222325;  }
#Login22 .input[data-state=focus] select { color: #222325;  }
#Login22 .input textarea { padding: 5px 15px 5px 15px; box-sizing: border-box; width: 100%; height: 82px; border-radius: 3px; font: normal normal normal 15px/19px Assistant; color: #222325; }
#Login22 .input-otp input[type=number] { height: 74px; text-align: center; direction: ltr;  }
#Login22 .input-otp[data-value="true"] input[type=number] { font: normal normal normal 40px/52px Assistant; color: #222325; }
#Login22 .input .states { border: 2px solid #CBDDEB; }
#Login22 .input .label { display: none; z-index:2; /*background: white;*/ position: absolute; top: -9px; margin: 0px 10px 0px 10px; padding: 0px 10px 0px 10px; height: 20px; line-height: 20px; box-sizing: border-box; font: normal normal normal 12px/15px Assistant; color: #707070;  }
#Login22 .input[data-value=true] .label { display: inline-block; }

#Login22 .input .borderfix { display: none; }
#Login22 .input[data-value=true] .borderfix { z-index:1; display: block; content: " "; font-size: 0px; width: 100%; height: 2px; background: white; margin: 0px 10px 0px 10px; position: absolute; top: 0px; }

#Login22 .input .cbtext { font: normal normal normal 15px/19px Assistant; color: #222325; position: relative; top: -3px; }
#Login22 .input .note { font: normal normal normal 15px/19px Assistant; color: #707070; padding-top: 5px; }
#Login22 .input .error { font: normal normal normal 13px/17px Assistant; color: #DC2F3F; padding: 3px 17px 0px 17px; }
#Login22 .input[data-state=error] .label { color: #DC2F3F; }
#Login22 .input[data-state=error] .states { border: 2px solid #DC2F3F ; }
#Login22 .input[data-state=focus] .label { color: #4C78EC; }
#Login22 .input[data-state=focus] .states { border: 2px solid #4C78EC  ; }
#Login22 .input[data-state=hover] .label { color: #4C78EC; }
#Login22 .input[data-state=hover] .states { border: 2px solid #4C78EC80  ; }
#Login22 .row-button  { text-align: center; padding-bottom: 10px; }
#Login22 .row-button .input-button { box-sizing: border-box; width: 100%; padding: 0px 10px 0px 10px; cursor: pointer; min-width: 140px; text-decoration: none; height: 40px; box-sizing: border-box; display: block; background: #F09403; border-radius: 5px; border: none; font: normal normal normal 18px/23px Assistant; color: #222325; line-height: 40px; }
#Login22 .row-button .input-button-long { min-width: 100%; }
#Login22 .row-button .input-button:hover { background: #FFB300; }
#Login22 .row-button .input-button:active { background: #E4751B; }
#Login22 .row-links { display: flex; justify-content: center; align-items: center; gap: 10px; text-align: center; padding-bottom: 5px;  }
#Login22 .row-links .sep { background: #707070; width:1px; height: 10px; display: block;  }
#Login22 .row-links .link {S cursor: pointer; font-size: 14px; font-family: Assistant; color: #707070; text-decoration: none; }
#Login22 .row-links .link:hover { color: #4C78EC; }
#Login22 .row-links .link::after { content: "\a"; white-space: pre; }
#Login22 .AzureLogin { }
#Login22 .AzureLogin .divider { margin-top: 30px; margin-bottom: 10px; gap: 15px; display: flex; align-items: center; text-align: center; color: #3D424A; font-size: 13px; font-family: Assistant; }
#Login22 .AzureLogin .divider::before { content: ""; flex: 1; height: 1px; background: #BEC3CD; }
#Login22 .AzureLogin .divider::after { 	content: ""; flex: 1; height: 1px; background: #BEC3CD; }
#Login22 .AzureLogin .button { direction: ltr; height: 46px; line-height: 46px; display: inline-flex; justify-content: center; align-items: center; gap: 10px; background: white; border: 1px solid #B5C1E3; border-radius: 6px; width: 100%; text-decoration: none; box-sizing: border-box; }
#Login22 .AzureLogin .button:hover { background: #D4E0FF; border-color: transparent; }
#Login22 .AzureLogin .button:active { background: #BACCFB; border-color: transparent; }
#Login22 .AzureLogin .button .btnico { width: 16px; height: 16px; background: url(AzureLogin.svg) center center no-repeat; }
#Login22 .AzureLogin .button .btntxt { font-family: Assistant; font-size: 16px; font-weight: 400; color: #3D424A; }
#Login22 .AzureLogin .remarks { padding-top: 7px; text-align: center; font-family: Assistant; font-size: 12px; font-weight: 400; color: #707070; }

#Login22 .password-eye { position: absolute; top: 0px; display: block; width: 48px; height: 48px; background: url(eye.visible.normal.png) center center no-repeat; cursor: pointer; }
#Login22 .password-eye:hover { background: url(eye.visible.hover.png) center center no-repeat; }
body.rtl #Login22 .password-eye { left: 0px; }
body.ltr #Login22 .password-eye { right: 0px; }
#Login22 [data-password="visible"] .password-eye { background: url(eye.hidden.normal.png) center center no-repeat; }
#Login22 [data-password="visible"] .password-eye:hover { background: url(eye.hidden.hover.png) center center no-repeat; }
#Login22 .input-checkbox  { cursor: default; color: #414141; font-family: carmelit,Lato; font-size: 13px; display: block; text-align: center; padding-top: 5px; padding-bottom: 20px; } 
#Login22 .input-checkbox.checked  > .box span { display: block; }
#Login22 .input-checkbox:hover > .box { border: 1px solid #426fe4; }
#Login22 .input-checkbox  > .box { top: 2px; position: relative; vertical-align: top; display: inline-block; width: 12px; height: 12px; border: 1px solid #a7b4c7; border-radius: 2px; background: #ffffff;  } 
#Login22 .input-checkbox  > .box span { display: none; position: absolute; left: 1px; top: 1px; width: 9px; height: 10px; background: url(ok.png); }
#Login22 .input-checkbox  > .boxtext { color: #656C6C; font: normal normal normal 13px/17px Assistant; vertical-align: top; display: inline-block; text-indent: 5px;  } 
#Login22 .ContainerCAPTCHA  > div { margin: 0px auto;  } 

#Login22 .copy-to-clipboard { position: absolute; top: 0px; display: block; width: 48px; height: 48px; background: url(images/clipboard-active.png) center center no-repeat; cursor: pointer; }
#Login22 .copy-to-clipboard:hover { background: url(images/clipboard-hover.png) center center no-repeat; }
body.rtl #Login22 .copy-to-clipboard { left: 0px; }
body.ltr #Login22 .copy-to-clipboard { right: 0px; }

#Login22 .remark { padding: 0px 0px 20px 0px; text-align: center; }
#Login22 .remark .icon { display: inline-block; vertical-align: top; width: 38px; height: 38px; background: url(bulb.png) center center no-repeat; }
#Login22 .remark .text1 { padding-top: 2px; max-width: 280px; display: inline-block; vertical-align: top; text-align: initial; font-size: 13px; color: #707070; }
#Login22 .remark .text1 a { font-size: 14px; color: #1D1D1E; text-decoration: none; font-size: 13px;  }
#Login22 .remark .text1 a:hover { color: #1b47bc; }

#Login22 .validate   { display: none; padding: 10px 15px 0px 15px; }
#Login22 .input[data-state=focus][data-validate]   { margin-bottom: 12px; }
#Login22 .input[data-state=error][data-validate]   { margin-bottom: 12px; }
#Login22 .input[data-state=focus] .validate   { display: block; }
#Login22 .input[data-state=error] .validate   { display: block; }
#Login22 .validate .item  { font: normal normal normal 13px/17px Assistant; color: #707070; line-height: 24px;  }
#Login22 .validate .item.true { color: #0B740E; }
#Login22 .validate .item.false { color: #DC2F3F; }
#Login22 .validate .item .ico { text-align: center; width: 15px; display: inline-block; vertical-align: middle; position: relative; top: -1px; }
#Login22 .validate .item .ico-true { font-size: 0px; background: url(icon-true.png) center center no-repeat; width: 15px; display: inline-block; vertical-align: middle; position: relative; top: 0px; }
#Login22 .validate .item .ico-false { font-size: 0px; background: url(icon-false.png) center center no-repeat; width: 15px; display: inline-block; vertical-align: middle; position: relative; top: 0px; }
#Login22 .validate .item .txt { text-indent: 3px; font-size: 14px; display: inline-block; vertical-align: middle; }

#Login22 .complete-succeed { margin: 0px auto 20px auto; display: block; width: 104px; height: 104px; background: url(succeed.png) center center no-repeat; }	
#Login22 .complete-caption { font: normal normal normal 24px/29px Carmelit,Lato; color: #222325; text-align: center; }	
#Login22 .complete-text { font: normal normal normal 13px/17px Assistant; color: #707070; text-align: center; }