/*200716*/
/*5-12-2014
*/
/*20-11-2014
	res slides width en height 
	'standaard content height 600px 
*/
/*10-11-2014
		? eigenschap width bestaat niet voor media screen
*/
/*05-11-2014
	uitbreiding res-style
	reparatie: breed en laag: positie naw 
*/
/*17-10-2014
	valign content+footer
*/
/*8-10-2014
	responsive style nog uitbreiden en aanpassen
	wel css3 niet 2.1 valide
*/

/*For larger displays*/
@media screen and (min-width:1279px) {
#all { /*background-color: yellowgreen;*/ width: 1280px;}
	#content { height: 750px; }
	#main { margin-top: -750px;}
table.index{	margin-top:0.8%;}
}

/*breed en laag, lager dan 800, bijv  1200x800,  1366 x 669 - 1440x782*/
@media screen and (min-width:1024px) and  (max-height:800px){
	#all{ /*background-color: yellow;*/ width: 1100px;}	
	#content { height: 650px; }
	#main{background-size:60%; 	margin-top: -650px;}
		body{ font-size:92%;} 
		}
/*1024 x 768*/
@media screen and (min-width:801px) and (max-width: 1024px) {
	#all{ /*background-color: pink;*/ width:1000px;}
		#content{ height:600px; }
		#main{background-size:70%; margin-top: -600px;}
		body{ font-size:86%;} 
 		p{	line-height:115%;}	
} 
/*smaller screen desk top*/
@media screen and (max-width: 800px){
#all{	 /*background-color: blue;*/	width: 100%;  margin: 0; }
#content{ height:500px; width: 100%; margin: 0; }
#main{background-size: 80%; 	margin-top: -500px; }
		body{ font-size:72%;} 
 		p{	line-height:115%;}	
 		#side{ font-size: 106%;} 
 		#side #naw{ margin-top: 2%;}
 		#footer{ margin-top: 0%;}
 		#footer p.noprint{ color:#666; margin-top:-100%; padding: 0px;} /*vertical-align: text-top;8/ }/*make colofon link visible*/
		#footer a{ height: 40px; padding-bottom:   40px; vertical-align: super; min-width: 40px; z-index: 1;} 
#movie object.mmovie, #movie object.wmovie, #movie object.fmovie{ height: 260px;}		
#movie object.mmovie{ width:379px;}
#movie object.wmovie{ width:346px;}
#movie object.fmovie{ width:406px;}
		}
/**/
@media screen and (max-device-width:768px) {
	#all{	 /*background-color: purple;*/ width: 100%;  margin: 0; }
	#content{ height:500px; width: 100%; margin: 0; }
	#main{background-size: 80%; 	margin-top: -500px; }
		body{ font-size:72%;} 
 		p{	line-height:115%;}	
 		#side{ font-size: 106%;} 
 		#side #naw{ margin-top: 2%;}
  		#footer{ margin-top: 0%;}
 		#footer p.noprint{ color:#666; margin-top:-100%; padding: 0px;} /*vertical-align: text-top;8/ }/*make colofon link visible*/
		#footer a{ height: 40px; padding-bottom:   40px; vertical-align: super; min-width: 40px; z-index: 1; }
}

@media screen and (max-device-width:800px) {
#all{	 /*background-color: orange;*/	width: 100%;  margin: 0; }
#content{ height:500px; width: 100%; margin: 0; }
#main{background-size:80%; 	margin-top: -500px; }
		body{ font-size:72%;} 
 		p{	line-height:115%;}	
 		#side{ font-size: 106%;} 
 		#side #naw{ margin-top: 2%;}
  		#footer{ margin-top: 0%;}
 		#footer p.noprint{ color:#666; margin-top:-100%; padding: 0px;} /*vertical-align: text-top;8/ }/*make colofon link visible*/
		#footer a{ height: 40px; padding-bottom:   40px; vertical-align: super; min-width: 40px; z-index: 1; }
}

@media screen and (max-device-width:1024px){
	#all{ /*background-color: greenyellow;*/}
		#content{ height:600px; width: 100%; margin: 0;}
		#main{background-size:70%; 	margin-top: -600px;}
		body{ font-size:86%;} 
 		p{	line-height:115%;}	
 		#side #naw{ margin-top: 0;}
} 
/*test voor very small screen  handheld oid*/
@media screen and (max-width: 480px){
	#valign{ display: inline-block;}	
	#content{height: 800px; position: fixed;}
	#main{ background-position:50% 5%;  background-size: 60%; margin-top:-800px;} 
	}
@media screen and (max-device-width: 480px){
	#valign{ display: inline-block;}	
	#content{ height: 800px; position: fixed;}
	#main{ background-position:50% 5%;  background-size: 60%; margin-top:-800px;}
	}