/* written by boyzonder, copyright 2004 */

/* the body tags, which apply all throughout the document */
body {
	font-family: "Aharoni", "Tahoma", "Bitstream Vera Sans", "Luxi Sans", sans-serif;
	color: #8B008B; /* darkmagenta */
	background-color: #98FB98; /* palegreen */
	padding-top: 3%;
	padding-bottom: 3%;
}

/* color of pre-formatted text */
pre {
	color: #00008B; /* darkblue */
}

/* the title class, which is the title :-) */
#title {
	display: none;
}

/* bottomnote is small line at the bottom of the screen */
#bottomnote {
	position: absolute;
	bottom: 1%;
	left: 1%;
	
	font-size: xx-small;
}

/* the page class, which is the main text */
#page {
	position: relative;
	top: 25%;
	left: 10%;
	width: 60%;

	text-align: justify;
}
#page a {
	color: #8B0000; /* darkred */

	text-decoration: none;
}
#page a:visited {
	color: #8B0000; /* darkred */

	text-decoration: none;
}
#page a:hover {
	color: #8B0000; /* darkred */

	font-weight: bold;
	text-decoration: none;
}
#page h1 {
	text-align: right;
	margin-left: -10%;
	margin-right: -8%;
}
#page h2 {
	text-align: right;
	margin-left: -10%;
	margin-right: -6%;
}
#page h3 {
	text-align: right;
	margin-left: -10%;
	margin-right: -4%;
}

/* the menu class, which is the navigation menu on the left */
#menu {
	position: absolute;
	top: 0%;
	right: 5%;
	width: 18%;
	height: 100%;
	padding-top: 25%;
	float: right;

	background-color: #8B0000; /* darkred */
	background-image: url("images/xaos.png");
	background-repeat: no-repeat;
	background-position: top center;	
	border: 1px solid white;

	font-size: large;
	text-align: center;
    text-transform: lowercase;
}
[id="menu"] {
	position: fixed !important;
}
#menu a {
	padding-left: 20px;
	padding-right: 20px;

	color: #DAA520; /* goldenrod */
	text-decoration: none;
}
#menu a:visited {
	color: #DAA520; /* goldenrod */
	text-decoration: none;
}
#menu a:hover {
	color: #DAA520; /* goldenrod */
	text-decoration: none;
	font-weight: bold;
}
#menu a.extras {
	color: #98FB98; /* palegreen */
}
#menu-extras {
	display: none;
}

/* remove image borders */
img {
	border: 0px;
}

/* some custom image classes */
.leftimage {
    float: right;
    padding: 1%;
}
.rightimage {
    float: left;
    padding: 1%;
}
.centerimage {
	display: block;
	text-align: center;
}
.leftphoto {
	text-align: right;
	margin-left: -100%;
}
.rightphoto {
}

/* a custom note class*/
.note {
	padding: 1%;

	color: #B8860B; /* darkgoldenrod */
	border: 1px dashed #B8860B; /* darkgoldenrod */

	font-size: small;
}

/* a warning class */
.warning {
	float: left;
	margin: 1%;
	padding: 1%;
	width: 20%;
	position: relative;
	z-index: 32;


	color: white;
	background-color: red;

	font-size: x-small;
	font-weight: bold;
	text-align: center;
}

/* ID's for some info pop-ups */
#firefoxpopup {
	float: left;
	position: absolute;
	width: 80%;
	z-index: 16;
	margin-left: 3%;
	padding: 1%;
	
	background-color: silver;
	color: black;
	display: none;
	
	font-size: x-small;
}
#firefoxpopup pre {
	color: #00008B; /* darkblue */
}
#stylepopup {
	float: left;
	position: absolute;
	width: 80%;
	z-index: 16;
	margin-left: 3%;
	padding: 1%;
	
	background-color: silver;
	color: black;
	display: none;
	
	font-size: x-small;
}

/* button class, for nice buttons */
#page a.X {
	padding: 0px 3px 0px 5px; 

	color: #8B008B; /* darkmagenta */
	background-color: transparent;

	text-decoration: none; 
	font-weight: bold; 
}
#firefoxpopup a.X {
	color: #8B008B; /* darkmagenta */
	background: transparent;
}
#stylepopup a.X {
	color: #8B008B; /* darkmagenta */
	background: transparent;
}

/* classes for the valid W3-something buttons 
.W3button {
	display: none;
}
*/

/* classes for the valid W3-something buttons */
.W3button {
	position: relative;
	left: -25%;
	float: right;
   padding: 1%;
   font-weight: bold;
}
.W3button a {
	display: inline;
}
.W3button a.w3c {
	border: 1px solid black;
   font-size: xx-small;
	padding-left: 10px;
	padding-right: 10px;
	text-align: center;
}
.W3button a.spec {
	border: none;
   font-size: xx-small;
	padding-left: 5px;
	padding-right: 5px;
}
.W3button a.w3c:link,
.W3button a.w3c:visited,
.W3button a.w3c:hover {
	background-color: #fff;
	color: #0c479d;
	text-decoration: none;
}
.W3button a.spec:link,
.W3button a.spec:visited,
.W3button a.spec:hover {
	background-color: #98FB98; /* palegreen */
	text-decoration: none;
}