/* Kielijelppi - 2010
------------------------ */
body {
	background: #acc7e3 url(../images/kielijelppi-master.png) repeat-x top;
	margin: 0px auto;
	text-align: center;
	font-family: Arial, Verdana, sans-serif;
	font-size: 13px;
}
/* Boxes 
----------- */
div#wrapper {
	margin: 0px auto;
	text-align: left;
	min-height: 600px;
	width: 982px;
	background: url(../images/kielijelppi-bg.png) repeat-y center;
}
div#header {
	height: 186px;
	position: relative;
	background: url(../images/kielijelppi-header.png) repeat-y center;
}
div.topbar {
	height: 25px;
	padding: 10px 0 0 0;
}
body#puhe div#main {background: url(/images/kj10-bg-puhe.gif) no-repeat bottom left;}
body#kirjoitus div#main {background: url(/images/kj10-bg-kirjoitus.gif) no-repeat bottom left;}
body#verkko div#main {background: url(/images/kj10-bg-verkko.gif) no-repeat bottom left;}
/* Break 
----------- */
div.topbar:after, div#main:after, div.sitemap:after, div.credits:after, div.aakkonen:after, div.aihealue:after, div.nosto:after  {
	content: ".";
	clear: both;
	height: 0;
	visibility: hidden;
	display: block;
}
/* Common formatting
----------- */
.left {
	float: left;
}
.right {
	float: right;
}
.abs {
	position: absolute;
}
.clear {clear: both;}
div#header h2 a {/* Use this for block links over background*/
	display: block;
	width: 100%;
	height: 100%;
}
div.content p {
	line-height: 130%;
	margin: 0 0 1em 0;
}
div.content h1, div.content h2, div.content h3, div.content h4 {
	color: #2e57a0;
	font-weight: bold;
	font-family: "Lucida Grande" Verdana, Arial, sans-serif;
	margin: 1em 0 0.5em 0;
}
div.sidebar h3 {
	color: #252525;
	font-weight: bold;
	font-family: "Lucida Grande" Verdana, Arial, sans-serif;
}
div.content h1 {
	font-size: 24px;
}
div.content h2 {
	font-size: 18px;
	margin: 1.2em 0 .8em 0;
}
div.content h2.rss {
	background: url(/images/RSS_24x24.png) no-repeat 0 0;
	padding: 4px 0 0 35px;
}
div.content h3 {
	font-size: 16px;
}
div.content h3 {
	font-size: 14px;
}
div.content ul, div.content ol {
	margin: 0 0 1em 25px;
	line-height: 130%;
}
div.content ul {
	list-style: disc;
}
div.content ol {
	list-style: decimal;
}
div.content ul li {
	list-style: disc;
	margin: 0 0 .3em 0;
}
div.content ol li {
	margin: 0 0 .3em 0;
}
cite,em {
	font: italic 13px Georgia, "Times new", Times, serif;
}
strong {
	font-weight: bold;
}
/* Blockquotes 
----------- */
blockquote {
	background: #f4f4f4;
	padding: 8px 15px;
	margin: 0 0 1em 0;
	line-height: 130%;
	font: normal 13px Georgia, "Times new roman", Times, serif;
}
div#main blockquote.neg {
	background: #f4f4f4 url(/images/warning2.png) no-repeat 5px 10px;
	padding: 12px 10px 8px 40px;
	font: normal 13px Georgia, "Times new roman", Times, serif;
}
div#main blockquote.pos {
	background: #f4f4f4 url(/images/ok.png) no-repeat 5px 10px;
	padding: 12px 10px 8px 40px;
/*	margin: 10px 8em 25px 10px;*/
	font: normal 13px Georgia, "Times new roman", Times, serif;
}
/* Links
----------- */
a:link {text-decoration: none;color:#A8781F;}
a:visited {text-decoration: none;color:#A9301E;}
a:hover {text-decoration: underline;color:#A9301E;}
a:active {color: #A85B1F;}
div.content a {
	text-decoration:underline;
}
span.lang a, span.meta, span.meta a, ul#navimain li a {
	color: #fff;
	text-decoration: none;
}
ul#navimain li a.current {
	color: #999;
}
ul#navimain li a.current:hover, ul#navisec li a.current:hover, div.pagenavi a {
	text-decoration: none;
}
ul#navisec li a {
	text-decoration: none;
	/*color: #ff9900;*/
	color: #FF9713;
	color: #fff;
}
ul#navisec li a.current {
	color: #fff;
}
div.sidebar ul.navisub a {
	color: #A8781F;
	text-decoration: none;
}
div.sidebar ul.navisub a:hover {
	text-decoration: underline;
}
div.sidebar ul.navisub ul li.active_class a, div#wrapper div.sidebar ul.navisub ul li.active_class a:hover {
	color: #A9301E;
	cursor: default;
	font-weight: bold;
}
div.sitemap a {
	color: #A8781F;
}
p.backtotop a:link, p.backtotop a:visited {
	color: #999;
	text-decoration: none;
}
p.backtotop a:hover {
	text-decoration: underline;
}
div.nosto a:link, div.nosto a:visited {
	text-decoration: none;
	color:#2d5aa1;
}
div.nosto a:hover {
	text-decoration: underline;
}
p.more a:link, p.more a:visited  {
	background: url(/images/right16.png) no-repeat right;
}
p.more a {
	padding: 0 20px 0 0;
}

/* Header 
----------- */
span.lang {
	margin: 0 0 0 15px;
}
span.meta {
	margin: 0 15px 0 0;
}
div#header h2 {
	width: 180px;
	height: 50px;
	top: 60px;
	text-indent: -5000px;
}
ul#navimain {
	position: absolute;
	top: 146px;
	height: 40px;
	float: left;
	padding: 0 0 0 10px;
}
ul#navimain li {
	float: left;
	display: inline; /*For ignore double margin in IE6*/
	margin: 0 10px;
}
ul#navimain li a {
	float:left;
	cursor: pointer;
	font: 900 14px/22px "Arial", Helvetica, sans-serif;
}
ul#navimain li a span {
	margin: 0 10px 0 -10px;
	padding: 9px 8px 9px 18px;
	position: relative; /*To fix IE6 problem (not displaying)*/
	float:left;
}
ul#navimain li a {
	background: url(../images/kielijelppi-navi-tab.png) no-repeat top right;
}
ul#navimain li a span {
	background: url(../images/kielijelppi-navi-tab.png) no-repeat top left;
}
ul#navimain li a.current {
	background: url(../images/kielijelppi-navi-tab-a.png) no-repeat top right;
	cursor: default;
}
ul#navimain li a.current span {
	background: url(../images/kielijelppi-navi-tab-a.png) no-repeat top left;	
}
ul#navisec {
	position: absolute;
	top: 146px;
	right: 0px;
	/*	background: yellow;*/
	padding: 0 0 0 10px;
}
ul#navisec li {
	float: left;
	display: inline; /*For ignore double margin in IE6*/
	margin: 0 10px;
}
ul#navisec li a {
	float:left;
	cursor: pointer;
	font: 900 14px/22px "Arial", Helvetica, sans-serif;
}
ul#navisec li a span {
	margin: 0 10px 0 -10px;
	padding: 9px 8px 9px 8px;
	position: relative; /*To fix IE6 problem (not displaying)*/
	float:left;
}
ul#navisec li a.current {
	cursor: default;
}

/* Main
----------- */
div#main div.content {
	width: 570px;
	min-height: 600px;
	margin: 25px;
}
div#main div.sidebar {
	background: #f3f3f3;
	width: 315px;
	padding: 25px 10px;
}
div#main div.sidebar.front {
	background: #fff;
	width: 315px;
	padding: 25px 10px;
}
div#main div.content.center {
	width: 670px;
	min-height: 600px;
	margin: 25px auto;
}
div.crumbs {
	font-size: 11px;
	color: #8e8d8d;
}
div.crumbs a:link, div.crumbs a:visited {
	text-decoration: none;
	color: #8e8d8d;
}
div.crumbs a:hover {
	color: #000;
}
div.sidebar h3 {
	background: url(../images/kielijelppi-sb-h3.png) no-repeat;
	height: 28px;/* Top padding has been reduced */
	width: 314px;
	text-align: center;
	font-size: 16px;
	letter-spacing: 1px;
	padding: 8px 0 0 0;
}
div.sidebar h3.puhe {
	background: url(../images/kielijelppi-sb-h3p.png) no-repeat;
}
div.sidebar h3.kirjoitus {
	background: url(../images/kielijelppi-sb-h3k.png) no-repeat;
}
div.sidebar h3.verkko {
	background: url(../images/kielijelppi-sb-h3v.png) no-repeat;
}
div.sidebar h4 {
	background: #d2d2d2;
	height: 20px;/* Top padding has been reduced */
	width: 314px;
	text-align: center;
	font-size: 14px;
	font-weight: bold;
	padding: 6px 0 0 0;
	margin: 25px 0 10px 0;
}
div.sidebar h4.feed {
	background: #eee url(/images/RSS_24x24.png) no-repeat 5px 5px;
	height: 24px;/* Top padding has been reduced */
	width: 274px;
	text-align: left;
	font-size: 14px;
	font-weight: bold;
	padding: 10px 0 0 40px;
	margin: 25px 0 10px 0;
}
div.sidebar h4.suggest {
	background: #eee url(/images/Pencil_24x24.png) no-repeat 5px 5px;
	height: 24px;/* Top padding has been reduced */
	width: 274px;
	text-align: left;
	font-size: 14px;
	font-weight: bold;
	padding: 10px 0 0 40px;
	margin: 25px 0 10px 0;
}
div.sidebar p {
	line-height: 120%;
	margin: 8px;
}
div.sidebar ul.navisub {
	font-weight: bold;
	margin: 10px 12px;
}
div.sidebar ul.navisub li {
	margin: 0 0 .8em 0;
}
div.sidebar ul.navisub ul {
	font-weight: normal;
	margin: 10px 15px;
	list-style: square;
	color: #bdbec0;
}
div.sidebar ul.navisub.news {
	font-weight: normal;
	margin: 10px 10px 0 5px;
}
div.sidebar ul span {
	font-size: 11px;
	color: #bdbec0;
}
div#honor {
	width: 160px;
	margin: 0 0 0 0;
	height: 45px;
	background:  url(/images/honors.png) no-repeat right;
	padding: 25px 120px 30px 20px;
}

div#honor a {
	
}
/* Meta-navigation when needed
----------- */
div.pagenavi {
	background: #f9f9f9 url(/images/previous.png) no-repeat left;
	border-top: 1px dotted #ccc;
	border-bottom: 1px dotted #ccc;
	margin: 15px 0;
	padding: 5px 0 5px 20px;
}
div.anchornavi {
	border-top: 1px dotted #ccc;
	border-bottom: 1px dotted #ccc;
	background: #f9f9f9;
/*	height: 15px;*/
	width: 250px;
	float: right;
	/*margin: 10px 0;*/
	margin: 0 0 30px 30px;
	padding: 5px 0 5px 0px;
	font-size: 12px;
}
div.anchornavi ul {
	margin: 0 0 0 5px;
/*	display: inline;*/
}
div.anchornavi ul li {
	list-style-type: none;
/*	float: left;
*/	margin: 0 0 3px 15px;
}
div.anchornavi ul li a {
	padding: 0 10px 0 0;
}

/* Forms
----------- */
div.sidebar form input[type=text] {
	width: 220px;
	height: 25px;
	border: 1px solid #999;
}
div.sidebar form input[type=submit] {
	width: 50px;
	margin: 0 0 0 10px;
/*	height: 25px;
	background: transparent;
	border: 0px;*/
}
div.sidebar form  {
	margin: 0 0 13px 5px;
}
/* Footer
----------- */
div.sitemap {
	height: 220px;
	background: url(../images/kielijelppi-sitemap.png) repeat-x;
}
div.sitemap div.column {
	width: 250px;
	padding: 15px 0;
	margin: 0 0 0 60px;
}
div.column ul.category_list {
	margin: 0;
}
div.column ul.category_list li {
	margin: 0 0 3px 0;
}
div.column h4 {
	font: bold 12px "Lucida Grande", Verdana, arial, sans-serif;
	margin: 0 0 4px 0;
	color: #4f4f4f;
}
div.column h4.other {
	margin: 15px 0 4px 0;
	color: #999;
}
div.credits img.footerimage {
	margin: 0 20px 0 0;
}
div.credits p {
	width: 300px;
	margin: 20px 0 0 0;
	font-size: 12px;
	color: #999;
}
div.credits p.right{
	width: 340px;
	text-align: right;
	margin: 20px 15px 0 0;
}
div.credits p.left img {
	float: left;
	margin: -5px 15px 0 0;
}
/* Verkkoviestintä
------------------------------*/
.kirjoittaja {
	font: italic 13px Georgia, "Times new roman", Times, serif;
}
div.kirjoittaja {
	padding: 10px 10px 10px 55px;
	margin: 20px 0;
	border-top: 1px dotted #000;
	border-bottom: 1px dotted #000;
	background: url(/images/help32.png) no-repeat 10px 10px;
}
div.list {
	margin: 25px 0 0 0;
/*	background: url(/images/kj2_bg1.gif) no-repeat bottom;*/
/*	border-bottom: 1px solid #eee;*/
}
/* Sanasto
------------------------------*/
div#main div.sana h3 {
	font-size: 13px;
	margin: 2em 0 .3em 0;
	border-bottom: 1px dotted #ccc;
}
div#main div.sana div.selitys p {
	margin: 0 0 0 0;
	font-size: 12px;
}
div#main div.sana p.meta {
	font-size: 8px;
	margin: 3px 0;
	float: right;
	color: #5D5D5D;
}
div#main div.sana h3 span.meta {
	font-size: 8px;
	margin: 0 0 0 0;
	float: right;
	display: inline;
}
/* Esitykset
------------------------------*/
div.esitys {
	height: 355px;
	text-align: center;
}
table.kielioppi {
	padding: 2px;
	margin: 5px;
	border: 1px solid #ccc;
}
table.kielioppi td {
	padding: 3px;
}
table.kielioppi tr {
	border: 1px solid #ccc;
}
table.kielioppi th {
	padding: 3px 20px;
	background: #eee;
}
div#main p.caption {
	font: italic 14px Georgia;
	color: #999;
}
/* Työkalupakki
------------------------------*/
div.sidebar p.note {
	margin: 0 0 15px 0;
}

div.sidebar p.note img {
	float: left;
	margin: 0 10px 3px 0;
}
img.selitekuva {
	float: left;
	margin: 0 10px 10px 0;
	border: 1px dotted #ccc;
	padding: 8px;
	background: #f1f1f1;
}
div.aakkonen {
	width: 400px;
}
div.aihealue {
	width: 500px;
}
div#main div.aakkonen ul {
	margin-left: 18px;
	width: 200px;
	float: right;
	margin-top: 0px;
}
div#main div.aihealue ul {
	margin-left: 18px;
	width: 150px;
	float: right;
	margin-top: 0px;
}
div#main div.aakkonen h3, div#main div.aihealue h3 {
	margin: 0 0 .4em 15px;
	float: left;
}
div#main div.aihealue h3 {
	width: 200px;
}
/* Tekijät ja tahot
------------------------------*/
div.block {
	margin: 0 0 100px 0;
	padding: 10px 25px 35px 25px;
	border-top: 1px dotted #000;
	border-bottom: 1px dotted #000;
	background: #f9f9f9;
}
div.block.first {
	border: 0px;
	background: #fff;
	margin: 0 0 100px 0;
	padding: 10px 25px 35px 25px;
}
p.backtotop {
	float: right;
	width: 100px;
}
p.backtotop a:link, p.backtotop a:visited {
	display: block;
	width: 100%;
	height: 100%;
	height: 20px;
	padding: 0 0 0 25px;
	background: url(/images/up16.png) no-repeat 0 0;
}
p.backtotop a:hover {
	background: url(/images/up16.png) no-repeat 0 -1px;
}
/* Etusivu
------------------------------*/
div.nosto {
	border-top: 1px dotted #000;
	border-bottom: 1px dotted #000;
	margin: 0 0 10px 0;
	padding: 15px 10px 0 25px;
}
div.nosto.puhe, div.nosto.kirjoitus, div.nosto.verkko {
	height: 103px;
	width: 495px;
	padding: 15px 0 0 80px;
	margin: 0 0 5px 0;
	border: 0px;
}
div.nosto.puhe {
	background: blue url(/images/kielijelppi-etu-nosto-puhe.png) no-repeat;
}
div.nosto.kirjoitus {
	background: url(/images/kielijelppi-etu-nosto-kirjoitus.png) no-repeat;
}
div.nosto.verkko {
	background: url(/images/kielijelppi-etu-nosto-verkko.png) no-repeat;

}
div.nosto img {
	float: left;
	margin: 5px 10px 10px 0;
}
div.nosto h2 {
	margin: 0 0 5px 0;
}
div.nosto.puhe p, div.nosto.kirjoitus p, div.nosto.verkko p {
	background: transparent;
	width: 470px;
	padding: 3px 0 15px 0;
	line-height: 140%;
/*	background: yellow url(/images/Forward_24x24.png) no-repeat right bottom;*/
}
div.nosto a {
	display: block;
	width: 100%;
	height: 100%;
/*	padding: 0 70px 0 0;*/
}

div.nosto p:hover {
}
p.more {
	text-align: center;
}
img.frontimage {
	text-align: center;
	margin: 0px auto 25px auto;	
	border-bottom: 1px solid #eee;
}
/* Yhteyslomakkeet 
------------------------------*/
form.zemContactForm legend {
	font: bold 14px "Lucida Grande", Arial;
}

form.zemContactForm input#phone, form.zemContactForm input#mail {
	padding: 0;
	margin: 0;
	height: 0;
	display: none;
}

form.zemContactForm p.note {
	font: italic 11px "Lucida Grande", Arial;
	color: #888;
	margin: 0px;
}

form.zemContactForm fieldset {
	padding: 10px 0;
}

form.zemContactForm span {
	color: #d61a00;
	font-size: 11px;
}

form.zemContactForm fieldset fieldset {
	margin: 10px 0 0 0;
	padding: 15px 10px;
	background: #FFE0A5;
/*	border-top: 1px dotted #ccc;
	border-bottom: 1px dotted #ccc;
*/	border: 1px solid #999;
}

form.zemContactForm input, form.zemContactForm textarea {
	border: 1px solid #999;
	padding: 3px;
	margin: 4px 0 10px 0;
}

form.zemContactForm input.zemSubmit {
	border: 1px solid #999;
	padding: 5px 25px;
	margin: 15px 0 5px 0;
}

ul.zemError {
	color: #d61a00;
}

