/************* PERUSASETUKSET *************/

/* Taustakuva, taustaväri & leipätekstin fontti ja väri */
body {
	font:normal normal 12px Arial, Helvetica, sans-serif;
	line-height:18px;
	color:#333;
	background:#fff url(/templates/jemma/images/tausta.jpg) top center no-repeat;
}

/* Reunojen pyöristys (poista kommentit seuraavilta riveiltä jos haluat pyöristetyt reunat */
/*
#shadow, a.nappi, .laatikko .module-body, .yhteydenotto .page, .yhteystiedot .page, .laatikot .article_column .colpad, #footer, #nav li, #nav li a, #nav, #main-content, img.reunat, img.varjo, .sigplus-gallery img, #shadow_footer, #nav li ul, #showcase { -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
*/

#nav li:first-child { -moz-border-radius: 12px 0 0 12px; -webkit-border-radius: 12px 0 0 12px; border-radius: 12px 0 0 12px; }

#nav li:last-child { -moz-border-radius: 0 12px 12px 0; -webkit-border-radius: 0 12px 12px 0; border-radius: 0 12px 12px 0; }

#main-content, #shadow { -moz-border-radius: 12px 12px 0 0; -webkit-border-radius: 12px 12px 0 0; border-radius: 12px 12px 0 0; }

/* Otsikot */
h1 {font-size: 28px;line-height:36px;font-weight:normal;color:#2d2d2d; font-family:Georgia, "Times New Roman", Times, serif;}
h2 {font-size: 20px;line-height:36px;font-weight:normal; color:#2d2d2d;font-family:Georgia, "Times New Roman", Times, serif;}
h3 {font-size: 16px; line-height:18px;font-weight:normal;color:#2d2d2d;font-family:Georgia, "Times New Roman", Times, serif;}
h4 {font-size: 14px;}
h5 {font-size: 13px;}
h6 {font-size: 12px;}

/* Linkit */
a, a:visited, .eml {color:#073b57;text-decoration:none;font-weight:bold;}
a:hover {text-decoration:underline;}

/* Sivukartan linkin väri */
.sivukartta  a, .sivukartta a:visited {color:#777;}

/* Yläpalkin elementit */
#header .logo { position:relative; z-index:5;
	top:34px;		/* Logon sijainti ylhäältä */
	left:0px; 		/* Logon sijainti sisällön vasemmasta reunasta */
}
#header .tarjouspallo { position:absolute; z-index:25;
	top:40px;		/* Pyydä tarjous-pallon sijainti ylhäältä */
	right:-40px;	/* Pyydä tarjous-pallon sijainti sisällön oikeasta reunasta */
}

/* Valikon napit */
#nav li {background-color:#031a27;} 		/* Napin taustaväri (jos kuva ei lataudu) */
#nav li a {
	color:#eee;								/* Napin tekstin väri */
	padding:0 16px;							/* Napin tyhjä tila reunoilla */
}
#nav li:hover a {color:#fff;} 				/* Hover-napin tekstin väri (kun hiiri viedään päälle) */
#nav li.active {background-color:#c6d0d5;} 	/* Aktiivisen napin taustaväri (jos kuva ei lataudu) */
#nav li.active a {color:#052e45;} 			/* Aktiivisen linkin tekstin väri */

/* Alapalkki */
#footer {
	background-color:#031a26; 				/* Taustaväri (jos taustakuvan korkeus ei riitä tai kuva ei lataa) */
	color:#fff; 							/* Tekstin väri */
}
#footer h2, #footer h3 {color:#fff;}		/* Otsikoiden värit */
#footer a {color:#fff;}						/* Linkin väri */

/* Alapalkin tarjouspallo */
#footer .tarjouspallo { position:absolute; z-index:25;
	top:20px;		/* Logon sijainti ylhäältä */
	right:-10px;	/* Pyydä tarjous-pallon sijainti sisällön oikeasta reunasta */
}

/* Copyright-teksti */
.copy {color:#333;} 						/* Tekstin väri */

/* Nappi-luokka */
a.nappi {
	background-color:#052b41; 				/* Taustaväri (jos kuva ei lataudu) */
	color:#fff;
	font-size:13px;	/* Tekstin väri */
}

/* Laatikko / laatikot */
.laatikko .module-body, .yhteydenotto .page, .yhteystiedot .page, .laatikot .article_column .colpad {
	background-color:#dfe6e8; 				/* Taustaväri, jota toistetaan kun taustakuvan korkeus ei riitä */	
}

/* Taulukon perustyyli */
.taulukko {border:solid #85abbf 2px;} /* Ulkoreunat */
.taulukko td {padding:5px 10px; border:solid #85abbf 1px;} /* Rivin ensimmäinen solu */
.taulukko td + td {background:#d4e6ef} /* Rivin muut solut */


/* Showcase */
#showcase {
	background-image:url(/templates/jemma/images/laatikko.jpg);
	background-repeat:repeat-x;
	background-position:top center;
	background-color:#dfe6e8;
}

/* Dropdown valikko */
#nav li ul, #nav li li, #nav li:hover li a, #nav li.active:hover li a { 
	width:165px;							/* Napin leveys */
	font-size:11px;							/* Fonttikoko */
}
#nav li:hover li a, #nav li.active:hover li a {
	background:#fff;						/* Napin tausta */
	color:#000;								/* Napin tekstin väri */
}
#nav li li a:hover, #nav li.active li a:hover {
	background:#eee;						/* Hover-napin tausta */
}
#nav li:hover li a, #nav li.active:hover li a, #nav li li a:hover, #nav li.active li a:hover { 
	border-bottom:1px solid #f3f3f3 !important; /* Nappien border */
}






/************* MUUT ASETUKSET *************/

* {margin:0px;padding:0px;font-size:100%;font-style:inherit;font-weight:inherit;vertical-align: baseline;}
html {height:100%;overflow-y:scroll;}
body {min-width:960px;}
a img {border-width:0px;}
table {border-collapse:collapse;border-spacing:0;}
.clear {clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0; line-height:0; font-size:0; border:none;}
.clearfix:before,.clearfix:after {content: '\0020';display: block;overflow: hidden;	visibility: hidden;width: 0;height: 0;}
.clearfix:after {clear: both;}

/*960 grid 12col + varjo*/
.container_12 {width:960px;margin-left: auto;margin-right:auto;}
.grid_0 {display:none;}
.grid_1, .grid_2, .grid_3, .grid_3_half, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12 {display:inline;float:left;margin:0 10px;}
.alpha {margin-left: 0;} .omega {margin-right: 0;}
.grid_1 {width:60px;}.grid_2 {width:140px;}.grid_3 {width:220px;}.grid_4 {width:300px;}.grid_5 {width:380px;}.grid_6 {width:460px;}
.grid_7 {width:540px;}.grid_8 {width:620px;}.grid_9 {width:700px;}.grid_10 {width:780px;}.grid_11 {width:860px;}.grid_12 {width:940px;}
.prefix_1 {padding-left: 80px;}.prefix_2 {padding-left: 160px;}.prefix_3 {padding-left: 240px;}.prefix_4 {padding-left: 320px;}.prefix_5 {padding-left: 400px;}.prefix_6 {padding-left: 480px;}
.prefix_7 {padding-left: 560px;}.prefix_8 {padding-left: 640px;}.prefix_9 {padding-left: 720px;}.prefix_10 {padding-left: 800px;}.prefix_11 {padding-left: 880px;}
.suffix_1 {padding-right: 80px;}.suffix_2 {padding-right: 160px;}.suffix_3 {padding-right: 240px;}.suffix_4 {padding-right: 320px;}.suffix_5 {padding-right: 400px;}
.suffix_6 {padding-right: 480px;}.suffix_7 {padding-right: 560px;}.suffix_8 {padding-right: 640px;}.suffix_9 {padding-right: 720px;}.suffix_10 {padding-right: 800px;}.suffix_11 {padding-right: 880px;}
.pad {margin-left:0; margin-right:0; padding-left:10px; padding-right:10px;}
/*960 grid 12col end*/

#wrapper {width:980px; margin:0px auto 10px auto;}
#shadow {
	-moz-box-shadow: 0px 0px 8px #444;
	-webkit-box-shadow: 0px 0px 8px #444;
	box-shadow: 0px 0px 8px #444;
	margin-bottom:10px;
}
#shadow_footer {
	-moz-box-shadow: 0px 0px 8px #444;
	-webkit-box-shadow: 0px 0px 8px #444;
	box-shadow: 0px 0px 8px #444;
	margin-bottom:10px;
}

body#tinymce {background:none;}
body#tinymce td, body#tinymce tr {padding:5px;}


/* Fontit, rivinvälit, marginit */

ol {list-style: decimal;}
ul {list-style: disc;}
li {margin-left: 30px;}

p,dl,hr,h1,h2,h3,h4,h5,h6,ol,ul,pre,table,address,fieldset {margin-bottom: 18px;}
ul+ul { margin-top:0px; }
h2,h3 { margin-top:27px; margin-bottom:9px; }
p + ul {margin-top:-9px;}
h1+h2, h1+h3, h2+h3 { margin-top:-9px; }
h1+h3 { font-style:italic; }
strong, b {font-weight:bold;}
em, i {font-style:italic;}



/* the top - eli headerin yläpuolella */
#the_top  {padding:0 10px;}
#the_top ul {list-style:none;margin:0px;text-align:right;}
#the_top a,#the_top a:visited {color:#aaa;}
#the_top li {display: inline;margin-left:1em;}



/* Header */
#header {
	height:120px;
}
#header .container_12 { height:120px; position:relative;}
#header ul {margin:0;}
#header li {margin:0;list-style:none;float:left;padding:0 10px;font-weight:bold;}

#header .logo h1 {font-size:3em;}
#header .logo a,#header .logo a:hover, #header .logo a:visited  {color:#000;text-decoration:none;}
/* Headerin lisätausta */
/*.header-tausta {
	background:url(/templates/jemma/images/header_tausta.jpg) top center no-repeat;	
}*/

.sivukartta {float:right;padding:3px 0; font-size:10px; margin-right:-15px;}

/* NAV */
#nav {
	height:50px;
	width:980;
	
	position:absolute;
	
	left:-5px;
	bottom:-170px;
}
#nav ul {margin:0px;}
#nav li {
	margin:0;
	list-style:none;
	float:left;
	position:relative;
	height:50px;
	max-width:145px;
	padding:0;
	margin-left:0px;
	background-image:url(/templates/jemma/images/navi.jpg);
	background-repeat:repeat-x;
	background-position:top center;

	-moz-box-shadow: 0px 0px 4px #444;
	-webkit-box-shadow: 0px 0px 4px #444;
	box-shadow: 0px 0px 4px #444;
	
	-webkit-transition: background 150ms ease-out;
	-moz-transition: background 150ms ease-out;
	-o-transition: background 150ms ease-out;
	-ms-transition: background 150ms ease-out;
	transition: background 150ms ease-out;
}
#nav li a {
	display:block;
	margin:0px;
	
	line-height:50px;
	
	position:relative;
	/*position:absolute;*/
	
	
	
	z-index:24;
	
	-webkit-transition: background 150ms ease-out;
	-moz-transition: background 150ms ease-out;
	-o-transition: background 150ms ease-out;
	-ms-transition: background 150ms ease-out;
	transition: background 150ms ease-out;
}
#nav li a:focus {outline:0;}
#nav li:hover {
	-moz-box-shadow: 0px 0px 8px #444;
	-webkit-box-shadow: 0px 0px 8px #444;
	box-shadow: 0px 0px 8px #444;	
}
#nav li:hover a { background:url(/templates/jemma/images/trans_b_25.png); }
#nav li a:hover {
	text-decoration:none;
}

#nav li.active, #nav li.active:hover {
	background-image:url(/templates/jemma/images/active.jpg);
	background-repeat:repeat-x;
	background-position:top center;
}
#nav li.active a, #nav li.active a:hover {
	background:none;
	position:relative;
	z-index:12;
}

/* DROPDOWN */
#nav li ul {
	position:absolute;
	left:-999em;
	margin-left:0px;
	z-index:1500;
	-moz-box-shadow: 0px 0px 3px #000;
	-webkit-box-shadow: 0px 0px 3px #000;
	box-shadow: 0px 0px 3px #000;
	background:#fff;
	
	-webkit-transition: background 150ms ease-out;
	-moz-transition: background 150ms ease-out;
	-o-transition: background 150ms ease-out;
	-ms-transition: background 150ms ease-out;
	transition: background 150ms ease-out;
	overflow:hidden;
}
#nav li li {padding:0;height:auto; border-left:none; margin:0;
	-moz-border-radius: 0px; -webkit-border-radius: 0px; border-radius: 0px;
}
#nav li:hover li a, #nav li.active:hover li a {
	text-shadow:none;
	text-align:left;
	font-weight:normal;
	margin:0;
	height:30px;
	line-height:30px;
	text-decoration:none;
	-moz-box-shadow:none;
	-webkit-box-shadow:none;
	box-shadow:none;
	border:none;
	
	text-indent:10px;
	padding:0;
	-moz-border-radius: 0px; -webkit-border-radius: 0px; border-radius: 0px;
}
#nav li li:first-child a { border:none; }
#nav li li a:hover, #nav li.active li a:hover {
	text-shadow:none;
	text-decoration:none;
	border:none;
}
#nav li li, #nav li li.active, #nav li li:hover, #nav li li.active:hover {
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;	
}
#nav li:hover ul {left:0;}
#nav li li:hover ul {left:0;}

/*jos murupolku jossain muualla kuin breadcrumbs paikassa muista merkata moduulille luokka*/
div#breadcrumbs {background:#333 url(/templates/jemma/images/nav-hover.jpg) repeat-x 0 -200px ; color:#eee; padding:3px 0 0 0;}
span.breadcrumbs {}


#main-content { width:980px;overflow:hidden; margin-top: 180px;}
/* Showcase */
#showcase {
	padding:0px 0px;
	
	-moz-box-shadow: 0px 0px 5px #222;
	-webkit-box-shadow: 0px 0px 5px #222;
	box-shadow: 0px 0px 5px #222;
}
#showcase .container_12 { padding:20px 0 10px 0; }
#main-content > .container_12 { padding-top:10px; padding-bottom:10px; }
#showcase .module {}
/* Showcasen lisätausta */
/*.showcase-tausta {
	background:url(/templates/jemma/images/showcase_tausta.jpg) top center no-repeat;	
}*/


/* Main content taustakuvalla */
#main-content {background: url(/templates/jemma/images/main_content.png) top center repeat;}

/* Main content ilman taustakuvaa */
/*#main-content { background:#fff; }*/


#left, #right, #content-wrap {padding-top:10px;}

/* NAV vasen */
#left .menu ul {margin:0;padding:0; }
#left .menu ul li {list-style:none;background:#333 url(/templates/jemma/images/header.jpg) repeat-x 0 -200px;margin:0px;}
#left .menu ul li a {display:block;height:30px;line-height:30px;padding-left:10px;color:#eee; text-transform:uppercase; font-weight:normal;}
#left .menu ul li a:hover {color:#eee; background:url(/templates/jemma/images/nav-hover.jpg) repeat-x; text-decoration:none;}
#left .menu ul li.active a {background:url(/templates/jemma/images/nav-hover.jpg) repeat-x 0 -100px ;}

/* Modules */
.module-title {margin-bottom:0;}
.module-body {}
#left .module  {}
#right .module {}
#left .module-body, #right .module-body  {}
#left .module-footer, #right .module-footer {}

#right .mblankko .module-body, #left .mblankko .module-body {padding:0;border:0; background:none;}
#right .mblankko .module-footer {background:none; height:0;}

/* Content styles */
td {vertical-align:top;}
#content-wrap {}
#com-form-login {margin:0 10px;}
#com-form-login fieldset {padding:10px;}
.leading_separator {} /*jos halutaan blogin leading artikkelit erottaa jollakin ota käyttöön*/
.article_column {}
.pagination {margin-left:10px;}
.pagination span, .pagination a {margin-right: 10px;}
.modifydate, .createdby, .createdate {display: block;}
.buttonheading {float:right;}
.buttonheading .icon {display:block;width:16px;height:16px;float:left;margin-left:10px;}
.buttonheading .print {background: url(/templates/jemma/images/icons.png) -1px -1px;}
.buttonheading .email {background: url(/templates/jemma/images/icons.png) -19px -1px;}
.buttonheading .pdf {background: url(/templates/jemma/images/icons.png) -37px -1px;}

div.jform form fieldset{border:1px solid #ccc;}
div.jform { margin-top:-18px; }

/* Footer */
#footer {
	background-image:url(/templates/jemma/images/footer.jpg);
	background-repeat:repeat-x;
	background-position:top center;
	
	text-align:center;
	
	position:relative;
	margin-top:-10px;
}
#footer h2, #footer h3 {
	margin-top:0px;
	margin-bottom:18px;
}
#footer .page { padding:20px 0 10px 0; }
#footer .module p {margin:0; padding:0px 0;margin-bottom:10px;}
#footer ul {margin:0;}
#footer li {list-style:none;float:left;padding-right:20px;font-weight:bold;}
.copy {text-align:right; padding-right:0px; padding-top:0px;}

#bottom .module { padding:0px; margin-top:-10px; }

/* Toteuttanut Werkkoyhtiö Vilperi  */
#vilperi a{height:20px;display:block;font-size:0.5em; text-align:right;}

/* print & email window */
body.contentpane {background:none;}
body.contentpane div.page, body.contentpane form {padding:20px;}
body.contentpane .buttonheading {position:absolute; left:10px; top:10px;}
body.contentpane form {max-width:400px; margin:0 auto;}

.contentpaneopen_edit, button { position:relative; z-index:1000; }

/* SYSTEEMIVIESTIT */
#system-message { font-size:14px; margin-bottom:0px;}
#system-message dt { font-size:18px; }
.messagewrap { width:960px; margin:0 auto; }
.error { padding:15px; background:#a00 !important; color:#fff !important; }
dt.error { padding-bottom:5px; padding-top:40px;}
.message { padding:15px; background:#afa; color:#333 !important;}
dt.message { padding-bottom:5px; padding-top:40px;}

/* Näytä/piilota muokkaa tekstiä */
a#naytaPiilota {
	position:fixed;
	z-index:5000;
	display:block;
	padding:5px;
	background:#fff;
	font:normal bold 11px Arial, Helvetica, sans-serif;
	color:#000;
	opacity:0.2;
	top:0px;
	left:0px;
	
	-webkit-transition: all 150ms ease-out;
	-moz-transition: all 150ms ease-out;
	-o-transition: all 150ms ease-out;
	-ms-transition: all 150ms ease-out;
	transition: all 150ms ease-out;
}
a#naytaPiilota:hover {
	opacity:0.8;
	text-decoration:none;
}
a#naytaPiilota:focus {outline:0;}


/* Efektit */
.reunat {padding:9px; background:#fff; border:1px solid #ccc;}

.varjo {
	-moz-box-shadow: 0px 0px 3px #444;
	-webkit-box-shadow: 0px 0px 3px #444;
	box-shadow: 0px 0px 3px #444;
}

a.nappi {
	display:block;
	clear:both;
	
	line-height:36px;
	text-indent:12px;
	
	background-image:url(/templates/jemma/images/navi.jpg);
	background-repeat:repeat-x;
	background-position:top center;
	
	-moz-box-shadow: 0px 0px 3px #444;
	-webkit-box-shadow: 0px 0px 3px #444;
	box-shadow: 0px 0px 3px #444;
	
	-webkit-transition: background 150ms ease-out;
	-moz-transition: background 150ms ease-out;
	-o-transition: background 150ms ease-out;
	-ms-transition: background 150ms ease-out;
	transition: background 150ms ease-out;
}
a.nappi:hover {	
	-moz-box-shadow: 0px 0px 6px #444;
	-webkit-box-shadow: 0px 0px 6px #444;
	box-shadow: 0px 0px 6px #444;
	
	background-position:bottom center;
	
	text-decoration:none;
}


/* Laatikot */
.laatikko .module-body, .yhteydenotto .page, .yhteystiedot .page, .laatikot .article_column .colpad {
	padding:15px;
	background-image:url(/templates/jemma/images/laatikko.jpg);
	background-repeat:repeat-x;
	background-position:top center;
	
	-moz-box-shadow: 0px 0px 4px #444;
	-webkit-box-shadow: 0px 0px 4px #444;
	box-shadow: 0px 0px 4px #444;
	
	margin-bottom:10px;
}

/* Poistetaan h2 ja h3 marginit jos otsikko on laatikon/sisällön ensimmäisenä */
.laatikko h2, .yhteydenotto h2, .yhteystiedot h2, .laatikot .article_column h2 {margin-top:0px;margin-bottom:18px;}
#content .leading h2:first-child, #content .leading div.contentpaneopen_edit+h2, #content .page h2:first-child, #content p.buttonheading+h2, #content .leading h3:first-child, #content .leading div.contentpaneopen_edit+h3, #content .page h3:first-child, #content p.buttonheading+h3, #right h2, #left h2  {margin-top:0px !important;}

/* Sigplus-gallerian kuvat */
.sigplus-gallery img {
	-moz-box-shadow: 0px 0px 3px #444;
	-webkit-box-shadow: 0px 0px 3px #444;
	box-shadow: 0px 0px 3px #444;
}
.sigplus-gallery img:hover {
		
	-moz-box-shadow: 0px 0px 6px #000;
	-webkit-box-shadow: 0px 0px 6px #000;
	box-shadow: 0px 0px 6px #000;
}
div.sigplus-gallery ul > li {
	margin:0 5px !important;
}

.laatikko h2, .laatikko p, .laatikot .article_column h2, .laatikot .article_column p { margin-bottom:9px; }
.laatikot .article_column .colpad, .laatikko .module-body { padding-bottom:10px; }


.laatikot.sivu3 .article_column .colpad { min-height:350px; }
.laatikot.sivu4 .article_column .colpad { min-height:450px; }

.mobilelink { height:65px; }
.mobilelink a {
z-index:100;
font:normal bold 24px Arial, Helvetica, sans-serif;
color:#900;
height:60px;
line-height:60px;
background:#fff;
width:100%;
border-bottom:5px solid #aaa;
margin:0px;
padding:0px;
text-align:center;
display:block;
margin-bottom:80px;
}