.pageForm {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 80px 15px;
    gap: 40px;
}
.pageForm.login {
    padding: 35px 15px;
    background: linear-gradient(0deg, #FFF 0%, #EBEEF5 97.52%);
}
.pageForm .frame {
    display: flex;
    width: 100%;
    max-width: 980px;
    padding: 48px;
    justify-content: center;
    align-items: center;
    gap: 48px;
    border-radius: 20px;
    background: #FFF;
    box-shadow: 0px 16px 24px -24px rgba(17, 17, 17, 0.20);
}
.pageForm .frame .frameText {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.pageForm .frame > .frameCol {
    flex: 1 1 0;
}

.pageForm .formInfo {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    text-align: center;
    color: #6D6D6D;
}
.pageForm .formInfo.mw500 {
    max-width: 500px;
}

.pageForm .formInfo > * {
    margin: 0;
}

.pageForm .formInfo span{
    display: flex;
    padding: 8px 16px;
    justify-content: center;
    align-items: center;
    border-radius: 24px;
    border: 1px solid #D22E2E;
    color: #D22E2E;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
}
.pageForm .formInfo h1 {
    color: #111;
    font-family: var(--Lato);
    font-size: 40px;
    font-weight: 700;
}
.pageForm .formInfo h2 {
    color: #111;
}
.pageForm .formInfo a {
    text-decoration: underline;
    text-decoration-color: #d22e2e;
}
.pageForm .formInfo a:hover {
    color: #d22e2e
}

.pageForm .frame .frameText .formInfo {
    text-align: left;
    align-items: flex-start;
}

.pageForm .formLines {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    width: 100%;
    max-width: 424px;
}
.pageForm .width.w424,
.pageForm .formLines.w424 {
    width: 100%;
    max-width: 424px;
}
.pageForm .width.w640,
.pageForm .formLines.w640 {
    width: 100%;
    max-width: 640px;
}

.pageForm .line {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}

.pageForm .line .text {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.pageForm .line .text a {
    color: #FF3344;
    font-size: 16px;
    text-decoration: underline;
}
.pageForm .line .text a + a {
    margin-left: auto;
}
.pageForm .line .text.portal {
    justify-content: center;
}
.pageForm .line .text.portal a {
    text-decoration: none;
    background: #FFF1F2;
    color: #F34;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 500;
    border-radius: 6px;
}

.pageForm .line label {
    color: #6D6D6D;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    margin: 0;
}
.pageForm .line label.flex {
    display: flex;
    gap: 8px;
}
.pageForm .line label .red {
    margin-left: auto;
    color: #FF3347;
}

.pageForm .line input,
.pageForm .line select,
.pageForm .line textarea {
    display: flex;
    width: 100%;
    height: 56px;
    padding: 16px;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    border-radius: 8px;
    border: 1px solid  #E7E7E7;
    background:  #F6F6F6;
    color:  #111;
    font-size:  16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    transition-duration: .2s;
}
.pageForm .line textarea {
    height: 168px;
}

.pageForm .line input:focus,
.pageForm .line select:focus,
.pageForm .line textarea:focus {
    border-color: #4B040A;
    background: #FFF;
    box-shadow: 0px 2px 0px 0px #4B040A;
}

.pageForm .line input.not-valid {
    border-color: #F34;
}
.pageForm .line input.not-valid:focus {
    box-shadow: 0px 2px 0px 0px #F34;
}

.pageForm .line input.valid {
    border-color: #64BC26;
}
.pageForm .line input.valid:focus {
    box-shadow: 0px 2px 0px 0px #64BC26;
}
.pageForm .line .g-recaptcha {
    display: flex;
    justify-content: center;
}

.pageForm .btn {
    display: flex;
    height: 48px;
    padding: 0px 16px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    border-radius: 8px;
    background: #F34;
    color: #fff;
    text-align: right;
    font-family: var(--Lato);
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px; /* 171.429% */
    text-transform: uppercase;
    border: none;
    transition-duration: .2s;
}

.pageForm .btn:hover {
    background: rgb(228, 46, 61);
}

.pageForm .btn.loader:before {
    content:'';
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 3px solid;
    border-color: transparent;
    border-right-color: #fff;
    animation: spinner .5s infinite linear;
}

.pageForm .btn.lite {
    background: #FFF1F2;
    color: #F34;
}

.pageForm .btn.lite.loader:before {
    border-right-color: #d22e2e;
}

.pageForm .btn.lite:hover {
    background: #ffe1e3;
}

.pageForm .btn.inline {
    display: inline-flex;
    align-self: flex-start;
}

@media (max-width: 919px){
    .pageForm .frame {
        flex-direction: column;
    }
    .pageForm .frame > .frameCol {
        width: 100%;
    }
    .pageForm .frameCol .formLines {
        max-width: 100%;
    }
}

@keyframes spinner {
    to {
        transform: rotate(1turn);
    }
}

.pageForm .messages {
    opacity: 0;
    visibility: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    align-self: stretch;
    gap: 8px;
    border-radius: 16px;
    max-height: 0;
    transition: max-height 1.5s ease-out;
    overflow: hidden;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    text-align: center;
    float: none;
}

.pageForm .messages > * {
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    text-align: center;
    margin: 0;
}

.pageForm .messages.error {
    background: #FFF1F2;
    color: #ED1527;
}

.pageForm .messages.error  > * {
    color: #ED1527;
}


.pageForm .messages.success {
    border:1px solid #4c8d1e;
    color: #4c8d1e;
}

.pageForm .messages.success  > * {
    color: #4c8d1e;
}

.pageForm .messages.visible {
    margin-top: 24px;
    padding: 8px 16px;
    opacity: 1;
    visibility: visible;
    max-height: 500px;
    transition: max-height 1.5s ease-in;
}

.pageForm .redirecting {
    opacity: 0;
    visibility: hidden;
    max-height: 0;
    transition: max-height 1.5s ease-out;
    overflow: hidden;
    text-align: center;
    font-size: 18px;
}
.pageForm .redirecting.visible {
    margin-top: 24px;
    opacity: 1;
    visibility: visible;
    max-height: 500px;
    transition: max-height 1.5s ease-in;
}
.pageForm .line-text {
    text-align: center;
    color: #666;
}