:root {
    --placeholder-color: #ced1d4;
    --placeholder-color-error: #f79292;

    --font-color: #979b9e;
    --font-color-hover: #030B17;
    --font-color-error: #f87878;
    --font-color-error-hover: #ff3333;

    --svgIcon-color: var(--placeholder-color);
    --svgIcon-color-hover: var(--font-color-hover);
    --svgIcon-color-error: var(--placeholder-color-error);
    --svgIcon-color-error-hover: var(--font-color-error-hover);
}

/* .inputGroup {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    flex-direction: column;
} */
.inputGroup {
    display: grid;

    grid-template-columns: 1fr;
}
.inputGroup__block {
    position: relative;

/* flex: 1; */
    flex-direction: column;
    display: flex;
    width: 100%;
    margin-bottom: 23px;
}
.inputGroup__block-terms {
    justify-content: start;
    min-width: 100%;
    padding: 5px 0;
    margin-bottom: 0!important;

    grid-column-gap: 37px;
    grid-template-columns: auto;
}

.inputGroup__wrapper {
    display: flex;
}

.input__label {
    margin-bottom: clamp(11px, 1.9vw, 20px);
    color: #00000c;
    font-size: clamp(12px, 1.4vw, 14px);
    font-weight: bold;
}
.input__label-yellow {
    color: #d6b54c;
}
.input__text {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    /* max-width: 520px; */
    width: 100%;
    height: clamp(40px, 4.4vw, 50px);
    padding: 0 clamp(14px, 1.9vw, 20px);
    color: #161d27!important;
    font-size: clamp(15px, 1.7vw, 18px);
    font-weight: 500;
    background-color: #f5f5f5;
    border: none;
    border: 1px solid #f5f5f5;
    border-radius: 2px;
    outline: none;
    transition: 500ms all;
}
.inputGroup-column {
    flex-direction: column;
    width: 100%;
}
.btnGroup {
    justify-content: initial;
}
.btnStyle:not(:last-of-type) {
    margin-right: 10px;
}
/* .selectWrap {
    display: flex;
    justify-content: space-between;
} */
.selectWrap {
    align-items: center;
    justify-content: center;
    display: grid;

    grid-gap: 20px;
    grid-template-columns: 1fr 1fr 1fr;
}
.select__drz {
    position: relative;
    display: flex;
    width: 100%;
    padding: 12px 16px;
    color: #161d27;
    font-size: 15px;
    font-weight: 500;
    -webkit-appearance: button;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: #f5f5f5;
    border: none;
    outline: none;
    user-select: auto;
}
.select__drz-2 {
    max-width: 190px;
    padding-left: 8px;
    font-size: 13px;
}
.inputGroup__wrapper .input__text {
}
.inputGroup__wrapper .select__block {
    max-width: 100px;
    margin-right: 15px;
}

.select__block {
    position: relative;
    width: 100%;
}
.select__block:before {
    position: absolute;
    top: 50%;
    right: 10px;
    z-index: 1;
    display: block;
    width: 6px;
    height: 2px;
    clear: both;
    content: '';
    background-color: #999ca0;
    transform: rotate(135deg);
}
.select__block:after {
    position: absolute;
    top: 50%;
    right: 13px;
    z-index: 1;
    display: block;
    width: 6px;
    height: 2px;
    clear: both;
    content: '';
    background-color: #999ca0;
    transform: rotate(-135deg);
}
.radioBlock__wrap {
    position: relative;
    display: block;
    padding-left: 28px;
    color: #161d27;
    font-size: clamp(15px, 1.7vw, 18px);;
    font-weight: 500;
/* margin-bottom: 12px; */
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.radioBlock__wrap-disabled {
    color: #c0c1c2!important;
}
.radioBlock__input {
    position: absolute;
    top: 5px;
    left: 0;
    cursor: pointer;
    opacity: 0;
}
.radioBlock__checkmark {
    position: absolute;
    top: 50%;
    left: 0;
    width: 17px;
    height: 17px;
    border: 2px solid #030b17;
    border-radius: 50%;
    transform: translate(0%, -50%);
}  
.radioBlock__wrap:hover .radioBlock__input:not([disabled]) ~ .radioBlock__checkmark:after {
    display: block;
}
.radioBlock__checkmark:after {
    position: absolute;
    display: none;
    content: '';
}
.radioBlock__input:checked ~ .radioBlock__checkmark:after {
    display: block;
}
.radioBlock__checkmark:after {
    top: 2px;
    left: 2px;
    width: 9px;
    height: 9px;
    background: #030b17;
    border-radius: 50%;
}
.radioBlock__input[disabled] + .radioBlock__checkmark {
    border: 2px solid #eee;
}
.radioBlock__input[disabled] + .radioBlock__checkmark:after {
    background: #cbcdcf;
}

.radioBlock {
    align-items: center;
    display: flex;
}
.radioBlock__wrap:not(:last-of-type) {
    margin-right: 30px;
}
.radioWrapper {
    margin-top: 23px;
    margin-bottom: 13px;
}
.input__textHelpful {
    margin-top: 20px;
    color: #afafaf;
    font-size: 14px;
    font-weight: 500;
}
.inputGroup__block-fullWidth {
    max-width: initial;
}
.selectWrap-2 {
    width: 100%;
}
.selectWrap-2:not(:last-of-type) {
    margin-bottom: 23px;
}
/* .inputGroup-last {
    margin-top: 23px;
} */
.input__text::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: #c0c1c2;
    font-weight: 400;
}
.input__text::-moz-placeholder {
    /* Firefox 19+ */
    color: #c0c1c2;
    font-weight: 400;
}
.input__text:-ms-input-placeholder {
    /* IE 10+ */
    color: #c0c1c2;
    font-weight: 400;
}
.input__text:-moz-placeholder {
    /* Firefox 18- */
    color: #c0c1c2;
    font-weight: 400;
}
.input__text-error:not(label) {
    background-color: #fec2c2 !important;
    border: 1px solid #ff3c3c !important;
}
.input__text-error:not(label)::-webkit-input-placeholder {
    color: #ff3c3c;
}
.input__text-error:not(label)::-moz-placeholder {
    color: #ff3c3c;
}
.input__text-error:not(label):-ms-input-placeholder {
    color: #ff3c3c;
}
.input__text-error:not(label):-moz-placeholder {
    color: #ff3c3c;
}

.inputGroup__em {
    margin-top: 10px;
}

.inputGroup__em label {
    color: #ff3c3c;
}
select.input__text {
    color: #161d27!important;
}
.input__text:disabled,
.select__drz:disabled {
    color: #c0c1c2!important;
    background-color: #f5f5f5;
}
.input__text:hover:not(:disabled) {
    color: #161d27!important;
    background-color: #f0f0f0;
}
.input__text:focus {
    color: #161d27!important;
    background-color: #f5f5f5;
    border: 1px solid #e6c96d;
}
.styledChk {
    align-items: flex-start;
    display: flex;
    cursor: pointer;
}

.styledChk__checkbox {
    width: 18px;
    height: 18px;
    min-width: 18px;
    margin-top: 2px;
    margin-right: 15px;
    border: 1px solid var(--placeholder-color);
    border-radius: 3px;
    transition: 500ms all;
}

.styledChk__label {
    padding-top: 2px;
    color: #9c9fa5;
    font-size: 14px;
    font-weight: 600;
    transition: 500ms all;
}

.visibleWrapperBlock {
    position: absolute;
    right: 0;
    top: 0;
    height: clamp(40px, 4.4vw, 50px);
}

.styledChk__label a {
    display: inline-block;
    margin: 0;
    font-size: inherit;
    font-weight: inherit;
}

.styledChk__inp[type=checkbox] {
    display: none;
}

.styledChk__inp[type=checkbox]:checked ~ .styledChk__checkbox:after {
    display: block;
    width: 10px;
    height: 10px;
    margin: 3px;
    clear: both;
    content: '';
    background-color: var(--placeholder-color);
    transition: 500ms all;
}

.styledChk__inp[type=checkbox]:disabled ~ .styledChk__checkbox {
    border: 2px solid #999;
}

.styledChk__inp[type=checkbox]:checked:disabled ~ .styledChk__checkbox:after {
    background-color: #999;
}

.styledChk__inp[type=checkbox]:disabled ~ .styledChk__label {
    color: #999;
}

.inputGroup__block:hover .styledChk__checkbox {
    border-color: var(--font-color-hover);
}

.inputGroup__block:hover .styledChk__inp[type=checkbox]:checked ~ .styledChk__checkbox:after {
    background-color: var(--font-color-hover);
}

.inputGroup__block:hover .styledChk__label,
.inputGroup__block:hover .signForm__link-gray {
    color: var(--font-color-hover);
}

.inputGroup__block:hover .styledChk__label .signForm__link-gray:before,
.inputGroup__block:hover .styledChk__label .signForm__link-gray:after {
    background-color: var(--font-color-hover);
}
/* .imgDateBlock {
    flex-direction: column-reverse;
} */
.imgDateBlock {
    grid-gap: 20px;
}
.btnStyle {
    padding: 20px 25px;
    color: #051020;
    font-weight: 800;
    text-align: center;
    text-transform: uppercase;
    background-color: #fccc2a;
    transition: 500ms all;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    cursor: pointer;
}

.btnStyle:focus {
    outline: none;
}

.btnStyle:hover,
.btn-active {
    color: #051020;
    background-color: #f1c01f;
}
.emailGroup {
    position: relative;
    margin-bottom: 0!important;
}
.emailWrap {
    margin-bottom: 0!important;
}
.addElement {
    position: absolute;
    top: -10px;
    right: 0;
    z-index: 1;
    padding: 5px 18px;
    color: #030b17;
    font-weight: 800;
    background-color: #f5f5f5;
    border-radius: 2px;
    transition: 500ms all;
    cursor: pointer;
}
.addElement:hover {
    filter: brightness(0.9);
}
.visibleBlock {
    position: absolute;
    /* top: 60px; */
    bottom: 30px;
    right: 20px;
}
.inputSvg {
    width: 16px;
    height: 10px;
    cursor: pointer;
}

.visibleBlockNotifier {
    position: absolute;
    top: 32px;
    right: -20px;
    padding: 12px;
    color: #535b65;
    font-size: 13px;
    font-weight: 500;
    line-height: 150%;
    background-color: #fff;
    border: 1px solid #eef0f9;
    border-top: 2px solid #eef0f9;
    border-radius: 2px;
    transition: 500ms;
    opacity: 0;
    z-index: 2;
}

.visibleBlockNotifier:before {
    position: absolute;
    top: -35px;
    right: 8px;
    z-index: 2;
    clear: both;
    content: '';
    border: 18px solid transparent;
    border-bottom: 18px solid #fff;
}

.visibleBlockNotifier:after {
    position: absolute;
    top: -40px;
    right: 6px;
    z-index: 1;
    clear: both;
    content: '';
    border: 20px solid transparent;
    border-bottom: 20px solid #eef0f9;
}

.visibleBlock:hover .visibleBlockNotifier {
    display: block;
    transition: 500ms;
    opacity: 1;
}

.visible .disableNotifier {
    display: none;
}

.disable .visibleNotifier {
    display: none;
}

.inputSvg.visibleSvg,
.inputSvg.disableSvg {
    display: none;
}
.visible .visibleSvg {
    display: block;
}
.disable .disableSvg {
    display: block;
}
.inputSvg.disableSvg {
    width: 17px;
    height: 18px;
}
/* .visibleBlock.disable {
    top: 56px;
} */
.inputGroup-fluid {
    display: grid;
    grid-template-columns: 1fr!important;
}

.emailGroup {
    grid-gap: 23px;
}

/* Upload File start */
.file-upload {
    width: 100%;
    margin: 20px auto;
    background-color: #fff;
}
.file-upload-content {
    display: none;
    text-align: center;
}
.file-upload-input {
    position: absolute;
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    outline: none;
    cursor: pointer;
    opacity: 0;
}
.image-upload-wrap {
    position: relative;
    align-items: center;
    justify-content: center;
    display: grid;
    height: 80px;
    background-color: #fdfbf4;
    border: 1px dashed #e0e2e4;
    transition: 500ms all;
}
.image-dropping,
.image-upload-wrap:hover {
    background-color: #fef7e0;
    border: 1px dashed #939495;
}
.image-upload-wrap-error {
    background-color: #fec2c2;
    border: 1px dashed #ff3c3c;
}
.image-upload-wrap-error:hover {
    background-color: #f0f0f0;
    border: 1px dashed #ff3c3c;
}
.image-title-wrap {
    padding: 0 15px 15px 15px;
    color: #222;
}
.drag-text {
    text-align: center;
    white-space: pre-wrap;
    overflow: hidden !important;
    text-overflow: ellipsis;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}


em.fileErrorEm {
    font-size: 14px;
    margin-top: 5px;
}


.dragText__title {
    color: #161d27;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
    max-width: 100%;
    max-height: 100%;
}
.dragText__plus {
    color: #161d27;
    font-size: 30px;
    font-weight: 800;
}
.file-upload-image {
    max-width: 200px;
    max-height: 200px;
    padding: 20px;
    margin: auto;
}
/* Upload File end */
.ownerOrder {
    width: 100%;
}

.removeFile {
    position: absolute;
    top: 0;
    right: -13px;
    width: 10px;
    height: 10px;
    cursor: pointer;
}

.removeFile:after,
.removeFile:before {
    position: absolute;
    width: 2px;
    height: 10px;
    clear: both;
    content: '';
    background-color: #f00;
}

.removeFile:after {
    transform: rotate(45deg);
}

.removeFile:before {
    transform: rotate(-45deg);
}

.feedbackForm__infoText {
    margin: 10px 0;
    color: #7b7d8a;
    font-size: 14px;
    font-weight: bold;
    line-height: 140%;
}

.dragText__title-plus {
    font-size: 26px;
    font-weight: 500;
}

.visibleBlock.disable {
    bottom: 10px;
}

.file-upload em > label {
    font-size: 11px;
    font-weight: 500;
    text-align: center;
    display: flex;
    color: #ff0000;
    margin-top: 5px;
}

.input__relative {
    position: relative;
}

.visibleBlock {
    top: 50%!important;
    transform: translate(0, -50%)!important;
    bottom: initial!important;
}

.emailGroup2 {
    grid-gap: 0!important;
}

@media(min-width: 575px) {
    .inputGroup {
        grid-gap: 20px;
        grid-template-columns: 1fr 1fr;
    }
    .inputGroup__block-fullWidth {
        grid-template-columns: 1fr;
    }
    .inputGroup-column {
        display: grid;

        grid-template-columns: 1fr;
    }
    .inputGroup-column > .inputGroup__block {
        margin-bottom: 0;
    }
    .select__drz-2 {
        padding: 12px 16px;
        font-size: 15px;
    }
    .inputGroup-dob {
        grid-gap: initial;
    }
    .select__drz {
        height: 50px;
        padding: 12px 11px;

        grid-gap: 10px;
    }

    .selectWrap {
        grid-gap: 10px;
        grid-template-columns: 1fr 2fr minmax(70px,1fr);
    }
    .image-upload-wrap {
        height: 150px;
    }
    .file-upload {
        margin: 50px auto;
    }
    .ownerOrder {
        width: 166px;
    }
    .ownerOrder .file-upload {
        margin: 0 auto;
    }
    .user_passport .inputGroup__block {
        margin-bottom: 0;
    }
    .ownerOrder .drag-text {
        max-width: 130px;
        word-wrap: break-word;
    }

    .visibleBlock.disable {
        bottom: 25px;
    }

    .radioBlock {
        height: 50px;
    }
}
@media(min-width: 768px) {
    .inputGroup__block {
        /* min-width: 300px; */
        margin-bottom: 50px;
    }
    .inputGroup-dob .input__label {
        margin-bottom: 0;
    }
    .imgDateBlock {
        flex-direction: row;
    }
    .select__drz {
        padding: 0 11px;
        font-size: 18px;
        font-weight: 500;
    }
    .select__block:before {
        right: 10px;
        width: 10px;
    }
    .select__block:after {
        right: 16px;
        width: 10px;
    }
    .radioWrapper {
        margin-top: 50px;
        margin-bottom: 40px;
    }
    .selectWrap-2 {
        flex: 1;
    }
    .selectWrap-2:not(:last-of-type) {
        margin-right: 20px;
        margin-bottom: 0;
    }
    .selectWrap {
        width: 100%;
    }
    .imgWrap {
        max-width: initial;
    }
    .select__drz-2 {
        max-width: initial;
    }
    .inputGroup-dob {
        align-content: end;
        justify-content: end;

        grid-row-gap: 20px;
    }

    .addElement {
        top: 0;
    }
}
@media(min-width: 1024px) {
    .inputGroup__block {
        min-width: 300px;
        /* max-width: 520px; */
        margin-bottom: 50px;
    }
    .selectWrap-2 {
        /* max-width: 440px;  */
        /* min-width: 520px; */
        margin-bottom: 0;
    }
    .select__drz,
    .select__drz-2 {
        padding: 0 22px;
    }
    .selectWrap {
        grid-gap: 30px;
    }
}

@media(max-width: 768px) {
    .inputGroup__block-contact .input__label {
        margin-bottom: 50px;
    }

    .inputGroup__block-contact .addElement {
        top: 25px;
    }

    .visibleBlockNotifier {
        position: absolute;
        top: 25px;
        right: -20px;
        padding: 2px;
        color: #535b65;
        font-size: 13px;
        font-weight: 500;
        line-height: 106%;
        background-color: #fff;
        border: 1px solid #eef0f9;
        border-top: 2px solid #eef0f9;
        border-radius: 2px;
        transition: 500ms;
        opacity: 0;
        z-index: 2;
    }
}
