html {
	margin: 0;
	padding: 0;

	width: 100%;
	
	color: #000;
	background-color: #efefef;

	text-align: left;
	
	font-family: "arial";
	font-size: 14px;
	
	overflow-x: hidden;	
	overflow-y: auto;	
}

body {
	margin: 0;
	padding: 0;

	width: 100%;
}

header {
	margin: 0;
	padding: 0;
}

/* ------------------ DIVs ------------------ */

div {
	margin: 0;
	padding: 0;
}

div.left {
	margin: 0 15px 0 0;
	float: left;
}

div.right {
	float: left;
}

/* ------------------ Images ------------------ */

img {
	margin: 15px 10px 5px 0;
	padding: 0;

	vertical-align: middle;	

	border-style: none;

	-moz-background-clip: padding; /* Good looking borders */
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
	
	-moz-border-radius: 11px;
	-webkit-border-radius: 11px;
	border-radius: 11px;

	-moz-box-shadow: 0px 1px 2px 0px #c1c1c1;
	-webkit-box-shadow: 0px 1px 2px 0px #c1c1c1;
	box-shadow: 0px 1px 2px 0px #c1c1c1;
		
}

img.self-portrait {
	margin: 0 0 10px 0;
}

/* ------------------ Paragraphs ------------------ */

p {
	margin: 5px 0 0 0;
	padding: 0;
}

p.hint {
	margin: 0 0 15px 0;

	color: #888;		
	font-size: 12px;
}

/* ------------------ Headers ------------------ */

h1 {
	margin: 20px 0 0 0;
	padding: 0;
	
	color: #888;
	font-size: 22px;

	text-shadow: 0px 1px 0px #fefefe;
}

h1:first-child {
	margin: 0;
}

h2 {
	margin: 15px 0 0 0;
	padding: 0;
	
	color: #888;
	font-size: 16px;	

	text-shadow: 0px 1px 0px #fefefe;
}

h2:first-child {
	margin: 0;
}

/* ------------------ Links ------------------ */

a {
	margin: 0;
	padding: 0;
		
	color: #4083a9;
}

a:hover {
	color: #205f82;
}

a:active {
	color: #4083a9;
}

a:visited {
	color: #4083a9;
}

a:visited:hover {
	color: #205f82;
}

/* ------------------ Navigation ------------------ */

nav {
	margin: 0 auto 15px auto;
	padding: 15px;

	width: 85%;
	max-width: 1200px;
	
	background: #525d69;

	
	border-style: none;

	-moz-background-clip: padding; /* Good looking borders */
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
	
	-moz-border-radius: 0 0 11px 11px;
	-webkit-border-radius: 0 0 11px 11px;
	border-radius: 0 0 11px 11px;

	-moz-box-shadow: 0px 1px 2px 0px #c1c1c1;
	-webkit-box-shadow: 0px 1px 2px 0px #c1c1c1;
	box-shadow: 0px 1px 2px 0px #c1c1c1;
	
	text-align: center;
	white-space: nowrap;
	overflow: hidden;
}

nav ul {
	margin: 0;
	padding: 0;

	list-style-type: none;
}

nav li {
	margin: 0;
	padding: 0;

	display: inline;
}

nav a {
	margin: 0 7px 0 7px;
	padding: 5px 12px 5px 12px;
	
	color: #a0a8af;
	
	-moz-border-radius: 11px;
	-webkit-border-radius: 11px;
	border-radius: 11px;
	
	-moz-transition: all 250ms linear;
	-webkit-transition: all 250ms linear;
	-o-transition: all 250ms linear;
	transition: all 250ms linear;	
	
}

nav a:hover {
	color: #fff;

	background: #7b838b;
	background: -moz-linear-gradient(top, #7b838b 75%, #686f76 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(75%, #7b838b), color-stop(100%, #686f76));
	background: -webkit-linear-gradient(top, #7b838b 75%, #686f76 100%);
	background: -o-linear-gradient(top, #7b838b 75%, #686f76 100%);
	background: linear-gradient(top, #7b838b 75%, #686f76 100%);

	-moz-box-shadow: 0px 1px 1px 0px #414D57;
	-webkit-box-shadow: 0px 1px 1px 0px #414D57;
	box-shadow: 0px 1px 1px 0px #414D57;

}

nav a:active {
	color: #fff;
}

nav a:visited {
	color: #A0A8AF;
}

nav a:visited:hover {
	color: #fff;
}

nav span.current_page {
	margin: 0 7px 0 7px;
	padding: 5px 12px 5px 12px;
	
	color: #fff;
	
	background: #4083a9;
	background: -moz-linear-gradient(top, #4083a9 75%, #356e8c 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(75%, #4083a9), color-stop(100%, #356e8c));
	background: -webkit-linear-gradient(top, #4083a9 75%, #356e8c 100%);
	background: -o-linear-gradient(top, #4083a9 75%, #356e8c 100%);
	background: linear-gradient(top, #4083a9 75%, #356e8c 100%);

	-moz-border-radius: 11px;
	-webkit-border-radius: 11px;
	border-radius: 11px;
	
	-moz-box-shadow: 0px 1px 1px 0px #414D57;
	-webkit-box-shadow: 0px 1px 1px 0px #414D57;
	box-shadow: 0px 1px 1px 0px #414D57;
}

nav#main_menu {
	margin: 0 auto 0 auto;
	
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	border-radius: 0;
}

nav#sub_menu {
	margin: 0 auto 15px auto;
	padding: 15px;
	
	background: #f6f6f6;

	border-style: none;
	border-width: 1px;
	border-color: #fff; 
	
	-webkit-box-shadow: 0px 1px 2px 0px #c1c1c1;
	-moz-box-shadow: 0px 1px 2px 0px #c1c1c1;
	box-shadow: 0px 1px 2px 0px #c1c1c1;
	
	-moz-border-radius: 0 0 11px 11px;
	-webkit-border-radius: 0 0 11px 11px;
	border-radius: 0 0 11px 11px;
	
	white-space: normal;
}

nav#sub_menu span.current_page {
	color: #fff;
	
	background: #b6bcc1;

	-moz-border-radius: 11px;
	-webkit-border-radius: 11px;
	border-radius: 11px;
	
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
}

nav#sub_menu a:hover {
	color: #fff;

	background: #d9dcde;

	-moz-border-radius: 11px;
	-webkit-border-radius: 11px;
	border-radius: 11px;

	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
}

/* ------------------ Sections ------------------ */

section {
	margin: 5px auto 0 auto;
	padding: 15px;

	width: 85%;
	max-width: 1200px;
	
	background: #f6f6f6;	
	
	border-style: solid none none none;
	border-width: 1px;
	border-color: #fff;

	-moz-background-clip: padding; /* Good looking borders */
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
	
	-moz-border-radius: 11px;
	-webkit-border-radius: 11px;
	border-radius: 11px;

	-moz-box-shadow: 0px 1px 2px 0px #c1c1c1;
	-webkit-box-shadow: 0px 1px 2px 0px #c1c1c1;
	box-shadow: 0px 1px 2px 0px #c1c1c1;
	
	overflow: hidden;	
}

section.film {
	color: #fff;
	background: #363636;
	
	border-style: none;
}

section.film {
	-moz-box-shadow: 0px 1px 2px 0px #080808;
	-webkit-box-shadow: 0px 1px 2px 0px #080808;
	box-shadow: 0px 1px 2px 0px #080808;
}

section.film img {
	-moz-box-shadow: 0px 1px 2px 0px #080808;
	-webkit-box-shadow: 0px 1px 2px 0px #080808;
	box-shadow: 0px 1px 2px 0px #080808;
}

section.film h1 {
	text-shadow: 0px 1px 1px #131313;
}

section#recent_photo {
	text-align: center;
}

/* ------------------ Articles ------------------ */

article {
	margin: 0;
	padding: 10px 0 10px 0;

	border-width: 1px;
	border-style: none none dashed none;
	border-color: #ddd;	
}

article:last-child {
	border-style: none;
}

/* ------------------ Forms ------------------ */

form {
	margin: 20px 0 0 0;
	padding: 0;
}

input {
	margin: 0 5px 10px 5px;
	padding: 5px;

	background: #fafafa;

	text-align: left;
		
	font-family: "arial";
	font-size: 14px;
	
	border-width: 1px;
	border-style: solid;
	border-color: #e0e0e0;

	-moz-background-clip: padding; /* Good looking borders */
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
	
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	
	resize: none;
}

input[type=text] {
	width: 250px;
}

input[type=number] {
	width: 50px;
}

button.key {
	margin: 0;
	padding: 3px 5px 3px 5px;
	
	color: #fff;
	background: #2E2E2E;

	border-style: solid;
	border-width: 1px;
	border-color: #404040;

	-moz-background-clip: padding; /* Good looking borders */
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
	
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;

	-moz-box-shadow: 0px 2px 2px 0px #2D2D2D;
	-webkit-box-shadow: 0px 2px 2px 0px #2D2D2D;
	box-shadow: 0px 2px 2px 0px #2D2D2D;
}

button.key:active {
	-moz-box-shadow: 0px 1px 0px 0px #2D2D2D;
	-webkit-box-shadow: 0px 1px 0px 0px #2D2D2D;
	box-shadow: 0px 1px 0px 0px #2D2D2D;	
	
	position: relative; /* Click! */
	top: 2px;
}

button.key_pressed {
	margin: 0;
	padding: 3px 5px 3px 5px;
	
	color: #fff;
	background: #2E2E2E;

	border-style: solid;
	border-width: 1px;
	border-color: #404040;

	-moz-background-clip: padding; /* Good looking borders */
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
	
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;

	-moz-box-shadow: 0px 1px 0px 0px #2D2D2D;
	-webkit-box-shadow: 0px 1px 0px 0px #2D2D2D;
	box-shadow: 0px 1px 0px 0px #2D2D2D;	
	
	position: relative; /* Click! */
	top: 2px;
}

/* ------------------ Time ------------------ */

time {
	margin: 0;
	padding: 0;
	
	color: #999;
	
	font-size: 12px;
}

/* ------------------ Footer ------------------ */

footer {
	margin: 5px auto 0 auto;
	padding: 15px;

	width: 85%;
	max-width: 1200px;
	
	color: #999;
	
	text-align: right;	
			
	text-shadow: 0px 1px 0px #f6f6f6;

	font-size: 12px;

	overflow: hidden;	
}

footer img {
	margin: 10px 0 10px 0;
	padding: 0;
}