/*-------------------------------*/
/*-----------Новый Чат---------------*/
/*-------------------------------*/


#ourchat input:focus, #ourchat textarea:focus{outline:none;}
#ourchat a img {border:none; outline:none;}
#ourchat textarea#chat_msg_area {outline:none;  }
#ourchat #chat_msg_area::-webkit-input-placeholder { font-family: 'Roboto', sans-serif; font-size: 16px; font-weight:300; line-height:140%;}


.ourchat {display:none; position:fixed; top:90px; right:20px; z-index:1000000000000000000000000000000000000000000000000;}
#ourchatfon {position:absolute;top:0;left:0;bottom:0;right:0;}


#ourchatwrapper {position:relative;background: white; height: 80vh; padding:0; max-width: 440px; width: 100%;box-shadow:rgba(0, 0, 0, 0.3) 0px 7px 40px 2px;border-radius: 10px;overflow: hidden;}


#ourchatwrappertop {position:relative;background: #3D5AFE; padding: 16px;font-size: 20px;line-height:100%;font-weight:400;color: #fff;}
#ourchatwrappertop span {display:block;font-size:12px;line-height: 1.2rem;color: rgb(255 255 255 / 70%);font-weight:400;margin-top: 8px;}
.chatmenu {position:absolute;right: 16px;top: 16px;cursor:pointer;font-size:25px;transition: all .3s ease-in-out;}
.chatmenu:hover {transform: scale(1.1);}


#ourchatwrappermiddle {min-height:350px; max-height:65vh; overflow:auto; padding: 16px;scrollbar-width: none;-webkit-overflow-scrolling: touch;-ms-overflow-style: none;}
#ourchatwrappermiddle::-webkit-scrollbar {display: none;}
#ourchatwrappermiddle h3 {color: #858282; display: block; margin: 0 0 16px;font-size: 14px;text-align:center;font-weight:400;}
.youmeschat {text-align:left;max-width: calc(100% - 60px);margin:0; text-align:left;}
.meschatin {display:inline-block;border-radius: 8px 0 8px 8px;padding: 10px 16px;position:relative;font-size: 16px;max-width: 440px;padding-bottom: 20px;}
.youmeschat .meschatin {background: #f7f7f7;color: #000000;padding: 16px; font-size: 15px;line-height:20px;border-radius:0 8px 8px 8px;font-family: inherit;}
.mymeschat .meschatin {background: #ebefff;margin: 16px 0 16px auto; display: block;max-width: calc(100% - 60px);}
.youmeschat .meschatin span.chattimesend, .mymeschat .meschatin span.chattimesend {position:absolute;right: 18px;bottom: 9px;color:rgba(0,0,0,0.25);font-size:10px;font-weight:600;line-height:100%;}
.mymeschat .meschatin span {}
.meschattext {text-align:left; margin: 8px 0 16px;}
.meschattext p {margin: 0;font-size: inherit;line-height: inherit;}
.meschattext a {color: #3D5AFE;; text-decoration: underline;}
.meschattext a:hover {text-decoration: none;color: #3D5AFE;}


.repchattext {text-align:left; border-left:2px solid rgba(70,180,130,1); padding: 0 0 0 5px; font-size:80%; margin-left:-15px;}


#ourchatwrapperbot {position:absolute;width: 100%;bottom: 0; background:rgba(255,255,255,0.9); padding:1px;}
#ourchatwrapperbot textarea {background: rgb(245 246 250) !important;border:none !important;min-height: 52px !important;height: 52px;display:block !important;min-width:100%;max-width:100%;font-family: 'Roboto', sans-serif;font-weight: 400;line-height: 140%;padding: 16px 114px 12px 24px !important;font-size: 16px !important;box-sizing:border-box;}
#ourchatwrapperbot .chataddfile {position:absolute;right: 16px;bottom:5px;width:50px;height:38px;transition: all 0.2s ease;cursor:pointer;font-size:20px;color: #2e4dfb;border-radius:3px; background-image: url(/lnd/images/plane.svg);  background-position: center;  background-repeat: no-repeat;  background-size: contain; opacity:0.8; color:transparent; font-size:0;}
#ourchatwrapperbot .chataddfile:hover {-webkit-transition: All 0.2s ease;  opacity:1; background-color:rgba(0,0,0,0.06);}
#ourchatwrapperbot .chataddfile i {position:absolute; top:50%; margin-top:-10px; right:15px;}


#ourchatwrapperbot .filelabel {position:absolute;right: 84px;bottom:9px;background:rgba(0,0,0,0);-webkit-transition: All 0.2s ease;cursor:pointer;padding:0 0px;}
#ourchatwrapperbot .filelabel input {display:none;}
#ourchatwrapperbot .filelabel i {cursor:pointer; font-size:22px; color:rgba(0,0,0,0.3); transform: scale(1, -1);}
#ourchatwrapperbot .filelabel:hover i{color:rgba(0,0,0,0.6);}


@media screen and (max-width: 600px) {
.ourchat {display:none; position:fixed; top:0; left:0; bottom:0; right:0; z-index:1000000000000000000000000000000000000000000000000;}
#ourchatfon {background: rgb(2 9 19 / 65%);}
#ourchatwrapper {margin:0 auto;position:absolute;top: 40px;left: 12px;bottom: 20px;width: auto;    min-width: auto;right: 12px;}
#ourchatwrappertop {box-sizing: border-box;font-size: 20px;}
#ourchatwrappertop span {font-size: 14px;}
#ourchatwrappermiddle {min-height: auto;max-height:none;}
#ourchatwrapperbot {position:absolute; right:0; left:0; bottom:0;}


#ourchatwrapperbot .chataddfile {height:35px;}




}


#ourchatwrapper .userOutput {
 font-size: 15px;
 font-weight: 400;
 line-height: 20px;
 margin: 0;
 padding: 0;
 white-space: pre-wrap;
 font-family: inherit;
}


#ourchatwrapperbot textarea::placeholder {
 font-size: 16px !important;
 line-height: 140%;
}


.youmeschat .meschatin span.chattimesend {
 right: auto;
 right: 16px;
 bottom: 16px;
 color: rgb(0 0 0 / 60%);
 font-size: 10px;
 font-weight: 400;
}


@media screen and (max-width: 400px) {
 .youmeschat .meschatin,
 #ourchatwrapper .userOutput {
   font-size: 15px;
   line-height: 20px;
 }
}


#ourchatwrappermiddle::-webkit-scrollbar {
 width: 10px;
 background-color: #f9f9fd;
}


#ourchatwrappermiddle::-webkit-scrollbar-thumb {
 border-radius: 10px;
 background-color: #b7b7b7;
}


#ourchatwrappermiddle::-webkit-scrollbar-track {
 -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.2);
 border-radius: 10px;
 background-color: #f9f9fd;
}

