/* -- Reset all -- */
body, html, div, img, p, h1, h2, h3, h4, h5, h6, ul, ol, li {
	margin: 0px; padding: 0px; border: 0px;
}

/* -- Page format -- */
html {
	height: 100%;		/* gives layout 100% height */
	overflow: inherit;	/* 100% height in Opera 9.5 */
}
body { 
	height: 100%;		/* gives layout 100% height */
	font-family: Arial, Helvetica, sans-serif; 
	font-size: 0.72em; 
	background-image: url(../templateimages/greenstyle/bodyBG.jpg);
	background-repeat: repeat-x;
	background-color: #FFFFFF; 
}
div#wrapper {
	min-height: 100%;	/* gives layout 100% height */
	width: 876px;		/* centered div must be given a width */
	margin: 0 auto;		/* centers #wrapper */
}
div#menu {
	width: 618px;
	height: 66px;
	margin-left: 10px;
}
div#header{
	width: 876px;		/* centered div must be given a width */
	margin: 0 auto;		/* centers #wrapper */
	height: 188px;
	margin-top: 65px;
	background-image: url(../templateimages/headerBG.jpg);
	background-repeat: no-repeat;
	background-position: 0px -376px;
}
div#content {
	width: 866px;
	padding: 0px 0px 80px 30px;
	background-image: url(../templateimages/contentBG.jpg);
	background-repeat: no-repeat;
}
div#contentExtra {
	width: 866px;
	padding: 0px 0px 80px 30px;
	background-image: url(../templateimages/greenstyle/indexContentBG.jpg);
	background-repeat: no-repeat;
}
div#clearfooter {
	height: 80px;		/* provides space for the #footer */
}
div#footer {
	height: 80px;
	margin-top: -80px;	/* -80px sucks it back in & auto centers it */
	background-image: url(../templateimages/footerBG.jpg);
	background-repeat: repeat-x;
} 
div#footercontents {
	width: 876px;
	margin: 0 auto;
}

/*-- Standaard styles --*/
h1 	{ color: #658C2E; font-size:   2em;	padding: 1em 0em 0.5em 0em; }
h2 	{ color: #000000; font-size: 1.3em; padding: 1.5em 0em 0em 0em; }
h3 	{ color: #658C2E; font-size: 1em; margin: 0em; }
p 	{ padding: 1em 0em 1em 0em; }
li 	{ list-style: inside;}
.headerImg {
	border: solid 2px #CCC;
}

a 		{ color: #658C2E; text-decoration: none;}
a:hover 	{ color: #B8443A; text-decoration: none;}
a.current { color: #B8443A;}

/*-- Stylesheet switcher --*/
.switchform{
	background-image: url(../templateimages/styleSwap.jpg);
	float: left;
	width: 172px;
	height: 35px;
	text-align: left;
	padding: 30px 10px 0px 0px;
}
.switchSquare{
	display: block;
	width: 25px;
	height: 25px;
	float: right;
	margin: 0px 5px 0px 5px;
}
a#styleDefault { 
	background-image: url(../templateimages/styleDefault.png);}
	a#styleDefault:hover {
}
a#blueStyle {
	background-image: url(../templateimages/blueStyle.png);}
	a#styleDefault:hover {
}
a#greenStyle { 
	background-image: url(../templateimages/greenStyle.png);}
	a#styleDefault:hover {
}

/*-- Main Menu --*/
li.inline { list-style: inside; display: inline;}
a.menu {
	display: block;
	float: left;
	width: 103px;
	height: 67px;
}
a.home_off { 			background-image: url(../templateimages/greenstyle/menu.jpg); background-position: 0px 0px;}
a.home_off:hover { 		background-image: url(../templateimages/greenstyle/menu.jpg); background-position: 0px -67px;}
a#home_on{ 				background-image: url(../templateimages/greenstyle/menu.jpg); background-position: 0px -134px;}

a.showcase_off { 		background-image: url(../templateimages/greenstyle/menu.jpg); background-position: -103px 0px;}
a.showcase_off:hover { 	background-image: url(../templateimages/greenstyle/menu.jpg); background-position: -103px -67px;}
a#showcase_on{ 			background-image: url(../templateimages/greenstyle/menu.jpg); background-position: -103px -134px;}

a.cv_off { 				background-image: url(../templateimages/greenstyle/menu.jpg); background-position: -206px 0px}
a.cv_off:hover { 		background-image: url(../templateimages/greenstyle/menu.jpg); background-position: -206px -67px;}
a#cv_on{ 				background-image: url(../templateimages/greenstyle/menu.jpg); background-position: -206px -134px;}

a.portfolio_off { 		background-image: url(../templateimages/greenstyle/menu.jpg); background-position: -309px 0px}
a.portfolio_off:hover { background-image: url(../templateimages/greenstyle/menu.jpg); background-position: -309px -67px;}
a#portfolio_on{ 		background-image: url(../templateimages/greenstyle/menu.jpg); background-position: -309px -134px;}

a.eigen_off { 			background-image: url(../templateimages/greenstyle/menu.jpg); background-position: -412px 0px}
a.eigen_off:hover { 	background-image: url(../templateimages/greenstyle/menu.jpg); background-position: -412px -67px;}
a#eigen_on{ 			background-image: url(../templateimages/greenstyle/menu.jpg); background-position: -412px -134px;}

a.contact_off { 		background-image: url(../templateimages/greenstyle/menu.jpg); background-position: -515px 0px}
a.contact_off:hover { 	background-image: url(../templateimages/greenstyle/menu.jpg); background-position: -515px -67px;}
a#contact_on{ 			background-image: url(../templateimages/greenstyle/menu.jpg); background-position: -515px -134px;}

/*-- Footer --*/
.W3C {
	width: 80px; 
	height: 15px;
	float: right;
	margin: 1em 1em 0em 0em;
}
.footer 	{ 
	color: #000000; 
	font-size: 0.8em; 
	padding: 1em 0em 0.5em 1em; 
	font-weight: normal; 
}
a#css 	{ background-image: url(../templateimages/css_button.png);}
a#xhtml 	{ background-image: url(../templateimages/xhtml_button.png);}

/*--------------- Unspecific Styles ---------------*/
.hidden 		{ display: none;}		/* hide stuff (used in menu) */
.center 		{ text-align: center;} 	/* center text and images */
.right 		{ text-align: right;} 	/* text is aligned at the right side */
.top		{ vertical-align: top;} /* text aligned at the top */
.left		{ float:left;} 			/* afbeeldingen links uitlijnen */
.flowing	{overflow: hidden;} 	/* geen overflow */
span.type 	{ color: #999; }
pre.code {
	font-family:"Courier New", Courier, monospace;
	font-size: 11px;
	border: 1px inset; 
	margin: 0px; 
	padding: 5px; 
	overflow: auto; 
	width: 500px; 
	text-align: left;
	background-color: #EAFFC7;
}

/*--------------- Specific page Styles ---------------*/
/*-- homepage --*/
div#blog {
	width: 580px;
	float: left;
	clear: left;
}
.indexRecent {
	width: 210px;
	float: right;
	clear: right;
	margin: 0px 30px 0px 0px;
}
.hrStyle {
	background-color: #84B83A;
	width: 190px;
	float: right;
	clear: right;
	margin: 0px 20px 0px 0px;
	height: 1px;
}
/* zijmenu current page */
.zijmenuCurrent {
	height: 16px;
	display: list-item; 
	color: #FFFFFF;
	padding-left: 10px;
	list-style: none;
	margin: 0px 20px 0px 0px;
	text-decoration: none;
	Background-color: #B8443A;
}	
/* zijmenu list-display */
.zijMenu {
	height: 16px;
	display: list-item; 
	padding-left: 10px;
	list-style: none;
	margin: 0px 20px 0px 0px;
	text-decoration: none;}
	a.zijMenu:hover 	{ color: #FFFFFF; Background-color: #84B83A;}

div.line {
	width: 580px;
	height: 1px;
	background-color: #E1E1E1;
	margin: 5px 40px 20px 0px;
}
.meer {
	font-size: 1em;	
	float: right; 
	clear: both; 
	margin: 0px 20px 10px 0px;
}

/*-- cv --*/
img.right { 
	float: right;
	margin: 0px 50px 0px 0px;
}

/*-- sitemap --*/
ul	 		{ margin: 1em 0em 0em 0em; }
ul.menu		{ margin: 0px; }
ul.map 		{ margin: 0px 0px 10px 10px;}
li.noBullit { list-style: none; padding-left: 10px;}
li.heading 	{ list-style: none;}


/*-- Showcase --*/
.row 		{ width: 876px;	clear: both;}
.category 	{ width: 410px; float:left; margin: 0px 20px 20px 0px;}
.imageLeft{
	display: block;
	width: 108px;
	height: 82px;
	float: left;
	border: solid 2px #658C2E;
	margin: 10px 10px 0px 10px;
}
div#projecten {
	width: 810px;
	background-image: url(../templateimages/projecten.jpg);
	background-repeat: no-repeat;
	background-color: #EFEFEF;
	padding: 54px 0px 20px 10px;
}
div#webdesign {
	width: 400px;
	background-image: url(../templateimages/webdesign.jpg);
	background-repeat: no-repeat;
	padding: 44px 0px 20px 0px;
	background-color: #EFEFEF;
}
div#flash {
	width: 400px;
	background-image: url(../templateimages/flash.jpg);
	background-repeat: no-repeat;
	padding: 44px 0px 20px 0px;
	background-color: #EFEFEF;
}
div#animatieEnFilm {
	width: 400px;
	background-image: url(../templateimages/animatieEnFilm.jpg);
	background-repeat: no-repeat;
	padding: 44px 0px 20px 0px;
	background-color: #EFEFEF;
}
div#digitaleVormgeving {
	width: 400px;
	background-image: url(../templateimages/digitaleVormgeving.jpg);
	background-repeat: no-repeat;
	padding: 44px 0px 20px 0px;
	background-color: #EFEFEF;
}
div#analogeVormgeving {
	width: 400px;
	background-image: url(../templateimages/analogeVormgeving.jpg);
	background-repeat: no-repeat;
	padding: 44px 0px 20px 0px;
	background-color: #EFEFEF;
}
div#beelden3d {
	width: 400px;
	background-image: url(../templateimages/3dbeelden.jpg);
	background-repeat: no-repeat;
	background-color: #EFEFEF;
	padding: 44px 0px 20px 0px;
}

/*-- Contact --*/
.textField {
	border-left: solid 1px #528B24;
	border-top: solid 1px #528B24;
	border-right: solid 1px #91C846;
	border-bottom: solid 1px #91C846;
	padding-left: 5px;}
	.textField:hover { border: solid 1px #B8433A;}
	
.textArea {
	border-left: solid 1px #528B24;
	border-top: solid 1px #528B24;
	border-right: solid 1px #91C846;
	border-bottom: solid 1px #91C846;
	padding-left: 5px;}
	.textArea:hover { border: solid 1px #B8433A;}

/*--------------- Showcase items ---------------*/
/*-- Web => Dreamweaver --*/
a#d01 { 
	background-image: url(../images/showcase.jpg);} 
	a#d01:hover { border: solid 2px #B8443A;; 
}
a#d02 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -114px 0px;}
	a#d02:hover { border: solid 2px #B8443A;
}
a#d03 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -228px 0px;} 
	a#d03:hover { border: solid 2px #B8443A;
}
a#d04 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -342px 0px;} 
	a#d04:hover { border: solid 2px #B8443A;
}
a#d05 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -456px 0px;} 
	a#d05:hover { border: solid 2px #B8443A;
}


/*-- Flash => Flash --*/
a#f01 { 
	background-image: url(../images/showcase.jpg); 
	background-position: 0px -88px;} 
	a#f01:hover { border: solid 2px #B8443A;
}
a#f02 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -114px -88px;} 
	a#f02:hover { border: solid 2px #B8443A;
}
a#f03 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -228px -88px;} 
	a#f03:hover { border: solid 2px #B8443A;
}
a#f04 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -342px -88px;} 
	a#f04:hover { border: solid 2px #B8443A;
}
a#f05 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -456px -88px;} 
	a#f05:hover { border: solid 2px #B8443A;
}
a#f06 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -570px -88px;} 
	a#f06:hover { border: solid 2px #B8443A;
}
a#f07 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -684px -88px;} 
	a#f07:hover { border: solid 2px #B8443A;
}
a#f08 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -798px -88px;} 
	a#f08:hover { border: solid 2px #B8443A;
}
a#f09 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -912px -88px;} 
	a#f09:hover { border: solid 2px #B8443A;
}
a#f10 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -1026px -88px;} 
	a#f10:hover { border: solid 2px #B8443A;
}

/*-- Animatie en film => Premiere Pro --*/
a#pr01 { 
	background-image: url(../images/showcase.jpg); 
	background-position: 0px -174px;}
	a#pr01:hover { border: solid 2px #B8443A;
}
a#pr02 { 
	background-image: url(../images/showcase.jpg);
	background-position: -114px -174px;} 
	a#pr02:hover { border: solid 2px #B8443A;
}
a#pr03 { 
	background-image: url(../images/showcase.jpg);
	background-position: -228px -174px;} 
	a#pr03:hover { border: solid 2px #B8443A;
}
a#pr04 { 
	background-image: url(../images/showcase.jpg);
	background-position: -342px -174px;} 
	a#pr04:hover { border: solid 2px #B8443A;
}
a#pr05 { 
	background-image: url(../images/showcase.jpg);
	background-position: -456px -174px;} 
	a#pr05:hover { border: solid 2px #B8443A;
}
a#pr06 { 
	background-image: url(../images/showcase.jpg);
	background-position: -570px -174px;} 
	a#pr06:hover { border: solid 2px #B8443A;
}

/*-- Digitale vormgeving => Photoshop --*/
a#p01 { 
	background-image: url(../images/showcase.jpg);
	background-position: 0px -262px;} 
	a#p01:hover { border: solid 2px #B8443A;
}
a#p02 { 
	background-image: url(../images/showcase.jpg);
	background-position: -114px -262px;} 
	a#p02:hover { border: solid 2px #B8443A;
}
a#p03 { 
	background-image: url(../images/showcase.jpg);
	background-position: -228px -262px;} 
	a#p03:hover { border: solid 2px #B8443A;
}
a#p04 { 
	background-image: url(../images/showcase.jpg);
	background-position: -342px -262px;} 
	a#p04:hover { border: solid 2px #B8443A; 
}
a#p05 { 
	background-image: url(../images/showcase.jpg);
	background-position: -456px -262px;} 
	a#p05:hover { border: solid 2px #B8443A; 
}
a#p06 { 
	background-image: url(../images/showcase.jpg);
	background-position: -570px -262px;} 
	a#p06:hover { border: solid 2px #B8443A; 
}

/*-- Analoge vormgeving => Illustrator --*/
a#i01 { 
	background-image: url(../images/showcase.jpg);
	background-position: 0px -348px;} 
	a#i01:hover { border: solid 2px #B8443A;
}
a#i02 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -114px -348px;} 
	a#i02:hover { border: solid 2px #B8443A;
}
a#i03 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -228px -348px;} 
	a#i03:hover { border: solid 2px #B8443A;
}
a#i04 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -342px -348px;} 
	a#i04:hover { border: solid 2px #B8443A;
}
a#i05 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -456px -348px;} 
	a#i05:hover { border: solid 2px #B8443A;
}
/*-- 3D beelden => Cinema 4D --*/
a#c01 { 
	background-image: url(../images/showcase.jpg);
	background-position: 0px -436px;} 
	a#c01:hover { border: solid 2px #B8443A;
}
a#c02 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -114px -436px;} 
	a#c02:hover { border: solid 2px #B8443A;
}
a#c03 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -228px -436px;} 
	a#c03:hover { border: solid 2px #B8443A;
}
a#c04 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -342px -436px;} 
	a#c04:hover { border: solid 2px #B8443A;
}
a#c05 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -456px -436px;} 
	a#c05:hover { border: solid 2px #B8443A;
}
a#c06 { 
	background-image: url(../images/showcase.jpg); 
	background-position: -570px -436px;} 
	a#c06:hover { border: solid 2px #B8443A;
}

/*--------------- Eigen werk ---------------*/
a#e01 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: 0px 0px;} 
	a#e01:hover { border: solid 2px #B8443A;
}
a#e02 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: -114px 0px;} 
	a#e02:hover { border: solid 2px #B8443A;
}
a#e03 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: -228px 0px;} 
	a#e03:hover { border: solid 2px #B8443A;
}
a#e04 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: -342px 0px;} 
	a#e04:hover { border: solid 2px #B8443A;
}
a#e05 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: -456px 0px;} 
	a#e05:hover { border: solid 2px #B8443A;
}
a#e06 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: -570px 0px;} 
	a#e06:hover { border: solid 2px #B8443A;
}
a#e07 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: 0px -87px;} 
	a#e07:hover { border: solid 2px #B8443A;
}
a#e08 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: -114px -87px;} 
	a#e08:hover { border: solid 2px #B8443A; 
}
a#e09 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: -228px -87px;} 
	a#e09:hover { border: solid 2px #B8443A;
}
a#e010 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: -342px -87px;} 
	a#e010:hover { border: solid 2px #B8443A;
}
a#e011 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: -456px -87px;} 
	a#e011:hover { border: solid 2px #B8443A;
}
a#e012 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: -570px -87px;} 
	a#e012:hover { border: solid 2px #B8443A;
}
a#e013 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: 0px -174px;} 
	a#e013:hover { border: solid 2px #B8443A;
}
a#e014 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: -114px -174px;} 
	a#e014:hover { border: solid 2px #B8443A;
}
a#e015 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: -228px -174px;} 
	a#e015:hover { border: solid 2px #B8443A;
}
a#e016 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: -342px -174px;} 
	a#e016:hover { border: solid 2px #B8443A;
}
a#e017 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: -456px -174px;} 
	a#e017:hover { border: solid 2px #B8443A;
}
a#e018 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: -570px -174px;} 
	a#e018:hover { border: solid 2px #B8443A;
}
a#e019 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: 0px -262px;} 
	a#e019:hover { border: solid 2px #B8443A;
}
a#e020 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: -114px -262px;} 
	a#e020:hover { border: solid 2px #B8443A;
}
a#e021 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: -228px -262px;} 
	a#e021:hover { border: solid 2px #B8443A;
}
a#e022 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: -342px -262px;} 
	a#e022:hover { border: solid 2px #B8443A;
}
a#e023 { 
	background-image: url(../images/eigen/eigen_werk.jpg);
	background-position: -456px -262px;} 
	a#e023:hover { border: solid 2px #B8443A;
}