/*! * Converse.js (Web-based XMPP instant messaging client) * http://conversejs.org * * Copyright (c) 2012-2014, JC Brand * Licensed under the Mozilla Public License */ /* Color scheme helpers: https://coolors.co/app/264653-2a9d8f-e9c46a-f4a261-e76f51 http://paletton.com/#uid=53f0u0knsvIdILAj5Cftgu3uBmZ */ @font-face { font-family: 'Converse-js'; src: url("../fonticons/fonts/icomoon.eot?-mnoxh0"); src: url("../fonticons/fonts/icomoon.eot?#iefix-mnoxh0") format("embedded-opentype"), url("../fonticons/fonts/icomoon.woff?-mnoxh0") format("woff"), url("../fonticons/fonts/icomoon.ttf?-mnoxh0") format("truetype"), url("../fonticons/fonts/icomoon.svg?-mnoxh0#icomoon") format("svg"); font-weight: normal; font-style: normal; } .icon-conversejs { font-family: 'Converse-js'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-conversejs:before { content: "\e600"; } #conversejs .icon-address-book:before { content: "\270f"; } #conversejs .icon-angry:before { content: "\e03f"; } #conversejs .icon-attachment:before { content: "\e032"; } #conversejs .icon-away:before { content: "\25fb"; } #conversejs .icon-blocked:before { content: "\2718"; } #conversejs .icon-bold:before { content: "\e04d"; } #conversejs .icon-bubbles-2:before { content: "\e016"; } #conversejs .icon-bubbles-3:before { content: "\e017"; } #conversejs .icon-bubbles:before { content: "\e015"; } #conversejs .icon-camera-2:before { content: "\2616"; } #conversejs .icon-camera:before { content: "\e003"; } #conversejs .icon-cancel-circle:before { content: "\e058"; } #conversejs .icon-checkbox-checked:before { content: "\2611"; } #conversejs .icon-checkbox-partial:before { content: "\2b28"; } #conversejs .icon-checkbox-unchecked:before { content: "\2b27"; } #conversejs .icon-checkmark:before { content: "\2713"; } #conversejs .icon-close:before { content: "\2715"; } #conversejs .icon-closed:before { content: "\25ba"; } #conversejs .icon-cog:before { content: "\e02f"; } #conversejs .icon-cogs:before { content: "\e022"; } #conversejs .icon-confused:before { content: "\2368"; } #conversejs .icon-cool:before { content: "\e040"; } #conversejs .icon-dnd:before { content: "\e004"; } #conversejs .icon-envelop:before { content: "\2709"; } #conversejs .icon-evil:before { content: "\261f"; } #conversejs .icon-eye-blocked:before { content: "\e031"; } #conversejs .icon-eye:before { content: "\e030"; } #conversejs .icon-globe:before { content: "\e033"; } #conversejs .icon-grin:before { content: "\e041"; } #conversejs .icon-happy:before { content: "\263b"; } #conversejs .icon-headphones:before { content: "\266c"; } #conversejs .icon-heart:before { content: "\2764"; } #conversejs .icon-hide-users:before { content: "\e01c"; } #conversejs .icon-home:before { content: "\e000"; } #conversejs .icon-image:before { content: "\2b14"; } #conversejs .icon-info:before { content: "\2360"; } #conversejs .icon-info-2:before { content: "i"; } #conversejs .icon-italic:before { content: "\e04f"; } #conversejs .icon-key-2:before { content: "\e029"; } #conversejs .icon-key:before { content: "\e028"; } #conversejs .icon-lock-2:before { content: "\e027"; } #conversejs .icon-lock:before { content: "\e026"; } #conversejs .icon-logout:before { content: "\e601"; } #conversejs .icon-minus:before { content: "\e05a"; } #conversejs .icon-music:before { content: "\266b"; } #conversejs .icon-new-tab:before { content: "\e053"; } #conversejs .icon-newspaper:before { content: "\e001"; } #conversejs .icon-notebook:before { content: "\2710"; } #conversejs .icon-notification:before { content: "\e01f"; } #conversejs .icon-online:before { content: "\25fc"; } #conversejs .icon-chat:before { content: "\25fc"; } #conversejs .icon-opened:before { content: "\25bc"; } #conversejs .icon-pencil:before { content: "\270e"; } #conversejs .icon-phone-hang-up:before { content: "\260e"; } #conversejs .icon-phone:before { content: "\260f"; } #conversejs .icon-play:before { content: "\25d9"; } #conversejs .icon-plus:before { content: "\271a"; } #conversejs .icon-pushpin:before { content: "\e012"; } #conversejs .icon-quotes-left:before { content: "\e01d"; } #conversejs .icon-radio-checked:before { content: "\2b26"; } #conversejs .icon-radio-unchecked:before { content: "\2b25"; } #conversejs .icon-remove:before { content: "\e02d"; } #conversejs .icon-room-info:before { content: "\e059"; } #conversejs .icon-sad:before { content: "\2639"; } #conversejs .icon-search:before { content: "\e021"; } #conversejs .icon-shocked:before { content: "\2364"; } #conversejs .icon-show-users:before { content: "\e01e"; } #conversejs .icon-smiley:before { content: "\263a"; } #conversejs .icon-spell-check:before { content: "\e045"; } #conversejs .icon-spinner:before { content: "\231b"; } #conversejs .icon-strikethrough:before { content: "\e050"; } #conversejs .icon-thumbs-up:before { content: "\261d"; } #conversejs .icon-tongue:before { content: "\e038"; } #conversejs .icon-underline:before { content: "\e04e"; } #conversejs .icon-unlocked:before { content: "\e025"; } #conversejs .icon-user:before { content: "\e01a"; } #conversejs .icon-users:before { content: "\e01b"; } #conversejs .icon-volume-decrease:before { content: "\e04b"; } #conversejs .icon-volume-high:before { content: "\e046"; } #conversejs .icon-volume-increase:before { content: "\e04c"; } #conversejs .icon-volume-low:before { content: "\e048"; } #conversejs .icon-volume-medium:before { content: "\e047"; } #conversejs .icon-volume-mute-2:before { content: "\e04a"; } #conversejs .icon-volume-mute:before { content: "\e049"; } #conversejs .icon-warning:before { content: "\26a0"; } #conversejs .icon-wink:before { content: "\e03a"; } #conversejs .icon-wondering:before { content: "\2369"; } #conversejs .icon-wrench:before { content: "\e024"; } #conversejs .icon-xa:before { content: "\e602"; } #conversejs .icon-unavailable:before, #conversejs .icon-offline:before { content: "\e002"; } #conversejs .icon-youtube:before { content: "\e055"; } #conversejs .icon-zoom-in:before { content: "\e02b"; } #conversejs .icon-zoom-out:before { content: "\e02a"; } #conversejs [data-icon]:before { content: attr(data-icon); font-family: 'Converse-js'; font-variant: normal; font-weight: normal; line-height: 1; speak: none; text-transform: none; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #conversejs [class^="icon-"]:before, #conversejs [class*=" icon-"]:before { background-position: 14px 14px; background-image: none; font-family: 'Converse-js'; font-style: normal; font-variant: normal; font-weight: normal; width: auto; height: auto; line-height: 1; speak: none; text-transform: none; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #conversejs { /*! Pure v0.6.1-pre Copyright 2014 Yahoo! Inc. All rights reserved. Licensed under the BSD License. https://github.com/yahoo/pure/blob/master/LICENSE.md */ /*! normalize.css v^3.0 | MIT License | git.io/normalize Copyright (c) Nicolas Gallagher and Jonathan Neal */ /*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */ /** * 1. Set default font family to sans-serif. * 2. Prevent iOS and IE text size adjust after device orientation change, * without disabling user zoom. */ /** * Remove default margin. */ /* HTML5 display definitions ========================================================================== */ /** * Correct `block` display not defined for any HTML5 element in IE 8/9. * Correct `block` display not defined for `details` or `summary` in IE 10/11 * and Firefox. * Correct `block` display not defined for `main` in IE 11. */ /** * 1. Correct `inline-block` display not defined in IE 8/9. * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. */ /** * Prevent modern browsers from displaying `audio` without controls. * Remove excess height in iOS 5 devices. */ /** * Address `[hidden]` styling not present in IE 8/9/10. * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22. */ /* Links ========================================================================== */ /** * Remove the gray background color from active links in IE 10. */ /** * Improve readability of focused elements when they are also in an * active/hover state. */ /* Text-level semantics ========================================================================== */ /** * Address styling not present in IE 8/9/10/11, Safari, and Chrome. */ /** * Address style set to `bolder` in Firefox 4+, Safari, and Chrome. */ /** * Address styling not present in Safari and Chrome. */ /** * Address variable `h1` font-size and margin within `section` and `article` * contexts in Firefox 4+, Safari, and Chrome. */ /** * Address styling not present in IE 8/9. */ /** * Address inconsistent and variable font size in all browsers. */ /** * Prevent `sub` and `sup` affecting `line-height` in all browsers. */ /* Embedded content ========================================================================== */ /** * Remove border when inside `a` element in IE 8/9/10. */ /** * Correct overflow not hidden in IE 9/10/11. */ /* Grouping content ========================================================================== */ /** * Address margin not present in IE 8/9 and Safari. */ /** * Address differences between Firefox and other browsers. */ /** * Contain overflow in all browsers. */ /** * Address odd `em`-unit font size rendering in all browsers. */ /* Forms ========================================================================== */ /** * Known limitation: by default, Chrome and Safari on OS X allow very limited * styling of `select`, unless a `border` property is set. */ /** * 1. Correct color not being inherited. * Known issue: affects color of disabled elements. * 2. Correct font properties not being inherited. * 3. Address margins set differently in Firefox 4+, Safari, and Chrome. */ /** * Address `overflow` set to `hidden` in IE 8/9/10/11. */ /** * Address inconsistent `text-transform` inheritance for `button` and `select`. * All other form control elements do not inherit `text-transform` values. * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. * Correct `select` style inheritance in Firefox. */ /** * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` * and `video` controls. * 2. Correct inability to style clickable `input` types in iOS. * 3. Improve usability and consistency of cursor style between image-type * `input` and others. */ /** * Re-set default cursor for disabled elements. */ /** * Remove inner padding and border in Firefox 4+. */ /** * Address Firefox 4+ setting `line-height` on `input` using `!important` in * the UA stylesheet. */ /** * It's recommended that you don't attempt to style these elements. * Firefox's implementation doesn't respect box-sizing, padding, or width. * * 1. Address box sizing set to `content-box` in IE 8/9/10. * 2. Remove excess padding in IE 8/9/10. */ /** * Fix the cursor style for Chrome's increment/decrement buttons. For certain * `font-size` values of the `input`, it causes the cursor style of the * decrement button to change from `default` to `text`. */ /** * 1. Address `appearance` set to `searchfield` in Safari and Chrome. * 2. Address `box-sizing` set to `border-box` in Safari and Chrome. */ /** * Remove inner padding and search cancel button in Safari and Chrome on OS X. * Safari (but not Chrome) clips the cancel button when the search input has * padding (and `textfield` appearance). */ /** * Define consistent border, margin, and padding. */ /** * 1. Correct `color` not being inherited in IE 8/9/10/11. * 2. Remove padding so people aren't caught out if they zero out fieldsets. */ /** * Remove default vertical scrollbar in IE 8/9/10/11. */ /** * Don't inherit the `font-weight` (applied by a rule above). * NOTE: the default cannot safely be changed in Chrome and Safari on OS X. */ /* Tables ========================================================================== */ /** * Remove most spacing between table cells. */ /*csslint important:false*/ /* ========================================================================== Pure Base Extras ========================================================================== */ /** * Extra rules that Pure adds on top of Normalize.css */ /** * Always hide an element when it has the `hidden` HTML attribute. */ /** * Add this class to an image to make it fit within it's fluid parent wrapper while maintaining * aspect ratio. */ /*! Pure v0.6.1-pre Copyright 2014 Yahoo! Inc. All rights reserved. Licensed under the BSD License. https://github.com/yahoo/pure/blob/master/LICENSE.md */ /*csslint box-model:false*/ /* Box-model set to false because we're setting a height on select elements, which also have border and padding. This is done because some browsers don't render the padding. We explicitly set the box-model for select elements to border-box, so we can ignore the csslint warning. */ /* Need to separate out the :not() selector from the rest of the CSS 2.1 selectors since IE8 won't execute CSS that contains a CSS3 selector. */ /* Chrome (as of v.32/34 on OS X) needs additional room for color to display. */ /* May be able to remove this tweak as color inputs become more standardized across browsers. */ /* Need to separate out the :not() selector from the rest of the CSS 2.1 selectors since IE8 won't execute CSS that contains a CSS3 selector. */ /* Need to separate out the :not() selector from the rest of the CSS 2.1 selectors since IE8 won't execute CSS that contains a CSS3 selector. */ /* Need to separate out the :not() selector from the rest of the CSS 2.1 selectors since IE8 won't execute CSS that contains a CSS3 selector. */ /* Aligned Forms */ /* Rounded Inputs */ /* Grouped Inputs */ /* Inline help for forms */ /* NOTE: pure-help-inline is deprecated. Use .pure-form-message-inline instead. */ /* Block help for forms */ /*! Pure v0.6.1-pre Copyright 2014 Yahoo! Inc. All rights reserved. Licensed under the BSD License. https://github.com/yahoo/pure/blob/master/LICENSE.md */ /* Firefox: Get rid of the inner focus border */ /*csslint outline-none:false*/ /* Firefox: Get rid of the inner focus border */ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #conversejs html { font-family: sans-serif; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ } #conversejs body { margin: 0; } #conversejs article, #conversejs aside, #conversejs details, #conversejs figcaption, #conversejs figure, #conversejs footer, #conversejs header, #conversejs hgroup, #conversejs main, #conversejs menu, #conversejs nav, #conversejs section, #conversejs summary { display: block; } #conversejs audio, #conversejs canvas, #conversejs progress, #conversejs video { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ } #conversejs audio:not([controls]) { display: none; height: 0; } #conversejs [hidden], #conversejs template { display: none; } #conversejs a { background-color: transparent; } #conversejs a:active, #conversejs a:hover { outline: 0; } #conversejs abbr[title] { border-bottom: 1px dotted; } #conversejs b, #conversejs strong { font-weight: bold; } #conversejs dfn { font-style: italic; } #conversejs h1 { font-size: 2em; margin: 0.67em 0; } #conversejs mark { background: #ff0; color: #000; } #conversejs small { font-size: 80%; } #conversejs sub, #conversejs sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } #conversejs sup { top: -0.5em; } #conversejs sub { bottom: -0.25em; } #conversejs img { border: 0; } #conversejs svg:not(:root) { overflow: hidden; } #conversejs figure { margin: 1em 40px; } #conversejs hr { box-sizing: content-box; height: 0; } #conversejs pre { overflow: auto; } #conversejs code, #conversejs kbd, #conversejs pre, #conversejs samp { font-family: monospace, monospace; font-size: 1em; } #conversejs button, #conversejs input, #conversejs optgroup, #conversejs select, #conversejs textarea { color: inherit; /* 1 */ font: inherit; /* 2 */ margin: 0; /* 3 */ } #conversejs button { overflow: visible; } #conversejs button, #conversejs select { text-transform: none; } #conversejs button, #conversejs html input[type="button"], #conversejs input[type="reset"], #conversejs input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ } #conversejs button[disabled], #conversejs html input[disabled] { cursor: default; } #conversejs button::-moz-focus-inner, #conversejs input::-moz-focus-inner { border: 0; padding: 0; } #conversejs input { line-height: normal; } #conversejs input[type="checkbox"], #conversejs input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } #conversejs input[type="number"]::-webkit-inner-spin-button, #conversejs input[type="number"]::-webkit-outer-spin-button { height: auto; } #conversejs input[type="search"] { -webkit-appearance: textfield; /* 1 */ box-sizing: content-box; /* 2 */ } #conversejs input[type="search"]::-webkit-search-cancel-button, #conversejs input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } #conversejs fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } #conversejs legend { border: 0; /* 1 */ padding: 0; /* 2 */ } #conversejs textarea { overflow: auto; } #conversejs optgroup { font-weight: bold; } #conversejs table { border-collapse: collapse; border-spacing: 0; } #conversejs td, #conversejs th { padding: 0; } #conversejs .hidden, #conversejs [hidden] { display: none !important; } #conversejs .pure-img { max-width: 100%; height: auto; display: block; } #conversejs .pure-form input[type="text"], #conversejs .pure-form input[type="password"], #conversejs .pure-form input[type="email"], #conversejs .pure-form input[type="url"], #conversejs .pure-form input[type="date"], #conversejs .pure-form input[type="month"], #conversejs .pure-form input[type="time"], #conversejs .pure-form input[type="datetime"], #conversejs .pure-form input[type="datetime-local"], #conversejs .pure-form input[type="week"], #conversejs .pure-form input[type="number"], #conversejs .pure-form input[type="search"], #conversejs .pure-form input[type="tel"], #conversejs .pure-form input[type="color"], #conversejs .pure-form select, #conversejs .pure-form textarea { padding: 0.5em 0.6em; display: inline-block; border: 1px solid #ccc; box-shadow: inset 0 1px 3px #ddd; border-radius: 4px; vertical-align: middle; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #conversejs .pure-form input:not([type]) { padding: 0.5em 0.6em; display: inline-block; border: 1px solid #ccc; box-shadow: inset 0 1px 3px #ddd; border-radius: 4px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #conversejs .pure-form input[type="color"] { padding: 0.2em 0.5em; } #conversejs .pure-form input[type="text"]:focus, #conversejs .pure-form input[type="password"]:focus, #conversejs .pure-form input[type="email"]:focus, #conversejs .pure-form input[type="url"]:focus, #conversejs .pure-form input[type="date"]:focus, #conversejs .pure-form input[type="month"]:focus, #conversejs .pure-form input[type="time"]:focus, #conversejs .pure-form input[type="datetime"]:focus, #conversejs .pure-form input[type="datetime-local"]:focus, #conversejs .pure-form input[type="week"]:focus, #conversejs .pure-form input[type="number"]:focus, #conversejs .pure-form input[type="search"]:focus, #conversejs .pure-form input[type="tel"]:focus, #conversejs .pure-form input[type="color"]:focus, #conversejs .pure-form select:focus, #conversejs .pure-form textarea:focus { outline: 0; border-color: #1A9707; } #conversejs .pure-form input:not([type]):focus { outline: 0; border-color: #1A9707; } #conversejs .pure-form input[type="file"]:focus, #conversejs .pure-form input[type="radio"]:focus, #conversejs .pure-form input[type="checkbox"]:focus { outline: thin solid #1A9707; outline: 1px auto #1A9707; } #conversejs .pure-form .pure-checkbox, #conversejs .pure-form .pure-radio { margin: 0.5em 0; display: block; } #conversejs .pure-form input[type="text"][disabled], #conversejs .pure-form input[type="password"][disabled], #conversejs .pure-form input[type="email"][disabled], #conversejs .pure-form input[type="url"][disabled], #conversejs .pure-form input[type="date"][disabled], #conversejs .pure-form input[type="month"][disabled], #conversejs .pure-form input[type="time"][disabled], #conversejs .pure-form input[type="datetime"][disabled], #conversejs .pure-form input[type="datetime-local"][disabled], #conversejs .pure-form input[type="week"][disabled], #conversejs .pure-form input[type="number"][disabled], #conversejs .pure-form input[type="search"][disabled], #conversejs .pure-form input[type="tel"][disabled], #conversejs .pure-form input[type="color"][disabled], #conversejs .pure-form select[disabled], #conversejs .pure-form textarea[disabled] { cursor: not-allowed; background-color: #eaeded; color: #cad2d3; } #conversejs .pure-form input:not([type])[disabled] { cursor: not-allowed; background-color: #eaeded; color: #cad2d3; } #conversejs .pure-form input[readonly], #conversejs .pure-form select[readonly], #conversejs .pure-form textarea[readonly] { background-color: #eee; /* menu hover bg color */ color: #777; /* menu text color */ border-color: #ccc; } #conversejs .pure-form input:focus:invalid, #conversejs .pure-form textarea:focus:invalid, #conversejs .pure-form select:focus:invalid { color: #b94a48; border-color: #e9322d; } #conversejs .pure-form input[type="file"]:focus:invalid:focus, #conversejs .pure-form input[type="radio"]:focus:invalid:focus, #conversejs .pure-form input[type="checkbox"]:focus:invalid:focus { outline-color: #e9322d; } #conversejs .pure-form select { /* Normalizes the height; padding is not sufficient. */ height: 2.25em; border: 1px solid #ccc; background-color: white; } #conversejs .pure-form select[multiple] { height: auto; } #conversejs .pure-form label { margin: 0.5em 0 0.2em; } #conversejs .pure-form fieldset { margin: 0; padding: 0.35em 0 0.75em; border: 0; } #conversejs .pure-form legend { display: block; width: 100%; padding: 0.3em 0; margin-bottom: 0.3em; color: #333; border-bottom: 1px solid #e5e5e5; } #conversejs .pure-form-stacked input[type="text"], #conversejs .pure-form-stacked input[type="password"], #conversejs .pure-form-stacked input[type="email"], #conversejs .pure-form-stacked input[type="url"], #conversejs .pure-form-stacked input[type="date"], #conversejs .pure-form-stacked input[type="month"], #conversejs .pure-form-stacked input[type="time"], #conversejs .pure-form-stacked input[type="datetime"], #conversejs .pure-form-stacked input[type="datetime-local"], #conversejs .pure-form-stacked input[type="week"], #conversejs .pure-form-stacked input[type="number"], #conversejs .pure-form-stacked input[type="search"], #conversejs .pure-form-stacked input[type="tel"], #conversejs .pure-form-stacked input[type="color"], #conversejs .pure-form-stacked input[type="file"], #conversejs .pure-form-stacked select, #conversejs .pure-form-stacked label, #conversejs .pure-form-stacked textarea { display: block; margin: 0.25em 0; } #conversejs .pure-form-stacked input:not([type]) { display: block; margin: 0.25em 0; } #conversejs .pure-form-aligned input, #conversejs .pure-form-aligned textarea, #conversejs .pure-form-aligned select, #conversejs .pure-form-aligned .pure-help-inline, #conversejs .pure-form-message-inline { display: inline-block; *display: inline; *zoom: 1; vertical-align: middle; } #conversejs .pure-form-aligned textarea { vertical-align: top; } #conversejs .pure-form-aligned .pure-control-group { margin-bottom: 0.5em; } #conversejs .pure-form-aligned .pure-control-group label { text-align: right; display: inline-block; vertical-align: middle; width: 10em; margin: 0 1em 0 0; } #conversejs .pure-form-aligned .pure-controls { margin: 1.5em 0 0 11em; } #conversejs .pure-form input.pure-input-rounded, #conversejs .pure-form .pure-input-rounded { border-radius: 2em; padding: 0.5em 1em; } #conversejs .pure-form .pure-group fieldset { margin-bottom: 10px; } #conversejs .pure-form .pure-group input, #conversejs .pure-form .pure-group textarea { display: block; padding: 10px; margin: 0 0 -1px; border-radius: 0; position: relative; top: -1px; } #conversejs .pure-form .pure-group input:focus, #conversejs .pure-form .pure-group textarea:focus { z-index: 3; } #conversejs .pure-form .pure-group input:first-child, #conversejs .pure-form .pure-group textarea:first-child { top: 1px; border-radius: 4px 4px 0 0; margin: 0; } #conversejs .pure-form .pure-group input:first-child:last-child, #conversejs .pure-form .pure-group textarea:first-child:last-child { top: 1px; border-radius: 4px; margin: 0; } #conversejs .pure-form .pure-group input:last-child, #conversejs .pure-form .pure-group textarea:last-child { top: -2px; border-radius: 0 0 4px 4px; margin: 0; } #conversejs .pure-form .pure-group button { margin: 0.35em 0; } #conversejs .pure-form .pure-input-1 { width: 100%; } #conversejs .pure-form .pure-input-3-4 { width: 75%; } #conversejs .pure-form .pure-input-2-3 { width: 66%; } #conversejs .pure-form .pure-input-1-2 { width: 50%; } #conversejs .pure-form .pure-input-1-3 { width: 33%; } #conversejs .pure-form .pure-input-1-4 { width: 25%; } #conversejs .pure-form .pure-help-inline, #conversejs .pure-form-message-inline { display: inline-block; padding-left: 0.3em; color: #666; vertical-align: middle; font-size: 0.875em; } #conversejs .pure-form-message { display: block; color: #666; font-size: 0.875em; } @media only screen and (max-width: 480px) { #conversejs { /* NOTE: pure-help-inline is deprecated. Use .pure-form-message-inline instead. */ } #conversejs .pure-form button[type="submit"] { margin: 0.7em 0 0; } #conversejs .pure-form input:not([type]), #conversejs .pure-form input[type="text"], #conversejs .pure-form input[type="password"], #conversejs .pure-form input[type="email"], #conversejs .pure-form input[type="url"], #conversejs .pure-form input[type="date"], #conversejs .pure-form input[type="month"], #conversejs .pure-form input[type="time"], #conversejs .pure-form input[type="datetime"], #conversejs .pure-form input[type="datetime-local"], #conversejs .pure-form input[type="week"], #conversejs .pure-form input[type="number"], #conversejs .pure-form input[type="search"], #conversejs .pure-form input[type="tel"], #conversejs .pure-form input[type="color"], #conversejs .pure-form label { margin-bottom: 0.3em; display: block; } #conversejs .pure-group input:not([type]), #conversejs .pure-group input[type="text"], #conversejs .pure-group input[type="password"], #conversejs .pure-group input[type="email"], #conversejs .pure-group input[type="url"], #conversejs .pure-group input[type="date"], #conversejs .pure-group input[type="month"], #conversejs .pure-group input[type="time"], #conversejs .pure-group input[type="datetime"], #conversejs .pure-group input[type="datetime-local"], #conversejs .pure-group input[type="week"], #conversejs .pure-group input[type="number"], #conversejs .pure-group input[type="search"], #conversejs .pure-group input[type="tel"], #conversejs .pure-group input[type="color"] { margin-bottom: 0; } #conversejs .pure-form-aligned .pure-control-group label { margin-bottom: 0.3em; text-align: left; display: block; width: 100%; } #conversejs .pure-form-aligned .pure-controls { margin: 1.5em 0 0 0; } #conversejs .pure-form .pure-help-inline, #conversejs .pure-form-message-inline, #conversejs .pure-form-message { display: block; font-size: 0.75em; /* Increased bottom padding to make it group with its related input element. */ padding: 0.2em 0 0.8em; } } #conversejs .pure-button { /* Structure */ display: inline-block; zoom: 1; line-height: normal; white-space: nowrap; vertical-align: middle; text-align: center; cursor: pointer; -webkit-user-drag: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #conversejs .pure-button::-moz-focus-inner { padding: 0; border: 0; } #conversejs .pure-button { font-family: inherit; font-size: 100%; padding: 0.5em 1em; color: #444; /* rgba not supported (IE 8) */ color: rgba(0, 0, 0, 0.8); /* rgba supported */ border: 1px solid #999; /*IE 6/7/8*/ border: none transparent; /*IE9 + everything else*/ background-color: #E6E6E6; text-decoration: none; border-radius: 2px; } #conversejs .pure-button-hover, #conversejs .pure-button:hover, #conversejs .pure-button:focus { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#1a000000',GradientType=0); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(transparent), color-stop(40%, rgba(0, 0, 0, 0.05)), to(rgba(0, 0, 0, 0.1))); background-image: -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.05) 40%, rgba(0, 0, 0, 0.1)); background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0.1)); background-image: -o-linear-gradient(transparent, rgba(0, 0, 0, 0.05) 40%, rgba(0, 0, 0, 0.1)); background-image: linear-gradient(transparent, rgba(0, 0, 0, 0.05) 40%, rgba(0, 0, 0, 0.1)); } #conversejs .pure-button:focus { outline: 0; } #conversejs .pure-button-active, #conversejs .pure-button:active { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15) inset, 0 0 6px rgba(0, 0, 0, 0.2) inset; border-color: #000 \9; } #conversejs .pure-button[disabled], #conversejs .pure-button-disabled, #conversejs .pure-button-disabled:hover, #conversejs .pure-button-disabled:focus, #conversejs .pure-button-disabled:active { border: none; background-image: none; filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); filter: alpha(opacity=40); -khtml-opacity: 0.40; -moz-opacity: 0.40; opacity: 0.40; cursor: not-allowed; box-shadow: none; } #conversejs .pure-button-hidden { display: none; } #conversejs .pure-button::-moz-focus-inner { padding: 0; border: 0; } #conversejs .pure-button-primary, #conversejs .pure-button-selected, #conversejs a.pure-button-primary, #conversejs a.pure-button-selected { background-color: #0078e7; color: #fff; } #conversejs *, #conversejs *:before, #conversejs *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } @media screen and (max-width: 480px) { #conversejs { margin: 0; right: 10px; left: 10px; bottom: 5px; } } #conversejs ul li { height: auto; } #conversejs div, #conversejs span, #conversejs h1, #conversejs h2, #conversejs h3, #conversejs h4, #conversejs h5, #conversejs h6, #conversejs p, #conversejs blockquote, #conversejs pre, #conversejs a, #conversejs em, #conversejs img, #conversejs strong, #conversejs dl, #conversejs dt, #conversejs dd, #conversejs ol, #conversejs ul, #conversejs li, #conversejs fieldset, #conversejs form, #conversejs label, #conversejs legend, #conversejs table, #conversejs caption, #conversejs tbody, #conversejs tfoot, #conversejs thead, #conversejs tr, #conversejs th, #conversejs td, #conversejs article, #conversejs aside, #conversejs canvas, #conversejs details, #conversejs embed, #conversejs figure, #conversejs figcaption, #conversejs footer, #conversejs header, #conversejs hgroup, #conversejs menu, #conversejs nav, #conversejs output, #conversejs ruby, #conversejs section, #conversejs summary, #conversejs time, #conversejs mark, #conversejs audio, #conversejs video { margin: 0; padding: 0; border: 0; font: inherit; vertical-align: baseline; } #conversejs textarea, #conversejs input[type=submit], #conversejs input[type=button], #conversejs input[type=text], #conversejs input[type=password], #conversejs button { font-size: 14px; padding: 0.25em; min-height: 0; } #conversejs strong { font-weight: 700; } #conversejs ol, #conversejs ul { list-style: none; } #conversejs li { height: 10px; } #conversejs ul, #conversejs ol, #conversejs dl { font: inherit; margin: 0; } #conversejs a, #conversejs a:visited { text-decoration: none; color: #2A9D8F; text-shadow: none; } #conversejs { bottom: 0; color: #818479; direction: ltr; display: block; font-size: 14px; height: 35px; position: fixed; left: 0; right: 0; width: auto; z-index: 30; } @media screen and (max-width: 480px) { #conversejs { width: 100%; width: 100vw; } } #conversejs ::selection { background-color: #DCF9F6; } #conversejs ::-moz-selection { background-color: #DCF9F6; } #conversejs .no-text-select { -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } #conversejs .emoticon { font-size: 14px; } #conversejs .left { float: left; } #conversejs .right { float: right; } #conversejs .centered { text-align: center; display: block; margin: 5em auto; } #conversejs .hor_centered { text-align: center; display: block; margin: 0 auto; clear: both; } #conversejs .hidden { display: none; } #conversejs .locked { padding-right: 22px; } @-webkit-keyframes spin { from { -webkit-transform: rotate(0deg); } to { -webkit-transform: rotate(359deg); } } @-moz-keyframes spin { from { -moz-transform: rotate(0deg); } to { -moz-transform: rotate(359deg); } } @keyframes spin { from { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(359deg); -moz-transform: rotate(359deg); -ms-transform: rotate(359deg); -o-transform: rotate(359deg); transform: rotate(359deg); } } #conversejs .spinner { -webkit-animation: spin 2s infinite, linear; -moz-animation: spin 2s infinite, linear; animation: spin 2s infinite, linear; display: block; text-align: center; margin: 5px; } #conversejs .spinner:before { font-size: 24px; font-family: 'Converse-js' !important; content: "\231b"; } #conversejs .button-group, #conversejs .input-button-group { display: table; } #conversejs .button-group { width: 100%; } #conversejs .input-button-group button, #conversejs .input-button-group input { display: table-cell; } #conversejs .error { color: red; } #conversejs .reg-feedback { font-size: 85%; } #conversejs .reg-feedback, #conversejs #converse-login .conn-feedback { display: block; text-align: center; width: 100%; } #conversejs a.restore-chat { padding: 1px 0 1px 5px; color: white; line-height: 15px; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #conversejs a.restore-chat:visited { color: white; } #conversejs .activated { display: block !important; } #conversejs .pure-button { border-radius: 4px; } #conversejs .button-primary { color: white; background-color: #2AC611; } #conversejs .button-secondary { color: white; background-color: #83A0D6; } #conversejs .button-cancel { color: white; background-color: #D24E2B; } #conversejs form.pure-form.converse-form { background: white; margin: 1em; } #conversejs form.pure-form.converse-form legend { color: #818479; } #conversejs form.pure-form.converse-form label { margin-top: 1em; } #conversejs form.pure-form.converse-form input[type=text], #conversejs form.pure-form.converse-form input[type=password], #conversejs form.pure-form.converse-form input[type=number], #conversejs form.pure-form.converse-form input[type=button], #conversejs form.pure-form.converse-form input[type=submit] { height: 2.2em; } #conversejs form.pure-form.converse-form input[type=button], #conversejs form.pure-form.converse-form input[type=submit] { padding-left: 1em; padding-right: 1em; margin-right: 1em; } #conversejs form.pure-form.converse-form input.error { border: 1px solid red; color: #818479; } #conversejs form.pure-form.converse-form .form-help { color: gray; font-size: 85%; padding-top: 0.5em; } #conversejs form.pure-form.converse-form .form-help:hover { color: #818479; } #conversejs .chat-textarea-chatbox-selected { border: 1px solid #578308; margin: 0; } #conversejs .chat-textarea-chatroom-selected { border: 2px solid #2A9D8F; margin: 0; } #conversejs .dropdown dt, #conversejs .dropdown ul { margin: 0; padding: 0; } #conversejs .flyout { border-radius: 4px; bottom: 6px; display: block; position: absolute; } #conversejs .chat-head { border-top-left-radius: 4px; border-top-right-radius: 4px; color: #ffffff; font-size: 100%; height: 55px; margin: 0; padding: 5px; position: relative; } #conversejs .chat-head .avatar { margin-right: 0.5em; border-radius: 50%; float: left; } #conversejs .chat-head.chat-head-chatbox { background-color: #F4A261; } #conversejs .chat-head .user-custom-message { clear: left; color: white; font-size: 80%; font-style: italic; height: 1.3em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 0; padding-top: 0.2em; } #conversejs .chatbox-btn { border-radius: 50%; border: 1px solid white; color: white; cursor: pointer; display: inline-block; float: right; font-size: 9px; margin: 0; margin-right: 0.2em; padding: 0.5em 0.5em 0.3em 0.5em; text-decoration: none; } #conversejs .chatbox-btn:active { position: relative; top: 1px; } #conversejs .chatbox { display: block; float: right; height: 35px; margin: 0 0.5em; width: 200px; } @media screen and (max-width: 480px) { #conversejs .chatbox { margin: 0; width: 100%; } } #conversejs .chatbox .box-flyout { background-color: white; box-shadow: 1px 3px 5px 3px rgba(0, 0, 0, 0.4); height: 450px; min-height: 225px; min-width: 200px; width: 200px; z-index: 1; } @media screen and (max-width: 480px) { #conversejs .chatbox .box-flyout { height: 400px; width: 100%; height: 99vh; } } #conversejs .chatbox .chat-title { color: white; line-height: 15px; display: block; text-overflow: ellipsis; overflow: hidden; height: 2em; } #conversejs .chatbox .chat-title a { color: white; width: 100%; } #conversejs .chatbox .chat-body { background-color: white; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; border-top: 0; height: 289px; height: -webkit-calc(100% - 55px); height: calc(100% - 55px); } #conversejs .chatbox .chat-body p { color: #818479; font-size: 14px; margin: 0; padding: 5px; } #conversejs .chatbox .chat-body .chat-info { color: #D24E2B; margin: 0.3em; } #conversejs .chatbox .chat-body .chat-info.chat-event { clear: left; font-style: italic; } #conversejs .chatbox .chat-body .chat-info.chat-error { color: #D24E2B; font-weight: bold; } #conversejs .chatbox .chat-body .chat-info.chat-date { display: inline-block; margin-top: 2em; } #conversejs .chatbox .chat-body .chat-message { margin: 0.3em; } #conversejs .chatbox .chat-body .chat-message span { display: inline-block; } #conversejs .chatbox .chat-body .chat-message span.chat-msg-author { max-width: 100%; font-weight: bold; white-space: nowrap; float: left; text-overflow: ellipsis; overflow: hidden; } #conversejs .chatbox .chat-body .chat-message span.chat-msg-them { color: #1A9707; } #conversejs .chatbox .chat-body .chat-message span.chat-msg-me { color: #2A9D8F; } #conversejs .chatbox .chat-body .chat-message span.chat-msg-content { max-width: 100%; word-wrap: break-word; } #conversejs .chatbox .chat-body .delayed .chat-msg-them { color: #FB5D50; } #conversejs .chatbox .chat-body .delayed .chat-msg-me { color: #7EABBB; } #conversejs .chatbox .chat-content { position: relative; padding: 0.5em; font-size: 13px; color: #818479; overflow-y: auto; border: 0; background-color: #ffffff; line-height: 1.3em; height: 206px; height: calc(100% - 96px); } #conversejs .chatbox .dropdown { /* status dropdown styles */ background-color: #FCFDFD; } #conversejs .chatbox .dropdown dd { margin: 0; padding: 0; position: relative; } #conversejs .chatbox form.sendXMPPMessage { -moz-background-clip: padding; -webkit-background-clip: padding-box; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; background-clip: padding-box; background: white; border-top: 1px solid #BBB; border: 0; margin: 0; padding: 0; position: relative; height: 95px; min-width: 200px; } @media screen and (max-width: 480px) { #conversejs .chatbox form.sendXMPPMessage { width: 100%; } } #conversejs .chatbox form.sendXMPPMessage .chat-textarea { border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; border: 0; height: 70px; padding: 0.5em; width: 100%; resize: none; } #conversejs .chatbox form.sendXMPPMessage .chat-toolbar { font-size: 14px; margin: 0; padding: 5px; height: 25px; display: block; background-color: #FFF5EE; } #conversejs .chatbox form.sendXMPPMessage .chat-toolbar a { color: #2A9D8F; } #conversejs .chatbox form.sendXMPPMessage .chat-toolbar .chat-toolbar-text { font-size: 12px; padding-right: 3px; text-shadow: 0 1px 0 white; } #conversejs .chatbox form.sendXMPPMessage .chat-toolbar .unencrypted a, #conversejs .chatbox form.sendXMPPMessage .chat-toolbar .unencrypted { color: #D24E2B; } #conversejs .chatbox form.sendXMPPMessage .chat-toolbar .unverified a, #conversejs .chatbox form.sendXMPPMessage .chat-toolbar .unverified { color: #cf5300; } #conversejs .chatbox form.sendXMPPMessage .chat-toolbar .private a, #conversejs .chatbox form.sendXMPPMessage .chat-toolbar .private { color: #4b7003; } #conversejs .chatbox form.sendXMPPMessage .chat-toolbar .toggle-occupants, #conversejs .chatbox form.sendXMPPMessage .chat-toolbar .toggle-clear, #conversejs .chatbox form.sendXMPPMessage .chat-toolbar .toggle-otr { float: right; } #conversejs .chatbox form.sendXMPPMessage .chat-toolbar li { display: inline-block; list-style: none; padding: 0 3px 0 3px; cursor: pointer; margin-top: 1px; } #conversejs .chatbox form.sendXMPPMessage .chat-toolbar li:hover { cursor: pointer; } #conversejs .chatbox form.sendXMPPMessage .chat-toolbar ul { background: #fff; bottom: 100%; box-shadow: -1px -1px 2px 0 rgba(0, 0, 0, 0.4); display: none; font-size: 12px; margin: 0 0 1px 0; position: absolute; right: 0; } #conversejs .chatbox form.sendXMPPMessage .chat-toolbar ul li { cursor: pointer; list-style: none; position: relative; } #conversejs .chatbox form.sendXMPPMessage .chat-toolbar ul li a:hover { color: #8f2831; } #conversejs .chatbox form.sendXMPPMessage .chat-toolbar .toggle-smiley { color: #2A9D8F; padding-left: 5px; } #conversejs .chatbox form.sendXMPPMessage .chat-toolbar .toggle-smiley ul li { font-size: 14px; padding: 5px; z-index: 98; } #conversejs .chatbox form.sendXMPPMessage .chat-toolbar .toggle-smiley ul li:hover { background-color: #DCF9F6; } #conversejs .chatbox form.sendXMPPMessage .chat-toolbar .toggle-otr ul li { padding: 7px; background-color: white; display: block; z-index: 99; } #conversejs .chatbox form.sendXMPPMessage .chat-toolbar .toggle-otr ul li a { -moz-transition: background-color 0.2s ease-in-out; -webkit-transition: background-color 0.2s ease-in-out; transition: background-color 0.2s ease-in-out; display: block; padding: 1px; text-decoration: none; } #conversejs .chatbox form.sendXMPPMessage .chat-toolbar .toggle-otr ul li:hover { background-color: #DCF9F6; } #conversejs .chatbox .dragresize { background: transparent; border: 0; margin: 0; position: absolute; top: 0; z-index: 20; } #conversejs .chatbox .dragresize-top { cursor: n-resize; height: 5px; width: 100%; } #conversejs .chatbox .dragresize-left { cursor: w-resize; width: 5px; height: 100%; left: 0; } #conversejs .chatbox .dragresize-topleft { cursor: nw-resize; width: 15px; height: 15px; top: 0; left: 0; } #conversejs #controlbox { display: none; margin-right: 1em; } @media screen and (max-width: 480px) { #conversejs #controlbox { margin: 0; } } #conversejs #controlbox .controlbox-head { background-color: #577BDD; border-top-left-radius: 4px; border-top-right-radius: 4px; color: white; height: 55px; margin: 0; padding: 6px 6px 6px 0; } #conversejs #controlbox form.search-xmpp-contact { margin: 0; padding-left: 5px; padding: 0 0 5px 5px; } #conversejs #controlbox form.search-xmpp-contact input { width: 8em; } #conversejs #controlbox a.subscribe-to-user { padding-left: 2em; font-weight: bold; } #conversejs #controlbox #converse-register { background: white; } #conversejs #controlbox #converse-register .title { font-weight: bold; } #conversejs #controlbox #converse-register .info { font-style: italic; color: green; font-size: 85%; margin: 5px 0; } #conversejs #controlbox #converse-register .form-errors { color: red; display: none; } #conversejs #controlbox #converse-register .provider-title { font-size: 22px; } #conversejs #controlbox #converse-register .provider-score { width: 178px; margin-bottom: 8px; } #conversejs #controlbox #converse-register .form-help .url { font-weight: bold; color: #2A9D8F; } #conversejs #controlbox #converse-register .input-group { display: table; margin: auto; width: 100%; } #conversejs #controlbox #converse-register .input-group span { overflow-x: hidden; text-overflow: ellipsis; max-width: 110px; } #conversejs #controlbox #converse-register .input-group span, #conversejs #controlbox #converse-register .input-group input[name=username] { display: table-cell; text-align: left; } #conversejs #controlbox #converse-register .instructions { color: gray; font-size: 85%; } #conversejs #controlbox #converse-register .instructions:hover { color: #818479; } #conversejs #controlbox #converse-register, #conversejs #controlbox #converse-login { margin-top: 2em; } #conversejs #controlbox #converse-register .login-anon, #conversejs #controlbox #converse-login .login-anon { height: auto; white-space: normal; } #conversejs #controlbox #converse-register .save-submit, #conversejs #controlbox #converse-login .save-submit { color: #436F64; } #conversejs #controlbox #converse-register input, #conversejs #controlbox #converse-login input { width: 100%; margin: 0.5em 0; } #conversejs #controlbox #users .add-converse-contact { margin: 0 1em 0.75em 1em; } #conversejs #controlbox #chatrooms form.add-chatroom input[type=button], #conversejs #controlbox #chatrooms form.add-chatroom input[type=submit], #conversejs #controlbox #chatrooms form.add-chatroom input[type=text] { width: 100%; } #conversejs #controlbox #chatrooms #available-chatrooms { padding: 0 1em 2em 1em; text-align: left; } #conversejs #controlbox #chatrooms #available-chatrooms dt { border: none; color: #818479; font-weight: normal; padding: 0; padding-bottom: 0.5em; text-shadow: 0 1px 0 #FAFAFA; } #conversejs #controlbox #chatrooms #available-chatrooms dd.available-chatroom { border: none; clear: both; color: #818479; display: block; overflow: hidden; padding: 0.4em; text-shadow: 0 1px 0 #FAFAFA; word-wrap: break-word; } #conversejs #controlbox #chatrooms #available-chatrooms dd.available-chatroom:hover { background-color: #DCF9F6; } #conversejs #controlbox #chatrooms #available-chatrooms dd.available-chatroom a.room-info { display: none; clear: right; display: block; } #conversejs #controlbox #chatrooms #available-chatrooms dd.available-chatroom a.room-info:before { font-size: 15px; } #conversejs #controlbox #chatrooms #available-chatrooms dd.available-chatroom a.open-room { float: left; width: 85%; } #conversejs #controlbox #chatrooms #available-chatrooms dd.available-chatroom .room-info { font-size: 11px; font-style: normal; font-weight: normal; } #conversejs #controlbox #chatrooms #available-chatrooms dd.available-chatroom li.room-info { display: block; margin-left: 5px; } #conversejs #controlbox #chatrooms #available-chatrooms dd.available-chatroom p.room-info { margin: 0; padding: 0; display: block; white-space: normal; } #conversejs #controlbox #chatrooms #available-chatrooms dd.available-chatroom div.room-info { clear: left; width: 100%; } #conversejs #controlbox .dropdown a { width: 148px; display: inline-block; line-height: 25px; } #conversejs #controlbox .dropdown li { list-style: none; padding-left: 0; } #conversejs #controlbox .dropdown dd ul { padding: 0; list-style: none; position: absolute; left: 0; top: 0; border: 1px solid #B1BFC4; width: 100%; z-index: 21; background-color: #FCFDFD; } #conversejs #controlbox .dropdown dd ul li:hover { background-color: #DCF9F6; } #conversejs #controlbox .dropdown dd.search-xmpp ul { box-shadow: 1px 4px 10px 1px rgba(0, 0, 0, 0.4); } #conversejs #controlbox .dropdown dd.search-xmpp ul li:hover { background-color: #FCFDFD; } #conversejs #controlbox .dropdown dt a span { cursor: pointer; display: block; padding: 4px 7px 0 5px; } #conversejs #controlbox #select-xmpp-status { float: right; margin-right: 0.5em; } #conversejs #controlbox #set-custom-xmpp-status { float: left; padding: 0; } #conversejs #controlbox #set-custom-xmpp-status fieldset { padding: 0; margin-top: -1px; } #conversejs #controlbox #set-custom-xmpp-status input { height: 26px; width: -webkit-calc(100% - 40px); width: calc(100% - 40px); padding: 0 0 0 0.5em; } #conversejs #controlbox #set-custom-xmpp-status input[type=submit] { height: 26px; width: 40px; padding: 1px; float: right; } #conversejs #controlbox #controlbox-tabs { text-align: center; display: inline; overflow: hidden; font-size: 12px; list-style-type: none; /* single tab */ } #conversejs #controlbox #controlbox-tabs li { float: left; list-style: none; padding-left: 0; text-shadow: white 0 1px 0; width: 38%; } #conversejs #controlbox #controlbox-tabs li a { background-color: white; border-bottom: 1px solid #CCC; border-top-left-radius: 4px; border-top-right-radius: 4px; box-shadow: inset 2px -2px 20px rgba(0, 0, 0, 0.3); color: #818479; display: block; font-size: 12px; height: 54px; line-height: 54px; margin: 0; text-align: center; text-decoration: none; } #conversejs #controlbox #controlbox-tabs li a:hover { color: #818479; } #conversejs #controlbox #controlbox-tabs li a.current, #conversejs #controlbox #controlbox-tabs li a.current:hover { box-shadow: none; border-bottom: 0; height: 55px; cursor: default; color: #818479; } #conversejs #controlbox .fancy-dropdown { border: 1px solid #B1BFC4; height: 25px; border-radius: 4px; text-align: left; padding: 0; padding-left: 0.3em; } #conversejs #controlbox .fancy-dropdown .choose-xmpp-status { width: 155px; } #conversejs #controlbox .fancy-dropdown .choose-xmpp-status, #conversejs #controlbox .fancy-dropdown .toggle-xmpp-contact-form { text-shadow: 0 1px 0 #ffffff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline; } #conversejs #controlbox .fancy-dropdown.no-border { border: 0; } #conversejs #controlbox #fancy-xmpp-status-select { padding-left: 0; } #conversejs #controlbox #fancy-xmpp-status-select .xmpp-status { margin-left: 0.3em; display: inline; } #conversejs #controlbox #fancy-xmpp-status-select a.change-xmpp-status-message { float: right; clear: right; width: 12px; margin-right: 0.3em; color: #2A9D8F; } #conversejs #controlbox .controlbox-pane { background-color: white; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; border: 0; font-size: 14px; position: absolute; text-align: center; width: 100%; height: 289px; height: -webkit-calc(100% - 55px); height: calc(100% - 55px); overflow-y: auto; overflow-x: hidden; } #conversejs #controlbox .controlbox-pane label { font-size: 14px; font-weight: bold; height: auto; margin: 4px; } #conversejs #controlbox .controlbox-pane dd { margin-left: 0; margin-bottom: 0; } #conversejs #controlbox .controlbox-pane dd.odd { background-color: #DCEAC5; } #conversejs #controlbox #users { overflow-y: hidden; } #conversejs #controlbox .add-xmpp-contact { background: none; padding: 1em; } #conversejs #controlbox .add-xmpp-contact input { margin: 0 0 1rem; width: 100%; } #conversejs #controlbox .add-xmpp-contact button { width: 100%; } #conversejs #controlbox .xmpp-status-menu { text-align: left; box-shadow: 1px 4px 10px 1px rgba(0, 0, 0, 0.4); } #conversejs #controlbox .xmpp-status-menu li { padding: 2px; } #conversejs #controlbox .xmpp-status-menu li a { width: 100%; padding: 0 8px; } #conversejs #controlbox .xmpp-status-menu li a.logout, #conversejs #controlbox .xmpp-status-menu li a.logout span { color: #D24E2B; } #conversejs #controlbox .set-xmpp-status { background: none; margin: 1em 1em 0.5em 1em; } #conversejs #controlbox .set-xmpp-status .dropdown dd ul { z-index: 22; } #conversejs .toggle-controlbox { background-color: #2A9D8F; border-top-left-radius: 4px; border-top-right-radius: 4px; color: #0a0a0a; float: right; height: 100%; margin: 0 0.5em; padding: 10px 8px 0 8px; } #conversejs .toggle-controlbox span { color: white; } #conversejs #converse-roster { text-align: left; width: 100%; position: relative; margin: 1em 0 0 0; height: 194px; height: calc(100% - 50px - 20px); overflow: hidden; padding: 0; padding-bottom: 3em; } #conversejs #converse-roster.no-contact-requests { height: calc(100% - 25px - 20px); } #conversejs #converse-roster .search-xmpp ul li.chat-info { padding-left: 10px; } #conversejs #converse-roster .roster-filter-group { margin: 0 1em; width: 100%; padding-right: 2em; /* (jQ addClass:) if input has value: */ /* (jQ addClass:) if mouse is over the 'x' input area*/ } #conversejs #converse-roster .roster-filter-group .roster-filter { float: left; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAABNSURBVHjaXI7BDcAwCAMvyQjMyQ6dAbZiKfqoUK34g2zJh1dENIC7M8pMAPYdzAVY3d0ajNz9aypS/b5R6o+ZPdqoKgCq6h80KH3xDgBqNR97p8oAGQAAAABJRU5ErkJggg==) no-repeat right -20px center; border: 1px solid #999; font-size: 14px; height: 25px; margin: 0; padding: 0; padding-left: 0.4em; width: 53%; } #conversejs #converse-roster .roster-filter-group .roster-filter.x { background-position: right 3px center; } #conversejs #converse-roster .roster-filter-group .roster-filter.onX { cursor: pointer; } #conversejs #converse-roster .roster-filter-group .filter-type { display: table-cell; float: right; font-size: calc(14px - 2px); height: 25px; padding: 0; width: 47%; border-radius: 0; border: 1px solid; } #conversejs #converse-roster .roster-contacts { margin: 0; height: 100%; overflow-x: hidden; overflow-y: auto; } #conversejs #converse-roster .roster-contacts dt.roster-group { border: none; color: #818479; display: none; font-weight: normal; margin-top: 0.5em; padding: 0.5em 1em; text-shadow: 0 1px 0 #FAFAFA; } #conversejs #converse-roster .roster-contacts dt.roster-group:hover { background-color: #DCF9F6; } #conversejs #converse-roster .roster-contacts dt.roster-group .group-toggle { color: #818479; display: block; width: 100%; } #conversejs #converse-roster .roster-contacts dd { border: none; clear: both; color: #818479; display: block; height: 24px; overflow-y: hidden; padding: 0.3em 0 0.3em 1em; text-shadow: 0 1px 0 #FAFAFA; line-height: 14px; width: 100%; } #conversejs #converse-roster .roster-contacts dd .open-chat { max-width: 90%; } #conversejs #converse-roster .roster-contacts dd:hover { background-color: #DCF9F6; } #conversejs #converse-roster .roster-contacts dd:hover .remove-xmpp-contact { display: inline-block; } #conversejs #converse-roster .roster-contacts dd:hover .open-chat { width: 80%; } #conversejs #converse-roster .roster-contacts dd.requesting-xmpp-contact.request-actions { margin-left: 0.5em; margin-bottom: 0.3em; float: right; } #conversejs #converse-roster .roster-contacts dd.requesting-xmpp-contact .req-contact-name { width: 69%; padding: 0; } #conversejs #converse-roster .roster-contacts dd.current-xmpp-contact span { font-size: 16px; float: left; color: #2A9D8F; } #conversejs #converse-roster .roster-contacts dd.odd { background-color: #DCEAC5; /* Make this difference */ } #conversejs #converse-roster .roster-contacts dd a, #conversejs #converse-roster .roster-contacts dd span { text-shadow: 0 1px 0 #FAFAFA; display: inline-block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } #conversejs #converse-roster .roster-contacts dd span { padding: 0 0.5em 0 0; height: 100%; } #conversejs #converse-roster .roster-contacts dd a.decline-xmpp-request { margin-left: 5px; } #conversejs #converse-roster .roster-contacts dd a.remove-xmpp-contact { float: right; margin-right: 1em; display: none; color: #818479; } #conversejs #converse-roster span.pending-contact-name { width: 80%; } #conversejs .chat-head-chatroom { background-color: #E76F51; } #conversejs .chat-head-chatroom .chatroom-topic { color: white; font-size: 80%; font-style: italic; height: 1.3em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 0; margin-top: 0.3em; } #conversejs .chatroom { width: 300px; } @media screen and (max-width: 480px) { #conversejs .chatroom { width: 100%; } #conversejs .chatroom .box-flyout { min-width: 100%; width: 100%; } } #conversejs .chatroom .box-flyout { min-width: 300px; width: 300px; } #conversejs .chatroom .box-flyout .chatroom-body { height: 289px; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; height: -webkit-calc(100% - 55px); height: calc(100% - 55px); background-color: white; border-top: 0; width: 100%; } #conversejs .chatroom .box-flyout .chatroom-body .chat-area { word-wrap: break-word; height: 100%; max-width: 70%; float: left; min-width: 200px; } #conversejs .chatroom .box-flyout .chatroom-body .chat-area .chat-content { padding: 0 0.5em 0 0.5em; } #conversejs .chatroom .box-flyout .chatroom-body .chat-area.full { max-width: 100%; } #conversejs .chatroom .box-flyout .chatroom-body .mentioned { font-weight: bold; } #conversejs .chatroom .box-flyout .chatroom-body .chat-msg-room { color: #1A9707; } #conversejs .chatroom .box-flyout .chatroom-body .occupants { vertical-align: top; background-color: white; overflow: hidden; border-left: 1px solid #818479; border-bottom-right-radius: 4px; min-width: 30%; height: 100%; } #conversejs .chatroom .box-flyout .chatroom-body .occupants.hidden { display: none; } #conversejs .chatroom .box-flyout .chatroom-body .occupants .occupants-heading { padding: 0.3em; font-weight: bold; } #conversejs .chatroom .box-flyout .chatroom-body .occupants .occupant-list { height: 85%; height: calc(100% - 70px); overflow-x: hidden; overflow-y: auto; list-style: none; } #conversejs .chatroom .box-flyout .chatroom-body .occupants .occupant-list li { cursor: default; display: block; font-size: 12px; overflow: hidden; padding: 2px 5px; text-overflow: ellipsis; white-space: nowrap; width: 100px; } #conversejs .chatroom .box-flyout .chatroom-body .occupants .occupant-list li.moderator { color: #D24E2B; } #conversejs .chatroom .box-flyout .chatroom-body .chatroom-form-container { background-color: white; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; border: 0; color: #818479; font-size: 14px; height: 289px; height: -webkit-calc(100% - 55px); height: calc(100% - 55px); overflow-y: auto; position: absolute; } #conversejs .chatroom .chat-textarea { border-bottom-right-radius: 0; } #conversejs .chatroom .room-invite { margin: 0.3em; } #conversejs .chatroom .room-invite .invited-contact { margin: -1px 0 0 -1px; width: 100%; border: 1px solid #999; } #conversejs .chatroom .room-invite .invited-contact.tt-input { width: 100%; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3gkBCjE0uzKkOgAAAidJREFUKM+N0k+IEnEUB/D3cyscdagkWpHV0WGWREXm0AgOGkSJ07kh2UXYU5cOewm6Bp0KXG/tpSCv6hyEFQIhMEaE3yERYfwTOoqKGLQxDAbqYadLgu7J7/XxeY/3ez8EACDLsgljfMfj8ZxUKhXXYDAAnueBoqgyAMipVOovXAuSZdnUaDQeDofDs16vFyUIAjRNUwmCoG02G1AUdZ5IJN7GYrHfm3AvEAjcnUwmX0ajUdRqtV74fL6sruufKYoa6bp+fzabPUMI7ZfL5eImNHk8npNerxc1m80XHMe98fv9H3K5XDkSibxjWfb1arWaYoyPMMbCFqxUKi6CIODw8LDmdDq7oigaAACiKK5omv7KcdylpmlIkiTHFlRVFTRNUxVFqa/ROqIoGoqi5A3DgFartfU4Jp7ngSAI2uVyPZIk6dZmUZKk2w6H4xghBPF4HK7vWLbZbDCdTp+rqvpUkiS0RvV6/bTf7x8wDHMViURqm/AGAMgURZ232+1X1Wr102KxuEwmk3lZlo/7/f7BcrkkSZKs2e12tHXH/x/gHsY4jTE+0jQNGYYBCCFgGOaKJMkfjUaDZximGQ6HXzSbzZ+ZTMbY6oIxFgqFgqPT6YAgCMBxXM1ut6N0Op0fj8chi8XyjWXZ98Fg8DuCHZLNZh+USqWP8/n8idvt/hUKhV7u7QK9Xu8fmqanAJBQVXUfAGY7TQQAKBaLN8fjsdDtdh/run72Dzhf7XLe2UevAAAAAElFTkSuQmCC) no-repeat right 3px center; } #conversejs .chatroom .room-invite .invited-contact.tt-input:focus { border-color: #E76F51; } #conversejs .chatroom .room-invite .invited-contact.tt-hint { color: transparent; background-color: white; } #conversejs .chatroom .room-invite .tt-dropdown-menu { width: 96%; max-height: 250px; background: #E76F51; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; overflow-y: auto; } #conversejs .chatroom .room-invite .tt-dropdown-menu .tt-suggestion p { color: white; cursor: pointer; font-size: 11px; text-overflow: ellipsis; overflow-x: hidden; } #conversejs .chatroom .room-invite .tt-dropdown-menu .tt-suggestion p:hover { background-color: #FF977C; } #conversejs .chatroom .room-invite .tt-dropdown-menu .tt-suggestion .tt-highlight { background-color: #D24E2B; } #conversejs #minimized-chats { border-top-left-radius: 4px; border-top-right-radius: 4px; color: white; display: none; float: right; font-weight: bold; height: 100%; margin: 0 0.5em; padding: 0; width: 130px; } #conversejs #minimized-chats #toggle-minimized-chats { border-top-left-radius: 4px; border-top-right-radius: 4px; background-color: #2A9D8F; color: white; position: relative; padding: 10px 0 0 0; display: block; width: 100%; height: 100%; text-align: center; } #conversejs #minimized-chats .minimized-chats-flyout { height: auto; bottom: 35px; } #conversejs #minimized-chats .minimized-chats-flyout .chat-head { padding: 0.3em; border-radius: 4px; width: 130px; height: 35px; margin-bottom: 0.2em; box-shadow: 1px 3px 5px 3px rgba(0, 0, 0, 0.4); } #conversejs #minimized-chats .minimized-chats-flyout.minimized { height: auto; } #conversejs #minimized-chats .unread-message-count, #conversejs #minimized-chats .chat-head-message-count { font-weight: bold; background-color: white; border: 1px solid; text-shadow: 1px 1px 0 #FAFAFA; color: #D24E2B; border-radius: 5px; padding: 2px 4px; font-size: 16px; text-align: center; position: absolute; right: 116px; bottom: 10px; } /*# sourceMappingURL=converse.css.map */