/*
Documentation:
	* ABG core colors
	Brown: rgb(76 63 53) or #4C3F35
	Light Green: rgb(221 214 164) or #DDD6A4
	Orange: rgb(220 91 71) or #DC5B47

	* html
	- DejaVu Sans helps support Linux distributions
	- -webkit-text-size-adjust prevents text zooming in iOS, including on
	orientation change
*/


a {
	background-color: transparent;
	color: rgb(76 63 53);
}

body {
	box-sizing: border-box;
	margin: 0 auto;
	max-width: 1024px;
	min-width: 320px;
	position: relative;
}

footer {
	border-top: 2px rgb(220 91 71) solid;
	font-size: 0.8rem;
	line-height: 1.4;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	width: 85%;
}

h1 {
	font-size: 1.2rem;
	text-align: center;
}

h2{
	font-size: 1.0rem;
}

header {
	background-color: rgb(221 214 164);
	border-bottom: 4px rgb(220 91 71) solid;
	border-top: 4px rgb(220 91 71) solid;
	display: grid;
	grid-template-areas: "menu logo socialmedia" "hours hours hours" "status status status";
	grid-template-columns: 88px 1fr 88px;
	grid-template-rows: 60px 72px 48px;
}

header p {
	margin: 2px 0;
}

html {
	background-color: rgb(255 255 255);
	color: rgb(76 63 53);
	font-family: "IBM Plex Sans", Verdana, Geneva, "DejaVu Sans", sans-serif;
	text-size-adjust: none;
	-webkit-text-size-adjust: none;
}

main {
	margin-left: 4%;
	margin-right: 4%;
}

progress {
	background-color: rgb(0 170 0);
	border: none;
	height: 5px;
	vertical-align: middle;
	width: 224px;
	-webkit-appearance: none;
}

progress::-moz-progress-bar {
	background-color: rgb(76 63 53);
}

progress::-webkit-progress-bar {
	background-color: rgb(0 170 0);
}

progress::-webkit-progress-value {
	background-color: rgb(76 63 53);
}

ul:not(#mainmenu) {
	list-style-type: square;
}

#container {
	display: grid;
	grid-template-areas: "header" "main" "footer";
	grid-template-columns: 100%;
	grid-template-rows: 3fr;
}

#hours {
	font-size: 0.8rem;
	grid-column-end: 4;
	grid-column-start: 1;
	grid-row-end: 3;
	grid-row-start: 2;
	line-height: 1.4;
	text-align: center;
}

#logo {
	align-self: center;
	grid-column-start: logo;
	grid-row-start: logo;
	justify-self: center;
}

#mainmenu {
	float: left;
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#mainmenu a {
	float: left;
	text-decoration: none;
}

#mainmenu li {
	position: relative;
}

#mainmenu li:active > ul {
	display: block;
}

#mainmenu li:hover > ul {
	display: block;
}

#mainmenu ul {
	background-image: linear-gradient(to bottom, rgb(255 255 255) 0%, rgb(221 214 164) 100%);
	border: 2px rgb(220 91 71) solid;
	display: none;
	left: 4px;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 48px;
	z-index: 99;
}

#mainmenu ul a {
	float: none;
	padding: 8px;
	white-space: nowrap;
	width: 144px;
}

#mainmenu ul li {
	box-shadow: 0 1px 0 0 rgb(102 102 102);
	display: block;
	float: none;
	margin: 0;
	padding: 8px;
}

#mainmenu ul li:active {
	background-color: rgb(102 102 0 / 0.2);
}

#mainmenu ul li:hover {
	background-color: rgb(102 102 0 / 0.2);
}

#mainmenu ul li:last-child {
	box-shadow: none;
}

#noscript {
	background-color: inherit;
	color: rgb(251 2 7);
	text-align: center;
}

#socialmedia {
	align-self: center;
	grid-column-start: socialmedia;
	grid-row-start: socialmedia;
	justify-self: center;
}

#status {
	font-size: 0.8rem;
	grid-column-end: 4;
	grid-column-start: 1;
	grid-row-end: 4;
	grid-row-start: 3;
	line-height: 1.1;
	padding-top: 8px;
	text-align: center;
}

.bodytext p {
	hyphens: auto;
	text-align: justify;
	-webkit-hyphens: auto;
}

.mainmenuicondata.icon0 {
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAIJJREFUWAntVlsKgDAMm95PRO//7+sQmg6KH7rPBisphA4GTZuxbKUopIAUuBWYsNyAMxg76o/AIxjkPpxx1eh9gWybrHjlMlkWwLuMyis4Btak4smlgHygIx5Y0wcYbigfIJ50NqoZDR9A1CPkdZv/AQa5N/Hd/4B8INvFUb8/UOAC1VL2PpL9MRIAAAAASUVORK5CYII%3D);
	background-position: 100% 42%;
	background-repeat: no-repeat;
	height: 60px;
	width: 40px;
}

.specialhours {
	opacity: 0.5;
	text-decoration: line-through;
}