/*--------------------------
 * HTML Tags
 * -------------------------*/

body {
	font: normal 12pt Arial, Helvetica, sans-serif;
	
	margin: 0pt;
	padding: 0pt;
	
	overflow: hidden;
}


/*--------------------------
 * Classes
 * -------------------------*/

.Header,
.Header-Spacer {
	padding: 0pt;
}
.Header {
	width: 100%;
	
	position: fixed;
	top: 0px;
	left: 0px;
}

.Title,
.Title-Spacer {
	width: 58%;
	
	padding: 6pt;

	font-size: 16pt;
}
.Title {
	border-bottom: thin solid black;
	
	background-color: #FFFFFF;
}

.NavBar,
.NavBar-Spacer {
	width: 87%;
	
	padding: 3pt 6pt 6pt 6pt;
	
	font-size: 14pt;
}
.NavBar {
	border-bottom: thin solid black;
	
	background-color: #FFFFFF;
}

.Body {
	position: absolute;
	
	height: 100%;
	width: 100%;
	
	border: solid thin red;
}
.Body-Content {
	/* Should experiment outside of this page to determine 
	 * what combination of items will achieve desired result.
	 * Want to have body area scroll, but that's it.
	 * Accomplish with just using CSS... no frames. */
	position: relative;

	height: 100%;
/*
	width: 100%;
*/
	
	padding: 6pt;

	overflow-y: auto;
	
	border: solid thin red;
}

.SideBar {
	float: left;
}
.SideBar-Content {
	position: relative;
	left: 20%;
	
	background-color: #FF0000;
}

.Footer,
.Footer-Spacer {
	padding: 0pt;
}
.Footer {
	width: 100%;
	
	position: fixed;
	bottom: 0px;
	right: 0px;
	
/*	background-color: #FFFFFF;
*/
}

.LglBar,
.LglBar-Spacer {
	width: 87%;
	
	padding: 6pt;

	font-size: 10pt;
}
.LglBar {
	float: right;
	
	text-align: right;
	
	border-top: thin solid black;
}