/* ALGEMEEN */
*{
	padding: 0px;
	margin: 0px;
	text-decoration: none;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}

img{
	border: none;
}

body{
	background: url(../images/backgroundTop.jpg) repeat-x;
	background-color: black;
	height: 100%;
}

html, body {
	height: 100%;
}

#completeBox{
	margin: 0 auto;
	width: 1003px; /* xmas: 1203px */
}

#shadowLeft{
	width: 50px; /* xmas: 150px */
	height: 400px;
	position: relative;
	background: url(../images/backgroundShadowLeftTop.jpg); /* xmax: ../images/backgroundShadowLeftTop_Xmas.jpg */
	float: left;
}

#shadowRight{
	width: 50px; /* xmas: 150px */
	height: 400px;
	background: url(../images/backgroundShadowRightTop.jpg); /* origineel: ../images/backgroundShadowRightTop.jpg */
	margin-left: 950px; /* xmas: 1050px */
	margin-top: 0px;
}

#page{
	width: 900px;
	height: 100%;
	margin-top: 0px;
	background-color: #404040;
	float: left;
}

/* HEADER */

h1{
	height: 115px;
	text-indent: -5000px;
	background: url(../images/header.jpg) no-repeat; /* origineel: ../images/header.jpg */
}

h1 a{
	display: block;
	height: 115px;
	width: 900px;
}


/* MENU */
#hoofdMenu{
	width: 900px;
	height: 31px;
	margin-bottom: 15px;
	background-color: #4D4D4D;
}

#hoofdMenu ul{
	height: 31px;
	width: 605px;
	margin: 0 auto;
	list-style: none;
	border-right: 1px solid #404040;
}

#hoofdMenu ul li{
	float: left;
}

#hoofdMenu ul li a{
	display: block;
	width: 120px;
	padding-top: 9px;
	padding-bottom: 9px;
	text-align: center;
	background: #4D4D4D;
	color: white;
	font-size: 11px;
	border-left: 1px solid #404040;
}

#hoofdMenu ul li a:hover{
	background: #6B6B6B;
}

#hoofdMenu ul li a:hover{
	background: #6B6B6B;
}

#hoofdMenu ul li #activePage a{
	background: #404040;
	font-weight: bold;
}



/* ########## HOME ########## */

/* LINKER KOLOM */

#linkerKolom{
	/*background: url(../images/sideLineLeft.jpg) repeat-y;*/
	margin-left: 5px;
	width: 200px;
	height: 700px;
	float: left;
}

#linkerKolom h3{
	background: url(../images/sideBoxTop.jpg) no-repeat;
	height: 42px;
	padding-top: 13px;
	padding-left: 16px;
	font-size: 12px;
	color: white;
	font-weight: bold;
}

#linkerKolom .content{
	margin-top: -15px;
	background: url(../images/sideBoxMiddle.jpg) repeat-y;
	font-size: 11px;
	padding-left: 15px;
	padding-right: 15px;
	padding-bottom: 1px;
}

#linkerKolom #featuring .content {
	text-align: center;
}

#linkerKolom #featuring a{
	color: #FFA500;
}

#linkerKolom #featuring p{
	margin-bottom: 10px;
}

#linkerKolom #featuring a:hover{
	text-decoration: underline;
}

#linkerKolom #comingSoon p{
	color: Silver;
}

#linkerKolom #comingSoon a{
	color: #FFA500;
}

#linkerKolom #comingSoon a:hover{
	text-decoration: underline;
}

.sideBoxBottom{
	height: 15px;
	width: 200px;
	background: url(../images/sideBoxBottom.jpg) no-repeat;
}

#linkerKolom img{
	border: none;
}


/* MIDDEN KOLOM */

#middenKolom{
	width: 480px;
	padding-left: 5px;
	padding-right: 5px;
	float: left;
	margin-top: 0px;
	font-size: 11px;
}

#middenKolom h3{
	background: url(../images/middleBoxTop.jpg) no-repeat;
	height: 42px;
	padding-top: 13px;
	padding-left: 16px;
	font-size: 12px;
	color: white;
	font-weight: bold;
}

#middenKolom .content{
	background: url(../images/middleBoxMiddle.jpg) repeat-y;
	margin-top: -15px;
	padding-left: 15px;
	padding-right: 15px;
	padding-bottom: 1px; /* aansluiten onderkan aan midden */
	color: silver;
}

#middenKolom .content a{
	color: #FFA500;
}

#middenKolom .content a:hover{
	text-decoration: underline;
}

#middenKolom .newsTitle{
	display: block;
	width: 445px;
	height: 15px;
	background-color: #545454;
	margin-bottom: 10px;
}

#middenKolom h4{
	display: block;
	height: 15px;
	font-size: 12px;
	color: silver;
	padding-left: 26px;
	background: url(../images/newsPic.jpg) no-repeat;
}

#middenKolom .date{
	font-style: italic;
	color: #8D8D8D;
	text-align: right;
	margin-top: -14px;
	margin-right: 5px;
	font-size: 10px;
}

#middenKolom .message{
	padding-left: 5px;
	padding-right: 10px;
}

#middenKolom .postedBy{
	font-size: 10px;
	color: #8D8D8D;
	text-align: right;
	margin-right: 5px;
	margin-top: 10px;
	margin-bottom: 15px;
}

#middenKolom .middleBoxBottom{
	margin-bottom: 5px;
	height: 15px;
	width: 480px;
	background: url(../images/middleBoxBottom.jpg) no-repeat;
}


/* RECHTER KOLOM */

#rechterKolom{
	height: 100%;
	background: url(../images/sideLineLeft.jpg) no-repeat;
	width: 200px;
	float: left;
	font-size: 11px;
}

#rechterKolom h3{
	background: url(../images/sideBoxTop.jpg) no-repeat;
	height: 42px;
	padding-top: 13px;
	padding-left: 16px;
	font-size: 12px;
	color: white;
	font-weight: bold;
}

#rechterKolom .content{
	color: silver;
	margin-top: -15px;
	padding-left: 15px;
	padding-right: 15px;
	background: url(../images/sideBoxMiddle.jpg) repeat-y;
	padding-bottom: 1px;
}

#rechterKolom #flashTutorials ul{
	list-style: none;
}

#rechterKolom #flashTutorials a{
	display: block;
	width: 150px;
	margin-bottom: 2px;
	padding-left: 12px;
	padding-right: 5px;
	color: #FFA500;
	background: url(../images/arrowBlack.png) no-repeat;
}

#rechterKolom #flashTutorials a:hover{
	background-color: #474747;
	color: silver;
}

#rechterKolom #flashPlayer p{
	text-align: center;
}

#rechterKolom #validations p{
	text-align: center;
	padding-top: 5px;
	margin-bottom: 5px;
}


/* ########## FOOTER ########## */
#spacer{
	clear: both;
	height: 50px; /*marge boven footer*/
}

#footer{
	clear: both;
	padding-top: 10px;
	width: 900px;
	text-align: center;
	font-size: 10px;
	background: url(../images/footer.jpg) no-repeat;
}

#footer p{
	z-index: 99;
	padding-bottom: 5px;
	color: gray;
}

#footer p a{
	color: Gray;
}

#footer p a:hover{
	color: #FFA500;
	text-decoration: underline;
}


/* ########## OBJECT ########## */

.objectGroup{
	width: 480px;
}

.object p{
	color: silver;
}

.object{
	float: left;
	margin-left: 5px;
}

.object strong{
	color: orange;
}

.object img{
	border: 2px solid silver;
	margin-right: 10px;
}

.object .uitleg{
	display: block;
	margin-left: 65px;
	margin-top: -54px;
}

.object a{
	color: silver;
	margin-top: 5px;
	display: block;
	width: 222px;
	height: 52px;
	padding: 5px;
	background-color: #333333;
}

.object a:hover{
	background-color: #535353;
}


/* ########## TOONS ########## */

#middenKolomToons{
	width: 480px;
	padding-top: 10px;
	padding-left: 5px;
	padding-right: 5px;
	height: 500px;
	float: left;
	font-size: 11px;
	
}

#middenKolomToons h2{
	text-indent: -5000px;
	width: 480px;
	height: 70px;
	background: url(../images/toonsHeader.jpg) no-repeat;
	margin-top: -7px;
}



/* ########## GAMES ########## */

#middenKolomGames{
	width: 480px;
	padding-top: 10px;
	padding-left: 5px;
	padding-right: 5px;
	height: 500px;
	float: left;
	font-size: 11px;
}

#middenKolomGames h2{
	text-indent: -5000px;
	width: 480px;
	height: 70px;
	background: url(../images/gamesHeader.jpg) no-repeat;
	margin-top: -7px;
}



/* ########## TUTORIALS ########## */

#middenKolomTutorials{
	width: 480px;
	padding-left: 5px;
	padding-right: 5px;
	height: 500px;
	float: left;
	margin-top: 0px;
	font-size: 11px;
}

#middenKolomTutorials h3{
	background: url(../images/middleBoxTop.jpg) no-repeat;
	height: 42px;
	padding-top: 13px;
	padding-left: 16px;
	font-size: 12px;
	color: white;
	font-weight: bold;
}

#middenKolomTutorials .content{
	background: url(../images/middleBoxMiddle.jpg) repeat-y;
	margin-top: -15px;
	padding-left: 15px;
	padding-right: 5px;
	padding-bottom: 1px; /* aansluiten onderkant aan midden */
	color: silver;
}

#middenKolomTutorials .content a{
	color: #FFA500;
}

#middenKolomTutorials .content a:hover{
	text-decoration: underline;
}

#middenKolomTutorials .title{
	display: block;
	width: 450px;
	height: 26px;
	background-color: #545454;
	margin-bottom: 10px;
}

#middenKolomTutorials h4{
	display: block;
	height: 26px;
	font-size: 12px;
	color: white;
	padding-left: 36px;
	padding-top: 5px;
	background: url(../images/tutorialsPic.jpg) no-repeat;
}

#middenKolomTutorials .download a{
	text-indent: -5000px;
	display: block;
	height: 20px;
	width: 120px;
	margin-top: -28px;
	margin-left: 327px;
	background: url(../images/watch.jpg) no-repeat;
	float: left;
}

#middenKolomTutorials .description{
	padding-left: 5px;
	padding-right: 10px;
	margin-bottom: 20px;
}

#middenKolomTutorials .description ul{
	margin-top: 5px;
	margin-left: 10px;
	list-style-type: none;
}

#middenKolomTutorials .description ul li{
	padding-left: 15px;
	background: url(../images/arrowBlack.png) no-repeat;
}

#middenKolomTutorials .middleBoxBottom{
	margin-bottom: 5px;
	height: 15px;
	width: 480px;
	background: url(../images/middleBoxBottom.jpg) no-repeat;
}


/* ########## DOWNLOADS ########## */

#middenKolomDownloads{
	width: 480px;
	padding-left: 5px;
	padding-right: 5px;
	height: 500px;
	float: left;
	margin-top: 0px;
	font-size: 11px;
}

#middenKolomDownloads h3{
	background: url(../images/middleBoxTop.jpg) no-repeat;
	height: 42px;
	padding-top: 13px;
	padding-left: 16px;
	font-size: 12px;
	color: white;
	font-weight: bold;
}

#middenKolomDownloads .content{
	background: url(../images/middleBoxMiddle.jpg) repeat-y;
	margin-top: -15px;
	padding-left: 15px;
	padding-right: 5px;
	padding-bottom: 1px; /* aansluiten onderkant aan midden */
	color: silver;
}

#middenKolomDownloads .content a{
	color: #FFA500;
}

#middenKolomDownloads .content a:hover{
	text-decoration: underline;
}

#middenKolomDownloads .title{
	display: block;
	width: 450px;
	height: 26px;
	background-color: #545454;
	margin-bottom: 10px;
}

#middenKolomDownloads h4{
	display: block;
	height: 26px;
	font-size: 12px;
	color: white;
	padding-left: 36px;
	padding-top: 5px;
	background: url(../images/downloadsPic.jpg) no-repeat;
}

#middenKolomDownloads .download .filesize{
	margin-top: -25px;
	margin-left: 210px;
	color: #FDC824;
	font-weight: bold;
	float: left;
}

#middenKolomDownloads .download a{
	text-indent: -5000px;
	display: block;
	height: 20px;
	width: 120px;
	margin-top: -28px;
	margin-left: 327px;
	background: url(../images/download.jpg) no-repeat;
	float: left;
}

#middenKolomDownloads .description{
	padding-left: 5px;
	padding-right: 10px;
	margin-bottom: 20px;
}

#middenKolomDownloads .description ul{
	margin-top: 5px;
	margin-left: 10px;
	list-style-type: none;
}

#middenKolomDownloads .description ul li{
	padding-left: 15px;
	background: url(../images/arrowBlack.png) no-repeat;
}

#middenKolomDownloads .middleBoxBottom{
	margin-bottom: 5px;
	height: 15px;
	width: 480px;
	background: url(../images/middleBoxBottom.jpg) no-repeat;
}

/* ########## ERROR ##########*/

#contentError p{
	margin-top: 50px;
	font-size: 11px;
	text-align: center;
	color: silver;
}

#contentError #errorPic{
	background: url(../images/404.jpg) no-repeat;
	height: 120px;
	width: 300px;
	margin-left: 500px;
	margin-top: 50px;
}


/* ########## WATCH / PLAY ########## */

#moviePic{
	margin-left: 20px;
	width: 100px;
	height: 60px;
	background: url(../images/movie.jpg) no-repeat;
	float: left;
}

#gamePic{
	margin-left: 20px;
	width: 100px;
	height: 60px;
	background: url(../images/game.jpg) no-repeat;
	float: left;
}

#tutorialPic{
	margin-left: 20px;
	width: 100px;
	height: 60px;
	background: url(../images/flashTypePic.jpg) no-repeat;
	float: left;
}

#contentWatch #objectInfo{
	clear: both;
	position: relative;
	padding: 5px;
	top: -58px;
	left: 115px;
	background-color: #373737;
	width: 760px;
	height: 46px;
}

#contentWatch #objectInfo h3{
	font-size: 12px;
	color: white;
	padding-bottom: 3px;
	margin-bottom: 3px;
	border-bottom: 1px dotted gray;
	width: 250px;
}

#contentWatch #objectInfo strong{
	color: orange;
}

#contentWatch #objectInfo p{
	color: silver;
	font-size: 11px;
}

#contentWatch #watchToons a{
	float: left;
	height: 40px;
	width: 120px;
	margin-left: 630px;
	margin-top: -44px;
	background: url(../images/watchOtherToons.jpg) no-repeat;
}

#contentWatch #watchGames a{
	float: left;
	height: 40px;
	width: 120px;
	margin-left: 630px;
	margin-top: -44px;
	background: url(../images/playOtherGames.jpg) no-repeat;
}

#contentWatch #moreTuts a{
	float: left;
	height: 40px;
	width: 120px;
	margin-left: 630px;
	margin-top: -31px;
	background: url(../images/moreTuts.jpg) no-repeat;
}

#contentWatch #movie{
	position: relative;
	top: -40px;
	clear: both;
	text-align: center;
	border-top: 10px solid #1E1E1E;
	border-bottom: 10px solid #1E1E1E;
	padding-top: 15px;
	padding-bottom: 15px;
	background: url(../images/grip.jpg);
}