@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700&display=swap');

.block_send_message .form-floating{
    max-width: 400px;
}
.block_send_message textarea{
    resize: none;
    width: 1040px;
    height: 190px;
}
@media(min-width:1780px){
    :root{
        --width-textbox: 1100px; 
        --height-textbox: 350px;
        --width-textarea: 1040px; 
        --height-textarea: 190px;
        --width-buttonbox: 1040px; 
        --text-align-button-box: right;
        --font-size-button: 20px;
        --min-width-button: 260px;
        --height-button: 60px;
        --width--question: 1100px;
        --show-tail: none;
        --radius-box: 12px;
    }
}
@media(min-width:1430px) and (max-width:1779px){
    :root{
        --width-textbox: 1100px; 
        --height-textbox: 350px;
        --width-textarea: 1040px; 
        --height-textarea: 190px;
        --width-buttonbox: 1040px; 
        --text-align-button-box: right;
        --font-size-button: 20px;
        --min-width-button: 260px;
        --height-button: 60px;
        --width--question: 850px;
        --show-tail: none;
        --radius-box: 12px;
    } 
}
@media(max-width:1429px){
    :root{
        --width-textbox: 678px; 
        --height-textbox: 350px;
        --width-textarea: 628px; 
        --height-textarea: 190px;
        --width-buttonbox: 628px; 
        --text-align-button-box: left;
        --font-size-button: 18px;
        --min-width-button: 260px;
        --height-button: 50px;
        --width--question: 463px;
        --show-tail: none;
        --radius-box: 12px;
    } 
}
@media(max-width:700px){
    :root{
        --width-textbox: 320px; 
        --height-textbox: 350px;
        --width-textarea: 300px; 
        --height-textarea: 190px;
        --width-buttonbox: 300px; 
        --text-align-button-box: center;
        --font-size-button: 14px;
        --min-width-button: 280px;
        --height-button: 40px;
        --width--question: 313px;
        --show-tail: inline-block;
        --radius-box: 30px;
    } 
    .block_send_message .textbox{
        margin-left: auto;
        margin-right: auto;
    }
    .block_send_message .question-user-photo, .block_send_message .strelka, .block_send_message .strelka-answer{
        display:none;
    }
    .block_send_message .question-box, .block_send_message .answer-box{
        margin-left: auto;
        margin-right: auto;
    }
}
.block_send_message{
    font-family: 'Open sans';
}

.block_send_message .textbox{
    padding-top: 30px;
    background-color: #F3F2F7;
    width: var(--width-textbox);
    height: var(--height-textbox);
    border-radius: 12px;
}
.block_send_message textarea{
    display: block;
    border:none;  
    width: var(--width-textarea);
    height: var(--height-textarea);
    margin-left: auto;
    margin-right: auto;
}

.block_send_message .button-box{
    margin-top: 30px;
    text-align: var(--text-align-button-box);
    width: var(--width-buttonbox);
    margin-left: auto;
    margin-right: auto;
}
.send_message_btn{
    border: none;
    border-radius: 6px;
    font-family: 'Open Sans';
    font-weight: 600;
    font-size: var(--font-size-button);
    min-width: var(--min-width-button);
    height: var(--height-button);
    background-color: #F7B336;
    color:#FFFFFF;
}
.block_send_message .question-user-photo{
    width: 120px;
    float: left;
}
.block_send_message .question-box{
    color:#787F95;
    min-height: 100px;
    border-radius: var(--radius-box);
    position: relative;
    width: var(--width--question);
    background-color: #F3F2F7;
    float: left;
    /* z-index: -1; */
}
.block_send_message .strelka{
    position: relative;
    width: 50px;
    height: inherit;
    padding: 0;
    margin: 0;
    text-align: right;
}
.block_send_message .strelka img {
    margin: 0;
    padding: 0;
    position: absolute;
    top: 50%;
    right:-2px ;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.block_send_message .tail {
    display: var(--show-tail);
    margin: 0;
    padding: 0;
    position: absolute;
    bottom: 0;
    right:-7px;
    /* z-index: -2; */
    -ms-transform: translateY(-5%);
    transform: translateY(-5%);
}

.block_send_message .answer-box{
    color:#FFFFFF;
    min-height: 100px;
    border-radius: var(--radius-box);
    position: relative;
    width: var(--width--question);
    background-color: #657694;
    float: left;
    /* z-index: -1; */
}
.block_send_message  .strelka-answer{
    position: relative;
    width: 50px;
    height: inherit;
    padding: 0;
    margin: 0;
    text-align: right;
}
.block_send_message .strelka-answer img {
    margin: 0;
    padding: 0;
    position: absolute;
    top: 50%;
    left:-8px ;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.block_send_message .tail-answer {
    display: var(--show-tail);
    margin: 0;
    padding: 0;
    position: absolute;
    left:-7px;
    /* z-index: -2; */
    bottom: 0;
    -ms-transform: translateY(-5%);
    transform: translateY(-5%);
}