/*=== General ===*/
body {padding:0;margin:0;border: 0;background-color: #5974a3;padding-left: 325px;/* padding-left: 165px; */
font-family: Helvetica,Georgia,Arial;font-size: 100%;}
object,div,nav,#img-holder,#msgField,#bottomField,#msgCanvas,#myObject,footer,#content,#content-panes,canvas,svg {position: relative;float: left;display: block;margin:0;padding:0;border: 0;}

header {display: block;z-index: 1;position: fixed;left:0;top:0;width: 100%;}
#img-holder {width: 1000px;height: 346px;background: #4bb748 url('../images/headerIMG_5746-47.jpg') no-repeat center center;margin: 0;}

#content-panes {z-index: 2;margin:10px 0 0 0px;}
#contentpane {width: auto;height: 100%;min-height: 530px;}
#content {width: 100%;height: 100%;}

footer {clear: both !important;left:-160px;width:1115px;background-color: #333;color:#ff0;text-align: center;margin-top: 15px;}
/*=== Navigation ===*/
header .vloei {z-index: 125;position: fixed;left:20px;top:10px;width: 140px;height: 480px;background-color: #9FC2EA;opacity:0.4;}
nav {z-index: 150;position: fixed;left:20px;top: 10px;width: 140px;}
nav ul {width: 100px;border: 0px dotted red;margin: 5px 20px;padding: 115px 0 0 0;background: transparent url('../images/logo-space4chris-br100.jpg') no-repeat top center;}
nav #menu1,nav #menu2,nav #menu3 {display: block;text-align: center;color:#f88;background-color: #000;font-size: 1.5em;text-decoration: none;
margin:5px 0 0px 0;padding:2px;border: 1px solid black;border-radius: 10px;cursor: pointer;	text-shadow:1px 1px 1px #000;}
nav div {margin:0;padding:5px 0 0px 10px;background-color: #9FC2EA;}
nav li {width:100%;margin: 0px 0 5px 0;float:right;list-style-type: none;}
nav li a:link, nav li a:visited {width:100%;display: block;text-decoration: none;text-align: right; padding-right: 5px;color:#800;background-color: #ddd;font-size: 1.0em;
border: 1px solid black;border-radius: 5px;}
nav li a:hover,nav li a.current {color:#333;background-color: #F9CCCC;}
.hideme {visibility: hidden !important; width:0;}

h1.tuffy {font: 150% 'TuffyRegular', Arial, sans-serif;letter-spacing: 0; color: #C60066;}
/* #content .tuffy {font: 100% 'TuffyRegular', Arial, sans-serif;letter-spacing: 0; color: #000;} */

#butHome {display: block;position: absolute;margin: 5px 20px;width: 50px;height:50px;padding: 50px 0 0 50px;background-color: transparent;text-decoration: none;font-size: 0.8em;}
#myObject, .eindtekst { margin-left: 10px;clear: left;top: -50px;}
#msgCanvas,#playfield,#Floor,#svgfield,#svgfield2 {
 width:200px; height:200px;
 margin-left: auto; margin-right: auto; margin-bottom: 20px;
 border: 1px outset green;
 z-index: 10;
 box-shadow: 10px 10px 5px #888888;
}
canvas#Floor {width:600px;height:500px;padding-left: 5px;margin: 0 auto 20px auto;float: none;}
#msgField {position: fixed; top:346px;left:0px; width:165px;height:423px;background-color: #9FC2EA;color:black;z-index: 0;}
#msgField svg{ float: none;width:100px;height:100px;margin:20px auto;}
#msgField h3 {display: block;text-align: right;margin: 43px 75px 2px 0px;	text-shadow:1px 1px 1px #fff;}
/* #myTekst{float: left;height:160px;width: 150px;margin-left: 5px;} */
#msgCanvas{float: left;height:160px;width: 150px;margin-left: 5px;background-color:#AFD2FA; }
#bottomField1,#bottomField2 {position: fixed; top: 569px; left: 165px; width:825px;height:200px;padding-left:10px;background-color: #9FC2EA;color:black;z-index: 0;}
#bottomField2 {top: 346px;height:223px;}
#sideField{position: fixed;left: 1000px; width:24px;height:800px;background-color: #333;color:#ff0;}

#extraField{position: fixed;left: 1025px; width:256px;height:768px;background-color: #AAA;color:#f00;z-index: 2;}
#extraField svg{height: 90px;margin: 60px 0 0 75px;}
svg .action {visibility: hidden;}
svg .action:hover {visibility: visible;}
svg .hover:hover {fill:yellow;}

.datumbox {width: 200px; height: 24px; float: right;margin-right: 5px; }
.eindtekst{margin-top: 100px;}
footer a{text-decoration: none;color:#cc0;font-size: 0.8em;}
footer a:hover{color:#eef;}
/*=== CONTENT ===*/
.spread {width: 100%;height: 100%;}
div.blue {position: absolute;height: 100%;width: 100%;background-color: #9FC2EA;z-index: 1;}
#content {border:0px solid red; font-size: 0.875em; overflow:hidden;z-index: 20; }
#content h2 {margin: 5px 5px 10px 5px;color: #fff; background-color: #000;text-align: center;border: 1px solid #000;border-radius: 5px;}
#content a {background-color:#9FC2EA;} 
.box { float: none;margin: 5px;padding:5px 20px;border:1px solid #000;background-repeat: no-repeat;background-color: #666;}
.box>p.eland {}
.box p.eland:before {
content:'//////////';
}
.box p.eland:after
{
	content:url('../images/eland estland.jpg');
	margin: 0 auto;float:none;
}
.grad {
	background:	-moz-linear-gradient(top, #4bb748 0%, #aed24c 38%, #ffffff 100%); /* firefox */
	background:	-webkit-gradient(linear, left top, left bottom, color-stop(0%,#4bb748), color-stop(38%,#aed24c), color-stop(100%,#ffffff)); /* webkit */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4bb748', endColorstr='#ffffff',GradientType=0 ); /* ie */
	background:	-o-linear-gradient(top, #4bb748 0%,#aed24c 38%,#ffffff 100%); /* opera */	
}
#longpicture { width: 800px;height: 454px;padding: 0;background: transparent url('../images/IJsel_herfst_2010.jpg') no-repeat 0 center;}
.shiftL {left:-150px;}
#content p {text-align: center;}
#content p button {padding: 5px 20px; font-size: 1.5em; background-color: #4bb748;margin-left: 50px;color: #ffffff;}

.grad2 {
 /* fallback DIY*/
 /* Safari 4-5, Chrome 1-9 */
   	background: -webkit-gradient(linear, left top, right top, from(#2F2727), color-stop(0.05, #1a82f7), color-stop(0.5, #2F2727), color-stop(0.95, #1a82f7), to(#2F2727));
 /* Safari 5.1+, Chrome 10+ */  background: -webkit-linear-gradient(left, #2F2727, #1a82f7 5%, #2F2727, #1a82f7 95%, #2F2727);
 /* Firefox 3.6+ */ 			background:    -moz-linear-gradient(left, #5974a3, #ccc4c1 5%, #5974a3, #ccc4c1 95%, #5974a3);
 /* IE 10 */ 					background:     -ms-linear-gradient(left, #2F2727, #1a82f7 5%, #2F2727, #1a82f7 95%, #2F2727);
 /* Opera 11.10+ */			 	background:      -o-linear-gradient(left, #2F2727, #1a82f7 5%, #2F2727, #1a82f7 95%, #2F2727);
}

#home {width:468px;height:408px;background: LightBlue url('../images/Globe-Planet-Earth-Animals-780499.jpg') no-repeat center 60px;}
#home:hover {background-image:url('../images/Globe-Planet-Earth-Animals-780498.jpg'); }
#home span {display: block;margin: 0 auto 300px auto;color: Blue;width: 300px;font-size: 1.5em;}
     
     