.chat{position:fixed;top:40px;right:0;width:320px;height:calc(100vh - 40px);color:#f2f2f2;border-left:1px solid #eee;overflow:hidden;z-index:1}.chat .show-more{margin:10px 0}.chat .show-more button{padding:2px 8px;font-size:1.4rem}.chat .chat-header{padding:4px;height:38px;display:grid;grid-template-columns:repeat(2,1fr);align-items:center}.chat .members-online{position:relative;align-items:center;justify-self:end;padding:0 5px;height:28px}.chat .members-online .item{display:inline-block;position:relative;width:28px;height:28px;background:url(/static_files/noavatar.svg) 50% no-repeat;background-size:28px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 5px 0 rgba(0,0,0,.25);overflow:hidden}.chat .members-online .item img{width:100%;min-height:100%;-o-object-fit:cover;object-fit:cover}.chat .icon-voice{display:inline-block;position:relative;margin-top:-4px;width:28px;height:28px;background:#999 url(/static_files/icons/voice.svg) 50% no-repeat;background-size:12px;border-radius:50%;cursor:pointer;transform:rotateY(180deg);transition:background .2s ease}.chat .icon-voice.active,.chat .icon-voice:hover{background:#1d8df2 url(/static_files/icons/voice.svg) 50% no-repeat;background-size:12px}.chat .icon-mute{display:inline-block;position:relative;margin-top:-4px;width:28px;height:28px;background:#999 url(/static_files/icons/mute.svg) 50% no-repeat;background-size:12px;border-radius:50%;cursor:pointer;transition:background .2s ease}.chat .icon-mute.active,.chat .icon-mute:hover{background:#e00a1e url(/static_files/icons/mute.svg) 50% no-repeat;background-size:12px}.chat .film-share{height:30px;cursor:pointer}.chat .film-share input{position:absolute;left:-9999px}.chat .film-share span{padding:4px 8px;font-size:1.4rem;color:#1da1f2;border:1px solid #1da1f2;border-radius:4px;transition:all .2s ease}.chat .film-share span:hover{color:var(--color);border:1px solid var(--color)}.chat .film-share span b{color:var(--color)}.chat .members-list{position:absolute;padding:10px;width:100%;height:60%;font-size:1.4rem;background-color:#fff;z-index:3}.chat .members-list ul{list-style:none;max-height:calc(100% - 20px);overflow-y:auto}.chat .members-list ul li{display:block;position:relative;padding:5px;margin:5px;border:1px solid transparent}.chat .members-list ul li .modal{position:absolute;display:none;grid-template-columns:29px auto;padding:5px;top:-1px;left:-1px;background-color:#fff;border:1px solid #ccc;border-radius:5px;z-index:1}.chat .members-list ul li .modal button{margin-left:5px;padding:2px 4px;font-size:1.2rem;color:#fff;background-color:#03a9f4;border-radius:5px;border:none}.chat .members-list ul li .avatar{display:inline-block;width:24px;height:24px;border-radius:50%;vertical-align:middle;box-shadow:0 0 7px 1px rgba(0,0,0,.25);background:url(/static_files/noavatar.svg) 50% no-repeat;background-size:24px;overflow:hidden}.chat .members-list ul li .avatar img{width:100%;min-height:100%;-o-object-fit:cover;object-fit:cover}.chat .chat-login{background-color:#f1f1f1;color:#000;font-size:1.4rem;line-height:34px;text-align:center;cursor:pointer}.chat .chat-area{height:calc(100% - 44px);color:#000}.chat .chat-area .friends{height:500px;overflow-y:auto}.chat .chat-area .chat-info{position:relative;padding:5px 10px;height:30px;font-size:1.4rem;color:#000;background-color:#f1f1f1}.chat .chat-area .chat-info span{cursor:pointer}.chat .chat-area .chat-info span i{display:inline-block;width:14px;height:14px;background-size:14px;vertical-align:middle;transition:all .2s ease}.chat .chat-area .chat-info span i.share{background-image:url(/static_files/icons/share.svg)}.chat .chat-area .chat-info span i.share.active{transform:rotate(90deg)}.chat .chat-area .chat-info span i.arrow-down{background-image:url(/static_files/icons/left-chevron.svg);transform:rotate(-90deg)}.chat .chat-area .chat-info span i.arrow-down.active{transform:rotate(90deg)}.chat .chat-area .messages{list-style:none;height:calc(100% - 34px);margin:0;overflow-x:hidden;overflow-y:auto;padding:5px 0;-webkit-overflow-scrolling:touch}.chat .chat-area .messages::-webkit-scrollbar-track{width:4px;background:#fff}.chat .chat-area .messages::-webkit-scrollbar{width:4px}.chat .chat-area .messages::-webkit-scrollbar-thumb{background:#fff}.chat .chat-area .messages:hover::-webkit-scrollbar-thumb{background:#000}.chat .chat-area .messages .message{position:relative;display:grid;grid-template-columns:36px auto;grid-gap:10px;padding:5px 5px 10px;margin-bottom:5px}.chat .chat-area .messages .message.active{border-left:2px solid rgba(76,175,80,.55)}.chat .chat-area .messages .message .time{margin-top:4px;font-size:1rem;color:#999}.chat .chat-area .messages .message .quote{padding:0 5px;border-left:2px solid #d5d5d5;background-color:#f1f1f1}.chat .chat-area .messages .message .quote strong{font-size:1.4rem}.chat .chat-area .messages .message .quote p{font-size:1.4rem;word-break:break-word}.chat .chat-area .messages .message .quote .chat-emoji{width:100px}.chat .chat-area .messages .message .avatar{position:relative;margin-top:2px;width:36px;height:36px;border:2px solid #fff;border-radius:50%;box-shadow:0 0 7px 1px rgba(0,0,0,.25);background:url(/static_files/noavatar.svg) 50% no-repeat;background-size:36px;overflow:hidden}.chat .chat-area .messages .message .avatar img{display:inline-block;width:100%;min-height:100%;-o-object-fit:cover;object-fit:cover}.chat .chat-area .messages .message .body{position:relative}.chat .chat-area .messages .message .body .quote p{font-size:1.4rem}.chat .chat-area .messages .message .body .actions-btn{display:inline-block;position:relative;top:8px;width:24px;height:24px;background-image:url(/static_files/icons/menu-dots-blue.svg);background-size:24px;cursor:pointer}.chat .chat-area .messages .message .body .crown{display:inline-block;width:16px;height:16px;background-image:url(/static_files/icons/crown.svg);background-size:16px;vertical-align:middle}.chat .chat-area .messages .message .body .crown.patron{background-image:url(/static_files/icons/crown-gold.svg?1)}.chat .chat-area .messages .message .body a{font-family:Oswald,sans-serif;font-weight:700}.chat .chat-area .messages .message .body b{font-size:1.4rem}.chat .chat-area .messages .message .body b .author{text-decoration:underline;cursor:pointer}.chat .chat-area .messages .message .body .group{padding:2px 6px;font-size:1rem;border-radius:30px;text-transform:uppercase}.chat .chat-area .messages .message .body .group.bot{background-color:#b65e54;color:#fff}.chat .chat-area .messages .message .body .group.admin{background-color:#4caf50;color:#fff}.chat .chat-area .messages .message .body p{font-size:1.4rem;word-break:break-word}.chat .chat-area .messages .message .body p .chat-emoji{width:200px;height:auto}.chat .chat-area .messages .message .body .footer{display:none}.chat .chat-area .messages .message .body .footer span{font-size:1.2rem;margin-right:5px;opacity:.65;cursor:pointer;transition:opacity .2s ease}.chat .chat-area .messages .message .body .footer span:hover{opacity:1}.chat .create-message{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,auto));align-items:center;position:relative;height:34px}.chat .create-message .bot-commands{position:absolute;left:0;bottom:40px}.chat .create-message .bot-commands span{padding:2px 4px;font-size:1.2rem;background-color:#fff;border:1px solid #d5d5d5;border-radius:4px;z-index:1;cursor:pointer}.chat .create-message .quote{position:absolute;width:100%;top:-45px;color:#000;background-color:#f1f1f1;border-left:2px solid #d5d5d5;display:grid;grid-template-columns:24px auto;align-items:center}.chat .create-message .quote .cancel{display:inline-block;margin-left:5px;width:10px;height:10px;background-image:url(/static_files/icons/close.svg);background-size:10px;cursor:pointer}.chat .create-message .quote strong{font-size:1.4rem}.chat .create-message .quote p{font-size:1.4rem;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.chat .create-message .pm{position:relative;line-height:30px;margin:0 5px 0 10px;padding:0 5px;font-size:1.4rem;color:#fff;background-color:#ff1493;border-radius:4px}.chat .create-message .pm i{display:inline-block;width:8px;height:8px;background-image:url(/static_files/icons/close-dark.svg);background-size:8px;cursor:pointer}.chat .create-message .input{display:grid;position:relative;grid-template-columns:auto 20px 20px;grid-gap:10px;align-items:center;padding-right:5px}.chat .create-message .input .input-message{width:100%;height:30px;padding:0 5px 0 20px;color:#000;background-color:#f1f1f1;border:none;border-radius:4px;outline:none}.chat .create-message .input .input-message:focus{border:none}.chat .create-message .input i{display:inline-block;justify-self:center;width:20px;height:20px;opacity:.75;transition:opacity .2s ease}.chat .create-message .input i:hover{cursor:pointer;opacity:1}.chat .create-message .input i.active{opacity:1}.chat .create-message .input i.icon-message-send{background:url(/static_files/icons/send-e00a1e.svg?3) 50% no-repeat;background-size:20px}.chat .create-message .input i.icon-mic-on{background:url(/static_files/icons/mic-on.svg) 50% no-repeat;background-size:20px}.chat .create-message .input i.icon-mic-off{background:url(/static_files/icons/mic-off.svg) 50% no-repeat;background-size:20px}.chat .create-message .input i.icon-message-smile{background:url(/static_files/icons/sticker.svg) 50% no-repeat;background-size:20px}.chat .chat-smiles{position:absolute;right:0;width:100%;background-color:#fff;padding:5px;border:2px solid #f1f1f1;z-index:3}.chat .chat-smiles i.icon-close{display:inline-block;position:absolute;top:0;right:0;width:24px;height:24px;padding:12px;background:#f1f1f1 url(/static_files/icons/close.svg) 50% no-repeat;background-size:10px 10px;cursor:pointer}.chat .chat-smiles .emoji-cats{width:100%;overflow-x:auto;padding:5px;background-color:#f1f1f1}.chat .chat-smiles .emoji-cats::-webkit-scrollbar-track{height:4px;background:#fff}.chat .chat-smiles .emoji-cats::-webkit-scrollbar{height:4px}.chat .chat-smiles .emoji-cats::-webkit-scrollbar-thumb{background:#fff;border-radius:5px}.chat .chat-smiles .emoji-cats:hover::-webkit-scrollbar-thumb{background:#000}.chat .chat-smiles .emoji-cats ul{list-style:none}.chat .chat-smiles .emoji-cats ul li{display:inline-block;margin:0;width:40px;height:40px;border:1px solid #f1f1f1;border-radius:4px;overflow:hidden;cursor:pointer}.chat .chat-smiles .emoji-cats ul li.active{border:1px solid #faa200;background-color:#fff}.chat .chat-smiles .emoji-cats ul li img{width:100%;min-height:100%;-o-object-fit:cover;object-fit:cover}.chat .chat-smiles .columns{margin-bottom:5px}.chat .chat-smiles .columns span{display:inline-block;padding:4px 10px;font-size:1.2rem;border-radius:4px;color:#000;border:1px solid #d5d5d5;cursor:pointer}.chat .chat-smiles .columns span:hover{border:1px solid #1da1f2}.chat .chat-smiles .columns span.active{color:#fff;background-color:#1da1f2;border:1px solid #1da1f2}.chat .chat-smiles .emoji-list{display:grid;overflow-y:auto;height:300px}.chat .chat-smiles .emoji-list::-webkit-scrollbar-track{width:4px;background:#fff}.chat .chat-smiles .emoji-list::-webkit-scrollbar{width:4px}.chat .chat-smiles .emoji-list::-webkit-scrollbar-thumb{background:#fff}.chat .chat-smiles .emoji-list:hover::-webkit-scrollbar-thumb{background:#000}.chat .chat-smiles .emoji-list img{display:inline-block;padding:5px;width:100%;border-radius:5px;cursor:pointer;transition:opacity .2s ease}.chat .chat-smiles .emoji-list img:hover{background-color:#eee}