body {
	padding: 0px;
	margin: 0px;
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom: 0px;
	overflow: auto;
}
			
#wrapper{
	width: 260px; 
	height: 290px;
	overflow: hidden;
}
 
#startPage, #winPage
{
    position:absolute;
    top:0;
    left:0;
	height: 120%;
	width:100%;
	background: url('../skin/bg.png') 0 0;
   /* background-color: #808080;
	 opacity:0.8; */
}	

#startPage>h2, #winPage>h2
{
    color:#d2cb00;
	font-family: Tahoma;
	font-size: 2em;
	text-align:center;
	display:block;
	padding:15% 0 0 5%;
}

#startPage>p, #wintPage>p
{
    color:white;
	font-family: Tahoma;
	font-size: 1.2em;
	text-align:center;
	display:block;
	padding:5% 5% 0 5%;
}	

#startPage button, #winPage button
{
    position:absolute;
	top: 60%;
	left: 12%;
	background: transparent url('../images/but_green.png') 0 0;
	width:358px;
	height:92px;
	color:white;
	font-family: Tahoma;
	font-size: 2em;
	display:block;
	border:none;
	padding:0.8em 0 0 0; 
}

#clicks{
	font-family: Tahoma;
	font-size: 10px;
	color: white;
	margin-left: 20px; 
}

td{
	background: transparent url('off.png') no-repeat;
	width: 40px;
	height: 40px;
	padding: 0px;
}

td.on{
    background: transparent url('on.png') no-repeat;
}

td.off{
    background: transparent url('off.png') no-repeat;
}
	
#sqContainer{
	padding: 0px;
	margin: 0px;
}


#header{
	width: 270px;
	height: 53px;
}

#topleft{
	float: left;
	background: transparent url('topleft.png') no-repeat;
	width: 141px;
	height: 61px;
}

#topcenter{
	float: left;
	background: transparent url('top-center.png');
	height: 35px;
	width: 56px;	
	margin-top: 8px;

}

#topright{
	float: left;
	background: transparent url('top-right.png') no-repeat;
	width: 58px;
	height: 53px;
	margin-top: 8px;	
}

#center{
	width: 255px;
	height: 181px;
}

#centerleft{
	float: left;
	background: transparent url('center-left.png') repeat-y;
	width: 26px;
	height: 100%;
}

#container{
	position: absolute;
	top: 51px;
	left: 34px;
	background-color:  gray; 
	width: 205px;
	height: 212px; 	

}

#centerright{
	float: right;
	background: transparent url('center-right.png') repeat-y;
	width: 24px;
	height: 100%;
}

#bottom{
	width: 300px;
	height: 100px;
}

#bottomleft{
	float: left;
	background: transparent url('bottom-left.png') no-repeat;
	width: 58px;
	height: 38px;
	position: relative;
	top: 8px;
	left: -26px;
}

#bottomcenter{
	float: left;
	background: transparent url('bottom-center.png') repeat-x;
	width: 87px;
	height: 25px;
	position: relative;
	top: 21px;
	left: -26px;
}

.bottomright{
	float: left;
	background: transparent url('bottom-right.png') no-repeat;
	width: 110px;
	height: 45px;
	position: relative;
	left: -26px;
	padding-top: 16px;	
}

.close{
	right: 45px;
	background: transparent url('close.png') no-repeat;
}
#close span{
	display: none;
}

.new{
	background: transparent url('new.png') no-repeat;
	right: 70px;
}

#new span{
	display: none;
}

.button{
	position: absolute;
	top: 25px;
	border: 0px;
	width: 23px;
	height: 23px;	
}
.button:hover{
	background-position: 0 50%;
}

.button:active{
	background-position: 0 100%;
}

#new:hover span, #close:hover span{
	display: block;
	z-index: 20;
	position: absolute;
	top: 15px;
	left: 20px;
	background-color: #FFFFE1;
	color: #253543;
	padding: 1px;
	border: 1px solid black;
	font-size: 11px;
}

#msgbox{
	position: absolute;
	top: 15%;
	left: 15%;
	width: 65%;
	height: 50%; 	
	background: transparent url('bg.png');
	text-align: center;
	padding-top: 10%;
	color: #522920;
	display: none;
}

#msgbox>span{
	font-family: Tahoma;
	font-weight: bold;	
	margin:10% 5% 5% 5%;
	display:block;
}

.yesno{
	background: transparent url('yes.png') no-repeat;
	border: 0px;
	width: 52px;
	height: 26px;
	padding-top: 4px;
	font-weight: bold;
	color: #522920;
}

.yesno:hover{
	background-position: 0 50%;
	color: white;
}

.yesno:active{
	background-position: 0 100%;
	color: #522920;
}

.newgame{
	background: transparent url('newgame.png') no-repeat;
	width: 100px;
}

#winPage{
    display:none;
	} 