html, body {
    height: 100%;
}

body {
	color: #eee;
	font-family: verdana,arial,helvetica,sans-serif;
	font-size: 76%;
	margin: 0;
	padding: 0;
	background:url(img/header-bg-gradient.png) repeat-x black;
}
a {
	color:white;
}
a:link {
}
a:visited {
}
a:active {
}
a:hover {

}
h1 {
	font-size: 2.0em;
	font-weight: normal;
	margin-bottom: 0em;
	margin-top: 0em;
}
h2 {
	font-size: 1.3em;
	font-weight: bold;
	margin: 1.0em 0em 1.0em 0em;
	
}
h3 {
	font-size: 1.2em;
	font-weight: bold;
	margin: 0.5em 0em 0.5em 0em;
}
h4 {
	font-size: 1.2em;
	font-weight: bold;
	margin: 0.5em 0em 0.5em 0em;
}
h5 {
	font-size: 1.0em;
	font-weight: bold;
	margin: 0.6em 0em 0.2em 0em;
}
h6 {
	font-size: 0.8em;
	font-weight: bold;
	margin: 0.2em 0em 0.2em 0em;
}
img {
	border: 0;
}
ol,ul,li {
	font-size: 1.0em;
	line-height: 1.8em;
	margin: 0.2em 0;
	padding: 0;
	list-style-position:inside;
}
p {
	line-height: 1.2em;
	margin: 0em 0em 0.5em 0em;
}
li>p {
	margin-top: 0.2em;
}
pre {
	font-family: monospace;
	font-size: 1.0em;
}
strong,b {
	font-weight: bold;
}

input {padding:0; margin:0;}

/* STRUCTURE */

#wrap {
	margin:0 auto;
	width:980px;
	position: relative;
	min-height: 100%;
	
}

#main {
	margin:0 30px;	
}



#left {
	float:left;
	margin-left:10px;
	width:451px;
}
	

#right {
	float:right;
	width:369px;

}
#featured {
	margin-right:10px;
	background:url(img/mikki.jpg) no-repeat;
	height:360px;
	width:369px;
	text-align:center;
	padding-top:12px;
}
#featured h4 {width:324px; margin:0; margin-left:27px;}
#featured .call {margin-top:282px;}

#footer {
	background:url(img/footer-bg.png) repeat-x #020202;
	height:100px;
	padding:15px 0 0 0;
	text-align:center;
	color:#999;
	margin-top:50px;
}

#footer p {margin:0; padding:20px 0;}
#footer ul, #footer li {display:inline; list-style:none;}
#footer a {color:#ccc; text-decoration:none;}

.column {
	margin:0;
	padding:0;
}

/* HEADER */
#header {
	height:132px;
	color:white;
	margin-bottom:20px;
	padding:0;
	background:url(img/header-bg.png) no-repeat;

}

#home {text-indent:-9999px; height:80px; width:300px; display:block; margin-left:30px;}

/* NAVIGATION */

#menu {
	list-style-type:none;
	line-height:1.3em;
	margin-top:7px;
	text-align:center;
	margin-left:33px;
	font-size:90%;

}

#menu li {
	float:left;
	
	margin-right:1px;
	}

#menu li a {text-decoration:none; width:129px; height:43px; display:block;   text-indent:-9999px;}
#menu a:hover,
#etusivu #menu .etusivu,
#kouluttajat #menu .kouluttajat,
#periaatteet #menu .periaatteet,
#osaaminen #menu .osaaminen,
#palvelut #menu .palvelut,
#asiakkaat #menu .asiakkaat,
#yhteys #menu .yhteys
{background-position:bottom;}
#menu .etusivu:hover {margin-left:2px; width:127px;}
#menu .etusivu {background:url(img/menu-mediakoulutus.png) no-repeat; width:127px; margin-left:2px;}
#menu .kouluttajat {background:url(img/menu-kouluttajat.png) no-repeat;}
#menu .periaatteet {background:url(img/menu-periaatteet.png) no-repeat;}
#menu .osaaminen {background:url(img/menu-osaaminen.png) no-repeat;}
#menu .palvelut {background:url(img/menu-palvelut.png) no-repeat;}
#menu .asiakkaat {background:url(img/menu-asiakkaat.png) no-repeat;}
#menu .yhteys {background:url(img/menu-yhteys.png) no-repeat; width:128px;}

#right .menu {list-style-type:none; padding:5px 10px; background:url(img/menu-bg.png) no-repeat;}
#right .menu a {text-decoration:underline; background:url(img/menu-item.gif) left bottom no-repeat; padding-left:10px;}
#right .menu a:hover {color:#fff;}
#right p {font-size:85%; margin:0 0 0.5em 0;}
#right table {background:url(img/right-gradient.png) no-repeat; width:100%;}
#right h5 {margin-top:15px;}
.post_date {color:#666; font-size:80%;}


.lb_image {margin:10px;}

#left img + p, #left h2 + p {background:url(img/left-bg.png) no-repeat; margin-top:20px;}
#left p, #left ul, #left ol {padding:15px 20px 5px 20px}

#etusivu #right table {padding:0 5px 0 10px;}

#contact-form td {
	padding:5px;
}

input, textarea {
	background:#000;
	border:1px solid #222;
	padding:2px;
	color:#fff;
}

input:focus, textarea:focus {
	background:#111;
	border:1px solid #333;
}

.required {color:white;}

/* CLEARFIX */

.bottom:after, #wrap:after, #main:after, #container:after {
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
}

.bottom, #wrap, #main, #container {
	display: inline-block;
}
* html #wrap, * html #main, * html .bottom, * html #container {
	height: 1%;
}
#wrap, #main, .bottom, #container {
	display: block;
}
