@font-face {
  font-family: 'Atkinson';
  src: url('/fonts/AtkinsonHyperlegibleNext-Regular.woff2') format('woff2'),
       url('/fontsAtkinsonHyperlegibleNext-Bold.woff2') format('woff2'), 
       url('/fonts/AtkinsonHyperlegibleNext-Regular.ttf')  format('truetype')   
}
@import url('https://fonts.googleapis.com/css?family=Red+Rose&display=swap');
header	{
	position: fixed;
	top:0;
	left:0;
	width:100%;
	height:50px;
	background-color:black;
	color:white;
	z-index:3;
	display:flex;
	align-items:center;
	font-size:1.5rem;
	}
header a:link		{color: white; text-decoration: none; }
header a:visited	{color: white; text-decoration: none; }
header a:active		{color: white; text-decoration: none; }
header a:hover		{color: white; text-decoration: none; }

main	{
	position:relative;
	top:50px;
	min-height:100%;
	margin-left:auto;
	margin-right:auto;
	width:70%;
	background-color:white;
	font-family:Atkinson, Fallback, sans-serif;
	overflow:hidden;
	z-index:1
        }
main p,h2,img  {
	margin: 0.4em;
	font-size:1.2em
	}
img	{width:100%;}
main h1 {margin-top:2.5em;clear:both;font-size:1.9em;}
main h2 {margin-top:1.5em;clear:both;font-size:1.6em;}
main h3 {margin-top:1.5em;clear:both;font-size:1.4em;}
nav	{
	position:fixed;
	top:50px;
	left:0;
	padding-left:0.3rem;
	font-size:1.6rem;
	background-color: black;
	visibility:hidden;
	z-index:3;
	width:14rem;
	line-height: 1.5;
	overflow:auto;
}
nav a:link,
nav a:visited	{color:white; text-decoration: none;}
nav a:hover	{background-color:white;color:black; text-decoration: none;}
nav a:active	{color:white; text-decoration: none;}
h1      {text-align:center;font-weight:normal;font-size:1.6em;font-family:'Red Rose', sans-serif;}
h2      {text-align:center;font-weight:normal;font-size:1.4em;margin-top:2em;font-family:'Red Rose', sans-serif;}
table.links {margin-left:auto;margin-right:auto;}
table.links td:nth-child(1) {text-align:right;padding-right:1em;}
table.links td:nth-child(2) {text-align:left;padding-left:1em;}
.link	{font-family:arial;
	text-align: center;
	}
.link a:link {color:#00008B;text-decoration: none;}
.link a:visited {color:#40408b;text-decoration: none;}
.txtcent        {
        text-align:center;
        left:0;
        right:0;
        margin-left:auto;
        margin-right:auto;
        padding:0;
        max-width:800px;
        }
.max300	{width:100%;max-width:300px;}
.fig	{
	display:flex;
	justify-content:center;
	}
.center	{
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	}
.flex	{display:flex;
	flex-wrap: wrap;
	justify-content:center;
	gap:0.01rem;
	}
footer  {
        display:flex;
        justify-content:center;
        margin-top:3rem;
        margin-bottom:4rem;
        font-size:1em;
}
footer:before   {
        content:"Copyright \00A9  2022, 2025 ALC Press. All rights reserved.";
}

.svgbutton      {width:100%;}
.svgbutton > .svgrect   {fill:#D2DDE0;}
.svgbutton > .svgtext   {fill:black;}
.svgrect        {stroke:black; stroke-width:0.4;}
.svgtext        {text-anchor:middle;font-family:Atkinson, Fallback, sans-serif;}
.svgbutton:hover > .svgrect {fill:green;}
.svgbutton:hover > .svgtext {fill:white;}
svg {filter: drop-shadow(3px 5px 2px rgb(0 0 0 / 0.4));  }

@media screen and (max-width: 1000px) {main {width:80%;}}
@media screen and (max-width: 800px) {main {width:90%;}}
@media screen and (max-width: 600px) {main {width:96%;}}
@media screen and (max-width: 300px) {main {width:99%;}}