html, body {
	height: 100%;
}

body {
	font-family: 'Roboto', sans-serif;
	font-size: 14px;
	line-height: 1.6em;
	color: #222;
}

h1 { font-weight: normal; font-size: 1.3em; }
h2 { font-weight: normal; font-size: 1.3em; }
h3 { font-weight: bold; font-size: 1em; }

h2 span { font-size: 1rem; font-weight: normal; margin: 0 1em; }

a { color: #126099; }

header {
	background-color: #073642;
	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2);
	padding: 1rem 2rem;
}

header h1 {
	margin: 0;
}

header h1 a {
	color: #fff;
	text-decoration: none;
}

/*nav*/

#menu {
	display: flex;
	box-shadow: inset 0 -1px 0 0 #B0BEC5;
}

#menu .menu-item a {
	display: block;
	text-decoration: none;
	border: 1px solid #B0BEC5;
	border-right: 0;
	padding: 0.5em 1em;
	background-color: #ECEFF1;
}

#menu .menu-item:last-child a {
	border-right: 1px solid #B0BEC5;
}

#menu .menu-item a.selected {
	background-color: #fff;
	border-bottom: 1px solid #fff;
}

.hide { display: none; }

.container {
	max-width: 1000px;
	margin: 0 auto;
}

section { margin: 2em 0 4em; }

.section-title h2 { display: inline-block; }
.section-title p { display: inline-block; float: right; }

p strong.paragraph { margin-right: 0.5em; }

.table-container table { width: 100%; border-collapse: collapse; caption-side: bottom; }
.table-container table thead { text-align: left; border-bottom: 2px solid #CFD8DC; }
.table-container table th, .table-container table td { padding: 0.25em 0.5em; }
.table-container table tbody tr { border-bottom: 1px solid #CFD8DC; }
.table-container table tbody tr:last-child { border-bottom: 0; }

.table-container table tbody.even-odd tr:nth-child(odd) { background-color: #f4f7f9; }

.table-container .border-left { border-left: 1px solid #CFD8DC; }
.table-container .border-right { border-right: 1px solid #CFD8DC; }
.table-container .text-center { text-align: center; }
.table-container .text-right { text-align: right; }
.table-container .text-left { text-align: left; }

.table-container table.equal-size { table-layout: fixed; }

a.btn {
	display: inline-block;
	box-sizing: border-box;
	padding: 0.5em 1.0em;
	border-radius: 2px;
	box-shadow: 1px 1px 2px 0 rgba(0, 0, 0, 0.2);
	text-decoration: none;
	background-color: #268bd2;
	color: #fff;
	font-size: 1em;
	line-height: 1.4em;
}

a.btn:hover {
	background-color: #1a77ba;
	box-shadow: 2px 3px 6px 0 rgba(0, 0, 0, 0.15);
}

a.btn.gray {
	background-color: #78909C;
	color: #fff;
}

a.btn.gray:hover {
	background-color: #607D8B;
}

#about-btns {
	display: inline-flex;
	margin: 0.5em 0 0;
}

#about-btns a.btn {
	margin-right: 1em;
}

.status-active { color: #2E7D32; }

.graphs-line {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: space-between;
}

.graphs-line.gl2 .graph-box { flex: 0 0 48%; }
.graphs-line.gl3 .graph-box { flex: 0 0 31%; }
.graphs-line.gl4 .graph-box { flex: 0 0 24%; }
.graphs-line.gl5 .graph-box { flex: 0 0 19%; }
.graphs-line .graph-box img { width: 100%; }

.legends-line {
	margin: 2em 0;
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: space-between;
}

.legends-line.ll2 .legend-box { flex: 0 0 47%; }
.legends-line.ll3 .legend-box { flex: 0 0 31%; }
.legends-line.ll4 .legend-box { flex: 0 0 24%; }
.legends-line.ll5 .legend-box { flex: 0 0 19%; }


.pagination {
	display: inline-flex;
	margin: 1em 0;
}

.pagination span.page {
	/*border-radius: 0.2em;*/
	border: 1px solid #B0BEC5;
	padding: 0.2em 0.5em;
	margin: 0 0.1em;
	cursor: pointer;
}

.pagination span.dots {
	padding: 0.1em 0.2em;
	margin: 0 0.2em 0 0;	
}

.pagination span.selected {
	background-color: #B0BEC5;
}