.b-sales-form {
    width  : 650px;
    margin : 0 auto;
}

.b-sales-form__group {
    display       : block;
    margin-bottom : 20px;
}

.b-sales-form__group--nomargin {
    margin-bottom : 0;
}

.b-sales-form__radio-group {
    display         : flex;
    justify-content : space-between;
    padding         : 5px 0;
}

.b-sales-form__hint {
    display     : block;
    margin      : 0 0 5px;
    color       : #000;
    font-size   : 16px;
    font-weight : bold;
}

.b-sales-form__star {
    color       : #f85752;;
    font-weight : 600;
}

/*Доп стили для формы с вопросами*/

/*Класс для скрытия элемента из дизайна, но оставим доступным их содержимое*/
.b-visually-hidden:not(:focus):not(:active),
input[type="radio"].b-visually-hidden {
    position    : absolute;
    width       : 1px;
    height      : 1px;
    padding     : 0;
    border      : 0;
    margin      : -1px;
    white-space : nowrap;
    clip-path   : inset(100%);
    clip        : rect(0 0 0 0);
    overflow    : hidden;
}

.b-radio-box {
    display     : flex;
    align-items : center;
    position    : relative;
}

.b-radio-box__input.disabled + svg,
.b-radio-box__input[disabled] + svg,
.b-radio-box__input.disabled ~ .b-radio-box__text,
.b-radio-box__input[disabled] ~ .b-radio-box__text,
.b-radio-box__input.disabled + svg path.outer,
.b-radio-box__input[disabled] + svg path.outer {
    cursor : not-allowed;
}

.b-radio-box__input.disabled + svg path,
.b-radio-box__input[disabled] + svg path {
    stroke     : #dfdfdf;
    transition : none;
}

.b-radio-box svg {
    fill           : none;
    vertical-align : middle;
    cursor         : pointer;
}

.b-radio-box svg circle {
    stroke-width : 2;
    stroke       : #dfdfdf;
}

.b-radio-box svg path {
    stroke : #55c57a;
}

.b-radio-box svg path.inner {
    stroke-width      : 6;
    stroke-dasharray  : 19;
    stroke-dashoffset : 19;
}

.b-radio-box svg path.outer {
    stroke-width      : 2;
    stroke-dasharray  : 57;
    stroke-dashoffset : 57;
}

.b-radio-box__input[type="radio"]:checked + svg path {
    transition : all 200ms ease-in-out;
}

.b-radio-box__input[type="radio"]:checked + svg path.inner {
    stroke-dashoffset : 38;
    transition-delay  : 100ms;
}

.b-radio-box__input[type="radio"]:checked + svg path.outer {
    stroke-dashoffset : 0;
}

.b-radio-box__text {
    display        : inline-block;
    vertical-align : middle;
    padding-left   : 5px;
    cursor         : pointer;
}

.b-sales-form__textarea {
    height : 160px;
    resize : none;
}

.b-sales-form__input,
.b-sales-form__textarea {
    font-size        : 15px;
    font-family      : inherit;
    color            : inherit;
    box-sizing       : border-box;
    padding          : 15px 20px;
    border-radius    : 2px;
    background-color : rgba(255, 255, 255, 1);
    width            : 100%;
    display          : block;
    border           : 1px solid #dfdfdf;
    border-bottom    : 3px solid #dfdfdf;
    transition       : all 300ms;
}

.b-sales-form__input:focus:invalid {
    border-bottom : 3px solid #ff7730;
}

.b-sales-form__input:focus,
.b-sales-form__textarea:focus {
    outline       : none;
    box-shadow    : 0 10px 20px rgba(0, 0, 0, 0.1);
    border-bottom : 3px solid #55c57a;
}

.b-sales-form__btn {
    width           : 100%;
    padding         : 13px 65px;
    font-size       : 20px;
    border-radius   : 3px;
    font-weight     : 400;
    color           : #fff;
    display         : inline-block;
    text-decoration : none;
    border          : none;
    cursor          : pointer;
}

.b-sales-form__btn--success {
    background : #55c57a;
}

.b-sales-form__btn:hover {
    background : #3f925a;
    transition : all 200ms;
}

.b-sales-form__btn.disabled,
.b-sales-form__btn[disabled] {
    background   : #e6e6e6;
    color        : #333;
    border-color : rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
}

.b-sales-form__btn-wrapper {
    margin : 15px 0 25px;
}

.b-sales-form__btn-wrapper--medium-margin {
    margin-bottom : 20px;
}

.b-sales-form__law-checkbox {
    vertical-align : top;
}

/* Дальше переопределяем стили движка */
.b-form-widget__msg--error {
    margin : 0;
}

.b-form-widget__msg--error {
    position : absolute;
}

.b-form-widget__field--has-error {
    border-top   : 1px solid #dfdfdf !important;
    border-left  : 1px solid #dfdfdf !important;
    border-right : 1px solid #dfdfdf !important;
}

.b-form-widget__msg--error {
    padding-top        : 2px;
    font-family        : 'Roboto', sans-serif;
    animation-duration : 900ms;
    animation-name     : slidein;
    transition         : all 500ms;
}


@keyframes slidein {
    from {
        transform : translateY(-40px);
        z-index   : -1;
        opacity   : 0;
    }

    95% {
        transform : translateY(0);
        z-index   : 1;
    }
}

/* TOOLTIP */

.b-help-tip {
    text-align       : center;
    background-color : #dfdfdf;
    border-radius    : 50%;
    width            : 20px;
    height           : 20px;
    font-size        : 14px;
    margin-left      : 4px;
    cursor           : help;
}

.b-help-tip:before {
    content     : '?';
    font-weight : bold;
    color       : #fff;
}

.b-help-tip:hover .b-help-tip__text {
    display           : block;
    transform-origin  : 100% 0;
    -webkit-animation : fadeIn 300ms ease-in-out;
    animation         : fadeIn 300ms ease-in-out;

}

.b-help-tip__text {
    display          : none;
    text-align       : left;
    background-color : #1e2021;
    padding          : 20px;
    width            : 300px;
    position         : absolute;
    border-radius    : 3px;
    box-shadow       : 1px 1px 1px rgba(0, 0, 0, 0.2);
    top              : 26px;
    right            : -5px;
    color            : #fff;
    font-size        : 16px;
    line-height      : 1.4;
}

.b-help-tip__text:before {
    position            : absolute;
    content             : '';
    width               : 0;
    height              : 0;
    border              : 6px solid transparent;
    border-bottom-color : #1e2021;
    right               : 10px;
    top                 : -12px;
}

/* Предотвращает скрытие всплывающей подсказки */
.b-help-tip__text:after {
    width    : 100%;
    height   : 5px;
    content  : '';
    position : absolute;
    top      : -5px;
    left     : 0;
}

@-webkit-keyframes fadeIn {
    0% {
        opacity   : 0;
        transform : scale(0.6);
    }

    100% {
        opacity   : 100%;
        transform : scale(1);
    }
}

@keyframes fadeIn {
    0% {
        opacity : 0;
    }
    100% {
        opacity : 100%;
    }
}