/*-------------------------
	CSS RESET
-------------------------*/
body, html, a:active, :active, :focus, a:focus, div, span, object, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, samp, small, strong, sub, sup, var,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend {
	margin: 0; padding: 0; border: 0; outline: none; -moz-outline-style: none;
}

/*-------------------------
	BACKGROUND / LAYOUTS
-------------------------*/

body {
	background: #c6c6c6 url(/SiteFiles/Layout/bg.png) left top repeat-x;
}

.LeftCell {
	background: url(/SiteFiles/Layout/left.png) right top repeat-y;
}
.RightCell {
	background: url(/SiteFiles/Layout/right.png) left top repeat-y;
}

.ie5_6 .LeftCell {
	background: ;
	border-right: 1px solid #c9c9c9;
}
.ie5_6 .RightCell {
	background: ;
	border-left: 1px solid #c9c9c9;		
}

.sidebar {
	background: url(/SiteFiles/Layout/sidebarbg.gif) right top repeat-y;	
}

/*-------------------------
	TEKST
-------------------------*/

@font-face {
  font-family: 'Bryant LG';
  src: url(BryantLG.eot);
  src: local('BryantLG'), local('Bryant LG'), 
         url(BryantLG.ttf) format('truetype');
}

body, table, td, tr {
	font: 12px/18px "Trebuchet MS", Verdana, Geneva, Tahoma, sans-serif;
	color: #5d5c5c;
}

h1 {
	font: normal normal 24px/40px "Bryant LG", "Trebuchet MS", Verdana, Geneva, Tahoma, sans-serif;
	color: #5d5c5c;
}
h2 {
	font: normal normal 24px/40px "Bryant LG", "Trebuchet MS", Verdana, Geneva, Tahoma, sans-serif;
	color: #5d5c5c;	
}
	.lg {
		color: #ac0648;	
	}



h3 {
	font: normal normal 17px/30px "Bryant LG", "Trebuchet MS", Verdana, Geneva, Tahoma, sans-serif;
	color: #999;	
}


	.lg2 {
		color: #acacac;
		font-size:15px;
	}

h4 {
	font: bold 14px/18px "Bryant LG", "Trebuchet MS", Verdana, Geneva, Tahoma, sans-serif;
	color: #5d5c5c;	
}

p {
	font: 12px/18px "Trebuchet MS", Verdana, Geneva, Tahoma, sans-serif;
}

small {
	font-size: 11px;
}
big {
	font: 13px/22px "Trebuchet MS", Verdana, Geneva, Tahoma, sans-serif;
}


/*-------------------------
	ALGEMENE STYLES
-------------------------*/

a {
	color: #5d5c5c;
	text-decoration: underline;
}
	a:hover {
		color: ac0648;
		text-decoration: underline;
	}
	
ul {
	padding: 0;
	margin-left: 15px;
	font-size: 11px;
	list-style-type: disc;
	line-height: 21px;
	font-size: 12px;
}
ul ul {
	padding: 0;
	margin-left: 16px;
	font-size: 11px;
	list-style-type: circle;
	line-height: 21px;
	font-size: 12px;
}

hr {
	color: #ccc;
	background-color: #ccc;
	height: 1px;
	border: 0px;
}

.footer {
	text-align: right;
	line-height: 18px;
	font-size: 11px;
}

.wrapper {
	text-align: right;
	width: 468px;
}

#totop {
	background: url(/SiteFiles/Layout/arrowup.png) left 2px no-repeat;
	padding-left: 15px;
	font-size: 11px;
	cursor: hand; cursor: pointer;
}

a.arrowright, a.arrowright:active, a.arrowright:visited {
	background: url(/Sitefiles/layout/arrowgrey.png) left 3px no-repeat;
	padding-left: 15px;
	font-size: 11px;
	cursor: hand; cursor: pointer;
}
a.arrowleft, a.arrowleft:active, a.arrowleft:visited {
	background: url(/Sitefiles/layout/arrowleft.png) left 3px no-repeat;
	padding-left: 15px;
	font-size: 11px;
	cursor: hand; cursor: pointer;
}

/*-------------------------
	BUTTON (standaard web 2.0)
-------------------------*/
a.button, a.button:active, a.button:visited {
	font: normal 12px "Trebuchet MS", Arial, Helvetica, sans-serif;
	float: left;	
    padding-left: 10px; 
	background: url(/SiteFiles/Layout/button.png) left top no-repeat;
	cursor: pointer; cursor: hand;
	text-decoration: none;
	text-shadow: 0 1px 0 #fff;	
	color: #5d5c5c;
	margin: 0;
}
a.button div {
	background: url(/SiteFiles/Layout/buttonarrow.png) right top no-repeat;
	cursor: pointer; cursor: hand;
	line-height: 22px;
    padding: 4px 35px 7px 8px;
}
	a.button:hover {
		background-position: left -33px;
	}
	a.button:hover div {
		background-position: right -33px;
	}	


/*-------------------------
	LINKS MET PLAATJES	
-------------------------*/

a.pdf, a.pdf:active, a.pdf:visited {
	background: url(/Sitefiles/layout/pdf.png) 0px 0px no-repeat;
	padding: 2px 3px 3px 25px;
	margin-top: 2px;
	display: block;	
}
	a.pdf:hover {
		background-position: 0 -78px;
	}

a.image, a.image:active, a.image:visited {
	background: url(/Sitefiles/layout/image.png) 1px 4px no-repeat;
	padding: 2px 3px 3px 23px;
	margin-top: 2px;
	display: block;		
}
	a.image:hover {
		background-position: 1px -62px;
	}

a.size, a.size:active, a.size:visited {
	background: url(/Sitefiles/layout/size.png) 1px 4px no-repeat;	
	padding: 2px 3px 3px 23px;
	margin-top: 2px;
	display: block;		
}
	a.size:hover {
		background-position: 1px -63px;
	}

	
/*-------------------------
	TOP submenu (Home + Divisions)
-------------------------*/
.submenu {
	clear: both;
	width: 749px;
}

.submenu  a, .submenu  a:active, .submenu  a:visited {
	font: normal 13px/42px "Trebuchet MS", Arial, Helvetica, sans-serif;
	display: block;
	width: 187px;
	height: 44px;
	float: left;
	background-image: url(/SiteFiles/Layout/menubg.png);
	background-repeat: no-repeat;
	cursor: pointer; cursor: hand;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	text-shadow: 0 1px 0 #fff;	
	color: #5d5c5c;
	margin: 0;
}

.submenu  a:hover{
	color: #ac0647; text-decoration: none; 
}
	
#submenu_home { background-position: 0 0; }
#submenu_home:hover, #submenu_home.hover { background-position: 0 -44px; }

#submenu_government { background-position: -187px 0; }
#submenu_government:hover, #submenu_government.hover { background-position: -187px -44px; }	

#submenu_retail { width: 188px; background-position: -374px 0; }
#submenu_retail:hover, #submenu_retail.hover { background-position: -374px -44px; }

#submenu_hospitality { background-position: -562px 0; }
#submenu_hospitality:hover, #submenu_hospitality.hover { background-position: -562px -44px; }


/*-------------------------
	SOCIAL MEDIA (Icons)
-------------------------*/
.socialmedia {
	clear: both;
	width: 150px;
}
	
.socialmedia a, .socialmedia a:active, .socialmedia a:visited {
	display: block;
	text-indent: -9999px;
	width: 32px;
	height: 32px;
	float: left;
	background-image: url(/SiteFiles/Layout/socialmedia.png);
	background-repeat: no-repeat;
	cursor: pointer; cursor: hand;
	margin-right: 5px;
}
	
#socialmedia_ecology { background-position: 0 0; }
#socialmedia_ecology:hover, #socialmedia_ecology.hover { background-position: 0 -32px; }

#socialmedia_twitter { background-position: -32px 0; }
#socialmedia_twitter:hover, #socialmedia_twitter.hover { background-position: -32px -32px; }	

#socialmedia_youtube { background-position: -64px 0; }
#socialmedia_youtube:hover, #socialmedia_youtube.hover{ background-position: -64px -32px; }

#socialmedia_rss { background-position: -96px 0; }
#socialmedia_rss:hover, #socialmedia_rss.hover{ background-position: -96px -32px; }


/*-------------------------
	LOGIN BUTTONS (Portal/service request)
-------------------------*/
.loginbuttons {
	clear: both;
	width: 150px;
}
	
.loginbuttons a, .loginbuttons a:active, .loginbuttons a:visited {
	display: block;
	text-indent: -99999px;
	width: 150px;
	height: 50px;
	float: left;
	background-image: url(/SiteFiles/Layout/buttonsprite.png);
	background-repeat: no-repeat;
	cursor: pointer; cursor: hand;
	margin-bottom: 15px;
}
	
#portallogin { background-position: 0 0; }
#portallogin:hover, #portallogin.hover { background-position: -150px -0; }

#servicerequest { background-position: 0 -50px; }
#servicerequest:hover, #servicerequest.hover { background-position: -150px -50px; }	

#nas { background-position: 0 0; background-image: url(/SiteFiles/Layout/button3.png); }
#nas:hover, #nas.hover { background-position: -150px 0; }

#proidiom { background-position: 0 0; background-image: url(/SiteFiles/Layout/button4.png); }
#proidiom:hover, #proidiom.hover { background-position: -150px 0; }

#vierkant { 
	background-position: 0 0;
	height: 150px;	
	background-image: url(/SiteFiles/Layout/button-vierkant.png);	
}
	#vierkant:hover, #vierkant.hover { background-position: 0 -150px; }	


/*-------------------------
	PORTAL - Press Images
-------------------------*/
.press {
	list-style: none;
	padding: 0; margin: 0;
	display: block;
}
.press li {
	float: left;
}
.press li a {
	border: 1px solid #c3c3c3;
	display: block; width: 100px; height: 100px;
}
.press li a:hover {
	border: 1px solid #c31768;
}
.pressmargin {
	margin-right: 14px;
}



/*-------------------------
	TOOLTIPS ('tipsy')
-------------------------*/

.tipsy { padding: 5px; font-size: 10px; background-repeat: no-repeat; }
  .tipsy-inner { padding: 4px 5px; background-color: #5d5c5c; color: white; max-width: 200px; text-align: center; }
  .tipsy-north { background-image: url(/Sitefiles/layout/tipsy-north.gif); background-position: top center; }
  .tipsy-south { background-image: url(/Sitefiles/layout/tipsy-south.gif); background-position: bottom center; }
  .tipsy-east { background-image: url(/Sitefiles/layout/tipsy-east.gif); background-position: right center; }
  .tipsy-west { background-image: url(/Sitefiles/layout/tipsy-west.gif); background-position: left center; }
  


/*-------------------------
	HEADER (Foto rotator)
-------------------------*/  
#slideshow {
    position: relative;
    height: 226px;
}
#slideshow img {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 8;
    opacity: 0.0;
}
#slideshow img.active {
    z-index: 10;
    opacity: 1.0;
}
#slideshow img.last-active {
    z-index:9;
}

/*-------------------------
	TABLE ONDERWIJS CODE SNIPPET
-------------------------*/  

table.onderwijs {
	width:860px;
	height:180px;
	background:#fefefe;
	border-collapse:collapse;/*border:1px solid #c2c2c2;*/
}
table.onderwijs td.image {
	width:140px;
	vertical-align:top;
	text-align:center;
	padding-top:10px;
	border-top:1px solid #c2c2c2;
	border-bottom:1px solid #c2c2c2;
	border-left:1px solid #c2c2c2;
}
table.onderwijs td.content {
	width:280px;
	vertical-align:top;
	text-align:left;
	padding-top:5px;
	padding-left:10px;
	padding-right:10px;
	font:normal 12px/18px "Trebuchet MS", Arial, Helvetica, sans-serif;
	color:#5d5c5c;
	border-top:1px solid #c2c2c2;
	border-bottom:1px solid #c2c2c2;
	border-right:1px solid #c2c2c2;
}
table.onderwijs td.middle {
	width:40px;
	border-bottom:none!important;
	border-top:none!important;
}
table.onderwijs td.content h4 {
	font:bold 14px "Trebuchet MS", Arial, Helvetica, sans-serif;
	color:#ac0648;
}
table.onderwijs a, a img {
	border:none;
	color:#ac0648;
	text-decoration:underline;
}
table.onderwijs a:hover {
	border:none;
	color:#5d5c5c;
	text-decoration:underline;
}
