@charset "utf-8";
/* CSS Document */

body {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	margin: 0; /* Es empfiehlt sich, margin (Rand) und padding (Auffüllung) des Body-Elements auf 0 einzustellen, um unterschiedlichen Browser-Standardeinstellungen Rechnung zu tragen. */
	padding: 0;
	text-align: center; /* Hierdurch wird der Container in IE 5*-Browsern zentriert. Dem Text wird dann im #container-Selektor die Standardausrichtung left (links) zugewiesen. */
	background-color: #5297a2;
	background-image: url(images/09_note_background.jpg);
	background-repeat: repeat-x;
}
#body {
	width: 837px;  /* Mit einer Breite, die 20 Pixel unter der vollen Breite von 800 Pixel liegt, können Sie dem Browser-Chrome Rechnung tragen und gleichzeitig eine horizontale Bildlaufleiste vermeiden. */
	margin: 0 auto; /* Durch automatische Ränder (in Verbindung mit einer Breite) wird die Seite zentriert. */
	text-align: left; /* Hierdurch wird die Einstellung text-align: center im Body-Element überschrieben. */
}
#header {
	background-image: url(images/09_note_header.png);
	background-repeat: no-repeat;
	height: 289px;
	background-position: center;
}
#body #header .bookmark {
	position: relative;
	left: 80px;
	top: 5px;
	width: 400px;
	height: 54px;
}
#body #header .bookmark p {
	z-index: 5;
	position: absolute;
	top: 5px;
	font-family: "Arial Black", Gadget, sans-serif;
	color: #FC6;
	margin-left: 20px;
}
#body #header .sticker {
	background-image: url(images/09_note_sticker.png);
	background-repeat: no-repeat;
	position: relative;
	width: 260px;
	height: 320px;
	top: -25px;
	padding-left: 580px;
	background-position: 560px;
	padding-right: 20px;
}
#body #header .sticker p {
	font-size: 0.9em;
	padding-top: 50px;
	padding-left: 20px;
}
#body #header .text {
	padding-left: 85px;
	float: left;
	visibility: hidden;
}
#page {
	background-image: url(images/09_note_page.png);
	background-repeat: repeat-y;
	background-position: center;
	padding-right: 85px;
	padding-left: 85px;
	padding-top: 23px;
	font-size: 0.9em;
	padding-bottom: 23px;
}
.tooltip {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
	display: none;
	background-color: #5297a2;
	text-align: center;
	border: thin solid #09F;
	padding: 5px;
	font-size: 0.6em;
	color: #FFF;
}
.tooltip img {
	border: thin solid #FFF;
	padding: 2px;
}
#footer {
	background-image: url(images/09_note_footer.png);
	background-repeat: no-repeat;
	height: 191px;
	background-position: center;
	top: -23px;
	position: relative;
}
#body #footer .bookmark {
	top: 20px;
	left: 180px;
	position: relative;
	width: 580px;
	height: 100px;
}
#body #footer .bookmark p {
	font-size: .7em;
	text-align: right;
	padding-top: 50px;
}
.small {
	font-size: 0.6em;
}
.hidden {
	display: none;
}