﻿html, body
{
	height: 100%;
}
body
{
	color: #333;
	font:62.5%/140% Verdana, Arial,sans-serif;
	margin:0;
	padding:0;
	text-align:center;
	background:#028100 url(/images/containercolumn_bg.png) repeat-y center top;
	
}

img
{
	border: none;
}


.clearer
{
	clear: both;
	height: 1px;
}

#ContainerColumn
{
	width:970px;
	margin:0 auto;
	text-align:left;
	padding: 0;
	background-color: #fff;
	min-height: 100%;
}
	#Container
	{
		position: relative;
	}
		#Header
		{
			height: 192px;
			border-top: 2px solid #d30013;
			border-bottom: 2px solid #d30013;
		}
            #Logo
            {
            	padding-top: 38px;
            	}
				#Logo h1
				{
					position: absolute;
					display: block;
					font-size: 6.4em;
					line-height: 1em;
					font-family: Arial Bold, Arial Black, Arial, Verdana, Sans-Serif;
					margin:0;
					font-weight: bold;
					padding: 0;
					top: -14px;
				}
				#Logo h1 a
				{
					line-height: 2em;
					color: #fdbf00;
					text-decoration: none;
					padding-left: 20px;
				}
				#Logo h2
				{
					padding-right: 20px;
					position: absolute;
					top: 144px;
					right: 0;
					line-height: 2em;
					font-weight: normal;
					font-size: 2em;
					color: #fdbf00;
					text-decoration: none;
					font-family: Arial, Verdana, Sans-Serif;
				}
        
        #Navigation
        {
			position:absolute;
			width: 100%;
			z-index: 20;
			overflow: hidden;
			height: 28px;
		}
            #NavigationHeader{}
            #NavigationBody
            {
				min-height: 1px;
			}
                #MenuTree
                {
					background-color: #84807F;
					z-index: 100;
				}
					#MenuTree ul
					{
						margin: 0;
						padding: 0;
					}
					#MenuTree ul li
					{
						background-color: #84807F;
						padding: 0 12px 0 20px;
						font-size: 1.4em;
						line-height: 2em;
						display: block;
						float: left;
						list-style-type: none;
					}
					#MenuTree ul li,
					#MenuTree ul li a,
					#MenuTree ul li.current li a
					{
						color: #fff;
						text-decoration: none;
					}
					#MenuTree ul li.current a,
					#MenuTree ul li.current li.current a
					{
						color: #690;
					}
					#MenuTree ul ul
					{
						margin: 16px 0;
					}
					#MenuTree ul li li
					{
						background: none;
						font-size: 0.9em;
						line-height: 1.5em;
						float: none;
						padding: 0;
					}
					#MenuTreeFooter
					{
						height: 1px;
						clear: both;
					}
            #NavigationFooter
            {
				position: relative;
				background-color: #d30013;
				height: 2px;
				line-height: 1px;
				font-size: 1px;
			}
        
        #Body
        {
        	border-top: 2px solid #d30013;
			margin-top: 28px; /* uitsparing ivm menu */
			padding-top: 32px;
		}
            #BodyBase
            {
				position: relative;
			}
            
/* Homepage items */
                #HomeShowcase
                {
					float: left;
					width: 420px;
					min-height: 409px;
					padding-left: 16px;
					padding-right: 40px;
				}
					#NewsHeadline {}
						#NewsHeadline h1
						{
							font-size: 22px;
							font-weight: normal;
							line-height: 1.2em;
						}
						#NewsHeadline p
						{
							font-size: 12px;
							line-height: 1.4em;
						}
                #HomeWelcome
                {
					float: right;
					width: 490px;
					min-height: 409px;
				}
                    #Expositions
                    {
						width: 438px;
						padding: 0 0 22px 0;
						margin: 0 16px 0 0;
					}
						#Expositions h1
						{
							font-size: 22px;
							font-weight: normal;
							line-height: 1.2em;
							margin-top: 0;
						}
                        #Expositions p
                        {
							font-size: 12px;
							line-height: 1.4em;
						}
/* TextPage */
				#TextPage
				{
					padding: 0 20px;
					width: 930px;
				}
						#TextPage h1,
						#TextPage .header
						{
							font-size: 22px;
							font-weight: normal;
							line-height: 1.2em;
							margin-top: 0;
						}
                        #TextPage p
                        {
							font-size: 12px;
							line-height: 1.4em;
						}

/* Bestelformulier */
label
{
	float: left;
	width: 200px;
	
}
form
{
	margin-top: 20px;
}
form div div
{
	font-size: 1.2em;
	margin-bottom: 4px;
}
/* Works items */
				#WorksWrapper
				{
						margin-left: 75px;
						width: 819px; /* zorg ervoor dat rechts van het achterste werk ook niet nog een grijs lijntje verschijnt */
						height: 409px;
						overflow: hidden;
				}
					#Works
					{
						width: 820px;
						/*height: 410px;*/
						background-color: #e8e8e8;
					}
						#Works .work
						{
							background-color: #FFF;
							width: 204px;
							height: 204px;
							float: left;
							margin: 0 1px 1px 0;
							cursor:pointer;
							display: none;
						}
						#Works .nonactive
						{
							cursor:default;
						}
						#Works .workImage
						{
							width: 160px;
							height: 160px;
							margin: 22px;
						}
						#Works .workImage img
						{
							display: block;
							margin: 0 auto;
						}        
						#Works .bigimage, 
						#Works .description
						{
							display: none;
						}        

				#BodyNavigationBar
				{
					margin: 26px 95px 0;
					height: 20px;
					position: relative;
				}
					#BodyNavigationBar ul
					{
						padding: 0;
						margin: 0;
					}
					#BodyNavigationBar ul li
					{
						padding: 0;
						margin: 0;
						list-style-type: none;
						float: left;
						width: 16px;
					}
					#BodyNavigationBar ul li a
					{
						font-size: 1.4em;
						font-weight: bold;
						text-decoration: none;
						color: #333;
					}
					#BodyNavigationBar ul li.current a
					{
						color: #690;
					}

/* Overlay */
				#BodyOverlay
				{
					position: absolute;
					z-index: 10;
					width: 820px;
					height: 455px;
					display: none;
				}
					#OverlayBackground
					{
						position: absolute;
						z-index: 11;
						width: 100%;
						height: 100%;
						background-color: #fff;
						display: none;
						
						opacity: 0.9; /* doorzichtigheid in FF, Opera, Safari, Chrome */
						filter:alpha(opacity=90); 
					}
					#OverlayForeground
					{
						position: absolute;
						z-index: 12;
						width: 100%;
						height: 100%;
						display: none;
				}
						#OverlayWork
						{
							width: 412px; /* net even breder dan twee foto's, om de grijze verticale lijn in de achtergrond te laten verdwijnen */
							height: 410px;
							background-color: #fff;
							margin: 0 auto;
							cursor:pointer;
						}
							#OverlayWork img
							{
								display: block;
								margin: 0 auto;
							}
						#OverlayWorkDescription
						{
							position: absolute;
							left: 0;
							bottom: 0;
						}
							#OverlayWorkDescription h2
							{
								font-size: 1.6em;
								font-weight: bold;
								margin:0;
								padding: 0;
								line-height: 1.5em;
							}
							#OverlayWorkDescription p
							{
								font-size: 1.4em;
								margin:0;
								padding: 0;
								line-height: 1.5em;
							}
							#OverlayWorkDescription p a
							{
								color: #333;
							}
						#OverlayNavigationBar
						{
							padding-top: 24px;
							height: 20px;
						}
							#OverlayStepper
							{
								width: 280px;
								margin: 0 auto;
								position: relative;
								font-size: 1.4em;
								line-height: 1.5em;
							}
								#OverlayStepper .prevButton
								{
									position: absolute;
									left: 0;
									top:0;
								}
								#OverlayStepper .prevButton a
								{
									color: #333;
								}
								#OverlayStepper .closeButton
								{
									text-align: center;
								}
								#OverlayStepper .closeButton a
								{
									color: #333;
									text-decoration: none;
								}
								#OverlayStepper .nextButton
								{
									position: absolute;
									right: 0;
									top:0;
								}
								#OverlayStepper .nextButton a
								{
									color: #333;
								}

        #Footer
        {
			height: 20px;
			clear: both;
		}
