html, body{
width:100%;
height:100%;	
}

@font-face {
	font-family: 'VegurRegular';
	src: url('../vegur-r_0500-webfont.eot');
	src: local('Vegur'), local('Vegur-Regulars'), url('../vegur-r_0500-webfont.woff') format('woff'), url('../vegur-r_0500-webfont.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

body{
width:100%;
height:100%;
background: #E8E8E8 url('../media/body_bg.gif') left top repeat-x;	
text-align:center; 			/*Om te zorgen dat #wrapper wordt gecentreerd in IE6*/
}

div, li, a, dl{border:0px solid gray;}



/*-----------------------------------------------*/
/*--------------  General Styles  ---------------*/
/*-----------------------------------------------*/

body{
font-size:62.5%;
font-family:Verdana, Arial, Times, Times new roman, Serif;
}

h1,h2,h3,h4,h5,h6{
color:	#666;
font-size:1.8em;
margin:0 0 0em 0;
}

h1{
font-size:26px;
font-family:'Vegur', 'Vegur-Regular', Verdana, Sans-Serif;
color:white;
max-width:350px;
font-weight:normal;
}

h2{
margin:0 0 0 0;
font-size:1.0em;
font-size:18px;		
text-transform:lowercase;
}



h3{
color:#09A8DC;
font-size:20px;
line-height:40px;
font-family:'Vegur', 'VegurRegular', Verdana;
}

p,ul{
font-family:Verdana, Arial, Sans-Serif; 
color:#666;	
font-size:12px;
line-height:20px;
margin:0 0 20px 0;
}


dt{font-weight:bold;}

li a, dl a{
font-size:100%;	

}

p a {
font-size:100%;	
}

a{
color:#09A8DC;
text-decoration:none;
}

a:hover{
text-decoration:underline;
}
	
li a{
text-decoration:none;
}

a:hover {
	color: #09A8DC
}


#navigation li a:hover, #navigation .active{
color:#ff9f1c;
background: url('../media/bullet.gif') left .1em no-repeat;
position:relative;
left:-20px;
padding-left:20px;
}

#navigation li span{
position:relative;
left:-20px;	
}

.active{

}



/*-----------------------------------------------*/
/*-----------------  Structuur  -----------------*/
/*-----------------------------------------------*/

#superwrap{
width:996px;
position:absolute;
height:100%;
margin-left:50%;
left:-498px;				/*Min height hack, zie http://www.dustindiaz.com/min-height-fast-hack/ 							*/	
background:white url('../media/head.jpg') right top no-repeat;
}

.standard #superwrap{
background:white url('../media/headkort.jpg') right top no-repeat;
}

#wrapper{
text-align:left;			/*Om de vorige IE6 hack op te heffen */
margin:0 auto;				/*Om te zorgen dat #wrapper wordt gecentreerd in moderne browsers*/
background: url('../media/gradient_bg.jpg') center top no-repeat;
position:relative;

min-height:100%;			/*Om te zorgen dat #wrapper minstens de hoogte neemt van het hele venster in moderne browsers	*/
height:auto !important;		/*Min height hack, zie http://www.dustindiaz.com/min-height-fast-hack/ 							*/
height:100%;				/*Min height hack, zie http://www.dustindiaz.com/min-height-fast-hack/ 							*/				
}

#content{
overflow:hidden;
position:relative;
margin:0 auto;
width:996px;
padding-bottom:56px;
}

#header{
width:996px;
margin:0 auto;
position:relative;
background: url('../media/nav_bg.jpg') right top repeat-x;
}

#supernav{
height:76px;
float:right;
right:0;					/*Op deze manier wordt de navigatie naar rechts uitgeleind	*/
bottom:0;					/*Op deze manier wordt de navigatie naar beneden uitgeleind	*/
}

#splash{
background:#216AAA url('../media/splash_bg.jpg') left top no-repeat;	
height:233px;
clear:both;
padding:56px 76px;
position:relative;
}

#splash img,
#splash h1{
margin-bottom:36px;	
}

.standard #splash{
height:36px;	
}

#inside>div a:hover{text-decoration:none;}
#inside .item a:hover{text-decoration:underline;}

#splash p{
font-family:'Vegur', 'VegurRegular', Verdana;
font-weight:200;
font-size:27px;
max-width:575px;
line-height:33px;
color:#D1F2FF;
text-indent:-9999px;
min-width:573px;
min-height:59px;
background: url('../media/splash_text_nl.png') left top no-repeat;
}

#product{
position:absolute;	
top:120px;
left:50%;
margin-left:70px;
z-index:2;
}

#koponder{
padding:0 76px;
background: url('../media/onderkop_bg.jpg')	left top;
min-height:167px;
}

#koponder ul{
float:left;
margin-top:44px;	
}

#koponder ul li{
font-size:14px;
margin:0 0 14px -40px;
min-width:308px;
padding-left:40px;
float:left;
}

#button{
float:left;
margin:70px 0 0 40px;
width:164px;
height:37px;
line-height:37px;
background: #349ED5 url('../media/button_off.jpg') left center repeat-x;
box-shadow: 0px 0px 10px #aaa;
-moz-box-shadow: 0px 0px 10px #aaa;
-webkit-box-shadow: 0px 0px 10px #aaa;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px; /* future proofing */
text-align:center;
font-family:'Vegur', 'VegurRegular', Verdana;
font-weight:700;
text-transform: uppercase;
font-size:18px;
letter-spacing:0.05em;
}

#button:hover{
background-image: url('../media/button_on.jpg');
}

#button a{
color:white;
display:block;
text-shadow: -1px -1px 0px #207AAF;
}

#button a:hover{
text-decoration:none;	
}

li.pagina		{background: url('../media/16_finished-work.png') left center no-repeat;}
li.gebruikers	{background: url('../media/16_user.png') left center no-repeat;}
li.bestanden	{background: url('../media/16_photography.png') left center no-repeat; clear:left;}
li.taal			{background: url('../media/16_taal.png') left center no-repeat; clear:left;}
li.backup		{background: url('../media/16_networking.png') left center no-repeat; }
li.opmaat		{background: url('../media/16_product.png') left center no-repeat; }

* html #supernav{
background: url('../media/supernav_bg_ie.jpg') left top no-repeat;		
}									/*Op deze gebruikt IE6 en lager geen pngplaatje, maar een jpg-plaatje	*/

* + html #supernav{
background: url('../media/supernav_bg_ie.jpg') right top no-repeat;	
}									/*Op deze gebruikt IE7 geen pngplaatje, maar een jpg-plaatje	*/

#supernav{
float:right;
margin:0 24px 0 0;
}

#supernav li{
position:relative;
float:left;
padding-right:18px;
}

#supernav a{	
display:block;
text-indent:-9999px;
width:100%;
height:100%;
}

#inside{
background: white url('../media/shadow_bg.jpg') center top no-repeat;	
padding: 52px 76px 26px 76px;
overflow:hidden;
min-height:100%;			/*Om te zorgen dat #wrapper minstens de hoogte neemt van het hele venster in moderne browsers	*/
height:auto !important;		/*Min height hack, zie http://www.dustindiaz.com/min-height-fast-hack/ 							*/
height:100%;				/*Min height hack, zie http://www.dustindiaz.com/min-height-fast-hack/ 							*/	
}

#inside h2{
margin-bottom:0;
}

.hr{
width:997px;
height:46px;
margin:0 0 0 -76px;
padding:28px 0;
background: url('../media/hr_bg.gif') left center no-repeat;
clear:both;
position:relative;
}

div.item{
width:230px;
float:left;	
margin-right:76px;
}

.item.mainsite_gebruikers,
.item.mainsite_opmaat,
.item.IEextrainfo
{
margin-right:0;
}

.IElite{
clear:left;	
float:left;
}

.item.tweebreed{width:538px;}
.item.driebreed{width:844px;}

.mainsite_IE_lite p{
float:left;
margin-right:76px;	
width:230px;
}

.mainsite_IE_lite p+p+p{
margin-right:0;
}

.mainsite_IE_lite{
clear:left;
}

.IElite+h3{
margin-left:307px;
padding-top:32px;	
}

.mainsite_paginastoevoegen h3		{background: url('../media/finished-work.png') left center no-repeat; margin-left:-44px; padding-left:44px;}
.mainsite_gebruikers h3				{background: url('../media/user.png') left center no-repeat; margin-left:-44px; padding-left:44px;}
.mainsite_bestandenbeheren h3		{background: url('../media/photography.png') left center no-repeat; clear:left; margin-left:-44px; padding-left:44px;}
.mainsite_taalonafhankelijk h3		{background: url('../media/taal.png') left center no-repeat; clear:left; margin-left:-44px; padding-left:44px;}
.mainsite_backup h3					{background: url('../media/networking.png') left center no-repeat; margin-left:-44px; padding-left:44px;}
.mainsite_opmaat h3					{background: url('../media/product.png') left center no-repeat; margin-left:-44px; padding-left:44px;}
.mainsite_taalonafhankelijk h3		{background: url('../media/multiple_languages.png') left center no-repeat;  margin-left:-44px; padding-left:44px;}


li#nav_mainsite_home						{width:52px; height:55px; }
li#nav_mainsite_home	a					{background: 	url('../media/supernav_home.png')		no-repeat left bottom;}

li#nav_mainsite_functionaliteiten			{width:148px; height:55px;}
li#nav_mainsite_functionaliteiten	a		{background: 	url('../media/supernav_functionaliteiten.png') 		left bottom no-repeat;}

li#nav_mainsite_documentatie				{width:125px; height:55px; }
li#nav_mainsite_documentatie	a			{background: url('../media/supernav_documentatie.png') 		left bottom no-repeat;}

li#nav_mainsite_dealers						{width:64px; height:55px;}
li#nav_mainsite_dealers a					{background: url('../media/supernav_dealers.png') 	left bottom no-repeat;}

li#nav_mainsite_nieuws						{width:64px; height:55px;}
li#nav_mainsite_nieuws a					{background: url('../media/supernav_nieuws.png') 	left bottom no-repeat;}

#subnav{
float:right;	
width:231px;
margin-top:20px;
}

.standard #inside h3,
.standard #inside p{
width:538px;	
}

#nav_mainsite_home					a:hover,	
#nav_mainsite_functionaliteiten		a:hover,		
#nav_mainsite_documentatie			a:hover,
#nav_mainsite_dealers				a:hover,
#nav_mainsite_nieuws				a:hover,
#supernav .active a
{background-position:right bottom;}

#footer{
clear:both;
background: #E8E8E8  url('../media/footerbg.png') left top no-repeat;
height:62px;
bottom:0;
position:absolute;
width:996px;
bottom:0;
margin-left:50%;
left:-498px
}

/* ------------- ----------------------------------------------- ------------------ */
/* ------------- These are standard sIFR styles... do not modify ------------------ */
/* ------------- ----------------------------------------------- ------------------ */

.sIFR-flash {visibility: visible !important; margin: 0;}
.sIFR-replaced {visibility: visible !important;}
span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash h1 {
	visibility: hidden;
	font-size: 36px;
}
