@charset "UTF-8";

* {
    box-sizing: border-box
}

/*no look mobile*/
@media (max-width:991px) {
  /*  .hidden-md-down {
        display: none !important
    }*/
}



@font-face {
    font-family: 'Museo Sans Cyrl 900';
    src: url(fonts/MuseoSansCyrl-900Italic.eot);
    src: local("MuseoSansCyrl-900Italic"), url(fonts/MuseoSansCyrl-900Italic-1.eot) format("embedded-opentype"), url(fonts/MuseoSansCyrl-900Italic.woff2) format("woff2"), url(fonts/MuseoSansCyrl-900Italic.woff) format("woff"), url(fonts/MuseoSansCyrl-900Italic.ttf) format("truetype");
    font-weight: 700;
    font-style: italic;
    font-display: swap
}

@font-face {
    font-family: 'Museo Sans Cyrl 500';
    src: url(fonts/MuseoSansCyrl-500.eot);
    src: local("Museo Sans Cyrl 500 Regular"), local("MuseoSansCyrl-500"), url(fonts/MuseoSansCyrl-500-1.eot) format("embedded-opentype"), url(fonts/MuseoSansCyrl-500.woff2) format("woff2"), url(fonts/MuseoSansCyrl-500.woff) format("woff"), url(fonts/MuseoSansCyrl-500.ttf) format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: 'Museo Sans Cyrl 700';
    src: url(fonts/MuseoSansCyrl-700.eot);
    src: local("Museo Sans Cyrl 700 Regular"), local("MuseoSansCyrl-700"), url(fonts/MuseoSansCyrl-700-1.eot) format("embedded-opentype"), url(fonts/MuseoSansCyrl-700.woff2) format("woff2"), url(fonts/MuseoSansCyrl-700.woff) format("woff"), url(fonts/MuseoSansCyrl-700.ttf) format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: 'Museo Sans Cyrl 300';
    src: url(fonts/MuseoSansCyrl-300.eot);
    src: local("Museo Sans Cyrl 300"), local("MuseoSansCyrl-300"), url(fonts/MuseoSansCyrl-300-1.eot) format("embedded-opentype"), url(fonts/MuseoSansCyrl-300.woff2) format("woff2"), url(fonts/MuseoSansCyrl-300.woff) format("woff"), url(fonts/MuseoSansCyrl-300.ttf) format("truetype");
    font-weight: 300;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: 'Museo Sans Cyrl 900';
    src: url(fonts/MuseoSansCyrl-900.eot);
    src: local("Museo Sans Cyrl 900"), local("MuseoSansCyrl-900"), url(fonts/MuseoSansCyrl-900-1.eot) format("embedded-opentype"), url(fonts/MuseoSansCyrl-900.woff2) format("woff2"), url(fonts/MuseoSansCyrl-900.woff) format("woff"), url(fonts/MuseoSansCyrl-900.ttf) format("truetype");
    font-weight: 700;
    font-style: normal;
    font-display: swap
}


@keyframes slideme {
    0% {
        left: -30px;
        margin-left: 0
    }
    30%,
    to {
        left: 110%;
        margin-left: 80px
    }
}


.chat {
    position: fixed;
    right: 15px;
    bottom: 15px;
    border-radius: 12px;
    background: var(--main-color);
    padding: 10px;
    width: 300px;
    font-family: "Museo Sans Cyrl 300", sans-serif;
    z-index: 9999;
    --main-color: hsl(0deg 100% 40%)
}

.chat__header {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column
}

.chat__header::after,
.chat__header::before {
    content: "";
    width: 25px;
    height: 3px;
    background: #fff;
    position: absolute;
    right: 0;
    top: 10px;
    z-index: 3;
    opacity: 0
}

.chat__header::before {
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.chat__header::after {
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.chat__header-img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #fff;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center
}

.chat__header-text {
    padding-left: 10px
}

.chat__header-name {
    font-size: 18px;
    line-height: 1.2;
    font-family: "Museo Sans Cyrl 700", sans-serif
}

.chat__header-place {
    font-size: 14px
}

.chat__head {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    color: #fff;
    position: relative;
    z-index: 2;
    -ms-flex-order: 1;
    order: 1;
    background: var(--main-color)
}

.chat__head.hidden {
    z-index: 1;
    position: absolute;
    left: 0;
    top: 0;
    -ms-flex-order: 0;
    order: 0
}

.chat__hidden {
    display: none
}

.chat__inner {
    background: #fff;
    padding: 15px;
    height: 300px;
    border-radius: 8px;
    overflow-y: auto
}

.chat__inner-form {
    padding-top: 10px
}

.chat__inner-select {
    border-radius: 3px;
    padding: 5px;
    width: 48%;
    height: 30px;
    border: 1px solid #a09f9f
}

.chat__inner-select:first-child {
    margin-right: 4%
}

.chat__inner-input {
    border-radius: 3px;
    margin-top: 10px;
    padding: 5px;
    border: 1px solid #a09f9f;
    width: 100%;
    height: 30px
}

.chat__inner-send {
    background: var(--main-color);
    border-radius: 3px;
    margin: 10px auto;
    display: block;
    max-width: 100px;
    text-align: center;
    padding: 10px;
    border: none;
    font-family: "Museo Sans Cyrl 700", sans-serif
}

.chat__inner-text {
    font-size: 14px;
    text-align: center
}

.chat__inner-greeting {
    text-align: center;
    font-size: 16px;
    display: none
}

.chat__inner-greeting-icon {
    text-align: center;
    padding-top: 20px
}

.chat__inner-greeting-icon svg {
    max-width: 50px
}

.chat__answer {
    margin-top: 10px;
    position: relative
}

.chat__answer-send {
    position: absolute;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: var(--main-color);
    right: 5px;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    border: none;
    outline: 0 !important;
    padding: 0
}

.chat__answer-send::before {
    content: "";
    width: 10px;
    height: 10px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-70%, -50%) rotate(45deg);
    transform: translate(-70%, -50%) rotate(45deg)
}

.chat__answer-send:disabled {
    opacity: .8;
    box-shadow: none !important;
    top: 4px;
    -ms-transform: none;
    transform: none
}

.chat__textarea {
    resize: none;
    height: 34px;
    width: 100%;
    outline: 0 !important;
    border: none;
    border-radius: 17px;
    padding: 9px 40px 9px 10px
}



.chat__header {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column
}

.chat__header::after,
.chat__header::before {
    content: "";
    width: 25px;
    height: 3px;
    background: #fff;
    position: absolute;
    right: 0;
    top: 10px;
    z-index: 3;
    opacity: 0;
    transition: all .3s;
    cursor: pointer
}

.chat__header::before {
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.chat__header::after {
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.chat__header.active {
    padding-bottom: 10px
}

.chat__header.active::after,
.chat__header.active::before {
    opacity: 1
}

.chat__header-img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #fff;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center
}

.chat__header-text {
    padding-left: 10px
}

.chat__header-name {
    font-size: 18px;
    line-height: 1.2;
    font-family: "Museo Sans Cyrl 700", sans-serif
}

.chat__header-place {
    font-size: 14px
}

.chat__header.hidden {
    display: none
}

.chat__header.visible {
    position: absolute;
    bottom: 100%;
    left: 0;
    width: 100%
}

.chat__head {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    color: #fff;
    cursor: pointer;
    transition: all .4s linear;
    position: relative;
    z-index: 2;
    -ms-flex-order: 1;
    order: 1;
    background: var(--main-color);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.chat__head.hidden {
    z-index: 1;
    position: absolute;
    left: 0;
    top: 0;
    -ms-flex-order: 0;
    order: 0
}

.chat__head.hover {
    position: relative;
    padding-bottom: 10px
}

.chat__answer-send.loading::before,
.chat__hidden,
.full-screen-banner-with-image__label br {
    display: none
}

.chat__inner {
    background: #fff;
    padding: 15px;
    height: 300px;
    border-radius: 8px;
    overflow-y: auto
}

.chat__inner-form {
    padding-top: 10px
}

.chat__inner-select {
    border-radius: 3px;
    padding: 5px;
    width: 48%;
    height: 30px;
    border: 1px solid #a09f9f
}

.chat__inner-select:first-child {
    margin-right: 4%
}

.chat__inner-input {
    border-radius: 3px;
    margin-top: 10px;
    padding: 5px;
    border: 1px solid #a09f9f;
    width: 100%;
    height: 30px
}

.chat__inner-send {
    background: var(--main-color);
    border-radius: 3px;
    margin: 10px auto;
    display: block;
    max-width: 100px;
    text-align: center;
    padding: 10px;
    cursor: pointer;
    border: none;
    font-family: "Museo Sans Cyrl 700", sans-serif
}

.chat__inner-text {
    font-size: 14px;
    text-align: center
}

.chat__inner-greeting {
    text-align: center;
    font-size: 16px;
    display: none
}

.chat__inner-greeting-icon {
    text-align: center;
    padding-top: 20px
}

.chat__inner-greeting-icon svg {
    max-width: 50px
}

.chat__message {
    width: 95%;
    margin-bottom: 10px;
    padding: 10px 15px 11px;
    border-radius: 12px;
    position: relative;
    z-index: 1;
    line-height: 1.2;
    font-size: 14px
}

.chat__message_from {
    margin-left: 0;
    margin-right: auto;
    background: #e7e7e7
}

.chat__message_to {
    margin-right: 0;
    margin-left: auto;
    background: #adadad;
    word-wrap: break-word;
    border: 2px solid transparent
}

.chat__message-container {
    position: relative
}

.chat__message:focus {
    outline: none;
    border-color: #414141
}

.chat__typing {
    font-size: 14px
}

.chat__typing-point {
    opacity: 0
}

.chat__typing-point:first-child {
    animation: point1 1s ease-in infinite
}

.chat__typing-point:nth-child(2) {
    animation: point2 1s ease-in infinite
}

.chat__typing-point:nth-child(3) {
    animation: point3 1s ease-in infinite
}

.chat__answer {
    margin-top: 10px;
    position: relative
}

.chat__answer-send {
    position: absolute;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: var(--main-color);
    right: 5px;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    border: none;
    outline: none !important;
    cursor: pointer;
    padding: 0
}

.chat__answer-send::before {
    content: "";
    width: 10px;
    height: 10px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-70%, -50%) rotate(45deg);
    transform: translate(-70%, -50%) rotate(45deg);
    transition: all .3s
}

.chat__answer-send:hover {
    box-shadow: 0 0 5px var(--main-color)
}

.chat__answer-send:disabled {
    opacity: .8;
    box-shadow: none !important;
    cursor: auto;
    top: 4px;
    -ms-transform: none;
    transform: none
}

.chat__answer-send.loading::after {
    content: " ";
    display: block;
    width: 13px;
    height: 13px;
    margin: 3px;
    cursor: auto;
    border-radius: 50%;
    border: 3px solid #fff;
    border-color: #fff transparent;
    animation: lds-dual-ring 1.2s linear infinite
}

.chat__textarea {
    resize: none;
    height: 34px;
    width: 100%;
    outline: none !important;
    border: none;
    border-radius: 17px;
    padding: 9px 40px 9px 10px;
    transition: all .3s
}

.chat__textarea:focus {
    box-shadow: 0 0 5px var(--main-color) inset
}

.chat__textarea.active {
    height: 100px
}

.chat__textarea.error {
    box-shadow: 0 0 10px #fe5633 inset
}

.chat__edit {
    position: absolute;
    background: #fff;
    border-radius: 8px;
    padding: 2px 5px;
    font-size: 10px;
    bottom: -10px;
    right: 5px;
    box-shadow: 0 2px 5px #b4b0b0;
    cursor: pointer;
    color: #515151;
    z-index: 2
}

.chat__input {
    border: none;
    outline: none !important;
    padding: 5px 10px;
    border-radius: 8px;
    margin-top: 10px
}

.chat__submit {
    display: block;
    margin: 10px auto 0;
    cursor: pointer;
    border-radius: 30px;
    background: #fff;
    border: 2px solid #c2bbbb;
    outline: none !important;
    padding: 10px 15px
}

@keyframes point1 {
    0%,
    90% {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

@keyframes point2 {
    30%,
    90% {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

@keyframes point3 {
    60%,
    90% {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

@keyframes lds-dual-ring {
    0% {
        transform: rotate(0deg)
    }
    to {
        transform: rotate(360deg)
    }
}

