body {
display:flex;
flex-direction:column;
width:100vw;
height:100vh;

}

label,button {
user-select:none;
}

#erp-all .pagehead {
display:none;
}


#erp-all .pagebody {
display:flex;
width:100vw;
flex-grow:2;
border:none;
position:relative;
}

#erp-all .pagebody iframe {
display:block;
width:100%;
height: calc(100vh - 60px);
background:rgba(255, 255, 255, 1);
border:none;
}

#erp-all .pagefoot {
display:flex;
justify-content:center;
width:100vw;
height:60px;
border:1px solid #CCC;
border-left:none;
border-right:none;
}

#erp-all .pagefoot .nav {
display:flex;
flex-direction:column;
justify-content:center;
align-items:center;
flex-grow:1;
text-align:center;
height:100%;
}

#erp-all .pagefoot .nav .label {
bottom:0;
order:1;
font-size:12px;
}

#erp-all .pagefoot .main {
order:0;
border-radius:100%;
border:5px solid #FFF;
background:#08F;
color:#FFF;
height:30px;
width:30px;
font-style:italic;
}

#erp-all .pagefoot .nav .button {
display:none;
}


#erp-all .pagefoot [state="active"] .label
{
	/*background: #08f;*/
	color:#888;
	/*font-weight: bold;*/
}

#erp-all .pagefoot .nav .main {
border:1px solid #888;
background:#fff;
color:#888;
margin-bottom:5px;
width:25px;
height: 25px;
}

#erp-all .pagefoot [state="active"] .main
{
	background: #08f;
	color:#ffff;
	border-color:#08f;
	font-weight: bold;
}

#erp-all .pagefoot [state="active"] .label
{
	/*background: #08f;*/
	color:#08f;
	font-weight: bold;
}