/* CSS Document */

body
{
margin:0;
background-image:url(background.jpg);
background-repeat:no-repeat;
background-position:top center;
background-color:#000000;
font-size: 62.5%;
line-height:1.9em;
}

div#main_container{
margin:0px auto 0px auto;
width: 1024px !important;
width: 1024px;
height:3095px;
}

#header
{
background-image:url(images/header.jpg);
background-repeat:no-repeat;
width:1024px;
height:214px;
position:relative;

}

#headertekst
{
padding-top:198px;
padding-left:728px;
position:relative;
color:#006699;
font-size:1.1em;
font-family:Arial, Helvetica, sans-serif;
}

#headertekst a, a:link, a:active, a:visited
{
color:#006699;
font-size:1em;
font-family:Arial, Helvetica, sans-serif;
text-decoration:none;
font-variant:normal;
letter-spacing:normal;
}

#headertekst a:hover
{
color:#006699;
font-size:1em;
font-family:Arial, Helvetica, sans-serif;
text-decoration:underline;
font-variant:normal;
letter-spacing:normal;
}

#onderheader
{
width:1024px;
height:50px;
position:relative;
}

#ondermenu
{
width:1024px;
height:224px;
position:relative;
}

#linksmenu
{
background-image:url(images/linksmenu.jpg);
background-repeat:no-repeat;
position:relative;
width:290px;
height:50px;
float:left;
display:inline;
}

#rechtsmenu
{
background-image:url(images/rechtsmenu.jpg);
background-repeat:no-repeat;
position:relative;
width:59px;
height:50px;
float:left;
display:inline;
}

/*KNOPPEN INDEXPAGINA */

/*HOME ACTIEF */

#home_wrapper
{
position:relative;
float:left;
width:120px;
height:50px;
background-image:url(images/home.jpg);
display:inline;
}
#index_home
{
display:block;
width: 120px; 
height: 50px; 
background: url("images/home.jpg") no-repeat 0 0; 
 } 
 
#index_home:hover { 
background: url("images/home.jpg") no-repeat 0 0;
/*background-position: 0 -36px; */
} 

#home
{
display:block;
width:120px;
height:50px;
background: url("images/home.jpg") no-repeat 0 0;
}

#home span.hover
{
display:block;
width:120px;
height:50px;
background: url("images/home_over.jpg") no-repeat 0 0;
}

/* =============== */

/*WEBDESIGN ACTIEF */
#webdesign_wrapper
{
position:relative;
float:left;
width:135px;
height:50px;
background-image:url(images/webdesign.jpg);
display:inline;

}

#index_webdesign
{
display:block;
width: 135px; 
height: 50px; 
background: url("images/webdesign.jpg") no-repeat 0 0; 
 } 
 
#index_webdesign:hover { 
background: url("images/webdesign_over.jpg") no-repeat 0 0;
/*background-position: 0 -36px; */
} 

#webdesign
{
display:block;
width:135px;
height:50px;
background: url("images/webdesign.jpg") no-repeat 0 0;
}

#webdesign span.hover
{
display:block;
width:135px;
height:50px;
background: url("images/webdesign_over.jpg") no-repeat 0 0;
}

/* =============== */

/*GRAFISCH ACTIEF */
#grafisch_wrapper
{
position:relative;
float:left;
width:165px;
height:50px;
background-image:url(images/grafisch.jpg);
display:inline;
}
#index_grafisch
{
display:block;
width: 165px; 
height: 50px; 
background: url("images/grafisch.jpg") no-repeat 0 0; 
 } 
 
#index_grafisch:hover { 
background: url("images/grafisch.jpg") no-repeat 0 0;
/*background-position: 0 -36px; */
} 

#grafisch
{
display:block;
width:165px;
height:50px;
background: url("images/grafisch.jpg") no-repeat 0 0;
}

#grafisch span.hover
{
display:block;
width:165px;
height:50px;
background: url("images/grafisch_over.jpg") no-repeat 0 0;
}


/* =============== */

/*PORTFOLIO ACTIEF */

#portfolio_wrapper
{
position:relative;
float:left;
width:129px;
height:50px;
background-image:url(images/portfolio.jpg);
display:inline;
}
#index_portfolio
{
display:block;
width: 129px; 
height: 50px; 
background: url("images/portfolio.jpg") no-repeat 0 0; 
 } 
 
#index_portfolio:hover { 
background: url("images/portfolio.jpg") no-repeat 0 0;
/*background-position: 0 -36px; */
} 

#portfolio
{
display:block;
width:129px;
height:50px;
background: url("images/portfolio.jpg") no-repeat 0 0;
}

#portfolio span.hover
{
display:block;
width:129px;
height:50px;
background: url("images/portfolio_over.jpg") no-repeat 0 0;
}

#menubalk
{
background-image:url(images/menubalk.jpg);
background-repeat:no-repeat;
position:relative;
width:2px;
height:50px;
float:left;
display:inline;
}

/*CONTACT ACTIEF */
#contact_wrapper
{
position:relative;
float:left;
width:124px;
height:50px;
background-image:url(images/contactknop.jpg);
display:inline;
}
#index_contact
{
display:block;
width: 124px; 
height: 50px; 
background: url("images/contactknop.jpg") no-repeat 0 0; 
 } 
 
#index_contact:hover { 
background: url("images/contactknop.jpg") no-repeat 0 0;
/*background-position: 0 -36px; */
} 

#contact
{
display:block;
width:124px;
height:50px;
background: url("images/contactknop.jpg") no-repeat 0 0;
}

#contact span.hover
{
display:block;
width:124px;
height:50px;
background: url("images/contactknop_over.jpg") no-repeat 0 0;
}

#webtekst
{
background-image:url(images/webtekst.jpg);
background-repeat:no-repeat;
position:relative;
width:290px;
height:224px;
float:left;
display:inline;
}

#slidervak
{
width:675px;
height:224px;
position:relative;
float:left;
padding:0 0 0 0;
margin: 0 0 0 0;
display:inline;
}

#rechtsslider
{
background-image:url(images/rechtsslider.jpg);
background-repeat:no-repeat;
position:relative;
width:59px;
height:224px;
float:left;
display:inline;
}


#keywords
{
background-image:url(images/keywords.jpg);
background-repeat:no-repeat;
width:1024px;
height:46px;
position:relative;

}

#overons
{
width:1024px;
height:222px;
position:relative;
}

#linksoverons
{
background-image:url(images/links_over_ons.jpg);
background-repeat:no-repeat;
width:217px;
height:222px;
position:relative;
float:left;
display:inline;
}

#overonsvak
{
background-image:url(images/over_ons.jpg);
background-repeat:no-repeat;
width:485px;
height:222px;
position:relative;
float:left;
display:inline;
}

#overonsvak_tekst
{
position:relative;
width:350px;
margin-top:90px;
padding-left:25px;
font-size:12px;
line-height:18px;
font-family:Arial, Helvetica, sans-serif;
color:#FFFFFF;
word-spacing:2px;
font-weight:bold;
text-shadow:0px 1px 1px #0f4870;
}

.vetgedrukt
{
font-weight:bold;
}

.onderlijnd
{
text-decoration:underline;
}

.gemarkeerd
{
color:#66CCFF;
font-size:14px;
}

#rechtsoverons
{
background-image:url(images/rechts_over_ons.jpg);
background-repeat:no-repeat;
width:322px;
height:222px;
position:relative;
float:left;
display:inline;
}

#webdesignstuk
{
width:1024px;
height:444px;
position:relative;
}

#linkswebdesignstuk
{
background-image:url(images/links_webdesign.jpg);
background-repeat:no-repeat;
width:217px;
height:444px;
position:relative;
float:left;
display:inline;
}

#webdesignvak
{
background-image:url(images/webdesign-19.jpg);
background-repeat:no-repeat;
width:543px;
height:444px;
position:relative;
float:left;
display:inline;
}

#webdesignvak_tekst
{
position:relative;
width:510px;
margin-top:90px;
padding-left:25px;
font-size:12px;
line-height:18px;
font-family:Arial, Helvetica, sans-serif;
color:#FFFFFF;
word-spacing:2px;
font-weight:bold;
text-shadow:0px 1px 1px #0f4870;
}

.diensten
{
font-size:14px;
color:#c2fa17;
}

.slogan
{
font-size:14px;
}

#webdesignvak_tekst h2
{
font-size:22px;
font-weight:normal;
}

#webdesignvak_tekst li
{
list-style-image:url(vinkje.png);
padding-bottom:10px;
padding-left:5px;
margin-left:30px;
font-size:16px;
}

#webdesignvak_tekst li a, a:visited, a:link
{
color:#33CCFF;
}

#webdesignvak_tekst li a:hover
{
color:#3399CC;
}

#rechtswebdesignstuk
{
background-image:url(images/rechts_webdesign.jpg);
background-repeat:no-repeat;
width:264px;
height:444px;
position:relative;
float:left;
display:inline;
}

#grafischstuk
{
width:1024px;
height:290px;
position:relative;
}

#linksgrafischstuk
{
background-image:url(images/links_grafisch_design.jpg);
background-repeat:no-repeat;
width:217px;
height:290px;
position:relative;
float:left;
display:inline;
}

#grafischvak
{
background-image:url(images/grafisch_design.jpg);
background-repeat:no-repeat;
width:592px;
height:290px;
position:relative;
float:left;
display:inline;
}

#grafischvak_tekst
{
position:relative;
width:510px;
margin-top:90px;
padding-left:25px;
font-size:12px;
line-height:18px;
font-family:Arial, Helvetica, sans-serif;
color:#FFFFFF;
word-spacing:2px;
font-weight:bold;
text-shadow:0px 1px 1px #0f4870;
}


#rechtsgrafischstuk
{
background-image:url(images/rechts_grafisch_design.jpg);
background-repeat:no-repeat;
width:215px;
height:290px;
position:relative;
float:left;
display:inline;
}

#realisatiestuk
{
width:1024px;
height:394px;
position:relative;
}

#linksrealisatiestuk
{
background-image:url(images/links_realisaties.jpg);
background-repeat:no-repeat;
width:150px;
height:394px;
position:relative;
float:left;
display:inline;
}

#realisatievak
{
background-image:url(images/realisaties.jpg);
background-repeat:no-repeat;
width:635px;
height:394px;
position:relative;
float:left;
display:inline;
}

#realisatietekst
{
font-size:1.2em;
color:#FFFFFF;
font-family:Arial, Helvetica, sans-serif;
}

#rechtsrealisatiestuk
{
background-image:url(images/rechts_realisaties.jpg);
background-repeat:no-repeat;
width:238px;
height:394px;
position:relative;
float:left;
display:inline;
}

#rechtslijnrealisatie
{
background-image:url(images/INDEX2_26.jpg);
background-repeat:no-repeat;
width:1px;
height:394px;
position:relative;
float:left;
display:inline;
}

#contactstuk
{
width:1024px;
height:304px;
position:relative;
}

#linkscontactstuk
{
background-image:url(images/links_contact.jpg);
background-repeat:no-repeat;
width:63px;
height:304px;
position:relative;
float:left;
display:inline;
}

#contactvak
{
background-image:url(images/contact.jpg);
background-repeat:no-repeat;
width:430px;
height:304px;
position:relative;
float:left;
display:inline;
}

#rechtscontactstuk
{
background-image:url(images/rechts_contact.jpg);
background-repeat:no-repeat;
width:445px;
height:304px;
position:relative;
float:left;
display:inline;
}

#player
{
background-image:url(images/player.jpg);
background-repeat:no-repeat;
width:86px;
height:304px;
position:relative;
float:left;
display:inline;
}

#footerstuk
{
width:1024px;
height:67px;
position:relative;
}

#footer
{
background-image:url(images/footer.jpg);
width:1023px;
background-repeat:no-repeat;
height:67px;
position:relative;
float:left;
display:inline;
}

#rechtsfooter
{
background-image:url(images/INDEX2_32.jpg);
background-repeat:no-repeat;
width:1px;
height:67px;
position:relative;
float:left;
display:inline;
}

#footertekst
{
width:800px;
height:auto;
padding-left:130px;
padding-top:19px;
color:#98e6fd;
font-family:Arial, Helvetica, sans-serif;
font-size:1.1em;
}

#over_ons_dive
{
position:relative;
float:left;
margin-left:168px;
margin-top:25px;
width:64px;
height:45px;
display:inline;
}

#webdesign_dive
{
position:relative;
float:left;
margin-left:192px;
margin-top:20px;
width:64px;
height:45px;
display:inline;
}

#grafisch_dive
{
position:relative;
float:left;
margin-left:260px;
margin-top:24px;
width:64px;
height:45px;
display:inline;
}

#realisatie_dive
{
position:relative;
float:left;
margin-left:348px;
margin-top:24px;
width:64px;
height:45px;
display:inline;
}

#webmail_dive
{
position:relative;
float:left;
margin-left:295px;
margin-top:28px;
width:64px;
height:45px;
display:inline;
}

.fieldHolder
{
	width: 256px;
	height: 36px;
	background: url(textfield.png) no-repeat;
	float: left;
	margin-top:60px;
	margin-left:125px;
	display:inline;
}

.fieldHolder2
{
	width: 256px;
	height: 36px;
	background: url(textfield.png) no-repeat;
	float: left;
	margin-top:10px;
	margin-left:125px;
	display:inline;
}

.fieldHolder3
{
	width: 251px;
	height: 76px;
	background: url(textarea.png) no-repeat;
	float: left;
	margin-top:10px;
	margin-left:125px;
	display:inline;
}

.contact_tekst
{
margin-left:244px;
height:23px;
width:234px;
border:none;
margin-top:5px;
margin-left:8px;
background:none;
position:relative;
color:#FFFFFF;
font-family:Arial, Helvetica, sans-serif;
font-size:1.2em;
font-weight:bold;
}

.contact_tekst2
{
margin-left:244px;
height:23px;
width:234px;
border:none;
margin-top:5px;
margin-left:8px;
background:none;
position:relative;
color:#FFFFFF;
font-size:1.2em;
font-weight:bold;
font-family:Arial, Helvetica, sans-serif;
}

.contact_tekst3
{
margin-left:244px;
height:53px;
width:234px;
border:none;
margin-top:8px;
margin-left:8px;
background:none;
position:relative;
color:#FFFFFF;
font-size:1.2em;
font-weight:bold;
font-family:Arial, Helvetica, sans-serif;
overflow:auto;
}

#graphicgallery_wrapper
{
margin-left:120px;
margin-top:37px;
position:relative;
float:left;
width:316px;
height:59px;
background-image:url(graphicgallery.png);
display:inline;
}

#index_graphicgallery
{
display:block;
width:316px;
height:59px; 
background: url("graphicgallery.png") no-repeat 0 0; 
 } 
 
#index_graphicgallery:hover { 
background: url("graphicgallery.png") no-repeat 0 0;
/*background-position: 0 -36px; */
} 

#graphicgallery
{
display:block;
width:316px;
height:59px;
background: url("graphicgallery.png") no-repeat 0 0;
}

#graphicgallery span.hover
{
display:block;
width:316px;
height:59px;
background: url("graphicgallery_over.png") no-repeat 0 0;
}


#bovenwebmailstuk
{
width:1024px;
height:267px;
position:relative;
background-repeat:no-repeat;
background-image:url(images/boven_webmail.jpg);
}

#bovenwebmailtekst
{
padding-left:750px;
padding-top:150px;
position:relative;
}

#webmailstuk
{
width:1024px;
height:345px;
position:relative;
}

#linkswebmail
{
background-image:url(images/links_webmail.jpg);
background-repeat:no-repeat;
width:331px;
height:345px;
position:relative;
float:left;
display:inline;
}

#webmail
{
background-image:url(images/webmail.jpg);
background-repeat:no-repeat;
width:488px;
height:345px;
position:relative;
float:left;
display:inline;
}

#webmailtekst
{
margin-left:244px;
height:23px;
width:234px;
border:none;
margin-top:5px;
margin-left:8px;
background:none;
position:relative;
color:#FFFFFF;
font-family:Arial, Helvetica, sans-serif;
font-size:1.2em;
font-weight:bold;
}

#rechtswebmail
{
background-image:url(images/rechts_webmail.jpg);
background-repeat:no-repeat;
width:204px;
height:345px;
position:relative;
float:left;
display:inline;
}

#onderwebmail
{
background-image:url(images/onder_webmail.jpg);
background-repeat:no-repeat;
width:1024px;
height:228px;
position:relative;
}

.fieldHolder4
{
	width: 256px;
	height: 36px;
	background: url(textfield_green.png) no-repeat;
	float: left;
	margin-top:32px;
	margin-left:180px;
	display:inline;
}

.fieldHolder5
{
	width: 256px;
	height: 36px;
	background: url(textfield_green.png) no-repeat;
	float: left;
	margin-top:8px;
	margin-left:180px;
	display:inline;
}

.webmail_tekst
{
margin-left:444px;
height:23px;
width:250px;
border:none;
margin-top:5px;
margin-left:8px;
background:none;
position:relative;
color:#666600;
font-size:1.2em;
font-family:Arial, Helvetica, sans-serif;
font-weight:bold;
}

.webmail_tekst2
{
margin-left:444px;
height:23px;
width:250px;
border:none;
margin-top:5px;
margin-left:8px;
background:none;
position:relative;
color:#666600;
font-size:1.2em;
font-family:Arial, Helvetica, sans-serif;
font-weight:bold;
}

.jdesigns
{
font-variant:small-caps;
}


#message a
{
	/* display: block before hiding */
	display: block;
	display: none;
 
	/* link is above all other elements */
	z-index: 999; 
 
	/* link doesn't hide text behind it */
	opacity: .8;
 
	/* link stays at same place on page */
	position: fixed;
 
	/* link goes at the bottom of the page */
	top: 100%;
	margin-top: -80px; /* = height + preferred bottom margin */
 
	/* link is centered */
	left: 50%;
	margin-left: -160px; /* = half of width */
 
	/* round the corners (to your preference) */
	-moz-border-radius: 24px;
	-webkit-border-radius: 24px;
 
	/* make it big and easy to see (size, style to preferences) */
	width: 300px;
	line-height: 48px;
	height: 48px;
	padding: 10px;
	background-color: #000;
	font-size: 24px;
	text-align: center;
	color: #fff;
}

.webmailinvisible
{
	top:-500px;
	position:absolute;
}