:root {
  --primary: #001871;
  --primary-dark: #232229;
  --ios-purple: #39449C;
  --ios-purple-light: #E2E3F0;
  --secondary: #00A3E0;
  --tertiary: #00C19F;
  --tertiary-light: #A8EADE;
  --tertiary-dark: #006B57;
  --border: #EAEBEF;
  --border-medium: #DEDFE7;
  --border-light: #f3f3f6;
  --color__grey-dark: #232229;
  --color__grey-medium-light: #65666B;
  --color__grey-medium: rgba(0, 0, 0, 0.7);
  --color__grey-medium-dark: #39393F;
  --color__grey-light: #727380;
  --color__grey-lighter: #A7A9B2;
  --color__error: #FF331F;
  --color__error-dark: #B01B0C;
  --color__error-light: #FFC6C1;
  --color__error-lighter: #FFF7F7;
  --color__warning-dark: #B35C05;
  --color__warning-light: #FEEBD7;
  --thead: #F3F4F9;
  --font__small: 0.875rem;
  --font__regular: 1rem;
  --font__medium: 1.125rem;
  --font__medium-large: 1.25rem;
  --font__large: 1.5rem;
  --font__xlarge: 2rem;
  --font__xxlarge: 2.5rem;
  --font-family: 'Inter', sans-serif;
  --field-shadow: 0px 1px 3px rgba(0, 0, 0, 0.04);
}
.aro-login-wrapper {
  display: flex;
  height: 100%;
}
.aro-login-wrapper .left-pane,
.aro-login-wrapper .right-pane {
  flex: 0 1 50%;
  align-items: stretch;
  padding: 20px;
}
.aro-login-wrapper .left-pane {
  display: flex;
  align-items: center;
}
@media screen and (max-width: 1200px) {
  .aro-login-wrapper .left-pane {
    flex: 1 1 auto;
  }
}
@media screen and (max-width: 1200px) {
  .aro-login-wrapper .left-pane {
    flex: 1 1 auto;
  }
}
.aro-login-wrapper .left-pane .footer-group {
  position: absolute;
  padding: 20px 20px;
  width: 100%;
  bottom: 0px;
  font-size: 14px;
  left: 0px;
  color: #727380;
}
.aro-login-wrapper .left-pane > .content {
  display: flex;
  flex-direction: column;
  max-width: 335px;
  width: 100%;
  margin: 0 auto;
  padding-bottom: 130px;
}
.aro-login-wrapper .left-pane > .content .header-group {
  display: flex;
  align-items: center;
  font-family: 'Montserrat', 'Inter', sans-serif;
  margin-bottom: 130px;
}
@media screen and (max-width: 1200px) {
  .aro-login-wrapper .left-pane > .content .header-group {
    margin-bottom: 70px;
  }
}
@media screen and (max-width: 1200px) {
  .aro-login-wrapper .left-pane > .content .header-group {
    margin-bottom: 70px;
  }
}
.aro-login-wrapper .left-pane > .content .header-group > img {
  height: 37px;
  width: 37px;
  margin-right: 20px;
}
.aro-login-wrapper .left-pane > .content .header-group > .heading {
  color: #001871;
  font-size: 18px;
  font-weight: 700;
}
.aro-login-wrapper .left-pane > .content .form-group h1 {
  font-style: normal;
  font-weight: 600;
  font-size: 48px;
  line-height: 58px;
  color: #232229;
}
@media screen and (max-width: 1200px) {
  .aro-login-wrapper .left-pane > .content .form-group h1 {
    font-size: 34px;
  }
}
@media screen and (max-width: 1200px) {
  .aro-login-wrapper .left-pane > .content .form-group h1 {
    font-size: 34px;
  }
}
.aro-login-wrapper .left-pane > .content .form-group p {
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.4em;
  color: #65666B;
}
.aro-login-wrapper .left-pane > .content .form-group .form-content-group {
  overflow: hidden;
  margin-top: 32px;
  width: 100%;
  position: relative;
  height: 150px;
}
.aro-login-wrapper .left-pane > .content .form-group .form-content-group .auth-alternative {
  margin-top: 14px;
}
.aro-login-wrapper .left-pane > .content .form-group .form-content-group .auth-alternative .link {
  color: #001871;
  cursor: pointer;
  transition: color 0.2s ease;
}
.aro-login-wrapper .left-pane > .content .form-group .form-content-group .auth-alternative .link:hover {
  color: #002ed7;
}
.aro-login-wrapper .left-pane > .content .form-group .form-content-group.microsoft-active .microsoft-group {
  left: 0px;
}
.aro-login-wrapper .left-pane > .content .form-group .form-content-group.magiclink-active .magiclink-group {
  left: 0px;
}
.aro-login-wrapper .left-pane > .content .form-group .form-content-group.success-active .success-group {
  left: 0px;
}
.aro-login-wrapper .left-pane > .content .form-group .form-content-group.success-active .magiclink-group {
  left: -110%;
}
.aro-login-wrapper .left-pane > .content .form-group .form-content-group .magiclink-group,
.aro-login-wrapper .left-pane > .content .form-group .form-content-group .success-group,
.aro-login-wrapper .left-pane > .content .form-group .form-content-group .microsoft-group {
  position: absolute;
  top: 0px;
  left: 110%;
  width: 100%;
  transition: left 0.2s ease;
}
.aro-login-wrapper .left-pane > .content .form-group .form-content-group .microsoft-group {
  left: -110%;
}
.aro-login-wrapper .left-pane > .content .form-group .form-content-group .success-group {
  border-radius: 8px;
  background-color: #CFF4ED;
  color: #006B57;
  padding: 20px;
}
.aro-login-wrapper .left-pane > .content .form-group .form-content-group .success-group .heading {
  font-weight: 600;
  font-size: 16px;
}
.aro-login-wrapper .left-pane > .content .form-group .form-content-group .success-group .description {
  margin-top: 8px;
  font-size: 14px;
}
.aro-login-wrapper .left-pane > .content .form-group .form-content-group .success-group .description span {
  font-weight: 600;
}
.aro-login-wrapper .left-pane > .content .form-group .powered-by {
  margin-top: 17px;
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 17px;
  color: rgba(0, 0, 0, 0.7);
}
.aro-login-wrapper .right-pane {
  background: linear-gradient(0deg, rgba(0, 24, 113, 0.71), rgba(0, 24, 113, 0.71)), url('../img/aro-holding-phone.jpg') center right / cover no-repeat;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  padding-left: 40px;
  padding-right: 40px;
}
@media screen and (max-width: 1200px) {
  .aro-login-wrapper .right-pane {
    display: none;
  }
}
@media screen and (max-width: 1200px) {
  .aro-login-wrapper .right-pane {
    display: none;
  }
}
.aro-login-wrapper .right-pane > .content {
  color: #fff;
  max-width: 646px;
}
.aro-login-wrapper .right-pane > .content img {
  width: 143px;
  margin-bottom: 35px;
}
.aro-login-wrapper .right-pane > .content h1 {
  font-weight: 400;
  font-size: 64px;
  line-height: 72px;
}
.aro-login-wrapper .right-pane > .content p {
  margin-top: 30px;
}
.aro-login-wrapper.robot-variant .left-pane > .content .header-group > img {
  height: auto;
  max-width: 160px;
  width: 100%;
}
.aro-login-wrapper.robot-variant .right-pane {
  background: linear-gradient(0deg, rgba(73, 10, 85, 0.74) 0%, rgba(73, 10, 85, 0.74) 100%), url('../img/roboworx-robots.jpg') center center / cover no-repeat;
}
.aro-login-wrapper.robot-variant .right-pane > .content h1 {
  font-weight: 600;
}
.aro-login-wrapper.robot-variant .right-pane > .content img {
  max-width: 240px;
  width: 100%;
}