/****************************************
  ==== CORE LAYOUT
****************************************/

html, body {
  height: 100%;
}
body {
  text-align: center; background: #fff; -webkit-tap-highlight-color: rgba(0,0,0,0);
}
.master-wrap {
  display: grid;
  grid-template-rows: 1fr 35px;
  height: 100vh;
}
.content-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  height: 100%;
}
.sigin-content-wrapper {
  display: -webkit-flex; display: flex; flex-direction: column; align-items: center; gap: 35px; margin-top: clamp(30px, 100vh - 685px, 150px); margin-bottom: 20px;
}
.promo-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 11vh;
  background-position: center;
  background-repeat: no-repeat;
  background-color: #9E007E;
  background-image: url("https://cdn.siteimprove.net/idp/assets/images/si-34-weeks-background.svg");
  background-size: cover;
}
.promo-graphic {
  width: 25rem;
  margin-bottom: 1rem;
}
.promo-text {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 600;
  width: 80%;
}
.promo-text p {
  color: #fff;
  font-size: 1.2rem;
  text-align: center;
  margin-bottom: 3rem;
}
section.main-wrap {
  display: -webkit-flex; display: flex; width: 381px; padding: 10px 24px 40px 24px; flex-direction: column; justify-content: center; align-items: center; gap: 20px;
}
section.main-wrap > p {
  color: #1f2b3f; margin: 0; text-align: left;
}
div.content-heading {
  display: -webkit-flex; display: flex; align-items: center; gap: 10px; align-self: stretch;
}
section.main-wrap form {
  display: inherit; flex-direction: inherit; gap: inherit; align-self: stretch;
}
section.main-wrap > p {
  align-self: stretch;
}

/****************************************
  ==== HEADER
****************************************/
header.signin {
  display: -webkit-flex; display: flex; justify-content: center;
}
header.signin .logo {
  width: 250px; display: block; margin: 0 auto;
}

/****************************************
  ==== FOOTER
****************************************/

footer.main {
  height: 35px;
  grid-row: 2;
  grid-column: 1;
}
footer.main .wrap {
  padding: 0; background: #2666f1;
}
footer.main .wrap .footer-content {
  display: flex;
  justify-content: center;
  height: 35px;
  align-items: center;
}
footer.main .wrap .footer-content .legal-wrap {
  display: -webkit-flex; display: flex; align-items: flex-start; gap: 24px;
}

/* Legal stuff */
footer.main div.wrap small {
  display: inline-block; margin: 0; font-size: 1.2em; color: #fff; line-height: 1.25;
}
footer.main div.wrap ul.legal {
  list-style-type: none; display: inline-block; margin: 0; font-size: 1.2em; line-height: 1.25;
}
footer.main div.wrap ul.legal li {
  display: inline-block; margin: 0 24px 0 0; padding: 0; color: #fff; font-size: inherit; line-height: inherit;
}
footer.main div.wrap ul.legal li:last-child {
  margin: 0;
}
footer.main div.wrap ul.legal li a {
  color: #fff;
}
footer.main div.wrap ul.legal li a:focus, footer.main div.wrap ul.legal li a:focus-visible {
  box-shadow: 0 0 0 2px #fff; color: #fff; text-decoration: none;
}
footer.main div.wrap ul.legal li a:hover {
  text-decoration: none;
}
footer.main div.wrap ul.legal li:before {
  display: none;
}

/****************************************
  ==== BREAKPOINT: 992px
****************************************/

@media only screen and (max-width: 992px){

.signin-wrapper {
  max-width: 100vw !important; width: 100vw;
}
.promo-wrapper {
  display: none;
}

}