body {
	margin: 0;
	padding: 10px 5px 0;
	color: #000000;
	background: #FF6C00 url(../img/fade-01/background.png) repeat-x fixed;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	text-align: center;
}

/* Menu (same items and colors as the old AllWebMenus bar) */
#menu { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; margin: 0 auto 10px; padding: 0; list-style: none; }
#menu a { display: block; padding: 3px 8px; border: 4px solid #FF0000; background: #980018; color: #D2D2D2; font: 14px Tahoma, Arial, Helvetica, sans-serif; text-decoration: none; }
#menu a:hover, #menu a:focus, #menu a[aria-current="page"], #menu a.active { background: #D01A1A; color: #FFFFFF; }
#menu li { position: relative; }
#menu ul { display: none; position: absolute; left: 0; top: 100%; z-index: 1000; margin: 0; padding: 0; list-style: none; white-space: nowrap; }
#menu ul a { font-size: 12px; border-top: 0; }
#menu li:hover > ul, #menu li:focus-within > ul { display: block; }

/* Faded frame around the main content */
.frame { display: grid; grid-template-columns: 27px minmax(0, 726px) 27px; justify-content: center; margin: 0 auto; }
.frame > img { display: block; }
.frame .top, .frame .bottom { width: 100%; }
.frame .top { height: 38px; }
.frame .bottom { height: 40px; }
.frame .side-left  { background: url(../img/fade-01/left-repeat.png) repeat-y top; }
.frame .side-right { background: url(../img/fade-01/right-repeat.png) repeat-y top; }
.frame .side-left img, .frame .side-right img { display: block; }

.content { background: #8e0000; padding: 1em 0 0.5em; color: #ffffff; }
.content a { color: #FFD27A; }
.content a:hover { color: #ffffff; }
.content .photo { display: block; width: 720px; max-width: 100%; height: auto; margin: 0 auto; }

h1 { margin: 0.8em 23px 0.4em; font: bold 22pt/1.2 Georgia, "Times New Roman", serif; color: #FFD27A; }
h2 { margin: 1em 23px 0; font: bold 15pt/1.25 Georgia, "Times New Roman", serif; color: #FFD27A; text-align: left; }

.story { padding: 12px 23px 23px; font-size: 12pt; font-weight: bold; text-align: justify; }
.story p { margin: 0; }
.signature { padding: 0 23px 10px 50%; font-size: 12pt; font-weight: bold; text-align: left; }

.text { padding: 8px 23px 12px; font-size: 12pt; line-height: 1.5; text-align: left; }
.text ul { padding-left: 1.3em; }
.text li { margin-bottom: 0.3em; }
.text .columns { columns: 2; column-gap: 2em; }
.text .big { font-size: 18pt; font-weight: bold; text-align: center; }

.hours { margin: 1em 0; border-collapse: collapse; font-size: 11pt; }
.hours caption { text-align: left; font-weight: bold; padding-bottom: 4px; }
.hours th, .hours td { padding: 3px 12px 3px 0; text-align: left; vertical-align: top; }

.gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 6px; padding: 6px 23px; }
.gallery img { width: 100%; height: auto; display: block; }
.sheet { display: block; width: 100%; height: auto; margin: 0 0 12px; background: #ffffff; }

.map { padding: 6px 13px; }
.map iframe { display: block; width: 100%; max-width: 700px; height: 470px; margin: 0 auto; border: 0; }

.info { font-weight: bold; }
.info a { color: inherit; }
.info hr { width: 300px; }
footer hr { width: 200px; }
footer { padding-bottom: 1em; }

@media (max-width: 600px) {
	.frame { grid-template-columns: minmax(0, 1fr); }
	.frame > img, .frame .side-left, .frame .side-right { display: none; }
	.signature { padding-left: 23px; }
	h1 { font-size: 18pt; }
	.text .columns { columns: 1; }
	.map iframe { height: 360px; }
}
