body#rl-app {
  background: #fff !important;
  background-image: none !important;
  color: #202124 !important;
  font-family: Arial, "Helvetica Neue", sans-serif !important;
}

.thm-login-page,
#rl-app {
  background: #fff !important;
}

#V-Login {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
}

.descWrapper {
  order: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  font-size: 0 !important;
  line-height: 0 !important;
  margin: 0 auto 28px !important;
  text-align: center !important;
  text-shadow: none !important;
}

.descWrapper::before {
  content: "" !important;
  display: block !important;
  width: min(244px, 68vw) !important;
  height: 82px !important;
  margin: 0 auto !important;
  background: url("/snappymail-custom/logo-retangular-color.png") center center / contain no-repeat !important;
  transform: translateX(-4px) !important;
}

#rl-loading,
.loginForm,
.b-login-content form,
template + form {
  color: #202124 !important;
}

form {
  order: 2 !important;
  width: min(420px, calc(100vw - 40px)) !important;
  margin: 0 auto !important;
  padding: 38px 40px 32px !important;
  background: #fff !important;
  border: 1px solid #dadce0 !important;
  border-radius: 28px !important;
  box-shadow: 0 8px 28px rgba(60, 64, 67, .10) !important;
}

.controls {
  position: relative !important;
  margin: 0 0 16px !important;
}

.controls .fontastic {
  display: none !important;
}

.controls input {
  width: 100% !important;
  height: 52px !important;
  box-sizing: border-box !important;
  padding: 13px 15px !important;
  border: 1px solid #dadce0 !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: #202124 !important;
  font-size: 16px !important;
  box-shadow: none !important;
  outline: none !important;
  transition: border-color .15s ease, box-shadow .15s ease !important;
}

.controls input:focus {
  border-color: #1a73e8 !important;
  box-shadow: 0 0 0 1px #1a73e8 !important;
}

.controls input::placeholder {
  color: #5f6368 !important;
}

.e-checkbox {
  color: #64b5f6 !important;
  font-size: 14px !important;
  text-shadow: none !important;
}

.e-checkbox i,
.e-checkbox span {
  color: #64b5f6 !important;
}

.language-buttons {
  margin-left: auto !important;
}

.buttonLogin {
  display: block !important;
  width: 100% !important;
  height: 44px !important;
  margin-top: 24px !important;
  border: 0 !important;
  border-radius: 22px !important;
  background: #1a73e8 !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

.buttonLogin:hover {
  background: #1765cc !important;
  opacity: 1 !important;
}

.emc-recovery-link {
  margin-top: 16px !important;
  text-align: center !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
}

.emc-recovery-link a {
  color: #1a73e8 !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}

.emc-recovery-link a:hover {
  color: #1765cc !important;
  text-decoration: underline !important;
}

.alert {
  order: 3 !important;
  position: static !important;
  width: min(420px, calc(100vw - 40px)) !important;
  box-sizing: border-box !important;
  margin: 16px auto 0 !important;
  border-radius: 12px !important;
  text-shadow: none !important;
}

.alert[hidden] {
  display: none !important;
}

.alert.emc-login-message {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  padding: 13px 14px !important;
  border: 1px solid #f4c7c3 !important;
  background: #fce8e6 !important;
  color: #3c4043 !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
  box-shadow: none !important;
}

.alert.emc-login-message::before {
  content: attr(data-emc-icon) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 22px !important;
  width: 22px !important;
  height: 22px !important;
  margin-top: 1px !important;
  border-radius: 50% !important;
  background: #d93025 !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

.alert.emc-login-message[data-emc-type="domain"] {
  border-color: #fdd663 !important;
  background: #fff8e1 !important;
}

.alert.emc-login-message[data-emc-type="domain"]::before {
  background: #f9ab00 !important;
  color: #202124 !important;
}

.alert.emc-login-message[data-emc-type="info"] {
  border-color: #c9ddff !important;
  background: #e8f0fe !important;
}

.alert.emc-login-message[data-emc-type="info"]::before {
  background: #1a73e8 !important;
}

.alert.emc-login-message .close,
.alert.emc-login-message p {
  display: none !important;
}

@media (max-width: 520px) {
  form {
    border: 0 !important;
    box-shadow: none !important;
    padding: 28px 24px 24px !important;
  }

  .descWrapper::before {
    width: min(220px, 72vw) !important;
    height: 74px !important;
    transform: translateX(-3px) !important;
  }
}