.needFieldSpan { background-color: tomato; float: left; display: none; align-self: self-start; }
.removed-from-site { background-color: #c0c0c0; }
.invalidFieldSpan { background-color: darkorange; display: none; align-self: self-start; }
.valid-input { border: solid 1px #2b8ff1; }
.invalid-input { border: solid 1px red; }
#noSMSPhoneNumberSpan { background-color: darkorange; float: left; display: none;  padding: 4px; }
.input__val .checkedFieldIcon { position: absolute; height: 20px; width: auto; float: left; display: none; margin: 0 !important; }
.input__val_name { margin-top: 50px; }

@media (min-width: 992px) {
    .checkedFieldIcon { left: 14px; top: 9px }
}

@media (max-width: 991px) {

    .input__row { position: relative; }
}

@media (min-width: 767px) and (max-width: 991px) {
    .checkedFieldIcon { position: absolute; left: 2px; top: 33px; }
}

@media (max-width: 767px) {
    .input__val { position: unset; }
    .checkedFieldIcon { right: 2px; top: 32px; }

    .log__page__wrapper .input__wrapper { margin: 0 auto 15px; }

    .input__row { margin: 0 auto; }
}

/*============================= 20201218 krakoss Выбор ГОРОДА=============*/

.region____wrapper { width: 100%; height: 100%; position: fixed; top: 0; bottom: 0; left: 0; right: 0; background-color: white; z-index: 100; -webkit-transition: 400ms ease-out transform, 400ms ease-out opacity,700ms z-index; -o-transition: 400ms ease-out transform, 400ms ease-out opacity,700ms z-index; transition: 400ms ease-out transform, 400ms ease-out opacity,700ms z-index; }
    .region____wrapper.closed { opacity: 0; -webkit-transform: translateX(200px); -ms-transform: translateX(200px); transform: translateX(200px); z-index: -1; }

@media (min-width: 767px) {
    .region____wrapper { position: absolute; width: 320px; height: 450px; top: 100%; left: 47%; border: 2px solid #14355d; line-height: 20px; }
}

.region____header { background-color: #f1f3f5; position: relative; width: 100%; z-index: 4; color: #14355d; font-size: 12px; font-weight: 700; text-transform: uppercase; padding: 10px 0px 10px 30px; }
    .region____header .close____btn---reg { position: absolute; right: 20px; top: 6px; width: 16px; height: 16px; cursor: pointer; }
        .region____header .close____btn---reg::after, .region____header .close____btn---reg::before { content: ''; position: absolute; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; height: 2px; border-radius: 1px; top: 50%; left: 50%; -webkit-transform: translate(50%, 50%); -ms-transform: translate(50%, 50%); transform: translate(50%, 50%); background-color: #01305c; }
        .region____header .close____btn---reg::after { -webkit-transform: translate(50%, 50%) rotate(45deg); -ms-transform: translate(50%, 50%) rotate(45deg); transform: translate(50%, 50%) rotate(45deg); }
        .region____header .close____btn---reg::before { -webkit-transform: translate(50%, 50%) rotate(-45deg); -ms-transform: translate(50%, 50%) rotate(-45deg); transform: translate(50%, 50%) rotate(-45deg); }
.region____content { height: 93%; }
.region____content---list---wrapper { padding: 8px 27px; background-color: white; height: 100%; overflow-y: auto; scrollbar-face-color: #2b8ff1; z-index: 1; }
.region____content---list---title { color: #017bf2; font-size: 14px; font-weight: 700; line-height: 32px; }
.region____content---list---ul { list-style: none; padding: 5px 24px; margin: 10px; }
    .region____content---list---ul:last-of-type { margin-bottom: 20px; }
.region____content---list---li .region---first---level { color: #14355d; margin-bottom: 16px; font-size: 12px; font-weight: 400; text-decoration: none; cursor: pointer; }
    .region____content---list---li .region---first---level:hover { color: #2b8ff1; text-decoration: none; }
    .region____content---list---li .region---first---level.selected---region { color: #2b8ff1; text-decoration: underline; }
.region____content---list---li---ul { list-style: none; line-height: 10px; }
.region____content---list---li---ul---li { color: #14355d; margin-bottom: 5px; margin-top: 10px; font-size: 11px; font-weight: 400; cursor: pointer; }
    .region____content---list---li---ul---li:hover { color: #2b8ff1; text-decoration: underline; }
    .region____content---list---li---ul---li.selected---region { color: #2b8ff1; text-decoration: underline; }

@media (min-width: 767px) {
    .region____content { height: 91%; }
}

.off { display: none; }

/*===========================// 20201217 krakoss Выбор Города=============*/
/*========================== 20230929 krakoss Выбор SMS =============*/
.input__wrapper .profile-input-smscode { margin-left: 10px; min-width: 60px; text-align: center; border: 1px solid #DEE4E9; border-radius: 0; color: #727a83; font-size: 12px; font-weight: 400; width: 100%; height: 36px; padding-left: 0px; -webkit-transition: 400ms ease-out border-color; -o-transition: 400ms ease-out border-color; transition: 400ms ease-out border-color; }
    .input__wrapper .profile-input-smscode::-webkit-input-placeholder { color: #9a9ea9; font-size: 12px; font-weight: 400; }
    .input__wrapper .profile-input-smscode::-moz-placeholder { color: #9a9ea9; font-size: 12px; font-weight: 400; }
    .input__wrapper .profile-input-smscode:-ms-input-placeholder { color: #9a9ea9; font-size: 12px; font-weight: 400; }
    .input__wrapper .profile-input-smscode::placeholder { color: #9a9ea9; font-size: 12px; font-weight: 400; }
    .input__wrapper .profile-input-smscode:focus { border-color: #2b8ff1; }
    .input__wrapper .profile-input-smscode:invalid { border-color: #e60f6f; }
    .input__wrapper .profile-input-smscode:hover { border-color: #2b8ff1; }
#smsCode.errors-sms-code { border-color: #f60f08; }

.profile__edit-wrapper .profile__edit-item .profile-input-smscode { margin-left: 10px; min-width: 60px; text-align: center; border: 1px solid #DEE4E9; border-radius: 0; color: #727a83; font-size: 12px; font-weight: 400; width: 100%; height: 36px; padding-left: 0px; -webkit-transition: 400ms ease-out border-color; -o-transition: 400ms ease-out border-color; transition: 400ms ease-out border-color; }
    .profile__edit-wrapper .profile__edit-item .profile-input-smscode::-webkit-input-placeholder { color: #9a9ea9; font-size: 12px; font-weight: 400; }
    .profile__edit-wrapper .profile__edit-item .profile-input-smscode::-moz-placeholder { color: #9a9ea9; font-size: 12px; font-weight: 400; }
    .profile__edit-wrapper .profile__edit-item .profile-input-smscode:-ms-input-placeholder { color: #9a9ea9; font-size: 12px; font-weight: 400; }
    .profile__edit-wrapper .profile__edit-item .profile-input-smscode::placeholder { color: #9a9ea9; font-size: 12px; font-weight: 400; }
    .profile__edit-wrapper .profile__edit-item .profile-input-smscode:focus { border-color: #2b8ff1; }
    .profile__edit-wrapper .profile__edit-item .profile-input-smscode:invalid { border-color: #e60f6f; }
    .profile__edit-wrapper .profile__edit-item .profile-input-smscode:hover { border-color: #2b8ff1; }
#smsCode.errors-sms-code { border-color: #f60f08; }
.profile-sms-btn { line-height: 36px; display: inline-block; padding: 0px 20px; background-color: #899AAE; max-height: 36px; font-size: 14px; color: #FFFFFF; font-weight: 700; text-transform: uppercase; -webkit-transition: 400ms ease-out background-color; -o-transition: 400ms ease-out background-color; transition: 400ms ease-out background-color; border: none; width: 160px; min-width: 160px; max-width: 160px; }
    .profile-sms-btn:hover { color: white; text-decoration: none; background-color: #2b8ff1; }
    .profile-sms-btn:disabled { background-color: #899AAE; }

    .profile-input-smscode.toggle-content { display: none; }
    .profile-input-smscode.toggle-content.is-visible { display: block; }
.profile-sms-btn.toggle-content { display: none; }
    .profile-sms-btn.toggle-content.is-visible { display: block; color: #fff; }

.flex-container { display: flex; }
.number-attempts { color: #14355d; font-size: 13px; font-weight: 400; position: relative; height: 40px; text-align: left; width: 100%; }
.my-number-attempts { color: #14355d; font-size: 13px; font-weight: 400; }
#label-my-number-attempts {height: 38px; }
@media (max-width: 767px) {
    .flex-container { padding-top: 12px; }
    .profile-input-smscode { width: 60px; min-width: 60px; }
    #label-my-number-attempts {height: 1px; }
}
/*========================== // 20230929 krakoss Выбор SMS =============*/