.grecaptcha-badge {opacity:0}


html *
{
   font-family: 'Proxima Nova',Helvetica,Arial !important;
}

.modal-header-ink
{
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1rem 1rem;

    border-top-left-radius: calc(.3rem - 1px);
    border-top-right-radius: calc(.3rem - 1px);
}

.main_modal
{
  margin-top: 6% !important;
}
#captcha_img
{
    display: block;
    margin: 0 auto;
    width: 80%;
}

#captcha , #label_captcha
{
    width: 80%;
    display: block;
    margin: 0 auto;
}

#modal_title
{
    display: block;
    margin:  auto;
    width: 50%;
    text-align: center;
}

.modal-content-ink
{
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 70%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: .3rem;
    outline: 0;
    margin: auto;
}

#stations-background
{
  position: absolute;
  background-color: gray;
  width: 100%;
  height: 120%;
  opacity: 0.9;
  z-index: 2;
}

#forget_password,#password
{
  font-family: 'Proxima Nova',Helvetica,Arial;
  font-size: 18px;
  color: #333;
  outline: 0;
}

.special_forget_password_input
{
  height: 41px;
}

#username,
#password
{
  margin-top: -8px;
  height: 45px;
  font-family: 'Proxima Nova',Helvetica,Arial;
  font-size: 18px;
  color: #333;
  outline: 0;
}

#error_message_username, #error_message_forget_email
{
  color: #d81319;
}

#block-background
{
  position: absolute;
  background-color: transparent;
  width: 100%;
  height: 100%;
  z-index: 2;
  display: none;
}

#background
{
  background-color: white;
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 1;
}

#logo-section
{
  height: 84px;
  padding-top: 7px;
  margin-bottom: 14px;
  margin-left: auto;
  margin-right: auto;
  line-height: 84px;
  text-align: center;
}

#main-container
{
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  min-width: 1020px;
  max-width: 1020px;
  min-height: 783px;
  max-height: 783px;
  margin: 0 auto;
  background-image: url('/view_template_custom/login_imgs/radixx/background.png');
}

#company_code
{
  font-size: 16px;
  font-weight:900;
  line-height: 1;
  padding-top: 2px
}

#company_code_help
{
  font-size: 16px; 
}

.txt_align_center
{
  text-align: center;
}

.div_float_left
{
  float:left;
}

.divs_margin_auto
{
  margin: auto;
}

#left-container
{
  margin-right:24px;
  width: 192px;
  height: 498px;
  padding-top: 15px;
  padding-bottom: 0;
  padding-left: 42px;
  position: relative;
  right: -4px;
  place-content: center space-between; 
  align-items: center; 
  float: left;
}


#captcha_section
{
  padding-top: 30%;
}


.middle_section_format
{
  flex-direction: row;
  box-sizing: border-box;
  display: flex;
  place-content: stretch space-between;
  align-items: stretch;
}


#div_clickable
{
  margin-bottom: 4px;
  display: none;
}

.divs_display_none
{
  display: none;
}

.divs_display_block
{
  display: block;
}

#bottom-left-container
{
  place-content: center flex-end;
  align-items: center; 
  margin-top: 6px;
  margin-left:20px;
}

#img_language_left
{
  display: block;
  margin-bottom: 5px;
  margin-left:1px;
  margin-right: 20px;
}

#company_code_session
{
  height:120px;
  margin-bottom: 20px;
}

#label_username
{
  height: 20px;
  font-weight:900;
  height: auto;
}

#label_password
{
  height: 16px;
  font-weight:900;
      height: auto;
}

#password_reminder_section
{
  margin-top: -43px;
}

#id_text_forget_paswword
{
  position: relative;
  bottom: -21px;
  line-height: 1.3 !important;
}

.div_auto_txt_left
{
  width: auto; text-align: left;
}

#copyright_ink
{
  margin-bottom: 7px;
}

.img_opacity
{
  opacity:0.2;
}

#login_load_page_spinner_ima
{
  display:none;
  width: 3.3rem;
  height: 3.3rem;
  margin-bottom:36px;
}

#info-section
{
  margin-right: 31px;
  line-height: 1.1;
}

.middle-info-section-row
{
  flex-direction: row;
  box-sizing: border-box;
  display: flex;
  place-content: center flex-start;
  align-items: center;
}

#id_img_server
{
  margin-right: 10px;
  margin-top: 1px;
}

#middle_containde_id
{
  margin-bottom: 7px;
}

#id_img_browser_version
{
  margin-right: 10px;
}

.credential_opacy
{
  height: 12px; opacity: 1; transform: translateY(0%);
}

#text_branding_copyright
{
  margin-bottom: 7px;
}

#login_load_page_spinner_ima_responsive
{
  display:none;
  width: 3.3rem;
  height: 3.3rem;
  margin-bottom:36px;
}

#play-store-img
{
  margin-bottom:  3px;
}

#stations-section
{
  width: 175px;
  height: 280px;
  margin-top: 90px;
  background-color: #E9E9E9;
  position: absolute;
  padding: 20px;
  z-index: 3;
}

#stations-section:after
{
  content: '';
  width: 0px;
  height: 0px;
  border-top: 7px solid transparent;
  border-left: 7px solid transparent;
  border-bottom: 7px solid #E9E9E9;
  border-right: 7px solid transparent;
  position: absolute;
  bottom: 100%;
  left: 47%;
}

#machines-section
{
  width: 175px;
  height: 280px;
  margin-top: 170px;
  background-color: #E9E9E9;
  position: absolute;
  padding: 20px;
  z-index: 3;
}

#machines-section:after
{
  content: '';
  width: 0px;
  height: 0px;
  border-top: 7px solid transparent;
  border-left: 7px solid transparent;
  border-bottom: 7px solid #E9E9E9;
  border-right: 7px solid transparent;
  position: absolute;
  bottom: 100%;
  left: 47%;
}


#right-container
{
  display: flex;
  flex-direction: column;
  width: auto;
  height: auto;
}

#right-container-top
{
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  width: 181px;
  height: 498px;
}

#right-container-info
{
  height: 46%;
  border-left: 1px solid black;
  margin-left: 6px;
  padding-left: 6px;
}

#right-container-bottom
{
  margin-top: 10px;
  margin-left: 6px;
  padding-left: 7px;
  width: 181px;
  height: 74px;
}


#middle-container
{
  display: flex;
  flex-direction: column;
  width: auto;
  height: auto;
  position: relative;
}

#middle-container-top
{
  padding-top: 25px;
  padding-bottom: 20px;
  padding-left: 150px;
  padding-right: 150px;
  max-width: 632px;
  min-width: 632px;
  height: 498px;
  background-color: rgba(233, 233, 233, 0.8);
}

#middle-container-bottom
{
  margin-top: 15px;
  padding-right: 30px;
  width: 632px;
  height: 74px;
}


#password-section 
{
  position: relative;
}

#btnLogin, #btn_captcha, #get_sso_azure_auth
{
  cursor: pointer;
}

#forgot_password
{
  text-decoration: underline;
  bottom: 8px;
  right: 0;
  cursor: pointer;
  margin-top: -12px;
}

#email_address
{
  font-weight:900;
  height: 16px;
  margin-top: 2px;
}

/*CODE-TYPING*/
.pin_code
{
  align-content: center;
  align-items: center;
  margin-top: 25px;
}

.pin_code input
{
/*width: 35px;
  height: 49px;
  border: 1px solid black;
  background: transparent;*/
  width: 35px;
  height: 27px;
  background: transparent;
  border: none;
  border-bottom: 1px solid #000000;
  -webkit-box-shadow: none;
  box-shadow: none;
  border-radius: 0;
  border-color: #8c8888;
  text-align: center;
  font-size: 18px;
  padding-left : .7075em;
  padding-right: .7075em;
  text-transform: uppercase;
  color: #333;
  line-height: 1.125;
    /*-webkit-text-security: disc;*/
}

#label_text
{
  max-width: 810px !important; 
  min-width: 810px; 
  position :absolute;
  top: 60px;
  color : darkred;
}

.inputs
{
  font-size: 20px;
  text-align: center;
}
/*CODE-TYPING*/


#buttons-section
{
  margin-bottom: -20px;
  margin-top:60px;
  height: 91px;
  justify-content: space-between;
}

a{
  color: black;
}

#text_language_left
{
  margin-top: 5px;
  font-family: 'Proxima Nova',Helvetica,Arial;
  font-size: 11.5px;
}

.copyright_section_class
{
  place-content: flex-start;
  align-items: flex-start;
}

#copyright-section .clickable span
{
  text-decoration-line: underline;
}

#id_link_ink
{
  text-decoration-line: underline;
  color: #333333;
}

.clickable{
  cursor: pointer;
}

.recaptcha {
  text-align: center;
}

.recaptcha img
{
  display: block;
  margin: auto;
}

#captcha_img
{
  margin-top: 13px;
}

mat-select
{
  border: thin solid black;
  line-height: 30px;
  box-sizing: border-box;
  padding-left: 5px;
  margin: 0;
}

::ng-deep .no-line .mat-form-field-underline
{
  display: none;
  width: 120px;
}

::ng-deep .mat-select-arrow::after 
{
  padding-top: 2px;
  padding-bottom: 2px;
  padding-left: 9px;
  border-left: thin solid black;
  content: '⌵';
  color: black;
  visibility: visible;
}

::ng-deep .mat-select-arrow 
{
  border: 0;
  margin: 0;
  display: inline;
  color: transparent;
  visibility: hidden;
}


#language-section
{
  width: 632px;
  height: 498px;
  background-color: #E9E9E9;
  position: absolute;
  padding-top: 20px;
  padding-left: 40px;
  padding-bottom: 20px;
  padding-right: 40px;
  z-index: 3;
}

.languages-alignment
{
  display: flex;
  flex-flow: row wrap;
  align-content: center;
  justify-content: space-evenly;
  align-items: flex-start;
  height: 380px;
}

.language
{
  margin: 30px 30px;
}

.container
{
  width: 100%;
  margin-bottom: 16px;
}

.container .mat-input-element
{
  font-size: 18px;
  color: #333333;
}

label 
{
  color: black;
  display: block;
  margin-top: -3px;
}


/*RESPONSIVE*/
.lt-sm-display #main-container
{
  min-width: 100%;
  max-width: 100%;
  max-height: 900px;
}

.lt-sm-display #bottom-container
{
  background-image: url(../../assets/responsive-background.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top;
  width: 100%;
  height: calc(900px);
  padding-left: 30px;
  padding-right: 30px;
}


.lt-sm-display #middle-container-top
{
  background-color: rgba(233, 233, 233, 0.8);
  min-width: 100%;
  max-width: 100%;
  margin-top: 70px;
  padding-top: 80px;
  padding-left: 20px;
  padding-right: 20px;
  height: 458px;
}

#language-responsive-section
{
  width: 100%;
  height: 458px;
  background-color: #E9E9E9;
  padding-top: 40px;
  padding-left: 10px;
  padding-bottom: 10px;
  padding-right: 10px;
  margin-top: 70px;
  position: absolute;
  z-index: 3;
}

.languages-responsive-alignment
{
  display: flex;
  flex-flow: row wrap;
  align-content: center;
  justify-content: space-evenly;
  align-items: flex-start;
  height: 300px;
}

.language-resp
{
  margin: 10px 10px;
}

#languages-responsive-background
{
  position: absolute;
  background-color: gray;
  width: 100%;
  height: 900px;
  opacity: 0.9;
  z-index: 2;
}

#responsive-section
{
  margin-top: 60px;
}

#information-section
{
  display: none;
}

#information-section-responsive
{
  background-color: #E9E9E9;
  width: 100%;
  height: auto;
  padding-top: 10px;
  padding-left: 10px;
  padding-bottom: 10px;
  padding-right: 10px;
  margin-top: 98px;
  position: absolute;
  z-index: 3;
}

.clickable span
{
  text-decoration-line: underline;
}

.lt-sm-display #responsive-section
{
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}

#copyright-section-responsive
{
  line-height: 17px;
  height: auto;
}


#buttons-responsive
{
  display: none;
}

.ink-font-lg
{
  font-size: 36.5px;
  letter-spacing: -.5px;
  line-height: 1.2;
}

#right_container_text, #right_mobile_text
{
  text-align: left;
  line-height: 1.6;
}

#right_container_text_top
{
  text-align: left;
  line-height: 1.3;
  margin-bottom: 3.5px;
}

#right_container_bottom_text, #right_biometric_text, #right_departure_text, #right_load_text, #right_turn_text, #right_multi_text
{
  text-align: left;
  margin-bottom:5px;
  line-height: 1.2;
}

#right-container
{
  padding: 0;
}

.lt-sm-display #buttons-responsive
{
  display: flex;
  justify-content: space-between;
  margin-top: 20px;
  margin-bottom: 20px;
}

.lt-sm-display #error-message
{
  position: absolute;
  bottom: 207px;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
}

.lt-sm-display #google-sign-button
{
  display: flex;
  align-items: center;
  height: 220px;
}

.ink-font-sm
{
  font-family: 'Proxima Nova',Helvetica,Arial;
  font-size: 16px;
}

.ink-font-xs
{
  font-family: 'Proxima Nova',Helvetica,Arial;
  font-size: 11.5px;
  line-height: 13px;
}

.ink-font-xs_terms_and_conditions
{
  font-family: 'Proxima Nova',Helvetica,Arial;
  font-size: 11.5px;
  line-height: 13px;
  margin-block-start: 1em;
  margin-block-end: 1em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
}

#ink-font-xs_terms_and_conditions_font_weight
{
  font-weight: 750;
}

.ink-font-ssm
{
  font-family: 'Proxima Nova',Helvetica,Arial;
  font-size: 11.5px;
  font-weight : 750;
  text-align: center;
  display: inline-block;
}


input[type="text"],input[type="password"],
select.form-control {
  background: transparent;
  border: none;
  border-bottom: 1px solid #000000;
  -webkit-box-shadow: none;
  box-shadow: none;
  border-radius: 0;
  padding:1px;
  height: 30px;
}

input[type="text"]:focus,input[type="password"]:focus,
form-control:focus {
  background: transparent;
  border: none;
  border-bottom: 2px solid #000000;  
  -webkit-box-shadow: none;
  box-shadow: none;
  border-radius: 0; 
  outline: none;
}

 #id_company_code{
  width: 135px;
  background: transparent;
  border: none;
  border-bottom: 1px solid #000000;
  -webkit-box-shadow: none;
  box-shadow: none;
  border-radius: 0;
  border-color: #8c8888;
  text-align: center;
  font-size: 16px;
  padding-top: .7075em;
  padding-left : .7075em;;
  padding-right: .7075em;
  padding-bottom: .4075em;
  text-transform: uppercase;
  color: #333;
  line-height: 1.125;
}
::-webkit-input-placeholder { /* WebKit browsers */
    text-transform: none;
}
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    text-transform: none;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    text-transform: none;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    text-transform: none;
}
::placeholder { /* Recent browsers */
    text-transform: none;
}

#id_company_code:focus {
  
  background: transparent;
  border: none;
  border-bottom: 2px solid #000000;  
  -webkit-box-shadow: none;
  box-shadow: none;
  border-radius: 0;
  outline: none;   
}

#privacy-section
{
  width: 592px;
}

::-webkit-input-placeholder {
   text-align: center;
}   
.ink-font-ssm-non-bold
{
  font-family: 'Proxima Nova',Helvetica,Arial;
  font-size: 11.5px;
  text-align: center;
  display: inline-block;
}

.center
{
  margin-left: auto;
  margin-right: auto;
}

.right_container_info_section
{
  flex-direction: column; 
  box-sizing: border-box; 
  display: flex;
}

.align_div_elements
{
  flex-direction: column;
  box-sizing: border-box; 
  display: flex;
  /*place-content: stretch space-between;*/
  align-content: stretch;
  justify-content: space-between;
  align-items: stretch;
}

.flex_direction_columns
{
  flex-direction: column;
  box-sizing: border-box;
  display: flex;
}

#error-message
{
  position: absolute;
  bottom: 207px;
  color: red;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
  top:61.5%;
  width: 400px;
  height: 40px;
}
#no-ff-wrn-txt
{
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 5px;
  padding-right: 5px;
  background-color: darkred;
  color: white;
  text-align: center;
}

@media (max-width: 576px) {
   #bottom-container {
    margin:  0 !important; 
    flex-direction: column;
    box-sizing: border-box;
    display: flex;    
    background-image: url(/view_template_custom/login_imgs/responsive-background.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top;
    width: 100%;
    height: calc(900px + 50%) !important;
    padding-left: 30px;
    padding-right: 30px;    
  }

  #label_text
  {
    display: none;
  }
}

#active-auth-btn
{
  display: none;
}

@media (max-width: 576px) {
   #main-container {
    background-image:none !important;
    
    min-width: 100% !important;
    max-width: 100% !important;
    max-height: 458px !important;
    padding: 0;
  }
}

@media (max-width: 576px) {
  #middle-container-top {
  background-color: rgba(233, 233, 233, 0.8) !important;
  min-width: 100% !important;
  max-width: 100% !important;
  margin-top: 70px !important;
  padding-top: 20px ;
  padding-left: 20px !important;
  padding-right: 20px !important;
  height: 458px ;
  }
@media (min-width: 576px) {
  #responsive-section {
  display: none !important;
  }

  #error-message {
    
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    width: 300px;
    line-height: 1.3;
  }

  #buttons-responsive
  {
  display: flex;
  justify-content: space-between;
  margin-top: 20px;
  margin-bottom: 20px;
  }

  #buttons-section 
  {
    display: none !important;
  }

  #password_reminder_section 
  {
      margin-top: 0px !important;
      
  }

  #company_code_session 
  {
    margin-bottom:  0px !important;
    
  }

 
}
}

/* styles for the user 4_digits_pin input */
html .pincode-input-text-masked
{
  font-family: pincode-input-mask !important;
}

#user_4_digit_pin_container
{
  display: none;
  height: 81px;
}

#user_4_digit_pin_container .pincode-input-container input.mid,
#user_4_digit_pin_container .pincode-input-container input.last
{
  border-left-width: 1px;
}

#user_4_digit_pin_container .pincode-input-container
{
  width: 240px;
}

#user_4_digit_pin_container .pincode-input-text
{
  font-size: 18px;
}

input[type="text"].pincode-input-text,
.pincode-input-container input[type="text"].input.mid
{
  border-top: 1px solid;
  border-left: 1px solid;
  border-right: 1px solid;
  height: 45px;
}

.pincode-input-text.first,
.pincode-input-text.mid
{
  margin-right: 20px;
}

.text-center
{
  text-align: center;
}

.link
{
  text-decoration-line: underline;
  cursor: pointer;
}

.password-container
{
  position: relative;
}

.toggle-password
{
  cursor:pointer;
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
}