diff -r 000000000000 -r bca7a7e058a3 src/pyams_skin/resources/less/typo.less
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/pyams_skin/resources/less/typo.less	Thu Feb 13 11:43:31 2020 +0100
@@ -0,0 +1,945 @@
+/*
+ * Typos styles
+ */
+
+@font-face {
+	font-family: 'Ubuntu';
+	src: url('./fonts/Ubuntu-C.eot');
+	src: url('./fonts/Ubuntu-C.eot?#iefix') format('embedded-opentype'),
+		 url('./fonts/Ubuntu-C.woff') format('woff'),
+		 url('./fonts/Ubuntu-C.ttf') format('truetype'),
+		 url('./fonts/Ubuntu-C.svg') format('svg');
+	font-weight: normal;
+	font-style: normal;
+}
+
+@font-face {
+	font-family: 'Ubuntu-Light';
+	src: url('./fonts/Ubuntu-L.eot');
+	src: url('./fonts/Ubuntu-L.eot?#iefix') format('embedded-opentype'),
+		 url('./fonts/Ubuntu-L.woff') format('woff'),
+		 url('./fonts/Ubuntu-L.ttf') format('truetype'),
+		 url('./fonts/Ubuntu-L.svg') format('svg');
+	font-weight: normal;
+	font-style: normal;
+}
+
+@font-face {
+	font-family: 'Ubuntu-Bold';
+	src: url('./fonts/Ubuntu-B.eot');
+	src: url('./fonts/Ubuntu-B.eot?#iefix') format('embedded-opentype'),
+		 url('./fonts/Ubuntu-B.woff') format('woff'),
+		 url('./fonts/Ubuntu-B.ttf') format('truetype'),
+		 url('./fonts/Ubuntu-B.svg') format('svg');
+	font-weight: bold;
+	font-style: normal;
+}
+
+@font-face {
+	font-family: 'OpenSans';
+	src: url('./fonts/OpenSans-Regular.eot');
+	src: url('./fonts/OpenSans-Regular.eot?#iefix') format('embedded-opentype'),
+		 url('./fonts/OpenSans-Regular.woff2') format('woff2'),
+		 url('./fonts/OpenSans-Regular.woff') format('woff'),
+		 url('./fonts/OpenSans-Regular.ttf') format('truetype'),
+		 url('./fonts/OpenSans-Regular.svg') format('svg');
+	font-weight: normal;
+	font-style: normal;
+}
+
+html,
+body {
+	font-family: Ubuntu, Arial, Helvetica, sans-serif;
+}
+
+a:active,
+a:focus,
+a:hover,
+button,
+button:active,
+button:focus,
+embed,
+input::-moz-focus-inner,
+object {
+	outline: 0;
+}
+
+.hidden {
+	display: none;
+}
+.hidden-desktop {
+	display: none!important;
+}
+
+.no-visible {
+	visibility: hidden!important;
+}
+
+.pull-right {
+	float: right!Important;
+}
+.pull-left {
+	float: left!Important;
+}
+
+.align-top {
+	vertical-align: top!important;
+}
+.align-base {
+	vertical-align: baseline!important;
+}
+.align-middle {
+	vertical-align: middle!important;
+}
+
+.opacity-25 {
+	opacity: 0.25!important;
+}
+.opacity-50 {
+	opacity: 0.5!important;
+}
+.opacity-75 {
+	opacity: 0.75!important;
+}
+.opacity-100,
+.opaque {
+	opacity: 1!important;
+}
+
+.disabled {
+	color: #fff;
+	.btn-default& {
+		color: #999;
+	}
+}
+
+xmp {
+	overflow: auto;
+}
+
+.text-italic {
+	font-style: italic!important;
+}
+.text-dashed {
+	text-decoration: line-through;
+}
+.nowrap {
+	white-space: nowrap;
+}
+.truncated {
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
+}
+
+.no-space {
+	margin: 0;
+
+	>[class*=col-] {
+		margin: 0!important;
+		padding-right: 0;
+		padding-left: 0;
+	}
+}
+
+.no-margin {
+	margin: 0!important;
+}
+.no-x-margin {
+	margin-left: 0!important;
+	margin-right: 0!important;
+}
+.no-y-margin {
+	margin-top: 0!important;
+	margin-bottom: 0!important;
+}
+
+.no-overflow {
+	overflow: hidden!important;
+}
+.no-x-overflow {
+	overflow-x: hidden!important;
+}
+.no-y-overflow {
+	overflow-y: hidden!important;
+}
+
+.margin {
+	&-2 {
+		margin: 2px!important;
+	}
+	&-5 {
+		margin: 5px!important;
+	}
+	&-10 {
+		margin: 10px!important;
+	}
+	&-20 {
+		margin: 20px!important;
+	}
+	&-x-2 {
+		margin-left: 2px!important;
+		margin-right: 2px!important;
+	}
+	&-x-5 {
+		margin-left: 5px!important;
+		margin-right: 5px!important;
+	}
+	&-x-10 {
+		margin-left: 10px!important;
+		margin-right: 10px!important;
+	}
+	&-x-20 {
+		margin-left: 20px!important;
+		margin-right: 20px!important;
+	}
+	&-y-2 {
+		margin-top: 2px!important;
+		margin-bottom: 2px!important;
+	}
+	&-y-5 {
+		margin-top: 5px!important;
+		margin-bottom: 5px!important;
+	}
+	&-y-10 {
+		margin-top: 10px!important;
+		margin-bottom: 10px!important;
+	}
+	&-y-20 {
+		margin-top: 20px!important;
+		margin-bottom: 20px!important;
+	}
+	&-top--20 {
+		margin-top: -20px!important;
+	}
+	&-top--10 {
+		margin-top: -10px!important;
+	}
+	&-top--5 {
+		margin-top: -5px!important;
+	}
+	&-top-0 {
+		margin-top: 0!important;
+	}
+	&-top-2 {
+		margin-top: 2px!important;
+	}
+	&-top-5 {
+		margin-top: 5px!important;
+	}
+	&-top-5-neg {
+		margin-top: -5px!important;
+	}
+	&-top-10 {
+		margin-top: 10px!important;
+	}
+	&-top-10-neg {
+		margin-top: -10px!important;
+	}
+	&-top-20 {
+		margin-top: 20px!important;
+	}
+	&-top-30 {
+		margin-top: 30px!important;
+	}
+	&-bottom-0 {
+		margin-bottom: 0!important;
+	}
+	&-bottom-2 {
+		margin-bottom: 2px!important;
+	}
+	&-bottom-5 {
+		margin-bottom: 5px!important;
+	}
+	&-bottom-10 {
+		margin-bottom: 10px!important;
+	}
+	&-bottom-20 {
+		margin-bottom: 20px!important;
+	}
+	&-bottom-30 {
+		margin-bottom: 30px!important;
+	}
+	&-left-0 {
+		margin-left: 0!important;
+	}
+	&-left-2 {
+		margin-left: 2px!important;
+	}
+	&-left-5 {
+		margin-left: 5px!important;
+	}
+	&-left-5-neg {
+		margin-left: -5px!important;
+	}
+	&-left-10 {
+		margin-left: 10px!important;
+	}
+	&-left-10-neg {
+		margin-left: -10px!important;
+	}
+	&-left-20 {
+		margin-left: 20px!important;
+	}
+	&-right-0 {
+		margin-right: 0!important;
+	}
+	&-right-2 {
+		margin-right: 2px!important;
+	}
+	&-right-5 {
+		margin-right: 5px!important;
+	}
+	&-right-10 {
+		margin-right: 10px!important;
+	}
+	&-right-20 {
+		margin-right: 20px!important;
+	}
+}
+
+.shift {
+	&-topleft {
+		&-2 {
+			margin-top: -2px!important;
+			margin-left: -2px!important;
+		}
+		&-4 {
+			margin-top: -4px!important;
+			margin-left: -4px!important;
+		}
+	}
+	&-topright {
+		&-2 {
+			margin-top: -2px!important;
+			margin-right: -2px!important;
+		}
+		&-4 {
+			margin-top: -4px!important;
+			margin-right: -4px!important;
+		}
+	}
+	&-bottomleft {
+		&-2 {
+			margin-bottom: -2px!important;
+			margin-left: -2px!important;
+		}
+		&-4 {
+			margin-bottom: -4px!important;
+			margin-left: -4px!important;
+		}
+	}
+	&-bottomright {
+		&-2 {
+			margin-bottom: -2px!important;
+			margin-right: -2px!important;
+		}
+		&-4 {
+			margin-bottom: -4px!important;
+			margin-right: -4px!important;
+		}
+	}
+}
+
+.bordered:not(:empty) {
+	border: 1px solid #ccc;
+
+	&:hover {
+		border-color: #bbbbbb;
+	}
+	&.nohover:hover {
+		border-color: #ccc;
+	}
+}
+
+.no-border {
+	&,
+	.well[class*=" bg-"]& {
+		border-width: 0!important;
+	}
+	&-transparent {
+		border-color: transparent!important;
+	}
+	&-radius {
+		border-radius: 0;
+	}
+}
+
+.border {
+	&-0 {
+		border-width: 0!important;
+	}
+	&-1 {
+		border-width: 1px!important;
+	}
+}
+
+.radius {
+	&-4 {
+		border-radius: 4px!important;
+	}
+	&-top-4 {
+		border-top-left-radius: 4px!important;
+		border-top-right-radius: 4px!important;
+	}
+	&-bottom-4 {
+		border-bottom-left-radius: 4px!important;
+		border-bottom-right-radius: 4px!important;
+	}
+	&-left-4 {
+		border-top-left-radius: 4px!important;
+		border-bottom-left-radius: 4px!important;
+	}
+	&-right-4 {
+		border-top-right-radius: 4px!important;
+		border-bottom-right-radius: 4px!important;
+	}
+}
+
+.width {
+	&-nomin {
+		min-width: 0!important;
+	}
+	&-auto {
+		width: auto!important;
+	}
+	&-20 {
+		width: 20px;
+		max-width: 20px;
+	}
+	&-40 {
+		width: 40px;
+		max-width: 40px;
+	}
+	&-50 {
+		width: 50px;
+		max-width: 50px;
+	}
+	&-60 {
+		width: 60px;
+		max-width: 60px;
+	}
+	&-80 {
+		width: 80px;
+		max-width: 80px;
+	}
+	&-100 {
+		width: 100px;
+		max-width: 100px;
+	}
+	&-200 {
+		width: 200px;
+		max-width: 200px;
+	}
+	&-300 {
+		width: 300px;
+		max-width: 300px;
+	}
+	&-400 {
+		width: 400px;
+		max-width: 400px;
+	}
+	&-500 {
+		width: 500px;
+		max-width: 500px;
+	}
+}
+
+.height {
+	&-nomin {
+		min-height: 0!important;
+	}
+	&-20 {
+		height: 20px!important;
+	}
+	&-40 {
+		height: 40px!important;
+	}
+	&-50 {
+		height: 50px!important;
+	}
+	&-60 {
+		height: 60px!important;
+	}
+	&-80 {
+		height: 80px!important;
+	}
+	&-100 {
+		height: 100px!important;
+	}
+	&-200 {
+		height: 200px!important;
+	}
+	&-300 {
+		height: 300px!important;
+	}
+	&-400 {
+		height: 400px!important;
+	}
+	&-500 {
+		height: 500px!important;
+	}
+	&-min {
+		&-20 {
+			min-height: 20px;
+		}
+		&-40 {
+			min-height: 40px;
+		}
+		&-50 {
+			min-height: 50px;
+		}
+		&-60 {
+			min-height: 60px;
+		}
+		&-80 {
+			min-height: 80px;
+		}
+		&-100 {
+			min-height: 100px;
+		}
+		&-200 {
+			min-height: 200px;
+		}
+		&-300 {
+			min-height: 300px;
+		}
+		&-400 {
+			min-height: 400px;
+		}
+		&-500 {
+			min-height: 500px;
+		}
+	}
+	&-max {
+		&-20 {
+			max-height: 20px;
+		}
+		&-40 {
+			max-height: 40px;
+		}
+		&-50 {
+			max-height: 50px;
+		}
+		&-60 {
+			max-height: 60px;
+		}
+		&-80 {
+			max-height: 80px;
+		}
+		&-100 {
+			max-height: 100px;
+		}
+		&-200 {
+			max-height: 200px;
+		}
+		&-300 {
+			max-height: 300px;
+		}
+		&-400 {
+			max-height: 400px;
+		}
+		&-500 {
+			max-height: 500px;
+		}
+	}
+}
+
+.padding {
+	&-2 {
+		padding: 2px!important;
+	}
+	&-5 {
+		padding: 5px!important;
+	}
+	&-7 {
+		padding: 7px!important;
+	}
+	&-10 {
+		padding: 10px!important;
+	}
+	&-20 {
+		padding: 20px!important;
+	}
+	&-x-0 {
+		padding-left: 0!important;
+		padding-right: 0!important;
+	}
+	&-x-2 {
+		padding-left: 2px!important;
+		padding-right: 2px!important;
+	}
+	&-x-5 {
+		padding-left: 5px!important;
+		padding-right: 5px!important;
+	}
+	&-x-10 {
+		padding-left: 10px!important;
+		padding-right: 10px!important;
+	}
+	&-x-20 {
+		padding-left: 20px!important;
+		padding-right: 20px!important;
+	}
+	&-y-0 {
+		padding-top: 0!important;
+		padding-bottom: 0!important;
+	}
+	&-y-2 {
+		padding-top: 2px!important;
+		padding-bottom: 2px!important;
+	}
+	&-y-5 {
+		padding-top: 5px!important;
+		padding-bottom: 5px!important;
+	}
+	&-y-10 {
+		padding-top: 10px!important;
+		padding-bottom: 10px!important;
+	}
+	&-y-20 {
+		padding-top: 20px!important;
+		padding-bottom: 20px!important;
+	}
+	&-top-0 {
+		padding-top: 0!important;
+	}
+	&-top-2 {
+		padding-top: 2px!important;
+	}
+	&-top-5 {
+		padding-top: 5px!important;
+	}
+	&-top-10 {
+		padding-top: 10px!important;
+	}
+	&-top-20 {
+		padding-top: 20px!important;
+	}
+	&-bottom-0 {
+		padding-bottom: 0!important;
+	}
+	&-bottom-2 {
+		padding-bottom: 2px!important;
+	}
+	&-bottom-5 {
+		padding-bottom: 5px!important;
+	}
+	&-bottom-10 {
+		padding-bottom: 10px!important;
+	}
+	&-bottom-20 {
+		padding-bottom: 20px!important;
+	}
+	&-left-0 {
+		padding-left: 0!important;
+	}
+	&-left-2 {
+		padding-left: 2px!important;
+	}
+	&-left-5 {
+		padding-left: 5px!important;
+	}
+	&-left-10 {
+		padding-left: 10px!important;
+	}
+	&-left-20 {
+		padding-left: 20px!important;
+	}
+	&-right-0 {
+		padding-right: 0!important;
+	}
+	&-right-2 {
+		padding-right: 2px!important;
+	}
+	&-right-5 {
+		padding-right: 5px!important;
+	}
+	&-right-10 {
+		padding-right: 10px!important;
+	}
+	&-right-20 {
+		padding-right: 20px!important;
+	}
+}
+
+&.col-xs-hide {
+	@media (max-width: 768px) {
+		display: none!important;
+	}
+}
+&.col-sm-hide {
+	@media (min-width: 768px) and (max-width: 992px) {
+		display: none!important;
+	}
+}
+&.col-md-hide {
+	@media (min-width: 992px) and (max-width: 1200px) {
+		display: none!important;
+	}
+}
+&.col-lg-hide {
+	@media (min-width: 1200px) {
+		display: none!important;
+	}
+}
+
+.no-padding {
+	padding: 0!important;
+
+	.md-editor,
+	.widget-body& .cke_chrome {
+		border: 0;
+	}
+	>pre {
+		margin: 30px;
+	}
+	&-bottom {
+		padding-bottom: 0!important;
+	}
+}
+.no-x-padding {
+	padding-left: 0!important;
+	padding-right: 0!important;
+}
+.no-y-padding {
+	padding-top: 0!important;
+	padding-bottom: 0!important;
+}
+
+.no-content-padding {
+	margin: -10px -14px 0 -14px;
+
+	@media (min-width:768px) and (max-width:880px) {
+		margin: 0 -14px!important;
+	}
+	@media (max-width:767px) {
+		margin: 0 -5px!important;
+	}
+	@media only screen and (min-width:0) and (max-width:679px) {
+		margin: 0 -5px!important;
+	}
+	@media only screen and (min-width:320px) and (max-width:479px) {
+		margin: 0 -5px!important;
+	}
+}
+
+.no-height {
+	line-height: 0;
+}
+
+.clearfix,
+.inner-space:after {
+	zoom: 1;
+}
+
+.clearfix,
+.inner-space {
+	&:after {
+		clear: both;
+	}
+	&:after,
+	&:before {
+		display: block;
+		visibility: hidden;
+		overflow: hidden;
+		content: "\0020";
+		height: 0;
+		font-size: 0;
+		line-height: 0;
+	}
+}
+
+.clearfix {
+	@media (max-width: 768px) {
+		&-xs:after {
+			clear: both;
+		}
+		&-xs:after,
+		&-xs:before {
+			display: block;
+			visibility: hidden;
+			overflow: hidden;
+			content: "\0020";
+			height: 0;
+			font-size: 0;
+			line-height: 0;
+		}
+	}
+	@media (min-width: 768px) and (max-width: 992px) {
+		&-sm:after {
+			clear: both;
+		}
+		&-sm:after,
+		&-sm:before {
+			display: block;
+			visibility: hidden;
+			overflow: hidden;
+			content: "\0020";
+			height: 0;
+			font-size: 0;
+			line-height: 0;
+		}
+	}
+	&-md:after {
+		@media (min-width: 992px) and (max-width: 1200px) {
+			clear: both;
+		}
+	}
+	&-lg:after {
+		@media (min-width: 1200px) {
+			clear: both;
+		}
+	}
+}
+
+.display-inline {
+	display: inline-block!important;
+}
+
+.display-normal {
+	display: inline!important;
+}
+
+.hover-transparent {
+	opacity: .5;
+
+	&:hover {
+		opacity: 1;
+	}
+}
+
+.row-seperator-header {
+	margin: 15px 14px 20px;
+	border-bottom: 0;
+	display: block;
+	color: #646464;
+	font-size: 20px;
+	font-weight: 400;
+}
+
+.text-align-center,
+.text-center {
+	text-align: center!important;
+}
+
+.text-align-left,
+.text-left {
+	text-align: left!important;
+}
+
+.text-align-right,
+.text-right {
+	text-align: right!important;
+}
+
+.center-canvas,
+.center-child-canvas >canvas {
+	display: block!important;
+	margin: 0 auto!important;
+}
+
+.semi-bold {
+	font-weight: 400!important;
+}
+.bold {
+	font-weight: 900!important;
+}
+.nobold {
+	font-weight: normal!important;
+}
+.typo-bold {
+	font-family: Ubuntu-Bold;
+}
+
+.ultra-light {
+	font-weight: 300!important;
+}
+
+.font-xs {
+	font-size: 85%!important;
+}
+
+.font-sm {
+	font-size: 95%!important;
+}
+
+.font-md {
+	font-size: 130%!important;
+}
+
+.font-lg {
+	font-size: 160%!important;
+}
+
+.font-xl {
+	font-size: 200%!important;
+}
+
+.font-400 {
+	font-size: 400%!important;
+}
+
+.fa-fw-md {
+	width: 1em;
+	text-align: center;
+}
+
+.badge {
+	font-size: 11px;
+	padding: 3px 6px 2px;
+}
+
+.label {
+	padding: 0.3em .6em .1em;
+}
+
+.cursor-pointer {
+	cursor: pointer;
+}
+
+.selected {
+	border: 1px solid #0091d9!important;
+
+	tr& {
+		background-color: rgb(220, 235, 255);
+	}
+	&:before {
+		display: block;
+		position: absolute;
+		content: "\f00c";
+		color: #fff;
+		right: 4px;
+		font-family: FontAwesome;
+		z-index: 1002;
+
+		tr& {
+			display: none;
+		}
+	}
+	&:after {
+		width: 0;
+		height: 0;
+		border-top: 35px solid #0091d9;
+		border-left: 35px solid rgba(0, 0, 0, 0);
+		position: absolute;
+		display: block;
+		right: 0;
+		content: ".";
+		top: 0;
+		z-index: 1001;
+
+		tr& {
+			display: none;
+		}
+	}
+}
+
+ul {
+	&.inside {
+		list-style-position: inside;
+	}
+	&.outside {
+		list-style-position: outside;
+	}
+}