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

/*------------------------------------------------------------------------------------
 * FOODBAG Website Screen Presentation Layer
 * Author:	REYEZ!
 * Created:	28-10-2009
 * Notes:	none
-------------------------------------------------------------------------------------*/

/* ################################################################################# */
/*                                                                                   */
/*                                		BODY	                                     */
/*                                                                                   */
/* ################################################################################# */


/*------------------------------------------------------------------------------------
 * 
 * Alleen gebruiken wanneer de footer van de website altijd 
 * tegen de onderkant van de browser aan moet staan of onderaan de content

html, body {
	height: 			100%;
}

html {
	font-size: 			100%;
	overflow-y:			scroll;
}

-------------------------------------------------------------------------------------*/

html, body {
	height: 			100%;
	margin:				0;
}

html {
	font-size: 			100%;
	overflow-y:			scroll;
}

body {
	background:			#ffff00 url(../images/bg_body.jpg) center center no-repeat;
	color: 				#333e56;
	font-family:		Arial;
	font-size: 			62.5%; /* standaard font grootte is nu 10px, dus 1.2em = 12px */
	line-height: 		140%;
}

/* ################################################################################# */
/*                                                                                   */
/*                                VLAKVERDELING                                      */
/*                                                                                   */
/* ################################################################################# */

#wrapper {
	background:			url(../images/bg_wrapper.png) center center no-repeat;
	width: 				900px;
	height: 			550px;
	position: 			absolute;
	left: 				50%;
	top: 				50%;
	margin-left: 		-450px;
	margin-top: 		-275px;
}

#foodbag, #main {
	float:				left;
}

#header, #menu, #title, #content {
	clear:				both;	
}

#header {
	height:				97px;
}

#menu {
	height:				49px;
}

#title {
	height:				90px;
}

#content_bg {
	background:			url(../images/bg_content.jpg) left top no-repeat;
	height:				280px;
	width:				500px;
	padding:			0 10px 0 0;
	overflow:			auto;
}

#content {
	margin:				10px 0 0 40px;
}

#footer {
	height:				30px;
}


/*-----------------------------------------------------------------------------------*/

/* ################################################################################# */
/*                                                                                   */
/*                                   DEFAULT                                         */
/*                                                                                   */
/* ################################################################################# */

/*------------------------------------------------------------------------------------
 * 
 * Gebruik font-size alleen bij html tags en niet bij classes en id's,
 * dit mag slechts bij uitzondering.
 *
 * Deze eigenschap zal altijd blijven ondanks verdere classes
 * 		!important
 * IE 6 and below
 *     	* html {}
 * IE 7 and below
 *     	*:first-child+html {} * html {}
 * IE 7 only
 *     	*:first-child+html {}
 * IE 7 and modern browsers only
 *     	html>body {}
 * Modern browsers only (not IE 7)
 *     	html>/**body {}
 /*
 * Recent Opera versions 9 and below
 *     html:first-child {}
 *
-------------------------------------------------------------------------------------*/


h1, h2, h3, h4, h5, h6 {
	font-family: 		Arial, "Cooper Black", Verdana, Helvetica, sans-serif !important;
	margin: 			0;
	padding: 			0;
	letter-spacing: 	0;
	border-bottom: 		0 !important;
}

button, input, option, select, textarea {
	font-family: 		Arial, Verdana, Helvetica, sans-serif !important;
	letter-spacing: 	0;
	margin: 			0;
	padding: 			0;
}

a {
	color:				#09F;
	text-decoration:	underline;
}

a:active {
	color:				#09F;
	text-decoration:	underline;
}

a:hover {
	color:				#333e56;
	text-decoration:	underline;
}

a:visited {
	color:				#09F;
	text-decoration:	underline;
}




/* Custom tags */

p, table, ul, button, input, select, textarea {
	font-size:			1.2em;
}

h1 {
	color:				#09F;
	font-size:			1.8em;
	font-weight:		bold;
	margin:				1em 0 0.5em 0;
}

h2 {
	color:				#09F;
	font-size:			1.5em;
	font-weight:		bold;
	margin:				0 0 0.5em 0;
}

p {
	line-height:		1.6em;
	margin:				0 0 1.5em 0;
}

table {
	border:				0;
	margin:				0 0 1.5em 0;
}

td {
	padding:			3px 10px 0 0;
	vertical-align:		top;
}
	
button, input, select, textarea {
	border:				1px solid #999999;
	color:				#666;
	font-size:			1em;
	padding:			1px;
	width:				250px;
}

.button {
	border:				0;
	height:				25px;
	padding:			0;
	width:				150px;
}

.checkbox {
	width:				25px;
}






#ster {
	clear:				both;
	margin:				-90px 0 0 60px;
	z-index:			1;
}

p.reyez {
	float:				right;
	margin:				15px 25px 0 0;
}



p.reyez a {
	color:				#333e56;
	text-decoration:	none;
}



p.reyez a:hover {
	color:				#333e56;
	text-decoration:	underline;
}

.rood {
	color:				#ff0000;
}