diff -r 000000000000 -r bca7a7e058a3 src/pyams_skin/resources/less/content.less
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/pyams_skin/resources/less/content.less	Thu Feb 13 11:43:31 2020 +0100
@@ -0,0 +1,1446 @@
+
+/*
+ * Contents styles
+ */
+
+h1,
+h2,
+h3,
+h4 {
+	margin: 0;
+	font-family: "Ubuntu-Bold", Arial, Helvetica, Sans-Serif;
+	font-weight: 300;
+}
+
+h1 {
+	letter-spacing: -1px;
+	font-size: 24px;
+	margin: 10px 0;
+}
+
+h1 small {
+	font-size: 18px;
+	font-weight: 300;
+	letter-spacing: -1px;
+}
+
+h2 {
+	letter-spacing: -1px;
+	font-size: 22px;
+	margin: 20px 0 15px;
+	line-height: normal;
+}
+
+h3 {
+	display: block;
+	font-size: 19px;
+	font-weight: 400;
+	margin: 16px 0 10px;
+	line-height: normal;
+}
+
+h4 {
+	line-height: normal;
+	font-size: 17px;
+	font-weight: 300;
+	margin: 12px 0 8px;
+}
+
+h5 {
+	font-size: 15px;
+	font-weight: 300;
+	margin: 10px 0 6px;
+	line-height: normal;
+}
+
+h6 {
+	font-size: 14px;
+	margin: 10px 0 4px;
+	font-weight: 300;
+	line-height: normal;
+}
+
+hr {
+	.simple {
+		margin-top: 10px;
+		margin-bottom: 10px;
+		border-style: dashed;
+	}
+	&.noborder {
+		border: 0;
+	}
+}
+
+li.nodot {
+	list-style-type: none;
+}
+
+img {
+	&.online {
+		border-left-color: #40ac2b!important;
+	}
+	&.busy {
+		border-left-color: #ed1c24!important;
+	}
+	&.offline {
+		border-left-color: #ddd!important;
+	}
+	&.away {
+		border-left-color: #ffc40d!important;
+	}
+}
+
+pre {
+	padding: 5px!important;
+	font-size: 12px;
+	line-height: 1.2em;
+}
+pre:empty {
+	border: 0;
+}
+
+[data-ams-url],
+[data-ams-click-handler] {
+	cursor: pointer;
+}
+
+label {
+	font-weight: 400;
+}
+
+article {
+	&.sortable-grid {
+		min-height: 30px;
+	}
+}
+
+.caret {
+	border-top: 5px solid;
+	border-right: 5px solid transparent;
+	border-left: 5px solid transparent;
+}
+
+.fixed {
+	position: fixed;
+}
+.xs-fixed {
+	@media (max-width: 768px) {
+		position: fixed;
+	}
+}
+.sm-fixed {
+	@media (min-width: 768px) and (max-width: 992px) {
+		position: fixed;
+	}
+}
+.md-fixed {
+	@media (min-width: 992px) and (max-width: 1200px) {
+		position: fixed;
+	}
+}
+.lg-fixed {
+	@media (min-width: 1200px) {
+		position: fixed;
+	}
+}
+
+.outside {
+	position: absolute;
+	left: -9999px;
+}
+
+.visible-tablet {
+	@media (max-width:979px) {
+		display: inline-block!important;
+	}
+}
+
+.hidden-tablet {
+	&,
+	.display-inline& {
+		@media (max-width:979px) {
+			display: none!important;
+		}
+	}
+	@media only screen and (min-width:0) and (max-width:679px) {
+		display: none!important;
+	}
+}
+
+.visible-mobile {
+	@media only screen and (min-width:320px) and (max-width:479px) {
+		display: inline-block!important;
+	}
+}
+
+.hidden-mobile {
+	@media only screen and (min-width:320px) and (max-width:479px) {
+		display: none!important;
+	}
+}
+
+.viewport {
+	&-y {
+		overflow-y: auto;
+
+		&-none {
+			overflow-y: hidden!important;
+		}
+		&.viewport-100 {
+			max-height: 100px;
+		}
+		&.viewport-200 {
+			max-height: 200px;
+		}
+		&.viewport-300 {
+			max-height: 300px;
+		}
+		&.viewport-600 {
+			max-height: 600px;
+		}
+		&.viewport-400 {
+			max-height: 400px;
+		}
+		&.viewport-500 {
+			max-height: 500px;
+		}
+		&.viewport-600 {
+			max-height: 600px;
+		}
+	}
+	&-x {
+		overflow-x: auto;
+
+		&-none {
+			overflow-x: hidden!important;
+		}
+		&.viewport-100 {
+			max-width: 100px;
+		}
+		&.viewport-200 {
+			max-width: 200px;
+		}
+		&.viewport-300 {
+			max-width: 300px;
+		}
+		&.viewport-400 {
+			max-width: 400px;
+		}
+		&.viewport-500 {
+			max-width: 500px;
+		}
+		&.viewport-600 {
+			max-width: 600px;
+		}
+	}
+}
+
+.lead {
+	font-size: 19px;
+}
+
+.alert {
+	margin-bottom: 20px;
+	margin-top: 0;
+	color: #675100;
+	border-width: 0;
+	border-left-width: 5px;
+	padding: 10px;
+	border-radius: 0;
+
+	.close {
+		top: 0;
+		right: -5px;
+		line-height: 20px;
+	}
+	&-heading {
+		font-weight: 600;
+	}
+	&-danger {
+		border-color: #963b49;
+		color: #fff;
+		background: #c46a69;
+		text-shadow: none;
+	}
+	&-warning {
+		border-color: #e5c693;
+		color: #6b6d31;
+		background: #ecdfb0;
+	}
+	&-success {
+		border-color: #8eb589;
+		color: #296829;
+		background: #cee0cf;
+	}
+	&-info {
+		border-color: #9cb4c5;
+		color: #346597;
+		background: #d6dde7;
+	}
+	ul {
+		margin-left: 25px;
+		list-style-position: outside;
+		list-style-type: square;
+	}
+	.ams-form >& {
+		margin: 5px;
+		padding: 5px;
+		box-shadow: none!important;
+		-webkit-box-shadow: none!important;
+		border-radius: 0!important;
+	}
+}
+
+.help {
+	font-size: 90%;
+	padding: 5px!important;
+
+	p {
+		margin: 0 0 1px;
+		line-height: 1.15;
+	}
+	.modal-dialog & {
+		margin-bottom: 5px!important;
+
+		@media only screen and (max-height: 768px) {
+			display: none;
+		}
+	}
+}
+
+.well {
+	background: #fbfbfb;
+	border: 1px solid #ddd;
+	box-shadow: 0 1px 1px #ececec;
+	-webkit-box-shadow: 0 1px 1px #ececec;
+	position: relative;
+
+	&.well-clean {
+		-webkit-box-shadow: none;
+		box-shadow: none;
+		border-color: transparent;
+	}
+	&.well-glass {
+		-webkit-box-shadow: none;
+		box-shadow: none;
+		border-color: transparent;
+		background-color: rgba(255, 255, 255, .25);
+		color: #fff;
+	}
+	&.well-light {
+		background: #fff;
+		border: 1px solid #e2e2e2;
+	}
+	.widget-body & {
+		margin-bottom: 0;
+	}
+	&.transparent {
+		border: 0!important;
+		background: none!important;
+	}
+	.ams-widget&.transparent >div,
+	.ams-widget&.transparent >div .widget-body {
+		padding: 0!important;
+	}
+	&[class*=" bg-"],
+	&[class^=bg-] {
+		border: 1px solid #555!important;
+	}
+}
+
+.note {
+	margin-top: 6px;
+	padding: 0 1px;
+	font-size: 11px;
+	line-height: 15px;
+	color: #999;
+}
+
+.subscript {
+	font-size: 21px;
+	color: #999;
+}
+
+.display-image {
+	margin-top: -60px;
+	margin-right: 20px;
+}
+
+.terms-body {
+	max-height: 400px;
+	overflow: auto;
+}
+
+.timeline-seperator {
+	display: block;
+	text-align: center;
+	color: #999;
+	margin: 20px 0 0;
+
+	>:first-child {
+		padding: 4px 5px;
+		border: 1px dashed rgba(0, 0, 0, .1);
+		background: #fff;
+		font-size: 11px;
+		border-radius: 4px;
+	}
+	.btn,
+	.btn+.dropdown-menu {
+		margin-right: 15px;
+	}
+	&:after {
+		display: block;
+		content: " ";
+		margin: 0 20px;
+		border-bottom: 1px dashed rgba(0, 0, 0, .1);
+		margin-top: -8px;
+	}
+}
+
+.progress {
+	position: relative;
+	margin-bottom: 20px;
+	overflow: hidden;
+	height: 22px;
+	background: #eee;
+	box-shadow: 0 1px 0 transparent, 0 0 0 1px #e3e3e3 inset;
+	-webkit-box-shadow: 0 1px 0 transparent, 0 0 0 1px #e3e3e3 inset;
+	border-radius: 0;
+
+	input[type="text"] + & {
+		height: 7px;
+	}
+	&-bar {
+		float: left;
+		width: 0;
+		height: 100%;
+		font-size: 11px;
+		color: #fff;
+		text-align: center;
+		background-color: #57889c;
+		-webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
+		box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
+		font-weight: 700;
+		text-shadow: 0 -1px 0 rgba(0, 0, 0, .25);
+		background-image: url(../img/pattern/overlay-pattern.png);
+
+		.progress-striped & {
+			background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255, 255, 255, .15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .15)), color-stop(.75, rgba(255, 255, 255, .15)), color-stop(.75, transparent), to(transparent));
+			background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
+			background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
+			background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
+			-webkit-background-size: 40px 40px;
+			background-size: 40px 40px;
+		}
+	}
+	&.active &-bar {
+		-webkit-animation: progress-bar-stripes 2s linear infinite;
+		-ms-animation: progress-bar-stripes 2s linear infinite;
+		animation: progress-bar-stripes 2s linear infinite;
+	}
+	&-bar-danger {
+		background-color: #a90329;
+	}
+	&-striped &-bar-danger {
+		background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255, 255, 255, .15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .15)), color-stop(.75, rgba(255, 255, 255, .15)), color-stop(.75, transparent), to(transparent));
+		background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
+		background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
+		background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
+	}
+	&-bar-success {
+		background-color: #739e73;
+	}
+	&-striped &-bar-success {
+		background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255, 255, 255, .15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .15)), color-stop(.75, rgba(255, 255, 255, .15)), color-stop(.75, transparent), to(transparent));
+		background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
+		background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
+		background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
+	}
+	&-bar-warning {
+		background-color: #c79121;
+	}
+	&-striped &-bar-warning {
+		background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255, 255, 255, .15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .15)), color-stop(.75, rgba(255, 255, 255, .15)), color-stop(.75, transparent), to(transparent));
+		background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
+		background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
+		background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
+	}
+	&-bar-info {
+		background-color: #57889c;
+	}
+	&-striped &-bar-info {
+		background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255, 255, 255, .15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .15)), color-stop(.75, rgba(255, 255, 255, .15)), color-stop(.75, transparent), to(transparent));
+		background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
+		background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
+		background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
+	}
+	.bar-info,
+	&-info .bar {
+		background: #57889c;
+	}
+	&-micro {
+		height: 3px!important;
+		line-height: 3px!important;
+	}
+	&-xs {
+		height: 7px!important;
+		line-height: 7px!important;
+	}
+	&-sm {
+		height: 14px!important;
+		line-height: 14px!important;
+	}
+	&-lg {
+		height: 30px!important;
+		line-height: 30px!important;
+	}
+	.progress-bar {
+		position: absolute;
+		overflow: hidden;
+		line-height: 20px;
+	}
+	.progressbar-back-text {
+		position: absolute;
+		width: 100%;
+		height: 100%;
+		font-size: 12px;
+		line-height: 20px;
+		text-align: center;
+	}
+	.progressbar-front-text {
+		display: block;
+		width: 100%;
+		font-size: 12px;
+		line-height: 20px;
+		text-align: center;
+	}
+	&.right {
+		.progress-bar {
+			right: 0;
+		}
+		.progressbar-front-text {
+			position: absolute;
+			right: 0;
+		}
+	}
+	&.vertical {
+		width: 25px;
+		height: 100%;
+		min-height: 150px;
+		margin-right: 20px;
+		display: inline-block;
+		margin-bottom: 0;
+
+		&.bottom {
+			position: relative;
+
+			.progress-bar {
+				position: absolute;
+				bottom: 0;
+			}
+			.progressbar-front-text {
+				position: absolute;
+				bottom: 0;
+			}
+		}
+		.progress-bar {
+			width: 100%;
+			height: 0;
+			-webkit-transition: height .6s ease;
+			transition: height .6s ease;
+		}
+	}
+	&.wide-bar {
+		width: 40px;
+	}
+}
+
+.dd {
+	position: relative;
+	display: block;
+	margin: 0;
+	padding: 0;
+	max-width: 600px;
+	list-style: none;
+	font-size: 13px;
+	line-height: 20px;
+
+	@media only screen and (min-width:700px) {
+		float: left;
+		width: 100%;
+
+		+.dd {
+			margin-left: 2%;
+		}
+	}
+	&-header.calender-spacer {
+		height: 46px;
+		display: block;
+	}
+	&-list {
+		display: block;
+		position: relative;
+		margin: 0;
+		padding: 0;
+		list-style: none;
+
+		.dd-list {
+			padding-left: 30px;
+		}
+		.dd-collapsed & {
+			display: none;
+		}
+	}
+	&-empty {
+		border: 1px dashed #bbb;
+		min-height: 100px;
+		background-color: #eee;
+		background-image: -webkit-linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff), -webkit-linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff);
+		background-image: -webkit-linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff), -webkit-linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff);
+		background-image: linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff), linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff);
+		-webkit-background-size: 60px 60px;
+		background-size: 60px 60px;
+		background-position: 0 0, 30px 30px;
+	}
+	&-empty,
+	&-placeholder {
+		margin: 5px 0;
+		padding: 0;
+		min-height: 30px;
+		background: #f2fbff;
+		border: 1px dashed #b6bcbf;
+		-webkit-box-sizing: border-box;
+		box-sizing: border-box;
+		-moz-box-sizing: border-box;
+	}
+	&-empty,
+	&-item,
+	&-placeholder {
+		display: block;
+		position: relative;
+		margin: 0;
+		padding: 0;
+		min-height: 20px;
+		font-size: 13px;
+		line-height: 20px;
+	}
+	&-handle {
+		display: block;
+		font-size: 15px;
+		margin: 5px 0;
+		padding: 7px 15px;
+		color: #333;
+		text-decoration: none;
+		border: 1px solid #cfcfcf;
+		background: #fbfbfb;
+
+		&:hover,
+		&:hover+.dd-list .dd-handle {
+			background: #FDDFB3!important;
+			border: 1px solid #FAA937;
+			color: #333!important;
+		}
+		& >span {
+			font-size: 13px;
+			color: #777;
+		}
+		.dd-hover >& {
+			background: #2ea8e5!important;
+		}
+	}
+	&-item {
+		>button {
+			position: relative;
+			cursor: pointer;
+			float: left;
+			width: 25px;
+			height: 20px;
+			margin: 7px 10px;
+			line-height: 22px!important;
+			padding: 0;
+			text-indent: 100%;
+			white-space: nowrap;
+			overflow: hidden;
+			border: 0;
+			background: rgba(0, 0, 0, 0);
+			text-align: center;
+			display: inline-block;
+			font-family: FontAwesome;
+			font-style: normal;
+			font-weight: 400;
+			-webkit-font-smoothing: antialiased;
+			-moz-osx-font-smoothing: grayscale;
+			font-size: 18px;
+
+			&:before {
+				content: '\f055';
+				display: block;
+				position: absolute;
+				width: 100%;
+				text-align: center;
+				text-indent: 0;
+				color: #0091d9;
+			}
+			&[data-action=collapse]:before {
+				content: '\f056';
+				color: #a90329;
+			}
+		}
+	}
+	&-dragel {
+		position: absolute;
+		pointer-events: none;
+		z-index: 9999;
+
+		>.dd-item .dd-handle {
+			margin-top: 0;
+		}
+		>.dd-item >.dd-handle {
+			border-left-width: 4px;
+		}
+		.dd-handle {
+			-webkit-box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, .1);
+			box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, .1);
+		}
+		>li.dd-item.dd3-item {
+			position: relative;
+			top: 10px;
+			left: 10px;
+			z-index: 999;
+		}
+	}
+}
+
+.vertical-bars {
+	padding: 0;
+	margin: 0;
+
+	&:after {
+		content: "";
+		display: block;
+		height: 0;
+		clear: both;
+	}
+	li {
+		padding: 14px 0;
+		width: 25%;
+		display: block;
+		float: left;
+		text-align: center;
+
+		&:first-child {
+			border-left: 0;
+		}
+	}
+	>li>.progress.vertical {
+		margin: 0 auto;
+		float: none;
+
+		&:first-child {
+			margin-left: auto;
+		}
+	}
+}
+
+.bar-holder {
+	padding: 18px 15px;
+
+	&:first-child {
+		border-top: 0;
+	}
+	.progress {
+		margin: 0;
+	}
+}
+
+.pagination {
+	&.pagination-alt >li >a {
+		box-shadow: none;
+		-webkit-box-shadow: none;
+		border: 0;
+		margin-left: -1px;
+	}
+	&.pagination-alt >li:first-child >a {
+		padding-left: 0;
+	}
+	>li >a,
+	>li >span {
+		padding: 7px 12px 5px;
+		box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .05);
+		-webkit-box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .05);
+	}
+	&-xs>li>a,
+	&-xs>li>span {
+		padding: 5px 9px 3px;
+		font-size: 12px;
+	}
+}
+
+.panel {
+	&-purple {
+		border-color: #6e587a;
+
+		>.panel-heading {
+			color: #fff;
+			background-color: #6e587a;
+			border-color: #6e587a;
+		}
+	}
+	&-greenLight {
+		border-color: #71843f;
+
+		>.panel-heading {
+			color: #fff;
+			background-color: #71843f;
+			border-color: #71843f;
+		}
+	}
+	&-greenDark {
+		border-color: #496949;
+
+		>.panel-heading {
+			color: #fff;
+			background-color: #496949;
+			border-color: #496949;
+		}
+	}
+	&-darken {
+		border-color: #333;
+
+		>.panel-heading {
+			color: #fff;
+			background-color: #404040;
+			border-color: #404040;
+		}
+	}
+	&-pink {
+		border-color: #ac5287;
+
+		>.panel-heading {
+			color: #fff;
+			background-color: #ac5287;
+			border-color: #ac5287;
+		}
+	}
+	&-green {
+		border-color: #356e35;
+
+		>.panel-heading {
+			color: #fff;
+			background-color: #356e35;
+			border-color: #356e35;
+		}
+	}
+	&-blueLight {
+		border-color: #92a2a8;
+
+		>.panel-heading {
+			color: #fff;
+			background-color: #92a2a8;
+			border-color: #92a2a8;
+		}
+	}
+	&-pinkDark {
+		border-color: #a8829f;
+
+		>.panel-heading {
+			color: #fff;
+			background-color: #a8829f;
+			border-color: #a8829f;
+		}
+	}
+	&-redLight {
+		border-color: #a65858;
+
+		>.panel-heading {
+			color: #fff;
+			background-color: #a65858;
+			border-color: #a65858;
+		}
+	}
+	&-red {
+		border-color: #a90329;
+
+		>.panel-heading {
+			color: #fff;
+			background-color: #a90329;
+			border-color: #a90329;
+		}
+	}
+	&-teal {
+		border-color: #568a89;
+
+		>.panel-heading {
+			color: #fff;
+			background-color: #568a89;
+			border-color: #568a89;
+		}
+	}
+	&-orange {
+		border-color: #c79121;
+
+		>.panel-heading {
+			color: #fff;
+			background-color: #c79121;
+			border-color: #c79121;
+		}
+	}
+	&-blueDark {
+		border-color: #4c4f53;
+
+		>.panel-heading {
+			color: #fff;
+			background-color: #4c4f53;
+			border-color: #4c4f53;
+		}
+	}
+	&-magenta {
+		border-color: #6e3671;
+
+		>.panel-heading {
+			color: #fff;
+			background-color: #6e3671;
+			border-color: #6e3671;
+		}
+	}
+	&-blue {
+		border-color: #57889c;
+
+		>.panel-heading {
+			color: #fff;
+			background-color: #57889c;
+			border-color: #57889c;
+		}
+	}
+	&-footer >.btn-block {
+		border-radius: 0;
+		border-bottom: 0;
+		border-left: 0;
+		border-right: 0;
+	}
+}
+
+.notification-body {
+	padding: 0 0 0 3px;
+	margin: 0;
+	list-style: none;
+
+	*,
+	&:after *,
+	&:before * {
+		box-sizing: border-box!important;
+		-webkit-box-sizing: border-box!important;
+		-moz-box-sizing: border-box!important;
+	}
+	>li {
+		border-bottom: 1px solid #E9E9E9;
+		position: relative;
+
+		>span {
+			background: #fff;
+			display: block;
+			min-height: 25px;
+			overflow: hidden;
+			padding: 8px 8px 10px;
+			white-space: normal;
+
+			&:hover {
+				background: #F0F4F7;
+				color: #667F8F;
+			}
+			>a {
+				>span.msg-body,
+				>span.subject {
+					height: auto;
+					line-height: normal;
+				}
+			}
+		}
+		a.msg {
+			padding-left: 40px!important;
+		}
+		a,
+		a span {
+			display: block;
+			position: relative;
+			overflow: hidden;
+		}
+		a,
+		a:hover {
+			text-decoration: none;
+		}
+		&:hover .progress {
+			background: #fff;
+			box-shadow: 0 1px 0 rgba(0, 0, 0, 0), 0 0 0 1px #a7a7a7 inset;
+			-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0), 0 0 0 1px #ccc inset;
+		}
+		&:hover .text-muted {
+			color: #333;
+		}
+	}
+	.from {
+		font-size: 14px;
+		line-height: normal;
+		color: #333;
+		font-weight: 400;
+		margin-right: 60px;
+		margin-bottom: 3px;
+		height: 20px;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+		overflow: hidden;
+	}
+	.unread {
+		background: #FFFFE0;
+
+		.unread .from {
+			font-weight: 700;
+		}
+	}
+	time {
+		position: absolute;
+		top: 3px;
+		right: 0;
+		font-size: 11px;
+		font-weight: 400;
+		color: #058dc7;
+	}
+	.msg-body,
+	.subject {
+		font-size: 13px;
+		color: #A0A0A0;
+		max-height: 35px;
+		width: 100%;
+		//text-overflow: ellipsis;
+		//white-space: nowrap;
+		overflow: hidden;
+	}
+	.subject {
+		font-size: 13px;
+		color: #333;
+		max-height: 22px;
+	}
+}
+
+.ajax-notifications {
+	height: 365px;
+	display: block;
+	overflow: auto;
+	margin-right: -10px;
+	margin-left: -10px;
+	border-bottom: 1px solid #CECECE;
+	border-top: 1px solid #CECECE;
+	background: #E9E9E9;
+
+	@media only screen and (min-width:320px) and (max-width:479px) {
+		height: 250px;
+	}
+	>.alert.alert-transparent {
+		background-color: transparent;
+		border-color: transparent;
+		color: #757575;
+		margin: 13px 10px;
+	}
+	>.alert >:first-child {
+		margin-bottom: 10px;
+		font-weight: 400;
+	}
+}
+
+.arrow-box-up {
+	&:before,
+	&:after {
+		bottom: 100%;
+		border: solid transparent;
+		content: " ";
+		height: 0;
+		width: 0;
+		position: absolute;
+		pointer-events: none;
+	}
+	&:before {
+		border-color: rgba(131, 131, 131, 0);
+		border-bottom-color: #838383;
+		border-width: 8px;
+		left: 50%;
+		margin-left: -8px;
+	}
+	&:after {
+		border-color: rgba(255, 255, 255, 0);
+		border-bottom-color: #fff;
+		border-width: 7px;
+		left: 50%;
+		margin-left: -7px;
+	}
+	&-right:before,
+	&-right:after {
+		bottom: 100%;
+		border: solid transparent;
+		content: " ";
+		height: 0;
+		width: 0;
+		position: absolute;
+		pointer-events: none;
+	}
+	&-right:before {
+		border-color: rgba(131, 131, 131, 0);
+		border-bottom-color: #838383;
+		border-width: 8px;
+		right: 9px;
+		margin-left: -8px;
+	}
+	&-right:after {
+		border-color: rgba(255, 255, 255, 0);
+		border-bottom-color: #fff;
+		border-width: 7px;
+		right: 10px;
+		margin-left: -7px;
+	}
+}
+
+.tooltip-inner {
+	padding: 5px 10px;
+	font-size: 11px;
+	font-family: Ubuntu, Arial, Helvetica, sans-serif;
+	font-weight: 700;
+	border-radius: 0;
+}
+.jqstooltip {
+	padding: 7px!important;
+	border-radius: 3px!important;
+	border: 0!important;
+	background-color: #000!important;
+	box-sizing: content-box;
+	-moz-box-sizing: content-box;
+	-webkit-box-sizing: content-box;
+
+	.jqsfield {
+		font-family: Ubuntu, Arial, sans-serif;
+		font-size: 11px;
+	}
+}
+
+.dd3 {
+	&-content {
+		display: block;
+		margin: 5px 0;
+		padding: 6px 10px 8px 40px;
+		font-size: 15px;
+		color: #333;
+		text-decoration: none;
+		border: 1px solid #cfcfcf;
+		background: #fbfbfb;
+
+		&:hover {
+			color: #2ea8e5;
+			background: #fff;
+		}
+		.dd-dragel >.dd3-item >& {
+			margin: 0;
+		}
+	}
+	&-item >button {
+		margin-left: 38px;
+	}
+	&-handle {
+		position: absolute;
+		margin: 0;
+		left: 0;
+		top: 0;
+		cursor: move;
+		width: 30px;
+		text-indent: 100%;
+		white-space: nowrap;
+		overflow: hidden;
+		border: 1px solid #aaa;
+		background: #bfbfbf;
+		background: -webkit-linear-gradient(top, #ddd 0, #bbb 100%);
+		background: -webkit-gradient(linear, top left, bottom left, from(#ddd), to(#bbb));
+		background: -webkit-linear-gradient(top, #ddd 0, #bbb 100%);
+		background: linear-gradient(top, #ddd 0, #bbb 100%);
+		display: inline-block;
+		font-family: FontAwesome;
+		font-style: normal;
+		font-weight: 400;
+		line-height: 1;
+		-webkit-font-smoothing: antialiased;
+		-moz-osx-font-smoothing: grayscale;
+		font-size: 18px;
+		padding: 8px 15px;
+
+		&:before {
+			content: '\f0c9';
+			display: block;
+			position: absolute;
+			left: 0;
+			top: 3px;
+			width: 100%;
+			text-align: center;
+			text-indent: 0;
+			color: #818181;
+			font-weight: 400;
+			line-height: 28px;
+		}
+		&:hover:before {
+			color: #C27616;
+		}
+	}
+}
+
+
+/*
+ * Nestable lists
+ */
+
+.nestable-lists {
+	display: block;
+	clear: both;
+	padding: 30px 0;
+	width: 100%;
+	border: 0;
+	border-top: 2px solid #bfbfbf;
+	border-bottom: 2px solid #bfbfbf;
+}
+#nestable-menu {
+	padding: 0;
+	margin: 10px 0 20px;
+}
+
+#nestable-output,
+#nestable2-output {
+	width: 100%;
+	padding: 5px;
+}
+
+
+/*
+ * Custom items
+ */
+
+.custom-scroll {
+
+	&::-webkit-scrollbar {
+		-webkit-overflow-scrolling: touch;
+		height: 10px;
+		width: 10px;
+
+		&:hover {
+			background-color: #E9E9E9;
+			border: 1px solid #dbdbdb;
+		}
+		&-button:start:decrement,
+		&-button:end:increment {
+			background: 0 0;
+			display: block;
+			height: 0;
+		}
+		&-track {
+			-webkit-background-clip: padding-box;
+			background-clip: padding-box;
+			border: solid transparent;
+
+			&-piece {
+				-o-border-radius: 0;
+				background-color: transparent;
+				border-radius: 0;
+			}
+		}
+		&-thumb {
+			-webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1), inset 0 -1px 0 rgba(0, 0, 0, .07);
+			-webkit-background-clip: padding-box;
+			background-clip: padding-box;
+			background-color: rgba(0, 0, 0, .2);
+			border: 0;
+			box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1), inset 0 -1px 0 rgba(0, 0, 0, .07);
+
+			&:vertical,
+			&:horizontal {
+				-o-border-radius: 0;
+				background-color: #bfbfbf;
+				border-radius: 0;
+			}
+			&:active {
+				-webkit-box-shadow: inset 1px 1px 3px rgba(0, 0, 0, .33);
+				background-color: rgba(0, 0, 0, .44);
+				box-shadow: inset 1px 1px 3px rgba(0, 0, 0, .33);
+			}
+			&:hover {
+				background-color: #959595;
+			}
+		}
+	}
+}
+
+.air {
+	position: absolute;
+	z-index: 5;
+
+	&-bottom {
+		bottom: 0;
+	}
+	&-top {
+		top: 0;
+
+		&-right {
+			top: 0;
+			right: 0;
+		}
+		&-left {
+			top: 0;
+			left: 0;
+		}
+	}
+	&-bottom {
+		&-left {
+			bottom: 0;
+			left: 0;
+		}
+		&-right {
+			bottom: 0;
+			right: 0;
+		}
+	}
+}
+
+.tree {
+	min-height: 20px;
+	border-radius: 4px;
+
+	li {
+		list-style-type: none;
+		margin: 0;
+		padding: 3px 0 3px 5px;
+		position: relative;
+
+		&:after,
+		&:before {
+			content: '';
+			left: -10px;
+			position: absolute;
+			right: auto;
+		}
+		&:before {
+			border-left: 1px solid #999;
+			bottom: 50px;
+			height: 100%;
+			top: -5px;
+			width: 1px;
+			-webkit-transition: "border-color 0.1s ease 0.1s";
+			transition: "border-color 0.1s ease 0.1s";
+		}
+		&:last-child::before {
+			height: 20px;
+		}
+		&:after {
+			border-top: 1px solid #999;
+			height: 20px;
+			top: 14px;
+			width: 15px;
+		}
+		&:hover {
+			background: rgba(0, 0, 0, .15);
+		}
+		>span {
+			color: @textColor;
+			border: 1px solid #999;
+			border-radius: 5px;
+			display: inline-block;
+			padding: 4px 8px;
+			text-decoration: none;
+			-webkit-transition: color .2s ease .1s, background-color .2s ease .1s, border-color .3s ease .2s;
+			transition: color .2s ease .1s, background-color .2s ease .1s, border-color .3s ease .2s;
+
+			>i {
+				padding-right: 4px;
+			}
+		}
+		&.parent_li >span {
+			padding: 7px;
+		}
+		>span {
+			cursor: pointer;
+
+			&:hover,
+			&:hover + ul li >span {
+				background: #eee;
+				border: 1px solid #94a0b4;
+				color: #000;
+			}
+		}
+	}
+	ul {
+		ul {
+			padding-left: 24px;
+			padding-top: 5px;
+		}
+	}
+	>ul {
+		padding-left: 0;
+
+		>li {
+			&:after,
+			&:before {
+				border: 0;
+			}
+		}
+	}
+}
+
+.tree-node-padding {
+	display: inline-block;
+	width: 15px;
+}
+
+.pace {
+	-webkit-pointer-events: none;
+	pointer-events: none;
+	-webkit-user-select: none;
+	-moz-user-select: none;
+	-ms-user-select: none;
+	user-select: none;
+
+	&-inactive {
+		display: none;
+	}
+	.pace-progress {
+		background: #3276b1;
+		position: fixed;
+		z-index: 2000;
+		top: 0;
+		left: 0;
+		height: 2px;
+		-webkit-transition: width 1s;
+		transition: width 1s;
+
+		&-inner {
+			display: block;
+			position: absolute;
+			right: 0;
+			width: 100px;
+			height: 100%;
+			-webkit-box-shadow: 0 0 10px #29d, 0 0 5px #29d;
+			box-shadow: 0 0 10px #29d, 0 0 5px #29d;
+			opacity: 1;
+			-webkit-transform: rotate(3deg) translate(0, -4px);
+			-ms-transform: rotate(3deg) translate(0, -4px);
+			transform: rotate(3deg) translate(0, -4px);
+		}
+	}
+	.pace-activity {
+		display: block;
+		position: fixed;
+		z-index: 2000;
+		top: 63px;
+		right: 40px;
+		width: 14px;
+		height: 14px;
+		border: solid 2px transparent;
+		border-top-color: #29d;
+		border-left-color: #29d;
+		border-radius: 10px;
+		-webkit-animation: pace-spinner 400ms linear infinite;
+		-ms-animation: pace-spinner 400ms linear infinite;
+		animation: pace-spinner 400ms linear infinite;
+	}
+}
+