/*
**
**	css for pannebaaltje.be
**	copyright webFizz VOF
**	author: Simon Hellin
**	date: 18/12/2008
**
*/

/**
**	0.	CLEARFIX
**		@see http://www.positioniseverything.net/easyclearing.html
** ----------------------------------------------------------
 */

	.clearfix:after {
		content: ".";
		display: block;
		height: 0;
		clear: both;
		visibility: hidden;
	}

/*
**	1.	GENERAL 
** ----------------------------------------------------------
*/

	body{	
		color: #555555;
		font-family: Arial, Verdana, Sans-Serif;
		font-size: 10pt;
		line-height: 12pt;	
	}
	
	
	h1{
		color: #333333;
		font-family: Trebuchet MS;
		font-size: 14pt;
		padding: 0 0 10px 0;
	}
	h2{
		color: #555555;
		font-family: Trebuchet MS;
		font-size: 12pt;
		padding: 10px 0 10px 0;
	}
	h4{
		color: #cccccc;
		font: italic 8pt Arial, Verdana, Sans-Serif;
		padding: 0 0 10px 0;
		border-bottom: 1px solid #eeeeee;
	}
	p{
		color: #555555;
		font-family: Arial, Verdana, Sans-Serif;
		font-size: 10pt;
		line-height: 12pt;
		padding: 0 0 10px 0;
	}
	a:link,
	a:visited{
		color: #555555;
	}
	a:hover{
		color: #888888;
	}
	h1.grijs,
	a:link.grijs,
	a:visited.grijs{
		color: #333333;
	}
	h1.felgroen,
	a:link.felgroen,
	a:visited.felgroen{
		color: #8cc63f;
	}
	h1.dgroen,
	a:link.dgroen,
	a:visited.dgroen{
		color: #006838;
	}
	h1.midgroen,
	a:link.midgroen,
	a:visited.midgroen{
		color: #00a651;
	}
	a:hover{
	text-decoration: none;
}
	h1.footer{
		padding: 10px;
		color: #fff;
		font: normal 14px/18px Arial, Helvetica, sans-serif;
		text-transform: uppercase;
	}
	#text li{
		list-style-type: disc;
		list-style-position: inside;
	}
	#text p{
		
	}

/*
**	2.	BASIC POSITIONING
** ----------------------------------------------------------
*/
	#container{
		width: 960px;
		margin: 0 auto 0;
		min-height: 500px;
	}
	#header{
		width: 960px;
		height: 300px;
	}
	#content{
		width: 960px;

	}
	#footer{
	margin-top: 30px;
		width: 960px;
	}

	
/*
**	3.	HEADER
** ----------------------------------------------------------
*/
	#top{
		width: 960px;
		height: 65px;
		margin-top: 5px;
	}
	#logo{
		float: left;
		width: 200px;
		height: 65px;
		background: url(../images/logo.jpg) no-repeat;
	}
	#lang{
		float: right;
		margin-top: 40px;
	}
	#lang a:link,
	#lang a:visited{
		color: #555555;
		font: normal 10px/10px Arial, Helvetica, sans-serif;
	}
	#image{
		height: 170px;
		background: #dddddd;
	}
	#menu {
		display: block;
		width: 960px;
		height: 45px;
	}
	
/*
**	4.	MENU
** ----------------------------------------------------------
*/
	#menu ul { 
		list-style: none; 
		padding: 0; 
		margin: 0; 
		text-align: right;
		}
	
	#menu ul li { 
		display: inline; 
		padding: 0; 
		font-family: Arial, Helvetica, sans-serif;
		font-size: 10px;
		color: #fff;
	}

	#menu ul li a { 
		float: left;
		display: block;
		font: normal 14px/18px Arial, Helvetica, sans-serif;
		width: 229px; height: 37px;
		background-color: #333;
		color: #fff;
		text-decoration: none;
		text-align: left;
		padding: 8px 0 0 10px;
		margin: 0 1px 0 0;
		text-transform: uppercase
	}
	#menu ul li a.grijs{
		background-image: url(../images/bg_grijs.png);
	}
	#menu ul li a.dgroen{
		background-image: url(../images/bg_dgroen.png);
	}
	#menu ul li a.felgroen{
		background-image: url(../images/bg_felgroen.png);		
	}
	#menu ul li a.midgroen{
		background-image: url(../images/bg_midgroen.png);		
	}
	#menu ul li a.grijs:hover{
		background-image: url(../images/bg_grijs_h.png);
	}
	#menu ul li a.dgroen:hover{
		background-image: url(../images/bg_dgroen_h.png);
	}
	#menu ul li a.felgroen:hover{
		background-image: url(../images/bg_felgroen_h.png);		
	}
	#menu ul li a.midgroen:hover{
		background-image: url(../images/bg_midgroen_h.png);		
	}

/*
**	5.	CONTENT
** ----------------------------------------------------------
*/

	#submenu{
		float: left;
		width: 170px;
		height: 170px;
		margin: 0 80px 0 0;
		
	}
	#text{
		float: left;
		width: 460px;
		min-height: 170px;
	}
	#right{
		float: right;
		width: 170px;
		min-height: 170px;
	}
	.box{
		float: right;
		width: 170px;
		min-height: 170px;
	}
	.box h2.grijs{
		color: #ffffff;
		background-image: url(../images/bg_grijs.png);
		padding: 5px;
	}
	.box h2.felgroen{
		color: #ffffff;
		background-image: url(../images/bg_felgroen.png);
		padding: 5px;
	}
	.box h2.midgroen{
		color: #ffffff;
		background-image: url(../images/bg_midgroen.png);
		padding: 5px;
	}
	.box h2.dgroen{
		color: #ffffff;
		background-image: url(../images/bg_dgroen.png);
		padding: 5px;
	}
	.box p{
		padding: 5px;
	}

/*
**	6.	SUBMENU
** ----------------------------------------------------------
*/
	#submenu ul li a { 
		float: left;
		display: block;
		font: normal 10pt Arial, Helvetica, sans-serif;
		width: 170px; height: 18px;
		background-color: #333;
		color: #fff;
		text-decoration: none;
		text-align: left;
		padding: 5px 0 0 10px;
		margin: 0 0 1px 0;
	}
	#submenu ul li a.grijs{
		background: #989898;
	}
	#submenu ul li a.felgroen{
		background: #8cc63f;
	}
	#submenu ul li a.midgroen{
		background: #00a651;
	}
	#submenu ul li a.dgroen{
		background: #006838;
	}
	#submenu ul li a:hover.grijs{
		background: #777777;
	}
	#submenu ul li a:hover.felgroen{
		background: #80b43a;
	}
	#submenu ul li a:hover.midgroen{
		background: #028e45;
	}
	#submenu ul li a:hover.dgroen{
		background: #007741;
	}
	
/*
**	7.	FOOTER
** ----------------------------------------------------------
*/
	.footergrijs{
		float: left;
		width: 239px;
		height: 220px;
		background: url(../images/bg_f_grijs.jpg) repeat-x;
		margin: 0 1px 0 0;
	}
	.footerfelgroen{
		float: left;
		width: 240px;
		height: 220px;
		background: url(../images/bg_f_felgroen.jpg) repeat-x;
	}
	.footermidgroen{
		float: left;
		width: 240px;
		height: 220px;
		background: url(../images/bg_f_midgroen.jpg) repeat-x;
	}
	.footerdgroen{
		float: left;
		width: 240px;
		height: 220px;
		background: url(../images/bg_f_dgroen.jpg) repeat-x;
	}
	#footer ul li a{
		color: #fff;
		font: normal 10pt Arial, Helvetica, sans-serif;
		padding: 0 0 0 10px;
		line-height: 16pt;
	}
	#foot{
		width: 960px;
		text-align: right;
	}
	
	#blogitem p{
	color: #666;
	font-size: 9pt;
	padding-left: 5px;
	padding-top: 0px;
	}
	
	
.edited{
	background-color: #e7f2d3; 
	background-image: url('../backend/images/check.png');
	background-repeat: no-repeat;
	background-position: 10px 5px;
	margin-bottom: 8px; 
	padding: 8px; 
	padding-left: 45px;
	border-color:#d5e7b7; 
	border-width:2px; 
	border-style:solid; 
	font-size: 9pt;
	color: #555555;
	font-size: 9pt;
	}
	
	.error{
	background-color: #DA9E9E; 
	background-image: url('../backend/images/error.png');
	background-repeat: no-repeat;
	background-position: 10px 5px;
	margin-bottom: 8px; 
	padding: 8px; 
	padding-left: 30px;
	border-color:#F80F0F; 
	border-width:2px; 
	border-style:solid; 
	font-size: 9pt;
	color: #555555;
	font-size: 9pt;
	}
	
	.added{
	background-color: #e7f2d3; 
	background-image: url('../backend/images/check.png');
	background-repeat: no-repeat;
	background-position: 10px 5px;
	margin-bottom: 8px; 
	padding: 8px; 
	padding-left: 45px;
	border-color:#d5e7b7; 
	border-width:2px; 
	border-style:solid; 
	font-size: 9pt;
	color: #555555;
	font-size: 9pt;
	}
	
	#galleriesmain {
	height:50px;
	background-color:#fefefe;
	width:350px;
	padding:5px;
	margin:5px;
	margin-left:20px;
	border-color:#cccccc;
	border-style:solid;
	border-width:1px;
}

#galleriesmain:hover {
	background-color:#f3f3f3;
	border-color:#bbbbbb;
	border-style:solid;
	border-width:1px;
}

#galleriesthumb {
	float:left;
	text-align:top;
	margin-right:10px;
}

#galleriesinfo {
	margin-left:15px;
	text-align:top;
}

#imagethumb {
	float:left;
	padding:5px;
}