body{margin: 0px; padding: 0px; font-family: Roboto,sans-serif; font-style: normal; font-weight: normal;} 
.mt-100{margin-top: 100% !important;}
.m-0 {margin:0 !important;}
.font-66Perc {font-size:66%}
.font-66Perc-1 { font-size: 0.7888em;line-height: 1.67em; margin: 0px;}
.text-right{ text-align: right;}
.display-none { display: none;}
.align-left {text-align:left !important}
.error-message { color: red; font-size: 13px;}

.left-box { width:27%; height: auto; float: left; margin: 0px; padding: 0px;background: #032349 url('../images/Identity_bg.png'); background-size: contain;}
.leftbox-container{ width: 100%; height: 100vh; float: left; margin: 0px; padding: 20px 20px; position: relative;}
.left-logo-box {width: 70%; height: auto; float: left; margin: 20px 0px 0px 0px;padding: 0px;}
.left-logo-box img { max-height: 100%; max-width: 100%;}
.left-text-box {width:100%; height: auto; float: left; padding: 0px; color: #FFFFFF;}

.left-text-heading { font-weight: 500;  font-size: 1.9em;  line-height: 38px;}
.left-text-description { font-size: 1.1em; line-height: 21px;}

.left-footer {  width:90%; height: auto; float: left; margin: 0px;  padding: 0px; position: absolute; bottom: 20px;}
.left-icons { width: 100%; height: auto; float: left; margin: 0px 0px 20px 0px;}
.left-icon2 { margin: 0px 5px;}

.left-footer-bottom-box { width: 100%; height: auto; float: left; margin: 0px; padding: 0px; color: #fff; }
.left-footer-links {font-size: 14px; line-height: 1.5em; width:auto; float: left;}
.left-footer-links ul{margin: 0px;  padding: 0px; width: auto; float: left;}
.left-footer-links ul li{ float: left; list-style: none; margin: 0px; padding: 0px 10px 0px 0px;}
.left-footer-links ul li a { border-right: 1px solid rgba(255, 255, 255, 0.8);  padding: 0px 6px 0px 6px; color: rgba(255, 255, 255, 0.8);}
.left-footer-links a:first-child { border-right: 1px solid rgba(255, 255, 255, 0.8); padding-left: 0px; }
.left-footer-links a:last-child {  border-right: 0px;  padding-right: 0px;}
.left-footer-copyright {font-size: 14px; line-height: 20px; width:auto; float: right;}

.right-box { width:73%; height: auto; float: left; margin: 0px; padding: 0px;}
.right-sign-in-box { width:30%; height: auto; margin:0 auto 0 auto; position:absolute; left: 30%; top: 10%;}
.right-sign-in-heading {  font-size: 1.9em; line-height: 36px;}
.right-sign-in-subheading { font-size:1em; line-height: 1.5em; color: rgba(0, 0, 0, 0.6); margin-top: -10px;}
.right-sign-in-verify { font-size: 0.85em; line-height: 17px; text-align: right;  margin-right: 0px; left: 54%;}
.right-sign-in-forgot-pwd {  font-size: 0.85em; line-height: 17px;}
.right-sign-in-or { font-size: 0.75em;  line-height: 1.5em;  text-align: center;  margin: 10px 0px;  position: relative;}
.right-sign-in-or span::before { content: ''; border-bottom: 1px solid rgba(0, 0, 0, 0.3); width: 40%; display: block; position: absolute;  margin-top: 6px; left: 0px;}
.right-sign-in-or span::after { content: ''; border-bottom: 1px solid rgba(0, 0, 0, 0.3); width: 40%;  display: block; position: absolute;  margin-top: -6px; right: 0px;}
.right-sign-in-btn-div { width: 100%; margin-top:10px; background: #032349; border-radius: 3px;}
.right-sign-in-btn-div button {width: 100%;height: 50px;background: #032349;border-color: #032349;border-radius: 3px;color: #fff; border:0}
.right-sign-in-btn-div1 button {width: 100%; height: auto; border-radius: 3px;border:0; padding: 18px 15px; line-height: 1.5;}
.right-sign-in-btn-div1 button [type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled), button:not(:disabled){ cursor: pointer; background: #032349;  border-color: #032349; color: #fff;}
.right-sign-in-btn-div1 button:focus { outline: none; }

.theme-back-btn{width: auto; border-radius: 3px; border: 1px solid #ced4da; padding: 6px 18px !important; box-shadow: none; margin-bottom: 20px; background: #ffffff; font-size: 12px !important; text-transform: uppercase; font-weight: 500;  color: #212529;}

.theme-confirmbtn { width: 100%; float: left; overflow: visible;}
.theme-confirmbtn a { width: 100%;height: auto;border-radius: 3px; border: 0;padding: 15px 15px; line-height: 1.5; background: #032349; border-color: #032349; color: #fff; text-align: center; text-decoration: none;}




.right-no-account-div {font-size: 0.85em;line-height: 17px; color: rgba(0, 0, 0, 0.8);}

.hideondesk{ display: none;}
.dropdown { position: static; display: inline-block; cursor: pointer; width: 50%; }

.dropdown-content { display: none; position: absolute; background-color: white; min-width: 160px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 1;text-align:left; }
.dropdown-content a { color: black; padding: 5px 5px; text-decoration: none;  display: block; }
.dropdown-content a:hover { background-color: #ddd; }
.dropdown:hover .dropdown-content { display: block; position: absolute; }
.dropdown:hover .dropbtn { background-color: #3e8e41; }
.right-box-scroll { overflow: unset; overflow-y: scroll; }

@media screen and (min-width:300px) and (max-width:480px) {
    .right-sign-in-box {width:100%; position:initial; left: 0; margin: 0 auto;}
}
@media screen and (min-width:481px) and (max-width:767px) {
  .right-sign-in-box {width:80%; position:initial; left: 0; margin: 0 auto;}
}

@media screen and (min-width:300px) and (max-width:767px) {
    .hideinmobile{ display: none;}
    .hideondesk{ display: block;}
    .mt-100{margin-top:10% !important;}
    .left-box{ width: 100%;}
    .right-box { width: 100%;left: 0;}
    .leftbox-container{ width: 100%; height: auto; float: left; margin: 0px; padding: 20px 20px; position: relative;}
    .left-footer { width: 100%; padding: 20px 20px;  position: initial; bottom: 0; background: #1a547c;}

  }

  @media screen and (min-width:768px) and (max-width:1024px) {
    .left-box {  width:38%; height: 100vh;}
    .leftbox-container {height: 100%; float: left; overflow: auto;}
    .mt-100 { margin-top: 49% !important;}
    .right-box { width:62% }
    .right-sign-in-box {width:80%; height: auto; margin: 10% auto; position: initial;}   
  }
  
  @media screen and (min-width:1025px) and (max-width:1280px) {
    .right-sign-in-box {width:60%; height: auto; margin:10% auto; position: initial;}   
  }

  @media screen and (min-width:1281px) and (max-width:1440px) {
    .right-sign-in-box {width:43%; height: auto; margin:10% auto; position: initial;}   
  }

  @media screen and (min-width:1281px) and (max-width:1440px) {
    .right-sign-in-box {width:43%; height: auto; margin:10% auto; position: initial;}   
  }
 @media screen and (min-width:1441px) and (max-width:1680px) {
    .right-sign-in-box {width:33%; height: auto; margin:10% auto; position: initial;}   
  }
  @media screen and (min-width:1025px) and (max-width:1366px) {
    .left-box {  width:38%; height: 100vh;}
    .leftbox-container { height: 100vh; float: left; overflow: auto;}
    .mt-100 { margin-top:39% !important;}
    .right-box { width:62% }
  }


  @media screen and (min-width:1367px) and (max-width:1680px) {
    .mt-100 { margin-top:70% !important;}

  }

.primary-bg-color {
    background-color: #032349 !important;
}

.primary-btn-color {
    background: #032349 !important;
    border-color: #032349 !important;
}

.primary-hyper-text-color {
    color: #032349 !important;
}

.left-verify-phone-number {
    font-size: 0.85em;
    line-height: 17px;
    text-align: right;
    padding-right: 0px !important;
}

.reset-pwd-login-hyper-link {
    color: white;
    padding: 17px;
    line-height: 1.15;
   
}
.reset-pwd-login-hyper-link:hover {
    outline: 0 !important;
    box-shadow: none !important;
    color: white !important;
    text-decoration: none !important;
}
.cursor-pointer {
    cursor: pointer
}

.display-none-imp { 
  display: none !important;
}
.progress-materializecss {
  margin: 5px 0;
  position: relative;
  height: 4px;
  display: block;
  width: 100%;
  background-color: #e2ecfe;
  border-radius: 2px;
  margin: 0.5rem 0 1rem 0;
  overflow: hidden;
}
.progress-materializecss .indeterminate {
  background-color: #387ef5;
}
.progress-materializecss .indeterminate:before {
  content: '';
  position: absolute;
  background-color: inherit;
  top: 0;
  left: 0;
  bottom: 0;
  will-change: left, right;
  animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
}
.progress-materializecss .indeterminate:after {
  content: '';
  position: absolute;
  background-color: inherit;
  top: 0;
  left: 0;
  bottom: 0;
  will-change: left, right;
  animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
  animation-delay: 1.15s;
}
@keyframes indeterminate {
  0% {
    left: -35%;
    right: 100%;
 }
  60% {
    left: 100%;
    right: -90%;
 }
  100% {
    left: 100%;
    right: -90%;
 }
}
@keyframes indeterminate-short {
  0% {
    left: -200%;
    right: 100%;
 }
  60% {
    left: 107%;
    right: -8%;
 }
  100% {
    left: 107%;
    right: -8%;
 }
}