/**	http://www.psychokring.be stijlblad
**	Dit document bevat de stijlinformatie voor het oranje theme van SFO.	
**	
**	@author: Stijn Dejongh 2008
*/


/*Deze stijl informatie gaat over de header*/
#top
{
	width:872px;
	background-color: #f8ce00;
	margin-top: 0px;
	margin-left:auto;
	margin-right:auto;
	clear:both;
	height:50px;
}


/*Deze stijl informatie gaat over de menu*/
#menu
{
	background-image:url("../graphics/menu.png");
	background-color: #f8ce00;	
	background-repeat: no-repeat;
	width: 870px;
	height: 75px;
	color: #9f5a00;
	font: 12px Verdana, Arial, Helvetica, sans-serif;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: auto;
	margin-right:auto;
	clear:both;
	padding: 5px;
	padding-top: 8px;
	padding-left: 0px;
	padding-right: 0px;
}


/*Deze stijl informatie gaat over de header, deze hoort onderaan de pagina te komen*/
#header
{
	background-color: #f8ce00;
	width: 870px;
	height: 150px;
	font: 14px Verdana, Arial, Helvetica, sans-serif;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left:auto;
	margin-right:auto;
	clear:both;
	padding: 0px;
}

/*Deze stijl informatie gaat over de footer, deze hoort onderaan de pagina te komen*/
#footer
{
	background-image:url("../graphics/footer.png");
	background-repeat: no-repeat;
	width: 800px;
	height: 50px;
	font: 10px Verdana, Arial, Helvetica, sans-serif;
	margin-top: 0px;
	margin-bottom: 3px;
	margin-left:auto;
	margin-right:auto;
	clear:both;
	padding: 8px;
	border: 0px;
}

img
{
	border: 0px;
}

#footer a, a :visited
{
	color: #9c5100;
	border: 0px;

}

#footer :hover
{
color:#ffd200;
}

#twitter
{
	width: 240px;
	height: 250px;
	position: relative;
	top: 0px;
}



/* Deze stijl informatie gaat over de inhoud van de pagina */
#content
{
	width: 800px;
	height: 90%;
	font-size:12px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	margin-bottom: 10px;
	margin-left:auto;
	margin-right:auto;
	clear:both;
	padding: 5px;
	padding-left: 0px;
	padding-right: 0px;
}

/* De inhoud onder het title object voor een pagina*/
#contentbox
{
	font-size:10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	margin-bottom: 3px;
	margin-left:20px;
	margin-right:auto;
	clear:both;
	padding: 5px;
	padding-left: 0px;
	padding-right: 0px;
}


/* Stijl informatie voor de titels van pagina's */
#title
{
	width:250px;
	height:45px;
	font-size:16px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background-image:url("../graphics/title.png");
	background-repeat: no-repeat;
	padding: 10px;

}

/* general lay-out && kleuren */

h2
{
	font-size: x-large;
	color: #FF6600;
	font-family: "Comic Sans MS",Verdana, Arial, Helvetica, sans-serif;
}

#q3
{
	font-size:15px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height:22px;
}
#r3
{
	font-size:13px;
	color: #999999;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height:22px;
}
/*
#stippellijn
{
	width:300px;
	height:4px;
	background-image:url("../graphics/stippellijn.png");
	background-repeat: no-repeat;
	padding: 10px;

}
*/
body
{
	background-image:url("../graphics/bg.png");
	background-repeat:repeat-y;
	background-position: center;
	background-color:#f8ce00;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	margin-top: auto;
	margin-left: auto;
	margin-right: auto;
	color: #003300;
	scrollbar-base-color: #c7d1f8;
	scrolbar-arrow-collor: #58595d;
	scrollbar-shadow-color: #545b79;
	scrollbar-face-collor: #b5bcdc;
	scrollbar-highlight-color: #000000;
}

/* Links */
a:link
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: #FF6600;
}
			
a:visited
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: #FF6600;
}

a:name
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: #003300;
}
				 
a:active
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: #FF6600;
}
a:hover
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: #faf56c;
}




/*De linker container (voor de 'Nuttige Links' op de eerste pagina, enkel te gebruiken in combinatie met de center container*/

#kader
{
	width: 300px;
}
div.kaderheader
{
	background-image:url("../graphics/kader-top.png");
	background-repeat: no-repeat;
	width:300px;
	margin:0px;
	height:9px;
}
div.kaderbottom
{
	background-image:url("../graphics/kader-botom.png");
	background-repeat: no-repeat;
	width:300px;
	margin:0px;
	height:9px;
}
div.kadercontent
{
	margin-top: 0px;
	margin-bottom: 0px;
	background-image:url("../graphics/kader-bg.png");
	background-repeat: repeat-y;
	min-height: 100px;
	width:300px;
	margin:0px;
}

/*center container, te gebruiken als je de leftbox gebruikt*/
div.container
{
	margin-left:192px;
	width:608px;
}

/*menu*/

/*
.menu ul{
list-style-type:none;
padding:0;
margin:0;
}
*/
/* make the top level links horizontal and position relative so that we can position the sub level */
/*
.menu li{
float:left;
position:relative;
z-index:100;
}
*/
/* use the table to position the dropdown list */

/*
.menu table{
float: left;
position:absolute;
border-collapse:collapse;
z-index:100;
left:-1px;
top:25px;
width: 100%;
}
*/
/* style all the links */
/*
.menu a, .menu :visited
{
padding: 5px;
display:block;
font-size:13px;
width:80px;
text-decoration:none;
margin-right:2px;
text-align:center;
color: #9c5100;
}
*/
/*
.submenu a, .menusub :visited 
{
width:90px;
background:#fff1ae;
text-align:left;

}
*/
/* style the links hover */
/*
.menu :hover
{
color:#ffd200;
background:#fff7e1;
}
*/
/* hide the sub level links */
/*
.menu ul ul {
visibility:hidden;
position:absolute;
width:100px;
height:0;
}
*/
/* make the sub level visible on hover list or link */
/*
.menu ul li:hover ul,
.menu ul a:hover ul{
visibility:visible;
}
*/

.menu
{
	top: 0;
	margin: 0;
	padding: 0;
}

.menu li
{
	list-style: none;
	float: left;
}

.menu li a
{
	display: block;
	color: #9c5100;
	padding: 3px 8px;
}

.menu li a:hover
{
	color:#ffd200;
}

.menu li ul
{
	display: none;
}

.menu li:hover ul, .menu li.hover ul
{
	width: 50%;
	position: absolute;
	display:block;
	/*left: 0px;*/
	/*top: 193px;*/
	margin: 0;
	padding: 0;
}

.menu li:hover li, .menu li.hover li
{
	float: left;
}

.menu li:hover li a, .menu li.hover li a
{
	color:#ffffff;
	background-color: #FF9900;
}

.menu li li a:hover
{
	font-weight: bold;
	color:#ffd200;
}