/*@import url('../../modern/css/screen.css');*/

html, body {
	margin:0px;
	padding:0px;
}


html {
	background-color: black;
}

/* Put some wooden boards behind the site */
body {
	background-image: url('../img/background.jpg');
	background-repeat: no-repeat;
	background-attachment: fixed;
}


/* Build the main layout. The menubar is left, the page is right and the footer
 * ends up below both. We also clear #footerbottom so all of the floating
 * stuff in the footer will still stretch up the body element and get a
 * background. */

#header {
	height: 30px;
	margin-bottom: 70px;
}

#menubar {
	float: left;
	width: 290px;
}

#page {
	float: left;
	width: 650px;
}

body {
	/* Ensure that both floats fit next to each other, even on small
	 * screens */
	min-width: 100px;
}

#footer, #footerbottom {
	clear: both;
}

.sidebar {
	position: absolute;
	left: 1020px;
	top: 200px;
	margin: 0;
	padding: 1em;
	background-color: rgb(43, 66, 76); /* fallback */
	background-color: rgba(43, 66, 76, 0.85);
	background-opacity: 50%;
	border-radius: 15px;
}

.table-of-contents,
#content .table-of-contents a:visited,
#content .table-of-contents a {
	color: #c0c0c0;
	font-weight: bold;
}

.table-of-contents-heading {
	/* Don't show the "Contents" heading */
	display: none;
}

/* Use moderate indent for each list */
.table-of-contents ol,
.table-of-contents ul {
	padding-left: 30px;
	margin-left: 0;
}

/* except the first */
.table-of-contents > ol,
.table-of-contents > ul {
	padding-left: 0;
}

.table-of-contents li {
	/* Hide numbers */
	list-style-type: none;
}

/****************************************
 * Set up the menu bar at the left 
 ****************************************/

#menubar {
	padding: 30px;
	width: 290px;
}

/* Put the logo in the upper right */
#logo {
	position: absolute;
	top: 50px;
	left: 800px;
}

#menubar ul {
	/* Disable all default list-style stuff */
	padding-left:0px;
	margin:0;
	list-style-type:none;
	list-style-position:outside;
}
/*
#menubar li {
	 Center the menu items /
	text-align: center;

	/* Set a big font /
	font-family: serif;
	font-size: 35px;
	font-weight: bold;

	/* And set up some spacing /
	height: 60px;
}

/* Disable underlining /
#menubar li a {
	text-decoration:none;
}

/* Give the menu bar links a hover color 
#menubar li a:hover {
	color: white;
}*/

li.MenuItem { height:44px; width:138px; margin-bottom:5px;}
li.SubMenuItem { height:30px; width:121px; margin-left:20px;margin-bottom:5px;}
li.MenuItem a,
li.SubMenuItem a {
	background-repeat:no-repeat;
	background-position:0 0px;
	display:block;
	width:100%;
	height:100%
}
li.MenuItem a span,
li.SubMenuItem a span {display:none;}
li.MenuItem a:hover {background-position:0px -44px;}
li.SubMenuItem a:hover {background-position:0px -33px;}

li#MenuHome {width:85px;}
li#MenuHome a { background-image:url('../img/menu/home.png')}

li#MenuDisclaimer {width:275px;}
li#MenuDisclaimer a { background-image:url('../img/menu/disclaimer.png')}

li#MenuOrga {width:99px;}
li#MenuOrga a { background-image:url('../img/menu/orga.png')}

li#MenuRegels {width:207px;}
li#MenuRegels a { background-image:url('../img/menu/regelsysteem.png')}

li#MenuSetting {width:129px;}
li#MenuSetting a { background-image:url('../img/menu/setting.png')}

	li#SubMenuLevenIn { width:197px}
	li#SubMenuLevenIn a { background-image:url('../img/menu/levenin.png')}
	li#SubMenuDeFamilies { width:136px}
	li#SubMenuDeFamilies a { background-image:url('../img/menu/defamilies.png')}
	li#SubMenuGlossary { width:121px}
	li#SubMenuGlossary a { background-image:url('../img/menu/glossary.png')}
	li#SubMenuHiervoor { width:121px}
	li#SubMenuHiervoor a { background-image:url('../img/menu/hiervoor.png')}
	li#SubMenuDeVeste { width:121px}
	li#SubMenuDeVeste a { background-image:url('../img/menu/deveste.png')}

li#MenuPersonages {width:180px;}
li#MenuPersonages a { background-image:url('../img/menu/personages.png')}

li#MenuPersonagecreatie {width:271px;}
li#MenuPersonagecreatie a { background-image:url('../img/menu/personagecreatie.png')}

li#MenuInschrijven {width:159px;}
li#MenuInschrijven a { background-image:url('../img/menu/inschrijven.png')}

li#MenuForum {width:103px;}
li#MenuForum a { background-image:url('../img/menu/forum.png')}

li#MenuSfeer {width:219px;}
li#MenuSfeer a { background-image:url('../img/menu/sfeer.png')}

/****************************************
 * Set up the fancy window around the content
 ****************************************/


/* All of these parts have the same width, including the frame (actual window
 * will be smaller) */
#pagetop, #pagemiddle, #pagebottom {
	width: 650px;
}

/* Set the background images and heights */
#pagetop {
	height:66px;
	background-image:url('../img/frame/top.png');
	background-repeat: no-repeat;
}

#pagemiddle {
	background-image:url('../img/frame/middle.png');
	background-repeat:repeat-y;
	/* Add a tiny padding to prevent a mysterious gap between
	 * #pagemiddel and #pagebottom... */
	padding: 1px 0;
}

#pagebottom{
	height: 78px;
	background-image:url('../img/frame/bottom.png');
	background-repeat: no-repeat;
}

#pagemiddle {
	/* Add padding to prevent the margins from the stuff inside
	 * #pagemiddle (div, p, h1) from sticking out at the top */
	padding-top: 1px;
}

#window {
	/* Keep the window away from the frame edges */
	padding: 0 75px;
}

/****************************************
 * Set up the content formatting
 ****************************************/

/* Set up a fallback color, used for text outside of the content area (login
 * link, editbar, etc.) */
body, body a, body a:visited {
	color: black;
}

/* Set up main text color */
#content {
	color:#fff;
}

/* Set up header colors */
#content h1,
#content h2,
#content h3 {
	color:#fff;
}

#content a, #content a:visited {color: #B0A884;}
#content a:hover, #content a:visited:hover {color: #fff;}
#content a.nonexistent, #content a.badinterwiki {color: #000;}


/* Set up fonts */
#content {
	font-family:verdana, sans-serif;
	font-size:11px;
}
#content h1 {
	font-size:17px;
}
#content h2 {
	font-size:15px;
}

/* Disable the standard borders on tables, they are ugly */
table {
	border:0px;
}

/* Table with horizontal lines (historically classed "border") */
table.border td {
	border:0px;
	border-bottom:1px solid #5A1800;
}

/* Header rows */
tr.kop1 {
	background-color:#BEAA76;
}

tr.kop2 {
	background-color:#F1E5CB;
}


/****************************************
 * Set up the editor interface
 ****************************************/

/* Make sure that the text area and comment field don't flow out at the right.
 * Using width: 100% didn't work for some reason, so we'll fix this to the
 * width of #window minus its padding */
#editor textarea, #editor input[type=text] {
	width: 530px;
}

/* Put a bit of space between the buttons and the text area */
#editor-textarea {
        margin-top: 0.5em;
}

/* Help is more clear when monospaced */
#editor-help {
        font-family: monospace;
}


/****************************************
 * Set up the stuff in the footer
 ****************************************/

#footer {
	/* Make it stand out a bit */
	background-image:url('../img/semitransp.png');
	color: white;
	/* Center the content vertically in a fixed height */
	line-height: 40px;
	border-top: solid #111a1e 1px;
}

#footer a {
	color: white;
}

/* Format the username bar, copied from the modern theme */
#username {
        float: left;
        display: inline;
        margin: 0px 12px;
        padding: 0;
        text-align: right;
        font-size: 0.82em;
        white-space: nowrap;
}

#username li {
        display: inline;
        padding: 0 0.5em 0 0;
}

#searchform {
        float: right;
}

/****************************************
 * Set up the stuff in the header
 ****************************************/
#header {
	/* Center the content vertically in a fixed height */
	line-height: 30px;
	color: white;
}
#header, #header a {
	color: white;
}

/* Format the pageinfo bar. */
#pageinfo {
        float: left;
	margin: 0;
}

.editbar {
        /* Disable all default list-style stuff */
        list-style-type:none;
        list-style-position:outside;
        margin-top: 0px;
        margin-bottom: 0px;

	/* And indent a bit to align with #content (width of #menubar +
	 * padding-left of #window) */
        padding-left: 425px;

	/* Make it stand out a bit (this includes #pageinfo)*/
	background-image:url('../img/semitransp.png');
	border-bottom: solid #111a1e 1px;
}

ul.editbar li {
        /* Put menu items horizontally */
        display:inline;
        /* But not completely squashed together */
        margin-right: 20px;
}

/* Really put the more actions dropdown horizontally */
.editbar form, .editbar form div {
        display: inline;
}

/****************************************
 * News feed on the homepage
 ****************************************/
div.rssReader p.rssEntryBody {
	/*
	clear:both;
	*/
}

div.rssReader p.rssEntryTitle,
div.rssReader p.rssEntryUpdated {
	text-align: center;
	/*
	float: right;
	clear: both;
	*/
}

/****************************************
 * Other stuff
 ****************************************/

/* Let a message stand out a bit */
#message {
	border-style: solid;
	border-color: black;
	border-width: 4px 0;
	
	margin: 25px 0;
	padding-bottom: 10px;
	font-weight: bold;
}


/* Use a sane text color with all the below backgrounds */
.diff { 
	color: black; 
}
/* Diff view, copied from modern/screen.css */
.diff-header {
        font-weight: bold;
}

.diff-title {
        background-color: #C0C0C0;
}

.diff-added {
        background-color: #E0FFE0;
        vertical-align: sub;
}

.diff-removed {
        background-color: #FFFFE0;
        vertical-align: sub;
}

.diff-added span {
        background-color: #80FF80;
}

.diff-removed span {
        background-color: #FFFF80;
}
/* vim: set sw=4 sts=4 expandtab */