.chatroom{background-color:hsla(0,0%,78.4%,.9);border-bottom-left-radius:0;border-bottom-right-radius:0;border-radius:3px;box-shadow:0 0 0 2px hsla(0,0%,100%,.8);color:#343d4e;height:600px;letter-spacing:normal;max-height:90vh;overflow:hidden;width:100%}.chatroom,.chatroom *{box-sizing:border-box}.chatroom.closed{height:40px}.chatroom h3{align-items:center;background-color:#343d4e;color:#fff;cursor:pointer;display:flex;font-size:18px;font-weight:600;height:40px;justify-content:center;margin:0}.chatroom .chats{-webkit-overflow-scrolling:touch;box-sizing:border-box;height:calc(100% - 80px);margin:0;overflow-y:scroll;padding:20px}.chatroom .chats .chat{background:hsla(0,0%,100%,.8);border-radius:10px;clear:both;float:left;font-size:14px;list-style:none;margin:10px 0 0;max-width:90%;padding:5px 13px;position:relative}.chatroom .chats .chat img{max-width:100%;vertical-align:middle}.chatroom .chats .chat.left{border-bottom-left-radius:0}.chatroom .chats .chat.right{border-bottom-right-radius:0;clear:both;float:right}.chatroom .chats .chat .text{word-wrap:break-word}.chatroom .chats .chat.chat-img{padding:5px}.chatroom .chats .chat a{color:#3498db;text-decoration:none}.chatroom .chats .chat ol,.chatroom .chats .chat ul{margin:0;padding-left:1.5em}.chatroom .chats .chat ol li,.chatroom .chats .chat ul li{padding-left:0}.chatroom .chats .chat.waiting{background:transparent;margin:10px 0;padding:0}@keyframes fade{0%{opacity:1}to{opacity:.3}}.chatroom .chats .chat.waiting span{animation-direction:alternate;animation-duration:.8s;animation-iteration-count:infinite;animation-name:fade;animation-timing-function:ease-in-out;font-size:1.5em}.chatroom .chats .chat.waiting span:first-child{animation-delay:0s}.chatroom .chats .chat.waiting span:nth-child(2){animation-delay:.4s}.chatroom .chats .chat.waiting span:nth-child(3){animation-delay:.8s}.chatroom .chats .time{clear:both;color:#414141;font-size:10px;height:10px;list-style:none;margin:5px 0 20px}.chatroom .chats .time.left{float:left}.chatroom .chats .time.right{float:right}.chatroom .chats .chat-buttons{clear:both;font-size:14px;list-style:none;margin:10px 0;padding:0;position:relative;text-align:center}.chatroom .chats .chat-buttons .chat-button{background-color:#343d4e;border:2px solid #fff;border-radius:5px;color:#fff;cursor:pointer;display:inline-block;letter-spacing:normal;margin:3px;padding:5px 10px;transition:all .3s ease}.chatroom .chats .chat-buttons .chat-button.chat-button-selected,.chatroom .chats .chat-buttons .chat-button:hover{background-color:rgba(52,61,78,.6);color:#fff}.chatroom .chats .chat-buttons .chat-button.chat-button-disabled{border:2px solid grey;color:grey}.chatroom .input{align-items:center;background-color:#343d4e;display:flex;flex-direction:row;height:40px;margin:0;padding:0 5px;width:100%}.chatroom .input input[type=text]{background-color:hsla(0,0%,100%,.8);border:1px solid #fff;border-bottom-left-radius:3px;border-bottom-right-radius:0;border-right:none;border-top-left-radius:3px;border-top-right-radius:0;box-sizing:border-box;color:#343d4e;flex:4;font-size:14px;height:30px;outline:0;padding:0 5px;transition:background-color .2s ease}.chatroom .input input[type=text]:focus{background-color:#fff;box-shadow:none}.chatroom .input input[type=submit]{background:#343d4e;border:1px solid #fff;border-bottom-left-radius:0;border-bottom-right-radius:3px;border-top-left-radius:0;border-top-right-radius:3px;box-shadow:none;color:#fff;cursor:pointer;display:inline-block;flex:1;font-size:12px;font-weight:600;height:30px;line-height:1;min-width:70px;outline:none;overflow:hidden;padding:0;text-align:center;text-overflow:ellipsis;text-transform:uppercase;transition:all .3s ease;white-space:nowrap}.chatroom .input input[type=submit]:hover{background:hsla(0,0%,100%,.8)}.chatroom #speech-input{background:#343d4e;border:1px solid #fff;border-radius:3px;color:#fff;cursor:pointer;height:30px;margin-left:5px;transition:all .3s ease;width:30px}.chatroom #speech-input:hover{background:hsla(0,0%,100%,.8)}.chatroom .vertical-center{vertical-align:middle}