<div id="loading-container" style="display:none;">
      <div class="loader"> </div>
</div>
<style>
#loading-container {
	position: fixed;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
	flex-direction: column;
    z-index: 10;
    background: white;
 }
.loader {
  border: 7px solid #ffffff;
  border-top: 7px solid var(--primary-color);
  border-radius: 50%;
  width: 45px;
  height: 45px;
  animation: spin 1.5s linear infinite;
}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

@media only screen and (max-width: 580px) {
    .description-container {
      width: 100% !important;
    }

    .field-group input {
      padding: 0 10px !important;
    }

    #loginform>fieldset>div {
      padding: 0;
    }
  }


  #loginform > fieldset > div{
    padding: 0 !important;
  }


  .description-container #link-container {
    display: none !important;
  }
</style>

<script>
if(isJapaneseUser && !isJapaneseVersion){
$("#loading-container").show();
}
if(window.location.href.toLowerCase().includes("lang=ja") && !isJapaneseVersion){
$("#loading-container").show();
}
</script>

<script>

window.addEventListener("load", function(){
	//$('.login-form-container').append(`<p>Forgot your password? Reset it <a href="mailto:morganstanley@theonevalley.com?subject=Reset Password Request&body=Please reset my password.">here</a>.</p>`);
// $('.login-form-container').append(`<p id="pw-reset" class="hidden">Forgot your password? Reset it <a href="/display/MSA/Forgot+Password">here</a>.</p>`);

	$('.login-form-container').append(`<p><a href="/display/MSA/Sign+Up">Don't have an account? Sign up here.</a></p>`);
});

</script>

<style>
div.bigImageContainer {
    width: 500px;
	height: 100%;
    background-image: url('https://passport-media.s3-us-west-1.amazonaws.com/Morgan+Stanley/msLogin.jpg');
    background-position: center; /* Center the image */
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: cover;
	box-shadow: 0 2px 10px 2px rgba(0, 0, 0, 0.1);
    margin-left: 10px;
}

div.signContainer {
    width: 90vw;
    height: 90%;
    margin: 60px auto;
}

.rw_content {
    background: var(--main-background);
}


div.formContainer {
    box-shadow: 0 2px 10px 2px rgba(0, 0, 0, 0.1);
    margin-right: 10px;
	/* width: 50%; */
}

.link-container-button.left {
    display: none;
}

div.link-container-button {
    width: 100%;
}

input#loginButton:hover {
    cursor: pointer;
}

@media only screen and (max-width: 480px) {
div.formContainer {
    box-shadow: none;
    width: 100%;
}

div.bigImageContainer {
    display: none;
}

div.signContainer {
    margin: 0 auto;
}

form.login-form-container[name='loginform'] {
    width: 100%;
    padding: 14px 0;
    margin: auto;
}

div.field-group {
    width: 100%;
    margin-top: 10px;
}

.field-group.login-field-group {
    margin-top: 20px;
}
}
</style>

<style>

div#custom-footer {
    display: none;
}
.main-container {
    min-height: calc(100vh - 50px);
    background-repeat: no-repeat;
    background-size: cover;
}

div#toggle {
    display: none;
}
</style>

<style>
/* new stuff */
span.conf-macro.output-inline {
    width: 100%;
}
</style>