div#featureMsg{
	margin: 2em auto;
	text-align: center;
	width: 75%;
}

div#mobileWarning {
	display: none;
}

div#mobileWarning i {
	display: block;
	width: 100%;
	margin: 2em 0;
	text-align: center;
}

table.resSchedule {
	width: 100%;
	table-layout: fixed;
	border-collapse: collapse;
	font-size: 80%;
}

table.resSchedule tr.template {
	display: none;
}

table td, table th {
	border: 1px solid #808080;
}

table.resSchedule tr td:first-of-type {
	background-color: #e0e0e0;
	cursor: pointer;
}

table.resSchedule td:not(:first-of-type) {
	width: 9em;
}

table.resSchedule tr td, table.resSchedule tr th {
	padding: 0.5em;
	min-height: 1em;
}

table.resSchedule tr td:not(:first-of-type):hover {
	background-color: #f8f9fb;
	cursor: pointer;
}


td input {
	border-radius: 4px;
	border: 1px #dbe6ec solid;
	padding: 0.3em;
	box-sizing: border-box;
	height: 2.2em;
	width: calc(100% - 0.6em);
}



table.resSchedule td time {
	display: block;
	width: 100%;
	background-color: #18333c;
	color: #FFFFFF;
	padding: 0.5em 0;
	font-size: 90%;
	text-align: center;
	border-radius: 5px;
}


div.boxWrapper header {
	display: flex;
	width: 100%;
	height: 2em;
	margin: 0.8em 1.5em 0.8em 0;
}

div.boxWrapper nav {
	display: flex;
	justify-content: flex-end;
	flex: 1 1 auto;
}

div.boxWrapper nav div {
	display: inline-block;
	height: 100%;
	min-width: 2em;
}

div.boxWrapper nav div ~ div {
	margin-left: 0.8em;
}

div.boxWrapper nav div input {
	height: 100%;
	color: #FFFFFF;
	background-color: #02627f;
	border-radius: 5px;
	padding: 0.5em 1.1em 0.5em 2em;
	transition: all 0.2s ease;
	background-size: 1em;
	background-repeat: no-repeat;
	background-position: 0.5em center;
}

@media (max-width: 59.9rem) {
	
	table.resSchedule {
		display: none;
	}
	
	div#mobileWarning {
		display: block;
	}
	
	div.boxWrapper header {
		font-size: 0.75em;
	}
	
	div.boxWrapper nav div input {
		width: 2em;
		padding: 0.5em !important;
		color: transparent !important;
		background-position: center !important;
	}
}

div#overscan div.shiftTimeContainer {
	justify-content: center;
}


div#printedLogo {
	display: none;
	margin: 5em 0;
	width: 100%;
	text-align: center;
}

@media print {
	
	@page {
		size: landscape;
		margin: 0;
	}
	
	body {
		background-color: #FFF;
	}
	
	body > header, body > footer, div.boxWrapper nav, div#featureMsg { display: none !important; }
	
	div#printedLogo {
		display: block;
	}
	
}