/*
 * Vios
 * datum 20081107
 *
 */

/*
 * Kleuren
 * Groen: #89CE36;
 * Grijze tekst: #7E7C7B;
 * Blauw menu: #0A73B2;
 */

/* Layout starts here */

/*******************/
/* Algemene opmaak */
/*******************/
	body {
	    text-align: center; /* Oude browsers */
		background:#E4EBF0;
	}
	#container {
	    width: 956px; /* Breedte ontwerp */
	    margin: 0 auto;
	    text-align: left;
	}

/**********/
/* Header */
/**********/
	#header {
	    background:  url(/site/images/vios/bg_header.jpg) repeat-x left top; /* Achtergrondafbeelding header */
		height: 185px;
		overflow:hidden;
	}
	#headerLeft{
		float:left;
		width: 320px;
		height:129px;
		background: url(/site/images/vios/bg_header_people.jpg) no-repeat left top;
	}
	#slogan{
		display:none;
	}
	#logo {
		float:right;
		width:203px;
		overflow:hidden;
		padding:0;
		margin:0;
	}
		#logo a{
			display:block;
			height: 129px;
			width: 203px;
			background: url(/site/images/vios/bg_header_logo.jpg) no-repeat left top; /* Achtergrondafbeelding logo */
			text-indent: +500em;
			white-space:nowrap;
		}
	#nav{
		width: 100%;
		height:58px;
		clear:left;/* Om menu onder logo te krijgen */
		background:url(/site/images/vios/bg_mainNav.jpg) no-repeat left top;
	}

	/* 
	 * Mainnav
	 */
	#mainNav {
		float:left; 
		padding: 8px 0 0 27px;
		width:800px;/* 100%; */
		height:50px;
	}
	/* Hoofdniveau */
	#mainNav ul li{
		padding:0 6px 0 0; /* Ruimte voor tabachtergrond rechts */
		margin:0; /* geen ruimte tussen tabs */
	}
	#mainNav ul li a{
		/* Opmaak zonder sIFR */
		background:none;
		color:#fff;
		font-size:1.2em;
		height:20px;
		line-height:20px;
	}
	#mainNav ul li.selected a,
	#mainNav ul li a:hover{
		/* Opmaak zonder sIFR */
		background:none;
		color:#89CE36;
		font-size:1.2em;
	}
	#mainNav ul li span{
		/* extra span voor tabachtergrond */
	    float: left; /* Nodig voor ie6 */
    	display: block;
		padding:0 0 0 6px ; /* Ruimte voor tabachtergrond links */
	}
	#mainNav ul li.selected,
	#mainNav ul li.hover,
	#mainNav ul li:hover {
		/* Tabachtergrond rechts */
    	background: url(/site/images/vios/bg_tab.gif) no-repeat right -20px;
	}
	#mainNav ul li.selected span,
	#mainNav ul li.hover span,
	#mainNav ul li:hover span {
		/* Tabachtergrond links */
    	background: url(/site/images/vios/bg_tab.gif) no-repeat left top;

	}
	/* Subniveau */
	#mainNav .submenu {
		/* Juiste positie submenu */
		top:20px;
	} 
	.menuHor2 li:hover .submenu,
	.menuHor2 li.selectedJS .submenu{
	    left: -10px; /* submenu in beeld zetten */
	}
	#mainNav ul li .submenu_inner { 
		/* submenu ronde rand rechts */
	    float: left; /* zwevend links om breedte = breedte inhoud */
	    background: url(/site/images/vios/bg_submenu.gif) no-repeat right -20px; /* Rechterkant afgerond */
		padding: 0 10px 0 0; /* Voor ronde rand */
	}
	#mainNav ul li ul {
	    background: #fff; /* achtergrond heel submenu */
	    overflow: hidden; /* hoogte = hoogte floated els */
	    float: left; /* zwevend links om breedte = breedte inhoud */
	    background: url(/site/images/vios/bg_submenu.gif) no-repeat left 0px; /* Linkerkant afgerond + achtergrond */
	    padding: 0 0 0 10px; /* voor ronde rand links */
	}
	#mainNav ul li ul a,
	#mainNav ul li.selected ul a{
		/* Koppelingen submenu */
		color: #7E7C7B;
	}
	#mainNav ul li ul a:hover,
	#mainNav ul li ul .selected a{
		/* Koppelingen submenu */
		color:#0A73B2;
	}
	
	#languageNav{
		float:right;
		padding:0 25px 0 0;
	}
	#languageNav .menuHor2 li a {
		background:none;
		font-size:1.2em;
		font-weight:bold;
		padding:1px 5px 1px 5px;
		color:#fff;
		margin-top:1px;
	}
	#languageNav .menuHor2 li a:hover
	,#languageNav .menuHor2 li.selected a
	,#languageNav .menuHor2 li.selectedJS a{
		color:#5AAF20;
		background-color:#FFF;
	}

/**********/
/* Middle */
/**********/
	#middle {
		overflow:hidden;
	    background: url(/site/images/vios/bg_middle.jpg) repeat-y left top; /* Achtergrondafbeelding middendeel */
		padding: 0 20px 0 10px;
	}
	#middle_inner {
		/* Voor achtergrond met mensen */
		background: url(/site/images/vios/bg_middle_inner.jpg) no-repeat left top;
		padding: 0 0 0 27px; /* Plaatsen col1 */
	}
	/* col1 */
		#col1 {
		    float: left; 
		    width: 330px; 
			color: #7E7C7B;
		}
		#col1 .bgTop{
			/* ronde hoeken boven */
			background:url(/site/images/vios/bg_col1_top.png) no-repeat left top;
			height: 15px; 
		}
		#col1 .bgMiddle{
			/* transparante achtergrond tekst linkerkolom */
			background:url(/site/images/vios/bg_col1_middle.png) repeat-x left top;
			padding:0 15px 15px 15px;
		}
		#col1 .refMiddle{
			/* transparante achtergrond tekst referenties */
			background:url(/site/images/vios/bg_col1_ref_middle.png) repeat-y left top;
			padding:10px 15px 0 15px;
		}
		#col1 .bgBottom{
			/* afgeronde hoeken onderaan */
			background:url(/site/images/vios/bg_col1_ref_bottom.png) no-repeat left top;
			height:15px;
		}
		#col1 .refMiddle h2 {
			color:#89CE36;
			font-size:1.4em
		}
		#col1 .refMiddle p {
			padding:0;
			font-size:1.2em;
			font-weight:bold;
		}
		#col1 .refMiddle a {
			color:#fff;
			text-decoration:none;
		}
		#col1 .refMiddle a:hover {
			text-decoration:underline;
		}
		
		/* blog */
			#blog {
				overflow:hidden:
			}
	/* col2 */
		#col2{
	    margin: 0 0 0 350px;  /* Afstand van linkerrand */
			width: 455px;
	    padding: 0 20px; 
			color:#555;/*#7E7C7B;*/
		}
		#col2 .bgTop{
			/* ronde hoeken boven */
			background:url(/site/images/vios/bg_col2_top.png) no-repeat left top;
			height: 15px; 
		}
		#col2 .bgMiddle{
			/* transparante achtergrond */
			background:url(/site/images/vios/bg_col2_middle.png) repeat-x left top;
			padding:0 15px 0 15px;
			min-height: 500px; /* Minimum hoogte zodat achtergrondafbeelding goed getoond wordt */
		}
		#col2 ul ,
		#col2 ol {
			/*Herstellen linkermarge lijsten */
			margin: 0 0 0 1.5em;
		}
	/* middle_footer */
		#middle_footer {
			clear: both;
			padding: 25px 0 0 0; /* witruimte */
		}
		#middle_footer .col1{
			float:left;
			width:115px;
			height:30px;
			padding: 0 0 0 25px;
		}
		#middle_footer .col1 a{
			/* Logo atcomm */
			display:block;
			width:115px;
			height:30px;
			background:url(/site/images/vios/logo_atcomm.gif) no-repeat left top;
			text-indent: -500em; /* Text verwijderen */
		}
		#middle_footer .col2{
			margin: 0 0 0 297px;
			font-size: 1.2em;
			color:#7E7C7B;
		}
		#middle_footer .col2 .groeneBol{
			background:url(/site/images/vios/bg_bol.gif) no-repeat center center;
			padding:3px;
		}
		#middle_footer .col2 a{
			color:#7E7C7B;
			text-decoration:none;
		}
		#middle_footer .col2 a:hover{
			text-decoration:underline;			
		}
		#mail {
			float:right;
			padding: 0 20px 20px 0;
		}
		#mail a {
		    display: block;
		    width: 38px;
		    height: 38px;
		    text-indent: -500em;
		    background: url(/site/images/vios/bg_mail.gif) no-repeat top left;
		}
/**********/
/* Footer */
/**********/
	#footer {
		background:url(/site/images/vios/bg_footer.jpg) no-repeat left top;
		height: 30px;
	}