body {
	margin: 0;
	font-family: NotoSans,Arial,"Arial Unicode MS",sans-serif;
	font-size: small;
}

.jwheader {
	background-color: #4a6da7;
	padding: 0.5em 1em 1em 1em;
	color: white;
}

.jwheadertext {
	margin: 0;
}

.jwheadertext a {
	font-size: x-large;
	font-weight: bold;
	color: white;
	text-decoration: none;
}

.jwheadersubtext {
	font-size: small;
	font-weight: normal;
	margin: 0;
}

.menuHolder {
	display: flex;
	flex-direction: column;
	height: 100%;
}

.menuHolder .jwheader {
	flex-grow: 1;
}

.topmenu {
	padding: 0.5em;
	background: black;
	color: white;
}

.topmenu a {
	color: white;
	text-decoration: none;
	padding: 0 0.5em;
}

.topmenu a:hover {
	background-color: #4a6da7;
}

.actionHeader {
	display: flex;
	flex-wrap: wrap;
	background: black;
	align-items: stretch;
}

.actionHeaderLeft {
	flex-grow: 1;
}

.actionHeaderRight {
	flex-grow: 1;
	flex-basis: 50%;
	background: black;
	padding: 0.5em 1em 0.5em 1em;
}

.actionCols {
	display: flex;
	flex-wrap: wrap;
}

.selectCol {
	flex-basis: 100%;
}

.typeCol {
	margin: 0.5em 1em 0.5em 0;
}

.logCol {
	margin: 2em 1em 0.5em 0;
}

#useLogScale {
	vertical-align: middle;
	position: relative;
	bottom: 1px;
}

.buttonsCol {
	margin: 1em 0.5em 0 0;
}

.actionCols label {
	display: block;
	size: x-small;
	color: white;
	margin-bottom: 0.25em;
}

#useLogScaleLabel {
	display: inline;
}

.actionButton {
	background-color: #4a6da7;
	border: none;
	color: white;
	cursor: pointer;
	width: 36px;
	height: 36px;
}

#clearButton {
	padding-left: 8px;
}

#copyButton {
	padding: 12px 10px;
}

.actionButton:hover {
	background-color: RoyalBlue;
}

.main {
	margin: 0.5em 1em 0.5em 1em;
}

.tips li {
	margin-bottom: 1em;
}

.chart-holder {
	width: 95%;
	margin: 0 auto;
}

@media (min-width: 1900px) {
	.chart-holder {
		width: 85%;
	}
}

footer {
	font-size: small;
	margin: 2em 1em;
}

.toast-box {
	background: #fea !important;
	color: black !important;
}