/* General */

	*
	{
		font-size: 13px;
		font-family: Arial, Verdana, Helvetica;
		margin: 0px;
		padding: 0px;
		line-height: 18px;
	}
	
	:focus { outline-style: none; }
	
	a img { border: none; }
	
	a { color: #336699; }
	
	body
	{
		margin: 0;
		padding: 0;
		background-color: #336699;
		background-image: url('/images/body-bg.gif');
		background-repeat: repeat-x;
		background-position: 0 0;
		background-attachment: fixed;
	}
	
	#page_wrapper
	{
		width: 920px;
		margin: 15px auto;
		padding: 0px;
	}


/* Content */

	#content_wrapper
	{
		position: absolute;
		top: 105px;
		margin: 0 auto;
		width: 920px;
		padding: 0;
		margin: 0;
		background-color: #FFFFFF;
	}
	
	#content
	{
		position: relative;
		width: 920px;
		top: 0;
		padding: 0;
		margin: 0;
		background-color: #FFFFFF;
		height: auto;
	}

	.home-index #content
	{
		background-image: url('/images/homepage-earnst-skyline.jpg');
		background-repeat: no-repeat;
		background-position: 5px 0;
		padding: 0;
		margin: 0;
		width: 920px;
		height: 470px;
	}

	#content div.padding { padding: 0 30px 30px 30px; }
	
	.home-index #content div.padding { padding: 280px 30px 30px 30px; }
	
	#content .page_header
	{
		line-height: 32px;
		padding: 20px;
		display: block;
		background-image: url('/images/page_header-bg.jpg');
		background-repeat: no-repeat;
		background-position: 0 50px;
		height: 160px;
	}
	
	#content p
	{
		margin: 0 0 0 20px;
	}
	
	#content p.kader, .contact-index #content form
	{
		padding: 15px;
		margin: 20px 0 0 0;
		width: 525px;
		border-top: 2px #DEE6EF solid;
		border-right: 2px #B4C5D9 solid;
		border-bottom: 2px #B4C5D9 solid;
		border-left: 2px #DEE6EF solid;
	}
	
	#content p.kader strong
	{
		font-size: 16px;
		display: block;
		margin: 0 0 10px 0;
	}
	
	.webdesign-index #content .page_header
	{
		background-image: url('/images/illustratie-webdesign.jpg');
		background-repeat: no-repeat;
		background-position: 0 9px;
	}
	
	.portfolio-index #content .page_header
	{
		background-image: none;
		height: 130px;
	}

	.portfolio-index #content
	{
		background-image: url('/images/illustratie-portfolio.jpg');
		background-repeat: no-repeat;
		background-position: 30px 19px;
	}
	
	.development-index #content
	{
		background-image: url('/images/illustratie-webbouw.jpg');
		background-repeat: no-repeat;
		background-position: 30px 20px;
	}
	
	.development-index #content .page_header { background-image: none; }
	
	.optimization-index #content
	{
		background-image: url('/images/illustratie-optimalisatie-v2.jpg');
		background-repeat: no-repeat;
		background-position: 17px 16px;
	}
	
	.optimization-index #content .page_header
	{
		background-image: none;
		padding: 20px 20px 20px 240px;
	}
	
	
	.about_us-index #content
	{
		background-image: url('/images/illustratie-over-earnst.jpg');
		background-repeat: no-repeat;
		background-position: 30px 35px;
	}
	
	.about_us-index #content .page_header { background-image: none; }
	
	.contact-index #content .page_header
	{
		background-image: url('/images/illustratie-contact.jpg');
		background-repeat: no-repeat;
		background-position: 0 20px;
	}

	.contact-index #content
	{
		background-image: url('/images/illustratie-spotlight.gif');
		background-repeat: no-repeat;
		background-position: 675px 215px;
	}
		
	.home-index #content h1
	{
  		font-weight: normal;
		font-size: 24px;
		line-height: 32px;
		margin: 0 0 0 645px;
		padding: 0;
		width: 180px;
		text-align: center;
		position: absolute;
		top: 55px;
		left: auto;
		z-index: 40;
	}
	
	.home-index #content h1 strong
	{
		font-size: 26px;	
		font-weight: bold;
	}
	
	
	#content .page_header h1
	{
		font-weight: bold;
		font-size: 26px;	
		line-height: 32px;
		margin: 30px 0 0 0;
		padding: 0;
	}
	
	#content .page_header h2
	{
		font-weight: normal;
		font-size: 26px;
		line-height: 32px;
		margin: 0;
		padding: 0;
	}
	
	#content p.first
	{
		font-size: 16px;
		line-height: 24px;
		padding: 0px 20px 20px 20px;
		margin: 0;
		width: 540px;
	}
	
	#content p.first * { font-size: 16px; }
	
	#content form
	{
		padding: 20px 20px 20px 20px;
	}
	
	#content form #random { display: none; }
	
	input[type="text"], textarea /* To keep form fields consistent */
	{
		background: #d6e0eb !important;
		border: 1px solid #85a3c2;
	}
	
	.optimization-calc-conversion input
	{
		width: 74px;
		text-align: right;
	}
	
	.optimization-calc-conversion input.readonly
	{
		border: none;
		text-align: right;
		width: 80px;
		border-top: 2px solid #000000;
		background-color: #FFFFFF !important;
		font-weight: bold;
	}
	
	#content table tr td
	{
		font-size: 16px;
		padding: 0 0 10px 0;
		font-weight: bold;
	}
	
	#content table tr td input, #content table tr td textarea
	{
		padding: 5px;
		font-size: 14px;
	}
	
	#content table tr td textarea { width: 310px; }
	
	
	#content .teaser_wrapper
	{
		padding: 10px 0 20px 20px;
		width: 560px;
		float: left;
	}
	
	.home-index #content .teaser_wrapper
	{
		padding: 35px 0 20px 20px;
	}
	
	#content .teaser_wrapper div
	{
		float: left;
		width: 244px;
		height: 54px;
		font-size: 14px;
		margin: 0 20px 20px 0;
		padding: 12px 0 0 14px;
		background-image: url('/images/teaser-bg.gif');
		background-repeat: repeat;
		background-position: 0 0;
		border-width: 0 1px 1px 0;
		border-color: #eef3c6;
		border-style: solid;
	}
	
	#content .teaser_wrapper div strong, #content .teaser_wrapper div a
	{
		font-size: 16px;
		line-height: 22px;
		font-weight: bold;
	}
	
	#content .teaser_wrapper div a:hover
	{
		text-decoration: none;
	}
	
	#content .teaser_wrapper div h3 { font-size: 15px; }
	
	#content .right_wrapper
	{
		padding: 15px;
		width: 206px;
		float: right;
		background-image: url('/images/note-bg2.gif');
		background-repeat: repeat-x;
		background-position: 0 0;
		margin: 35px 0 0 0;
		height: auto;
		background-color: #ccd84f;
		border-top: 2px solid #ede642;
		border-right: 2px solid #afc356;
		border-bottom: 2px solid #afc356;
		border-left: 2px solid #ede642;
	}
	
	.optimization-index #content .right_wrapper
	{
		float: none;
		margin: 0;
	}
	
	#content .right_wrapper h2
	{
		font-size: 19px;
		line-height: 22px;
	}
	
	#content .right_wrapper p
	{
		font-size: 14px;
		margin: 10px 0;
		line-height: 18px;
	}
	
	#content .right_wrapper a
	{
		font-size: 16px;
		font-weight: bold;
		color: #336699;
	}
	
	
	#content div.right
	{
		width: 238px;
		float: right;
		height: auto;
		margin-top: 30px;
	}

	#content p
	{
		margin-bottom: 10px;
		line-height: 18px;
	}


/* Box */

	div.right .box
	{
		background-color: #D6E0EB;
		margin: 0 0 30px 0;
		display: block;
		background-image: url('/images/box-bg.gif');
		background-repeat: repeat-x;
		background-position: 0 0;
		border-top: 2px #dee6ef solid;
		border-right: 2px #b4c5d9 solid;
		border-bottom: 2px #b4c5d9 solid;
		border-left: 2px #dee6ef solid;
		width: 236px;
	}
	
	
	#content div.right .box p, #content div.right .note p
	{
		font-size: 14px;
		line-height: 20px;
		margin: 15px;
		padding: 0;
	}
	
	div.right .box p *
	{
		font-size: 14px;
	}
	
	div.right .box strong
	{
		font-size: 19px;
		padding: 0;
		display: block;
		margin: 0 0 10px 0;
	}
	
	div.right .box h4
	{
		font-size: 19px;
		font-weight: bold;
		margin: 15px 15px 10px 15px;
		color: #000000;
		line-height: 22px;
	}
	
	
	div.right .box a
	{
		font-size: 16px;
		font-weight: bold;
		color: #336699;
		line-height: 22px;
	}
	
	div.right .box a:hover { text-decoration: none; }

	.contact-index .box a, .portfolio .box a { font-size: 14px !important; }
	
	/*

	.portfolio .box { padding-bottom: 15px; }

	.portfolio .box p
	{
		margin: 0 !important;
		padding-top: 0 !important;
		padding-left: 15px !important;
		padding-right: 15px !important;
		padding-bottom: 0 !important;
	}

	.portfolio .box h4
	{
		font-size: 16px !important;
		margin: 0 !important;
		padding-top: 15px !important;
		padding-left: 15px !important;
		padding-bottom: 5px !important;
	}

	*/
	

/* Header */

	#top
	{
		top: 0px;
		width: 920px;
		margin: 0 auto;
		padding: 0px;
		height: 90px;
		background-color: #000000;
		background-image: url('/images/header-logo.gif');
		background-repeat: no-repeat;
		background-position: 0 0;
	}
	
	#top div.logo
	{
		float: left;
		text-indent: -999px;
		width: 300px;
		height: 90px;
	}
	
	#top div.logo a
	{
		display: block;
		width: 250px;
		height: 50px;
		z-index: 20;
		margin: 20px 0 0 40px;
	}


/* Menu */

	.menu
	{
		margin: 42px 30px 0 0;
		padding: 0;
		display: block;
		width: 500px;
		float: right;
	}
	
	.menu ul 
	{
		padding: 0;
		margin: 0;
		list-style: none;
	}
	
	.menu ul li
	{
		position: relative;
		top: 0px;
		height: auto;
		display: inline;
		margin: 0;
		padding: 0;
		float: left;
	}
			
	.menu ul li a
	{
		display: block;
		font-size: 16px;
		line-height: 20px;
		color: #FFFFFF;
		text-align: center;
		text-decoration: none;
		margin: 0 10px;
		padding: 0 0px;
		border-bottom: 1px #FFFFFF dotted;
	}
	
	.menu ul li a:hover
	{
		border-bottom: none;
	}
	
	.index .menu ul li.active a
	{
		background-color: #FFFFFF;
		color: #000000;
		margin: 0 5px;
		padding: 0 5px;
		border-bottom: 1px #FFFFFF solid;
	}


/* Footer */

	#footer
	{
		/* border: 1px solid purple; */
		position: relative;
		height: 110px;
		width: 920px;
		clear: both;
		background-image: url('/images/footer-bg.gif');
		background-repeat: no-repeat;
		background-position: 0 0;
	}
	
	#footer p
	{
		font-size: 10px;
		color: #666666;
		clear: both;
		padding: 20px 0 0 50px;
	}
	
	#footer p a, #footer p a:visited
	{
		color: #666666;
		font-size: 10px;
		text-decoration: none;
	}
	
	#footer p a:hover, #footer p a.active
	{
		color: #000000;
		text-decoration: underline;
	}


/* Menu footer */

	#footer ul
	{
		list-style: none;
		padding: 30px 0 0 50px;
		margin: 0;
	}
	
	#footer ul li
	{
		float: left;
		margin: 0 20px 0 0;
	}
	#footer ul li a
	{
		text-decoration: none;
		font-size: 13px;
		color: #666666;
	}
	
	.index #footer ul li.active a { color: #000000; }
	
	#footer ul li a:hover
	{
		color: #000000;
		text-decoration: underline;
	}

