body {
	margin:0;
	width:100%;
	min-width:640px;
	background-color:#ddd;
	color:#000;
	position:absolute;
	height:100%;
}
#header {
	position:fixed;
	min-width:800px;
	width:100%;
	height:165px;
	top:0;
	background-color:#99c;
	z-index:10;
	box-shadow:0 5px 5px rgba(64,64,64,0.5);
	border-bottom: 5px solid #fff;
}

body,p { font-family: Verdana, arial, sans-serif; }

h1,h2,h3 { font-family: 'Pacifico','Terminal Dosis Light', arial, serif;
	font-weight:normal;
	text-shadow: -1px -1px 0 #eef;
	clear:both;
	color:#669;
}

#header h1 {
	color:#fff;
	text-shadow:0 0 5px #229;
	margin: 0px 60px;
	padding:0;
	font-size:56px;
}

a {
	color:#669;
	text-decoration:none;
	border-bottom: 1px dotted #999;
}

a:hover {
	color:#922;
}

h1 { font-size:40px;margin:0}

.page {
	position:absolute;
	top:180px;
	margin:0px 60px;
	padding-bottom:60px;
}

p,ul {
	text-shadow: -1px -1px 0 #eef;
	margin-top:10px;
	line-height:1.7em;
	font-size:18px;
	color:#666;
}


#navigation {
	margin:20px 10px;
	padding:0;
	list-style:none;
	width:100%;
	text-shadow:none;
	position:absolute;
	bottom:-30px;
}

#navigation li {
	display:block;
	float:left;
}

#navigation li a{
	text-shadow: -1px -1px 0px #446;
	font-family: Verdana, Arial, Sans-serif;
	height:24px;
	display:block;
	float:left;
	width:140px;
	padding:10px;
	margin: 5px 5px 10px 0;
	text-align:center;
	text-decoration:none;
	vertical-align:middle;
	color:#eee;
	-webkit-transition:all 0.1s linear; 
	-moz-transition:all 0.1s linear; 
	-o-transition:all 0.1s linear; 
	border-top-left-radius:5px;
	-webkit-border-top-left-radius:5px;
	-moz-border-radius-topleft:5px;
	-o-border-top-left-radius:5px;
	border-top-right-radius:5px;
	-webkit-border-top-right-radius:5px;
	-moz-border-radius-topright:5px;
	-o-border-top-right-radius:5px;
	border:0;

background: #666699;
background: -moz-linear-gradient(top, #666699 0%, #666699 85%, #444477 100%, #bbbbcc 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#666699), color-stop(85%,#666699), color-stop(100%,#444477), color-stop(100%,#bbbbcc));
background: -webkit-linear-gradient(top, #666699 0%,#666699 85%,#444477 100%,#bbbbcc 100%);
background: -o-linear-gradient(top, #666699 0%,#666699 85%,#444477 100%,#bbbbcc 100%);
background: -ms-linear-gradient(top, #666699 0%,#666699 85%,#444477 100%,#bbbbcc 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#666699', endColorstr='#BBBBCC',GradientType=0 );
background: linear-gradient(top, #666699 0%,#666699 85%,#444477 100%,#bbbbcc 100%);


}

#navigation li a:hover {
	text-shadow: -1px -1px 0px #99a;
	color:#ffa;
	-webkit-transition:all 0.1s linear; 
	-moz-transition:all 0.1s linear; 
	-o-transition:all 0.1s linear; 

background: #bbbbcc;
background: -moz-linear-gradient(top, #bbbbcc 0%, #bbbbcc 85%, #888899 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#bbbbcc), color-stop(85%,#bbbbcc), color-stop(100%,#888899));
background: -webkit-linear-gradient(top, #bbbbcc 0%,#bbbbcc 85%,#888899 100%);
background: -o-linear-gradient(top, #bbbbcc 0%,#bbbbcc 85%,#888899 100%);
background: -ms-linear-gradient(top, #bbbbcc 0%,#bbbbcc 85%,#888899 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#BBBBCC', endColorstr='#888899',GradientType=0 );
background: linear-gradient(top, #bbbbcc 0%,#bbbbcc 85%,#888899 100%);

}

#navigation li a.selected {
	margin:0 5px 5px 0;
	height:32px;
	border-top-left-radius:10px;
	-webkit-border-top-left-radius:10px;
	-moz-border-radius-topleft:10px;
	-o-border-top-left-radius:10px;
	border-top-right-radius:10px;
	-webkit-border-top-right-radius:10px;
	-moz-border-radius-topright:10px;
	-o-border-top-right-radius:10px;
	background:#fff !important;
	box-shadow: 0px -2px 5px rgba(64,64,64,0.3);
	color:#669  !important;
	text-shadow:none;
	font-weight:bold;
	-webkit-transition:all 0.1s linear; 
	-moz-transition:all 0.1s linear; 
	-o-transition:all 0.1s linear; 
}

input[type="text"],textarea {
	width:580px;
	padding:5px 10px;
	font-size:14px;
	color:#999;
}

input[type="submit"] {
	width:180px;
}

#footer {
	position:fixed;
	bottom:0;
	z-index:20;
	background-color:#999;
	padding:10px 10px 10px 60px;
	width:100%;
	color:#eee;
	border-top:5px solid #fff;
	box-shadow:0 -5px 5px rgba(64,64,64,0.5);
}

#avatar {
	float:right;
}

/* Narrow Browsers */
@media screen and (max-width: 860px) {
	body {
		min-width:380px;
	}
	p,ul {
		font-size:14px;
	}
	#header {
		overflow:hidden;
		min-width:0;
		width:100%;
		position:absolute;
		height:120px;
	}
	#header h1 {
		font-size: 36px;
		margin:0 20px;
	}
	#avatar, #footer {
    		display: none;
  	}
	#navigation li a {
		width:65px;
		font-size:13px;
	}
	input[type="text"],textarea {
		max-width:580px;
		width:90%;
	}
	.page {
		margin: 0 20px;
		top: 120px;
	}
}