/* ============================================================================
   B2C STYLES WORKING MS
============================================================================ */

/* ------------------------------
   TEXT & INTRO
------------------------------ */
.login-form .intro h2:first-child {
    margin-bottom: 10px;
	background-color: #fff;
	background-image: url();
	color: #666666;
	font-size: 1.4em!important;
}

.intro {
    margin-bottom: 10px;
}

.container-form .login-form {
  /*-webkit-box-shadow: 0px 10px 50px 5px rgba(0,0,0,0.25);
  -moz-box-shadow: 0px 10px 50px 5px rgba(0,0,0,0.25);
  box-shadow: 0px 10px 50px 5px rgba(0,0,0,0.25);*/
  border: 0px solid #ccc;
  border-top: 0;
  margin-top: 0rem;
  padding: 0 30px 15px 30px;
}
}

/* ------------------------------
   VERIFYING BLURB
------------------------------ */
#verifying_blurb {
    position: absolute;
    bottom: 80px; /* or higher, depending on layout */
    left: 20px;
    z-index: 1;
}
#verifying_blurb:empty {
    display: none;
}

/* ------------------------------
   BASE FONT & COLORS
------------------------------ */
form#localAccountForm,
form#attributeVerification {
    font-family: "Open Sans", sans-serif;
    color: #000;
    background-color: #fff;
}

#forgotPassword {
    /* float: left; */
}

/* ------------------------------
   HEADINGS
------------------------------ */
/*form h2 {
    color: #00529b;
    font-weight: 700;
    margin-bottom: 20px;
}*/

.container-form .login-form h1:first-child {
  background-color: #fff;
  background-image: url();
  /* border-top: 1px solid #ccc; */
  color: black; /*#eee*/
  color: #666666;
  margin: -55px 0px 16px -30px;
  padding: 25px 0px;
  font-size: 1.6em!important;
  font-weight: 700 !important;
  padding-bottom: 0px;
  margin: 0;
  margin-bottom: 15px;
  margin-top: 10px;
}
.login-form .intro h2:first-child {
    margin-bottom: 0px;
	margin-top: -10px;
	background-color: #fff;
	background-image: url();
	color: #666666;
	font-size: 1.4em!important;
  margin: 0px 0px 0px 0px;
  padding: 0px 5px;
}


/* ------------------------------
   LABEL STYLING
------------------------------ */
#localAccountForm label,
#attributeVerification label {
    font-weight: 600;
    color: #black; /*#46545d  #666666;*/
    margin-bottom: 10px;
    display: inline-block;
}

/* ------------------------------
   INPUT FIELDS
------------------------------ */
#localAccountForm input,
#attributeVerification input {
    width: 100%;
    /* margin-left: 20%; */
    margin-top: 15px;
    padding: 10px 12px;
    font-size: 1em;
    border: 1px solid #c5ced6;
    border-radius: 0;
    background-color: #fff;
    color: #000;
    transition: all 0.3s ease-in-out;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}
#localAccountForm input:focus,
#attributeVerification input:focus {
    outline: none;
    border-color: #00529b;
    box-shadow: 0 0 4px rgba(0,82,155,0.3);
}

/* ------------------------------
   PASSWORD TOGGLERS
------------------------------ */
#passwordtoggler,
#newPasswordtoggler,
#reenterPasswordtoggler {
    border: none;
    background: transparent;
    position: absolute;
    right: 0%;
    top: 55%;
    transform: translateY(-50%);
    color: #00529b;
    cursor: pointer;
    font-size: 1rem;
}

/* ------------------------------
   ERROR MESSAGES
------------------------------ */
.error {
    display: block;
    width: 100%;
    color: #000;
    border-left-color: #e00000;
    background-color: #f3f3f3;
    padding: 0px 0px;
    margin-top: 10px;
    font-weight: 200;
    line-height: 1.4;
}
.error.itemLevel {
    margin-top: 0;
    margin-bottom: 10px;
}
.itemLevel.error {
    color: #e00000;
    background-color: #fff;
    padding-bottom: 0px;
    display: none;
}
#passwordEntryMismatch.error,
#claimVerificationServerError.error{
    border-left-color: #e00000;
    background-color: #f3f3f3;
    padding: 10px 15px;
    margin: 10px 0;
    color: #000;
}

#localAccountForm > .error{
    border-left-color: #e00000;
    background-color: #f3f3f3;
    color: #000;
}

/* ------------------------------
   BUTTONS
------------------------------ */
button.btn,
#next,
#continue,
#cancel,
.btn-verify {
    display: inline-block;
    background-color: #00529b;
    color: #fff;
    border: none;
    padding: 10px 20px;
    font-size: 1em;
    text-align: center;
    margin-top: 10px;
    border-radius: 6px;
    -webkit-transition: none !important;
    transition: none !important;
}
.btn:hover,
.btn:focus,
.btn:active:focus,
.btn.active:focus,
#next:hover,
#next:focus {
    border: 0px solid #000;
    border-radius: 6px;
    outline: 0px solid #000;
	background-color: #dce5ee;
    color: #00529B;
}

button.btn:hover,
#next:hover,
	#continue:hover,
.btn-verify:hover,
.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active,
.open .dropdown-toggle.btn-default {
    background-color: #dce5ee;
	border: 0px solid #000;
    border-radius: 6px;
    outline: 0px solid #000;
	color: #00529B;
}
#emailVerificationControl_but_send_new_code, #cancel, #emailVerificationControl_but_change_claims {
    background-color: #fff;
    color:#00529b !important;
    border: 1px solid #dce5ee;

}
#emailVerificationControl_but_send_new_code:hover, #emailVerificationControl_but_change_claims:hover, #cancel:hover
{
	background-color: #dce5ee; !important;
    color: #00529b !important;
	border: 1px solid;
	border-radius: 6px;
}
/*#emailVerificationControl_but_change_claims {
	visibility:hidden;
}*/


/* ------------------------------
   VERIFICATION / INFO BLOCKS
------------------------------ */
.verificationInfoText,
    background-color: #f8f8f8;
    border-left: 4px solid #00529b;
    padding: 10px 15px;
    margin: 10px 0;
    color: #000;
}
.verificationErrorText {
    border-left-color: #e00000;
    background-color: #fbe9e7;
    padding: 10px 15px;
    margin: 10px 0;
    color: #000;
}
.verificationSuccessText {
    border-left-color: #218721;
    background-color: #f1fff1;
    padding: 10px 15px;
    margin: 10px 0;
    color: #000;
}

/* ------------------------------
   ENTRY LAYOUT
------------------------------ */


    /* Session badge */
    #session-badge {
        display: inline-block;
    }


.entry-item {
    position: relative;
    margin-bottom: 5px;
}

.attrEntry #newPassword_label {
	margin-bottom: 10px;
}

.attrEntry:first-of-type {
    margin-top: 15px;
}

.attrEntry::after,
.entry-item::after {
    content: "";
    display: table;
    clear: both;
}
li.Password.newPassword_li {
	margin-top: -5%

}
li.Password.reenterPassword_li {
    margin-top: -20px;
}

/* ------------------------------
   HELP LINKS
------------------------------ */
.helpLink.tiny {
    display: inline-block;
    color: #00529b;
    font-size: 0.85em;
    margin-top: 5px;
}
.helpLink.tiny:hover {
    text-decoration: underline;
}

    #localAccountForm label,
    #attributeVerification label,
    #localAccountForm input, #localAccountForm #password {
        width: 100%;
        text-align: left;
    }
    #attributeVerification input {
        width: 100%;
    }
	    #attributeVerification label {
        padding-left: 0px;
    }
    #localAccountForm input {
        float: left;
    }

     .password-label {
            width: 0%;
            margin-top: 5px;
            margin-bottom: -5px;
            /* float: left; */
    }

    .itemLevel.error {
        width: 100%;
        margin-top: -10px;
        margin-bottom: -10px;
    }
	 .itemLevel.error{
        float:right;
        max-width: 100%;
        /* min-width: 74%; */
    }

    #attributeVerification #newPassword,
    #attributeVerification #reenterPassword {
        width: 100%;
    }

    #passwordtoggler {
        right: -40px;
        top: 55%;
    }

#localAccountForm label {
        padding-left: 0px;
    }
#localAccountForm label[for="password"] {
        padding-left: 0px;
    }
#forgotPassword {
        position: relative;
        width: 100%;
        top: -1.50rem;
        left: 0%;
        padding-left: 0%;
        /*font-size: 12px;*/
    }
    #newPasswordtoggler,
    #reenterPasswordtoggler {
        right: -40px;
       /* top: 55%; */
        transform: none;
    }
	      #attributeVerification #newPassword, #attributeVerification #reenterPassword {
        width: 66%;
        margin-right: 0%;
    }

    .buttons {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: stretch;
    }
    #continue {
        margin-left: 0px;
    }
    button.btn,
    #next,
    #continue,
    #cancel {
        width: 100%;
    }
    #emailVerificationControl_but_verify_code,
    #emailVerificationControl_but_send_new_code {
        margin-left: 0px;
    }

    /* Eye button when error displayed */
    .entry-item:has(> .error[style*="display: block"]) #passwordtoggler,
    .entry-item:has(> .error[style*="display: block"]) #newPasswordtoggler,
    .entry-item:has(> .error[style*="display: block"]) #reenterPasswordtoggler {
        right: 0px;
        top: 50%;
        transform: none;
    }

    .error.itemLevel {
        background-color: #f3f3f3;
        padding: 0rem 0.5rem;
        border-left: 4px solid red;
        width: 100%;
        color: black;
        margin-top: -5px;
    }
#localAccountForm .error p{
    padding-top: 10px !important;
}
    .error.itemLevel.show {
        background-color: #f3f3f3;
        padding: 0.2rem 0.5rem;
        border-left: 4px solid red;
        width: 100%;
        color: black;
    }

    /*.verificationErrorText.error:not(:empty) {
        display: none;
    }*/
    div.verificationErrorText,
    div.error.pageLevel {
        background-color: #f3f3f3;
        border-left-color: red;
    }
	
	#attributeVerification #newPassword, #attributeVerification #reenterPassword {
        width: 100%;
    }

	    #attributeVerification #newpassword {
        padding-left: 0px;
			
    }
    #forgotPassword {
        position: relative;
        width: 100%;
        top: 0rem;
        left: 0%;
        font-size: 16px;
    }
        .password-label {
            width:100%;
            margin-top: 0px;       
            margin-bottom: 5px;
			margin-left: 0%;
    }
.entry-item:has(> .error[style*="display: block"]) #passwordtoggler {
	    right: -40px;
        top: 55%;
        transform: none;
}


@media (min-width: 768px) {
    /* Session badge */
    #session-badge {
        display: inline-block;
    }

  .attrEntry,
.entry-item {
    position: relative;
    margin-bottom: 5px;
}

.attrEntry:first-of-type {
    margin-top: 15px;
}

.attrEntry::after,
.entry-item::after {
    content: "";
    display: table;
    clear: both;
}

    #forgotPassword {
        position: relative;
        width: 100%;
        top: -1rem;
        left: 0%;
        font-size: 16px;
    }


    /* Eye button when error displayed */
    .entry-item:has(> .error[style*="display: block"]) #newPasswordtoggler,
    .entry-item:has(> .error[style*="display: block"]) #reenterPasswordtoggler {
        right: -40px;
        top: 40%;
        transform: none;
    }
.entry-item:has(> .error[style*="display: block"]) #passwordtoggler {
	    right: -40px;
	    top: 45%;
	    transform: none;
}
    .error.itemLevel {
        background-color: #f3f3f3;
        padding: 0rem 0.5rem;
        border-left: 4px solid red;
        width: 100%;
        color: black;
    }
    div.verificationErrorText,
    div.error.pageLevel {
        background-color: #f3f3f3;
        border-left-color: red;
    }

    /* Buttons alignment */
    .buttons {
        display: flex;
        justify-content: flex-end;
        max-width: 100%;
       /* min-width: 95%;*/
    }
    #continue {
        margin-right: 0px;
    }

	    #localAccountForm label,
    #attributeVerification label,
    #localAccountForm input, #localAccountForm #password {
        width: 100%;
        text-align: left;
    }
    #attributeVerification input {
        width: 100%;
    }

        .password-label {
            width:100%;
            margin-top: 0px;
            margin-bottom: 5px;
            margin-left: -90%;
    }
	
	#localAccountForm label[for="password"] {
        padding-right: 0px;
 }
	/*    #emailVerificationControl_but_verify_code {
        order: 2
    } */
	/*	#emailVerificationControl_but_change_claims {
	visibility:hidden;
	padding: 0;
	margin: 0;
	font-size:0;
}*/
}
@media (min-width: 1200px) {

	#localAccountForm label[for="password"] {
        padding-right: 45px;
    }

}

@media (max-width: 768px) {
		#localAccountForm label[for="password"] {
        padding-top: 10px;
		
    }
	.password-label {
		margin-bottom: 0px;
		
	}

	#passwordtoggler {
		top: 60%;
	}
    #newPasswordtoggler,
    #reenterPasswordtoggler {
        right: -40px;
        top: 66%; 
        transform: none;
    }
	/*#emailVerificationControl_but_change_claims {
	visibility:hidden;
	padding: 0;
	margin: 0;
	font-size:0;
	
}*/
}
@media (min-width: 768px) {

	        .password-label {
            margin-left: -89%;
    }
		#passwordtoggler {
		top: 50%;
	}
	#newPasswordtoggler,
    #reenterPasswordtoggler {
        right: -40px;
        top: 65%; 
        transform: none;
    }
	.attrEntry #newPassword_label {
	margin-bottom: 10px;
}
}