﻿@media screen
{
    html,body
    {
        margin: 0;
        padding: 0;
        background: #cccccc url('../img/html_bg.gif') repeat-x;
        font: 11px Verdana, Arial, Helvetica, sans-serif;
        color: #333333;
        line-height: 18px!important;
    }

    td
    {
        font: 11px Verdana, Arial, Helvetica, sans-serif;
        color: #333333;
        line-height: 12px;
    }

    h2
    {
		font-weight: bold;
    }
    
    a:link
    {
        font: 11px Verdana, Arial, Helvetica, sans-serif;
        color: #000000;
    }
    
    a:visited
    {
        font: 11px Verdana, Arial, Helvetica, sans-serif;
        color: #000000;
    }
    
    a:hover
    {
        font: 11px Verdana, Arial, Helvetica, sans-serif;
        color: #000000;
        text-decoration: none;
    }
    
    h1
    {
        font: bold 18px Verdana, Arial, Helvetica, sans-serif;
        color: #555555;
        margin: 0;
        padding: 2px 0 2px 0;
        width: 730px;
        text-align: center;
        display: block; 

        background: #d1d1d1;
    }
    
    h2
    {
        font: bold 16px Verdana, Arial, Helvetica, sans-serif;
        color: #555555;
        margin: 0 0 10px 0;
        padding: 0;
		display: block;
		clear: both;
		*width: 400px;
		text-align: left;   
    }
        
    h3
    {
        font: 14px Verdana, Arial, Helvetica, sans-serif;
        color: #0026FF;
        line-height: 10px;

        margin: 15px 0 15px 0;
    }
    img
    {
        border: 0px;
    }

    p
    {
        margin: 10px 0;
    }

    .print
    {
        display: none;
    }

    ul
    {
        margin-top: 5px;
        margin-bottom: 5px;
    }

    .wrapper
    {
        margin: 0 auto;
        width: 980px;
        text-align: center;
        background: #ffffff;
        display: table;
        
    }

    .containerNav
    {
        float: left;
        width: 980px;
        position: relative;
    }
    
    .container_spacer
    {
        float: left;
        width: 980px;
        height: 35px;
        background: #ffffff;
    }
    
    .container
    {
        float: left;
        background: #ffffff url(../img/bg_container.gif);
        z-index: 1;
    }
    
    .containerMain a{
        font: 12px Verdana, Arial, Helvetica, sans-serif;
    }
    
    .containerMain
    {
        margin: 0;
        padding: 0 0 0 10px;
        width: 740px;
        text-align: left;
        position: relative;
        line-height: 17px!important;
        float: left;
        font: 12px Verdana, Arial, Helvetica, sans-serif;
        min-height: 400px;
    }

    .containerRight
    {
        margin: 0;
        width: 211px;
        float: left;
        background: #eeeeee;
        padding: 0 0 0 19px;
    }

    .footer
    {
        float: left;
        width: 960px;
        padding: 10px;
        background: #ffffff;
        text-align: left;
        color: #555555;
        border-top: 2px solid #777777;
    }
    
    .footer a
    {
        color: #555555;
    }
    
    .header
    {
        float: left;
        width: 980px;
        position: relative;
        background: url(../img/html_bg.gif) left top repeat-x;
       
        z-index: 2;
        height: 180px;
    }	
    
    ul.menu
	{
		list-style: none;
		margin: 0;
		padding: 0;
		width: 980px;
		height: 40px;
		top: 1px;
		*top: 3px;
		position: relative;
	}

	ul.menu li
	{
		padding: 0;
		margin: 0;
		float: left;
		position: relative;
	}

	ul.menu li a
	{
		margin: 0;
		display: block;
		height: 40px;
		float: left;
		
		color: #565656 !important;
		background-image: url(../img/nav.gif);
	}
	
	ul.menu li a span
	{
		display: none;	
	}

	.nav-home a
	{
		background-position: left top;
		width: 96px;
	}
	.nav-abonnementen a
	{
		background-position: -96px bottom;
		width: 227px;
	}
	.nav-faq a
	{
		background-position: -323px top;
		width: 286px;
	}
	.nav-bedrijfsinfo a
	{
		background-position: -609px top;
		width: 250px;
	}
	.nav-contact a
	{
		background-position: -859px top;
		width: 121px;
	}
	
		.nav-home a:hover
	{
		background-position: left bottom;
		width: 96px;
	}
	.nav-abonnementen a:hover
	{
		background-position: -96px bottom;
		width: 227px;
	}
	.nav-faq a:hover
	{
		background-position: -323px bottom;
		width: 286px;
	}
	.nav-bedrijfsinfo a:hover
	{
		background-position: -609px bottom;
		width: 250px;
	}
	.nav-contact a:hover
	{
		background-position: -859px bottom;
		width: 121px;
	}
	
	
	ul.menu ul
	{
		display: none;	
		position: absolute;
		z-index: 9999;
		top: 35px;
		list-style: none;
		left: 0;
		*left: -40px;
		padding:  0 0 14px 0;
		height: auto;
		background:  url(../img/subnavbot.gif) left bottom no-repeat;
	}
	
	.bottommenu
	{
			padding: 0 0 0 0;
			margin: 0;
			float: left;
			width: 980px;
			clear: both;
			padding: 3px 0 0 0;
			list-style: none;
	}
	.bottommenu li
	{
		padding: 0 9px;
		float: left;	
	}

	.bottommenu li a
	{
		font-size: 12px;
		color: #aaaaaa;	
	}
	
	ul.menu li li a
	{
		margin: 0;
		display: block;
		height: 38px;
		float: left;
		width: 181px!important;
		background-image: url(../img/sub.gif);
	}	
	
	
ul.menu li li 
{
	background: #FF6D00;
	width: 178px;
	padding: 0 24px;
	clear: both;
}

	.sub-kpn a
	{
		background-position: left 0;
	}
	.sub-hi a
	{
		background-position: left -38px;
	}
	.sub-ben a
	{
		background-position: left -76px;
	}
	.sub-simpel a
	{
		background-position: left -114px;
	}
	.sub-telfort a
	{
		background-position: left -152px;
	}
	.sub-vodafone a
	{
		background-position: left -190px;
	}	
	.sub-tmobile a
	{
		background-position: left -228px;
	}
	.sub-tele2 a
	{
		background-position: left -266px;
	}
	
	
	.sub-kpn a:hover
	{
		background-position: -181px 0;
	}
	.sub-hi a:hover
	{
		background-position: -181px -38px;
	}
	.sub-ben a:hover
	{
		background-position: -181px -76px;
	}
	.sub-simpel a:hover
	{
		background-position: -181px -114px;
	}
	.sub-telfort a:hover
	{
		background-position: -181px -152px;
	}
	.sub-vodafone a:hover
	{
		background-position: -181px -190px;
	}
	.sub-tmobile a:hover
	{
		background-position: -181px -228px;
	}
	.sub-tele2 a:hover
	{
		background-position: -181px -266px;
	}
	
	
	
	.menu li a:hover span
	{
		text-decoration: none;
	}

	.homeLink_rightAligned
	{
		float: right;
		width: 300px;
		position: absolute;
		color: #ffffff;
		right: 18px;
		top: 30px;
		display: none;
		text-align: right;
		z-index: 9;
	}

	.homeLink_rightAligned a
	{
		float: none !important;
		padding: 0 !important;
		color: #ffffff;
	}
	
	.CustomerArea
	{
			position: absolute;
			z-index: 6;
			right: 0;
			top: 63px;
			
	}
	.CustomerArea a
	{
		background-image: url(../img/privezakelijknav.jpg);	
		background-repeat: no-repeat;
		width: 100px;
		height: 48px;
		display: block;
		float: left;
	}
	
	.CustomerAreaP
	{
		background-position: left bottom;
	}
	
	.CustomerAreaZ
	{
		background-position: right 0;
		padding: 0 5px 0 0;
	}
	
	a.CustomerAreaP:hover, .onP
	{
		background-position: left top!important;
	}
	
	a.CustomerAreaZ:hover, .onZ
	{
		background-position: right bottom!important;
	}
}