/*
// @@@
// @@ Author: Nicky Klaasse
// @@ Date: 01-02-2010
// @@ Last change: 01-02-2010
// @@ Version: 1.0
// @@ Copyright: Freshcoat.nl
// @@@
*/



html {
 height: 100%;
 background: #f8ffdc url('images/htmlBg.gif') top center repeat-x;
}

body {
 font: 12px Arial, Helvetica, sans-serif;
 height:100%;
 margin:0px auto;
 padding:0px;
}
body a {
 outline:none;	
}

#main {
 width: 911px;
 height:100%;
 margin: 0px auto;
 padding:0px 0px 0px 10px;
}


/* Header */
#header
{
float:left;
display:inline;
width:912px;
height:auto;
margin:0px;
padding:0px;
}

#topHeader
{
float:left;
display:inline;
width:905px;
height:auto;
margin:0px 0px 0px 1px;
padding:0px;
}


/* Site logo */
#header #topHeader #siteLogo
{
float:left;
display:inline;
height:75px;
margin:0px;
padding:0px;
}
#header #topHeader #siteLogo a, img
{
border:none;
}
/* End site logo */


/* Top navigatie */
#header #topHeader ul
{
float:right;
display:inline;
list-style:none;
width:477px;
height:42px;
margin:26px 0px 0px 0px;
padding:0px 0px 0px 170px;
background:url('images/topNav.gif') no-repeat;
}
#header #topHeader ul li
{
float:left;
display:inline;
margin:0px 13px 0px 0px;
padding:0px;
}
#header #topHeader ul li a
{
float:left;
display:inline;
height:33px;
text-indent:-999999px;
margin:0px;
padding:9px 0px 0px 0px;
}
#header #topHeader ul li a:hover
{
background:url('images/topNavHover.gif') 52% 0% no-repeat;
}
#header #topHeader ul li a#beginpagina
{
width:118px;
}
#header #topHeader ul li a#favorieten
{
width:102px;
}
#header #topHeader ul li a#speloverzicht
{
width:129px;
}
#header #topHeader ul li a#help
{
width:40px;
}
#header #topHeader ul li a.active
{
float:left;
display:inline;
height:33px;
text-indent:-999999px;
margin:0px;
padding:9px 0px 0px 0px;
background:url('images/topNavHover.gif') 52% 0% no-repeat;
}
/* End top navigatie */


#bottomHeader
{
float:left;
display:inline;
width:884px;
height:139px;
margin:-7px 0px 0px 0px;
padding:0px 0px 0px 22px;
background:url('images/containerBottomHeader.gif') no-repeat;
}

/* Search form */
#bottomHeader form#search
{
float:left;
display:inline;
width:330px;
height:31px;
margin:0px;
padding:0px;
}
#bottomHeader form#search p
{
float:left;
display:inline;
margin:0px;
padding:0px;
}
#bottomHeader form#search label#searchLabel
{
float:left;
display:inline;
width:119px;
height:16px;
text-indent:-999999px;
margin:8px 0px 0px 10px;
padding:0px;
background:url('images/searchLabel.gif') no-repeat;
}
#bottomHeader form#search input#searchInput
{
float:left;
display:inline;
width:164px;
height:20px;
color:#beb77c;
border:none;
margin:6px 0px 0px 5px;
padding:2px 0px 0px 2px;
background:url('images/searchInput.gif') no-repeat;
}
#bottomHeader form#search input#searchSubmit
{
float:left;
display:inline;
margin:6px 0px 0px 0px;
padding:0px;
}
/* End search form */


/* Populaire spellen */
#bottomHeader h2
{
float:right;
display:inline;
width:213px;
height:16px;
text-indent:-999999px;
overflow:hidden;
margin:9px 30px 0px 0px;
padding:0px;
background:url('images/headingPopulaireSpellen.gif') no-repeat;
}

#mostPolulair
{
float:left;
display:inline;
width:862px;
margin:0px;
padding:0px;
}
#bottomHeader #mostPolulair .topGame
{
float:left;
display:inline;
width:130px;
margin:10px 0px 0px 10px;
padding:0px;
}
#bottomHeader #mostPolulair .topGame img
{
border:1px solid #000000;	

}
#bottomHeader #mostPolulair .topGame .gamePreview
{
float:left;
display:inline;
margin:0px;
padding:0px;
z-index:1;
}
#bottomHeader #mostPolulair .topGame .balloon
{
float:left;
display:inline;
height:44px;
width:59px;
margin:44px 0px 0px -38px;
padding:0px;
z-index:99;
}
#bottomHeader #mostPolulair .topGame .one
{
background:url('images/balloon1.png') no-repeat;
_background: none;
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod='crop', src='images/balloon1.png');
}
#bottomHeader #mostPolulair .topGame .two
{
background:url('images/balloon2.png') no-repeat;
_background: none;
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod='crop', src='images/balloon2.png');
}
#bottomHeader #mostPolulair .topGame .three
{
background:url('images/balloon3.png') no-repeat;
_background: none;
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod='crop', src='images/balloon3.png');
}
#bottomHeader #mostPolulair .topGame .four
{
background:url('images/balloon4.png') no-repeat;
_background: none;
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod='crop', src='images/balloon4.png');
}
#bottomHeader #mostPolulair .topGame .five
{
background:url('images/balloon5.png') no-repeat;
_background: none;
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod='crop', src='images/balloon5.png');
}

#bottomHeader #mostPolulair ul
{
float:left;
display:inline;
width:150px;
margin:10px 0px 0px 10px;
padding:0px;
}
#bottomHeader #mostPolulair ul li
{
float:left;
display:inline;
line-height:16px;
width:150px;
margin:0px;
padding:0px;
}
#bottomHeader #mostPolulair ul li a
{
float:left;
display:inline;
color:#7e7211;
margin:0px;
padding:0px;
text-decoration:none;
}
#bottomHeader #mostPolulair ul li a:hover
{
text-decoration:underline;
}
#bottomHeader #mostPolulair ul li span
{
float:left;
display:inline;
color:#7e7211;
margin:0px 5px 0px 0px;
padding:0px;
font-weight:bold;
}

/* End populaire spellen */


/* End header */


/* Content container */
#container
{
float:left;
display:inline;
width:895px;
margin:0px;
padding:0px 0px 10px 18px;
background:url('images/contentContainer.gif') repeat-y;
}
#content
{
float:left;
display:inline;
width:870px;
margin:0px;
padding:0px;

background:url('images/contentGradient.gif') repeat-x;
}

.text
{
float:left;
display:inline;
width:850px;
margin:5px 0px 0px 10px;
padding:0px 0px 10px 0px;
}
.text p
{
display:block;
color:#7E7211;
line-height:18px;
margin:10px 10px 0px 0px;
padding:0px;
}

hr.dotted
{
display:block;
margin:10px 0px 0px 0px;
padding:0px;
height:1px;
overflow:hidden;
font-size:1px;
border:none;
background:url('images/hr.gif') no-repeat;
}

/* End content container */


/* Game lists */
.listBox
{
float:left;
display:inline;
width:205px;
margin:10px 0px 0px 10px;
padding:0px;
}

ul.gameList
{
float:left;
display:inline;
list-style:none;
width:205px;
margin:0px;
padding:0px;
}
ul.gameList li
{
float:left;
display:inline;
width:205px;
margin:0px;
padding:0px;
}
ul.gameList li a
{
float:left;
display:inline;
height:22px;
color:#000000;
width:170px;
text-decoration:none;
margin:0px;
padding:8px 0px 0px 0px;
}
ul.gameList li a:hover
{
text-decoration:underline;
}
ul.gameList li span
{
float:left;
display:inline;
height:22px;
color:#000000;
font-weight:bold;
margin:0px 5px 0px 10px;
padding:8px 0px 0px 0px;
}

/* List color's */
ul.blue
{
margin:0px 0px 0px 0px;
background:url('images/blueRowList.gif') repeat-y;
}
ul.pink
{
margin:0px 0px 0px 0px;
background:url('images/pinkRowList.gif') repeat-y;
}
ul.green
{
margin:0px 0px 0px 0px;
background:url('images/greenRowList.gif') repeat-y;
}
ul.orange
{
margin:0px 0px 0px 0px;
background:url('images/orangeRowList.gif') repeat-y;
}
/* End list color's */


/* List headers and footers */
.listHeader
{
float:left;
display:inline;
width:205px;
height:34px;
margin:0px;
padding:0px;
}
.blueHeader
{
background:url('images/blueListHeader.gif') no-repeat;
}
.pinkHeader
{
background:url('images/pinkListHeader.gif') no-repeat;
}
.greenHeader
{
background:url('images/greenListHeader.gif') no-repeat;
}
.orangeHeader
{
background:url('images/orangeListHeader.gif') no-repeat;
}

.listHeader h2
{
float:left;
display:inline;
color:#fff;
font-size:14px;
margin:8px 0px 0px 10px;
padding:0px;
}

.listFooter
{
float:left;
display:inline;
width:205px;
height:32px;
margin:0px;
padding:0px;
}
.listFooter a
{
float:left;
display:inline;
color:#fff;
font-weight:bold;
text-decoration:none;
margin:8px 0px 0px 10px;
padding:0px;
}
.listFooter a:hover
{
text-decoration:underline;
}
.blueFooter
{
background:url('images/blueListFooter.gif') no-repeat;	
}
.pinkFooter
{
background:url('images/pinkListFooter.gif') no-repeat;	
}
.greenFooter
{
background:url('images/greenListFooter.gif') no-repeat;	
}
.orangeFooter
{
background:url('images/orangeListFooter.gif') no-repeat;	
}

/* End list headers and footers */


/* End game lists */

#ad{
	width:650px;
	height:568px;
	font:11px Tahoma, Verdana, Arial, Helvetica, sans-serif;
	text-align:center;
}
#game{
	width:650px;
	height:568px;
	display:none;
}

#klik {
	font:11px Tahoma, Verdana, Arial, Helvetica, sans-serif;
	display:none;

}

/* Ads bar */
#adsBar
{
float:left;
display:inline;
height:121px;
width:788px;
margin:8px 0px 0px 6px;
padding:15px 0px 0px 70px;
background:url('images/adsBar.gif') no-repeat;
}

#adsBarRight
{
float:right;
display:inline;
height:644px;
width:200px;
margin:10px 7px 0px 0px;
padding:0px 0px 0px 0px;
background:url('images/adsBarRight.gif') no-repeat;
}

/* End ads bar*/



/* Game console */
#gameConsole
{
float:left;
display:inline;
width:650px;
margin:10px 0px 0px 7px;
padding:0px;
}
#gameConsoleHeader
{
float:left;
display:inline;
width:650px;
height:53px;
margin:0px 0px 1px 0px;
padding:0px;
background:url('images/gameHeader.gif') no-repeat;
}
#gameConsoleHeader h1
{
float:left;
display:inline;
color:#fff;
font-weight:100;
font-size:22px;
margin:13px 0px 0px 10px;
padding:0px;
}
/* End game console */


/* About this game */
#about
{
float:left;
display:inline;
width:318px;
height:auto;
margin:7px 0px 0px 7px;
padding:0px;
background:#e1eef0 url('images/topAbout.gif') no-repeat;	
}
#aboutInner
{
float:left;
display:inline;
width:318px;
height:auto;
min-height:145px;
margin:0px 0px 0px 0px;
padding:0px 0px 30px 0px;
background:url('images/footerAbout.gif') 0% 100% no-repeat;	
}
#aboutInner h3
{
display:block;
color:#44a1b0;
font-size:16px;
margin:10px 0px 0px 10px;
padding:0px;
}
#aboutInner p
{
display:block;
color:#125762;
font-size:12px;
line-height:18px;
margin:10px 0px 0px 10px;
padding:0px;
}
/* End about this game */

/* More games */
#moreGames
{
float:left;
display:inline;
width:650px;
height:171px;
margin:7px 0px 0px 7px;
padding:0px;
background:url('images/moreGames.gif') no-repeat;	
}
#moreGames h4
{
display:block;
color:#ed8b0d;
font-size:16px;
margin:10px 0px 0px 10px;
padding:0px;
}
.gameBoxOrange
{
float:left;
display:inline;
width:119px;
height:114px;
margin:10px 20px 0px 10px;
padding:0px;
background:url('images/gameBoxOrange.gif') no-repeat;	
}
.gameBoxOrange img
{
float:left;
display:inline;
margin:9px 0px 0px 9px;
padding:0px;
border:none;
}
.gameBoxOrange span
{
float:left;
display:inline;
width:119px;
text-align:center;
color:#472f0f;
margin:5px 0px 0px 0px;
padding:0px;	
}
/* End more games */


/* Tell a friend */
#tellAFriend
{
float:left;
display:inline;
width:318px;
height:175px;
margin:7px 0px 0px 7px;
padding:0px;
background:url('images/tellAFriendBg.gif') no-repeat;	
}
#tellAFriend h3
{
display:block;
color:#95bd1c;
font-size:16px;
margin:10px 0px 0px 10px;
padding:0px;
}
#tellAFriend p
{
display:block;
margin:0px;
padding:0px;
}

form p .textInput
{
float:left;
display:inline;
width:287px;
height:23px;
color:#95bd1c;
margin:7px 0px 0px 10px;
padding:7px 3px 0px 4px;
border:none;
background:url('images/tellAFriendInput.gif') no-repeat;	
}
form p .mailSubmit
{
float:right;
display:inline;
margin:7px 14px 0px 0px;
padding:0px;
}
/* /Tell a friend */


/* Footer */
#footer
{
float:left;
display:inline;
width:905px;
height:81px;
padding:0px;
margin:0px 0px 0px -1px;
background:url('images/footer.gif') no-repeat;
}
#footerInner
{
float:left;
display:inline;
width:100%;
padding:0px;
margin:0px;
}
#footerInner a.siteLogoFooter
{
float:left;
display:inline;
width:185px;
height:35px;
text-indent:-999999px;
padding:0px;
margin:15px 0px 0px 30px;	
}
#footerInner p
{
float:right;
color:#fff;
display:inline;
text-align:right;
line-height:18px;
margin:13px 30px 0px 0px;
padding:0px;
}
#footerInner p a
{
color:#fff;
text-decoration:none;
font-weight:bold;
}
#footerInner p a:hover
{
text-decoration:underline;
}


.thumbnail{
position: relative;

z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/

position: absolute;
background-color: lightyellow;
padding: 5px;

border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
margin-left:5px;
border-width: 0;
width:85px;
height:65px;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
width:100px;
height:105px;
left: 60px; /*position where enlarged image should offset horizontally */

/* End footer */