/*
	pattern template.css
	
	(c) Runtime Oy
*/

/* Reset */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,
pre,a,abbr,address,cite,code,del,dfn,em,img,ins,q,small,strong,
sub,sup,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,
tbody,tfoot,thead,tr,th,td {border:0;margin:0;padding:0}
article,aside,figure,figure img,figcaption,hgroup,footer,header,nav,
section,video,object {display:block}
a img{border:0}
figure{position:relative}
figure img{width:100%}

/* Taustakuva, taustaväri & leipätekstin fontti ja väri */
body {
	color:#333;
	background-color:#fff; /* Taustaväri */
	
	padding:0px;
	margin:0px;
}

/* Mobiilitausta */
@media (max-width: 1024px) {
	body {
		/*background-image:url(../images/tausta-mobiili.jpg);*/
		background-position:top center;
		background-repeat:no-repeat;
		
		background-size:100% auto;
	}
}
/* Normaali tausta */
@media (min-width: 1025px) {
	body {
		/*background-image:url(../images/tausta.jpg);*/
		background-position:top center;
		background-repeat:no-repeat;
	}
}


/*********  $$$  $$$ ************************************************************
**********  $$$  $$$ ************************************************************
 
$$$    $$$   $$$$$$   $$$$$$$$   $$$ $$$$$$$$$
$$$    $$$  $$$$$$$$  $$$$$$$$$  $$$ $$$$$$$$$
$$$    $$$ $$$    $$$ $$$    $$$ $$$    $$$
$$$    $$$ $$$    $$$ $$$    $$$ $$$    $$$
 $$$  $$$  $$$$$$$$$$ $$$$$$$$$  $$$    $$$
 $$$  $$$  $$$$$$$$$$ $$$$$$$$   $$$    $$$
  $$$$$$   $$$    $$$ $$$   $$$  $$$    $$$
   $$$$    $$$    $$$ $$$    $$$ $$$    $$$
    $$     $$$    $$$ $$$    $$$ $$$    $$$
	
	
**********************************************************************************
**********************************************************************************/


	/* VÄRI 1 */
	
	.laatikko .otsikko h2, .nappi, a.nappi, .huomio2 .huomio-nuoli,
	.pagination span, .vari2 .huomio-nuoli, .valikko-koti, .valikko-avaa, #left ul.menu li
	{

		background-color:#C20E1A;
		color:#fff !important;
	}
	
		/********** FOOTER ERI VÄRILLÄ KUIN NAVI ***********/
		/*
		#footer .arkki {
			background-color:# !important;
		}
		*/
		
	
	/* VÄRI 2 */
	
	.nappi.vari2, .laatikko.laatikko-vari2 .otsikko h2, .huomio-nuoli,
	.pagination .curPage, #subnav .arkki, #left ul.menu li.current {
	
		background-color:#C20E1A;
		color:#fff !important;
	}
	
	
	
	/* VÄRI 3 */
	
	.nappi.vari3, .laatikko.laatikko-vari3 .otsikko h2, .huomio2 .huomio-nuoli {
	
		background-color:#555;
		color:#fff !important;

	}


	/* VÄRI 4 */
	
	.nappi.vari4, a.nappi.vari4, .laatikko.laatikko-vari4 .otsikko h2, .vari3.huomio .huomio-nuoli, .huomio3 .huomio-nuoli {
	
		background-color:#fff;
		color:#333 !important;
	
	}
	
	
	/****** LAATIKKO OTSIKOIDEN NUOLET MOBIILISSA ******/
	
	@media (max-width:640px) {
	
		/* VÄRI 1 */
			.laatikot .laatikko .otsikko .open-icon {
			/* Tummat ikonit */
			background-image: url("../../../images/glyphicons-halflings.png") !important;	
				
			/* Vaaleat ikonit */
			/*background-image: url("../../../images/glyphicons-halflings-white.png") !important;*/
			}
			
		/* VÄRI 2 */
			.laatikot .laatikko.laatikko-vari2 .otsikko .open-icon {
			/* Tummat ikonit */
			/*background-image: url("../../../images/glyphicons-halflings.png") !important;*/
				
			/* Vaaleat ikonit */
			background-image: url("../../../images/glyphicons-halflings-white.png") !important;
			}
			
		/* VÄRI 3 */
			.laatikot .laatikko.laatikko-vari3 .otsikko .open-icon {
			/* Tummat ikonit */
			/*background-image: url("../../../images/glyphicons-halflings.png") !important;*/
				
			/* Vaaleat ikonit */
			background-image: url("../../../images/glyphicons-halflings-white.png") !important;
			}
			
			
		/* VÄRI 4 */
			.laatikot .laatikko.laatikko-vari4 .otsikko .open-icon {
			/* Tummat ikonit */
			background-image: url("../../../images/glyphicons-halflings.png") !important;	
				
			/* Vaaleat ikonit */
			/*background-image: url("../../../images/glyphicons-halflings-white.png") !important;*/
			}
	}
	
	
	/****** NAPIN HUOMIO-NUOLEN VÄRI *********/
		.huomio-reunus {
			background-image: url(../images/huomio_white.png);
			background-position:center;
		}


/**********************************************************************************
***********************************************************************************

$$$    $$$ $$$ $$$    $$$ $$$    $$$  $$$$$$$$         $$$   $$$$$$
$$$    $$$ $$$ $$$    $$$ $$$    $$$ $$$$$$$$$$        $$$  $$$$$$$$
$$$   $$$  $$$ $$$   $$$  $$$   $$$  $$$    $$$        $$$ $$$    $$$
$$$$$$$$   $$$ $$$$$$$$   $$$$$$$$   $$$    $$$        $$$ $$$    $$$
$$$$$$$$   $$$ $$$$$$$$   $$$$$$$$   $$$    $$$        $$$ $$$$$$$$$$
$$$   $$$  $$$ $$$   $$$  $$$   $$$  $$$    $$$ $$$    $$$ $$$$$$$$$$
$$$    $$$ $$$ $$$    $$$ $$$    $$$ $$$    $$$ $$$    $$$ $$$    $$$
$$$    $$$ $$$ $$$    $$$ $$$    $$$ $$$$$$$$$$ $$$$$$$$$$ $$$    $$$
$$$    $$$ $$$ $$$    $$$ $$$    $$$  $$$$$$$$   $$$$$$$$  $$$    $$$
  
  
***********************************************************************************
**********************************************************************************/




/*** TÄYSLEVEÄ NAVI ***/

/* JOS HALUAT KESKITTÄÄ VALIKKO NAPIT, VAIHTA #nav ul li { float: none } */


	@media (min-width:801px) {
		#nav .arkki {max-width:100%;text-align:Center;}
		#nav ul {width:1140px !important; margin:0 auto;}
		#nav ul li {width:auto !important;display:inline-block !important;float:left !important;}
		#nav ul {display:inline-block; width:100% !important; vertical-align:bottom !important;}
		.valikko-lista {text-align:center;}
		#nav ul li.level1 > a {padding:16px 13px !important;}
	}




/*** TÄYSLEVEÄ FOOTER ***/


	#footer .arkki {
		max-width: 100%;
	}
	#footer .footer-body {
		max-width:1140px;
		margin: 0 auto;
	}



/*** TÄYSLEVEÄ SLIDER ***/

	#showcase .arkki {
		max-width: 100% !important;
	}

	#vslider .slide-wrap {
		max-width: 1140px !important;
		margin: 0 auto !important;
	}



/************************************************************************************
*************************************************************************************
********                                                                   **********
********       TÄSTÄ ALKAA NORMAALI CSS-JUTUT JOTKA ON ENNENKIN OLLU       **********
********                ELI ALEMPANA EI OLE MITÄÄN UUTTA                   **********
********                                                                   **********
*************************************************************************************
************************************************************************************/


* {margin:0px;padding:0px;font-size:100%;font-style:inherit;font-weight:inherit;vertical-align: baseline;}
html, body { width:100%; }
html { height:100%; overflow:auto; overflow-y:scroll; }
a img {border-width:0px;}
table {border-collapse:collapse;border-spacing:0;}


/********** FONTIT, OTSIKOT YMS **********/
/* Leipäteksti */
body {
	font:normal normal 14px 'Open Sans', Arial, Helvetica, sans-serif;
	line-height:20px;
	font-weight:300;
}
	
/* Otsikko- yms erikoisfontti */
h1, h2, h3, h4, h5, h6, 
.nappi, a.nappi, div.pagination span a, div.pagination span strong {
	font-family:'Open Sans', Arial, sans-serif;
}
#nav ul li.level1 > a, .valikko-koti a, .valikko-avaa a, #nav ul li.level1.viimeinen a {
	font-family:'BenchNine', Arial, sans-serif;
}

/* Otsikot isoilla kirjaimilla */
/*h1, h2 { text-transform:uppercase; }*/

/* Otsikot */
h1 { font-size: 36px; line-height:40px; font-weight:300; color:#111; }
h2 { font-size: 24px; line-height:30px; font-weight:300; color:#C20E1A; }
.laatikko .otsikko h2 { font-size:24px; } /* Laatikon otsikon fonttikoko */
h3 { font-size: 18px; line-height:20px; font-weight:300; color:#444; }
h4 {font-size: 14px; font-weight:300; }
h5 {font-size: 13px; font-weight:300; }
h6 {font-size: 12px; font-weight:300; }

/* Valikko */
#nav ul li.level1 > a, .valikko-koti a, .valikko-avaa a { 
	font-weight:400; font-size:18px; text-transform:uppercase;
}

/* Napit ja sivutus */
.nappi, a.nappi, div.pagination span a, div.pagination span strong, #nav ul li.level1.viimeinen a {
	font-weight:300; font-size:14px;
}

/* Linkit */
a, a:visited, .eml { font-weight:600; }
h2 a { font-weight:300; }
h3 a { font-weight:300; }

/* Fonttien paksuuksia muissa elementeissä */
strong, b { font-weight:600; } /* Boldatut */
#subnav li a { font-weight:300; } /* Alavalikko */
#left ul.menu li a { font-weight:300; } /* Left-valikko */
#nav .submenu li a { font-weight:300; } /* Dropdown-valikko */
ul.sivukartta ul li a { font-weight:300; } /* Sivukartta */
a.call { font-weight:300; } /* Click to call */
.formNotice { font-weight:600; } /* Lomakkeen virheilmoitus */

/* Mobiili */
@media (max-width: 600px) {
	h1 { font-size:32px; line-height:32px; }
	h2 { font-size:24px; line-height:24px; }
	h3 { font-size:18px; line-height:20px; }
	h1,h2,h3,#nav ul li.level1 > a, .valikko-koti a, .valikko-avaa a,
	.nappi, a.nappi, div.pagination span a, div.pagination span strong, #nav ul li.level1.viimeinen a {
		text-transform:none;
	}
}
/*****************************************/

/* Linkit */
a, a:visited, .eml {
	color:#C20E1A;
	text-decoration:none;
}
a:hover {text-decoration:underline;}

/* Marginit ja muut yleiset */
#right h2, #left h2, #footer h2 { margin-top:0px; }
h1:last-child { margin-bottom:10px; }

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,iframe {margin-bottom: 20px;}
ul+ul { margin-top:0px; }
h2,h3 { margin-top:30px; margin-bottom:10px; }
p + ul {margin-top:-10px;}
h1+h2, h1+h3 { margin-top:-10px !important; }
h2+h3 { margin-top:0px; }
h2:first-child, h3:first-child { margin-top:0px; }
em, i {font-style:italic;}
hr { border:0px; border-top:1px dotted #aaa; }
td { vertical-align:top; }

h1,h2,h3,h4,h5,h6 {word-wrap:break-word; overflow-wrap:break-word;}


/************************************************************************************************************************/
/*** VÄRIT **************************************************************************************************************/
/************************************************************************************************************************/

/* Navi */
#nav ul li.level1 > a, .valikko-koti a, .valikko-avaa a {
	/* Navin linkkien väri */
	color:#222;
}

/* Dropdown */
#nav .submenu { background-color:#fff; } /* Taustaväri */
#nav .submenu li a { color:#333; } /* Linkkien väri */
#nav .submenu li a:hover { background-color:#f5f5f5; } /* Hoverin taustaväri */

/* Subnavi */
#subnav li a { color:#fff; }

/* Left navi */
#left ul.menu li a { color:#fff; }

/* Showcase */
#showcase .arkki {  }

/* Sisältöalue */
#sisalto { background-color:#fff; }

/* Bottom */
#bottom .arkki { background-color:#fff; }

/* Footer */
#footer { color:#fff; } /* Teksti */
#footer a { color:#fff; } /* Linkit */
#footer h2, #footer h3 { color:#fff; } /* Otsikot */
.sitemap, .copyright, .sitemap a { color:#555; } /* Sivukartta, Tietosuojaseloste ja Copyright-teksti */

/* Laatikot */
	.laatikko.perus, .laatikko.kuvaboksi, .laatikko.liukuteksti {
		background:#fff;
	}
	/* Koko laatikon linkin hover */
	.laatikko.isolinkki:hover {
		background:#efefef;
	}



/* Laatikoiden ja nappien alatekstit */
	.nappi em, .laatikko .otsikko h2 em { color:#eee !important; }
	.nappi.vari2 em, .laatikko.laatikko-vari2 .otsikko h2 em { color:#eee !important; }
	.nappi.vari3 em, .laatikko.laatikko-vari3 .otsikko h2 em { color:#666 !important; }
	.nappi.vari4 em, .laatikko.laatikko-vari4 .otsikko h2 em { color:#eee !important; }

/* Click to call -nappi tietokoneella katsottuna */
a.call { color:#333; }

/* Lomake */
.lomake .lomake-rivi {
	/* Yksi lomakkeen rivi */
	background:rgba(255,255,255,0.2);
	border:1px solid #fff;
}
.lomake .lomake-rivi:hover { /* Lomakkeen rivin hover */
	background:rgba(255,255,255,0.2);
}
.lomake .Required { color:#a00; } /* Vaaditun kentän *-merkki */
.lomake input, .lomake textarea, .googlemaps #reittiAlku {
	/* Tekstikentät */
	background:#fdfdfd;
	border:1px solid #aaa;
	color:#333;
}
.lomake select, .lomake option {
	/* Dropdown */
	background:#fff;
	border:1px solid #aaa;
	color:#333;
}
.lomake input:focus, .lomake textarea:focus, .lomake input:active, .lomake textarea:active,
.googlemaps #reittiAlku:focus, .googlemaps #reittiAlku:active {
	/* Tekstikenttä aktiivisena */
	border:1px solid #444;
	background:#fff;
}
.formRequiredNotice, .formRequiredList { color:#900; } /* Varoitus kentän täyttämättä jättämisestä */

/* Uutiset */
.uutinen .paivamaara, p.uutispaiva { color:#555; } /* Uutisen päivämäärä */

/* Taulukot */
table.perus td { border:1px solid #ccc; } /* Perustyyli */

table.ekarivi tr:first-child, table.ekasolu td:first-child { background:#eee; } /* Ekan rivin ja solun väritykset */
table.vikarivi tr:last-child, table.vikasolu td:last-child { background:#ddd; } /* Vikan rivin ja solun väritykset */

.pagination span a {color:#fff;}


/************************************************************************************************************************/
/************************************************************************************************************************/
/************************************************************************************************************************/




/*** HEADER *****************************************************************************************/
#header .arkki {position:relative;}
#header .logo p {
	margin:0px; 
	text-align:left; /* Logon sijainti */
}

/* Logo */
#header .logo { margin-top:10px; float:left; max-width:70%; }

/* Tarjouspallo */
#header .tarjouspallo { position:absolute; right:0; top:10px; z-index:999; }

#header .tarjouspallo p { margin:0px; }

/* Kuvien skaalaus */
#header .logo img, #header .tarjouspallo img { max-width:100%; }
/*
#header .tarjouspallo img { max-width:70%; }
*/

/* Responsiivinen logo ja tarjouspallo:
	- Tarjouspallo pois
	- Logo täysleveäksi ja keskitetyksi
*/
@media (max-width: 600px) {
	#header .logo { max-width:96%; width:96%; margin:5px 2%;position:relative;left:auto;right:auto;top:auto;bottom:auto;}
	#header .logo p { text-align:center; margin:0 auto; }
	#header .logo img { width:auto; max-width:100%; margin:0 auto; }
	#header .tarjouspallo { display:none; }
	
	
	/* Logon maksimikorkeus mobiilissa
		- Säädä isommaksi, jos logo on liian pieni!
	*/
	#header .logo img { max-height:50px; }
}

/****************************************************************************************************/


/*** NAVI *******************************************************************************************/
#nav .arkki {
}


#nav .nav-body {
	padding:0px;
}

/* Navin efektit */
#nav .nav-fx1 {}
#nav .nav-fx2 {}

/* Navi */

#nav ul.menu {margin:0px;padding:0px;}
#nav ul li.level1 {
	margin:0px;
	padding:0px;
	
	list-style:none;
	text-align:center;

	vertical-align:middle;
	
	position:relative;
}

#nav ul li.level1 > a, .valikko-koti a, .valikko-avaa a { 
	display:block;
	
	padding:10px 20px;
	
	text-align:center;	
	
	position:relative;
	z-index:24;
	background:transparent;
	
	-webkit-transition: all 200ms ease-in-out;
	-moz-transition: all 200ms ease-in-out;
	-o-transition: all 200ms ease-in-out;
	-ms-transition: all 200ms ease-in-out;
	transition: all 200ms ease-in-out;
}

/* Custom gridiarvo 
	Jos haluat asettaa itse leveyden valikon napeille,
	aseta valikon ulkoasuasetuksista gridiarvoksi grid_custom,
	ja muokkaa alta.
*/
/*#nav li.grid_custom { width:19.95%; }*/

/* Kun hiiren vie kohdalle */
#nav li.level1 > a:hover { 
	text-shadow:0px 0px 3px #fff;
	text-decoration:none;
	background:rgba(255,255,255,0.1);
}

/* Aktiivinen sivu */
#nav li.level1.current a {
	/*background:rgb(0,0,0);
	background:rgba(0,0,0,0.1);*/
	
	text-decoration:underline;
}

/* Navin viimeinen linkki 
	Katso muut tyylittelyt kohdasta nappi4!
*/
#nav ul li.level1.viimeinen {
	background-position:center center;
}
#nav ul li.level1.viimeinen a {
	padding:0px !important;
	padding-top:7px !important;
	padding-bottom:7px !important;
}

.valikko-koti, .valikko-avaa, #nav li a .ikoni, .mobiililinkki { display:none; }


/********** Subnavi **********************/

#subnav { margin-bottom:10px; }
#subnav .arkki {
}
#subnav .subnav-body {
}
#subnav ul, #subnav li { margin:0px; padding:0px; list-style:none; }
#subnav li {
	float:left;
	margin:5px 0;
}
#subnav li a {
	display:block;
	padding:0 5px;
	margin:0 5px;
	
	text-align:center;
	
	line-height:24px;
	font-size:12px;
	
	-webkit-transition: all 200ms ease-in-out;
	-moz-transition: all 200ms ease-in-out;
	-o-transition: all 200ms ease-in-out;
	-ms-transition: all 200ms ease-in-out;
	transition: all 200ms ease-in-out;
}
#subnav li a:hover { background:rgba(0,0,0,0.05); text-decoration:none; }
#subnav li.current a { text-decoration:underline; }

/*****************************************/


/********** Left navi ********************/

#left ul.menu, #left ul.menu li { margin:0px; padding:0px; list-style:none; }
#left ul.menu li {
		
	-webkit-transition: all 200ms ease-in-out;
	-moz-transition: all 200ms ease-in-out;
	-o-transition: all 200ms ease-in-out;
	-ms-transition: all 200ms ease-in-out;
	transition: all 200ms ease-in-out;
	
	background:#eee;
	
	margin:0 10px 2px 0;
}
#left ul.menu li a {
	display:block;
	
	font-size:13px;	
	color:#222;
	
	padding:8px 8px 8px 12px;
	transition:all 200ms;
}
#left ul.menu li a:after { content:" »"; }
#left ul.menu li a:hover { text-decoration:none; background-position:bottom center; text-indent:5px; }
#left ul.menu li.current { background:#ccc; }
#left ul.menu li.current a { text-decoration:underline; }

#left ul.menu li.item75 { background:#444; }
#left ul.menu li.item75 a { color:#fff; }

/*****************************************/

/* Mobiilin alavalikko */


/********** Dropdown *********************/
#nav li.level1 > .submenu {
	min-width:100%;
	width:260px; /* Dropdownin leveys */
	
	display:none;

	position:absolute;
	z-index:5000;
	top:100%;
	left:0px;
	
	-moz-box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
	-webkit-box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
	box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
}
#nav .submenu ul, #nav .submenu li {
	margin:0px;
	padding:0px;
	
	height:auto;
	list-style:none;
}

#nav .submenu li a {
	display:block;
	
	padding:8px 12px;
	
	font-size:13px !important;

	text-decoration:none !important;
	text-align:left !important;
	
	-webkit-transition: all 200ms ease-in-out;
	-moz-transition: all 200ms ease-in-out;
	-o-transition: all 200ms ease-in-out;
	-ms-transition: all 200ms ease-in-out;
	transition: all 200ms ease-in-out;
}
#nav .submenu li a:hover {
	text-indent:5px;
	text-decoration:none;
}
#nav .submenu .link { display:block; }

/* Alasivun alasivu */
#nav .submenu .submenu .link { padding-left:5px; }
#nav .submenu .submenu .link:before { content:"- "; }

#nav ul li.level1.hasSubItems:hover > .submenu, #nav ul li.level1.hasSubItems.openSub > .submenu {display:block;}

/*****************************************/


/********** Responsiivinen navi **********/

/* 1023 pikseliä leveä ruutu tai alle */
@media (max-width: 1023px) {
	#nav ul li a { padding-left:0px; padding-right:0px; font-size:15px; font-size:16px !important; }
}

@media (max-width: 800px) {
	#nav .nav-fx1 { background:none; }
}

/* 600 pikseliä leveä ruutu tai alle 
	- Mobiilivalikko
*/
@media (max-width: 600px) {
	/* Mobiilivalikon fontti */
	#nav ul li.level1 > a, #nav .submenu li a, #nav ul li.level1.viimeinen a {
		font-family:Arial, sans-serif;
		font-size:13px !important;
		
		text-transform:none;
	}
	
	/* Vikan linkin resettaus */
	#nav ul li.level1.viimeinen a, #nav ul li.level1.viimeinen {
		-moz-box-shadow: none !important;
		-webkit-box-shadow: none !important;
		box-shadow: none !important;
		background:transparent !important;
		border:0px !important;
		padding:0px !important;
	}

	#nav ul li.level1 > a, #nav .submenu li a, #nav ul li.level1.viimeinen > a {
		color:#333 !important; /* Tekstin väri */
	}

	/* Navin napit */
	#nav ul li.level1 {}
	#nav ul li.level1 > a, #nav .submenu li a, #nav ul li.level1.viimeinen a {
		padding:4px 6px !important;	
		text-align:left;
	}
	
	#nav ul li.level1 > a, #nav .submenu li a, #nav ul li.level1.viimeinen > a {
		border-bottom:1px solid #eee !important;
		margin:0px;
	}
	#nav ul li.level1:first-child > a { border-top: 1px solid #eee; }
	
	/* Hoveri ja focus */
	#nav li.level1 > a:hover, #nav .submenu li a:hover, #nav li.level1 > a:focus, #nav .submenu li a:focus,
	#nav li.level1.viimeinen > a:hover, #nav li.level1.viimeinen > a:focus {
		background:rgba(0,0,0,0.1) !important;
		text-decoration:none;
		text-indent:0px;
	}
	
	/* Sivu jossa ollaan */
	#nav li.active > a, #nav li.active > div > a { text-decoration:none !important; font-weight:700 !important; }
	#nav li.current > a { text-decoration:none !important; }
	
	/* Nuoli-ikoni */
	#nav li a .ikoni {
		display:block;
		float:right;
		
		margin-top:0.85%;
		
		-webkit-opacity: 0.15;
		-moz-opacity: 0.15;
		opacity: 0.15;
	}
	#nav li a:hover .ikoni, #nav li a:focus .ikoni {
		-webkit-opacity: 1;
		-moz-opacity: 1;
		opacity: 1;
	}
	
	/* Uusi valikkotyyli pienemmille näytöille */
	.valikko { margin-bottom:6px; }
	
	/* Nappien yhteiset tyylit */
	.valikko-koti, .valikko-avaa {
		display:block;
		float:left;
		
		background-position: center;
		background-repeat:repeat-x;
	}
	.valikko-koti a, .valikko-avaa a {
		display:block;
		
		padding:12px 0px !important;
		font-size:16px; 
		text-align:center;
		
		-moz-box-shadow: 0px 0px 4px rgba(0,0,0,0.3);
		-webkit-box-shadow: 0px 0px 4px rgba(0,0,0,0.3);
		box-shadow: 0px 0px 4px rgba(0,0,0,0.3);
		
		background:url(../../../images/heijastus.png) center center repeat-x !important;
	}
	.valikko-koti a:hover, .valikko-avaa a:hover {
		background:rgba(0,0,0,0.1) !important;
		text-decoration:none;
	}
	
	/* Nappien omat tyylit */
	.valikko-koti {
		width:20%;
		margin:0 2% 0px 2%;
	}
	.valikko-avaa {
		width:74%;
		margin:0 2% 0px 0;
	}
	
	/* Ikonit */
	.valikko-napit [class*="icon-"] {
		vertical-align:0px;
		
		/* Mustat ikonit */
		/*background-image: url("../../../images/glyphicons-halflings.png") !important;*/
	}
	
	/* Valikko-ikoni */
	.valikko-avaa .icon-th-list {margin-right:4px;}
	
	/* Valikon avausnappi, kun valikko on auki */
	.valikko-avaa.avattu {
		background:#fff;
		
	}
	.valikko-avaa.avattu .icon-th-list { background-image: url("../../../images/glyphicons-halflings.png") !important; }
	.valikko-avaa.avattu a { color:#000 !important; }
	
	/* Wrapper, jonka sisään itse valikko avataan */
	.valikko-lista {
		margin:0 2%;
		clear:both;
		
		position:relative;
		z-index:200;
		
		display:none;
		
		background:#fff;
		
		padding:6px;
	}
	
	/* Mobiililinkki */
	.mobiililinkki { display:block; width:96%; margin:0 2% 5px 2%; }
	
	/* Dropdownista tehdään subnavi */
	#nav li.level1 > .submenu {
		display:block;
		position:relative;
		top:auto;
		left:auto;
		bottom:auto;
		right:auto;
		z-index:1;
		width:auto;
		
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		box-shadow: none;
	}
	#nav .submenu .link:before { content: "- "; }
	#nav .submenu .submenu .link { padding-left:10px; }
}

/* Avaa valikon, jos mennään yli 600px resoihin */
@media (min-width: 601px) {
	.valikko-lista {
		display:block !important;
	}
}

/****************************************************************************************************/


/*** SHOWCASE ***************************************************************************************/
#showcase { margin-bottom:0px;position:relative;}
#showcase .arkki {
	position:relative;
	overflow:hidden;
}
/****************************************************************************************************/


/*** SISÄLTÖALUE ************************************************************************************/
#sisalto .arkki {
}
#sisalto .sisalto-body { padding:20px 10px; }
#sisalto { margin-bottom:0px; }

/****************************************************************************************************/


/*** BOTTOM *****************************************************************************************/
#bottom .arkki {
}
#bottom .bottom-body { padding:20px 10px; }
#bottom { margin-bottom:0px; }

/****************************************************************************************************/


/*** FOOTER *****************************************************************************************/
#footer .arkki {
}
#footer .footer-body {padding:20px;}
#footer { margin-bottom:0px; }

/* Ikonit */
#footer a.call .icon-phone, #footer a.email .icon-envelope {
	background-image: url("../../../images/glyphicons-halflings-white.png") !important;
}

/* Efektit */
#footer .footer-fx1 {}
#footer .footer-fx2 {}

/* Copyright ja sivukarttalinkit */
#copy .copy-body {padding:10px 5px 10px 5px;}
.sitemap { float:left; }
.copyright { float:right; }

.sitemap p, .sitemap ul{ margin:0px 0px 10px 0px; padding:0px; display:inline; }
.sitemap li { margin:0px; list-style:none; display:inline; }
.sitemap li:after { content:" | "; }
.sitemap li:last-child:after { content: ""; }
.sitemap, .copyright { font-size:0.8em; }

/* Sivukartta */
ul.sivukartta {
	margin:0px;
	padding:0px;
	list-style:none;
}
ul.sivukartta li {
	margin:0px;
	padding:2px 0 0 0;
	list-style:none;
}
ul.sivukartta li a {
	display:inline-block;
	width:100%;
	max-width:300px;
	display:block;
	line-height:30px;
	padding:0px 5px;
	background:#fff;
	color:#222;
	margin:0px;
	border:1px solid #ddd;
	font-size:12px;
}
ul.sivukartta li a:hover { text-indent:5px; background:#f5f5f5; }
ul.sivukartta ul { margin:0px; padding:0px; list-style:none; background:url(../../../images/sitemap3.png) top left repeat-y; }
ul.sivukartta ul li { padding-left:18px; background:url(../../../images/sitemap1.png) top left no-repeat; }
ul.sivukartta ul li:last-child { }
ul.sivukartta ul li a { color:#444; }

/* Takaisin ylös */
.takaisinylos { display:none; }
@media (max-width: 600px) {
	.takaisinylos { display:block; }
	.takaisinylos a.nappi {text-align:right;}
	.takaisinylos a.nappi:hover { text-indent:0px !important; }
	.takaisinylos a.nappi .ikoni { 
		background-image: url("../../../images/glyphicons-halflings-white.png") !important; 
		vertical-align:baseline;
		margin-left:4px;}
	a.email {font-size:14px;}
	}
}

/****************************************************************************************************/


/*** PALSTAT ****************************************************************************************/

/* Kaikki palstat */
.palstat {}

/* Yksi palsta */
.palsta {margin-bottom:10px;}

/* Palstan tekstialue */
.palsta-content {position:relative;}
.palsta-content h2 { margin-top:0px; margin-bottom:10px; }
.palsta-content p > img:last-child { margin-bottom:-15px; }
.palsta-content p:last-child { margin-bottom:0px; }

/* Palstan ylä- ja alaosa */
.palsta-yla {}
.palsta-ala {}


/****************************************************************************************************/


/*** NAPIT JA SIVUTUS *******************************************************************************/

.nappi, a.nappi, div.pagination span a, div.pagination span strong, #nav ul li.level1.viimeinen a {
	display:inline-block;
	clear:both;
	
	padding:8px 60px 8px 10px;
	
	background-repeat:repeat-x;
	
	
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 150ms ease-in-out;
	-o-transition: all 150ms ease-in-out;
	-ms-transition: all 150ms ease-in-out;
	transition: all 150ms ease-in-out;
	
	cursor:pointer;
	
	position:relative;
}
/* Eri leveydet */
.nappi.levea, .nappi.tayslevea, #nav ul li.level1.viimeinen a { display:block; }
.nappi.levea { width:50%; }
.nappi.tayslevea { width:auto !important; }

/* Napit, joissa ei ole nuolta */
/*.nappi.vari3, .nappi.vari4, .nappi.huomio-pois, div.pagination span a, div.pagination span strong { 
	padding:8px 15px; 
}*/

/* Nuolten padding */
.nappi.huomio, .nappi.huomio1, .nappi.huomio2, .nappi.huomio3 {padding-right:60px;padding-left:10px;}

/* Pieni nappi */
.nappi.pieni { font-size:14px; padding-top:4px; padding-bottom:4px; }

/* Iso nappi */
.nappi.iso { font-size:20px; padding-top:12px; padding-bottom:12px; }

/* Pyöristykset */
.nappi, a.nappi, div.pagination span a,
div.pagination span strong,
div.pagination span, .huomio-nuoli {}


/* Nappi 1 ja sivutusnappi */
.nappi, a.nappi, div.pagination span a, div.pagination span strong {
}

/* Nappi 2 ja sivutuksen sivu, jolla ollaan */
.nappi.vari2, a.nappi.vari2, div.pagination span.curPage strong {
}

/* Nappi 3 */
.nappi.vari3, a.nappi.vari3 {
	border:3px solid rgba(0,0,0,0.03);
}


/* Nappi 4 ja navin viimeinen linkki */
.nappi.vari4, a.nappi.vari4, #nav ul li.level1.viimeinen {
	
}
.nappi.vari4, a.nappi.vari4, #nav ul li.level1.viimeinen a {
	border:3px solid rgba(0,0,0,0.05);
}



/* Huomionuolet */
.huomio-nuoli, .huomio1 .huomio-nuoli {
	display:block;
	background-position:center;
	background-repeat:repeat-x;
	width:36px;
	
	position:absolute;
	right:2px;
	top:2px;
	bottom:2px;
	
	-moz-box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
	-webkit-box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
	box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
}
.huomio-nuoli .huomio-reunus {
	display:block;
	position:absolute;
	top:0px;
	left:0px;
	right:0px;
	bottom:0px;
	
	border:2px solid rgba(0,0,0,0.05);
}
.huomio-pois .huomio-nuoli, .vari3 .huomio-nuoli, .vari4 .huomio-nuoli {display:none;}

.vari2 .huomio-nuoli, .huomio2 .huomio-nuoli, .vari3.huomio2 .huomio-nuoli, .vari4.huomio2 .huomio-nuoli {
	background-repeat:repeat-x;
	
	display:block;
}
.huomio1 .huomio-nuoli, .vari3.huomio1 .huomio-nuoli, .vari4.huomio1 .huomio-nuoli {
	
	background-repeat:repeat-x;
	display:block;
}
.huomio .huomio-nuoli, .vari3.huomio .huomio-nuoli, .vari4.huomio .huomio-nuoli {
	background-repeat:repeat-x;
	
	display:block;
}


/* Nappien hoverit */
.nappi:hover, a.nappi:hover, div.pagination span a:hover, div.pagination span strong:hover {
	text-decoration:none;
	
	-moz-box-shadow: 0px 0px 2px rgba(0,0,0,0.4);
	-webkit-box-shadow: 0px 0px 2px rgba(0,0,0,0.4);
	box-shadow: 0px 0px 2px rgba(0,0,0,0.4);
	
	text-shadow:0px 0px 3px #fff;
}
.nappi.levea:hover, .nappi.tayslevea:hover {
	text-indent:8px;
}

.nappi:active, a.nappi:active, div.pagination span a:active, div.pagination span strong:active {
	background-position:bottom center;
}

/* Toinen rivi */
a.nappi em, .nappi em {
	display:block;
	clear:both;
	font-size:0.85em;
	font-style:normal;
}

/* Sivutus */
div.pagination span a, div.pagination span strong { padding:8px 10px; }
.sivutus { position:relative; }
.sivutus #load-first { position:relative; }
div.pagination { text-align:center; }
div.pagination span { display:inline-block; }
div.pagination span a, div.pagination span strong {
	display:inline-block;
}

/* Seuraavan sivun lataamiseen käytetty apudivi */
.sivutus #preloadNext { display:none; }

/* Latausanimaatio */
.sivutus .loading {
	position:absolute;
	top:0px;
	left:0px;
	bottom:0px;
	right:0px;
	
	z-index:5;
	background-color:#ffffff;
	background-color:rgba(255,255,255,0.8);
	background-image:url(../../../images/loading.gif);
	background-repeat:no-repeat;
	background-position:center center;
	
	display:none;
}

/* Sivutus hover */
div.pagination span a:hover {
	text-decoration:none;
}

/* Click to call ja email -napit */
a.call {
	text-decoration:none;
	cursor:default;
}

a.email {}

/* Ikonit */
a.call .icon-phone, a.email .icon-envelope {
	margin-right:4px;
	
	/* Vaaleat ikonit */
	/*background-image: url("../../../images/glyphicons-halflings-white.png");*/
}

/* Isot click to call ja email -napit mobiiliin
	mobiilissa lisätään nappeihin automaattisesti
	luokat "nappi vari4 tayslevea huomio") */
a.call.nappi, a.email.nappi { padding:8px 5px; }
a.call.nappi .icon-phone, a.email.nappi .icon-envelope {
	background-image: url("../../../images/glyphicons-halflings-white.png");
	vertical-align:middle;
}
/****************************************************************************************************/


/*** LAATIKOT **************************************************************************************/

/***************************/
/* Laatikoiden pohja       */
/***************************/
	.laatikot {}
	.laatikko {
		height:auto;
		position:relative;
	
		margin-bottom:20px;
	}
	.laatikko .otsikko {position:relative;}
	.laatikko .kuva {
		height:240px;
		width:100%;
		
		background-size:contain;
		background-position:center center;
		background-repeat:no-repeat;
		
		margin-bottom:10px;
	}
	.laatikko.matala .kuva {height:100px;}
	.laatikko.korkea .kuva {height:300px;}
	
	.laatikko .laatikko-content { margin-bottom:10px; }	
	.laatikko h2, .laatikko h3 { margin-top:0px; margin-bottom:10px; }	
	.laatikko .linkki .nappi {display:block;}	
	.laatikko .open-icon {display:none;}
	
	/* Koko laatikon linkki */
	.laatikko a.isolinkki {
		display:block;
		z-index:50;
		position:absolute;
		top:0px; left:0px; right:0px; bottom:0px;
	}
	.laatikko.isolinkki:hover {
		-moz-box-shadow: 0px 0px 6px rgba(0,0,0,0.8);
		-webkit-box-shadow: 0px 0px 6px rgba(0,0,0,0.8);
		box-shadow: 0px 0px 6px rgba(0,0,0,0.8);
	}
	
	/* Otsikot */
	.laatikko .otsikko h2 {
		position:relative;

		border:2px solid rgba(0,0,0,0.1);
		margin:0px;
		
		padding:8px 12px;
	}

	
	/* Otsikon alateksti */
	.laatikko .otsikko h2 em {
		display:block;
		clear:both;
		font-size:0.65em;
		font-style:normal;
	}

	/* Pyöristys */
	.laatikko.pyorea, .laatikko.pyorea .kuva,
	.laatikko.pyorea .otsikko, .laatikko.pyorea .otsikko h2,
	.laatikko.pyorea .linkki, .laatikko.pyorea .linkki .nappi,
	.laatikko.pyorea .teksti {
		-moz-border-radius: 6px;
		-webkit-border-radius: 6px;
		border-radius: 6px;
	}

	/* 
		Responsiivisuus
		- Piilotetaan laatikoiden sisältö otsikkonapin taakse avattaviksi
		- Lasketaan kuvien korkeutta
	*/
	@media (max-width: 600px) {

		.laatikot .laatikko.imOpen .otsikko .open-icon {
			background-position: -313px -119px;
		}
		.laatikko .kuva {height:150px;}
		.laatikko.matala .kuva {height:75px;}
		.laatikko.korkea .kuva  {height:225px;}
	}

/***************************/
/* Laatikko: Perus         */
/***************************/
	.laatikko.perus {
		-moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.4);
		-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.4);
		box-shadow: 0px 0px 3px rgba(0,0,0,0.4);
		
		padding:15px;
	}
	.laatikko.perus .otsikko {margin:-15px -15px 15px -15px;}

	/*
		Responsiivisuus
		- Jos laatikossa ei tekstiä, poistetaan laatikko ja näytetään pelkkä linkkinappi
	*/
	@media (max-width:600px) {
		.laatikko.perus.noText.hasLink {
			-moz-box-shadow: none;
			-webkit-box-shadow: none;
			box-shadow: none;
			
			padding:0px;
			margin-bottom:0px !important;
		}
		.laatikko.perus.noText.hasLink .laatikko-content, .laatikko.perus.noText.hasLink .kuva,
		.laatikko.perus.noText.hasLink .otsikko {
			display:none;
		}
	}

/***************************/
/* Laatikko: Kuvaboksi     */
/***************************/
	.laatikko.kuvaboksi {
		-moz-box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
		-webkit-box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
		box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
		
		margin-left:10px;
		margin-right:10px;
	}
	
	.laatikko.kuvaboksi .otsikko {position:absolute;top:15px; left:-10px; right:-10px;}
	.laatikko.kuvaboksi .linkki { 
		margin:0px 0px 0px -5px;
		padding-bottom:15px;
		width:95%;
	}
	
	.laatikko.kuvaboksi .teksti {
		padding:0 10px;
	}
	
	/* Jos ei kuvaa */
	.laatikko.kuvaboksi.noPic .otsikko {
		position:relative;top:auto;left:auto;right:auto;
		margin-left:-10px; margin-right:-10px;
		margin-top:10px;
		margin-bottom:10px;
	}
	
	/* Jos ei tekstiä */
	.laatikko.kuvaboksi.hasPic.noText .laatikko-content {margin-bottom:0px;}
	.laatikko.kuvaboksi.hasPic.noText .linkki {
		margin:0px;
		position:absolute;
		left:-5px;
		bottom:20px;
		width:95%;
		padding:0px;
	}
	
	/* 
		Responsiivisuus
		- Resetataan napit ja otsikot
		- Siirretään tekstittömän laatikon nappi kuvan päälle
		- Pyöristysten fiksailua
	*/
	@media (max-width: 600px) {
		.laatikko.kuvaboksi {margin-left:0px; margin-right:0px; margin-bottom:15px;}
		.laatikko.kuvaboksi .otsikko {
			position:relative !important;
			top:auto !important;
			left:auto !important;
			right:auto !important;
			bottom:auto !important;
			margin:0px !important;
		}
		.laatikko.kuvaboksi .linkki {
			width:auto !important;
			margin:0px !important;
			padding:0px !important;
			position:relative !important;
			top:auto !important;
			left:auto !important;
			bottom:auto !important;
		}
		.laatikko.kuvaboksi.hasOtsikko.hasPic .kuva { margin-top:-15px; }
		.laatikko.kuvaboksi.hasPic.noText .kuva { margin-bottom:0px; }
		.laatikko.kuvaboksi.hasText .linkki { padding:0px 15px 15px 15px !important; }
		.laatikko.kuvaboksi.noText.hasPic .linkki { 
			position:absolute !important; bottom:15px !important; left:15px !important; right:15px !important; 
		}
		
		.laatikko.kuvaboksi.imOpen .otsikko, .laatikko.kuvaboksi.imOpen .otsikko h2,
		.laatikko.kuvaboksi.alwaysOpen .otsikko, .laatikko.kuvaboksi.alwaysOpen .otsikko h2 {
			-moz-bottom-left-border-radius: 0px; -webkit-bottom-left-border-radius: 0px; border-bottom-left-radius: 0px;
			-moz-bottom-right-border-radius: 0px; -webkit-bottom-right-border-radius: 0px; border-bottom-right-radius: 0px;
		}
		.laatikko.kuvaboksi.hasOtsikko.imOpen .kuva, .laatikko.kuvaboksi.hasOtsikko.alwaysOpen .kuva {
			-moz-top-left-border-radius: 0px; -webkit-top-left-border-radius: 0px; border-top-left-radius: 0px;
			-moz-top-right-border-radius: 0px; -webkit-top-right-border-radius: 0px; border-top-right-radius: 0px;
		}
	}

/***************************/
/* Laatikko: Liukuteksti   */
/***************************/
	.laatikko.liukuteksti {
		-moz-box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
		-webkit-box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
		box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
		
		margin-bottom:10px;
	}
	.laatikko.liukuteksti .laatikko-content {
		overflow:hidden;
		position:relative;
		margin:0px;
	}
	.laatikko.liukuteksti .teksti {
		margin:0px;
		padding:15px;
		
		position:absolute;
		top:0;
		left:0px;
		bottom:0%;
		right:0px;
		opacity:1;
		
		-webkit-transition: all 650ms;
		-moz-transition: all 650ms;
		-o-transition: all 650ms;
		-ms-transition: all 650ms;
		transition: all 650ms;
		
		/* Vaalea tausta ja tumma teksti */
		background:#fff;
		background:rgba(255,255,255,0.9);
		color:#333;
		
		/* Tumma tausta ja vaalea teksti */
		/*background:#000;
		background:rgba(0,0,0,0.7);
		color:#fff;*/
	}
	.laatikko.liukuteksti .kuva {margin:0px;}
	
	.laatikko.liukuteksti:hover .teksti, .isMobile .laatikko.liukuteksti .teksti,
	.isTablet .laatikko.liukuteksti .teksti { top:0px !important; bottom:0px !important; opacity:1; }
	
	/* Pyöristyksen ylikirjoitus */
	.laatikko.liukuteksti.pyorea .otsikko, .laatikko.liukuteksti.pyorea .otsikko h2,
	.laatikko.liukuteksti.pyorea.hasLink .teksti, .laatikko.liukuteksti.pyorea.hasLink .kuva {
		-moz-bottom-left-border-radius: 0px; -webkit-bottom-left-border-radius: 0px; border-bottom-left-radius: 0px;
		-moz-bottom-right-border-radius: 0px; -webkit-bottom-right-border-radius: 0px; border-bottom-right-radius: 0px;
	}
	.laatikko.liukuteksti.pyorea .linkki, .laatikko.liukuteksti.pyorea .linkki .nappi,
	.laatikko.liukuteksti.pyorea.hasOtsikko .kuva {
		-moz-top-left-border-radius: 0px; -webkit-top-left-border-radius: 0px; border-top-left-radius: 0px;
		-moz-top-right-border-radius: 0px; -webkit-top-right-border-radius: 0px; border-top-right-radius: 0px;
	}
	
	/* 
		Responsiivisuus
		- 800px: Näytetään tekstit kuvien alla, ei päällä
		- 600px: Pyöristyksen fiksailua ja otsikon margin
	*/
	@media (max-width: 800px) {
		.laatikko.liukuteksti .teksti {
			position:relative;
			left:auto;
			bottom:auto;
			right:auto;
			
			background:transparent;
			
			padding-bottom:0px;
		}
		.laatikot .laatikko.liukuteksti .otsikko {
			margin-bottom:0px !important;
		}
	}
	@media (max-width:600px) {
		.laatikot .laatikko.liukuteksti .otsikko {
			margin-bottom:-10px !important;
		}
		.laatikot .laatikko.liukuteksti.pyorea .otsikko, .laatikot .laatikko.liukuteksti.pyorea .otsikko h2 {
			-moz-bottom-left-border-radius: 6px; -webkit-bottom-left-border-radius: 6px; border-bottom-left-radius: 6px;
			-moz-bottom-right-border-radius: 6px; -webkit-bottom-right-border-radius: 6px; border-bottom-right-radius: 6px;
		}
		.laatikot .laatikko.liukuteksti.imOpen .otsikko, .laatikot .laatikko.liukuteksti.alwaysOpen .otsikko {
			margin-bottom:0px !important;
		}
		.laatikot .laatikko.liukuteksti.pyorea.imOpen .otsikko, .laatikot .laatikko.liukuteksti.pyorea.alwaysOpen .otsikko,
		.laatikot .laatikko.liukuteksti.pyorea.imOpen .otsikko h2, .laatikot .laatikko.liukuteksti.pyorea.alwaysOpen .otsikko h2 {
			-moz-bottom-left-border-radius: 0px; -webkit-bottom-left-border-radius: 0px; border-bottom-left-radius: 0px;
			-moz-bottom-right-border-radius: 0px; -webkit-bottom-right-border-radius: 0px; border-bottom-right-radius: 0px;
		}
	}
	

/***************************/
/* Efektit yms             */
/***************************/

/* Nauhat */
.fx [class*="nauha-"] {
	position:absolute;
	top:0px;
	right:0px;
	
	z-index:10;

	width:120px;
	height:120px;

	background-position:center center;
	background-repeat:no-repeat;
	background-size:contain;
}
.fx .nauha-tarjous { background-image:url(../../../images/nauha-tarjous.png); }
.fx .nauha-uutuus { background-image:url(../../../images/nauha-uutuus.png); }
.fx .nauha-luelisaa { background-image:url(../../../images/nauha-luelisaa.png); }
.fx .nauha-otayhteytta { background-image:url(../../../images/nauha-otayhteytta.png); }

.kuvalaatikot .fx [class*="nauha-"] {
	right:0px;
}

/* Pallot */
.fx [class*="pallo-"] {
	position:absolute;
	top:-12px;
	right:-12px;
	
	z-index:10;
	
	width:94px;
	height:94px;
	
	background-position:center center;
	background-repeat:no-repeat;
	background-size:contain;
}
.fx .pallo-tarjous { background-image:url(../../../images/pallo-tarjous.png); }
.fx .pallo-uutuus { background-image:url(../../../images/pallo-uutuus.png); }
.fx .pallo-luelisaa { background-image:url(../../../images/pallo-luelisaa.png); }
.fx .pallo-otayhteytta { background-image:url(../../../images/pallo-otayhteytta.png); }

@media (max-width:600px) {
	.fx {display:none;}
}
/****************************************************************************************************/


/*** LOMAKE *****************************************************************************************/
.lomake {width:100%;}
.lomake .lomake-rivi {
	width:100%;
	margin-bottom:2px;
}
.lomake .lomake-rivi .lomake-otsikko {
	font-size:16px;
	line-height:18px;
}
.lomake .lomake-rivi.otsikko-rivi { background:transparent; border:0px; }
.lomake .lomake-rivi .lomake-otsikko h2 { padding:5px; margin:0px; }
.lomake .lomake-rivi .label {
	width:30%;
	
	margin-right:5%;
	padding:5px 0;
	
	float:left;
}
.lomake .lomake-rivi .label .rauli { display:block; padding:0 5px; }
.lomake .lomake-rivi .kentta { width:60%; float:left; padding:5px 0; }

/* Elementit */

.lomake .formTextinput, .lomake input[type=text], .lomake .formEmailinput, .lomake .formTelinput { 
	height:20px; 
	line-height:20px;
	width:100%;
}
.lomake select {width:100%; height:24px;}
.lomake select option { line-height:24px; height:24px; }
.lomake textarea { max-width:100%; width:100%; min-height:125px; }

.lomake input:hover, .lomake textarea:hover {
	-moz-box-shadow: 0px 0px 5px #aaa;
	-webkit-box-shadow: 0px 0px 5px #aaa;
	box-shadow: 0px 0px 5px #aaa;
}
.lomake input:focus, .lomake textarea:focus, .lomake input:active, .lomake textarea:active {
	-moz-box-shadow: 0px 0px 8px #444;
	-webkit-box-shadow: 0px 0px 8px #444;
	box-shadow: 0px 0px 8px #444;
	outline:0;
}

.lomake label.formCheckboxLabelHolder, .lomake label.formRadioLabelHolder {
	display:inline-block;
	line-height:14px;
	margin-bottom:5px;
	margin-right:10px;
}

.laheta button {
	padding:8px 25px;
}

/* Huomautukset */

.formNotice { font-size:14px; }
.formRequiredList { font-style:italic; }

/****************************************************************************************************/


/*** UUTISET JA BLOGI *******************************************************************************/
.uutinen .info { margin-bottom:20px; }
.uutinen .luelisaa { width:60%; float:left; }
.uutinen .paivamaara { width:40%; float:right; text-align:right; font-style:italic; }
.uutinen-lyhyt {margin-bottom:5px;}
p.uutispaiva { font-style:italic; }

/* Blogi */
.blogi-kuva {
	width:25%;
	margin-left:5%;
	margin-bottom:5%;
	float:right;
}
.blogi-kuva .uutiskuva { width:100%; display:inline-block; }
.blogi-kuva img {max-width:100%;}

.blogi-lista h2 { display:block; }
.blogi-kommentit {
	display:inline-block;
	font-size:16px !important;
	line-height:20px;
	padding:0 4px;
	position:relative;
	top:-4px;
	text-align:center;
	margin-left:3px;
	
	background: #ffffff;
	border: 1px solid #c9c9c9;
}
.blogi-kommentit:hover {
	-moz-box-shadow: 0px 0px 2px #aaa;
	-webkit-box-shadow: 0px 0px 2px #aaa;
	box-shadow: 0px 0px 2px #aaa;
}
.blogi-kommentit:after, .blogi-kommentit:before {
	top: 100%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.blogi-kommentit:after {
	border-color: rgba(255, 255, 255, 0);
	border-top-color: #ffffff;
	border-width: 6px;
	left: 50%;
	margin-left: -6px;
}
.blogi-kommentit:before {
	border-color: rgba(201, 201, 201, 0);
	border-top-color: #c9c9c9;
	border-width: 7px;
	left: 50%;
	margin-left: -7px;
}
.blogi p.uutispaiva { font-size:12px; }

/* Kommentointi */
.kommentit hr {margin:10px 0;}
.kommentti {}
.kommentti .tiedot {
	float:left;
	width:30%;
	margin-right:5%;
	
	font-size:12px;
}
.kommentti .tiedot p { margin-bottom:0px; }
.kommentti .teksti {
	float:right;
	width:65%;
}

/* Kategoriavalikko */
#right.blogisivu ul.menu, #right.blogisivu ul.menu li { margin:0px; padding:0px; list-style:none; }
#right.blogisivu .laatikko-content { margin-bottom:0px; }

/*** Responsiivinen **********************/
/* 600px tai alle: 
	- Piilotetaan uutiskuva
	- Lue lisää & päivämäärä allekkain
*/
@media (max-width: 600px) {
	.uutiskuva img { display:none; }
	.uutinen .luelisaa, .uutinen .paivamaara { width:auto; float:none; clear:both; text-align:left; }
	
	.blogi-teksti { width:auto !important; float:none; margin-right:none; }
	.blogi-kuva { display:none; }
}
/*****************************************/

/****************************************************************************************************/


/*** HAKU *******************************************************************************************/
.haku {margin-bottom:20px; line-height:30px; }
.haku-lomake-hakusanat, .haku-lomake-laheta { height:30px; line-height:30px; }
.haku-lomake-hakusanat {width:400px; max-width:100%;}
.haku-lomake-laheta { padding:0 8px; }

.haku.pieni .haku-lomake-hakusanat, .haku.pieni .haku-lomake-laheta {
	width:100%;
}

.haku-tulokset hr {margin-bottom:10px;}
.haku-tulokset .haku-isoteksti { margin-bottom:10px; }
.haku-tulokset .haku-lisateksti {
	margin-left:20px;
	border-left:2px solid #ccc;
	padding-left:10px;
	font-style:italic;
}

.haku .categorylist p { margin-bottom:0px; }
.haku .search_catlist label { margin-right:12px; }
.haku.pieni .search_catlist label { display:block; margin-right:0px; }
.haku .search_catlist label input { margin-right:2px; }

@media (max-width:600px) {
	.haku-lomake-hakusanat, .haku-lomake-laheta {
		width:100%;
		height:36px; line-height:36px;
	}
	
	.haku .search_catlist label { display:block; margin-right:0px; }
}
/****************************************************************************************************/


/*** GOOGLE MAPS ************************************************************************************/
.googlemaps #map_canvas {
	width:100%;
	height:250px;
	margin-bottom:5px;
}

.googlemaps .reittiHaku {}
.googlemaps .reittiHaku h3 { display:inline-block; margin:0px; }

.googlemaps .reittiHaku .pad { padding:3px !important; }

.googlemaps #rh-valinta select, .googlemaps #rh-valinta option {
	width:100%;
	padding:7px 4px 7px 2px;
}

.googlemaps #reittiAlku { width:100%; padding:8px 0px; text-indent:3px; }
.googlemaps #reittiAlku.empty { color:#999; font-style:italic; }
.googlemaps #haeReitti { width:100% !important; padding:8px 10px !important; text-align:left; border:0; }

#right .googlemaps .grid_6, #right .googlemaps .grid_4,
#left .googlemaps .grid_6, #left .googlemaps .grid_4 {
	float:none !important;
	width:auto !important;
	display:block !important;
}

/****************************************************************************************************/


/*** JAKAMINEN **************************************************************************************/
.jako {}
.jako .media { display:inline-block; }
.jako .media iframe { margin:0px; }

.jako .media.facebook { display:block; width:100%; max-width:450px; }
.jako .media.facebook .fb-like { position:relative; top:-3px; width:100%; max-width:450px; }
.jako .media.facebook .fb-like > span { width:100% !important; max-width:450px !important; }
.jako .media.facebook iframe { z-index:200; }
/****************************************************************************************************/


/*** TUOTTEET ***************************************************************************************/

/* Tuotesivupohja */
#left.tuotesivu hr { display:none; }
#left.tuotesivu h2 { margin-top:0px; }

/* Mobiilinappi */
.tuotelista-mobiilinappi { display:none; margin-top:-10px; }
.tuotelista-mobiilinappi a { margin-bottom:15px; }

/* Tuotelista */
.tuotelista .tuote-vasen {float:left; width:60%; margin-right:5%;}
.tuotelista .tuote-oikea {float:right; width:35%;}

.tuotelista .tuote-pad { padding:10px; }

/* Tuotekuvan jaetut tyylit */
.tuote-kuva {
	display:block;
	
	-webkit-transition: all 250ms;
	-moz-transition: all 250ms;
	-o-transition: all 250ms;
	-ms-transition: all 250ms;
	transition: all 250ms;
	

	background-repeat:no-repeat;
	background-position:center center;
	background-size:contain;
}
.tuote-kuva:hover {
	-moz-box-shadow: 0px 0px 8px rgba(0,0,0,0.6);
	-webkit-box-shadow: 0px 0px 8px rgba(0,0,0,0.6);
	box-shadow: 0px 0px 8px rgba(0,0,0,0.6);	
}

/* Tuotteen kuva tuotelistassa */
.tuotelista .tuote-kuva {
	width:100%;
	height:180px;	
}
/* Pienempi kuva, jos käytössä ei ole tuotekorttia */
.tuotelista.eikorttia .tuote-kuva {
	height:150px;
}

/* Tuotteen kuva tuotekortissa */
.tuotekortti .tuote-kuva {
	width:100%;
	height:200px;
	
	margin:0;
}

/* Responsiivisuus 
*/
@media (max-width:800px) {
	#left.tuotesivu hr { display:block; }
	.tuotelista-mobiilinappi { display:block; }
}
@media (max-width:600px) {
	.tuotelista .tuote-kuva { height:120px; }
}

@media (max-width:480px) {
	.tuotelista .tuote-vasen, .tuotelista .tuote-oikea { float:none; width:100%; margin:0px; }
	.tuotelista .tuote-kuva { margin-bottom:5px; }
}

/****************************************************************************************************/


/*** YLEISET ****************************************************************************************/

/* Taulukko */
table.perus td { padding:10px; }

/* Kuvat */
img.varjo {
	-moz-box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
	-webkit-box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
	box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
}

img.reunat {
	padding:9px;
	border:1px solid #aaa;
	background:#fff;
	
	max-width:95%;
}

/* Siirretään joku elementti alas */
.alas {
	position:absolute;
	bottom:0px;
	left:0px;
	right:0px;
}

/* Lainaus/quote/nosto */
.quote {
	float:right;
	width:30%;
	
	padding:15px;
	margin-left:10px;
	margin-bottom:10px;
	
	background:rgba(100,100,100,0.1);
	
	font-style:italic;
	font-size:1.15em;
	line-height:1.25em;
}

/****************************************************************************************************/


/*** SLIDESHOW **************************************************************************************/

/* Sliderin korkeus eri resoluutioissa */
#vslider {height:70vh;}
@media (max-width:1024px) {#vslider {height:310px;}}
@media (max-width:980px) {#vslider {height:280px;}}
@media (max-width:800px) {#vslider {height:250px; padding:0px;}}
@media (max-width:760px) {#vslider {height:230px;}}


/* Nappien taustaväri
	Läpinäkyvyyttä tukeva RGBA-arvo, muotoa:
	Punainen 0-255, Vihreä 0-255, Sininen 0-255, Läpinäkyvyys 0.0-1.0
*/
#vslider #prev, #vslider #next {
	background:#555; /* Tämä on varmistus, jos selain ei tue rgba-muotoa */
	background:rgba(0,0,0,0.1);
	border-radius:50%;
	padding:22px 25px;
}
/* Napin hoveri */
#vslider #prev:hover, #vslider #next:hover {
	background:#222; /* Varmistus */
	background:rgba(0,0,0,0.2);
}

@media (min-width:801px) { #vslider .slide-wrap { width:86%; margin-left:7%; margin-right:7%; } }

/* 
	Vaaleataustainen laatikko sliden teksteille 
*/
#vslider .slide .teksti {
	background:rgba(0,0,0,0.35);
	padding:10px;
	margin:5px;
}
#vslider .slide .teksti p:last-child {margin-bottom:0px;}


/* 
	Slider piiloon mobiilissa (käytä, jos sliderissä ei ole tekstiä)
*/
/*@media (max-width:800px) {#vslider{display:none;}}*/


/*
	Alla oleva esimerkki sijoittaa ekan sliden kuvat hieman eri lailla.
	Vaihtamalla esim, .slide1 -> .slide2, säädät kakkossliden kuvia jne.
*/
/*#vslider .slide1 .kuva1 {left:0%; bottom:10%;}
#vslider .slide1 .kuva2 {left:10%;}
#vslider .slide1 .kuva3 {left:20%; bottom:10%;}
#vslider .slide1 .kuva4 {left:30%;}
#vslider .slide1 .kuva5 {left:40%; bottom:10%;}*/
/****************************************************************************************************/

/*** OMAT TYYLIT ************************************************************************************/


/* TOP */
#top { background:#fff; }

#header .arkki { max-width:100%; }

#header .palstat {
	background-color:#444;
	position:absolute;
	top:0; left:0; right:0;
}
#header .palstat .lista-rivi {
	width:100%;
	max-width:1140px;
	margin:0 auto;
}
#header .palstat .palsta, #header .palstat p { margin-bottom:0; }
#header .palstat p, #header .palstat a { color:#fff; }

#header a.call .icon-phone, 
#header a.email .icon-envelope { background-image: url("../../../images/glyphicons-halflings-white.png"); }

#header .logo {
	width:100%;
	max-width:1140px;
	margin:50px auto 0 auto;
	float:none;
}
#header .logo img { margin:-50px 0 -80px 0; position:relative; z-index:1; max-height:140px; }

@media (max-width:1140px) { #header .logo img { margin:-50px 0 0 0; } }
@media (max-width:1024px) { #header .logo img { margin:0; } }

/* NAV */
@media (min-width:601px) { #nav .valikko ul.menu { float:right; width:auto !important; } }
#nav .submenu li { width:100% !important; display:block !important; }
#nav li.item99 .submenu li.level2.last { border-top:2px Dotted #ddd; background:#eee; }

#subnav ul { float:right; background-color:rgba(0,0,0,0.4); }



/* SHOWCASE */
#scase {
	background-image:url(../images/scase-tausta.jpg);
	background-position:bottom center;
	background-size:cover;
	min-height:25vh;
}
body.etusivu #scase { background-image:url(../images/tausta.jpg); }

#scase h2, #scase .teksti1 h3 {
	font-size:52px;
	line-height:54px;
	color:#fff;
	font-weight:800;
	text-transform:uppercase;
	
	
}
#scase h2, #scase h3 {
	-webkit-text-shadow:0 0 8px rgba(0,0,0,0.4), 0 0 10px rgba(0,0,0,0.2);
	-moz-text-shadow:0 0 8px rgba(0,0,0,0.4), 0 0 10px rgba(0,0,0,0.2);
	-o-text-shadow:0 0 8px rgba(0,0,0,0.4), 0 0 10px rgba(0,0,0,0.2);
	-ms-text-shadow:0 0 8px rgba(0,0,0,0.4), 0 0 10px rgba(0,0,0,0.2);
	text-shadow:0 0 8px rgba(0,0,0,0.4), 0 0 10px rgba(0,0,0,0.2);
	
	
}
#scase .teksti1 h3 {
	font-size:32px;
	line-height:36px;
	font-weight:600;

}
#scase h3, #scase h3 a { font-size:26px; line-height:30px; color:#fff; }
#scase h3 a { border-bottom:3px Solid #fff; transition:all 400ms; padding:2px 0px; }
#scase h3 a:hover { border-bottom:3px Solid #C20E1A; text-decoration:none; }


/* EXTRATOP */
#extratop { background:#C20E1A; color:#fff; }
#extratop h2, 
#extratop h3, 
#extratop p, 
#extratop li,
#extratop a { color:#fff; text-align:center; }

#extratop .laatikko.perus.ikonibox, 
#extratop .laatikko.perus.ikonibox .kuva, 
#extratop .laatikko.perus.ikonibox .teksti { transition:all 600ms; }

#extratop .laatikko.perus.ikonibox {
	background:none;
	
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
	box-shadow:none;
}
#extratop .laatikko.perus.ikonibox .linkki .nappi {
	font-size:18px;
	text-align:center;
	padding:10px;
	/*border-top:3px Solid #fff;*/
	border-radius:6px;
}
#extratop .laatikko.perus.ikonibox .linkki .nappi .huomio-nuoli { display:none; }

#extratop .laatikko.perus.ikonibox .kuva { height:150px; }
#extratop .laatikko.perus.ikonibox .teksti ul { list-style-position:inside; }
#extratop .laatikko.perus.ikonibox .teksti ul li { margin:0; }

@media (min-width:801px) {
	body.etusivu #extratop .laatikot .gridi > .pad { padding:0; }
	body.etusivu #extratop .laatikko.perus.ikonibox { margin-bottom:0; }
	body.etusivu #extratop .laatikko.perus.ikonibox .kuva { position:absolute; top:10px; left:0px; right:0px; width:60%; margin:0 auto; }
	body.etusivu #extratop .laatikko.perus.ikonibox:hover .kuva { transform:scale(0.8); }
	body.etusivu #extratop .laatikko.perus.ikonibox .teksti { margin-top:160px; }
	body.etusivu #extratop .laatikko.perus.ikonibox:hover { background:rgba(0,0,0,0.1); }
	body.etusivu #extratop .laatikko.perus.ikonibox:hover .teksti { margin-top:150px; }
}


/* SISÄLTÖ */


/* BOTTOM */


/* BOTTOM 2 */
#bottom2 {
	background-color:#bbb;
	background-image:url(../images/bottom2.jpg);
	background-position:bottom center;
	background-size:cover;
}
#bottom2 .bottom-body { padding:10% 10px; }

@media (max-width:1024px) {
	#bottom2 { background:#ddd; }
	#bottom2 h2, #bottom2 h3, #bottom2 p { text-align:center; }
}

/* BOTTOM 3 */
#bottom3 {
	background-color:#C20E1A;
}
#bottom3 .bottom-body { padding:5% 10px; }
#bottom3 h2, #bottom3 h3, #bottom3 p { color:#fff; }
#bottom3 h2:last-child, #bottom3 h3:last-child, #bottom3 p:last-child { margin-bottom:0; }


/* FOOTER */
#footer { background:#222; }
#copy { background:#1b1b1b; }


/* Sekalaiset */

/* Huomio-nuoli fiksaus (laatikko pois ympäriltä) */
.huomio-nuoli, .huomio1 .huomio-nuoli { background:none !important; -webkit-box-shadow:none; -moz-box-shadow:none; box-shadow:none; }
.huomio-nuoli .huomio-reunus { border:0px; }



body.yhteystiedot #bottom .arkki, 
body.yhteystiedot #bottom .rivi { background:none; max-width:100%; margin:0; padding:0; }
body.yhteystiedot #bottom .bottom-body { padding:0; }

body.yhteystiedot .box ul { list-style:none; text-align:center; }
body.yhteystiedot .box ul li { margin:0; padding:0; display:inline-block; }



/* Kontaktikortti */
.kontaktikortti .tuote-kuva { margin-bottom:15px; height:auto !important; }
.kontaktikortti .tuote-kuva:hover { box-shadow:none; }
.kontaktikortti .googlemaps.laatikko.perus {
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
	box-shadow:none;
	
	padding:0;
	background-color: #eee;
	border-bottom: 6px Solid #ccc;
}
.kontaktikortti .googlemaps.laatikko.perus .reittiHaku { padding:5px 10px; }
.kontaktikortti .googlemaps.laatikko.perus p { margin-bottom:0; }
.kontaktikortti .googlemaps.laatikko.perus .navigoi { text-align:center; padding:5px; }

.kontaktikortti .backmapbut h3 { text-align:center; }
.kontaktikortti .backmapbut h3 a { background:#eee; display:block; padding:10px; transition:all 400ms; }
.kontaktikortti .backmapbut h3 a:hover { background:#ddd; }

.kontaktikortti .yhteystiedot.laatikko.perus { text-align:center; padding-top:30px; }

@media (min-width:601px) { /*.kontaktikortti .y-logo { float:right; padding:5px; max-width:150px; }*/ }


.toimipisteet .laatikko.perus h2,
.toimipisteet .laatikko.perus h3,
.toimipisteet .laatikko.perus p { color:#111 !important; text-align:center; }

.toimipisteet {padding:3px;}
.toimipisteet.etu .laatikko {margin:0;}
.toimipisteet.etu .laatikko.perus h2 {
	font-size:15px;
	font-weight:700;
	line-height:19px;
}
.ylogo {height:40px;position:relative;text-align:center;}
.ylogo img {max-height:25px; display:inline-block;
position:absolute;top:50%;
-moz-transform: translate(-50%,-50%);
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
}
#extratop .arkki, #extratop .rivi {max-width:100%;}
.toimipisteet .gridi .pad {padding:3px;}


.pvuokraus {margin-top:60px;}
.pvuokraus li, .pvuokraus h2 {
	text-align:left !important;
}
.pvuokraus .grid_6:first-child {
	text-align:center;
}
.pvuokraus h2 {
	text-transform:uppercase;
	font-size:40px;
	text-align:center !important;
	font-weight:700;
}
.pvuokraus ul {margin-top:40px;}


.pvuokraus a {
	font-weight:700;
	/*text-transform:uppercase;*/
	/*font-size:22px;*/
}

.pvuokraus h2 a {
	font-weight:700;
	text-transform:uppercase;
	font-size:22px;
}


.bigi {
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
}
.bigi:hover {
	background:rgba(0,0,0,0.1);
}

.filtterit ul {overflow:auto;text-align:center;}
.filtterit ul li {
	list-style-type:none;
	display:inline-block;
	padding:5px 10px;
	background:#fff;
	margin:2px;
	cursor:pointer;
}
.filtterit ul li:hover {background:#ddd;}

.filtterit ul li.check {background:#C20E1A; color:#fff;}
.filtterit ul li.check:hover {background:#C20E1A; color:#fff;}
.xsmall {font-size:10px;font-weight:400;}

.hintoja {display:inline-block; padding:4px 8px; background:#eee; text-align:center;}

#content-bottom {background:#eee;padding:20px 0;}
#sisalto .arkki {max-width:100%;}
#sisalto .sisalto-body {padding:0;}
#main-content {max-width:1140px; margin:0 auto;padding:20px 0;}

.sivu1 #bottom2 a {
	font-weight:700;
	text-transform:uppercase;
	font-size:22pX;
}

.tarvike .hinta { display:none !important; }


/*.sivu83 .tuotekortti .hinta {display:none;}*/
/*.sivu83 .tuotelista p.hinta {display:none;}*/
/*.sivu83 .tuotelista h3 {display:none;}*/

/*.sivu88 .kontaktikortti a.nappi {display:none!important;}*/
