/*
  --- Font-Size System (px) ---
  10 / 12 / 14 / 16 / 18 / 20 / 24 / 30 / 36 / 44 / 52 / 62 / 74 / 86 / 98


  --- Colors ---
  Primary: #0099dc
  Tint-Primary: #33ade3

  Main-Gray: #373737
  Tint-Gray: #9b9b9b
  Shade-Gray: #1d1d1d
  Form-Gray: #f7f7f7
  Form-Border: #e7e7e7

  Text-Gray: #555

  Main-White: #fff

  Main-Error: red
  Error-Background: #ffd3c9
*/

/***********************************************************/
/** SIGN-SECTION **/
/***********************************************************/

/***********************/
/*** CLASSES TO USE WHEN ON DIGITAL MOVE ***/
/***********************/
.digitalTitleMoveChanges {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.digitalTitleMoveChanges .my-account {
  font-size: 3.4rem;
}

.digitalTitleMoveChanges .sign-message {
  font-size: 1.8rem;
}

.digital-form--1-col {
  grid-template-columns: 1fr !important;
  align-content: center;
  justify-content: center;
}

/***********************/
/*** FORM STYLE FIX ***/
/***********************/
form {
  padding: 4.4rem;
}

form .intro {
  margin-bottom: 3.6rem;
}

/***********************/
/*** SUCCESS CHANGE PASSWORD MESSAGE CLASSES ***/
/***********************/
.successMessageContainer {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #018749;
  color: #fff;
  gap: 1rem;
  border-radius: 5px;

  max-width: 38rem;
  margin: 1rem auto 0 auto;
  padding: 2rem;
}

.successMessageContainer i {
  font-size: 1.8rem;
}

.messageSection {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.reset-message-title {
  display: inline-block;
  font-size: 1.8rem;
  font-weight: 600;
}

.paragraphMessage {
  display: inline-block;
  font-size: 1.4rem;
  line-height: 1.4;
  letter-spacing: 0.2px;
}

/***********************/
/*** FORM ENTRY-ITEM CLASSES FIX ***/
/***********************/
.entry {
  margin-top: 3.6rem;
  display: flex;
  flex-direction: column;
  gap: 2rem;

  position: relative;
}

.password-label {
  display: flex;
  justify-content: space-between;
}

.password-label a:link,
.password-label a:visited,
.password-label a:hover,
.password-label a:active {
  font-size: 1.4rem;
  text-decoration: none;
  color: #00567f;
}

.working {
  display: none;
  border: 0.4rem solid #33ade3;
  width: 3.6rem;
  height: 3.6rem;
  border-radius: 50%;
  border-left-color: #f7f7f7;

  animation: spin 1s ease infinite;

  position: absolute;
  bottom: 5rem;
  left: 47%;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.rememberMe {
  display: flex;
  gap: 1rem;
}

.rememberMe label {
  font-size: 1.6rem;
  line-height: 1.5em;
  font-weight: normal;
}

.divider,
.create {
  display: none;
  color: red;
}

.signin-button {
  margin-top: 5.2rem;
  padding: 0.5rem 2rem;
  font-size: 1.6rem;
  min-width: 14rem;
}
/***********************************************************/
/** END SIGN-SECTION **/
/***********************************************************/
