@charset "utf-8";
/* CSS Document */

/* GLOBAL SETTINGS */
html {
	font-family:"Square721 BT", "Trebuchet MS", "Verdana", sans-serif;
}
body {
	background:#666666;
	width:100%;
	height:100%;
	margin:0;
	color:#444444;
}
h1, h3, h4 {
	text-align:center;
}
h4 {
	font-weight:normal;
	color:#000000;
}

a {
	display:inline-block;
	text-decoration:none;
	background-color:#999999;
	color:#FFFFFF;
}
a:hover {
	color:#000000;
	cursor:pointer;
}

/* CLASSES */
.vbdr {width:20px; height:100%; position:absolute}
.hbdr {width:100%; height:20px; position:absolute}
.crnr {width:20px; height:20px; position:absolute}
.t {top:-20px;}
.l {left:-20px;}
.b {bottom:-20px;}
.r {right:-20px;}
	/*Shadow Images*/
	.st, .sr, .sb, .sl {background:rgba(0,0,0,.4);}
	.stl {background:url(../images/border/stl.png);}
	.str {background:url(../images/border/str.png);}
	.sbl {background:url(../images/border/sbl.png);}
	.sbr {background:url(../images/border/sbr.png);}

	/*Main Images*/
	.mt {background:url(../images/border/mt.png); overflow:hidden;}
	.mr {background:url(../images/border/mr.png);}
	.mb {background:url(../images/border/mb.png);}
	.ml  {background:url(../images/border/ml.png); overflow:hidden;}
	.mtl {background:url(../images/border/mtl.png);}
	.mtr {background:url(../images/border/mtr.png);}
	.mbl {background:url(../images/border/mbl.png);}
	.mbr {background:url(../images/border/mbr.png);}

	/*Logo Images*/
	.lbdr {background:#222222}
	.lbr {background:url(../images/border/lbr.png);}
	.ltr {background:url(../images/border/ltr.png);}
	.lbl {background:url(../images/border/lbl.png);}
	
	/*Navigation Images*/
	.nr {background:url(../images/border/nr.png);}
	.nb {background:url(../images/border/nb.png);}
	.nl  {background:url(../images/border/nl.png); overflow:hidden;}
	.nbl {background:url(../images/border/nbl.png);}
	.nbr {background:url(../images/border/nbr.png);}
	
/* Navigation Classes */
.navbutton {
	float:left;
	font-size:15px;
	text-align:center;
	position:relative;
	margin-top:5px;
	overflow:hidden;
	}
.navbutton a {
	display: block;
	overflow:visible;
	color:#000000;
	background-color:#FFFFFF;
	text-decoration:none;
	}
.navbutton span {
	display: block;
	margin-top:0px; padding: 12px 13px 12px 13px;
	}
.navbutton a:hover {
	color:#33CC00;
	}
.navbutton a:active {
	color: #000000;
	}

.req {
	color:#FF0000;
	font-size:14px;
}
/* ELEMENTS */
#page {
	width:80%;
	margin:50px auto;
	position:relative;
	min-width:720px;
}
/*CONTENT ELEMENTS */
	#logo {
		position:absolute;
			left:-40px; top:-40px;
		z-index:6;
	}

	#header {
		width:100%; height:110px;
		position:absolute;
			top:-10px; left:40px;
		background:#222222;
		z-index:5; 
	}
		#headerWatermark {
			 position:absolute;
				right:-20px; top:-20px;
		}
		#headerHeading {
			 margin-left:140px;
		}

	#sidebar {
		width:110px; height:100%;
		position:absolute;
			top:40px; left:-10px;
		background:#222222; color: #FFFFFF;
		font-size:.8em;
 		z-index:4;
	}
		#sidebarContent {
			margin-left:-10px;
			width:130px;
			margin-top:130px;
			position:relative;
			text-align:justify;	
		}
		#footer {
			margin-left:-10px;
			text-align:center;
			width:130px;
			font-size:.7em;
			position:absolute;
			bottom:-5px;
		}
			#footer div{
				text-align:justify;
			}

	#mainBox {
		width:100%; height:inherit;
		position:absolute;
		background:#CCCCCC;
		z-index:1;
	}
		#mainContent {
			position:relative;
			margin-top:180px;
			margin-left:160px;
			margin-right:10px;
			text-align:justify;
		}

	#navbar {
		width:445px; height:30px;
		position:absolute;
			top:115px; right:30px;
 		z-index:4;
		margin-top:0px;
		background:#FFFFFF;
	}
		#navbarButtons {
			margin-left:7px;
			position:relative;
			z-index:5;
		}
/* SHADOW ELEMENTS */
	/* Base Shadows */
	#mainBoxShadow {
		width:100%; height:inherit;
		position:absolute;
			top:10px; left:10px; 
		/*background:rgba(0,0,0,.4);*/
		z-index:0;
	}
	
	#headerBaseShadow {
		width:5px; height:110px;
		position:absolute;
			top:10px; right:-55px;
		background:rgba(0,0,0,.4);
		z-index:0;
	}
	
	#sidebarBaseShadow {
		width:110px; height:5px;
		position:absolute;
			bottom:-55px; left:5px;
		background:rgba(0,0,0,.4);
		z-index:0;
	}
	
	#logoBaseShadow {
		width:175px; height:180px;
		position:absolute;
			top:-10px; left:-15px;
		*/background:rgba(0,0,0,.4)*/
		z-index:0;
	}
	
	/* Main Box Shadows */
	#headerMainShadow {
		width:100%; height:110px;
		position:absolute;
			top:20px; right:-20px;
		background:rgba(0,0,0,.4);
		z-index:3;
	}

	#sidebarMainShadow {
		width:110px; height:100%;
		position:absolute;
			top:20px; left:15px;
		background:rgba(0,0,0,.4);
		z-index:3;
	}
	
	#logoMainShadow {
		width:5px; height:5px;
		position:absolute;
			left:145px;  top:150px;
		background:rgba(0,0,0,.4);
		z-index:3;
	}
	
	#navbarMainShadow {
		width:445px; height:0px;
		position:absolute;
			top:150px; right:25px;
 		z-index:3;
		background:#FFFFFF;
	}

	/* Header & Sidebar Shadows */
	#logoHeaderShadow {
		width:125px; height:150px;
		position:absolute;
			top:-20px;
		background:rgba(0,0,0,.4);
	}

	#logoSidebarShadow {
		width:150px; height:130px;
		position:absolute;
			left:-20px;
		background:rgba(0,0,0,.4);
	}
	
	/* Navbar Shadow */
	#headerNavbarShadow {
		width:100%; height:5px;
		position:absolute;
			top:5px;
 		z-index:6;
		background:rgba(0,0,0,.4);
	}