﻿@charset "utf-8";

/*
  ╔═══════════════════════════════════════════════════════════════════════════════════
   stylesheet_global.css
   created by : Machiel van Gelder.
   creation date: 21 April 2009.
   modified by:____Machiel_____
   modification date: 17-06-2009
   ===================================================================================
    
   This css is used to define the standard html classes and custom css for the design.
   ===================================================================================
   Page layout items are described in the template as <!-- [ example ] -->
   ═══════════════════════════════════════════════════════════════════════════════════
*/


/*___________________________________________________
                  GLOBAL DESIGN CSS 
_____________________________________________________
****************************************************/

/* ---------- [ BODY / HTML elements ] ---------- */

BODY, HTML
{
	margin:0px 0px 0px 0px;
	padding:0px 0px 0px 0px;
	height: 100%;
	width:100%;
	text-align: center;
}

BODY
{
	background: #ffffff;
	overflow-y: scroll;
	text-align: center; /* centers the site in the screen */
	background-image:url(../images/body_bg.jpg);
	background-position:top left;
	background-repeat:repeat-x;
}

/* turns off horizontal scrolling when in backend */
.backendbody
{
	overflow-x:hidden;
}

.mainform
{
    display:block;
	min-height:100%;
	height: 100%;
}

/* ---------- [ Font definition ] ---------- */

HTML, BODY, TABLE, INPUT, SELECT, TEXTAREA
{   
    font-size:12px; /* this will be defined as 1 em */
    font-family: Verdana, Arial, Tahoma, sans-serif;
    line-height: 1.66em;
	letter-spacing: normal;
	color: #000000;
}

/* ---------- [ Link definition ] ---------- */

a:link,	a:hover, a:active, a:visited, /* standard link */
.cb3contentblock a:link, .cb3contentblock a:active, .cb3contentblock a:visited /* inside the editor */
{
	color: #0068a6;
	text-decoration: underline;
	cursor: pointer;
}

a:hover,
.cb3contentblock a:hover
{
	color: #0068a6;
	text-decoration: none;
}

/* ---------- [ Tooltip class ] ---------- */

a.info:link, a.info:active,	a.info:visited
{ 
    z-index: 24;
    position: relative;
}  

    a.info span /* initially hide */
    { 
	    display: none;
    }
    	
    a.info:hover span  /* display on hover */
    { 
	    z-index: 25;
	    display:block; 
	    position:absolute; 
	    top:1em; 
	    left:3em; 
	    background-color:#305584; 
	    color:#ffffff; 
	    font-size: 0.92em; 
	    line-height: 1.33em;
	    padding:3px; 
	    text-decoration:none;
    }	


/* ---------- [ Element definition ] ---------- */

P
{
    margin-bottom: 1.33em !important;
}

hr
{
	display: block;
	height: 1px;
	border-bottom: 1px solid #000000;
	margin: 1em 0;
}	

ul 
{
    margin-left: 1.5em;
    margin-bottom: 1.33em;
    list-style-image:none;
    list-style-type:disc;
}

ol
{
    margin-left: 1em;
    margin-bottom: 1.33em;
    list-style-image:none;
    list-style-position:inside;
}

* blockquote, blockquote *, blockquote blockquote *
{
    padding-left: 10px;
}

IMG.imgLeft
{
    margin: 0px 5px 5px 0px;
}

IMG.imgCenter
{
    DISPLAY: block;
    text-align:center;
    margin:0px auto;
}

IMG.imgRight
{
    margin: 0px 0px 5px 5px;
}

.hide
{
    display: none;
    height:1px;
    font-size:1px;
}

.clear
{
    display: block;
    height:1px;
    clear:both;
}

.veld, .withWatermarkClass
.radInput_Default INPUT,
TEXTAREA, .form_field, .form_dropdown, .area
{
    font-size: 1em;
    color: #000000;
    border-style:solid;
    border-width:0px 1px 1px 1px;
    border-color:#000000;
    background-color: #ffffff;
    line-height: 20px;
    background-image:url(../images/field_bg.gif);
    background-position:top left;
    background-repeat:repeat-x;
}

.veld, .withWatermarkClass
{
    height: 21px;
}

.area
{
	overflow: auto;
}


/*___________________________________________________
             CUSTOM DESIGN CSS 
_____________________________________________________
****************************************************/
/* ---------- [ Page layout ] --------- */

.main_container
{
    width:960px;
    margin-left:auto;
    margin-right:auto;
    text-align:left;
}

.top_container
{
    height:36px;
    overflow:hidden;
    vertical-align:top;
}

.topmenu_container
{
    height:30px;
    width:500px;
    overflow:hidden;
    float:left;
    padding-left:10px;
}

.header_container
{
    height:163px;
    background-repeat:no-repeat;
    background-position:top left;
    background-color:#ffffff;
    vertical-align:top;
}

.header_container_inner
{
    height:163px;
    width:960px;
    margin:0px;
    background-image:url(../images/logo_overlay.png);
    background-position:top left;
    background-repeat:no-repeat;
    vertical-align:top;
}

.logolink
{
    display:block;
    position:absolute;
    margin:63px 0px 0px 0px;
    float:left;
    height:100px;
    width:430px;  
}

.mainmenu_container
{
    height:35px;
    vertical-align:top;
}

.mainmenu_container DIV
{
    width:960px;
    height:35px;
    overflow:hidden;  
}

.leftcolumn
{
    width:233px;
    background-image:url(../images/leftcolumn_bg.jpg);
    background-position:top left;
    background-repeat:repeat-x;
    background-color:#0068a6;
    vertical-align:top;
}

.leftcolumn_top
{
    vertical-align:top;
}

.content_container
{
    width:727px;
    height:100%;
    background-image:url(../images/content_container_bg.gif);
    background-position:bottom left;
    background-repeat:no-repeat;
    background-color:#ffffff;
    vertical-align:top;
}

.footermenu_container
{
    width:233px;
    height:114px;
    background-image:url(../images/footermenu_bg.gif);
    background-position:bottom left;
    background-repeat:no-repeat;
    background-color:#0068a6;
    vertical-align:top;
    overflow:hidden;
    line-height:1em !important;
}

/* ---------- *** searchbox *** ---------- */

.search_container
{
    width:250px;
    float:right;
    padding-top:6px;
}

.search_container .veld
{
    width:175px;
    float:left;
}

.search_container .button
{
    width:67px;
    float:right;
}

/* readspeaker */

.speakerlink
{
    display:block;
    width:59px;
    height:31px;
    float:right;
    background-image:url(../images/btn_leesvoor.gif);
    background-position:top left;
    background-repeat:no-repeat;
}

.speaker_player
{
    display:block;
    height:64;
    position:absolute;
    z-index:200;
    top:35px;
    background-color:#d5e6f0;
    overflow:hidden;
}

.speaker_player TABLE
{
    border:1px solid #ffffff !important;
}


/* ---------- [ Content Specific ] ---------- */

.content_container_inner
{
    padding:30px 40px 30px 20px;
    font-size:1em;
    line-height:1.66em;
    background-image:url(../images/content_topright_bg.gif);
    background-position:top right;
    background-repeat:no-repeat;
}

.footermenu_inner
{
    padding-top:95%;
    padding-left:5px;
    padding-bottom:15px;
}

/* home columns */

.home_column1
{
    width:209px;
    float:left;
}

.home_column1_inner
{
    padding-right:20px;
}

.home_column2
{
    width:209px;
    float:left;
}

.home_column3
{
    width:209px;
    float:right;
    text-align:left;
}


.leftcontent_container
{
    padding:30px 20px 0px 20px;
    vertical-align:top;
}

.LeftContent /* used for intro text an such */
{
    background-color:#0068a6 !important;
    color:#ffffff !important;
    height: auto!important;
}


/* Map container (googlemap) */
.mapcontainer
{
    background:#ffffff;
    vertical-align:top;
}

.google_map
{
    height:100%;
    width:960px;
    overflow-x:hidden;
}



/* ---------- [ Specific ] ---------- */

.breadcrumbs
{
	height: 20px;
	margin-bottom:14px;
	font-size: 0.92em;
	color: #6c6c6c;
}

    .breadcrumbs SPAN
    {
        font-size: 1em; /* this inherits the font-size defined in the parent element */
    }

    .breadcrumbs a:link, .breadcrumbs a:visited, .breadcrumbs a:hover, .breadcrumbs a:active
    {
	    color: #959595;
	    font-size: 1em; /* this inherits the font-size defined in the parent element */
    }
	
.PageTitle
{
    color: #0068a6;
    display: block;
	font-size: 1.33em;
	font-weight: bold;
	width: 80%;
	overflow: hidden;
	margin-bottom:20px;
}

.title
{
	font-size: 1em;
	height: 1.33em;
	font-weight: bold;
}

.IntroText
{
	display: block;
	font-weight: bold;
}

.LiteText,.DateModified
{
    font-size: 0.83em;
	color: #959595;
	font-weight: lighter;
}

    .DateModified
    {
        display: block;
        clear: both;
        margin-top: 10px;
    }
    	
        .DateModified .date
        {
	        color: #959595;
	        font-size: 1em; /* this inherits the font-size defined in the parent element */
        }

/*___________________________________________________
                 CONTENT BLOKKEN
_____________________________________________________
****************************************************/

/* ---- Global -----*/

.WrapText
{
    padding-right: 0px; /* this is the default padding for the contentblock, please define custom classes for custom contentblocks */
}

    /* making the inside editor text look the same as when outside the editor  this is the padding used in 'WrapText' + 2px for the border*/
    .EContentBordered
    {
        text-align: left;
        padding-right:1px;
        padding-top: 1px;
    }
    
    .EContentBordered P
    {
    }

.cb3contentblock
{
    font-size:12px; /* this will be defined as 1 em */
    line-height:1.66em;
	letter-spacing: normal;
	color: #363636;
    background:#FFF; 
    background-color:#FFF;
    height: auto!important;
}
.frontend .cb3contentblock
{
    background:transparent; 
    background-color:transparent;
}


/* ---------- [ Headings used for frontend as defined in "style.css"  ] ---------- */

.cb3contentblock H1 { font-size: 1.5em; }
.cb3contentblock H2 { font-size: 1.4em; }
.cb3contentblock H3 { font-size: 1.33em; }
.cb3contentblock H5 { font-size: 0.9em; }

.cb3contentblock .tussenkop
{
    font-family: Verdana, Arial, Tahoma, sans-serif;
	font-size: 1.33em;
	margin-bottom:1.33em;
}

.cb3contentblock .rood
{
    font-family: Verdana, Arial, Tahoma, sans-serif;
    color:#e12f29;
}

.cb3contentblock .blauw
{
    font-family: Verdana, Arial, Tahoma, sans-serif;
    color:#0068a6;
}

.cb3contentblock .stippellijn
{
    color:#ffffff !important;
    font-size:0.1em;
    width:100% !important;
    clear:both;
    border-bottom:2px dotted #e12f29;
}


/* ---------- [ Extra: Fixes for editor ] ---------- */

/* Disable .anchor image for frontend (removes unwanted margin/padding)	This element is re-enabled in backend... Do not remove!	*/	
.cb3contentblock .anchor
{
    display: none;
}

    .LeftContent P *
    { float:none;}