.sign-in-popup {
  width: 100%;
  min-width: 2015px;
  min-height: 1024px;
  display: flex;
  gap: 200px;
}

.sign-in-popup .div {
  width: 1440px;
  height: 1024px;
  position: relative;
  background-color: #ffffff;
}

.sign-in-popup .overlay-full-screen {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: #282828e6;
  opacity: 0.7;
}

.sign-in-popup .sign-in {
  display: flex;
  flex-direction: column;
  width: 624px;
  height: 628px;
  align-items: flex-end;
  gap: 21px;
  padding: 32px;
  position: absolute;
  top: calc(50.00% - 237px);
  left: calc(50.00% - 312px);
  background-color: #ffffff;
  border-radius: 12px;
  overflow: hidden;
}

.sign-in-popup .div-2 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.sign-in-popup .header {
  display: flex;
  align-items: flex-start;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.sign-in-popup .content {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  position: relative;
  flex: 1;
  flex-grow: 1;
}

.sign-in-popup .text-wrapper {
  position: relative;
  flex: 1;
  margin-top: -1.00px;
  font-family: var(--heading-04-font-family);
  font-weight: var(--heading-04-font-weight);
  color: #282828;
  font-size: var(--heading-04-font-size);
  letter-spacing: var(--heading-04-letter-spacing);
  line-height: var(--heading-04-line-height);
  font-style: var(--heading-04-font-style);
}

.sign-in-popup .icon-close {
  position: absolute;
  top: calc(50.00% - 38px);
  right: -16px;
  width: 32px;
  height: 32px;
}

.sign-in-popup .union {
  position: absolute;
  top: 7px;
  left: 7px;
  width: 18px;
  height: 18px;
}

.sign-in-popup .form {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.sign-in-popup .form-input {
  height: 52px;
  justify-content: center;
  gap: 8px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
  align-self: stretch;
  width: 100%;
}

.sign-in-popup .input {
  display: flex;
  height: 52px;
  align-items: center;
  gap: 8px;
  position: relative;
  align-self: stretch;
  width: 100%;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-color: #d0d5dd;
}

.sign-in-popup .icon-input {
  display: flex;
  align-items: center;
  gap: 8px;
  position: relative;
  flex: 1;
  flex-grow: 1;
}

.sign-in-popup .your-email {
  position: relative;
  flex: 1;
  margin-top: -1.00px;
  font-family: var(--text-16px-regular-font-family);
  font-weight: var(--text-16px-regular-font-weight);
  color: #9d9ea1;
  font-size: var(--text-16px-regular-font-size);
  letter-spacing: var(--text-16px-regular-letter-spacing);
  line-height: var(--text-16px-regular-line-height);
  font-style: var(--text-16px-regular-font-style);
  background: transparent;
  border: none;
  padding: 0;
}

.sign-in-popup .your-email-2 {
  position: relative;
  flex: 1;
  margin-top: -1.00px;
  font-family: var(--text-16px-regular-font-family);
  font-weight: var(--text-16px-regular-font-weight);
  color: #9d9ea1;
  font-size: var(--text-16px-regular-font-size);
  letter-spacing: var(--text-16px-regular-letter-spacing);
  line-height: var(--text-16px-regular-line-height);
  font-style: var(--text-16px-regular-font-style);
}

.sign-in-popup .input-2 {
  height: 52px;
  display: flex;
  align-items: center;
  gap: 8px;
  position: relative;
  align-self: stretch;
  width: 100%;
}

.sign-in-popup .your-email-3 {
  font-weight: 700;
  color: #262626;
  font-size: 20px;
  line-height: 26px;
  position: relative;
  flex: 1;
  margin-top: -1.00px;
  font-family: "Inter", Helvetica;
  letter-spacing: 0;
}

.sign-in-popup .frame {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 20px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.sign-in-popup .course {
  display: inline-flex;
  height: 26px;
  align-items: center;
  gap: 12px;
  position: relative;
}

.sign-in-popup .radio-button {
  position: relative;
  width: 20px;
  height: 20px;
  margin-left: -1.00px;
  border-radius: 4px;
  border: 1px solid;
  border-color: #475467;
}

.sign-in-popup .text-wrapper-2 {
  position: relative;
  width: fit-content;
  margin-top: -1.00px;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #475467;
  font-size: 20px;
  letter-spacing: 0;
  line-height: 26px;
  white-space: nowrap;
}

.sign-in-popup .button {
  all: unset;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 28px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
  background-color: #5dade2;
  border-radius: 6px;
}

.sign-in-popup .get-started {
  position: relative;
  width: fit-content;
  margin-top: -1.00px;
  font-family: var(--button-large-font-family);
  font-weight: var(--button-large-font-weight);
  color: #ffffff;
  font-size: var(--button-large-font-size);
  text-align: center;
  letter-spacing: var(--button-large-letter-spacing);
  line-height: var(--button-large-line-height);
  white-space: nowrap;
  font-style: var(--button-large-font-style);
}

.sign-in-popup .div-3 {
  width: 375px;
  height: 800px;
  position: relative;
  background-color: #ffffff;
}

.sign-in-popup .sign-in-2 {
  display: flex;
  flex-direction: column;
  width: 343px;
  height: 485px;
  align-items: flex-end;
  justify-content: center;
  gap: 24px;
  padding: 24px 16px;
  position: absolute;
  top: calc(50.00% - 197px);
  left: calc(50.00% - 172px);
  background-color: #ffffff;
  border-radius: 12px;
  overflow: hidden;
}

.sign-in-popup .title {
  gap: 8px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.sign-in-popup .header-wrapper {
  gap: 12px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.sign-in-popup .text-wrapper-3 {
  position: relative;
  flex: 1;
  margin-top: -1.00px;
  font-family: var(--button-xlarge-font-family);
  font-weight: var(--button-xlarge-font-weight);
  color: #282828;
  font-size: var(--button-xlarge-font-size);
  letter-spacing: var(--button-xlarge-letter-spacing);
  line-height: var(--button-xlarge-line-height);
  font-style: var(--button-xlarge-font-style);
}

.sign-in-popup .union-wrapper {
  position: absolute;
  top: calc(50.00% - 27px);
  right: 0;
  width: 24px;
  height: 24px;
}

.sign-in-popup .img {
  position: absolute;
  top: 5px;
  left: 5px;
  width: 14px;
  height: 14px;
}

.sign-in-popup .form-rating {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  padding: 0px 0px 12px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.sign-in-popup .input-wrapper {
  gap: 8px;
  display: flex;
  flex-direction: column;
  height: 46px;
  align-items: flex-start;
  justify-content: center;
  position: relative;
  align-self: stretch;
  width: 100%;
}

.sign-in-popup .input-3 {
  height: 46px;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-color: #d0d5dd;
  display: flex;
  align-items: center;
  gap: 8px;
  position: relative;
  align-self: stretch;
  width: 100%;
}

.sign-in-popup .your-email-4 {
  font-weight: var(--text-14px-regular-font-weight);
  color: #9d9ea1;
  font-size: var(--text-14px-regular-font-size);
  line-height: var(--text-14px-regular-line-height);
  position: relative;
  flex: 1;
  margin-top: -1.00px;
  font-family: var(--text-14px-regular-font-family);
  letter-spacing: var(--text-14px-regular-letter-spacing);
  font-style: var(--text-14px-regular-font-style);
  background: transparent;
  border: none;
  padding: 0;
}

.sign-in-popup .form-input-2 {
  display: flex;
  flex-direction: column;
  height: 46px;
  align-items: flex-start;
  justify-content: center;
  position: relative;
  align-self: stretch;
  width: 100%;
}

.sign-in-popup .your-email-5 {
  font-weight: var(--text-14px-regular-font-weight);
  color: #9d9ea1;
  font-size: var(--text-14px-regular-font-size);
  line-height: var(--text-14px-regular-line-height);
  position: relative;
  flex: 1;
  margin-top: -1.00px;
  font-family: var(--text-14px-regular-font-family);
  letter-spacing: var(--text-14px-regular-letter-spacing);
  font-style: var(--text-14px-regular-font-style);
}

.sign-in-popup .input-4 {
  height: 46px;
  margin-top: -23.00px;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-color: #d0d5dd;
  display: flex;
  align-items: center;
  gap: 8px;
  position: relative;
  align-self: stretch;
  width: 100%;
}

.sign-in-popup .input-5 {
  height: 46px;
  margin-bottom: -23.00px;
  display: flex;
  align-items: center;
  gap: 8px;
  position: relative;
  align-self: stretch;
  width: 100%;
}

.sign-in-popup .span-wrapper {
  font-weight: 400;
  color: transparent;
  font-size: 14px;
  line-height: 14px;
  position: relative;
  flex: 1;
  margin-top: -1.00px;
  font-family: "Inter", Helvetica;
  letter-spacing: 0;
}

.sign-in-popup .span {
  font-weight: var(--text-14px-regular-font-weight);
  color: #262626;
  line-height: var(--text-14px-regular-line-height);
  font-family: var(--text-14px-regular-font-family);
  font-style: var(--text-14px-regular-font-style);
  letter-spacing: var(--text-14px-regular-letter-spacing);
  font-size: var(--text-14px-regular-font-size);
}

.sign-in-popup .options {
  position: relative;
  align-self: stretch;
  width: 100%;
  height: 22px;
}

.sign-in-popup .stay-signd-in {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  position: relative;
  top: calc(50.00% - 11px);
}

.sign-in-popup .text-wrapper-4 {
  position: relative;
  width: fit-content;
  margin-top: -1.00px;
  font-family: var(--text-14px-regular-font-family);
  font-weight: var(--text-14px-regular-font-weight);
  color: #475467;
  font-size: var(--text-14px-regular-font-size);
  letter-spacing: var(--text-14px-regular-letter-spacing);
  line-height: var(--text-14px-regular-line-height);
  white-space: nowrap;
  font-style: var(--text-14px-regular-font-style);
}

.sign-in-popup .buttons {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 12px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.sign-in-popup .button-2 {
  all: unset;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 28px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
  background-color: #282828;
  border-radius: 6px;
}

.sign-in-popup .get-started-2 {
  position: relative;
  width: fit-content;
  margin-top: -1.00px;
  font-family: var(--button-small-font-family);
  font-weight: var(--button-small-font-weight);
  color: #ffffff;
  font-size: var(--button-small-font-size);
  text-align: center;
  letter-spacing: var(--button-small-letter-spacing);
  line-height: var(--button-small-line-height);
  white-space: nowrap;
  font-style: var(--button-small-font-style);
}