body, html {
    font-family: "Montserrat", sans-serif
}

.form-data .form-group, .login .form-group {
    position: relative
}

.form-data .form-group .help-block, .login .form-group .help-block {
    font-size: 12px;
    margin-top: -5px
}

.form-data .form-group.has-error .help-block, .login .form-group.has-error .help-block {
    color: #ed7e20;
    display: block
}

.form-data .form-group.has-error label, .login .form-group.has-error label {
    color: #ed7e20
}

.form-data .form-group.has-error .form-control, .login .form-group.has-error .form-control {
    color: #ed7e20;
    border: solid 2px #ed7e20
}

.form-data .form-group label, .login .form-group label {
    font-weight: normal;
    color: #747c8f;
    font-size: 12px;
    float: left;
    position: absolute;
    top: 5px;
    left: 13px
}

.form-data .form-group label.-without-input, .login .form-group label.-without-input {
    display: block;
    float: unset;
    position: unset;
    margin-bottom: 24px
}

.form-data .form-control, .login .form-control {
    height: 50px;
    line-height: 1.29;
    padding-top: 20px;
    padding-bottom: 0;
    border: solid 1px #ed7e20;
    color: #ed7e20;
    margin-bottom: 8px;
    -webkit-box-shadow: none;
    box-shadow: none
}

.form-data .form-control:focus, .login .form-control:focus {
    border: solid 2px #ed7e20;
    -webkit-box-shadow: 0 8px 14px 0 rgba(141, 117, 115, 0.2);
    box-shadow: 0 8px 14px 0 rgba(141, 117, 115, 0.2);
    padding-left: 11px
}

.form-data {
    border-radius: 5px;
    border: solid 1px #d5bfbd;
    background: white;
    padding: 32px;
    width: calc(100vw - 180px)
}

.form-data .form-control {
    max-width: 315px
}

.input-almost-hide {
    opacity: 0;
    position: fixed;
    left: 0;
    right: 0;
    width: 5px;
    height: 0px;
    cursor: unset
}

.btn-onthego {
    color: white;
    background-color: #ed7e20;
    border: 1px solid #ed7e20
}

.btn-onthego:hover {
    color: white;
    background-color: #A7352B
}

.btn-onthego-white {
    color: #d5bfbd;
    background-color: white;
    border: 1px solid #d5bfbd
}

.btn-onthego-white:hover {
    color: #d5bfbd;
    background-color: white
}

.btn {
    text-transform: uppercase;
    text-decoration: none;
    border-radius: 24px;
    padding: 14px 32px;
    font-weight: bold
}

.btn.-t-space {
    margin-top: 16px
}

.btn.-r-space {
    margin-right: 16px
}

.btn.-b-space {
    margin-bottom: 16px
}

.btn.-l-space {
    margin-left: 16px
}

.c-btn-actions {
    background: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
    position: absolute
}

.btn-copy {
    background: transparent;
    border-radius: 24px;
    padding: 12px;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 1px solid #d5bfbd;
    position: relative;
    top: -56px;
    right: -324px;
    color: #d5bfbd;
    outline: none
}

.custom-toggle {
    margin: 20px 0 0;
    color: #8d7573
}

.custom-toggle .text {
    padding-left: 4px;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.27
}

.switch {
    position: relative;
    display: inline-block;
    width: 49px;
    height: 24px;
    outline: none
}

.switch input {
    opacity: 0;
    width: 0;
    height: 0
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #f8f6f5;
    border: 1px solid #d5bfbd;
    -webkit-transition: .4s;
    -o-transition: .4s;
    transition: .4s;
    outline: none
}

.slider:before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: 1px;
    bottom: 1px;
    background-color: white;
    border: 1px solid #d5bfbd;
    -webkit-transition: .4s;
    -o-transition: .4s;
    transition: .4s;
    outline: none
}

input:checked + .slider {
    background-color: #ed7e20;
    border: 1px solid #ed7e20
}

input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px)
}

.slider.round {
    border-radius: 34px
}

.slider.round:before {
    border-radius: 50%
}

.login {
    background: #f8f6f5
}

.login .logo {
    width: 161.7px;
    height: 50px;
    -o-object-fit: contain;
    object-fit: contain
}

.login header {
    padding: 35px;
    margin-bottom: 55px
}

.login .main {
    background: url(../img/bg-login.png) top right no-repeat;
    background-size: contain;
    min-height: 700px;
    margin-bottom: 72px
}

.login footer .list-title {
    display: block;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.25;
    color: #36393d
}

.login footer .list-links {
    padding-left: 0;
    margin-bottom: 64px;
    list-style: none
}

.login footer .list-links li {
    font-size: 12px;
    line-height: 2.25
}

.login footer .list-links li a {
    color: #747c8f
}

.login footer .copyright {
    padding: 32px 0 16px;
    font-size: 12px;
    line-height: 1.25;
    color: #747c8f
}

.login footer .copyright a {
    color: #747c8f;
    text-decoration: underline
}

.form-login {
    max-width: 550px;
    min-height: 600px;
    margin: 0 auto
}

.form-login .title {
    font-size: 28px;
    font-weight: 600;
    line-height: 1.21;
    color: #36393d;
    display: block;
    margin: 4px 0 12px
}

.form-login .box-login {
    background-color: white;
    padding: 120px 120px 64px;
    -webkit-box-shadow: 0 8px 14px 0 rgba(141, 117, 115, 0.2);
    box-shadow: 0 8px 14px 0 rgba(141, 117, 115, 0.2);
    border-radius: 5px;
    min-height: 550px
}

.form-login .box-login .subtitle {
    font-size: 18px;
    line-height: 1.21;
    color: #36393d;
    margin-bottom: 8px;
    font-weight: bold;
    display: block
}

.form-login .box-login .subtitle.-bottom-space {
    font-size: 16px;
    margin-bottom: 32px
}

.form-login .box-login .login-actions {
    font-size: 12px
}

.form-login .box-login .login-actions .remember-password {
    float: left
}

.form-login .box-login .login-actions .forgot-password {
    float: right
}

.form-login .box-login .login-actions .forgot-password a {
    display: inline-block;
    margin-top: 10px;
    margin-bottom: 10px;
    text-decoration: underline;
    color: #36393d
}

.form-login .box-login .spacing-box {
    margin: 100px 0 32px
}

.form-login .box-login .login-faq {
    font-size: 12px;
    line-height: 2
}

.form-login .box-login .login-faq a {
    color: #747c8f;
    display: block
}

.form-login .box-login .login-faq a span {
    text-decoration: underline
}

.form-login .box-login .login-faq a:hover {
    text-decoration: none
}

@media (min-width: 768px) {
    .login footer .copyright .info {
        text-align: left
    }

    .login footer .copyright .social {
        text-align: center
    }

    .login footer .copyright .social a {
        margin: 0 8px;
        display: inline-block
    }

    .login footer .copyright .terms {
        text-align: right
    }
}

@media (max-width: 767px) {
    .login header {
        padding: 35px 15px;
        margin-bottom: 0
    }

    .login .main {
        min-height: 420px
    }

    .login footer .logo {
        margin-bottom: 24px
    }

    .login footer .col-sm-6 {
        padding-left: 0;
        padding-right: 0
    }

    .login footer .list-links {
        margin-bottom: 24px
    }

    .login footer hr {
        margin: 5px
    }

    .login footer .copyright {
        padding: 15px;
        margin-bottom: 24px
    }

    .login footer .copyright .info, .login footer .copyright .social, .login footer .copyright .terms {
        margin-bottom: 16px
    }

    .form-login {
        min-height: 420px
    }

    .form-login .title {
        padding: 0 15px;
        margin-bottom: 15px
    }

    .form-login .box-login {
        padding: 15px;
        border-radius: 0
    }

    .form-login .box-login .spacing-box {
        margin: 24px 0
    }
}

@media (max-width: 1279px) {
    .login .main {
        background: unset
    }
}

.app header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 42px;
    display: block;
    border-bottom: 1px solid #d5bfbd;
    -webkit-box-shadow: 0 3px 6px 0 rgba(142, 117, 115, 0.18);
    box-shadow: 0 3px 6px 0 rgba(142, 117, 115, 0.18);
    overflow: hidden;
    background: white;
    z-index: 30
}

.app header .logo {
    width: 68px;
    height: 43px;
    line-height: 42px;
    border-right: 1px solid #d5bfbd;
    text-align: center;
    display: block;
    float: left
}

.app header .app-body {
    width: calc(100% - 68px);
    height: 42px;
    text-align: center;
    float: left
}

.app header .step-next, .app header .step-prev {
    display: inline-block
}

.app header .step-next button, .app header .step-prev button {
    width: 142px;
    height: 42px;
    background: transparent;
    border: none;
    outline: none;
    text-transform: uppercase;
    color: #d5bfbd;
    padding: 0;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer
}

.app header .step-next button:hover, .app header .step-prev button:hover {
    background-color: #ed7e20;
    color: white
}

.app header .step-next button:disabled, .app header .step-prev button:disabled {
    cursor: unset;
    background: transparent;
    color: #d5bfbd
}

.app header .step-next button:disabled:hover, .app header .step-prev button:disabled:hover {
    background: transparent;
    color: #d5bfbd
}

.app header .step-prev {
    float: left;
    border-right: 1px solid #d5bfbd
}

.app header .step-next {
    float: right;
    border-left: 1px solid #d5bfbd
}

.app header .app-breadcrumb {
    display: inline-block
}

.app header .app-breadcrumb ol {
    margin-bottom: 0
}

.app header .app-breadcrumb ol li {
    line-height: 39px;
    color: #d5bfbd;
    padding: 0;
    font-size: 14px;
    font-weight: bold;
    margin: 0 16px 0 24px;
    border-bottom: 2px solid white
}

.app header .app-breadcrumb ol li.active {
    color: #ed7e20;
    border-bottom: 2px solid #ed7e20
}

.app aside {
    min-height: 510px;
    position: fixed;
    top: 42px;
    left: 0;
    background: white;
    width: 68px;
    height: calc(100vh - 42px);
    border-right: 1px solid #d5bfbd;
    float: left;
    z-index: 30
}

.app aside ul {
    text-align: center;
    width: 68px;
    padding: 0;
    list-style: none
}

.app aside .top {
    position: absolute;
    top: 0
}

.app aside .top ul {
    margin: 75px 0
}

.app aside .top ul li {
    padding: 24px 0
}

.app aside .bottom {
    position: absolute;
    bottom: 0
}

.app aside .bottom .bottom-options {
    margin: 16px 0
}

.app aside .bottom .bottom-options ul {
    margin: unset
}

.app aside .bottom .bottom-options li {
    padding: 8px 0
}

.app aside .bottom .bottom-options li li {
    padding: unset
}

.app aside .bottom .avatar {
    width: 32px;
    height: 32px;
    margin: 0 auto;
    border-radius: 16px
}

.app aside .bottom .a-btn-actions {
    background: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none
}

.app aside .bottom .dropdown-menu {
    top: 0;
    left: 60px
}

.app {
    background: #f8f6f5
}

.app .main {
    position: absolute;
    top: 42px;
    left: 68px;
    z-index: 10
}

.app .powered-by {
    position: fixed;
    bottom: 30px;
    right: 30px;
    z-index: 50
}

@media (max-width: 1439px) {
    .app .powered-by {
        display: none
    }
}

a:active, a:focus, a:hover {
    cursor: pointer
}

.app .company {
    width: calc(100vw - 180px);
    margin: 32px 56px 100px
}

.app .company .title {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.2;
    color: #36393d;
    margin-bottom: 24px
}

.app .company .archived {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.19;
    color: #36393d;
    margin-bottom: 24px
}

.app .company .c-grid.-archived .c-item {
    opacity: .5
}

.app .company .c-grid.-archived .c-item:hover {
    opacity: 1
}

.app .company .c-item {
    float: left;
    width: 210px;
    height: 210px;
    -webkit-box-shadow: 0 8px 14px 0 rgba(213, 191, 189, 0.2);
    box-shadow: 0 8px 14px 0 rgba(213, 191, 189, 0.2);
    border: solid 1px #d5bfbd;
    border-radius: 5px;
    background-color: white;
    padding: 36px 24px 24px;
    margin-bottom: 20px;
    margin-right: 20px;
    text-align: center;
    position: relative
}

.app .company .c-item a, .app .company .c-item a:focus, .app .company .c-item a:hover {
    color: #36393d
}

.app .company .c-item a img {
    margin: 0 auto 24px;
    width: 55px;
    height: 55px;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 100%
}

.app .company .c-item strong {
    display: block
}

.app .company .c-item .amount {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.17;
    color: #36393d;
    display: block;
    margin-top: 8px
}

.app .company .c-item .last {
    font-size: 12px;
    line-height: 1.17;
    color: #8d7573;
    display: block;
    margin-top: 8px
}

.app .company .c-plus a, .app .company .c-plus a:focus, .app .company .c-plus a:hover {
    color: #d5bfbd
}

.app .company .c-btn-actions {
    background: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
    position: absolute;
    right: -15px;
    top: -25px
}

.app .company .search {
    margin: 3px auto;
    text-align: center
}

.app .company .search .form-control {
    min-width: 340px;
    z-index: -1;
    margin-left: -30px;
    padding-left: 45px;
    border-color: #d5bfbd;
    color: #8d7573
}

.app .company .search .form-control:placeholder-shown {
    color: #d5bfbd
}

.app .company .search .form-control:focus {
    border: solid 2px #ed7e20;
    -webkit-box-shadow: 0 8px 14px 0 rgba(141, 117, 115, 0.2);
    box-shadow: 0 8px 14px 0 rgba(141, 117, 115, 0.2)
}

.app .company .search .submit {
    border: none;
    background: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
    padding: 0;
    z-index: 1;
    position: relative;
    top: 5px;
    left: 5px
}

.app .company .search .submit:hover {
    border: none;
    background: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
    padding: none
}

.app .company .form-data .wrapper {
    min-height: 400px
}

.app .company .form-data .wrapper .second-title {
    color: #ed7e20;
    margin-bottom: 40px
}

.app .company .form-data .wrapper .row-info {
    margin-top: 20px
}

.app .company .form-data .wrapper .row-info .label-content {
    background-color: #fff
}

.app .company .form-data .img-avatar {
    position: relative;
    width: 122px;
    height: 122px;
    -o-object-fit: cover;
    object-fit: cover;
    border: 1px solid #ed7e20
}

.app .company .form-data .fake-hover {
    width: 122px;
    height: 122px;
    position: relative
}

.app .company .form-data .fake-hover:hover:after {
    content: attr(data-title);
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.5);
    color: white;
    z-index: 1000;
    width: 122px;
    height: 122px;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 100%;
    padding: 42px 24px;
    text-align: center;
    text-transform: uppercase
}

@media (max-width: 768px) {
    .app .company {
        margin: 0px 24px
    }

    .app .company .search {
        display: none !important
    }

    .app .company .form-data {
        width: calc(100vw - 116px)
    }
}

.app .report {
    width: calc(100vw - 180px);
    margin: 32px 56px 100px
}

.app .report .row {
    margin-left: 0;
    margin-right: 0
}

.app .report .card {
    width: 100%;
    max-width: 698px
}

.app .report .card-title {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.2;
    color: #36393d;
    margin-bottom: 24px
}

.app .report .highcharts-container {
    display: block;
    max-width: 100%;
    height: auto
}

.app .report .title {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.2;
    color: #36393d;
    margin-bottom: 24px
}

.app .report .title a.subtitle {
    font-size: 12px;
    color: #747c8f;
    margin: 0 10px;
    font-weight: normal
}

.app .report .title a.subtitle:active, .app .report .title a.subtitle:focus, .app .report .title a.subtitle:hover {
    text-decoration: none;
    color: #747c8f
}

.app .survey {
    width: calc(100vw - 180px);
    margin: 32px 56px 100px
}

.app .survey .title {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.2;
    color: #36393d;
    margin-bottom: 24px
}

.app .survey .title a.subtitle {
    font-size: 12px;
    color: #747c8f;
    margin: 0 10px;
    font-weight: normal
}

.app .survey .title a.subtitle:active, .app .survey .title a.subtitle:focus, .app .survey .title a.subtitle:hover {
    text-decoration: none;
    color: #747c8f
}

.app .survey .archived {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.19;
    color: #36393d;
    margin-bottom: 24px
}

.app .survey .c-grid.-archived .c-item {
    opacity: .5
}

.app .survey .c-grid.-archived .c-item:hover {
    opacity: 1
}

.app .survey .c-item {
    float: left;
    width: 210px;
    height: 210px;
    -webkit-box-shadow: 0 8px 14px 0 rgba(213, 191, 189, 0.2);
    box-shadow: 0 8px 14px 0 rgba(213, 191, 189, 0.2);
    border: solid 1px #d5bfbd;
    border-radius: 5px;
    background-color: white;
    padding: 36px 24px 24px;
    margin-bottom: 20px;
    margin-right: 20px;
    text-align: center;
    position: relative
}

.app .survey .c-item a, .app .survey .c-item a:focus, .app .survey .c-item a:hover {
    color: #36393d
}

.app .survey .c-item a img {
    margin: 0 auto 24px;
    width: 55px;
    height: 55px;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 100%
}

.app .survey .c-item strong {
    display: block
}

.app .survey .c-item .name {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.17;
    color: #36393d;
    display: block;
    margin-top: 8px
}

.app .survey .c-item .last {
    font-size: 12px;
    line-height: 1.17;
    color: #8d7573;
    display: block;
    margin-top: 8px
}

.app .survey .c-plus a, .app .survey .c-plus a:focus, .app .survey .c-plus a:hover {
    color: #d5bfbd
}

.app .survey .c-btn-actions {
    background: transparent;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
    position: absolute;
    right: -15px;
    top: -25px
}

.app .search {
    margin: 3px auto;
    text-align: center
}

.app .search .form-control {
    min-width: 340px;
    z-index: -1;
    margin-left: -30px;
    padding-left: 45px;
    border-color: #d5bfbd;
    color: #8d7573
}

.app .search .form-control:placeholder-shown {
    color: #d5bfbd
}

.app .search .form-control:focus {
    border: solid 2px #ed7e20;
    -webkit-box-shadow: 0 8px 14px 0 rgba(141, 117, 115, 0.2);
    box-shadow: 0 8px 14px 0 rgba(141, 117, 115, 0.2)
}

.app .search .submit {
    border: none;
    background: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
    padding: 0;
    z-index: 1;
    position: relative;
    top: 5px;
    left: 5px
}

.app .search .submit:hover {
    border: none;
    background: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
    padding: none
}

.app .form-data .img-avatar {
    position: relative;
    width: 122px;
    height: 122px;
    -o-object-fit: cover;
    object-fit: cover;
    border: 1px solid #ed7e20
}

.app .form-data .fake-hover {
    width: 122px;
    height: 122px;
    position: relative
}

.app .form-data .fake-hover:hover:after {
    content: attr(data-title);
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.5);
    color: white;
    z-index: 1000;
    width: 122px;
    height: 122px;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 100%;
    padding: 42px 24px;
    text-align: center;
    text-transform: uppercase
}

@media (max-width: 768px) {
    .app .survey {
        margin: 0px 24px
    }

    .app .survey .search {
        display: none !important
    }

    .app .survey .form-data {
        width: calc(100vw - 116px)
    }
}

.app .builder {
    width: calc(100% - 68px);
    margin: 90px auto 100px
}

.app .builder .builder-header {
    max-width: 1000px;
    line-height: 38px;
    margin: 0 auto 10px
}

.app .builder .builder-header img {
    vertical-align: super
}

.app .builder .builder-header .title {
    font-size: 20px;
    font-weight: 600;
    color: #36393d;
    margin: 0 10px
}

.app .builder .builder-header .subtitle {
    font-size: 12px;
    color: #747c8f;
    margin: 0 10px
}

.app .builder .builder-header .dropdown-menu {
    top: 24px
}

.app .builder .builder-area {
    max-width: 1000px;
    min-height: 579px;
    margin: 0 auto;
    border-radius: 5px;
    border: solid 1px #d5bfbd;
    background-color: white;
    padding: 35px;
    position: relative
}

.app .builder .builder-area .title {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.19;
    color: #ed7e20;
    display: block
}

.app .builder .builder-area .welcome-art {
    margin-top: 60px;
    margin-bottom: 30px
}

.app .builder .builder-area .art-step {
    margin-top: 50px;
    margin-bottom: 16px
}

.app .builder .builder-area .dots-step {
    margin-bottom: 24px
}

.app .builder .builder-area .next {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.29;
    text-align: left;
    color: #ed7e20;
    border: 1px solid #ed7e20;
    background: white;
    padding: 9px 13px;
    text-transform: uppercase;
    border-radius: 17px
}

.app .builder .builder-area .next:hover {
    text-decoration: none
}

.app .builder .builder-area.no-padding {
    padding: 0
}

.app .builder .btn {
    padding: 9px 32px;
    margin-bottom: 16px
}

.app .btn-modal {
    padding: 9px 32px;
    margin: 0 16px 0 0;
    float: right;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.25;
    background: white;
    color: #d5bfbd;
    border-radius: 24px;
    -webkit-box-shadow: 0 8px 14px 0 rgba(213, 191, 189, 0.2);
    box-shadow: 0 8px 14px 0 rgba(213, 191, 189, 0.2);
    border: solid 1px #d5bfbd
}

.app .btn-modal.active, .app .btn-modal:hover {
    outline: none;
    background: #ed7e20;
    border: solid 1px #ed7e20;
    color: white
}

.builder-flux {
    width: 680px;
    float: left
}

.builder-flux .header {
    height: 50px;
    border-bottom: 1px solid #d5bfbd
}

.builder-flux .header ol {
    margin-left: 0;
    margin-bottom: 0
}

.builder-flux .header li {
    border-bottom: 2px solid white;
    line-height: 47px;
    font-size: 12px;
    font-weight: 600;
    padding: 0 15px
}

.builder-flux .header li a {
    color: #d5bfbd
}

.builder-flux .header li.active {
    border-bottom: 2px solid #ed7e20
}

.builder-flux .header li.active a {
    color: #ed7e20
}

.builder-flux .choose-action {
    text-align: center;
    margin: 50px auto
}

.builder-flux .choose-action .btn-action {
    -webkit-box-shadow: 0 3px 6px 0 rgba(142, 117, 115, 0.18);
    box-shadow: 0 3px 6px 0 rgba(142, 117, 115, 0.18);
    outline: none;
    min-width: 200px;
    padding: 8px 16px 8px 45px;
    background: white;
    border: 1px solid #d5bfbd;
    border-radius: 5px;
    margin: 0 16px;
    font-size: 12px;
    color: #d5bfbd;
    font-weight: bold
}

.builder-flux .choose-action .btn-action img {
    vertical-align: text-top;
    margin-right: 8px
}

.builder-flux .choose-action .btn-action.active, .builder-flux .choose-action .btn-action:hover {
    border: 1px solid #ed7e20;
    color: #ed7e20
}

.builder-flux .choose-action .btn-action.btn-msg {
    background: url(../img/insert-msg.svg) 15px center no-repeat
}

.builder-flux .choose-action .btn-action.btn-msg.active, .builder-flux .choose-action .btn-action.btn-msg:hover {
    background: url(../img/insert-msg-hover.svg) 15px center no-repeat
}

.builder-flux .choose-action .btn-action.btn-question {
    background: url(../img/insert-question.svg) 15px center no-repeat
}

.builder-flux .choose-action .btn-action.btn-question.active, .builder-flux .choose-action .btn-action.btn-question:hover {
    background: url(../img/insert-question-hover.svg) 15px center no-repeat
}

.builder-flux .choose-action .or {
    font-size: 10px;
    color: #d5bfbd;
    line-height: 1.3;
    font-weight: bold
}

.builder-flux .build-flux-boxes {
    margin-top: 50px
}

.builder-flux .timeline-item:nth-last-child(-n+2):after {
    background: unset !important
}

.builder-preview .overlay-preview {
    display: none;
    z-index: 999;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.47)
}

.builder-preview .overlay-preview .overlay-title {
    width: 100%;
    padding: 8px 24px;
    background: white;
    border: 1px solid #ed7e20;
    border-bottom-color: #d5bfbd;
    border-right: none;
    margin-top: 50px;
    display: inline-block
}

.builder-preview .overlay-preview .overlay-title span {
    display: block;
    text-transform: uppercase;
    font-size: 12px;
    color: #8d7573;
    line-height: 1.25;
    font-weight: 500
}

.builder-preview .overlay-preview .area {
    width: 100%;
    background: #f8f6f5;
    border-left: 1px solid #ed7e20;
    border-bottom: 1px solid #ed7e20;
    padding: 34px 0
}

.builder-preview .overlay-preview .area label, .builder-preview .overlay-preview .area strong {
    padding: 12px 24px;
    display: block;
    background: white;
    border-bottom: 1px solid #d5bfbd;
    margin: 0;
    font-size: 14px;
    line-height: 1.29;
    color: #8d7573;
    font-weight: 500
}

.builder-preview .overlay-preview .area strong {
    padding: 24px;
    border-top: 1px solid #d5bfbd
}

.builder-preview .overlay-preview .area .user-option-small {
    margin: 24px 24px 0 24px;
    width: 278px
}

.builder-preview .open-modal {
    margin-bottom: 35px !important
}

@media (max-width: 1099px) {
    .builder-preview {
        display: none
    }
}

.builder-preview {
    width: 319px;
    height: 100%;
    float: right;
    position: absolute;
    top: 0;
    right: 0
}

.builder-preview .header {
    height: 50px;
    line-height: 50px;
    background-color: #ed7e20;
    color: white;
    border-top-right-radius: 5px
}

.builder-preview .header strong {
    font-size: 12px;
    font-weight: 600;
    padding: 0 15px
}

.builder-preview .header .btn-test {
    padding: 0;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    background-color: white;
    line-height: 25px;
    color: #ed7e20;
    padding: 0 16px;
    border-radius: 5px;
    position: absolute;
    right: 15px;
    top: 13px
}

.builder-preview .content {
    overflow: auto;
    height: calc(100% - 54px);
    border-left: 1px solid #ed7e20;
    padding: 20px 20px 54px 20px;
    font-weight: 500
}

.builder-preview .content .dots-chat {
    margin: 10px auto
}

.builder-preview .content .bot-name {
    font-size: 12px;
    line-height: 1.17;
    color: #d5bfbd;
    margin-top: 20px;
    margin-bottom: 10px;
    display: block
}

.builder-preview .content .bot-message, .builder-preview .content .bot-question {
    font-size: 14px;
    line-height: 1.38;
    color: #36393d;
    border: 1px solid #d5bfbd;
    border-radius: 24px;
    border-top-left-radius: 0;
    padding: 10px;
    margin-bottom: 10px;
    width: 90%;
    position: relative
}

.bot-message a {
    color: #36393d;
    text-decoration: none;
}

.bot-message a:hover {
    color: #36393d;
    text-decoration: underline
}

.builder-preview .content .bot-message p, .builder-preview .content .bot-question p {
    margin-bottom: 0
}

.builder-preview .content .bot-message:after, .builder-preview .content .bot-question:after {
    width: 20px;
    height: 16px;
    content: " ";
    position: absolute;
    right: -32px;
    top: 16px
}

.builder-preview .content .bot-question.-button {
    background-color: #ed7e20;
    color: white;
    border-color: #ed7e20
}

.builder-preview .content .bot-question.-button button, .builder-preview .content .bot-question.-button input {
    background: none;
    border: none;
    width: inherit;
    text-align: left
}

.builder-preview .content .bot-question.-active {
    background-color: white;
    color: #36393d;
    border-color: #ed7e20
}

.builder-preview .content .bot-question.-active button, .builder-preview .content .bot-question.-active input {
    background: none;
    border: none;
    width: inherit;
    text-align: left
}

.builder-preview .content .bot-question.-button-white {
    background-color: white;
    color: #36393d;
    border-color: #ed7e20
}

.builder-preview .content .bot-question.-button-white button, .builder-preview .content .bot-question.-button-white input {
    background: none;
    border: none;
    width: inherit;
    text-align: left
}

.builder-preview .content .bot-question.-button-white:focus, .builder-preview .content .bot-question.-button-white:hover {
    background-color: #ed7e20;
    color: white;
    border-color: #ed7e20
}

.builder-preview .content .user-name {
    font-size: 12px;
    line-height: 1.17;
    color: #d5bfbd;
    margin-top: 20px;
    margin-bottom: 10px;
    display: block;
    text-align: right
}

.builder-preview .content .user-message {
    font-size: 14px;
    line-height: 1.38;
    color: white;
    background-color: #ed7e20;
    border-radius: 24px;
    border-top-right-radius: 0;
    padding: 10px;
    margin-bottom: 10px;
    position: relative;
    float: right
}

.builder-preview .content .user-message p {
    margin-bottom: 0
}

.builder-preview .content .embed-midia {
    max-width: 278px;
    outline: none;
    margin-bottom: 10px
}

.builder-preview .content .embed-midia audio, .builder-preview .content .embed-midia canvas, .builder-preview .content .embed-midia progress, .builder-preview .content .embed-midia video {
    max-width: 278px;
    outline: none
}

.builder-preview .content .embed-gif {
    text-align: center;
    outline: none;
    margin-bottom: 10px
}

.builder-preview .content .embed-gif img {
    margin: 0 auto
}

.builder-preview .content .img-preview {
    border: 1px solid #d5bfbd;
    border-radius: 25px;
    border-top-left-radius: 0
}

.builder-preview .content .user-option-big, .builder-preview .content .user-option-small {
    width: 100%;
    border-radius: 20px;
    padding: 9px;
    margin-bottom: 10px;
    outline: none
}

.builder-preview .content .user-option-small {
    background: #ed7e20;
    border: 1px solid #ed7e20;
    color: white
}

.builder-preview .content .user-option-big {
    background: white;
    border: 1px solid #ed7e20;
    color: #ed7e20
}

.builder-preview .content .user-option-number {
    float: left;
    background: white;
    border: 1px solid #ed7e20;
    color: #ed7e20;
    width: 42px;
    border-radius: 23px;
    padding: 9px;
    margin-bottom: 10px;
    margin-right: 10px
}

.builder-preview .content .user-option-number.-active, .builder-preview .content .user-option-number.active {
    background: #ed7e20;
    border: 1px solid #ed7e20;
    color: white
}

.builder-preview .form {
    position: absolute;
    bottom: 0;
    height: 54px;
    line-height: 54px;
    background-color: #f8f6f5;
    width: 100%;
    border-bottom-right-radius: 5px;
    border-top: 1px solid #d5bfbd;
    border-left: 1px solid #d5bfbd
}

.builder-preview .form .userInput {
    line-height: 34px;
    border: solid 1px #d5bfbd;
    background-color: white;
    color: black;
    border-radius: 15px;
    border-top-right-radius: 0;
    padding: 0 12px;
    width: calc(100% - 80px);
    margin: 0 18px
}

.builder-preview .form .userInputTransfer {
    line-height: 34px;
    border: solid 1px #d5bfbd;
    background-color: white;
    color: black;
    border-radius: 15px;
    border-top-right-radius: 0;
    padding: 0 12px;
    width: calc(100% - 110px);
    margin: 0 18px
}

.builder-preview .form .userInput:active, .builder-preview .form .userInput:focus, .builder-preview .form .userInput:hover {
    outline: none
}

.builder-preview .form .userInputTransfer:active, .builder-preview .form .userInputTransfer:focus, .builder-preview .form .userInputTransfer:hover {
    outline: none
}

.builder-preview .form .userButton {
    line-height: 34px;
    color: black;
    max-width: 20%;
    position: absolute;
    right: 12px;
    bottom: 12px;
    background: none;
    border: none
}

.builder-preview .form .userFile {
    line-height: 34px;
    color: black;
    max-width: 20%;
    position: absolute;
    right: 45px;
    bottom: 12px;
    background: none;
    border: none
}

.builder-preview .form .userButton img {
    max-width: 27px
}

.builder-preview .form .userFile img {
    max-width: 27px
}

.builder-preview .form .userButton:active, .builder-preview .form .userButton:focus, .builder-preview .form .userButton:hover {
    outline: none
}

.builder-preview .form .userFile:active, .builder-preview .form .userFile:focus, .builder-preview .form .userFile:hover {
    outline: none
}

.preview-only .builder-preview {
    width: 360px;
    height: 640px
}

.preview-only .builder-preview .content {
    border-right: 1px solid #ed7e20
}

.preview-only .builder-preview .form {
    border: 1px solid #d5bfbd
}

.preview-only {
    background: #36393d;
    height: -webkit-fill-available
}

.preview-only .builder-preview {
    background: white;
    height: 100%;
    width: 100%;
    overflow: hidden
}

.preview-only .builder-preview .form, .preview-only .builder-preview .header {
    border-radius: unset
}

@media (min-width: 450px) {
    .preview-only .content .bot-message, .preview-only .content .bot-question, .preview-only .content .user-message {
        max-width: 400px
    }

    .preview-only .content .overlay-preview .area .user-option-small, .preview-only .content .user-option-small {
        max-width: 400px;
        margin: 0 auto;
        display: block
    }

    .preview-only .content .overlay-preview .area .user-option-small {
        margin: 24px auto 0
    }
}

.typing {
    position: absolute;
    width: 344px;
    bottom: 54px
}

.typing img {
    display: inline-block
}

.box {
    position: relative;
    margin-bottom: 20px
}

.box.box-bot .box-avatar {
    margin-right: 10px
}

.box.box-bot .box-msg {
    margin-left: 40px
}

.box.box-user .box-avatar {
    margin-left: 10px;
    right: 0
}

.box.box-user .box-msg {
    margin-right: 40px
}

.box .box-avatar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 32px;
    height: 32px;
    display: inline-block;
    position: absolute;
    bottom: 10px
}

.box .box-avatar-img {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    -o-object-fit: cover;
    object-fit: cover
}

.msg-without-avatar {
    margin-bottom: 30px !important
}

@media (max-width: 991px) {
    .touch-scroll-mobile {
        width: 100%;
        overflow: hidden;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        -ms-overflow-style: -ms-autohiding-scrollbar;
        max-height: 60px
    }

    .touch-scroll-mobile .horizontal-scroll-area {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        -ms-overflow-style: -ms-autohiding-scrollbar;
        min-height: -webkit-min-content;
        min-height: -moz-min-content;
        min-height: min-content;
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
        width: -webkit-min-content;
        width: -moz-min-content;
        width: min-content;
        padding: 0 15px
    }
}

.builder-preview .content.x-2 {
    height: calc(100% - 120px)
}

.builder-preview .content.x-3 {
    height: calc(100% - 136px)
}

.builder-preview .content.x-4 {
    height: calc(100% - 154px)
}

.builder-preview .form.x-2 {
    height: 76px;
    line-height: 76px
}

.builder-preview .form.x-3 {
    height: 92px;
    line-height: 92px
}

.builder-preview .form.x-4 {
    height: 108px;
    line-height: 108px
}

textarea.userInput {
    overflow-y: hidden !important;
    line-height: normal !important;
    padding: 6px 10px !important;
    margin: 10px 18px 0 !important;
    resize: none
}

textarea.userInputTransfer {
    overflow-y: hidden !important;
    line-height: normal !important;
    padding: 6px 10px !important;
    margin: 10px 18px 0 !important;
    resize: none
}

.builder-preview .content .embed-gif, .builder-preview .content .embed-midia {
    margin: 0 auto 30px !important
}

.builder-preview .content .embed-gif img, .builder-preview .content .embed-midia img {
    width: calc(100vw - 45px);
    max-width: 360px
}

.builder .input-number {
    display: inline-block;
    width: 40px
}

.builder .small-box-message {
    position: relative;
    width: 450px;
    min-height: 44px;
    border-radius: 5px;
    border: solid 1px #8d7573;
    margin: 0 auto 50px;
    padding: 12px
}

.builder .small-box-message .number-index {
    position: absolute;
    top: -10px;
    left: 47.5%;
    width: 10px;
    height: 10px;
    border: 1px solid #8d7573;
    border-radius: 50%;
    height: 21px;
    width: 21px;
    text-align: center;
    padding: 1px;
    font-size: 12px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-weight: bolder;
    background-color: #fff;
    color: #8d7573
}

.builder .small-box-message p {
    margin-bottom: 0;
    cursor: pointer;
    font-size: 12px;
    line-height: 1.25;
    font-weight: 500;
    color: #36393d
}

.builder .small-box-message p img {
    margin-right: 8px
}

.builder .small-box-message:before {
    width: 20px;
    height: 16px;
    content: " ";
    background: url(../img/insert-msg.svg) right center no-repeat;
    position: absolute;
    right: 12px;
    top: 12px
}

.builder .small-box-message:hover:before {
    background: url(../img/insert-msg-hover.svg) right center no-repeat
}

.builder .small-box-message:after {
    width: 1px;
    height: 50px;
    content: " ";
    background: url(../img/bg-timeline.png) center bottom repeat-y;
    position: absolute;
    left: 0;
    bottom: -51px;
    margin: 0 224px
}

.builder .box-message {
    position: relative;
    border: 1px solid #ed7e20;
    -webkit-box-shadow: 0 3px 6px 0 rgba(142, 117, 115, 0.18);
    box-shadow: 0 3px 6px 0 rgba(142, 117, 115, 0.18);
    max-width: 540px;
    width: 100%;
    min-height: 170px;
    margin: 0 auto 50px;
    padding: 0 32px 16px;
    border-radius: 5px
}

.builder .box-message:after {
    content: " ";
    position: absolute;
    bottom: -51px;
    background: url(../img/bg-timeline.png) center bottom repeat-y;
    height: 50px;
    width: 1px;
    margin: 0 270px;
    left: 0
}

.builder .box-message .dropdown {
    position: absolute;
    top: 0;
    right: 32px
}

.builder .box-message .dropdown .dropdown-menu {
    margin-top: 24px
}

.builder .box-message .preview-upload-audio, .builder .box-message .preview-upload-img, .builder .box-message .preview-upload-video {
    position: relative;
    display: inline-block;
    vertical-align: top;
    margin-right: 15px
}

.builder .box-message .preview-upload-audio img, .builder .box-message .preview-upload-img img, .builder .box-message .preview-upload-video img {
    max-width: 110px;
    max-height: 110px;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid #36393d;
    margin-top: 15px;
    position: relative
}

.builder .box-message .remove-upload-audio, .builder .box-message .remove-upload-img, .builder .box-message .remove-upload-video {
    width: 38px;
    height: 38px;
    background: transparent url(../img/remove-img.svg) center center no-repeat;
    background-size: cover;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
    position: absolute;
    top: 0px;
    left: -18px
}

.builder .timeline-item:last-child:after {
    content: " ";
    background: none
}

.builder .fixed-top-title {
    background-color: #ed7e20;
    color: white;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    padding: 4px 8px;
    font-size: 10px;
    font-weight: bold;
    line-height: 1.3;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: -1px auto 16px;
    cursor: pointer
}

.builder .msg-content {
    min-width: -moz-available;
    min-width: -webkit-fill-available;
    max-width: -moz-available;
    max-width: -webkit-fill-available;
    width: inherit;
    border: 1px solid #8d7573;
    border-radius: 5px;
    min-height: 50px;
    outline: none;
    padding: 8px;
    font-size: 14px;
    line-height: 1.29;
    color: #36393d;
    background-color: white
}

.builder .msg-content:-moz-placeholder, .builder .msg-content:-ms-input-placeholder, .builder .msg-content::-moz-placeholder, .builder .msg-content::-webkit-input-placeholder, .builder .msg-content:placeholder-shown {
    opacity: .5 !important;
    color: #747c8f !important;
    font-weight: 500 !important
}

.builder .counter {
    font-size: 12px;
    line-height: 1.25;
    color: #8d7573;
    text-align: right;
    float: right
}

.builder .btn-upload-img {
    background: transparent;
    border: none;
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    background: url(../img/upload-img.svg) center center no-repeat;
    background-size: contain;
    width: 22px;
    height: 16px
}

.builder .btn-upload-gif {
    background: transparent;
    border: none;
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    background: url(../img/gifs-icon.svg) center center no-repeat;
    background-size: contain;
    width: 22px;
    height: 16px
}

.builder .btn-upload-audio {
    background: transparent;
    border: none;
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    background: url(../img/upload-audio.svg) center center no-repeat;
    background-size: contain;
    width: 22px;
    height: 16px
}

.builder .btn-upload-video {
    background: transparent;
    border: none;
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    background: url(../img/upload-video.svg) center center no-repeat;
    background-size: contain;
    width: 22px;
    height: 16px
}

.builder .btn-save-msg {
    margin: 25px auto 0;
    display: block;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.25;
    background: white;
    color: #d5bfbd;
    border-radius: 24px;
    -webkit-box-shadow: 0 8px 14px 0 rgba(141, 117, 115, 0.2);
    box-shadow: 0 8px 14px 0 rgba(141, 117, 115, 0.2);
    border: solid 1px #d5bfbd
}

.builder .btn-save-msg:active, .builder .btn-save-msg:focus, .builder .btn-save-msg:hover {
    outline: none;
    background: #ed7e20;
    border: solid 1px #ed7e20;
    color: white
}

.builder .box {
    max-width: 105px;
    width: 100%;
    min-height: 128px;
    border-radius: 5px;
    border: solid 1px #d5bfbd;
    background-color: white;
    padding: 0;
    margin: 0 0 10px 10px;
    float: left;
    text-align: center;
    vertical-align: middle
}

.builder .box .img-space {
    height: 83px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.builder .box .img-space img {
    margin: 0 auto;
    float: unset;
    -o-object-fit: contain;
    object-fit: contain
}

.builder .box .img-space img.type-emoji {
    height: 31px;
    -o-object-fit: contain;
    object-fit: contain;
    margin-top: 24px
}

.builder .box .img-space img.type-numeric {
    margin-top: 32px
}

.builder .box span {
    font-size: 12px;
    text-align: center;
    color: #8d7573;
    font-weight: 600;
    margin: 0 auto;
    display: block;
    padding: 0 4px
}

.builder .box.-big {
    max-width: 220px
}

.builder .box .big-img {
    margin: 25px auto 0
}

.builder .input-option {
    margin: 25px 15px 0;
    border: solid 1px #d5bfbd;
    border-radius: 5px;
    padding: 10px;
    display: inline-block;
    width: 412px
}

.builder .input-option.-new span {
    opacity: 0.5
}

.builder .input-option label {
    top: -20px;
    position: relative;
    background: white;
    padding: 0 10px;
    font-size: 12px;
    line-height: 1.25;
    color: #8d7573
}

.builder .input-option .dropdown-option {
    position: relative;
    float: right;
    -webkit-transform: translate(-20px, -10px);
    -ms-transform: translate(-20px, -10px);
    transform: translate(-20px, -10px);
    z-index: 9999
}

.builder .input-option .dropdown-option .dropdown-menu {
    margin-top: 0px
}

.builder .input-option .form-control {
    border: solid 1px #d5bfbd
}

.builder .input-option .form-control:active, .builder .input-option .form-control:focus, .builder .input-option .form-control:hover {
    border: solid 1px #d5bfbd;
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none
}

.builder .choose-options .action {
    border: none;
    background: transparent;
    outline: none
}

.builder input[type=number]::-webkit-inner-spin-button, .builder input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

.builder span.goto {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap
}

.builder .btn-remove-go-to {
    border: none;
    background: none;
    margin-left: 10px
}

.builder .small-box-question {
    position: relative;
    width: 450px;
    min-height: 44px;
    border-radius: 5px;
    border: solid 1px #8d7573;
    margin: 0 auto 50px;
    padding: 12px
}

.builder .small-box-question .number-index {
    position: absolute;
    top: -10px;
    left: 47.5%;
    width: 10px;
    height: 10px;
    border: 1px solid #8d7573;
    border-radius: 50%;
    height: 21px;
    width: 21px;
    text-align: center;
    padding: 1px;
    font-size: 12px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-weight: bolder;
    background-color: #fff;
    color: #8d7573
}

.builder .small-box-question p {
    margin-bottom: 0;
    cursor: pointer;
    font-size: 12px;
    line-height: 1.25;
    font-weight: 500;
    color: #36393d
}

.builder .small-box-question p img {
    margin-right: 8px
}

.builder .small-box-question:before {
    width: 20px;
    height: 16px;
    content: " ";
    background: url(../img/insert-question.svg) right center no-repeat;
    position: absolute;
    right: 12px;
    top: 12px
}

.builder .small-box-question:hover:before {
    background: url(../img/insert-question-hover.svg) right center no-repeat
}

.builder .small-box-question:after {
    width: 1px;
    height: 50px;
    content: " ";
    background: url(../img/bg-timeline.png) center bottom repeat-y;
    position: absolute;
    left: 0;
    bottom: -51px;
    margin: 0 224px
}

.builder .box-question {
    position: relative;
    border: 1px solid #ed7e20;
    -webkit-box-shadow: 0 3px 6px 0 rgba(142, 117, 115, 0.18);
    box-shadow: 0 3px 6px 0 rgba(142, 117, 115, 0.18);
    max-width: 540px;
    width: 100%;
    min-height: 170px;
    margin: 0 auto 50px;
    padding: 0 32px 16px;
    border-radius: 5px
}

.builder .box-question:after {
    content: " ";
    position: absolute;
    bottom: -51px;
    background: url(../img/bg-timeline.png) center bottom repeat-y;
    height: 50px;
    width: 1px;
    margin: 0 270px;
    left: 0
}

.builder .box-question .dropdown {
    position: absolute;
    top: 0;
    right: 32px
}

.builder .box-question .dropdown .dropdown-menu {
    margin-top: 24px
}

.builder .box-question .preview-upload-audio, .builder .box-question .preview-upload-img, .builder .box-question .preview-upload-video {
    position: relative;
    display: inline-block;
    vertical-align: top;
    margin-right: 15px
}

.builder .box-question .preview-upload-audio img, .builder .box-question .preview-upload-img img, .builder .box-question .preview-upload-video img {
    max-width: 110px;
    max-height: 110px;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid #36393d;
    margin-top: 15px;
    position: relative
}

.builder .box-question .remove-upload-audio, .builder .box-question .remove-upload-img, .builder .box-question .remove-upload-video {
    width: 38px;
    height: 38px;
    background: transparent url(../img/remove-img.svg) center center no-repeat;
    background-size: cover;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
    position: absolute;
    top: 0px;
    left: -18px
}

.builder .box-question .choose-type-answer {
    min-height: 150px;
    border-radius: 5px;
    margin-top: 24px;
    border: solid 1px #d5bfbd;
    background-color: #f8f6f5
}

.builder .box-question .choose-type-answer.-small {
    min-height: 64px;
    padding-bottom: 15px
}

.builder .box-question .choose-type-answer.-small img {
    display: inline-block;
    vertical-align: middle;
    margin: 0 15px
}

.builder .box-question .choose-type-answer.-small span {
    font-size: 11px;
    font-weight: 500;
    line-height: 1.27;
    color: #ed7e20
}

.builder .box-question .choose-type-answer.-small .change-question-type {
    text-align: right;
    color: #8d7573;
    margin: 5px 15px 0;
    cursor: pointer
}

.builder .box-question .choose-type-answer .title {
    font-size: 12px;
    line-height: 1.25;
    color: #8d7573;
    background: white;
    top: -10px;
    display: inline-block;
    position: relative;
    padding: 0 10px;
    margin-left: 15px
}

.builder .box-question .choose-type-answer strong {
    color: #36393d;
    font-size: 14px;
    line-height: 1.21;
    padding: 26px 0;
    display: block
}

.builder .box-question .choose-type-answer.-additionally {
    margin-top: 20px
}

.builder .box-question .choose-type-answer .choose-options {
    min-height: 150px
}

.builder .box-question .choose-type-answer .choose-options.-small {
    min-height: 64px;
    padding-bottom: 15px
}

.builder .timeline-item:last-child:after {
    content: " ";
    background: none
}

.builder .fixed-top-title {
    background-color: #ed7e20;
    color: white;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    padding: 4px 8px;
    font-size: 10px;
    font-weight: bold;
    line-height: 1.3;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: -1px auto 16px;
    cursor: pointer
}

.builder .msg-content {
    min-width: -moz-available;
    min-width: -webkit-fill-available;
    max-width: -moz-available;
    max-width: -webkit-fill-available;
    width: inherit;
    border: 1px solid #8d7573;
    border-radius: 5px;
    min-height: 50px;
    outline: none;
    padding: 8px;
    font-size: 14px;
    line-height: 1.29;
    color: #36393d
}

.builder .msg-content:-moz-placeholder, .builder .msg-content:-ms-input-placeholder, .builder .msg-content::-moz-placeholder, .builder .msg-content::-webkit-input-placeholder, .builder .msg-content:placeholder-shown {
    opacity: .5 !important;
    color: #747c8f !important;
    font-weight: 500 !important
}

.builder .counter, .builder .counter-input {
    font-size: 12px;
    line-height: 1.25;
    color: #8d7573;
    text-align: right;
    float: right
}

.builder .go-to-info {
    font-style: normal;
    font-size: 12px;
    line-height: 1.25;
    color: #A7352B;
    text-align: left;
    float: left
}

.builder .btn-upload-img {
    background: transparent;
    border: none;
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    background: url(../img/upload-img.svg) center center no-repeat;
    background-size: contain;
    width: 22px;
    height: 16px;
    margin: 0 5px 0 5px
}

.builder .btn-upload-gif {
    background: transparent;
    border: none;
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    background: url(../img/gifs-icon.svg) center center no-repeat;
    background-size: contain;
    width: 22px;
    height: 16px
}

.builder .btn-upload-audio {
    background: transparent;
    border: none;
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    background: url(../img/upload-audio.svg) center center no-repeat;
    background-size: contain;
    width: 22px;
    height: 16px
}

.builder .btn-upload-video {
    background: transparent;
    border: none;
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    background: url(../img/upload-video.svg) center center no-repeat;
    background-size: contain;
    width: 22px;
    height: 16px
}

.builder .btn-save-question {
    margin: 25px auto 0;
    display: block;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.25;
    background: white;
    color: #d5bfbd;
    border-radius: 24px;
    -webkit-box-shadow: 0 8px 14px 0 rgba(141, 117, 115, 0.2);
    box-shadow: 0 8px 14px 0 rgba(141, 117, 115, 0.2);
    border: solid 1px #d5bfbd
}

.builder .btn-save-question:active, .builder .btn-save-question:focus, .builder .btn-save-question:hover {
    outline: none;
    background: #ed7e20;
    border: solid 1px #ed7e20;
    color: white
}

@media (max-width: 1099px) {
    .app .builder {
        margin: 10px auto 100px
    }
}

@media (max-width: 1099px) {
    .builder-flux {
        width: 100%
    }
}

@media (max-width: 1099px) {
    .preview-only .builder-preview {
        display: block;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

    .preview-only .builder-preview .header {
        border-top-right-radius: unset
    }

    .preview-only .builder-preview .footer {
        border-bottom-right-radius: unset
    }
}
