diff -r 000000000000 -r bca7a7e058a3 src/pyams_skin/resources/less/apps/chat.less
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/pyams_skin/resources/less/apps/chat.less	Thu Feb 13 11:43:31 2020 +0100
@@ -0,0 +1,344 @@
+/*
+ * Chat application
+ */
+
+#chat-container {
+	position: absolute;
+	width: 250px;
+	height: 270px;
+	z-index: 2;
+	border-left: 1px solid #CDCECF;
+	right: -251px;
+	top: 0;
+	background: #fff;
+	transition-duration: .25s;
+	-webkit-transition-duration: .25s;
+
+	&:hover,
+	&:hover .chat-list-open-close {
+		border-color: #A7A7A7;
+	}
+	*,
+	:after,
+	:before {
+		box-sizing: content-box;
+		-moz-box-sizing: content-box;
+		-webkit-box-sizing: content-box;
+	}
+	input[type=text] {
+		box-sizing: border-box;
+		-moz-box-sizing: border-box;
+		-webkit-box-sizing: border-box;
+	}
+	&.open {
+		right: 0;
+		top: 0;
+
+		.chat-list-open-close i:before {
+			content: "\f00d"!important;
+		}
+		.chat-list-open-close b {
+			display: none;
+		}
+	}
+	.chat-list-open-close {
+		display: block;
+		width: 25px;
+		height: 25px;
+		border: 1px solid #CDCECF;
+		border-right: 1px solid #f2f4f8!important;
+		position: absolute;
+		left: -32px;
+		top: 7%;
+		border-radius: 50% 0 0 50%;
+		padding: 3px 1px 3px 5px;
+		font-size: 21px;
+		line-height: 22px;
+		cursor: pointer;
+		color: #868686;
+		-webkit-box-shadow: inset 0 .2em 0 rgba(0, 0, 0, .05);
+		box-shadow: inset 0 .2em 0 rgba(0, 0, 0, .05);
+		background: #f2f4f8;
+		text-align: center;
+
+		b {
+			position: absolute;
+			right: 0;
+			background: #ed1c24;
+			line-height: 9px;
+			height: 10px;
+			width: 10px;
+			top: 3px;
+			border: 1px solid #FFF;
+			border-radius: 3px;
+			font-size: 9px;
+			text-align: center;
+			vertical-align: middle;
+			color: #fff;
+			font-weight: 400;
+		}
+	}
+	.chat-list-body {
+		height: 217px;
+		overflow-y: scroll;
+		overflow-x: hidden;
+		display: block;
+		padding: 0;
+		box-sizing: border-box;
+		-webkit-box-sizing: border-box;
+		-moz-box-sizing: border-box;
+		background: #f2f4f8;
+	}
+	#chat-users {
+		list-style: none;
+		margin: 10px 0;
+		padding: 0;
+
+		li {
+			margin-bottom: 3px;
+			margin-left: 5px;
+
+			a {
+				display: block;
+				font-size: 13px;
+				color: #3d3d3d;
+				text-decoration: none!important;
+				box-sizing: border-box;
+				-webkit-box-sizing: border-box;
+				-moz-box-sizing: border-box;
+				padding: 3px 8px 3px 3px;
+				line-height: 33px;
+				vertical-align: middle;
+
+				&:hover {
+					background: #e0e4ee;
+				}
+				img {
+					width: 33px;
+					height: auto;
+					margin-right: 10px;
+				}
+				i {
+					color: #ACACAC;
+					font-size: 8px;
+					line-height: 34px;
+					font-style: normal;
+
+					&.last-online {
+						font-size: 12px;
+						letter-spacing: -1px;
+					}
+				}
+			}
+		}
+	}
+	.chat-list-footer {
+		overflow: hidden;
+		border-top: 1px solid #CCC;
+		padding: 10px;
+		box-sizing: border-box;
+		-webkit-box-sizing: border-box;
+		-moz-box-sizing: border-box;
+
+		input[type=text] {
+			border: 1px solid #bababa!important;
+		}
+	}
+	.control-group {
+		padding: 0;
+	}
+}
+
+.chat-body {
+	background: #FAFAFA;
+	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJod…EiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fafafa), color-stop(100%, #fff));
+	background: -webkit-linear-gradient(top, #fafafa 0, #fff 100%);
+	background: -webkit-gradient(linear, top left, bottom left, from(#f5fcff), to(#fff));
+	background: -webkit-linear-gradient(top, #f5fcff 0, #fff 100%);
+	background: linear-gradient(to bottom, #f5fcff 0, #fff 100%);
+	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fafafa',  endColorstr='#ffffff',  GradientType=0);
+	-webkit-box-shadow: inset 2px 2px 5px rgba(0, 0, 0, .04);
+	box-shadow: inset 2px 2px 5px rgba(0, 0, 0, .04);
+	display: block;
+	min-height: 270px;
+	overflow-y: scroll;
+	overflow-x: hidden;
+	padding: 10px;
+	box-sizing: border-box;
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	border: 1px solid #fff;
+	border-top: 0;
+
+	ul {
+		margin: 0;
+		padding: 0;
+	}
+	li {
+		&.message {
+			display: block;
+			position: relative;
+			padding: 10px;
+			margin: 2px;
+
+			&:hover {
+				background-color: #eee;
+			}
+			&.request,
+			&.request:hover {
+				background-color: #e4e4e4;
+			}
+			img,
+			.img {
+				display: inline-block;
+				border-left: 4px solid transparent;
+				position: absolute;
+
+				&.online {
+					border-left-color: #00a300;
+				}
+				&.offline {
+					border-left-color: #ddd;
+				}
+				&.busy {
+					border-left-color: #A90329;
+				}
+				&.away {
+					border-left-color: #ffc40d;
+				}
+			}
+			.img {
+				width: 35px;
+				padding-top: 7px;
+				text-align: center;
+			}
+			.message-text {
+				display: inline-block;
+				vertical-align: top;
+				box-sizing: border-box;
+				-webkit-box-sizing: border-box;
+				-moz-box-sizing: border-box;
+				padding: 0;
+				margin-left: 50px;
+				line-height: normal;
+
+				time {
+					font-size: 13px;
+					font-weight: normal;
+					color: #666;
+				}
+				.chat-file {
+					display: block;
+					margin: 3px 0;
+					padding: 4px;
+					border: 1px dotted #ddd;
+					background: rgba(0, 0, 0, .05);
+					border-radius: 4px;
+					text-align: right;
+					box-sizing: border-box;
+					-webkit-box-sizing: border-box;
+					-moz-box-sizing: border-box;
+
+					&:nth-child(3) {
+						margin-top: 15px;
+					}
+					&.row-fluid [class*=span] {
+						min-height: 10px!important;
+					}
+					b {
+						font-style: italic;
+						white-space: nowrap;
+						width: 250px;
+						overflow: hidden;
+						text-overflow: ellipsis;
+						text-align: left;
+
+						@media (min-width:768px) and (max-width:880px) {
+							width: 150px;
+						}
+						@media only screen and (min-width:320px) and (max-width:479px) {
+							width: 150px;
+						}
+						@media (max-width:480px) {
+							width: 150px;
+						}
+					}
+				}
+				.username {
+					display: block;
+					font-weight: 700;
+					margin-bottom: 4px;
+					vertical-align: top;
+					line-height: 14px;
+					font-size: 14px;
+					text-decoration: none!important;
+				}
+			}
+		}
+	}
+}
+
+.chat-footer {
+	border-top: 1px solid rgba(0, 0, 0, .1);
+	background: rgba(248, 248, 248, .9);
+	padding: 0 10px 15px;
+	position: relative;
+	box-sizing: border-box;
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+}
+
+.profile-message {
+	background: none!important;
+	height: auto!important;
+	box-shadow: none!important;
+	-webkit-box-shadow: none!important;
+	overflow: hidden;
+
+	li.message.message-reply {
+		margin-left: 85px!important;
+		background: #F7F7F7;
+		padding: 10px;
+		margin: 3px 0 0 20px;
+
+		img {
+			width: 35px!important;
+		}
+		.message-text {
+			margin-left: 45px!important;
+		}
+	}
+	.wall-comment-reply {
+		margin-left: 85px;
+		margin-bottom: 20px;
+	}
+}
+
+.cajita img {
+	width: 23px;
+	height: 23px;
+	padding-left: 3px;
+	padding-top: 3px;
+}
+
+#pageslide {
+	display: none;
+	position: absolute;
+	position: fixed;
+	top: 0;
+	height: 100%;
+	z-index: 999999;
+	width: 305px;
+	padding: 20px;
+	background-color: #004d60;
+	color: #FFF;
+	-webkit-box-shadow: inset 0 0 5px 5px #222;
+	-moz-shadow: inset 0 0 0 0 #222;
+	box-shadow: inset 0 0 0 0 #222;
+}
+
+.purehtml {
+	color: #fff;
+	font-size: 16px;
+}