@charset "utf-8";
/* CSS Document */
body, html { padding: 0px; margin: 0px; height: 100%; font-family: Arial, Helvetica, sans-serif; font-size: 13px; }

/* Positioning */
.left { float:left; }
.right { float:right; }
.center { margin: 0px auto; }
.clear { clear:both; }
/* Login Section(Page) */
.lsplitter { height: 50%; min-height: 150px; box-shadow: inset #3e3e3e 0px -5px 10px -3px; }

.shiftup { margin-top: -200px; }
.login { width: 340px; height: 350px; padding: 5px; margin-top: -150px; border-radius: 16px 16px 5px 5px; border: 2px solid #FFF; box-shadow: #3e3e3e 0px 0px 10px -5px; position:relative; }
	.login h1 { padding: 10px 0px; margin: 0px; font-size: 34px; }
	.login p { padding: 5px; margin: 0px; }
	.login form { padding: 5px 0px; margin: 0px; border-top: 1px solid #ececec; }
		.login form input[type=text],.login form input[type=password] { display:block; margin: 10px auto; width: 310px; padding: 10px; font-size: 14px; border-radius: 3px; border: 1px solid #cecece }
		.login form input[type=submit] { bottom: 5px; left: 5px; position:absolute; }
	.login .split { height: 1px; margin: 5px 0px; }
	/* Login Section Mobile Look */
@media all and (max-width: 360px) {
	.login { width: auto; min-width: 200px; border-radius: 0px; }
		.login form input[type=text],.login form input[type=password]  { width: 80%; }
}
	

/* Header Setup */
header { }
	header .logo { padding: 5px; }
		header .logo a { display:block; height: 90px; width: 250px; text-indent: -9999px; }
	
	header nav > ul {  padding: 0px; margin: 0px; list-style: none; box-shadow: #3e3e3e 0px 0px 10px -3px; position:relative;}
		header nav > ul li { float: left; padding: 0px; margin: 0px;  }
			header nav > ul li a { display: block; padding: 15px 25px; }
			/* Sub Nav */
			header nav > ul li > ul { list-style:none; padding: 0px; margin: 0px; display:none; position: absolute; right: 0px; overflow:hidden; text-align:right; border-radius: 0px 0px 6px 6px;  }
			header nav > ul li:hover > ul { display: block; }
				header nav > ul li > ul li { width: 250px; float:none; }
	/* Header Section Mobile Transition */
@media all and (max-width: 700px) {
	header nav > ul > .left, header nav > ul > .right { float:left; }
	
}
@media all and (max-width: 600px) {
	header .logo a { margin: 0px auto 0px auto; }
	header nav { padding: 5px 5px 3px 5px; position:relative; }
	header nav > .clear { clear:none; display: none; }
	nav { text-align: right; padding: 5px; }
	nav > a { display:inline-block; background: #000; height: 40px; width: 40px; margin: 0px; }
	header nav > ul, header nav:active > ul { 
		background: #fff;border: 5px solid #444;
		position: absolute; padding: 0px;
		right: 30px; top: 30px;
		width: 150px; float:none; display: none;
		border-radius: 4px 0 4px 4px;
	}
	header nav > ul > .left, header nav > ul > .right { float:none; }
	header nav > ul li {
		text-align: center;
		width: 100%; float:none;
		padding: 5px 0; border: none !important;
		margin: 0; position:relative;
	}
	header nav > ul li > ul { display: none; top: 50px; right: -5px; position:absolute; width: 150px; }
	header nav > ul li:hover > ul { display: block; }
	header nav > ul li:hover > ul li { width: 100%; }
	nav:hover > ul {
		display: block;
	}
}


/* Body Setup */
.fixed { max-width: 1024px; margin-left: auto; margin-right: auto; }

.body { margin-top: 50px; min-height: 50px; }
	/* Collumns for Laying out Body */
	.body .c1-3 { width: 33.3333%; }
	.body .c2-3 { width: 66.6666%; }
	.body .c1-4 { width: 24.9999%; }
	.body .c2-4 { width: 49.9999%; }
	.body .c3-4 { width: 74.9999%; }
	/* Main Containers Setup for Spacing and Background */
	.body .container { padding: 5px; margin: 10px; border-radius: 5px;  }
		/* Default Setup */
		.body h1 { padding: 5px; margin: 0px 0px 5px 0px; }
		.body h2 { padding: 5px; margin: 0px 0px 5px 0px; }
		.body h3 { padding: 5px; margin: 0px 0px 5px 0px }
		.body h4 { padding: 5px; margin: 0px 0px 5px 0px }
		.body p { padding: 5px; margin: 0px 0px 5px 0px }
		/* Table Default */
		.body table { width: 100%; margin: 0px 0px 5px 0px; }
			.body table th { padding: 5px; }
			.body table td { padding: 5px; }
	/* Footer in Body */
	.body > footer { padding: 10px 5px; margin: 5px 10px 5px 10px; }


@media all and (max-width: 700px) {
	.body > .left, .body > .right { float:none; }
	.body > .c1-3, .body > .c2-3, .body > .c1-4, .body > .c2-4, .body > .c3-4 { width: 100%; }
}