/* ============================================== */
/* =====|          Marco Ranter            |===== */
/* =====|     Schutte Informatisering      |===== */
/* ============================================== */

/* ============================================== */
/* =====| STANDAARD HTML ADJUSTMENT        |===== */
/* ============================================== */
html, body {margin: 0; padding: 0; width:100%; height:100%;}
input, select, option, form { margin:0; padding:0; border:0;}
p, div {margin:0; padding:0; }


/* ============================================== */
/* =====| MAIN LAYOUT LAYER ID's           |===== */
/* ============================================== */

#container {
min-height: 100%; width:100%;
position: absolute;
top: 0;
}
* html #container { height: 100%; }
#container {
padding:0; margin:0;
}

/* container{ */

        
#wrapper { padding:96px 170px 20px 170px; margin:0;  }

/* wrapper{ */
#overview  { position: absolute; left:0;  margin-top:136px; width: 170px; }
#quickview { position: absolute; right:0; margin-top:136px; width: 170px;}
#content   { position: relative; margin-top:40px; overflow:auto; height:470px; z-index:-1;}
#content[id]{ z-index:auto; min-width:582px;  }
#header    { position: absolute; height: 96px; }
/* }!wrapper */


#contact { width:160px; margin:500px 0 0 10px; padding-bottom:14px; height:89px; position:absolute; left:0;  }
/* }!container */



/* ============================================== */
/* =====| SUB LAYOUT POSITIONING           |===== */
/* ============================================== */
.minwidth { height:auto; position:relative; width:550px; margin:15px; }

.item_wrap { width:154px; margin:0 5px 2px 8px; position:relative;}
.input_zoek { width:129px; height:12px; margin:2px; padding-left:2px; }

.nieuwsbar { padding:2px 2px 2px 3px; }
.nieuwscontent { padding:0 3px; position:relative; }
.nieuwscontent p { padding-top:4px; padding-bottom:8px; }

#deMare { width: 245px; height:139px; left:0; top:0; position:absolute; margin:0px 0 0 21px; 
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.de-mare-scholen.nl/de-mare-scholen/siteimages/de-mare.png', sizingMethod='image');}
#deMare[id] { background:url(../siteimages/de-mare.png) no-repeat; }
#stichting { width: 535px; height:48px; left:0; top:0; position:absolute; margin:75px 0 0 280px; 
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.de-mare-scholen.nl/de-mare-scholen/siteimages/sobs.png', sizingMethod='image'); }
#stichting[id] { background:url(../siteimages/sobs.png) no-repeat; }
#slogan { width:319px; height:23px; margin: 12px 12px 0 550px; float:right; 
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.de-mare-scholen.nl/de-mare-scholen/siteimages/scholen_met_een_eigen_verhaal.png', sizingMethod='image'); }
#slogan[id] {background:url(../siteimages/scholen_met_een_eigen_verhaal.png) no-repeat; }


/* ============================================== */
/* =====| ACHTERGRONDJES + BORDERS         |===== */
/* ============================================== */
body      { background:url(../siteimages/achtergrond.png) #fff top left no-repeat;  }
#content  { border:1px solid #c9c9c9;
scrollbar-face-color:#fff;
scrollbar-arrow-color:#cdcdcd;
scrollbar-track-color:#eee;
scrollbar-shadow-color:#aaa;
scrollbar-highlight-color:#ddf;
scrollbar-3dlight-color:#ddf;
scrollbar-darkshadow-Color:#ddf; }
.item_wrap { border:1px solid #c9c9c9; background-color:#e2dfee;}
.input_zoek { border-top:1px solid #bbb; border-left:1px solid #bbb;  border-top:1px solid #bbb; border-bottom:1px solid #fff; border-right:1px solid #fff; background-color:#fff; }
.nieuwsbar { background-color:#e2dfee; }
.nieuwscontent { background-color:#fff; border-top:1px solid #c9c9c9;}


/* ============================================== */
/* =====| WEBSITE LETTERTYPES EN KLEUREN   |===== */
/* ============================================== */
/* globale font (wordt overal gebruikt) */
body       { font-size:12px; font-weight:normal; font-family:Arial, Helvetica, sans-serif; color:#004187; }

#content { line-height:18px; }
h1         { font-size:14px; font-weight:bold; color:#004187; text-decoration:underline; }
h2         { font-size:13px; font-weight:bold; color:#004187; }
h3         { font-size:12px; font-weight:bold; color:#004187; font-style:italic; }

#contact   { color:#d93832; font-size:12px; font-family:Arial; font-weight:bold; }
.special   { color:#004187; font-weight:bold; }

.input_zoek {  font-size:11px; font-family:Verdana, Arial, Helvetica, sans-serif; font-weight:bold; color:#014188;}
.nieuwsheader { color:#004187; font-weight:bold; font-size:12px; font-family:Verdana, Arial, Helvetica, sans-serif; }
.nieuwscontent { font-size:11px; font-family:Verdana, Arial, Helvetica, sans-serif; }


.active    { color:#d93832; }
/* ============================================== */
/* =====| LINKJES                          |===== */
/* ============================================== */
a {	color: #004187; }
.nieuwscontent a { color:#004187; font-family:Verdana; font-weight:bold; }
.nieuwscontent a:hover { color:#d93832; }
#quickview a { text-decoration:none; }
.nieuwsheader:hover { color:#d93832; }
.nieuwsbar {cursor:pointer; }

/* ============================================== */
/* =====| JAVA MENU OPMAAK                 |===== */
/* ============================================== */
#menu1 {
 width:148px;
 margin-left:5px;
 outline:0;
}
/* --------------------- menu - begin ----------------- */
.ddmx .item1,
.ddmx .item1:hover,
.ddmx .item1-active,
.ddmx .item1-active:hover {
    width:148px;
	margin:0;
	margin-bottom:2px;
    padding: 2px 4px 2px 4px;
    font: 12px Verdana, Arial, Helvetica, sans-serif;
    color: #004187;
    font-weight: bold;
	background-color:#e2dfee;
	border:1px solid #c9c9c9;
    text-decoration: none;
    display: block;
    white-space: nowrap;
    position: relative;
	outline:0;

}
.ddmx .item1:hover,
.ddmx .item1-active,
.ddmx .item1-active:hover {
	margin-bottom:2px;
	color: #da3d37;
	

}
/* --------------------- menu items - end ----------------- */






/* --------------------- branche of submenu items - begin ----------------- */
.ddmx .item2,
.ddmx .item2-active,
.ddmx .item2-active:hover {
	margin: 2px 0px 0px 0px;
	height:14px;
	margin-bottom:2px;
    padding: 2px 12px 2px 4px;
    color: #004187;
	background-color:#e2dfee;
	border:1px solid #c9c9c9;
    text-decoration: none;
    font: 11px verdana;
    font-weight: bold;
    display: block;
	top:-1px;
    white-space: nowrap;
    position: relative;
    z-index: 500;
	outline:0;
}
.ddmx .item2:hover,
.ddmx .item2-active,
.ddmx .item2-active:hover {
	color: #da3d37;
}

/* --------------------- branche of submenu items - end ----------------- */


.ddmx .arrow:hover {
}
.ddmx .item2 img,
.ddmx .item2-active img{
    position: absolute;
    top: 0px;
    right: 1px;
    border: 0;
}


/*------------------- table border of submenu items - begin ----------------------------*/
.ddmx .section {
 margin-left:2px;
 margin-top:-1px;
 top:0px;
    border: 0px solid;
	position: absolute;
    visibility: hidden;
    z-index: -1;
}
/*------------------- table border of submenu items - end ----------------------------*/

#button_ict{
	margin-left:18px;
	color:#e2dfee;
}

#button_ict:hover{
	color:#ff0;
}

* html .ddmx td { position: relative; } /* ie 5.0 fix */
