body{font-family: 'Red Hat Display', sans-serif, Trebuchet MS, Arial, Helvetica ;margin:0;font-size: 14px;line-height: 1.8;font-style: normal;}
.container-div{clear:both;overflow:auto; background-color:white;height: 100vh;}
.wrapper1{padding: 14px 0px 14px 0px;width: 98.9%; margin: 0px auto;background-color: #0d1a6b;z-index: 99999;}
.wrapper1 img{margin-left: 103px;}
.wrapper2{color: #0d1a6b;text-align: right;border: 0px solid;height: 40px;padding: 0px 18px 0px;margin: 14px 0px 0px 0px;}
.wrapper2 h5{margin: 0px; font-size: 20px;font-family: Calibri Light, Trebuchet MS, Arial, Helvetica, sans-serif;font-weight: 600;}
.wrapper3{width: 77%; margin: 98px auto 0px;}
.login_outer{float: left;width: 100%;display: flex;}
.login_lft{float: left; width: 30%;margin: 4px 15px;}
.login_lft img{max-height: calc(100vh - 29px);float: left;width: 98%;}
.login_rgt{float:right;margin: 4px 15px;width: 70%;}
.login-cntr{float:right;margin: 4px 15px;width: 100%;}
.introtext{text-align: justify;margin: 0px 0px 10px 0px;}
.FAQdoc{margin-top: 25px;float: left;color: #3d3333;font-size: 16px;font-weight: 600;}
.FAQdoc a:active{color: red;}
.FAQdoc a:focus{color: #551A8B;}
.loginBoldTextHead{color: #0d1a6b;padding-left: 0px;}
.login_form_container{width: 100%;float: left;}
.login_form_text p{margin: 0px 0px 7px;color: red;line-height: 1.5;text-align: justify;}
.login_form{float: left;width: 50%;background: #fff;border-radius: 5px;padding: 2px;box-sizing: border-box;}
.login_form h1{float: left;width: 100%;text-align: center;font-size: 24px;color: #4B56B5;margin: 0;font-weight: normal;padding-bottom: 20px;}
.login_form h2{float: left;width: 100%;text-align: center;font-size: 18px;color: #B8B8B8;text-transform: uppercase;margin: 30px 0 15px 0;font-weight: normal;}
.login_form ul{float: left;width: 100%;padding: 0;list-style: none;margin:0;}
.login_form ul li{float: left;width: 100%;margin-bottom: 5px;position: relative;}
.login_form ul li:last-child{margin: 0px 0px 5px 0px;}
.login_form input[type=text],.login_form input[type=password], .login_form input[type=email]{float: left;width: 100%;border-radius: 3px;border:1px solid #C5C5C5;height: 50px;box-sizing: border-box;padding: 12px 15px 12px 45px;font-size: 14px;color: #444;outline: none;}
.login_form ul li i{position: absolute;left: 15px;top: 15px;width: 20px;height: 20px;}
.login_form input[type=text]:focus,.login_form input[type=password]:focus, .login_form input[type=email]:focus{border:1px solid #4B56B5;}
/* Chrome, Firefox, Opera, Safari 10.1+ */
.login_form input::placeholder { 
    color: #B8B8B8;
    opacity: 1; /* Firefox */
  }
/* Internet Explorer 10-11 */
.login_form input:-ms-input-placeholder { color: #B8B8B8;}
/* Microsoft Edge */
.login_form input::-ms-input-placeholder { color: #B8B8B8;}
.login_form_text{width: 45%;float: left;padding: 0px 12px;margin-top: 60px;}
.forgot_password{color: #4B56B5;font-size: 14px;text-decoration: none;margin-top: 5px;display: inline-block;}
.entry-item label{font-size: 14px;}
.rememberMe label{font-size: 14px;color: #B8B8B8;}
.login_butt{width: 100%;text-align: center;height: 57px;border-radius: 2px;font-size: 20px;text-transform: uppercase;outline: none;background: #4B56B5;color: #fff;
box-sizing: border-box;border:none;cursor: pointer;}
.login_butt:hover{opacity: 0.8;}
.localAccount,.entry,.entry-item,.rememberMe,.buttons,.divider,.create{float: left;width: 100%;position: relative;}
.rememberMe{margin-bottom:30px;}
.entry-item{margin-bottom: 54px;}
.divider,.create{display: none;}
.entry-item:first-child{margin-bottom: 18px;}
.buttons button{width: 100%;text-align: center;height: 57px;border-radius: 2px;font-size: 20px;text-transform: uppercase;outline: none;background: #77bc1f;color: #fff;box-sizing: border-box;border:none;cursor: pointer;margin: 5px 0px;}
.buttons button:hover{opacity: 0.8;}
#forgotPassword{color: #4B56B5;font-size: 14px;text-decoration: none;margin-top: 5px;float: left;}
.login_form .divider h2{margin: 30px 0 15px 0;}
.create p{font-size: 15px;color: #444;margin: 0;text-align: center;}
#createAccount{color: #4B56B5;font-size: 14px;text-decoration: underline;margin-top: 5px;display: inline-block;}
.entry-item i{position: absolute;left: 15px;top: 15px;width: 20px;height: 20px;}
#password{background:#fff url(https://ststoragecenterprod.blob.core.windows.net/b2ccontainer/B2C/CustomerPortal/images/lock.png) 12px center no-repeat;}
#logonIdentifier{background:#fff url(https://ststoragecenterprod.blob.core.windows.net/b2ccontainer/B2C/CustomerPortal/images/login_user.png) 12px center no-repeat;}
.error p{margin:0 0 5px 0;font-size: 14px;color: red;}
.error.pageLevel, .error.itemLevel, .verificationInfoText, .verificationSuccessText, .verificationErrorText{color: red;}
.password-label #forgotPassword{position: absolute;left: 0px;bottom: -25px;text-decoration: underline;}
.footer{color: #fff;width: 100%;padding: 8px 0px 8px 0px;margin: 0px auto 0px auto;text-align: center;line-height: normal;background-color: #1F4F83;}
#wrapper_header{height:50px;background: #fff;box-shadow: 0 0 10px rgba(0,0,0,0.5);border-radius: 5px;}
.logo img{float:left; margin:10px;}
.intro{display: none;}
.storage-navbar a{color: #fff;}
.wrapper1-row{margin: 0px;}
.dropdown-menu{background-color: #0d1a6b !important;}
.dropdown-item{color: #fff !important;}
.dropdown-item:focus, .dropdown-item:hover{color: #FFD342 !important;}
.nav-link{color: #fff;font-size: 16px !important;
 &:hover, &:focus{color: #FFD342 !important;}}
.btnRent{background-color: #FFD342;border-radius: 12px;font-weight: 600;color: #000;width: 90px;text-align: center;text-decoration: none;}
.btnRent:hover{color: #000 !important;}
.nav-logo{width: 25% !important;}
.nav-details{width: 75% !important;}
.FooterAlign{display: flex;flex-direction: column;}
.FooterImage {width: 40%;}
.cls-footer{background-color: #0d1a6b;float: left;width: 100%;}
.footerheader{font-weight: bold;color: white !important;text-decoration: none !important;font-size: 17px;}
.FooterSubMenu {font-size: 16px;color: white;text-decoration: none;}
.footerheader:hover, .FooterSubMenu:hover{color: #fff !important;}
.navbar-toggler-icon {background-image: url(https://ststoragecenterprod.blob.core.windows.net/b2ccontainer/B2C/CustomerPortal/images/WhiteToggler.svg) !important;}
.offcanvas {background-color: #0d1a6b !important;width: 100% !important;}
.btn-close {font-size: 20px;background-image: url(https://ststoragecenterprod.blob.core.windows.net/b2ccontainer/B2C/CustomerPortal/images/whiteX.svg) !important;}

/*Responsive CSS*/

@media only screen and (max-width : 1600px) {
  .login_form{padding: 5px;}
  .buttons button{height: 48px;font-size: 18px;}
  .login_form h2{margin: 20px 0 15px 0;}
}

@media only screen and (max-width : 1368px) {
  .login_form{padding: 2px;}
  .buttons button{height: 44px;font-size: 16px;}
  .login_form h1{font-size: 22px;}
  .login_form h2{margin: 15px 0 15px 0;}
}

@media only screen and (max-width : 1024px) {
  .login_form{width: 100%}
  .login_form_text{width: 100%;float: left;padding: 15px 0px;}
  .login_lft{display: none;}
  .login_rgt, .login-cntr{width: 100%;float: inherit;}
  .login_outer{height: auto}
  .wrapper1{width: 100%;}
}

@media only screen and (max-width:993px) {
   #divDesktopMenu{display: none;}
   #divMobileMenu{display: block;height: 47px;}
  .wrapper2{height: 30px;margin-top: 54px;}
  .FooterAlign{text-align: center;}
  .FooterImage {width: 25%;}
  .wrapper1{position: fixed;}
  .wrapper2 {margin-top: 90px;}
  .login_outer{height: auto;}
  .btnRent{width: 80px;}
}

@media only screen and (min-width:993px) {
  #divDesktopMenu{display: flex;}
  #divMobileMenu{display: none;}
  .wrapper1{position: fixed;}
}

@media only screen and (max-width: 896px) {
  #divMobileMenu{height: 45px;}
}

@media only screen and (max-width : 736px) {
  .login_form{width: 100%;padding: 0px;}
  .login_form input[type=text], .login_form input[type=password], .login_form input[type=email]{height: 40px;padding: 8px 15px 8px 45px;}
  .rememberMe,.entry-item:first-child {margin-bottom: 20px;}
  .entry-item {margin-bottom: 40px;}
  .buttons button {height: 34px;font-size: 15px;}
  .wrapper1 img{height: 58px;}
  .wrapper2{text-align: center;}
}

@media only screen and (max-width: 560px) {
  #divMobileMenu { height: 56px;}
  #divMobileMenu .container-fluid .navbar-brand{width: 30%;margin: 0;}
  /* .login_outer{height: auto;} */
}

@media only screen and (max-width : 420px) {
  .login_rgt, .login-cntr{width: 90%;flex-basis: 90%;}
  .wrapper1{width: 100%}
  .wrapper2{height: 62px;}
  #divMobileMenu{height: 40px;}
  .wrapper1 img{margin-left: 0px;}
}
