/* mac hide\*/
html, body {height:100%}
/* end hide */
body {
	padding:0;
	margin:0;
	text-align:center;
	min-width:984px;/* for mozilla*/
	background-color: #BE1E2D;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;	
	line-height:1.60em;
	color: #191970;
}
#outer{
	height:100%;
	min-height:100%;
	width:984px;
	text-align:left;
	margin:auto;
	position:relative;
	background-color: #fff;
}
 
html>body #outer{height:auto;} /*for mozilla as IE treats height as min-height anyway*/
#innerwrap {/* enables content first */
	float:left;
	width:744px;
}

#fouteinnerwrap {/* enables content first */
	float:left;
	width:984px;
}
#header{
	position:absolute;
	top:0;
	left:-1px;
	width:985px;
	height:54px;
	background-color: #BE1E2D;
	overflow:hidden;
	z-index:100;
}
#left {
	position:relative;/*ie needs this to show float */
	width:230px;
	float:left;
	padding-top:52px;/*needed to make room for header*/
	padding-bottom:32px;/* needed to make room for footer */
}

#left img {margin:0;}

#right {
	position:relative;/*ie needs this to show float */
	width:210px;
	float:right;
	padding-top:52px;/*needed to make room for header*/
	padding-bottom:32px;/* needed to make room for footer */
	vertical-align:top;
}

#footer {
	width:984px;
	clear:both;
	height:50px;
	border-top:1px solid #000;
	border-bottom:1px solid #000;
	background-color: #7bbd33;
	color: #000000;
	text-align:center;
	left:0;
	bottom:0;
	position: absolute;
	padding-top:10px;
}

* html #footer {/*only ie gets this style*/
	\height:32px;/* for ie5 */
	he\ight:30px;/* for ie6 */
}
#centrecontent {
	width: 505px;
	float:right;	
	padding-top:52px;
	padding-bottom:32px;/* needed to make room for footer */
}

#nietdoencontent {
	width: 745px;
	float:right;	
	padding-top:52px;
	padding-bottom:32px;/* needed to make room for footer */
}

.dictcontainer {
	margin-left:10px;
	background-color: #eee;
	text-align:left;
	/* trick to extend bg colour around floating cols */
	border-bottom: 1px solid #ccc;
	padding-left: 5px;
}

.dict1 {
	width: 160px;
	float: left;
}
.dict2 {
	width: 320px;
  	margin:0 0 0 165px;	
	height: 1% /* Holly hack for Peekaboo Bug */
}


/* text */
#centrecontent h2 { font-size: 1.8em; color: #0000cd; margin-left:10px;}
#centrecontent h3 { clear:left; display:block ;font-size: 1.2em; font-weight: bold;color:#ff3300;border-bottom: 1px solid #909DBD;padding-top:15px;padding-bottom:3px; margin-left:10px;}
#centrecontent h4 { font-size: 1.2em; color: #0000cd; margin-left:10px;}
#centrecontent p { margin-left:10px;}

#left p {padding-left:3px;padding-right:2px}
#right p {padding-left:4px;padding-right:2px;margin-left:0;}
#right h4 { font-size: 1em; color: #0000cd;padding-left:0;}

.red {color:#f70000;}
.green {color:#008000;}

.subheading {
clear:left; display:block ;font-size: 1.2em; font-weight: bold;color:#ff3300;border-bottom: 1px solid #909DBD;padding-top:15px;padding-bottom:3px; margin-left:10px;}

.naarboven {
float:right; display:block; text-align:right; font-size:0.76em; padding-right:5px;}


/* margin adjusments  */
.noMarginTop {
margin-top:0;
}

/* clearing adjusments  */
.clearLeft {
clear:left;
}
.clearRight {
clear:right;
}
.clearBoth {
clear:both;
}

#clearfooter {width:100%;height:32px;clear:both} /* to clear footer */

img {
border:0;
}

/* product description images*/
.prod {
float:left;
margin-right:10px;
margin-bottom:10px;
}

/* small icon images*/
.imgIcon {
vertical-align:middle; margin:0 5px;
}
.imgIconNoMargRight {
vertical-align:middle; margin:0 0 0 5px;
}

/* navigation structure Vista (one sprite img)*/
ul#navVista { 
position: absolute;
top:166px; 
left:-20px;
width:189px; 
height:434px; 
text-align:center;
}

ul#navVista li {
padding:0; 
margin:0; 
list-style-type:none; 
text-indent:-9999px; 
display:inline; /* Fixes the IE double margin bug */
} 

ul#navVista li a { 
border:0; 
text-decoration:none; 
display:block; 
background: url(../vista/images/steppie_en_stella.gif) no-repeat; 
} 

/**** the menu items, each have their own specific ID *******
/* steppie and stella */
ul#navVista li#steppie_stella a { 
width:189px; 
height:192px; 
} 
ul#navVista li#steppie_stella a:link, ul#navVista li#steppie_stella a:visited { 
background-position:0 0; 
} 
ul#navVista li#steppie_stella a:hover, ul#navVista li#steppie_stella a:focus { 
background-position:-189px 0; 
}  

/* start */
ul#navVista li#start a { 
width:189px; 
height:20px; 
background-position:0 -192px; 
} 
ul#navVista li#start a:link, ul#navVista li#start a:visited { 
background-position:0 -192px;
} 
ul#navVista li#start a:hover, ul#navVista li#start a:focus, ul#navVista li#start a.active { 
background-position:-189px -192px;
} 

/* ff oefenen */
ul#navVista li#ffoefenen a { 
width:189px; 
height:21px; 
background-position:0 -212px; 
} 
ul#navVista li#ffoefenen a:link, ul#navVista li#ffoefenen a:visited { 
background-position:0 -212px; 
} 
ul#navVista li#ffoefenen a:hover, ul#navVista li#ffoefenen a:focus, ul#navVista li#ffoefenen a.active { 
background-position:-189px -212px; 
} 

/* testjezelf */
ul#navVista li#testjezelf a { 
width:189px; 
height:24px; 
background-position:0 -233px;  
} 
ul#navVista li#testjezelf a:link, ul#navVista li#testjezelf a:visited { 
background-position:0 -233px; 
} 
ul#navVista li#testjezelf a:hover, ul#navVista li#testjezelf a:focus, ul#navVista li#testjezelf a.active { 
background-position:-189px -233px;  
} 

/* leukewebsites */
ul#navVista li#leukewebsites a { 
width:190px; 
height:22px; 
background-position:0 -257px;
} 
ul#navVista li#leukewebsites a:link, ul#navVista li#leukewebsites a:visited { 
background-position:0 -257px;
} 
ul#navVista li#leukewebsites a:hover, ul#navVista li#leukewebsites a:focus, ul#navVista li#leukewebsites a.active { 
background-position:-189px -257px; 
}   

/* niet doen */
ul#navVista li#nietdoen a { 
width:189px; 
height:23px; 
background-position:0 -279px; 
} 
ul#navVista li#nietdoen a:link, ul#navVista li#nietdoen a:visited { 
background-position:0 -279px; 
} 
ul#navVista li#nietdoen a:hover, ul#navVista li#nietdoen a:focus, ul#navVista li#nietdoen a.active { 
background-position:-189px -279px; 
}  

/* woordenboek */
ul#navVista li#woordenboek a { 
width:189px; 
height:22px; 
background-position:0 -302px; 
} 
ul#navVista li#woordenboek a:link, ul#navVista li#woordenboek a:visited { 
background-position:0 -302px; 
} 
ul#navVista li#woordenboek a:hover, ul#navVista li#woordenboek a:focus, ul#navVista li#woordenboek a.active { 
background-position:-189px -302px; 
} 

/* computerweetjes */
ul#navVista li#computerweetjes a { 
width:189px; 
height:22px; 
background-position:0 -324px; 
} 
ul#navVista li#computerweetjes a:link, ul#navVista li#computerweetjes a:visited { 
background-position:0 -324px; 
} 
ul#navVista li#computerweetjes a:hover, ul#navVista li#computerweetjes a:focus, ul#navVista li#computerweetjes a.active { 
background-position:-189px -324px; 
}

/* programmas */
ul#navVista li#programmas a { 
width:189px; 
height:22px; 
background-position:0 -346px; 
} 
ul#navVista li#programmas a:link, ul#navVista li#programmas a:visited { 
background-position:0 -346px; 
} 
ul#navVista li#programmas a:hover, ul#navVista li#programmas a:focus, ul#navVista li#programmas a.active { 
background-position:-189px -346px; 
}
  
/* computerboeken */
ul#navVista li#computerboeken a { 
width:189px; 
height:20px; 
background-position:0 -368px; 
} 
ul#navVista li#computerboeken a:link, ul#navVista li#computerboeken a:visited { 
background-position:0 -368px;
} 
ul#navVista li#computerboeken a:hover, ul#navVista li#computerboeken a:focus, ul#navVista li#computerboeken a.active { 
background-position:-189px -368px;
}  
/* ouders */
ul#navVista li#ouders a { 
width:189px; 
height:46px; 
background-position:0 -388px;
} 
ul#navVista li#ouders a:link, ul#navVista li#ouders a:visited { 
background-position:0 -388px; 
} 
ul#navVista li#ouders a:hover, ul#navVista li#ouders a:focus, ul#navVista li#ouders a.active { 
background-position:-189px -388px; 
} 



/* navigation structure Foto (one sprite img)*/
ul#navFoto { 
position: absolute;
top:166px; 
left:-20px;
width:186px; 
height:378px; 
text-align:center;
}

ul#navFoto li {
padding:0; 
margin:0; 
list-style-type:none; 
text-indent:-9999px; 
display:inline; /* Fixes the IE double margin bug */
} 

ul#navFoto li a { 
border:0; 
text-decoration:none; 
display:block; 
background: url(../foto/images/steppie_en_stella.gif) no-repeat; 
} 

/**** the menu items, each have their own specific ID *******
/* steppie and stella */
ul#navFoto li#steppie_stella a { 
width:186px; 
height:189px; 
} 
ul#navFoto li#steppie_stella a:link, ul#navFoto li#steppie_stella a:visited { 
background-position:0 0; 
} 
ul#navFoto li#steppie_stella a:hover, ul#navFoto li#steppie_stella a:focus { 
background-position:-186px 0; 
}  

/* start */
ul#navFoto li#start a { 
width:186px; 
height:24px; 
background-position:0 -189px; 
} 
ul#navFoto li#start a:link, ul#navFoto li#start a:visited { 
background-position:0 -189px;
} 
ul#navFoto li#start a:hover, ul#navFoto li#start a:focus, ul#navFoto li#start a.active { 
background-position:-186px -189px;; 
} 

/* testjezelf */
ul#navFoto li#testjezelf a { 
width:186px; 
height:23px; 
background-position:0 -213px;  
} 
ul#navFoto li#testjezelf a:link, ul#navFoto li#testjezelf a:visited { 
background-position:0 -213px; 
} 
ul#navFoto li#testjezelf a:hover, ul#navFoto li#testjezelf a:focus, ul#navFoto li#testjezelf a.active { 
background-position:-186px -213px;  
} 

/* programma */
ul#navFoto li#programma a { 
width:186px; 
height:23px; 
background-position:0 -236px;
} 
ul#navFoto li#programma a:link, ul#navFoto li#programma a:visited { 
background-position:0 -236px;
} 
ul#navFoto li#programma a:hover, ul#navFoto li#programma a:focus, ul#navFoto li#programma a.active { 
background-position:-186px -236px; 
}  

/* woordenboek */
ul#navFoto li#woordenboek a { 
width:186px; 
height:28px; 
background-position:0 -259px; 
} 
ul#navFoto li#woordenboek a:link, ul#navFoto li#woordenboek a:visited { 
background-position:0 -259px; 
} 
ul#navFoto li#woordenboek a:hover, ul#navFoto li#woordenboek a:focus, ul#navFoto li#woordenboek a.active { 
background-position:-186px -259px; 
} 

/* computerweetjes */
ul#navFoto li#computerweetjes a { 
width:186px; 
height:23px; 
background-position:0 -287px; 
} 
ul#navFoto li#computerweetjes a:link, ul#navFoto li#computerweetjes a:visited { 
background-position:0 -287px; 
} 
ul#navFoto li#computerweetjes a:hover, ul#navFoto li#computerweetjes a:focus, ul#navFoto li#computerweetjes a.active { 
background-position:-186px -287px; 
}
  
/* computerboeken */
ul#navFoto li#computerboeken a { 
width:186px; 
height:24px; 
background-position:0 -310px; 
} 
ul#navFoto li#computerboeken a:link, ul#navFoto li#computerboeken a:visited { 
background-position:0 -310px;
} 
ul#navFoto li#computerboeken a:hover, ul#navFoto li#computerboeken a:focus, ul#navFoto li#computerboeken a.active { 
background-position:-186px -310px;
}  
/* ouders */
ul#navFoto li#ouders a { 
width:186px; 
height:44px; 
background-position:0 -334px;
} 
ul#navFoto li#ouders a:link, ul#navFoto li#ouders a:visited { 
background-position:0 -334px; 
} 
ul#navFoto li#ouders a:hover, ul#navFoto li#ouders a:focus, ul#navFoto li#ouders a.active { 
background-position:-186px -334px; 
} 



/* navigation structure Websites (one sprite img)*/
ul#navWebsites { 
position: absolute;
top:166px; 
left:-20px;
width:186px; 
height:416px; 
text-align:center;
}

ul#navWebsites li {
padding:0; 
margin:0; 
list-style-type:none; 
text-indent:-9999px; 
display:inline; /* Fixes the IE double margin bug */
} 

ul#navWebsites li a { 
border:0; 
text-decoration:none; 
display:block; 
background: url(../websites/images/steppie_en_stella.gif) no-repeat; 
} 

/**** the menu items, each have their own specific ID *******
/* steppie and stella */
ul#navWebsites li#steppie_stella a { 
width:186px; 
height:195px; 
} 
ul#navWebsites li#steppie_stella a:link, ul#navWebsites li#steppie_stella a:visited { 
background-position:0 0; 
} 
ul#navWebsites li#steppie_stella a:hover, ul#navWebsites li#steppie_stella a:focus { 
background-position:-186px 0; 
}  

/* start */
ul#navWebsites li#start a { 
width:186px; 
height:24px; 
background-position:0 -196px; 
} 
ul#navWebsites li#start a:link, ul#navWebsites li#start a:visited { 
background-position:0 -196px;
} 
ul#navWebsites li#start a:hover, ul#navWebsites li#start a:focus, ul#navWebsites li#start a.active { 
background-position:-186px -196px;
} 

/* testjezelf */
ul#navWebsites li#testjezelf a { 
width:186px; 
height:25px; 
background-position:0 -219px;  
} 
ul#navWebsites li#testjezelf a:link, ul#navWebsites li#testjezelf a:visited { 
background-position:0 -219px; 
} 
ul#navWebsites li#testjezelf a:hover, ul#navWebsites li#testjezelf a:focus, ul#navWebsites li#testjezelf a.active { 
background-position:-186px -219px;  
} 

/* leukewebsites */
ul#navWebsites li#leukewebsites a { 
width:186px; 
height:25px; 
background-position:0 -244px;  
} 
ul#navWebsites li#leukewebsites a:link, ul#navWebsites li#leukewebsites a:visited { 
background-position:0 -244px; 
} 
ul#navWebsites li#leukewebsites a:hover, ul#navWebsites li#leukewebsites a:focus, ul#navWebsites li#leukewebsites a.active { 
background-position:-186px -244px;  
} 

/* programma */
ul#navWebsites li#programma a { 
width:186px; 
height:25px; 
background-position:0 -269px;
} 
ul#navWebsites li#programma a:link, ul#navWebsites li#programma a:visited { 
background-position:0 -269px;
} 
ul#navWebsites li#programma a:hover, ul#navWebsites li#programma a:focus, ul#navWebsites li#programma a.active { 
background-position:-186px -269px; 
}  

/* woordenboek */
ul#navWebsites li#woordenboek a { 
width:186px; 
height:26px; 
background-position:0 -294px; 
} 
ul#navWebsites li#woordenboek a:link, ul#navWebsites li#woordenboek a:visited { 
background-position:0 -294px; 
} 
ul#navWebsites li#woordenboek a:hover, ul#navWebsites li#woordenboek a:focus, ul#navWebsites li#woordenboek a.active { 
background-position:-186px -294px; 
} 

/* extra */
ul#navWebsites li#extra a { 
width:186px; 
height:27px; 
background-position:0 -320px; 
} 
ul#navWebsites li#extra a:link, ul#navWebsites li#extra a:visited { 
background-position:0 -320px; 
} 
ul#navWebsites li#extra a:hover, ul#navWebsites li#extra a:focus, ul#navWebsites li#extra a.active { 
background-position:-186px -320px; 
}

/* computerweetjes */
ul#navWebsites li#computerweetjes a { 
width:186px; 
height:23px; 
background-position:0 -347px; 
} 
ul#navWebsites li#computerweetjes a:link, ul#navWebsites li#computerweetjes a:visited { 
background-position:0 -347px; 
} 
ul#navWebsites li#computerweetjes a:hover, ul#navWebsites li#computerweetjes a:focus, ul#navWebsites li#computerweetjes a.active { 
background-position:-186px -347px; 
}
  
/* computerboeken */
ul#navWebsites li#computerboeken a { 
width:186px; 
height:24px; 
background-position:0 -370px; 
} 
ul#navWebsites li#computerboeken a:link, ul#navWebsites li#computerboeken a:visited { 
background-position:0 -370px;
} 
ul#navWebsites li#computerboeken a:hover, ul#navWebsites li#computerboeken a:focus, ul#navWebsites li#computerboeken a.active { 
background-position:-186px -370px;
}  
/* ouders */
ul#navWebsites li#ouders a { 
width:186px; 
height:22px; 
background-position:0 -394px;
} 
ul#navWebsites li#ouders a:link, ul#navWebsites li#ouders a:visited { 
background-position:0 -394px; 
} 
ul#navWebsites li#ouders a:hover, ul#navWebsites li#ouders a:focus, ul#navWebsites li#ouders a.active { 
background-position:-186px -394px; 
} 


/*  Rt colum sub nav li */
#subnavRight {
margin-top: 170px;
margin-left: 10px;
}

#Rtnavlist {
padding-left: 0;
margin-left: 0;
border-bottom: 1px solid #a9a9a9;
width: 170px;
}

#Rtnavlist li {
list-style: none;
margin: 0;
padding: 0.25em;
border-top: 1px solid #a9a9a9;
}

#Rtnavlist li a { text-decoration: none; }

/* tekst div nietdoen */
#NietDoen_tekst {
position: absolute;
display: block;
top:170px;
	width:540px;
	height:250px;
	margin: 0;
	padding:0;
background-position: 0 0;
background-color:transparent;    
	overflow:hidden;	
}

/***** other Image mouser overs ******/
/* Studio Visual Steps logo*/
#svslogo , #svslogo:link {
display: block;
background-image: url(../images/svslogo.jpg); 
	width:235px;
	height:120px;
	margin: 0; padding:0;
text-indent: -9999em;
background-position: 0 0;  
}

#svslogo:hover {
background-position:  -235px 0;
}

/* voor kinderen*/
#vrkndr, #vrkndr:link {
display: block;
background-image: url(../images/voor_kinderen.gif); 
	width:500px;
	height:50px;
	margin: 0; padding:0;
text-indent: -9999em;
background-position: 0 0;   
}

#vrkndr:hover {
background-position:  0 -50px;
}

/* voor oefenbestanden*/
#oefenbestanden, #oefenbestanden:link {
display: block;
background-image: url(../images/oefenbestanden.gif); 
	width:360px;
	height:48px;
	margin: 0; padding:0;
text-indent: -9999em;
background-position: 0 0;   
}

#oefenbestanden:hover {
background-position:  0 -48px;
}


/* voor oefenbestanden2*/
#oefenbestanden2, #oefenbestanden2:link {
display: block;
background-image: url(../images/oefenbestanden2.gif); 
	width:300px;
	height:37px;
	margin: 0; padding:0;
text-indent: -9999em;
background-position: 0 0;   
}

#oefenbestanden2:hover {
background-position:  0 -37px;
}


/* page flip right side column */
#pageflip , #pageflip:link {
display: block;
background-image: url(../images/page_flip.jpg); 
	width:200px;
	height:260px;
	margin: 0 0 0 10px;
	padding:0;
text-indent: -9999em;
background-position: 0 0;   
}

#pageflip:hover {
background-position: -200px 0;
}

#bookRightCol {
position: absolute;
display: block;
top:210px;
padding-right:8px;
}



/* vista_boek */
#vista_boek , #vista_boek:link {
position: absolute;
display: block;
top:250px;
background-image: url(../images/vista_boek_groot.jpg); 
	width:175px;
	height:245px;
	margin: 10px 0 10px 15px;
	padding:0;
text-indent: -9999em;
background-position: 0 0;      
border:2px solid #ffffff;
}

#vista_boek:hover {
background-position: 0 0;    
border: 2px solid #00ADEE;
}

/* foto_boek */
#foto_boek , #foto_boek:link {
position: absolute;
display: block;
top:250px;
background-image: url(../images/foto_boek.jpg); 
	width:175px;
	height:245px;
	margin: 10px 15px 10px 0;
	padding:0;
text-indent: -9999em;
background-position: 0 0;      
border:2px solid #ffffff;
}

#foto_boek:hover {
background-position: 0 0;    
border: 2px solid #00ADEE;
}



/* ------------------------------ */
/* image container for horizontal floats 
/* ------------------------------ */
.imgContainer {
    /*display: inline-block;    
    min-width: 175px;*/ /* use when Firefox 3 come out, then omit float*/   
	float: left;
    width: 90px;
	height: 170px;
	margin: 0 10px 5px 0;
	padding: 5px;
	vertical-align:top;
	overflow:hidden;	
	/* without float */
}

/* necessary For horizontal stacking in IE7 */
*:first-child+html .imgContainer {
  display: inline;
}
/* necessary For horizontal stacking in IE6 only */
* html .imgContainer {
  display: inline;
}


.imgContainer .auteur {
/* product image inside floated container*/ 
	border:0;
}
.imgContainer .captionText {
clear:left;margin-top:0;padding-left:5px;
}  


/**** Shadow behind images****/
/* ------------------- */
.img-shadow {
  float:left;
  background: url(../images/shadowAlpha.png) no-repeat bottom right !important;
  background: url(../images/shadow.gif) no-repeat bottom right;
  margin: 15px 5px 0 10px !important;
  margin: 15px 5px 0 5px;
  }

.img-shadow img {
  display: block;
  position: relative;
  background-color: #fff;
  border: 1px solid #a9a9a9;
  margin: -6px 6px 6px -6px;
  padding: 4px;
} 


.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

