html, body { margin: 0;	padding: 0;	}

body {
	background:	#555;
	font-family:  Helvetica, Arial, sans-serif;
}

#main {
	position: relative;
	width: 980px;
	height:	612px;
	.border:	#999 1px	solid;
	top: 0px;
	.left: 10px;
	font-size: 16px;
	background-image:url('../img/back.jpg');
	background-repeat: no-repeat;
	background-position: 0px 3px;
	margin:0 auto;
}

#title {
	color: #555;
	position: absolute;
	left: 10px;
	top: 30px;
}

#title h1{	
	font-size: 2em;
	padding:0 0 0 45px;
	margin:0px;
}

#title h2{
	font-size: 1em;
	font-weight: normal;
	padding:0 0 0 10px;
	margin:0px;
}

#lang {
	position: absolute;
	left: 7px;
	top: 7px;
}

#lang img {
	border: 1px solid #bbb;
	padding: 1px;
	margin-left: 4px;
}

#footer {
	position: absolute;
	font-size: 11px;
	right: 10px;
	top: 8px;
}

#footer a {
	text-decoration: none;
}

#other {
	position: absolute;
	width: 540px;
	height:	543px;
	left: 0px;
	top: 26px;
}
#menu {
	position: absolute;
	left: 75px;
	bottom: 30px;
	z-index:1001;
}
#reset {
	position: absolute;
	right: 20px;
	top: 20px;
}

#tetris	{
	position: absolute;
	width: 440px;
	height:	552px;
	right: 0px;
	top: 0px;
}
#tetris-border {
	position: absolute;
	width: 302px;
	height:	552px;
	left: -1px;
	top: 15px;
	border:	#999 1px	solid;
}

#tetris-area {
	.background:	#eee;
	position: absolute;
	width: 302px;
	height:	552px;
	left: 1px;
	top: 16px;
	overflow: hidden;
}

.grid1,	.grid2,	.grid3,	.grid4,	.grid5,	.grid6 { z-index: 10; position:	absolute; top: 0px;	width: 24px; height: 552px;	background:	#eee; opacity:0.9;filter:alpha(opacity=90);border-right:1px solid #ddd;}
.grid1 { left: 26px; }
.grid2 { left: 76px; }
.grid3 { left: 126px; }
.grid4 { left: 176px; }
.grid5 { left: 226px; }
.grid6 { left: 276px; }

.grid1b,.grid2b,.grid3b,.grid4b,.grid5b,.grid6b { z-index: 10; position:	absolute; top: 0px;	width: 24px; height: 552px;	background:	#fff; opacity:0.9;filter:alpha(opacity=90);;border-right:1px solid #ddd;}
.grid1b { left: 0px; width:25px;}
.grid2b { left: 51px; }
.grid3b { left: 101px; }
.grid4b { left: 151px; }
.grid5b { left: 201px; }
.grid6b { left: 251px; }

#tetris	.block0,
#tetris	.block1,
#tetris	.block2,
#tetris	.block3,
#tetris	.block4,
#tetris	.block5,
#tetris	.block6	{
	z-index: 1000;
	font-size: 10px;
	line-height: 1em;
	font-family: arial;
	position: absolute;
	width: 24px;
	height:	24px;
	border:	1px solid #ffffff;
	/* with	margin 0.5px there were	problems with offsetLeft and offsetTop */
}

/* next	puzzle */
#tetris-nextpuzzle {
	position: absolute;
	top: 29px;
	left: -120px;
	background:	#ffffff;
	overflow: visible;
	display: none;
}


#tetris-keys {
	position: absolute;
	left: 25px;
	top: 135px;
}
#tetris div.h5 { margin-bottom: 0.5em; display: block; font-weight: bold; }
#tetris-keys td { padding-right: 1px; padding-bottom: 1px; }
#tetris-keys img { border-width: 0px; }

/* stats */

#stats {
	position: absolute;
	color: #fff;
	font-weight:bold;
}
/*
	|
	---
*/
#tetris	.block1	{ background: #32a4fa; }

/*
	  |
	---
*/
#tetris	.block0	{ background: #38C44F; }



/*
	--
   --
*/
#tetris	.block2	{ background: #FFAC1C; }

/*
	--
	 --
*/
#tetris	.block3	{ background: #FF6600; }

/*
	|
   ---
*/
#tetris	.block4	{ background: #CC54C4; }

/*
	--
	--
*/
#tetris	.block5	{ background: #999;	}

/*
	----
*/
#tetris	.block6	{ background: #FF0000; }


#showhs td {
	padding-top: 3px;
}

#showhs img.flag {
	border: 1px solid #888;
}

#gold {
	position: relative;
	left: 0px;;
	top: 0px;
}

#showGroup .lp {
	border-left: 1px dashed #666;
	padding-right: 2px;
	padding-left: 4px;
}

#showGroup td {
	padding-top: 3px;
}

#stats td {
	padding-right: 5px;
}