--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/browser/public/libervia.css	Sat Aug 25 17:59:48 2018 +0200
@@ -0,0 +1,1687 @@
+/*
+Libervia: a Salut à Toi frontend
+Copyright (C) 2011-2016  Jérôme Poisson <goffi@goffi.org>
+Copyright (C) 2011  Adrien Vigneron <adrienvigneron@mailoo.org>
+Copyright (C) 2013-2016  Adrien Cossa <souliane@mailoo.org>
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as published by
+the Free Software Foundation, either version 3 of the License, or
+(at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program.  If not, see <http://www.gnu.org/licenses/>.
+*/
+
+
+/*
+ * CSS Reset: see http://pyjs.org/wiki/csshellandhowtodealwithit/
+ */
+
+/* reset/default styles */
+
+html, body, div, span, applet, object, iframe,
+p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, font, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center, dl, dt, dd, li,
+fieldset, form, label, legend, table, caption,
+tbody, tfoot, thead, tr, th, td {
+    margin: 0;
+    padding: 0;
+    border: 0;
+    outline: 0;
+    font-size: 100%;
+    vertical-align: baseline;
+    background: transparent;
+    color: #444;
+}
+
+/* styles for displaying rich text - START */
+h1, h2, h3, h4, h5, h6 {
+    margin: 0;
+    padding: 0;
+    border: 0;
+    outline: 0;
+    vertical-align: baseline;
+    background: transparent;
+    color: #444;
+    border-bottom: 1px solid rgb(170, 170, 170);
+    margin-bottom: 0.6em;
+}
+ol, ul {
+    margin: 0;
+    border: 0;
+    outline: 0;
+    font-size: 100%;
+    vertical-align: baseline;
+    background: transparent;
+    color: #444;
+}
+a:link {
+    color: blue;
+}
+.bubble p {
+    margin: 0.4em 0em;
+}
+.bubble img {
+    /* /!\ setting a max-width percentage value affects the toolbar icons */
+    max-width: 600px;
+}
+
+/* styles for displaying rich text - END */
+
+blockquote, q { quotes: none; }
+
+blockquote:before, blockquote:after,
+q:before, q:after {
+    content: '';
+    content: none;
+}
+
+:focus { outline: 0; }
+ins { text-decoration: none; }
+del { text-decoration: line-through; }
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0;
+}
+
+/* pyjamas iframe hide */
+iframe { position: absolute; }
+
+
+html, body {
+    width: 100%;
+    height: 100%;
+    min-height: 100%;
+
+}
+
+body {
+    line-height: 1em;
+    font-size: 1em;
+    overflow: auto;
+
+}
+
+.scrollpanel {
+    margin-bottom: -10000px;
+
+}
+
+.iescrollpanelfix {
+    position: relative;
+    top: 100%;
+    margin-bottom: -10000px;
+
+}
+
+/* undo part of the above (non-IE) */
+html>body .iescrollpanelfix { position: static; }
+
+/* CSS Reset END */
+
+body {
+    background-color: #fff;
+    font: normal 0.8em/1.5em Arial, Helvetica, sans-serif;
+}
+
+.header {
+    background-color: #eee;
+    border-bottom: 1px solid #ddd;
+    width: 100%;
+    height: 64px;
+}
+
+.mainPanel {
+    width: 100%;
+    height: 100%;
+}
+
+.mainMenuBar {
+    background-color: #222;
+    background: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#222222));
+    background: -webkit-linear-gradient(top, #444444, #222222);
+    background: linear-gradient(to bottom, #444444, #222222);
+    height: 28px;
+    padding: 5px 5px 0 5px;    
+    border: 1px solid #ddd;
+    border-radius: 0 0 1em 1em;
+    line-height: 100%;
+    -webkit-box-shadow: 0px 1px 4px #000;
+    box-shadow: 0px 1px 4px #000;
+    display: inline-block;
+    position: absolute;
+    left: 20px;
+    right: 20px;
+    width: auto;
+}
+
+.mainMenuBar .gwt-MenuItem {
+    padding: 3px 15px;
+    text-decoration: none;    
+    font-weight: bold;
+    height: 100%;
+    color: #e7e5e5;
+    border-radius: 1em 1em 1em 1em;
+    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4); 
+    -webkit-transition: color 0.2s linear; 
+    transition: color 0.2s linear;
+}
+
+.mainMenuBar .gwt-MenuItem-selected {
+    background-color: #eee;
+    background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#aaa));
+    background: -webkit-linear-gradient(top, #eee, #aaa);
+    background: linear-gradient(to bottom, #eee, #aaa);
+    color: #444;
+    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
+}
+
+/* Menu bars and items */
+
+.gwt-MenuBar {
+    /* Common to all menu bars */
+    margin: 0;
+}
+
+.gwt-MenuBar table {
+    /* Common to all tables within a menu bar */
+    width: 100%;
+    display: inline-table;
+}
+
+.gwt-MenuBar-horizontal {
+    /* Specific to horizontal menu bars*/
+}
+
+.gwt-MenuBar-vertical {
+    /* Specific to vertical menu bars*/
+    background-color: #fff;
+    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc));
+    background: -webkit-linear-gradient(top, #fff, #ccc);
+    background: linear-gradient(to bottom, #fff, #ccc);
+    height: 100%;
+    min-width: 148px;
+    padding: 0;
+    border: solid 1px #aaa;
+    border-radius: 0 0 10px 10px;
+    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
+    box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
+}
+
+.gwt-MenuItem img {
+    /* Common to all images within a menu item */
+    padding-right: 2px;
+}
+
+.gwt-MenuBar .gwt-MenuItem {
+    /* Common to items of all menu bars */
+}
+
+.gwt-MenuBar-horizontal .gwt-MenuItem {
+    /* Specific to items of horizontal menu bars*/
+}
+
+.gwt-MenuBar-vertical .gwt-MenuItem {
+    /* Specific to items of vertical menu bars*/
+    padding: 8px 15px;
+}
+
+.gwt-MenuBar .gwt-MenuItem-selected {
+    /* Common to all selected items */
+    cursor: pointer;
+}
+
+.gwt-MenuBar-horizontal .gwt-MenuItem-selected {
+    /* Specific to selected items of horizontal menu bars */
+}
+
+.gwt-MenuBar-vertical .gwt-MenuItem-selected {
+    /* Specific to selected items of vertical menu bars */
+    background: #cf2828 !important;
+    background: -webkit-gradient(linear, left top, left bottom, from(#cf2828), to(#981a1a)) !important;
+    background: -webkit-linear-gradient(top, #cf2828, #981a1a) !important;
+    background: linear-gradient(to bottom, #cf2828, #981a1a) !important;
+    color: #fff !important;
+    border-radius: 0 0 0 0;
+    text-shadow: 0 1px 1px rgba(0, 0, 0, .1);
+    -webkit-transition: color 0.2s linear;
+    transition: color 0.2s linear; 
+}
+
+.gwt-MenuBar-vertical tr:last-child td {
+    /* Specific to last items of vertical menus */
+    border-radius: 0 0 9px 9px !important;
+}
+
+.menuLastPopup .gwt-MenuBar-vertical {
+    /* Specific to the last popup menu of the main menu bar */
+    border-top-right-radius: 9px 9px;
+}
+
+.menuLastPopup .gwt-MenuBar-vertical tr:first-child td {
+    /* Specific to the first item of the last popup menu of the main menu bar */
+    border-radius: 0px 9px 0px 0px !important;
+}
+
+.menuSeparator {
+    width: 100%;
+}
+
+.menuSeparator.gwt-MenuItem-selected {
+    border: 0;
+    background: inherit;
+    cursor: default;
+}
+
+.menuFlattenedCategory {
+    font-weight: bold;
+    font-style: italic;
+    padding: 8px 5px;
+    cursor: default;
+}
+
+.menuFlattenedCategory.gwt-MenuItem-selected {
+    /* !important are needed for the style to not be overwritten when the item is selected */
+    background-color: inherit !important;
+    background: inherit !important;
+    color: #444 !important;
+    cursor: default !important;
+}
+
+/* Misc Pyjamas stuff */
+
+.gwt-DialogBox {
+    padding: 10px;
+    border: 1px solid #aaa;
+    background-color: #fff;
+    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc));
+    background: -webkit-linear-gradient(top, #fff, #ccc);
+    background: linear-gradient(to bottom, #fff, #ccc);
+    border-radius: 9px 9px 9px 9px; 
+    -webkit-box-shadow: 0px 1px 4px #000; 
+    box-shadow: 0px 1px 4px #000;
+}
+
+.gwt-DialogBox .Caption {
+    height: 20px;
+    font-size: 1.3em !important;
+    background-color: #cf2828;
+    background: #cf2828 !important;
+    background: -webkit-gradient(linear, left top, left bottom, from(#cf2828), to(#981a1a)) !important;
+    background: -webkit-linear-gradient(top, #cf2828, #981a1a) !important;
+    background: linear-gradient(to bottom, #cf2828, #981a1a) !important;
+    color: #fff;
+    padding: 3px 3px 4px 3px;
+    margin: -10px;
+    margin-bottom: 5px;
+    font-weight: bold;
+    cursor: default;
+    text-align: center;
+    border-radius: 7px 7px 0 0; 
+}
+
+/*DIALOG: button, listbox, textbox, label */
+
+.gwt-DialogBox .gwt-button {
+    background-color: #ccc;
+    border-radius: 5px 5px 5px 5px;
+    -webkit-box-shadow: 0px 1px 4px #000;
+    box-shadow: 0px 1px 4px #000;
+    background: -webkit-gradient(linear, left top, left bottom, from(#444), to(#222));
+    background: -webkit-linear-gradient(top, #444, #222);
+    background: linear-gradient(to bottom, #444, #222);
+    text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
+    padding: 3px 5px 3px 5px;
+    margin: 10px 5px 10px 5px;
+    font-weight: bold;
+    font-size: 1em;
+    border: none; 
+    -webkit-transition: color 0.2s linear; 
+    transition: color 0.2s linear;
+}
+
+.gwt-DialogBox .gwt-button:enabled {
+    cursor: pointer;
+    color: #fff;
+}
+
+.gwt-DialogBox .gwt-button:enabled:hover {
+    background-color: #cf2828;
+    background: -webkit-gradient(linear, left top, left bottom, from(#cf2828), to(#981a1a));
+    background: -webkit-linear-gradient(top, #cf2828, #981a1a);
+    background: linear-gradient(to bottom, #cf2828, #981a1a);
+    color: #fff;
+    text-shadow: 1px 1px 1px rgba(0,0,0,0.25);  
+}
+
+.gwt-DialogBox .gwt-TextBox, .gwt-DialogBox .gwt-PasswordTextBox {
+    background-color: #fff;
+    border-radius: 5px 5px 5px 5px;
+    -webkit-box-shadow:inset 0px 1px 4px #000;
+    box-shadow:inset 0px 1px 4px #000;
+    padding: 3px 5px 3px 5px;
+    margin: 10px 5px 10px 5px;
+    color: #444;
+    font-size: 1em;
+    border: none;
+}
+
+.gwt-DialogBox .gwt-TextArea {
+    background-color: #fff;
+    border-radius: 5px 5px 5px 5px;
+    -webkit-box-shadow:inset 0px 1px 4px #000;
+    box-shadow:inset 0px 1px 4px #000;
+    padding: 3px 5px 3px 5px;
+    margin: 0px 5px 10px 5px;
+    color: #444;
+    border: none;
+    vertical-align: text-top;
+}
+
+.gwt-DialogBox .gwt-ListBox {
+    overflow: auto;
+    width: 100%;
+    background-color: #fff;
+    border-radius: 5px 5px 5px 5px;
+    -webkit-box-shadow:inset 0px 1px 4px #000;
+    box-shadow:inset 0px 1px 4px #000;
+    padding: 3px 5px 3px 5px;
+    margin: 9px 5px 9px 5px;
+    color: #444;
+    font-size: 1em;
+    border: none;
+}
+
+.gwt-DialogBox .gwt-Label {
+    margin-top: 13px;
+}
+
+.gwt-DialogBox .gwt-CheckBox {
+    margin-top: 12px;
+    display: block;
+}
+
+.gwt-DialogBox .gwt-RadioButton {
+    margin-top: 13px;
+    display: block;
+}
+
+.gwt-DialogBox .gwt-RadioButton label {
+    vertical-align: bottom;
+}
+
+.gwt-DialogBox tr td:first-child {
+    vertical-align: top !important;
+}
+
+/* Custom Dialogs */
+
+.formWarning { /* used when a form is not valid and must be corrected before submission */
+    font-weight: bold;
+    color: lightcoral !important;
+    height: 34px;  /* a higher value will screw up the display of registration tab, check before you modify */
+    text-align: center;
+}
+
+.formInfo { /* used when a form is being edited and we want to tell something to the user */
+    color: lightcyan !important;
+}
+
+.contactsChooser {
+    text-align: center;
+    margin:auto;
+    cursor: pointer;
+}
+
+.infoDialogBody {
+    width: 100%;
+    height: 100%
+}
+/* Contact List */
+
+div.contactList {
+    width: 100%;
+    margin-top: 9px;
+}
+
+.contactTitle {
+    color: #cf2828;
+    font-size: 1.7em;
+    text-indent: 5px;
+    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
+    width: 200px;
+    height: 30px; 
+}
+
+.contactsSwitch {
+    /* Button used to switch contacts panel */
+    background: none;
+    border: 0;
+    padding: 0;
+    font-size: large;
+    margin-top: 9px;
+}
+
+.groupPanel {
+    width: 100%;    
+}
+
+.groupPanel tr:first-child td {
+    padding-top: 10px;
+}
+
+.group {
+    curser: pointer;
+    padding: 2px 15px;
+    margin: 5px;
+    display: inline-block;
+    text-decoration: none;
+    font-weight: bold; 
+    color: #e7e5e5;
+    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4); 
+    border-radius: 1em 1em 1em 1em; 
+    background-color: #eee;
+    background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#aaa));
+    background: -webkit-linear-gradient(top, #eee, #aaa);
+    background: linear-gradient(to bottom, #eee, #aaa);
+    color: #444;
+    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
+    -webkit-box-shadow: 0px 1px 1px #000;
+    box-shadow: 0px 1px 1px #000;
+}
+
+div.group:hover {
+    color: #fff;
+    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.6);
+    background-color: #cf2828;
+    background: -webkit-gradient(linear, left top, left bottom, from(#cf2828), to(#981a1a));
+    background: -webkit-linear-gradient(top, #cf2828, #981a1a);
+    background: linear-gradient(to bottom, #cf2828, #981a1a); 
+    -webkit-transition: color 0.1s linear; 
+    transition: color 0.1s linear;  
+}
+
+.contactBox {
+    cursor: pointer;
+    width: 100%;
+    margin: 5px;
+    border-radius: 5px;
+    background: #EDEDED;
+}
+
+.contactBox img, .muc_contact img {
+    width: 32px;
+    height: 32px;
+    border-radius: 5px;
+    margin: 5px 5px 0px 10px;
+}
+
+.contactBox .widgetHeader_buttonGroup {
+    float: left;
+}
+
+.contactBox .widgetHeader_buttonGroup img {
+    width: 32px;
+    height: 32px;
+    border-radius: 5px;
+    border: 1px solid #ededed;
+    padding: 0px 0px 0px 0px;
+    background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#aaa));
+    background: -webkit-linear-gradient(top, #eee, #aaa);
+    background: linear-gradient(to bottom, #eee, #aaa);
+}
+
+.contactBox .widgetHeader_buttonGroup img:hover {
+    border: 1px solid #cf2828;
+}
+
+.contactBox table {
+    width: 100%;
+}
+
+.contactLabel {
+    font-size: 1em;
+    margin-top: 3px;
+    padding: 3px 10px 3px 10px;
+}
+
+.contact-menu-selected {
+    font-size: 1em;
+    margin-top: 3px;
+    padding: 3px 10px 3px 10px;
+    border-radius: 5px;
+    background-color: rgb(175, 175, 175);
+}
+
+.gwt-ScrollPanel {
+    padding-right: 15px; /* avoid systematic horizontal scroll when only the vertical one is needed */
+}
+
+.xmlui-JidsListWidget {
+    padding-right: 20px; /* avoid systematic horizontal scroll when only the vertical one is needed */
+    height: 300px;
+}
+
+/* Contacts in MUC */
+
+.muc_contact {
+    border-radius: 5px;
+    background: #EDEDED;
+    margin: 2px;
+    width: 100%;
+}
+
+/* START - contact presence status */
+.contactLabel-connected {
+    color: #3c7e0c;
+    font-weight: bold;
+}
+.contactLabel-unavailable {
+}
+.contactLabel-chat {
+    color: #3c7e0c;
+    font-weight: bold;
+}
+.contactLabel-away {
+    color: brown;
+    font-weight: bold;
+}
+.contactLabel-dnd {
+    color: red;
+    font-weight: bold;
+}
+.contactLabel-xa {
+    color: red;
+    font-weight: bold;
+}
+/* END - contact presence status */
+
+.selected {
+    color: #fff;
+    background-color: #cf2828;
+    background: -webkit-gradient(linear, left top, left bottom, from(#cf2828), to(#981a1a));
+    background: -webkit-linear-gradient(top, #cf2828, #981a1a);
+    background: linear-gradient(to bottom, #cf2828, #981a1a); 
+    border-radius: 1em 1em 1em 1em; 
+    -webkit-transition: color 0.2s linear; 
+    transition: color 0.2s linear;
+}
+
+.messageBox {
+    width: 100%;
+    padding: 5px;
+    border: 1px solid #bbb;
+    color: #444;
+    background: #fff url('media/libervia/unibox_2.png') right bottom no-repeat;
+    -webkit-box-shadow:inset 0 0 10px #ddd;
+    box-shadow:inset 0 0 10px #ddd;
+    border-radius: 0px 0px 10px 10px;
+    height: 28px;
+    margin: 0px;
+}
+
+.presenceStatusPanel {
+    margin: auto;
+    text-align: center;
+    padding: 5px 0px;
+    text-shadow: 0 -1px 1px rgba(255,255,255,0.25);
+    font-size: 1.2em;
+    background-color: #eee;
+    font-style: italic;
+    font-weight: bold;
+    color: #666;
+    cursor: pointer;
+}
+
+.presence-button {
+    font-size: x-large;
+    padding-right: 5px;
+    cursor: pointer;
+}
+
+/* RegisterBox */
+
+.registerPanel_main button {
+    margin: 0;
+    padding: 0;
+    border: 0;
+}
+
+.registerPanel_main div, .registerPanel_main button {
+    color: #fff;
+    text-decoration: none;
+}
+
+.registerPanel_main{
+    height: 100%;
+    border: 5px solid #222;
+    -webkit-box-shadow: 0px 1px 4px #000;
+    box-shadow: 0px 1px 4px #000;
+}
+
+.registerPanel_right_side {
+    background: #111 url('media/libervia/register_right.png');
+    height: 100%;
+    width: 100%;
+}
+
+.registerPanel_right_side .gwt-StackPanelItem {
+    margin: 15px;
+    height: auto;
+    text-align: center;
+    cursor: pointer;
+    color: #fff;
+	display: block;
+	text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.2);
+}
+
+.registerPanel_right_side .gwt-StackPanelItem-selected {
+    display: none;
+}
+
+.registerPanel_content {
+    margin: auto 50px;
+}
+
+.registerPanel_content div {
+    font-size: 1em;
+    margin-left: 10px;
+    margin-top: 15px;
+    font-weight: bold;
+    color: #aaa;
+}
+
+.registerPanel_content input {
+    height: 25px;
+    line-height: 25px;
+    width: 200px;
+    text-indent: 11px;
+    background: #000;
+    color: #aaa;
+    border: 1px solid #222;
+    border-radius: 15px 15px 15px 15px;
+}
+
+.registerPanel_content input:focus {
+    border: 1px solid #444;
+}
+
+
+.registerPanel_content .button, .registerPanel_content .button:visited {
+    background: #222 url('media/libervia/gradient.png') repeat-x;
+    display: block;
+    text-decoration: none;
+    border-radius: 6px 6px 6px 6px;
+    border-bottom: 1px solid rgba(0,0,0,0.25);
+    cursor: pointer;
+    margin: 30px auto;
+}
+
+/* Fix for Opera */
+.button, .button:visited {
+    border-radius: 6px 6px 6px 6px !important;
+}
+
+.registerPanel_content .button:hover { background-color: #111; color: #fff; }
+.registerPanel_content .button:active    { top: 1px; }
+.registerPanel_content .button, .registerPanel_content .button:visited { font-size: 1em; font-weight: bold; line-height: 1; text-shadow: 0 -1px 1px rgba(0,0,0,0.25); padding: 7px 10px 8px; }
+.registerPanel_content .red.button, .registerPanel_content .red.button:visited { background-color: #000; }
+.registerPanel_content .red.button:hover { background-color: #bc0000; }
+
+/* Widgets */
+
+.widgetsPanel td {
+    vertical-align: top;
+}
+
+.widgetsPanel > div > table {
+    border-collapse: separate !important;
+    border-spacing: 7px;
+}
+
+.widgetHeader {
+    margin: auto;
+    height: 25px;
+    border-radius: 10px 10px 0 0; 
+    background-color: #222;
+    background: -webkit-gradient(linear, left top, left bottom, from(#444), to(#222));
+    background: -webkit-linear-gradient(top, #444, #222);
+    background: linear-gradient(to bottom, #444, #222); 
+}
+
+.widgetHeader_title {
+    color: #fff;
+    font-weight: bold;
+    text-align: left;
+    text-indent: 15px;
+    margin-top: 4px;
+}
+
+.widgetHeader_info {
+    position: absolute;
+    right: 90px;  # FIXME: temporary dirty setting to fit a header menu with 3 icon buttons
+    color: white;
+    background-color: white;
+    border-radius: 5px;
+    padding: 0px 4px;
+    top: 2px !important;
+}
+
+.widgetHeader_info img {
+    padding: 2px;
+    height: 16px;
+}
+
+.widgetHeader_buttonsWrapper {
+    position: absolute;
+    top: 0;
+    height: 100%;
+    width: 100%;
+}
+
+.widgetHeader_buttonGroup {
+    float: right;
+}
+
+.widgetHeader_buttonGroup img {
+    background-color: transparent;
+    width: 25px;
+    height: 20px;
+    padding: 2px 0px 3px 0px;
+    border-left: 1px solid #666;
+    border-top: 0;
+    border-radius: 0 0 0 0;
+    background: -webkit-gradient(linear, left top, left bottom, from(#555), to(#333));
+    background: -webkit-linear-gradient(top, #555, #333);
+    background: linear-gradient(to bottom, #555, #333); 
+    cursor: pointer;
+}
+
+.widgetHeader_buttonGroup img:hover {
+    background-color: #cf2828;
+    background: -webkit-gradient(linear, left top, left bottom, from(#cf2828), to(#981a1a));
+    background: -webkit-linear-gradient(top, #cf2828, #981a1a);
+    background: linear-gradient(to bottom, #cf2828, #981a1a); 
+}
+
+.widgetBody {
+    border-radius: 0 0 10px 10px; 
+    background-color: #fff;  
+    min-width: 200px;
+    min-height: 150px;
+    -webkit-box-shadow:inset 0px 0 1px #444;
+    box-shadow:inset 0px 0 1px #444;
+}
+
+/* BorderWidgets */
+
+.borderWidgetOnDrag {
+    background-color: lightgray;
+    border: 1px dashed #000;
+    border-radius: 1em;
+}
+
+.bottomBorderWidget {
+    height: 10px !important;
+}
+
+.leftBorderWidget, .rightBorderWidget {
+    width: 10px !important;
+}
+
+.leftBorderWidget {
+    float: right;
+}
+
+.rightBorderWidget {
+    float: left;
+}
+
+/* Microblog */
+
+.microblogPanel {
+    width: 100%;
+}
+
+.microblogPanel_footer {
+    cursor: pointer;
+    text-align: center;
+    background-color: #ededed;
+    border-radius: 5px;
+    width: 85%;
+    margin: auto;
+    margin-top: 5px;
+    margin-bottom: 5px;
+}
+
+.microblogPanel_footer a {
+    color: blue;
+}
+
+.microblogNewButton {
+    width: 100%;
+    height: 35px;
+}
+
+.subPanel {
+}
+
+.subpanel .mb_entry {
+    padding-left: 65px;
+}
+
+.mb_entry {
+    min-height: 64px;
+}
+
+.mb_entry_header
+{
+    width: 100%;
+}
+
+.mb_entry_header_info {
+    cursor: pointer;
+    padding: 0px 5px 0px 5px;
+}
+
+.selected_widget .selected_entry .mb_entry_header_info
+{
+    background: #cf2828;
+    border-radius: 5px 5px 0px 0px;
+}
+
+.mb_entry_comments {
+    float: right;
+    padding-right: 5px;
+}
+
+.mb_entry_comments a {
+    color: blue;
+    cursor: pointer;
+}
+
+.mb_entry_author {
+    font-weight: bold;
+}
+
+.mb_entry_avatar {
+    float: left;
+}
+
+.mb_entry_avatar img {
+    width: 48px;
+    height: 48px;
+    padding: 8px;
+    border-radius: 13px;  /* padding value + 5px */
+}
+
+.mb_entry_dialog {
+    float: left;
+    min-height: 54px;
+    padding: 5px 20px 5px 20px;
+    border-collapse: separate;  /* for the bubble queue since the entry dialog is now a HorizontalPanel */
+}
+
+.bubble {
+    position: relative;
+    padding: 15px;
+    margin: 2px;
+    border-radius:10px;
+    background: #EDEDED;
+    border-color: #C1C1C1;
+    border-width: 1px;
+    border-style: solid;
+    display: block;
+    border-collapse: separate;
+    min-height: 15px;  /* for the bubble queue to be aligned when the bubble is empty */
+}
+
+.bubble:after {
+    background: transparent url('media/libervia/bubble_after.png') top right no-repeat;
+    border: none;   
+    content: "";
+    position: absolute;
+    bottom: auto;
+    left: -20px;
+    top: 16px;
+    display: block;
+    height: 20px;
+    width: 20px;
+}
+
+.bubble textarea{
+    width: 100%;
+    min-width: 350px;
+}
+
+.mb_entry_timestamp {
+    font-style: italic;
+}
+
+.mb_entry_actions {
+    float: right;
+    margin: 5px;
+    cursor: pointer;
+    font-size: large;
+}
+
+.mb_entry_action_larger {
+    font-size: x-large;
+}
+
+.mb_entry_toggle_syntax {
+    cursor: pointer; 
+    float: right;
+    display: block;
+    position: relative;
+    top: -20px;
+    left: -20px;
+}
+
+.mb_entry_publish_button {
+    cursor: pointer; 
+    float: left;
+    display: block;
+    position: relative;
+    top: -20px;
+    left: 20px;
+}
+
+/* START TAGS: styles are adapted from Dotclear */
+.mblog_tags {
+    background: #fbfbfb none repeat scroll 0% 0%;
+    padding: 5px;
+    margin: 8px 0px 5px 0px;
+    overflow: hidden;
+    border-radius: 5px;
+}
+
+.mblog_tags li {
+    display: inline;
+    font-size: small;
+}
+
+.mblog_tags li a {
+    float: left;
+    padding: 2px 8px 2px 18px;
+    white-space: nowrap;
+    color: #005D99;
+    text-decoration: none;
+    background: transparent url("../themes/default/images/flaticon/tag67.png") no-repeat scroll 0px 0px;
+}
+/* END TAGS */
+
+
+/* Chat & MUC Room */
+
+.chatPanel {
+    height: 100%;
+    width: 100%;
+}
+
+.chatPanel_body {
+    height: 100%;
+    width: 100%;
+}
+
+.chatContent {
+    overflow: auto;
+    padding: 5px 15px 5px 15px;
+}
+
+.chatText {
+    margin-top: 7px;
+}
+
+.chatTextMe {
+    margin-top: 7px;
+    font-style: italic;
+}
+
+.chatTextInfo {
+    margin-top: 7px;
+    font-weight: bold;
+    font-style: italic;
+}
+
+.chatTextInfo-link {
+    font-weight: bold;
+    font-style: italic;
+    cursor: pointer;
+    display: inline;
+}
+
+.chatArea {
+    height:100%;
+    width:100%;
+}
+
+.chat_text_timestamp {
+    font-style: italic;
+    margin-right: -4px;
+    padding: 1px 3px 1px 3px;
+    border-radius: 15px 0 0 15px;
+    background-color: #eee;
+    color: #888;
+    border: 1px solid #ddd;
+    border-right: none;
+}
+
+.chat_text_nick {
+    font-weight: bold;
+    padding: 1px 3px 1px 3px;
+    border-radius: 0 15px 15px 0;
+    background-color: #eee;
+    color: #b01e1e;
+    border: 1px solid #ddd;
+    border-left: none;
+}
+
+.chat_text_msg {
+    white-space: pre-wrap;
+}
+
+.chat_text_mymess {
+    color: #006600;
+}
+
+.occupantsPanelCell {
+    border-right: 2px dotted #ddd;
+    padding-left: 5px;
+    height: 100%;
+}
+
+/* Games */
+
+.cardPanel {
+    background: #02FE03;
+    margin: 0 auto;
+}
+
+.cardGamePlayerNick {
+    font-weight: bold;
+}
+
+/* Radiocol */
+
+.radiocolPanel {
+
+}
+
+.radiocol_metadata_lbl {
+    font-weight: bold;
+    padding-right: 5px;
+}
+
+.radiocol_next_song {
+    margin-right: 5px;
+    font-style:italic;
+}
+
+.radiocol_status {
+    margin-left: 10px;
+    margin-right: 10px;
+    font-weight: bold;
+    color: black;
+}
+
+.radiocol_upload_status_ok {
+    margin-left: 10px;
+    margin-right: 10px;
+    font-weight: bold;
+    color: #28F215;
+}
+
+.radiocol_upload_status_ko {
+    margin-left: 10px;
+    margin-right: 10px;
+    font-weight: bold;
+    color: #B80000;
+}
+
+/* Drag and drop */
+
+.dragover {
+    background: #cf2828 !important;
+    border-radius: 1em 1em 1em 1em !important;
+}
+
+.dragover .widgetHeader, .dragover .widgetBody, .dragover .widgetBody span, .dragover .widgetHeader img {
+    background: #cf2828 !important;
+}
+
+.dragover.widgetHeader {
+    border-radius: 1em 1em 0 0 !important;
+}
+
+.dragover.widgetBody {
+    border-radius: 0 0 1em 1em !important;
+}
+
+/* Warning message */
+
+.warningPopup {
+    font-size: 1em;
+    width: 100%;
+    height: 26px;
+    text-align: center;
+    padding: 5px 0;
+    border-bottom: 1px solid #444;
+}
+
+.warningTarget {
+    font-weight: bold;
+   
+}
+
+.targetPublic {
+    background-color: red;
+}
+
+.targetGroup {
+    background-color: #00FFFB;
+}
+
+.targetOne2One {
+    background-color: #66FF00;
+}
+
+.targetStatus {
+    background-color: #fff;
+}
+
+.notifInfo {
+    background-color: #66FF00;
+}
+
+.notifWarning {
+    background-color: #DB1616;
+}
+
+/* Tab panel */
+
+.gwt-TabPanel {
+}
+
+.gwt-TabPanelBottom {
+    height: 100%;
+}
+
+.gwt-TabBar {
+    font-weight: bold;
+    text-decoration: none;
+    border-bottom: 3px solid #a01c1c;  
+}
+
+.gwt-TabBar .gwt-TabBarFirst {
+    height: 100%;
+}
+
+.gwt-TabBar .gwt-TabBarRest {
+}
+
+.mainPanel .gwt-TabBar {
+    z-index: 10;
+}
+
+.mainPanel .gwt-TabBar-oneTab {
+    position: fixed;
+    left: 0px;
+    bottom: 0px;
+    border: none;
+}
+
+.mainPanel .gwt-TabBar-oneTab .gwt-TabBarItem-wrapper {
+    display: none;
+}
+
+.mainPanel .gwt-TabBar-oneTab .gwt-TabBarItem-wrapper:nth-child(3) {
+    display: block;
+}
+
+.liberviaTabPanel {
+    width: 100%;
+    height: 100%;
+}
+
+.liberviaTabPanel .gwt-TabBarItem div {
+    color: #fff;
+}
+
+.liberviaTabPanel .gwt-TabBarItem {
+    color: #444 !important;
+    background-color: #222;
+    background: -webkit-gradient(linear, left top, left bottom, from(#444), to(#222));
+    background: -webkit-linear-gradient(top, #444, #222);
+    background: linear-gradient(to bottom, #444, #222);
+    -webkit-box-shadow: 0px 1px 4px #000;
+    box-shadow: 0px 1px 4px #000;
+    padding: 4px 15px 4px 15px;
+    border-radius: 1em 1em 0 0;
+    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
+    cursor: pointer;
+    margin-right: 5px;
+}
+
+.liberviaTabPanel .gwt-TabBarItem-selected {
+    color: #fff;
+    background-color: #cf2828;
+    background: -webkit-gradient(linear, left top, left bottom, from(#cf2828), to(#981a1a));
+    background: -webkit-linear-gradient(top, #cf2828, #981a1a);
+    background: linear-gradient(to bottom, #cf2828, #981a1a);
+    -webkit-box-shadow: 0px 1px 4px #000;
+    box-shadow: 0px 1px 4px #000;
+    padding: 4px 15px 4px 15px;
+    border-radius: 1em 1em 0 0;
+    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
+    cursor: default;
+}
+
+.liberviaTabPanel div.gwt-TabBarItem:hover {
+    color: #fff;
+    background-color: #cf2828;
+    background: -webkit-gradient(linear, left top, left bottom, from(#cf2828), to(#981a1a));
+    background: -webkit-linear-gradient(top, #cf2828, #981a1a);
+    background: linear-gradient(to bottom, #cf2828, #981a1a);
+    -webkit-box-shadow: 0px 1px 4px #000;
+    box-shadow: 0px 1px 4px #000;
+    padding: 4px 15px 4px 15px;
+    border-radius: 1em 1em 0 0;
+    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2); 
+}
+
+.globalLeftArea {
+    margin-top: 9px;
+}
+
+
+/* Misc */
+
+.selected_widget .widgetHeader  {
+    background-color: #cf2828;
+    background: -webkit-gradient(linear, left top, left bottom, from(#cf2828), to(#981a1a));
+    background: -webkit-linear-gradient(top, #cf2828, #981a1a);
+    background: linear-gradient(to bottom, #cf2828, #981a1a);
+}
+
+.infoFrame {
+    position: relative;
+    width: 100%;
+    height: 100%;
+}
+
+.marginAuto {
+    margin: auto;
+}
+
+.maxWidthLimit {
+    max-width: 500px;
+}
+
+.transparent {
+    opacity: 0;
+}
+
+/* URLs */
+
+a.url {
+    color: blue;
+    text-decoration: none
+}
+
+a:hover.url {
+    text-decoration: underline
+}
+
+/* Rich Text/Message Editor */
+
+.richTextEditor {
+}
+
+.richTextEditor tbody {
+    width: 100%;
+    display: table;
+}
+
+.richTextTitle {
+    margin-bottom: 5px;
+}
+
+.richTextTitle textarea {
+    height: 22px;
+    width: 99%;
+    margin: auto;
+    padding: 4px;
+    display: block;
+    border: 0px;
+    border-radius: 5px;
+}
+
+.richTextToolbar {
+    white-space: nowrap;
+    width: 100%;
+}
+
+.richTextArea {
+    width: 100%;
+    height: 250px;
+}
+
+.richTextWysiwyg {
+    min-height: 50px;
+    background-color: white;
+    border: 1px solid #a0a0a0;
+    border-radius: 5px;
+    display: block;
+    font-size: larger;
+    white-space: pre;
+}
+
+.richTextSyntaxLabel {
+    text-align: right;
+    margin: 14px 0px 0px 14px;
+    font-size: 12px;
+}
+
+.richTextToolButton {
+    cursor: pointer;
+    width:26px;
+    height:26px;
+    vertical-align: middle;
+    margin: 2px 1px;
+    border-radius: 5px 5px 5px 5px;
+    -webkit-box-shadow: 0px 1px 4px #000;
+    box-shadow: 0px 1px 4px #000;
+    border: none; 
+    -webkit-transition: color 0.2s linear; 
+    transition: color 0.2s linear;
+}
+
+.richTextIcon {
+    width:16px;
+    height:16px;
+    vertical-align: middle;
+}
+
+/* List panel */
+
+.itemButtonCell {
+    width:55px;
+}
+
+.itemKeyMenu {
+}
+
+.itemKey {
+    cursor: pointer;
+    border-radius: 5px;
+    width: 50px;
+}
+
+.listItem {
+}
+
+.listItem-box {
+    cursor: pointer;
+    width: auto;
+    border: 1px solid #87B3FF;
+    border-radius: 5px 5px 5px 5px;
+    -webkit-box-shadow: inset 0px 1px 0px rgba(135, 179, 255, 0.6);
+    box-shadow: inset 0px 1px 2px rgba(135, 179, 255, 0.6);
+    padding: 2px 1px;
+}
+
+.listItem-box-invalid {
+    border: 1px solid rgb(255, 0, 0);
+    -webkit-box-shadow: inset 0px 1px 0px rgba(255, 0, 0, 0.6);
+    box-shadow: inset 0px 1px 0px rgba(255, 0, 0, 0.6);
+}
+
+.listItem-button {
+    cursor: pointer;
+    margin: 0px;
+    padding: 0px;
+    border: none;
+    background: transparent;
+}
+
+.listItem-button span {
+    color: red;
+}
+
+/* Popup (context) menu */
+
+.popupMenuItem {
+    cursor: pointer;
+    border-radius: 5px;
+    width: 100%;
+}
+
+/* Contact group manager */
+
+.contactGroupEditor {
+    width: 680px !important;
+}
+
+.contactGroupManager {
+    width: 400px !important;
+    height: 300px !important;
+    margin: 20px 0px;
+}
+
+.contactGroupRoster {
+    width: 280px !important;
+    height: 300px !important;
+    margin: 20px 0px;
+}
+
+.addContactGroupPanel {
+   
+}
+
+.listPanel {
+    vertical-align:top;
+    padding: 10px 0px;
+}
+
+.listPanel.dragover {
+    border-radius: 5px !important;
+    background: none repeat scroll 0% 0% rgb(135, 179, 255) !important;
+    border: 1px dashed rgb(35,79,255) !important;
+}
+
+.toggleAssignedContacts {
+    white-space: nowrap;
+}
+
+.listManager-button-cell {
+    vertical-align: top;
+    padding: 10px 0px;
+    width: 55px;
+    white-space: top;
+}
+
+.listManager-button-cell .group {
+    border: 0px;
+	margin: 0px 5px;
+}
+
+.tagsPanel-main {
+    margin-bottom: 10px;
+}
+
+.tagsPanel-tags {
+    padding: 0px;
+    display: flex;
+    flex-wrap: wrap;
+}
+
+/* Room and contacts chooser */
+
+.room-contact-chooser {
+    width:380px;
+}
+
+/* StackPanel */
+
+.gwt-StackPanel {
+}
+
+.gwt-StackPanel .gwt-StackPanelItem {
+    background-color: #222;
+    background: -webkit-gradient(linear, left top, left bottom, from(#888888), to(#666666));
+    background: -webkit-linear-gradient(top, #888888, #666666);
+    background: linear-gradient(to bottom, #888888, #666666);
+    text-decoration: none;    
+    font-weight: bold;
+    height: 100%;
+    color: #e7e5e5;
+    padding: 3px 15px;
+    border-radius: 1em 1em 1em 1em;
+    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4); 
+    -webkit-transition: color 0.2s linear; 
+    transition: color 0.2s linear;
+}
+
+.gwt-StackPanel .gwt-StackPanelItem:hover {
+    background-color: #eee;
+    background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#aaa));
+    background: -webkit-linear-gradient(top, #eee, #aaa);
+    background: linear-gradient(to bottom, #eee, #aaa);
+    color: #444;
+    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);    
+    cursor: pointer;
+}
+
+.gwt-StackPanel .gwt-StackPanelItem-selected {
+    background-color: #eee;
+    background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#aaa));
+    background: -webkit-linear-gradient(top, #eee, #aaa);
+    background: linear-gradient(to bottom, #eee,#aaa);
+    color: #444;
+    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);    
+    cursor: pointer;
+}
+
+/* Caption Panel */
+
+.gwt-CaptionPanel {
+    overflow: auto;
+    background-color: #fff;
+    border-radius: 5px 5px 5px 5px;
+    padding: 3px 5px 3px 5px;
+    margin: 10px 5px 10px 5px;
+    color: #444;
+    font-size: 1em;
+    border: solid 1px gray;
+}
+
+/* Radio buttons */
+
+.gwt-RadioButton {
+    white-space: nowrap;
+}
+
+[contenteditable="true"] {
+}
+
+/* XMLUI styles */
+
+.AdvancedListSelectable tr{
+    cursor: pointer;
+}
+
+.AdvancedListSelectable tr:hover{
+    background: none repeat scroll 0 0 #EE0000;
+}
+
+.line hr {
+
+}
+
+.dot hr {
+    height: 0px;
+    border-top: 1px dotted;
+    border-bottom: 0px;
+}
+
+.dash hr {
+    height: 0px;
+    border-top: 1px dashed;
+    border-bottom: 0px;
+}
+
+.plain hr {
+    height: 10px;
+    color: black;
+    background-color: black;
+}
+
+.blank hr {
+    border: 0px;
+}
+
+
+/* Some CSS to style the quote XHTML generated by Movim */
+
+.mb_entry_dialog .bubble div.quote {
+    display: block;
+    border-radius: 2px;
+    border: 1px solid rgba(0, 0, 0, 0.12);
+    padding: 2rem;
+    box-sizing: border-box;
+}
+
+.mb_entry_dialog .bubble div.quote:before,
+.mb_entry_dialog .bubble div.quote:after {
+    content: '';
+    display: none;
+}
+
+.mb_entry_dialog .bubble div.quote ul {
+    display: flex;
+    flex-flow: row wrap;
+}
+
+.mb_entry_dialog .bubble div.quote li {
+    flex: 1 25%;
+    list-style-type: none;
+    padding-left: 0;
+}
+
+.mb_entry_dialog .bubble div.quote ul li > * {
+    margin-right: 1rem;
+}
+
+.mb_entry_dialog .bubble div.quote li:first-child {
+    flex: 1 75%;
+}
+
+@media screen and (max-width: 1024px) {
+    .mb_entry_dialog .bubble div.quote li {
+        flex: 1 100%;
+    }
+}
+
+.mb_entry_dialog .bubble div.quote li img {
+    max-height: 10rem;
+    max-width: 100%;
+    float: right;
+}
+
+.parameters {
+}
+
+.parameters .xmlui-JidsListWidget {
+    height: auto;
+}