* {margin: 0px; padding: 0px; border: 0px;}

body{
background:#FFF url(images/body.jpg) repeat-x scroll left top;
font: normal 100%/1.5 Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color: #666666;
}

/*======================= Layout ========================*/

#contentfloatholder {
	width:980px;
	min-width:980px;
	margin: 0 auto;
	padding:10px;
	border:0px;
}

#contentfloatholder:after {
 /* this is for NN6 to clear floats */
    content: "."; 
    display: block; 
	height: 0px;
    clear: both; 
    visibility: hidden;
}

#content {
width:100%;
margin:auto;
padding-bottom:100px;
}
	.content_left {
	float:left;
	width:330px;
	padding:10px;
	}
	.content_right {
	float:right;
	width:350px;
	padding:10px;
	}
	.content_center {
	text-align:center;
	padding:0 140px;
	width:600px;
	}

#header {
	background:url("images/header.jpg") no-repeat scroll center top transparent;
	display:block;
	margin: 0 auto;
	height:355px;
	width:980px;
}

	#header div.contacts {
	color:#646464;
	float:right;
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	font-size:10px;
	text-transform:lowercase;
	text-align: right;
	display:block;
	height:355px;
	margin:0 50px 0 0;
	width:150px;
	padding:0;
	
	}
	
		#header div.contacts #support{
		width:130px;
		height:20px;
		padding: 10px;
		background:url(images/support_bkg.gif) repeat-x bottom;
		border-bottom-right-radius: 10px;
		-moz-border-radius-bottomright: 10px;
		-webkit-border-bottom-right-radius: 10px;
		
		border-bottom-left-radius: 10px;
		-moz-border-radius-bottomleft: 10px;
		-webkit-border-bottom-left-radius: 10px;
		}
	
	#header div.logo {
	font: 18px, Verdana, Arial, Helvetica, sans-serif #cccccc;
	float:left;
	display:block;
	height:355 px;
	width:150px;
	margin:0 0 0 50px;
	padding:0;
	}
	
	#header div.title {
	font: 12px/1.5em Verdana, Arial, Helvetica, sans-serif #cccccc;
	float:left;
	display:block;
	height:355px;
	width:580px;
	padding:0px;
	}
	
.center { text-align:center;}	

#footer {
background:url("images/footer.jpg") no-repeat scroll center top transparent;
display:block;
height:57px;
min-height:57px;
width:980px;
color:#666666;
font-size:10px;
text-align:center;
padding-top:55px;
}

#header, #footer {
clear: both; 
}

.spacer { clear:both;}
.float_left {float:left; }
.float_right {float:right; }

.row_grey {
	background-color:#f4f4f4;
	padding:10px;
}
	.row_grey img{ padding:10px;}

.row_white {
	background-color:#ffffff;
	padding:10px;
}

div.hr {
	height: 1px;
	background: #ffffff url(images/dash.gif) repeat-x scroll left;
}
	div.hr hr {display: none;}

#button a { background-image:url(images/button_free_download.gif);}
#button a:hover{ background-image:url(images/button_free_download_over.gif);}


/*===============text styles======================*/

h1{
font: 100% Verdana, Arial, Helvetica, sans-serif;
font-weight:normal;
padding-bottom:10px;
padding-top:10px;
}


h2{
text-align:left;
font: 120% Verdana, Arial, Helvetica, sans-serif;
font-weight:normal;
color:#CC0000;
text-transform:uppercase;
}

p {
text-align:justify;
padding:10px;
line-height: 1.5em;
}

.quater-page-text{
width:201px;
height:120px;
padding:20px;
margin:10px 2px;
display:block;
float:left;
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px; /*for opera*/
background:#efefef;
background-image: -moz-linear-gradient(100% 100% 90deg, #fff, #efefef);
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#efefef), to(#fff));

}
							
ul.tips-tricks{
display:block;
width:950px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px; /*for opera*/
background:#efefef;
background-image: -moz-linear-gradient(100% 100% 90deg, #fff, #efefef);
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#efefef), to(#fff));
list-style:none;
padding:30px 10px;
}
	ul.tips-tricks li{
	display:block;
	width:930px;
	margin:5px;
	-moz-border-radius:9px;
	-webkit-border-radius:9px;
	border-radius:9px; /*for opera*/
	background:#ffffff;
	padding:5px;
	}

a, a:link, a:visited {
	font-family: Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#CC0000;
	text-decoration:none;
} 
	a:hover, a:active{
	color:#666666;
	text-decoration:underline;
	}


ul {
padding-left:50px;
}

/*======================= MENU ========================*/

#menu {
margin:0;
padding:0 15px;
color: #333333;
width:950px;
text-align:center;
}

#topmenu {width:150px; padding:30px 0 0 0;}

ul#menu, ul#topmenu{ list-style:none;}

#menu a{
text-decoration: none;
display: block;
color: #333333;
margin:0px;
padding:0px;
width:470px;
float:left;
}

#topmenu a{
text-decoration: none;
display: block;
color: #333333;
margin:0px;
padding:0px;
width:150px;
}

#menu .text, #content .text {
font: 100%/1.5 Verdana, Arial, Helvetica, sans-serif, normal;
text-decoration: none;
margin:0px;
padding:20px;
width:300px;
display:block;
float:left;
text-align:left;
}


#menu li#toppler, #topmenu li#toppler { float:right;}
#menu li#sokoban, #topmenu li#sokoban { float:left;}

	#menu #sokoban a .icon, #topmenu #sokoban a .icon {
	width:128px;
	height:128px;
	display:block;
	float:left;
	background-image:url(images/icon_sokoban.jpg);
	background-repeat:no-repeat;
	background-position:left;
	/* corners radius 12px */
	-webkit-border-radius:12px;
	-moz-border-radius:12px;
	border-radius:12px; // for Opera
	/* shadow */
	box-shadow: 0px 2px 5px #777;  
	-moz-box-shadow: 0px 2px 5px #777;  
	-webkit-box-shadow: 0px 2px 5px #777; 
	}
	

	#menu #toppler a .icon, #topmenu #toppler a .icon{
	width:128px;
	height:128px;
	display:block;
	float:left;
	background:#eeeeee;
	background-image:url(images/icon_toppler.jpg);
	background-repeat:no-repeat;
	background-position:left;
	/* corners radius 12px */
	-webkit-border-radius:12px;
	-moz-border-radius:12px;
	border-radius:12px; // for Opera
	/* shadow */
	box-shadow: 0px 2px 5px #777;  
	-moz-box-shadow: 0px 2px 5px #777;  
	-webkit-box-shadow: 0px 2px 5px #777; 
	}

#menu #toppler a .icon:hover, #menu #sokoban a .icon:hover { 
	-webkit-transform: scale(1.02);
	-moz-transform: scale(1.02);
	-webkit-transition: -webkit-transform .15s linear;
	position: relative;
	z-index: 5;
	}

#topmenu #toppler-nonactive a .icon{
	width:64px;
	height:64px;
	display:block;
	margin: 32px 0 0 32px;
	float:left;
	background:#eeeeee;
	background-image:url(images/icon_toppler.jpg);
	background-repeat:no-repeat;
	background-position:left;
	/* corners radius 12px */
	-webkit-border-radius:12px;
	-moz-border-radius:12px;
	border-radius:12px; // for Opera
	/* shadow */
	box-shadow: 0px 2px 5px #777;  
	-moz-box-shadow: 0px 2px 5px #777;  
	-webkit-box-shadow: 0px 2px 5px #777; 
	}
	
#topmenu #sokoban-nonactive a .icon{
	width:64px;
	height:64px;
	display:block;
	margin:  0 0 32px 32px;
	float:left;
	background:#eeeeee;
	background-image:url(images/icon_sokoban.jpg);
	background-repeat:no-repeat;
	background-position:left;
	/* corners radius 12px */
	-webkit-border-radius:12px;
	-moz-border-radius:12px;
	border-radius:12px; // for Opera
	/* shadow */
	box-shadow: 0px 2px 5px #777;  
	-moz-box-shadow: 0px 2px 5px #777;  
	-webkit-box-shadow: 0px 2px 5px #777; 
	}	


#topmenu #toppler-nonactive a .icon:hover { 
	-webkit-transform: scale(1.15);
	-moz-transform: scale(1.15);
	-webkit-transition: -webkit-transform .15s linear;
	position: relative;
	z-index: 5;
	width:72px;
	height:72px;
	margin: 30px 0 0 30px;}
	
#topmenu #sokoban-nonactive a .icon:hover {
	-webkit-transform: scale(1.15);
	-moz-transform: scale(1.15);
	-webkit-transition: -webkit-transform .15s linear;
	position: relative;
	z-index: 5; 
	width:72px;
	height:72px;
	margin: 0 0 24px 30px;}