/* home page styles */

:root
{
--main-background:#9A9CE9;
--menu-background:#E0E0E0;
}
 
html
{
width:100vw;
height:100vh;
color:#0F0F0F;
font-size:16px;
font-family:arial;
background:var(--main-background);
}

body
{
margin:3px;
overflow:hidden;
height: calc(100vh - 128px);
}

#blanket
{
top:0;
right:0;
bottom:0;
left:0;
display:none;
z-index: 1000;
position: absolute;
}

#menu
{
top:87px;
left:6px;
width:auto;
display:none;
z-index:2001;
position:absolute;
border:1px solid black;
background:var(--menu-background);
}

#settings
{
top:87px;
right:6px;
width:auto;
display:none;
z-index:2002;
position:absolute;
border:1px solid black;
background:var(--menu-background);
}

#langDiv
{
top:16px;
right:64px;
width:auto;
display:none;
z-index:2003;
position:absolute;
border:1px solid black;
background:var(--menu-background);
}

#admDiv
{
top:96px;
right:64px;
width:auto;
display:none;
z-index:500;
position:absolute;
border:1px solid black;
background:var(--menu-background);
}

#toolsDiv
{
display:none;
position:absolute;
top:80px;
right:0px;
left:0px;
bottom:40px;
z-index:501;
padding:64px 128px 64px 128px;
background:rgba(128,128,128,0.4);
}

#toolsFrame
{
display:none;
padding:0px;
margin:64px 0px 0px 0px;
width:calc(100% - 256px);
height:calc(100% - 128px);
background:#FFFFFF;
border:1px solid black;
}

div
{
margin:0;
padding:0;
width:100vw;
display:block;
}

iframe
{
margin:0;
padding:0;
border:none;
width:100vw;
height:100vh;
display:block;
}

.logoTable
{
top:0;
left:0;
right:0;
height:84px;
z-index:1001;
position:absolute;
background:var(--main-background);
}

img.logo
{
top:2px;
width:80px;
height:80px;
z-index:1002;
cursor:pointer;
position:absolute;
}

h1.logo
{
margin:3px;
text-align:center;
}

p.menu
{
margin:3px;
padding:6px;
cursor:pointer;
color:#000000;
text-align:center;
background:var(--menu-background);
white-space:nowrap;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

p.menu:hover
{
color:#F0F0F0;
background:#808080;
}

p.selected
{
margin:3px;
padding:6px;
color:#808080;
cursor:default;
text-align:center;
white-space:nowrap;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

p.unSelected
{
margin:3px;
padding:6px;
color:#F0F0F0;
background:#808080;
cursor:pointer;
text-align:center;
white-space:nowrap;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

p.unSelected:hover
{
color:#202020;
background:#F0F0F0;
}

#mainDiv
{
width:100%;
height:100%;
color:#000000;
margin-top:84px;
background:#FFFFFF;
}

#mainFrame
{
border: 1px solid black;
width: calc(100vw - 8px);
height: calc(100vh - 130px);
}

#footerDiv
{
left:8px;
bottom:8px;
height:32px;
position:fixed;
width: calc(100vw - 16px);
}

p.footer
{
line-height:24px;
margin:3px 6px 3px 6px;
}

.footerTable
{
float:left;
height:32px;
width:calc(30vw - 8px);
}

.footerBox
{
width:100%;
height:32px;
display:table;
}

p.footerText
{
font-size:14px;
display:table-cell;
vertical-align:middle;
}

/* eof */