/* 
 * The Palloman styles by Timo!
 */

body {
	font: 62.5% Verdana, sans-serif;
	background: #fff;
	color: #161214;
	margin: 0;
	padding: 10px 0 0 0;
}

/* Reset elements */
h1, h2, h3, p { margin: 0; padding: 0; }

/* Basic link styling */
a { color: #161214; text-decoration: underline; outline: none; }
a:hover { text-decoration: none; }
img { border: none; }


/* Some "typography" */
p {	margin: 0 0 1.2em 0; }
strong { color: #65b8db; }

/* Use clearer after floats */
.clear { clear: both; }

/* Main content structure */
#wrap { width: 805px; margin: 1em auto 0 auto; font-size: 1.2em; }
#header { height: 100px; }
#content { padding: 0 0 0 70px; }
#footer { margin: 1.5em 0;}


/* Logo as h1 */
#header h1 { 	float: left; }
#header h1 a {
	display: block;
	text-indent: -9999px;
	background: url('layout/palloman.gif') no-repeat top left;
	width: 57px;
	height: 71px;
}


/* #header h2 for "uudet sivut tulossa" */
#header h2 {
	float: right;
	text-indent: -9999px;
	background: url('layout/uudet_sivut_tulossa.gif') no-repeat top left;
	margin: 20px 45px 0 0;
	width: 180px;
	height: 39px;
}


/* The cool content boxes */
#content .box { float: left; width: 240px; margin: 0 5px 0 0; }
.box h3 {	font-size: 1.2em; width: 231px; line-height: 2.4em; text-align: center;	color: #181418;}
#box_1 h3 { background: #65b8db; }
#box_2 h3 { background: #f29400; }
#box_3 h3 { background: #a7c850; }
.box .top { background: url('layout/bg_boxtop.gif') no-repeat bottom left; padding: 0 0 10px 0; }
.box .content { background: #ebeded url('layout/bg_boxcontent.gif') repeat-y top left; padding: 0 0 0 5px; }
.box .bottom { background: #ebeded url('layout/bg_boxbottom.gif') no-repeat top left; clear: both; height: 20px;	width: 240px;
}