/**
 * Niets uit dit bestand mag worden gekopieerd, gewijzigd, veranderd of
 * gebruikt zonder de expliciete toestemming van Crowd Surfing
 * (ITC Portal B.V.)
 *
 * Indien u met betrekking tot dit bestand wijzigingen doorvoert draagt
 * Crowd Surfing niet langer de verantwoordelijk voor een correcte
 * werking van uw website
 *
 *
 * Nothing from this file may be copied, changed or used
 * without the explicit consent of Crowd Surfing (ITC Portal B.V.)
 *
 * If you make changes concercing this file, Crowd Surfing will no
 * longer bear responsibility for a correct functioning of your website
 */

/**
 * CSS for Dennis 
 *
 * Updates:
 * - 2010-04-08		Added Notices
 *
 * @author	 		Jeroen Dijkstra, Crowd Surfing
 * @author			Pim Elshoff, Crowd Surfing
 * @copyright		(c) Crowd Surfing 2010
 * @license			http://crowd-surfing.com/algemenevoorwaarden/Module-01-licentie-programmatuur.pdf
 */

/* CSS RESET */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }
body { line-height: 1; color: black; background: white; }
del { text-decoration: line-through; }
table { border-collapse: collapse; border-spacing: 0; } /* Tables still need cellspacing="0" in the HTML */
:focus { outline: 0; } /* Outline for input fields in Webkit */
/* END CSS RESET */

/* GENERAL STYLES */
html, body, div#Container
{
	width: 				100%;
}

body
{
	background-color: 	#DEF0F8;
	background-image: 	url('/Includes/Themes/Dennis/Images/background.jpg');
	background-repeat: 	repeat-x;
	color: 				white;
	font: 				16px/1.5 Arial, Helvetica, "DejaVu Sans", "Liberation sans", "Bitstream Vera Sans", sans-serif;
	margin: 			0;
	text-align: 		center;
}

h1
{
	font-size: 			20px;
	font-weight: 		normal;
}

h2
{
	font-size: 			16px;
	font-weight: 		normal;
}

h3
{
	font-size: 			14px;
	font-weight: 		normal;
}

a
{
	color: 				#0066FF;
	text-decoration: 	none;
}

a:hover
{
	text-decoration: 	underline;
}

a:visited
{
	color: 				#0066FF;
}

p
{
	color: 				#6C6F71;
	line-height:		1.3;
	padding: 			10px 10px 30px 0;
}

strong
{
	font-weight: 		bold;
}

em
{
	color: 				#0066FF;
	font-style: 		italic;
}

li
{
	list-style-type: 	none;
}

textarea
{
	overflow: 			auto; /* No scrollbars in IE when there is enough room */
}

blockquote
{
	border-left: 		2px solid #6C6F71;
	margin: 			5px 0 15px 15px;
	padding-left: 		15px;
}

pre
{
	font-family: 		"Courier New", Courier, monospace, serif;
  	margin: 			0 0 1.5em;
}

code
{
	font-family: 		"Courier New", Courier, monospace, serif;
	font-size:			12px;
}

blockquote,
blockquote p
{
	font-size: 			15px;
	font-style: 		italic;
	text-align: 		justify;
}

div#Container
{
	margin-left: 		auto;
	margin-right: 		auto;
	overflow: 			hidden;
	width:				996px;
}

	/* GENERAL STYLES CONTENT */
	div#Content ol,
	div#Content ul
	{
		line-height: 			1.3;
		list-style-position: 	inside; /* To make it show up in IE */
		margin-left: 			25px;
	}

	div#Content ol li
	{
		list-style-type:	decimal;
	}

	div#Content ul li
	{
		list-style-type:	disc;
	}

	/* GENERAL STYLES CONTENT */

/* END GENERAL STYLES */

/* HEADER */
div#Header
{
	background-image: 		url('/Includes/Themes/Dennis/Images/RandTop.png');
	background-position: 	bottom;
	background-repeat: 		no-repeat;
	height: 				118px;
	margin-top: 			30px;
}

/* END HEADER */

/* ASIDE */
div#Aside
{
	background-color: 		#FFFFFF;
	background-image: 		url('/Includes/Themes/Dennis/Images/RandMidden.png');
	background-repeat: 		repeat-y;
}

	div#Aside div#TopBar
	{
		position: 				relative;
		top: 					-13px;
	}
	
		div#Aside div#TopBar h2
		{
			background-color: 	#007CFC;
			font-size: 			23px;
			font-style: 		italic;
			font-weight: 		bold;
			height: 			45px;
			line-height: 		45px;
			margin: 			-3px auto 0 auto;
			width: 				965px;
		}
		
		div#Aside div#TopBar h3
		{
			color: 				#424242;
			font-size: 			16px;
			font-weight: 		bold;
			margin-top:			10px;
			padding-bottom:		10px;
			word-spacing: 		5px;
		}

	/* NAVIGATION */
	div#NavigationContainer
	{
		background-image: 	url('/Includes/Themes/Dennis/Images/Menu.png');
		background-repeat: 	no-repeat;
		height: 			349px;
		margin-left: 		16px;
		position: 			relative;
		z-index: 			2; /* To set on top of the grey H1 border */
	}
	
		div#NavigationContainer ul
		{
			margin-left: 	12px;
			text-align: 	left;
		}
	
			div#NavigationContainer ul li
			{
				font-size: 		17px;
				font-weight: 	bold;
				padding-top: 	21px;
			}
	
				div#NavigationContainer ul li a
				{
					color: 		#EEEEEF;
				}
			
				div#NavigationContainer ul li.Current a
				{
					color: 		#F4D22A;
				}
	
	/* END NAVIGATION */

	div#Aside p
	{
		color: 			#403F41;
		font-size: 		11px;
		font-weight: 	bold;
		line-height: 	19px;
		margin-left: 	29px;
		padding: 		0;
		text-align: 	left;
	}
	
		div#Aside p a
		{
			color: 		#403F41;
		}
	
	div#Aside div.NavigationLeft,
	div#Aside div#TopButtons
	{
		float: 	left;
	}
	
	div#Aside div.NavigationLeft
	{
		width: 	195px;
	}
	
	div#Aside div#TopButtons
	{
		margin: 		-2px 0 10px 82px;
		text-align: 	left;
		width: 			703px;
		position: 		relative;
		z-index:		3; /* To keep them on top of the form element */
	}
		
		div#Aside div#TopButtons a
		{
			display: inline-block;
			margin-right: 	35px;
		}
		
		div#Aside div#TopButtons a:hover
		{
			text-decoration: 	none; /* Just for IE */
		}
		
			div#Aside div#TopButtons a span
			{
				visibility: 		hidden; /* To keep the space */
			}
		
			div#Aside div#TopButtons a.Car
			{
				background-image: 	url('/Includes/Themes/Dennis/Images/KnopAuto.png');
				height: 			90px;
				width: 				126px;
			}
			
			div#Aside div#TopButtons a.Car:hover
			{
				background-image: 	url('/Includes/Themes/Dennis/Images/KnopAutoMO.png');
			}
			
			div#Aside div#TopButtons a.Motor
			{
				background-image: 	url('/Includes/Themes/Dennis/Images/KnopMotor.png');
				height: 			90px;
				width: 				126px;
			}
			
			div#Aside div#TopButtons a.Motor:hover
			{
				background-image: 	url('/Includes/Themes/Dennis/Images/KnopMotorMO.png');
			}
			
			div#Aside div#TopButtons a.Scooter
			{
				background-image: 	url('/Includes/Themes/Dennis/Images/KnopBromfiets.png');
				height: 			95px;
				width: 				133px;
			}
			
			div#Aside div#TopButtons a.Scooter:hover
			{
				background-image: 	url('/Includes/Themes/Dennis/Images/KnopBromfietsMO.png');
				position: 			relative;
				left: 				5px;
				top: 				2px;
			}
	
	
	div#Aside div#Logos
	{
		float: 			left; /* Needs to float to align in IE */
		margin-left:	26px;
		margin-top: 	38px;
		width: 			118px;
	}
	
		div#Aside div#Logos a
		{
			display: 		block;
			margin-bottom: 	5px;
		}
	
/* END ASIDE */

/* CONTENT */
div#ContentWrapper
{
	background-color: 	#FFFFFF;
	background-image: 	url('/Includes/Themes/Dennis/Images/RandMidden.png');
	background-repeat: 	repeat-y;
	color: 				#6C6F71;
	text-align: 		left;
}

	div#Content
	{
		margin-left: 	195px;
		min-height: 	580px;
		height: 		auto !important;
		height: 		580px;
		width: 			770px;
	}
	
		div#Content h1
		{
			background-color: 	#E0E0E0;
			color: 				#333333;
			float:				left;
			font-size: 			16px;
			font-weight: 		bold;
			height: 			39px;
			line-height:		39px;
			margin-bottom: 		20px;
			margin-left:		-35px;
			padding-left: 		35px;
			width:				785px;
		}
		
		div#Content h2,
		div#Content h3
		{
			color: 				#0066FF;
			font-size: 			16px;
			font-weight: 		bold;
		}
		
		div#Content h3
		{
			font-size: 			14px;
		}
		
		div#Content img
		{
			padding: 			10px;
		}
		
		div#Content p
		{
			line-height: 		24px;
			padding: 			10px 10px 10px 0;
		}
		
		div#Content table tr td
		{
			padding: 0 5px;
		}
		
			div#Content table tr td p
			{
				padding: 0;
			}
		
		div#Content div.SignUpWrapper p
		{
			color: 				#007CFC;
			font-weight: 		bold;
			
		}
		
		div#Content div.SignUpWrapper span.Ruler
		{
			border-bottom: 		1px solid #007CFC;
			display: 			inline-block;
			height: 			1px;
			line-height: 		1px;
			margin: 			0 10px;
			width: 				150px;
		}
		
		div#Content div.SignUpBig span.Ruler
		{
			width: 				285px;
		}
		
		div#Content div.SignUpWrapper a
		{
			background-image: 	url('/Includes/Themes/Dennis/Images/PijlBord.png');
			background-repeat: 	no-repeat;
			color: 				#333333;
			display: 			inline-block;
			font-size: 			12px;
			font-weight: 		bold;
			height: 			128px;
			line-height: 		126px;
			padding-left: 		26px;
			vertical-align: 	middle;
			width: 				100px;
		}
		
		div#Content div.Row input.Submit
		{
			background-color: 	transparent;
			background-image: 	url("/Includes/Themes/Dennis/Images/VerstuurKnop.png");
			background-repeat: 	no-repeat;
			border: 			none;
			color: 				#FFFFFF;
			display: 			inline-block;
			font-size: 			14px;
			font-weight: 		bold;
			height: 			62px;
			margin-left: 		-10px; /* To compensate for the paragraph padding */
			padding-bottom: 	11px;
			padding-left: 		23px;
			text-align: 		left;
			width: 				172px;
		}

/* END CONTENT */

/* FOOTER */
div#Footer
{
	background-image: 			url('/Includes/Themes/Dennis/Images/RandOnder.png');
	background-repeat: 			no-repeat;
	color: 						#6C6F71;
	height:						28px;
	margin-bottom: 				30px;
}

/* END FOOTER */

/* CONTACT FORM */
form#ContactForm
{
	position: 				relative;
	padding-top:			162px;
}
form#ContactForm label.LabelBeforeCheckbox
{
	float:					left;
	font-size:				14px;
	font-weight:			bold;
	margin-right:			25px;
	
	
}
form#ContactForm div.ApplySubform
{
	overflow:				auto;
}

form#ContactForm div.ApplySubform div.Row
{
	float:					left;
	padding-left:			8px;
	/*text-align:				center;*/
	width:					auto;
}

form#ContactForm div.ApplySubform div.Row span
{
	text-align:				center;
}

form#ContactForm div.ApplySubform div.Row label
{
	display:				inline;
	font-size:				12px;
	margin-left:			-6px;
}

	form#ContactForm div.Row
	{
		min-height: 				35px;
		width:						362px;
	}
	
		form#ContactForm div.Row label
		{
			color: 					#6C6F71;
			font-size: 				14px;
			font-weight: 			bold; 				
		}
		
		form#ContactForm div.Row input
		{
			border: 				1px solid #E0E0E0;
			width: 					200px;
		}
		
		form#ContactForm div.Row input[type=checkbox]
		{
			border: 				none;
			margin-bottom: 			0;
			margin-left: 			0;
			margin-right: 			4px;
			vertical-align: 		text-bottom;
			width: 					auto;
		}

/* END CONTACT FORM */

/* FORM HINTS */
	form div.Row
	{
		position: 				relative;
	}

		form div.ErrorMessage
		{
			color: 				#FF0000;
		}

		form div.Row input
		{
			height: 			16px;
		}

		form div.Submit input
		{
			height: 			auto;
		}

		form div.Row input.ErrorVeld
	    {
	    	border: 			2px solid #FF0000 !important;
			height: 			14px; /* To compensate the extra 2 border px */
			
			-moz-box-shadow: 	0px 0px 4px #FF0000;
			-webkit-box-shadow:	0px 0px 4px #FF0000;
			box-shadow: 		0px 0px 4px #FF0000;  
		}

		form div.Row label
		{
			display: 			inline-block;
			width: 				150px;
		}

		form div.Row span.Hint
		{
			background-color: 	#FFFFFF;
			border: 			1px solid #B3B3B3;
			display: 			none;
			font-family: 		Verdana, Arial, Helvetica, sans-serif;
			font-size: 			12px;
			padding: 			3px 5px;
			position: 			absolute;
			right: 				-185px;
			top: 				0;
			width: 				175px;
			z-index:			3;

			-moz-box-shadow: 	0px 0px 4px #000000;
			-webkit-box-shadow:	0px 0px 4px #000000;
			box-shadow: 		0px 0px 4px #000000;
		}

			form div.Row span.Hint span.Pointer
			{
				background: 		url('/Includes/Themes/Dennis/Images/Icons/pointer.png') no-repeat;
				display: 			block;
				height: 			9px;
				left: 				-8px;
				position: 			absolute;
				top: 				5px;
				width: 				9px;
			}


/* END FORM HINTS */

/* NOTICES */
div.Notice
{
	background-color:	#FFFFCC;
	border:				1px dotted #CC9933;
	color: 				#CC9933;
	font-weight:		bold;
	line-height:		2;
	margin-bottom:		10px;
	padding: 			10px;

	-moz-box-shadow:	0 0 4px #CC9933;
	-webkit-box-shadow:	0 0 4px #CC9933;
	box-shadow:			0 0 4px #CC9933;
}

	div.Notice.Error
	{
		background-color:	#FFD4D4;
		border:				1px dotted #FF0000;
		color: 				red;
		font-weight:		bold;

		-moz-box-shadow:	0 0 4px #FF0000;
		-webkit-box-shadow:	0 0 4px #FF0000;
		box-shadow:			0 0 4px #FF0000;
	}

	div.Notice.Message
	{
		background-color:	#E2F1F8;
		border:				1px dotted #0398CA;
		color: 				#0398CA;
		font-weight:		bold;

		-moz-box-shadow:	0 0 4px #0398CA;
		-webkit-box-shadow:	0 0 4px #0398CA;
		box-shadow:			0 0 4px #0398CA;
	}

	div.Notice.Success
	{
		background-color:	#AEA;
		border:				1px dotted #008000;
		color: 				#008000;
		font-weight:		bold;

		-moz-box-shadow:	0 0 4px #008000;
		-webkit-box-shadow:	0 0 4px #008000;
		box-shadow:			0 0 4px #008000;
	}

	div.Notice a
	{
		border: 			1px solid black;
		border-color:		#CC9933;
		color: 				#CC9933;
		display:			inline-block;
		float: 				right;
		text-align:			center;
		text-decoration:	none;
		width:				24px;
	}

		div.Notice a:hover,
		div.Notice.Error a:hover,
		div.Notice.Message a:hover,
		div.Notice.Success a:hover
		{
			background-color: 	#000000;
			text-decoration: 	underline;

			opacity: 			0.3;
			filter:				progid:DXImageTransform.Microsoft.Alpha(opacity=30);
		}

		div.Notice.Error a
		{
			border-color: 		#0398CA;
			color: 				#0398CA;
		}

		div.Notice.Message a
		{
			border-color: 		#0398CA;
			color: 				#0398CA;
		}

		div.Notice.Success a
		{
			border-color: 		#008000;
			color: 				#008000;
		}

/* END NOTICES */