#chat-page #container { height: 100%; } #chat-page #chat-title { background: #f8f8f8; } #chat-page #messages { background: #fff; height: 100%; list-style: none; text-shadow: 0 1px 1px #ddd; width: 100%; } #chat-page #messages li { border-bottom: 1px solid #f0f0f0; min-height: 40px; padding: 10px; position: relative; } #chat-page #messages li:hover > span .time { opacity: 0.3; } #chat-page #messages li img { border: 3px solid #fff; -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2), 0 0 40px rgba(0, 0, 0, 0.06) inset; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2), 0 0 40px rgba(0, 0, 0, 0.06) inset; position: absolute; top: 7px; right: 7px; height: 40px; width: 40px; } #chat-page #messages li p { line-height: 1.5; width: 90%; } #chat-page #messages li footer { font-size: 9pt; padding-right: 50px; text-align: right; } #chat-page #messages li footer span { color: #d8d8d8; margin-right: 0.5em; text-shadow: none; } #chat-page #messages li footer .author::before { content: '\2014 '; } #chat-page #message-form { background: #f8f8f8; border-top: 1px solid #dfdfdf; height: 50px; position: absolute; bottom: 0; width: 100%; } #chat-page #message { display: block; position: relative; left: 10px; top: 10px; width: 428px; } #chat-page #roster, #chat-page #notifications { height: 100%; list-style: none; text-shadow: 0 1px 1px #fff; width: 260px; } #chat-page #roster li, #chat-page #notifications li { cursor: pointer; border-bottom: 1px solid #ddd; font-weight: bold; min-height: 42px; padding: 0 10px; position: relative; -moz-transition: background 0.3s; -o-transition: background 0.3s; -webkit-transition: background 0.3s; transition: background 0.3s; } #chat-page #notifications li { font-weight: normal; padding: 10px 0 0 0; } #chat-page #roster li:hover:not(.selected), #chat-page #notifications li:hover { background: rgba(255, 255, 255, 1.0); } #chat-page #roster li.offline > * { opacity: 0.4; } #chat-page #roster li.selected > * { opacity: 1.0; } #chat-page #roster li.selected .status-msg { color: rgba(255, 255, 255, 0.85); } #chat-page #roster .status-msg { display: block; font-size: 11px; font-weight: normal; line-height: 11px; } #chat-page #roster .unread { background: #319be7; background: -moz-linear-gradient(#319be7, #1b78d9); background: -o-linear-gradient(#319be7, #1b78d9); background: -webkit-gradient(linear, left top, left bottom, from(#319be7), to(#1b78d9)); border-radius: 30px; color: #fff; display: inline-block; font-size: 11px; font-weight: normal; line-height: 15px; padding: 0px 6px; position: absolute; right: 50px; top: 14px; text-shadow: none; } #chat-page #roster .vcard-img { background: #fff; border: 1px solid #fff; -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2), 0 0 40px rgba(0, 0, 0, 0.06) inset; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2), 0 0 40px rgba(0, 0, 0, 0.06) inset; height: 32px; width: 32px; position: absolute; top: 4px; right: 10px; } #chat-page #charlie-controls { text-align: right; } #chat-page #edit-contact-jid { color: #444; margin-top: -5px; }