html, body {
	height: 100%;
}

body {
	position: relative;
	font-family: 'Roboto',sans-serif;
	font-size: 14px;
	font-weight: 300;
	font-style: normal;
	line-height: 20px;
	margin: 0;
	padding: 0;
	color: #FFF;
	background-color: #333;
	-webkit-font-smoothing: antialiased;
	-webkit-transform: translate3d(0,0,0);
	-webkit-backface-visibility: hidden;
}

h2 {
	margin: 20px 0;
}

img {
	image-rendering: optimizeQuality;
}

	img.svg-icon {
		position: relative;
		display: inline-block;
		height: 24px;
		width: 24px;
		overflow: hidden;
	}

		img.svg-icon path {
			fill: #666;
		}

a {
	color: #07989b;
	text-decoration: none;
}

	a:hover {
		text-decoration: underline;
	}

hr {
	border: none;
	height: 1px;
	background-color: #ccc;
}

sub, sup {
	text-transform: lowercase;
	font-size: 72%;
	position: initial;
	filter: alpha(opacity=60);
	opacity: 0.6;
}

ul.flat {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

	ul.flat > li {
		margin: 0;
		padding-top: 10px;
	}

		ul.flat > li:first-child {
			padding-top: 0;
		}

table.flat {
	width: 100%;
	border-collapse: collapse;
	border: none;
	padding: 0;
	margin: 0;
}

	table.flat td {
		padding: 5px 15px 0 0;
	}






#mainHeader {
	position: fixed;
	z-index: 100;
	top: 0;
	left: 0;
	width: 100%;
	height: 64px;
	color: #FFF;
	background-color: #020202;
}

	#mainHeader > .content {
		width: 100%;
		height: 100%;
		max-width: 1174px;
		margin: 0 auto;
		flex-direction: row;
		display: flex;
		justify-content: flex-start;
	}

		#mainHeader > .content .item {
			position: relative;
			display: block;
			height: 100%;
			flex-grow: 1;
			flex-shrink: 1;
			flex-basis: 0%;
			padding-right: 15px;
			padding-left: 15px;
		}

			#mainHeader > .content .item.app-name .page-title {
				display: inline-block;
				padding: 36px 15px 12px;
				height: 100%;
				font-size: 15px;
				color: rgba(255,255,255,0.8);
			}

			#mainHeader > .content .item.app-name img {
				float: left;
				padding: 12px 0;
				height: 100%;
			}

#mainFooter {
	position: fixed;
	z-index: 100;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 50px;
	color: #FFF;
	padding-top: 7px;
	background-color: #333;
}

	#mainFooter > .content {
		border-top: solid 1px #FFF;
		width: 100%;
		height: 100%;
		max-width: 1174px;
		margin: 0 auto;
		flex-direction: row;
		display: flex;
		justify-content: flex-start;
	}

		#mainFooter > .content .item {
			position: relative;
			display: block;
			height: 100%;
			flex-grow: 1;
			flex-shrink: 1;
			flex-basis: 0%;
			padding-right: 15px;
			padding-left: 15px;
		}

#mainSection {
	position: relative;
	padding-top: 50px;
	height: 100%;
}

	#mainSection > .content {
		position: relative;
		width: 100%;
		max-width: 1174px;
		min-height: 100%;
		margin: 0 auto;
		padding: 15px;
	}


a.button {
	position: relative;
	display: inline-block;
	padding: 6px 13px;
	text-align: center;
	background-color: #FFF;
	color: #666;
	text-decoration: none;
	font-weight: 400;
	border: solid 1px #CCC;
	border-radius: 4px;
	box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
}

	a.button:hover {
		text-decoration: none;
		box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
	}

	a.button.success {
		border-color: #17b683;
		background-color: #17b683;
		color: #FFF;
	}

div.clearfloat {
	height: 1px;
	content: ' ';
	clear: both;
}

.home-content, .info-box {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	padding: 25px;
	text-align: center;
	color: #666;
	background-color: #FFF;
	border-radius: 4px;
}

.home-content {
	width: 300px;
	height: 135px;
}

.info-box {
	width: 500px;
}

	.info-box > .content {
		text-align: left;
	}

		.info-box > .content.centered {
			text-align: center;
			min-height: 100px;
		}

	.info-box > .footer {
		padding: 10px 0;
		text-align: left;
	}

		.info-box > .footer.centered {
			text-align: center;
		}







.box-shadow-level0 {
	box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12) !important;
}

.box-shadow-level1 {
	box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12) !important;
}

.box-shadow-level2 {
	box-shadow: 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 1px 8px 0 rgba(0, 0, 0, 0.12) !important;
}

.box-shadow-level3 {
	box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12) !important;
}

.flex-space {
	flex: 1 1 auto;
}