:root {
	--ah-blue: rgb(1,65,137);
	--ah-blue-dark: rgb(0, 30, 77);
	--ah-yellow: rgb(254,209,0);
	--ah-beige: rgb(255, 253, 235);
}
html {
	background-color: var(--ah-beige);
}
body {
	background: linear-gradient(to bottom, var(--ah-blue) 50%, var(--ah-beige) 50%);
	font: normal normal 1em/1.5 "Droid Sans", Helvetica, Arial, sans-serif;
	font-size: clamp(.25rem, 4vmin, 1.5rem);
font-size: clamp(.5rem, 4vmin, 1.73rem);
	color: var(--ah-blue);
}
header {
	background-color: var(--ah-blue);
	color: var(--ah-yellow);
	transition: opacity .5s ease-in .25s;
	@starting-style {
		opacity: 0;
	}
}
header div.mmenu > a > span {
	--m: .25em;
	left: calc(100% - var(--h) - 1vw);
	margin: var(--m);
	width: calc(var(--h) - var(--m) * 2);
	height: calc(var(--h) - var(--m) * 2);
	background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg"><g><rect fill="white" width="48" height="9.73"/><rect y="19.13" fill="white" width="48" height="9.73"/><rect y="38.26" fill="white" width="48" height="9.73"/></g></svg>');
}
header div.mmenu > a.close > span {
	background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg"><path fill="white" d="M24.12,30.74L6.86,48L0,41.14l17.26-17.26L0.37,6.98l6.86-6.86l16.9,16.9L41.14,0L48,6.86L30.98,23.88 l16.9,16.89l-6.86,6.86L24.12,30.74z"/></svg>');
}
main > div {
	background-color: var(--ah-beige);
}
main > div + div {
	border-top-color: var(--ah-blue);
}
main > div.p {
	scroll-margin: -4px;
}

/*
main > :nth-child(n of div.p) > .l1 {
*/
.p:nth-child(n of div.p) .l1 {
--delta: 13px;
	background-image: url(../img/bg-s1.jpg);
}
.p:nth-child(n + 2 of div.p) > .l1 {
--delta: 40px;
	background-image: url(../img/bg-s2.jpg);
}
.p:nth-child(n + 3 of div.p) > .l1 {
--delta: 245px;
	background-image: url(../img/bg-s3.jpg);
}
.p:nth-child(n + 4 of div.p) > .l1 {
--delta: 250px;
	background-image: url(../img/bg-s4.jpg);
}
.p:nth-child(n + 5 of div.p) > .l1 {
--delta: 40px;
	background-image: url(../img/bg-s5.jpg);
}
.p:nth-child(n + 6 of div.p) > .l1 {
--delta: 152px;
	background-image: url(../img/bg-s6.jpg);
}

footer > div {
	display: flex;
	align-items: center;
	justify-content: center;
}
footer > div > span {
	font-size: 60%;
font-size: calc(1ch * .9);
font-size: min(1rem, calc(1ch * .95));
font-size: min(1rem, calc(3vmin * .95));
	padding: 0 .25em;
}

@media (max-width: 480px) {
	footer > div > span {
		padding: 0 .15em;
	}
}
footer > div > span a,
footer > div > span a:link,
footer > div > span a:visited {
	color: var(--ah-blue);
	text-decoration: none;
}
footer > div > span a:hover,
footer > div > span a:link:hover,
footer > div > span a:visited:hover {
	text-decoration: underline;
}