body
{ 
        margin: 0px;
        background: #000000;
        font-size: 2.3vw;
        line-height: 1.2;
//        font-family: Arial, Helvetica, sans-serif;
	font-family: "Times New Roman", Times, serif; 
        text-align: center;
}


:focus { outline: none; }
img { border: none; }

.nwrp { white-space: nowrap; }

a:link    { color: #2222EE; }
a:visited { color: #2222AA; }
a:hover   { color: #FFFFFF; background-color: #AAAAAA; }
a:active  { color: #FFFFFF; background-color: #CCCCCC; }

span.btn
{
        display: inline-block;
        border: 1px solid rgba(128,128,128,0.3);
        border-radius: 0.2rem;
        background: rgba(128,128,128,0.0);;
        color: rgba(128,128,128,0.3);
        width: 1.5em;
        height: 1.5em;
        line-height: 1.5em;
        font-size: 1.7rem;
        text-align: center;
        cursor: pointer;
	transition: background 300ms;
	user-select: none;
	-webkit-user-select: none;
           -moz-user-select: none;
            -ms-user-select: none;
                user-select: none;
}
span.btn:hover  { border: 1px solid #000000; color: #000000; background: #EEEEEE; }
span.btn:active { border: 1px solid #000000; color: #000000; background: #FFFFFF; }

.navtr0, .navtr1, .navtr2, .navtr3, .navbr0, .navbr1, .navbr2, .navbl0
{
        position: fixed;
        z-index: 1;
}
.navtr0 { top: 0.7rem; right: 0.7rem; }
.navtr1 { top: 4.2rem; right: 0.7rem; }
.navtr2 { top: 7.7rem; right: 0.7rem; }
.navtr3 { top: 11.2rem; right: 0.7rem; }
.navbr0 { bottom: 0.7rem; right: 0.7rem; }
.navbr1 { bottom: 0.7rem; right: 4.2rem; }
.navbr2 { bottom: 0.7rem; right: 7.7rem; }
.navbl0 { bottom: 0.7rem; left: 0.7rem; }

#sheet
{
	background: #FFFFFF;
	color: #000000;
	position: absolute;
        top: 0%;
        left: 0%;
        width: 100%;
        height: 100%;
}

#pagenum
{
	color: #888888;
	position: absolute;
        bottom: 5.1%;
        right: 3%;
	font-size: 0.7em;
}

div.ovl
{
        display: none;
        position: fixed;
        padding: 0.5rem 0.7rem 0.5rem 0.7rem;
        left: 0;
        top: 0;
        width: calc(100% - 1.4rem);
        height: 100%;
        overflow: auto;
        background-color: rgb(10,10,10);
        background-color: rgba(0,0,0,0.90);
        text-align: center;
        color: #FFFFFF;
        margin-bottom: 0.7rem;
	z-index: 2; 
}

.ovl a:link    { color: #AAAAAA; }
.ovl a:visited { color: #888888; }
.ovl a:hover   { color: #000000; background-color: #CCCCCC; }
.ovl a:active  { color: #000000; background-color: #AAAAAA; }

div.piece
{
	text-align: left;
	display: inline-block;
	position: absolute;	
	background: none; 
//	background: #CCCCCC; 
}

.fsXS { font-size: 0.50em; }
.fsS  { font-size: 0.75em; }
.fsM  { font-size: 1.00em; }
.fsL  { font-size: 1.25em; }
.fsXL { font-size: 1.50em; }
.fsXXL { font-size: 1.75em; }

div.hline, div.vline, div.Hline, div.line
{
	background: #000077;	
	border-radius: 0.17em;
	position: absolute;	
	display: inline-block;
}
div.hline { height: 0.15em; background-image: linear-gradient(to right, #FFFFFF, #000077 10%, #0000BB 50%, #000077 90%, #FFFFFF); }
div.vline { width:  0.15em; background-image: linear-gradient(to bottom, #FFFFFF, #000077 10%, #0000BB 50%, #000077 90%, #FFFFFF); }
div.Hline { height: 0.15em; background-image: linear-gradient(to right, #000077, #0000BB 50%, #000077 75%, #FFFFFF); }

div.line { height: 0.1em; background: #000077; }

hr { color: #000099; }
hr.ttl
{
	margin-top: 0.1em;
	margin-bottom: 0.1em;
}

img.piece
{
	display: inline-block;
	position: absolute;	
}

table { margin: 0px; display: inline-table; }

#mtable
{
	display: inline-table;
	margin-top: 1em;
	margin-bottom: 1em;
	color: #FFFFFF;
	border-collapse: collapse;
}
#mtable tr
{
	cursor: pointer;
}
#mtable tr td
{
	padding: 0.2em 0.7em 0.2em 0.7em;
	text-align: left;
}
#mtable tr td:first-child
{
	text-align: right;
	color: #999999;
}
#mtable tr:hover   { background-color: #333333; }
#mtable tr:active  { background-color: #555555; }

.lnk
{
	cursor: pointer;
}
.lnk:hover { opacity: 0.7; }
.lnk:active { opacity: 0.3; }

#extovl
{
	width: 100vw;
	height: 100vw;
	margin: 0px;
	padding: 0px;
}
iframe
{
	margin: 0px;
	width: 100vw;
	height: 100vh;
	border: none;
	overflow: auto;
}
span.hl { color: #000099; }
