body {
	margin: 	0px;
	padding: 	0px;

	font-family:	arial, sans-serif;
}
div.logos {
	width: 		100%;
}
div.logos {
	bottom: 	1em;
	left: 		1em;
	right: 		1em;
	width: 		unset;
}
div.logos > p,
div.logos > img {
	display:	inline-block;
	margin-right: 	1em;
}
img.logo {
	max-height:	60px;
}
div.logos .logo {
	max-height:     60px;
	max-width:      100px;
}

div.applicationContainer {
	display: 	flex;
	flex-direction: column;

	min-height:     100%;
	width:          100%;
}
div.applicationContainer div.topBar {
	min-height:             2em;
}
div.applicationContainer .mainSection {
	flex-basis: 1em;
	flex-grow: 1;

	align-items: stretch;

	display: flex;

	margin: 0px;
}
div.applicationContainer .mainSection .sideBar {
	display:	flex;
	flex-direction: column;

	min-width:	30em;
}
@media (orientation: landscape) {
	div.applicationContainer .mainSection {
		flex-direction:	row;
	}
	div.applicationContainer .mainSection .sideBar {
		max-width:	25%;
	}

}
@media (orientation: portrait) {
	div.applicationContainer .mainSection {
		flex-direction:	column;
	}
	div.applicationContainer .mainSection .mainContent {
		min-height:	100vw;
	}
	div.applicationContainer .mainSection .sideBar {
		width:		100%;
	}
}
div.applicationContainer div.topBar,
div.applicationContainer div.bottomBar {
	padding: 0.5em;

	font-family:	verdana, sans-serif;
}