*
{ 
	font-size: 1em;
	hyphens: auto;
}
BODY
{
	background-color: #596BC7;
	color: black;
	font: 1em/1.4 Georgia, Serif;
 font-size: 1.4em;
}
H1, H2, H3, H4
{
	color: #3C361F;
	background-color: #99a5cc;
	text-align: center;
	border-left: 0.2em solid #3a674e;
	border-right: 0.2em solid #3a674e;
	border-radius: 0.5em;
}
P
{
	color: #000;
	background-color: #596BC7;
	text-align: justify;
}
P.right
{
	color: #000;
	background-color: #596BC7;
	text-align: right;
}
P.left
{
	color: #000;
	background-color: #596BC7;
	text-align: left;
}
P.center
{
	color: #000;
	background-color: #596BC7;
	text-align: center;
}

P.hr1
{
	text-align: left;
}
P.hr2
{
	text-indent: 12px;
	text-align: left;
}
P.map1
{
	text-indent: 0px;
	text-align: left;
	font-size: 140%;
}
P.map2
{
	text-indent: 6px;
	text-align: left;
	font-size: 120%;
}
P.ip
{
	font-size: 120%;
	text-align: center;
}
P.quote
{
	text-align: center;
	font-style: italic;
}
P.copyright
{
	font-size: 90%;
	text-align: center;
}
P.small
{
	font-size: 80%;
	text-align: center;
}
P.big-links
{
	text-align: left;
}
P.index-headers
{
	background-color: #000022;
}
P.index-link
{
	margin: 8px 0px;
	font-size: normal;
	text-align: left;
}
PRE
{
	color: #000;
}
ul
{
    color: #000;
    background-color: #596BC7;
    text-align: left;
    list-style-type: none;
    text-indent: 0px;
}
ul.solution
{
	color: #000;
	background-color: #596BC7;
	text-align: center;
	text-indent: 0px;
}
ol.solution
{
    color: #000;
    background-color: #000030;
    text-align: center;
 text-indent: 0px;
}
ol
{
	color: #000;
	background-color: #596BC7;
	text-align: justify;
	text-indent: 0px;
}
li
{
	color: #000;
	margin-top: 6pt;
	text-align: justify;
}
li.justify
{
	margin-top: 6pt;
	text-align: justify;
}
a:link
{
	color: #fff5a5;
}
A:visited
{
 color: #aaaaff;
}
a:hover, a:active
{
	background-color: #f44336;
}
span
{
	color: #3C361F;
	background-color: #99a5cc;
    font-weight: bold;
}
span.code
{
    padding: 0.5em;
    border: 1px dashed silver;
    color: #6666ff;
    background-color: #000000;
    overflow: auto;
    font-family:"Courier New", Courier, monospace;
    font-size:100%;
    display:block;
	white-space: pre;
}
span.tel
{
    background-color: #000066;
    color: #ff3333;
    font-weight: bold;
}
span.kok
{
    background-color: #000066;
    color: #ff3333;
    font-weight: bold;
}
span.userdata
{
    background-color: #330000;
    color: #ff3333;
    font-weight: bold;
}
span.result
{
    background-color: #003300;
    color: #33ff33;
    font-weight: bold;
}
table
{
    padding: 4px;
    border-right: thin inset;
    border-top: thin inset;
    border-left: thin inset;
    border-bottom: thin inset;
    color: #000;
    font-size: 0.6em;
}
TD.center
{
	vertical-align: middle;
	text-align: center;
}
img.floatright
{
	float: right;
	margin: 10px;
}
img.floatleft
{
	float: left;
	margin: 10px;
}
img
{
   max-width: 100%;
   height: auto;
}
div.links
{
	position: absolute;
	margin: 0 0 10px 10px;
	width: 18%;
	top: 0;
	font-size: 0.65em;
}
div.content
{
	width: 73%;
	left: 25%;
	position: relative;
	font-size: 100%;
}
div.right
{
	text-align: right;
	position: relative;
	right: 0px;
	font-size: 150%;
}
div.link-headers
{
	background-color: #000022;
	border: thin solid;
	font-size: 100%;
}
div.tabbed {
	font-size: 1em;
}
div.tabs a {
	font-family: Verdana, Arial, Helvetica, sans-serif;	
	font-size: 100%;
	color: #fff5a5;
	text-align: left;
}
div.tabs a:hover {
	background-color: #f44336;
}

div.tab {
	color: #ccccff;
    display: none;
	margin: 1% 1% 1% 1%;
}

div.tab:target {
    display: block;
}

:target div.tab {
    display: block;
}
:target div.tab + div.tab{
    display: none;
}
.graph
{
	height: 12pt;
	background-color: #88e;
	float: left;
}

@media 
only screen
and (min-device-width: 320px)
and (max-device-width: 480px)
{
	body{
		font-size: 1em;
	}
	div.content
	{
		width: 60%;
		left: 40%;
	}
	img
	{
		max-width: 60%;
		height: auto;
	}
p,H1,H2,H3,H4,H5,li,ol,tr,td,th
	{
		font-size: 1em;
	}
	P.big-links
	{
		background-color: #596BC7;
		text-align: left;
	}
	div.links
	{
		position: absolute;
		margin: 0 0 20px 20px;
		width: 28%;
		top: 0;
	}
	div.tabbed, div.link-headers, div.tabs
	{
		font-size: 1em;
	}
	p.index-link, p.small,div.link-headers
	{
		margin: 0 0 30px 0px;
	}
}

@media (prefers-color-scheme: dark) {
body, p, ol, li, p.center, p.right, *{
	background: #000033;
	color: #fff;
	}
	h1, h2, h3, h4 {
	color: #99ffff;
	background-color: #003366;
	border-left: 0.2em solid #000066;
	border-right: 0.2em solid #000099;
	}
	div.tabs a, a:link {
		color: #fa3;
		background-color: #000033;
	}
	div.tabs a:hover, a:hover{
	background-color: #110;
	}
}