html, body {
	font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
	font-weight: 300;
	margin: 0;
	padding: 0;
	width: 100%; height: 100%;

	-webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                          supported by Chrome, Edge, Opera and Firefox */

}

div[contenteditable="true"] {
	-webkit-touch-callout: auto;
    -webkit-user-select: auto;
    -khtml-user-select: auto;
    -moz-user-select: auto;
    -ms-user-select: auto;
    user-select: auto;
}

ul.menu {
	position: absolute;
	top: 0; right: 0;
	display: flex;
	list-style: none;
	margin: 0; padding: 0;
	justify-content: flex-end;
	font-size: 80%;
}

ul.menu li {
	margin: 0; padding: 0;
	cursor: pointer;
}

ul.menu li a {
	display: inline-block;
	padding: .5em;
	color: white;
	font-weight: bold;
	text-decoration: none;
}

ul.menu li.selected a{
	color: #101848;	
}

ul.menu li.selected {
	background-color: #dee;
}

ul.menu li:hover {
	margin: 0; padding: 0;
	cursor: pointer;
	background-color: white;
}

ul.menu li:hover a {
	color: #101848;
}

.container {
	display: flex;
	flex-direction: column;
	min-height: 100%;
	width: 100%;
	background-color: white;
	border-collapse: collapse;
	overflow-y: hidden;
}

.header {
	justify-self: flex-start;
	background-color: #101848;
	background-image: url('/img/logo.svg');
	background-position: 12px center;
	background-repeat: no-repeat;
	background-size: 200px;
	color: white;
	text-align: center;
	min-height: 64px;
	height: 64px;
}

.header h1 {
	font-size: 1.5em;
	margin: 12px 0 0 0;
	line-height: 64px;
}

.content {
	flex: 1 1 auto;
	height: 0px;
	min-height: 300px;
	
	padding: 8px;
	overflow-y: auto;
}

.footer {
	justify-self: flex-end;
	background-color: #101848;
	color: white;
	padding: 8px;
	min-height: 24px;
	height: 24px;
}

.section-header {
	width: 100%; display: flex; justify-content: space-evenly; font-weight: bold; font-size: 1.2em; margin: .25em;
}

.value-button:hover {
	background-color: #101848;
	color: white;
}


.table-edit {
	font-size: 1em;
	border: none;
	background: none;
	-webkit-appearance:none;
	width: 98%;
}


@media screen and (max-width: 600px) {

	.header {
		text-align: right;
		padding-right: 2em;
	}
	
	.section-header {
		display: block;
	}


	.table-edit {
		display: inline-block;
		width: 60%;
		text-align: right;
	}
	
}

.table-actions {
	display: flex;
	justify-content: flex-end;
}

.delete-button {
	display: inline-block;
	text-align: center;
	border: 1px solid black;
	border-radius: 4px;
	padding: 0 .5em 0 .5em;
	cursor: pointer;
}



.value-button {
	display: inline-block;
	width: 28px;
	text-align: center;
	font-weight: bold;
	border: 1px solid black;
	border-radius: 4px;
	/* padding: 4px; */
	cursor: pointer;
}

.value-button.hidden {
	visibility: hidden;
}

.value-button * {
	cursor: pointer;
}

.value-count {
	display: inline-block;
	margin: 0 4px 0 4px;
	min-width: 2em;
	text-align: center;
	cursor: pointer;
}

.date-menu {
	width: 100%; display: flex; justify-content: space-evenly; font-weight: bold; font-size: 1.2em; margin: .25em;
}

.date-menu select {
	font-weight: bold;
	font-size: 1em;
	border: none;
	background: none;
	-webkit-appearance:none;
}

.daily-list {
	display: none;
}

.daily-list.visible {
	display: block;
}

.print-date {
	display: none;
}

.list-end {
	text-align: right;
	display: flex;
	justify-content: space-between;
}

.change-password-button,
.log-out-button,
.manage-routes-button,
.dashboard-button,
.generate-labels-button,
.print-labels-button,
.export-labels-button,
.download-button {
	border: 1px solid black;
	border-radius: 4px;
	font-weight: bold; font-size: 1.2em; margin: 1em; padding: .5em;
	cursor: pointer;
	text-decoration: none;
	color: black;
}

.change-password-button:hover,
.log-out-button:hover,
.delete-button:hover,
.manage-routes-button:hover,
.dashboard-button:hover,
.generate-labels-button:hover,
.print-labels-button:hover,
.export-labels-button:hover,
.download-button:hover {
	background-color: #101848;
	color: white;
}

.file-upload {
	border: 1px solid black;
	border-radius: 4px;
	font-weight: bold; font-size: 1.2em; margin: 1em; padding: .5em;
	/* margin: .5em auto 1em auto; */
	display: flex;
	justify-content: space-between;
}

.file-upload button {
	background: none;
	border: 1px solid black;
	border-radius: 4px;
}

@media print {
	ul.menu {
		display: none;
	}

	.header {
		display: none;
	}
	
	.container {
		display: block;
	}

	.content {
		height: 100%;
		overflow-y: visible;
	}

	.print-date {
		display: block;
	}

	.date-menu {
		display: none;
	}

	.daily-list {
		display: block;
		page-break-after: always;
	}

	.daily-list:last-child {
		page-break-after: initial;
	}

	.value-button {
		display: none;
	}

	.list-end {
		display: none;
	}

}


.error {
	font-weight: bold;
	color: red;
	text-align: center;
}