/**
 * 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 monkeytown 
 *
 * 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 { border: 0; font-family: inherit; font-size: 100%; font-style: inherit; font-weight: inherit; margin: 0; outline: 0; padding: 0; vertical-align: baseline; }
body 	{ background: white; color: black; line-height: 1; }
del 	{ text-decoration: line-through; }
table 	{ border-collapse: collapse; border-spacing: 0; } /* Tables still need cellspacing="0" in the HTML */
:focus 	{ outline: 0; } /* Removes outline for input fields in Webkit */
/* END CSS RESET */

.ClearFix:after
{
	content: 		'.';
	clear: 			both;
	display: 		block;
	height: 		0;
	line-height: 	0;
	visibility: 	hidden;
}

/* FONT FACE */
@font-face
{
	font-family: 	"BalloonRegular";
	src: 			url('/Includes/Themes/monkeytown/Fonts/balloonregular-webfont.eot');
	src: 			local('/Includes/Themes/monkeytown/Fonts/Balloon'), local('/Includes/Themes/monkeytown/Fonts/Balloon'), url('/Includes/Themes/monkeytown/Fonts/balloonregular-webfont.woff') format('woff'), url('/Includes/Themes/monkeytown/Fonts/balloonregular-webfont.ttf') format('truetype'), url('/Includes/Themes/monkeytown/Fonts/balloonregular-webfont.svg#webfontO6UnkdDr') format('svg');
	font-weight: 	normal;
	font-style: 	normal;
}

/* END FONT FACE */

/* GENERAL STYLES */
div#Content ul li
{
	vertical-align:		text-top;
	width:				100%;
}

	div#Content ul li label
	{
		display:			inline-block;
		float:				left;
		margin-right:		10px;
		min-width:			250px;
	}

html
{
	overflow-x: 		hidden;
}

html, body
{
	height: 			100%;
	width: 				100%;
}

body
{
	background-color: 		#006837;
	background-image: 		url('/Includes/Themes/monkeytown/Images/MTAchtergrond.png');
	background-position: 	top center;
	background-repeat: 		no-repeat;
	color: 					white;
	font: 					13px/1.3 "Comic Sans MS", Arial, Helvetica, "DejaVu Sans", "Liberation sans", "Bitstream Vera Sans", sans-serif;
	margin: 				0;
	text-align: 			center;
}

h1
{
	color: 				#003800;
	font-family: 		"BalloonRegular", "Comic Sans MS", Arial, Helvetica, sans-serif;
	font-size: 			32px;
	font-weight: 		normal;
}

h2
{
	color: 				#FFFFFF;
	font-family: 		"BalloonRegular", "Comic Sans MS", Arial, Helvetica, sans-serif;
	font-size: 			24px;
	font-weight: 		normal;
}

h3
{
	color: 				#FFFFFF;
	font-family: 		"BalloonRegular", "Comic Sans MS", Arial, Helvetica, sans-serif;
	font-size: 			18px;
	font-weight: 		normal;
}

a
{
	color: 				#FF3D3D;
	text-decoration: 	none;
}

a:hover
{
	text-decoration: 	underline;
}

a:visited
{
	color: 				#FF3D3D;
}

p
{
	color: 				#FFFF00;
	line-height:		1.3;
	margin-bottom: 		20px;
}

strong
{
	font-weight: 		bold;
}

em
{
	color: 				#FF3D3D;
	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 #FFFF00;
	margin: 			5px 0 15px 15px;
	padding-left: 		15px;
}

pre
{
	font-family: 		"Courier New", Courier, monospace, serif;
  	margin: 			0 0 1.5em;
}

blockquote,
blockquote p
{
	font-size: 			15px;
	font-style: 		italic;
	text-align: 		justify;
}

div#Container
{
	margin: 				-36px auto 0;
	min-height:				100%;
	position: 				relative;
	width: 					1275px;
	z-index: 				4;
}

	/* GENERAL STYLES CONTENT */
	div#Content ol,
	div#Content ul
	{
		line-height:			1.3;
	}

	div#Content ol li
	{
		list-style-type:	decimal;
		
			}

	div#Content ul li
	{
		list-style-type:	disc;
	}
	
	/* GENERAL STYLES CONTENT */

/* END GENERAL STYLES */

/* BACKGROUND WRAPPER */
div#BackgroundWrapper
{
	background-image: 		url('/Includes/Themes/monkeytown/Images/ShrubberyAchtergrond.png');
	background-position: 	center bottom;
	background-repeat: 		no-repeat;
	position: 				relative;
}

/* END BACKGROUND WRAPPER */

/* HEADER */
div#Header
{
	height: 		590px;
	margin: 		0 auto;
	position: 		relative;
	width: 			1275px;
	z-index: 		3;
}

	div#Header div#LogoWrapper
	{
		height: 		100%;
		left: 			0;
		position: 		absolute;
		top: 			0;
		width: 			100%;
	}

		div#Header div#LogoWrapper div#Beams
		{
			background-image: 		url('/Includes/Themes/monkeytown/Images/Zonnestralen.png');
			background-position: 	20px bottom;
			background-repeat: 		no-repeat;
			height: 				100%;
			width: 					100%;
		}

		div#Header div#LogoWrapper div#Leafs
		{
			bottom: 		50px;
			left: 			160px;
			position: 		absolute;
			z-index: 		3;
		}

		div#Header div#LogoWrapper div#Balls
		{
			bottom: 		10px;
			left: 			230px;
			position: 		absolute;
			z-index: 		4;
		}

		div#Header div#LogoWrapper a
		{
			display: 		block;
			height: 		540px;
			position: 		relative;
			z-index: 		4;
		}

			div#Header div#LogoWrapper a img#Monkey
			{
				display: 		block;
				left: 			535px;
				position:		absolute;
				top: 			-560px;
			}

			div#Header div#LogoWrapper a img#LogoText
			{
				bottom: 		620px;
				display: 		block;
				left: 			270px;
				position:		absolute;
			}

div.Aside
{
	background-image: 		url('/Includes/Themes/monkeytown/Images/BamboeStok.png');
	background-position: 	top center;
	background-repeat: 		repeat-y;
	float: 					left;
	height: 				100%;
	left: 					115px;
	position: 				absolute;
	width: 					190px;
	z-index: 				2;
}

div#HeaderRight
{
	left: 					1020px;
	position: 				relative;
}

/* END HEADER */

/* NAVIGATION */
div#NavigationContainer
{

}

	div#NavigationContainer img#SwingMonkey
	{
	    left: 		-162px;
	    position: 	absolute;
	    top: 		-137px;
	}

	div#NavigationContainer ul
	{
		font-family: 	"BalloonRegular", "Comic Sans MS", Arial, Helvetica, sans-serif;
		font-size: 		20px;
		zoom: 			1;
	}

		div#NavigationContainer ul li
		{
			background-image: 	url('/Includes/Themes/monkeytown/Images/MenuPlank1.png');
			background-repeat: 	no-repeat;
			min-height: 		49px;
			margin-bottom: 		5px;
			width: 				191px;
		}

		div#NavigationContainer ul li.TypeB
		{
			background-image: 	url('/Includes/Themes/monkeytown/Images/MenuPlank2.png');
		}

			div#NavigationContainer ul li a
			{
				color: 			#000000;
				line-height: 	55px;
				position: 		relative;
				z-index:		3;
			}

			div#NavigationContainer ul li.Current a
			{
				color: 			#FF3D3D;
			}

				div#NavigationContainer ul li ul li
				{
					background-image: 	url('/Includes/Themes/monkeytown/Images/MenuPlank1-Mo.png');
					height: 			49px;
					margin-bottom: 		5px;
				}

				div#NavigationContainer ul li ul li.TypeB
				{
					background-image: 	url('/Includes/Themes/monkeytown/Images/MenuPlank2-Mo.png');
				}

					div#Container div#NavigationContainer ul li ul li a
					{
						color: 				#000000;
					}

					div#Container div#NavigationContainer ul li ul li a:hover
					{
						color: 				#FF3D3D;
						text-decoration: 	none;
					}

					div#Container  div#NavigationContainer ul li ul li.Current a
					{
						color: 				#FF3D3D;
					}

					div#Container  div#NavigationContainer ul li ul li.Current a:hover
					{
						text-decoration: 	underline;
					}

/* END NAVIGATION */

/* CONTENT */
div#Container div#ContentRight
{
	left: 				1020px;
	top: 				0;
}

div#Content
{
	background-color: 	transparent;
	color: 				#FFFF00;
	font-size: 			16px;
	margin: 			0 auto;
	min-height:			850px;
	padding-bottom:		80px;
	padding-right: 		160px;
	padding-top: 		15px;
	position: 			relative;
	text-align: 		left;
	width: 				445px;
	z-index: 			5;
}

	div#Content h1
	{
		text-align: 	center;
	}

div.Push
{
	clear: 				left;
	height: 			153px;
}

/* END CONTENT */

/* ARRANGEMENT */
div.Arrangement
{
	margin-bottom: 		30px;
}

	div.Arrangement div.ArrangementTop,
	div.Arrangement div.ArrangementBottom
	{
		background-image: 	url('/Includes/Themes/monkeytown/Images/TekstVlakBoven.png');
		height: 			29px;
		width: 				677px;
	}

	div.Arrangement div.ArrangementMiddle
	{
		background-image: 	url('/Includes/Themes/monkeytown/Images/TekstVlakMidden.png');
		padding: 			0 15px;
		width: 				647px;
	}

		div.Arrangement div.ArrangementMiddle h2
		{
			color: 			#FF3D3D;
			width:			555px;
			font-size: 		32px;
		}

		div.Arrangement div.ArrangementMiddle p
		{
			color: 			#003800;
			font-size: 		21px;
			font-weight: 	bold;
			margin: 		0;
		}

	div.Arrangement div.ArrangementBottom
	{
		background-image: 	url('/Includes/Themes/monkeytown/Images/TekstVlakOnder.png');
	}

/* END ARRANGEMENT */

/* LOCATION */
div#LocationContainer
{
	margin: 		0 auto 10px auto;
	overflow: 		hidden;
	padding-left: 	20px;
	width: 			505px;
}

	div#LocationContainer div#Address
	{
		float: 			left;
		padding-right: 	10px;
		width:			315px;
	}

		div#LocationContainer div#Address p
		{
			color: 			#003800;
			font-size: 		20px;
			font-weight: 	bold;
			margin: 		0;
		}

	div#LocationContainer div#Gmaps
	{
		float: 			left;
	}

		div#LocationContainer div#Gmaps img
		{
			border: 		3px solid #FFFFFF;
			display: 		block;
		}

/* END LOCATION */

/* PRICES */
div#Content div.PricesAndTimes ul li
{
	
}

div#Content div.PricesAndTimes ul li,
div#Content ul li
{
	background-image: 		url('/Includes/Themes/monkeytown/Images/ListItem.png');
	background-position: 	left top;
	background-repeat: 		no-repeat;
	list-style-type: 		none;
	margin-bottom: 			5px;
	padding-left: 			20px;
}

	div#Content div.PricesAndTimes ul li label
	{
		display: 		inline-block;
	    margin-right: 	0;
		padding-right: 	10px;
	    width: 			280px;
	}
	
	div#Content div.PricesAndTimes ul li span
	{
		display: 		inline-block;
		width: 			140px;
	}

/* END PRICES */

/* PHOTO ALBUM */
div#PhotoAlbum div#PhotoAlbumTop,
div#PhotoAlbum div#PhotoAlbumBottom
{
	background-image: 	url('/Includes/Themes/monkeytown/Images/TekstVlakBoven.png');
	height: 			29px;
	width: 				677px;
}

div#PhotoAlbum div#PhotoAlbumMiddle
{
	background-image: 	url('/Includes/Themes/monkeytown/Images/TekstVlakMidden.png');
	overflow: 			auto;
	width: 				677px;
}

	div#PhotoAlbum div#PhotoAlbumMiddle a
	{
		display: 		block;
		float: 			left;
		margin-bottom: 	10px;
		margin-left: 	10px;
	}

div#PhotoAlbum div#PhotoAlbumBottom
{
	background-image: 	url('/Includes/Themes/monkeytown/Images/TekstVlakOnder.png');
}

/* END PHOTO ALBUM */

/* PHOTOSLIDE */
div#PhotoSlide
{
	height: 			410px;
	position:			absolute;
	right: 				-40px;
	top: 				-100px;
	width: 				470px;
}

	div#PhotoSlide div#PhotoWrapper
	{
		position: 		relative;
	}

	div#PhotoSlide div#Photo1
	{
		left: 		60px;
		position: 	absolute;
		top: 		20px;
		z-index:	3;
	}

		div#PhotoSlide div#Photo1 img.Photo,
		div#PhotoSlide div#Photo1 img.PhotoBackground
		{
			height: 		255px;
			left: 			23px;
			position: 		absolute;
			top: 			30px;
			width: 			369px;

			-moz-transform: 			rotate(-9deg);
			-webkit-transform: 			rotate(-9deg);
			-o-transform:				rotate(-9deg);

					}

		div#PhotoSlide div#Photo1 img.Frame
		{
			position: 			relative;
			z-index: 			1;
		}

	div#PhotoSlide div#Photo2
	{
		left: 		30px;
		position: 	absolute;
		top: 		30px;
		z-index:	2;
	}

		div#PhotoSlide div#Photo2 img.Photo,
		div#PhotoSlide div#Photo2 img.PhotoBackground
		{
			height: 		255px;
			left: 			34px;
			position: 		absolute;
			top: 			46px;
			width: 			369px;

			-moz-transform: 			rotate(-15deg);
			-webkit-transform: 			rotate(-15deg);
			-o-transform:				rotate(-15deg);

					}

		div#PhotoSlide div#Photo2 img.Frame
		{
			position: 			relative;
			z-index: 			1;
		}

	div#PhotoSlide div#Photo3
	{
		left: 			0;
		position: 		absolute;
		top:	 		0;
		z-index:		1;
	}

		div#PhotoSlide div#Photo3 img.Photo,
		div#PhotoSlide div#Photo3 img.PhotoBackground
		{
			height: 		255px;
			left: 			45px;
			position: 		absolute;
			top: 			76px;
			width: 			369px;

			-moz-transform: 			rotate(-27deg);
			-webkit-transform: 			rotate(-27deg);
			-o-transform:				rotate(-27deg);

					}

		div#PhotoSlide div#Photo3 img.Frame
		{
			position: 			relative;
			z-index: 			1;
		}

	div#PhotoSlide div#BallsOverlay
	{
		position: 	absolute;
		right:		-20px;
		top:		0;
		z-index: 	3;
	}

div#PhotoAlbumButton
{
	height: 			0;
	margin: 			0 auto;
	position:			relative;
	width: 				1275px;
	z-index: 			10;
}

	div#PhotoAlbumButton a
	{
		display: 			block;
		height: 			320px;
		overflow: 			hidden;
		position: 			absolute;
		right: 				65px;
		top: 				495px;
		width: 				320px;
	}

		div#PhotoAlbumButton a img
		{
			height: 		320px;
			left: 			0;
			position: 		absolute;
			right: 			0;
			width: 			320px;
		}

		div#PhotoAlbumButton a img.Photo
		{
			height: 		300px;
			width: 			300px;
		}

/* END PHOTOSLIDE */

/* CONTACT FORMULIER */
form#Contact,
form#Reserveren
{

}

form#Contact div.Row,
form#Reserveren div.Row
{
	margin-bottom:		20px;
	width:				437px;
}

form#Contact div.Row label,
form#Reserveren div.Row label
{
	color:				#FFFFFF;
	font-family:		"BalloonRegular", "Comic Sans MS", Arial, Helvetica, sans-serif;
	font-size:			21px;
}

form#Contact div.Row input,
form#Reserveren div.Row input
{
	border:				1px solid #000000;
	font-family: 		"Comic Sans MS", Arial, Helvetica, sans-serif;
	height:				21px;
	padding-left: 		2px;
	width:				278px;
}

form#Contact div.Row textarea,
form#Reserveren div.Row textarea
{
	border: 			1px solid;
	font-family: 		"Comic Sans MS", Arial, Helvetica, sans-serif;
    height: 			100px;
	padding-left: 		2px;
    vertical-align:		top;
    width: 				275px;
}

form#Contact div.Row input.SendButton,
form#Reserveren div.Row input.SendButton
{
	float: 				right;
	width: 				auto;
}

form#Contact div.Row div.SendButton,
form#Reserveren div.Row div.SendButton
{
	background-image:	url("/Includes/Themes/monkeytown/Images/VerstuurKnop.png");
	border:				none;
	cursor:				pointer;
	float: 				right;
	height:				38px;
	width:				122px;
}
/* END CONTACT FORMULIER*/

/* GOOGLE MAP */
div#MapContainer iframe
{
	border: 			1px solid #003800;
	margin-top: 		20px;
}

/* END GOOGLE MAP */

/* FOOTER */
div#Footer
{
	background-color: 	#003500;
	color: 				#FFFFFF;
	font-family: 		Arial, Helvetica, sans-serif;
	font-size: 			12px;
	height: 			153px;
	margin-top: 		-153px;
	position:			relative;
	z-index: 			4;
}

	div#Footer a,
	div#Footer p
	{
		color: 				#FFFFFF;
	}

	div#Footer a:hover
	{
		text-decoration: 	underline;
	}

	div#Footer ul
	{
		margin: 		0 auto;
		width: 			590px;
	}

		div#Footer ul li
		{
			font-family: 	"BalloonRegular", "Comic Sans MS", Arial, Helvetica, sans-serif;
			font-size: 		17px;
			float: 			left;
			margin-right: 	43px;
			margin-top: 	10px;
		}

		div#Footer ul li.Last
		{
			margin-right: 	0;
		}

	div#Footer div#FooterBottom
	{
		clear: 			left;
		margin: 		0 auto;
		position: 		relative;
		text-align: 	right;
		width: 			1263px;
	}

		div#Footer div#FooterBottom div#Right
		{
			background-image:	 	url('/Includes/Themes/monkeytown/Images/ShrubberyAchterDieren.png');
			background-position: 	center bottom;
			background-repeat: 		no-repeat;
			height:					1098px;
			position: 				absolute;
			right: 					-85px;
			top: 					-1130px;
			z-index: 				-1;
		}

			div#Footer div#FooterBottom div#Right img#Animals
			{
				left: 				-65px;
				position: 			relative;
				top: 				415px;
				z-index: 			2;
			}

			div#Footer div#FooterBottom div#Right img#TextAnimals
			{
			    left: 				-112px;
			    position: 			relative;
				top: 				570px;
			}

		div#Footer div#FooterBottom p
		{
			padding-right: 	145px;
    		padding-top: 	45px;
		}
/* END FOOTER */

div#Bamboo
{
	background-image:	 	url('/Includes/Themes/monkeytown/Images/Bamboe.png');
	background-position: 	center bottom;
	background-repeat: 		no-repeat;
	bottom: 				153px;
	height: 				1071px;
	left: 					-280px;
	position: 				absolute;
	width: 					553px;
	z-index: 				-1;
}

/* 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;
			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;
			color: 				#003500;
			display: 			none;
			font-family: 		Verdana, Arial, Helvetica, sans-serif;
			font-size: 			12px;
			padding: 			3px 5px;
			position: 			absolute;
			right: 				-185px;
			top: 				0;
			width: 				175px;

			-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/monkeytown/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 */
