/* ========================================================
		Master CSS
		Title of Project: Template
		Created by: Miska Närhi ( miska@rn.fi )		
======================================================== */

/* ========================================================
		Imports
======================================================== */

@import url("reset.css");
@import url("forms.css");
@import url("typography.css");

/* ========================================================
		Basic Misc. Styles
======================================================== */

.clearfix:after, .FormItem:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
.clearfix, .FormItem { display: inline-block; }
/* Hides from IE-mac \*/
.clearfix, .FormItem { display: block; }
/* End hide from IE-mac */

.clear { clear: both; }

.HiddenInput { display: none; }

.HalfCol {
	width: 173px; float: left; position: relative;
	background: url(../i/palstabg.gif) no-repeat left top;
	font-size: 11px; padding: 3px 8px;
}
.LeftCol { margin-right: 34px; }
.HalfCol img { position: relative; display: block; width: 183px; height: 50px; margin: 0 -5px 9px; padding: 0; }
.HalfCol h2 { font-size: 12px; font-weight: bold; color: #5d5c4c; margin: 0 0 9px; padding: 0; }

/* ========================================================
		Basic Layout Stuff
======================================================== */

html, body { height: 100%; }
body {
	font-size: 12px; line-height: 18px; text-align: center;
	font-family: Arial, Helvetica, "Bitstream Vera Sans", sans-serif;
	background: #00001a url(../i/body_bg.jpg) repeat-x left top;
}
#container {
	position: relative; width: 960px; min-height: 100%; height: auto;
	background: #FFF url(../i/container_bg.gif) repeat-y left top;
	margin: 0 auto; padding: 0 1px 18px; text-align: left;
}
#left {
	position: relative; float: left; width: 172px;
	min-height: 810px; padding: 0 34px;
	background: #fc0 url(../i/vasen_bg.gif) no-repeat left top;
}
#logo {
	position: relative; display: block;
	width: 114px; height: 114px;
	padding: 48px 29px 78px;
}
#main-nav, #main-nav ul, #main-nav ul li,
#LangOpts, #LangOpts li {
	margin: 0; padding: 0; list-style: none outside;
}
#main-nav { border-top: 1px solid #cca800; margin-top: -1px; }
#main-nav li a, #main-nav li.nav-open ul li a, #LangOpts li a {
	position: relative; display: block; padding: 5px 30px 5px 4px;
	border-bottom: 1px solid #cca800; line-height: 16px;
	color: #464655; text-decoration: none; font-weight: normal;
	background: url(../i/nav-arrow.gif) no-repeat 157px 11px;
}
#main-nav li a:hover, #LangOpts li a:hover { background-image: url(../i/nav-arrow-hover.gif); }

#LangOpts { margin: 40px 0 0; border-top: 1px solid #cca800; }
#LangOpts li a img { position: relative; display: inline; margin: 0 5px 0 0; padding: 0; top: 2px; }

#main-nav li li a { font-size: 11px; padding-left: 27px; }

#main-nav li ul { display: none; }
#main-nav-adm li ul { display:block; }

#etusivu li#nav-etusivu ul,
#tietoa li#nav-tietoa ul,
#palvelut li#nav-palvelut ul,
#tuotteet li#nav-tuotteet ul,
#tuotteet-front li#nav-tuotteet ul,
#ratkaisu li#nav-asiakasratkaisut ul,
#ratkaisut-front li#nav-asiakasratkaisut ul,
#yhteystiedot li#nav-yhteystiedot ul,
#led_modules li#nav-led_modules ul {
	display: block;
}

.valikkoauki a{
	background-image: url(../i/nav-arrow-open.gif);
	font-weight: bold; color: #000;
}
.valikkokiinni a{
	display:none;
}


#etusivu li#nav-etusivu a,
#tietoa li#nav-tietoa a,
#palvelut li#nav-palvelut a,
#tuotteet li#nav-tuotteet a,
#tuotteet-front li#nav-tuotteet a,
#ratkaisu li#nav-asiakasratkaisut a,
#ratkaisut-front li#nav-asiakasratkaisut a,
#yhteystiedot li#nav-yhteystiedot a,
#led_modules li#nav-led_modules a {
	background-image: url(../i/nav-arrow-open.gif);
	font-weight: bold; color: #000;
}
#etusivu li#nav-etusivu ul li a,
#tietoa li#nav-tietoa ul li a,
#palvelut li#nav-palvelut ul li a,
#tuotteet li#nav-tuotteet ul li a,
#tuotteet-front li#nav-tuotteet ul li a,
#ratkaisu li#nav-asiakasratkaisut ul li a,
#ratkaisut-front li#nav-asiakasratkaisut ul li a,
#yhteystiedot li#nav-yhteystiedot ul li a,
#led_modules li#nav-led_modules ul li a {
	background: url(../i/nav-arrow.gif) no-repeat 157px 11px;
	font-weight: normal; color: #464655;
}
#etusivu li#nav-etusivu ul li a:hover,
#tietoa li#nav-tietoa ul li a:hover,
#palvelut li#nav-palvelut ul li a:hover,
#tuotteet li#nav-tuotteet ul li a:hover,
#tuotteet-front li#nav-tuotteet ul li a:hover,
#ratkaisu li#nav-asiakasratkaisut ul li a:hover,
#ratkaisut-front li#nav-asiakasratkaisut ul li a:hover,
#yhteystiedot li#nav-yhteystiedot ul li a:hover,
#led_modules li#nav-led_modules ul li a:hover {
	background-image: url(../i/nav-arrow-hover.gif);
}



#main {
	position: relative; float: left; width: 720px;
	min-height: 810px;
}
#header {
	position: relative; width: 720px; height: 240px;
	background-position: left top; background-repeat: no-repeat;
	
}
#etusivu #header { background-image: url(../i/fiilis_etusivu_uusi.jpg); }
#etusivu.se #header { background-image: url(../se/i/etusivu_se.jpg); }
#tietoa #header { background-image: url(../i/fiilis_tietoa.jpg); }
#palvelut #header { background-image: url(../i/fiilis_etusivu5.jpg); }
#yhteystiedot #header,
#yhteystiedot-paikkakunta #header { background-image: url(../i/fiilis_etusivu.jpg); }
#yhteystiedot.se #header,
#yhteystiedot-paikkakunta.se #header { background-image: url(../se/i/kontakt.jpg); }
#ratkaisut-front #header, #se-palvelut #header { background-image: url(../i/fiilis_etusivu3.jpg); }
#tuotteet-front #header { background-image: url(../i/fiilis_etusivu4.jpg); }
#led_modules #header { background-image: url(../i/led-modules-top.jpg); }

#header #path {
	position: absolute; left: 0px; bottom: 0px; width: 412px; height: 40px;
	border-top: 1px solid #87857b; border-right: 1px solid #87857b; background: #FFF;
	display: inline; margin: 0; padding: 0 34px; list-style: none outside; line-height: 40px;
	opacity: 0.5; font-size: 11px; overflow: hidden; white-space: nowrap;
}
#header #path ul, #header #path ul li {
	display: inline; margin: 0; padding: 0;
	list-style: none outside; white-space: nowrap;
}
#header #path a { text-decoration: underline; color: #000; white-space: nowrap; }

#content {
	position: relative; float: left;
	width: 412px; padding: 18px 34px;
	overflow: hidden;
}
#right {
	position: relative; float: left; width: 172px; padding: 18px 34px; font-size: 11px;
	background: url(../i/oikea_bg.gif) no-repeat left top; min-height: 570px;
	color: #5d5c4c; overflow: hidden;
}
.ratkaisu-nosto {
	display: block; width: auto; text-decoration: none;
	border: 1px solid #e2e0dc; background: #f5f3ef;
	padding: 2px; margin: 0 0 12px; color: #5d5c4c;
	text-align: center; font-weight: bold;
}
.ratkaisu-nosto:hover { background: #ffdc00; border-color: #ffcc00; color: #00001a; }
.ratkaisu-nosto img { display: block; margin: 0; padding: 0; }

ul.nostolista, ul.nostolista li {
	position: relative; width: auto; height: auto;
	margin: 0; padding: 0; list-style: none outside;
}
ul.nostolista li { float: left; text-align: center; margin: 0 0 12px; }
ul.nostolista li.nosto-vasen { margin-right: 68px; clear: both; }
ul.nostolista li a {
	position: relative; float: left;
	border: 1px solid #e2e0dc; background: #f5f3ef;
	padding: 2px; margin: 0; color: #5d5c4c;
	font-weight: bold; text-decoration: none;
	text-align: center;
}
ul.nostolista li a:hover { background: #ffdc00; border-color: #ffcc00; color: #00001a; }
ul.nostolista li a span { display: inline; line-height: 18px; text-align: center; margin: 0 auto; }
ul.nostolista li a img { display: block; margin: 0; padding: 0; }

ul.sidebar-navi, ul.sidebar-navi li,
#sidebar-tuotteet, #sidebar-tuotteet li {
	position: relative;
	margin: 0; padding: 0;
	list-style: none outside;
}
ul.sidebar-navi, #sidebar-tuotteet {
	left: -10px; width: 180px; padding-bottom: 1px;
	background: url(../i/sidebar-nav-separator.gif) no-repeat 10px bottom;
	margin-bottom: 18px;
}
ul.sidebar-navi li, #sidebar-tuotteet li {
	width: 180px; padding-top: 1px;
	background: url(../i/sidebar-nav-separator.gif) no-repeat 10px top;
}
ul.sidebar-navi li a, #sidebar-tuotteet li a {
	position: relative; display: block;
	padding: 2px 0 2px 13px; text-decoration: none;
	background: url(../i/sidebar-nav.gif) no-repeat left 50%;
}
ul.sidebar-navi li a:hover, #sidebar-tuotteet li a:hover { background-image: url(../i/sidebar-nav_h.gif); }
#kartta-nosto { position: relative; display: block; width: 240px; margin: 0 -34px 9px; padding: 0; }

#yhteys-vasen {
	border: 1px solid #cca800;
	margin: 40px 0 0; padding: 0 5px 5px;
	background: #ffe433;
    display:none;
}
#OpenQuickContact { margin: 0; }
#sidebar-ContactMe { margin: 9px 0 0; }
#yhteys-vasen h2 { font-size: 12px; margin: 0; padding: 0; }
#yhteys-vasen h2 a {
	position: relative; display: block;
	padding: 5px 25px 5px 0; line-height: 16px;
	color: #464655; text-decoration: none; font-weight: normal;
	background: url(../i/nav-arrow-open.gif) no-repeat 152px 11px;
	margin-bottom: 0;
}
.yhteys-sisennys { font-size: 11px; }
#sidebar-yhtotto select { width: 158px; }
#sidebar-yhtotto label { display: none; }
#sidebar-ContactMe { display: none; }

#sidebar-ContactMe input, #sidebar-ContactMe textarea { width: 154px; }

/* #sidebar-ContactMe label, #sidebar-ContactMe .label { width: 42px; } */

/* ========================================================
		Yhteystiedot sivut
======================================================== */

#main-yhteydet {
	position: relative; width: 480px; margin: 0 -34px; padding: 0;
	border-top: 1px solid #e8e8e7; border-bottom: 1px solid #e8e8e7;
	background: #fcfcfb url(../i/main-yht-bg.gif) repeat-y left top;
}
#yhteys-left, #yhteys-right {
	position: relative; float: left;
	width: 240px;
}
#yhteys-left { margin-right: 1px; }
#yhteys-right { width: 239px; }

#live-search { padding: 18px 34px; background: #f5f5f2; font-size: 11px; border-bottom: 1px solid #e8e8e7; }
#live-search * { position: relative; z-index: 1; }
#live-search label { color: #8b8a80; }
#live-search input { margin-bottom: 5px; width: 170px; font-size: 12px; }
#live-search #live-search-results { position: relative; top: -5px; z-index: 2; }
#live-search #live-search-results ul {
	position: absolute; top: -1px; left: auto;
	background: #ffec00; border: 1px solid #a5acb2;
	list-style: none outside; margin: 0; padding: 0;
	z-index: 999; width: 172px; opacity: 0.85;
}
#live-search #live-search-results ul li#lsShowAll { text-align: right; }
#live-search #live-search-results ul li a {
	display: block; padding: 5px;
	line-height: 18px; font-size: 12px;
	border-bottom: 1px solid #e1d20e;
	border-top: 1px solid #fff9b2;
	text-decoration: none;
}
#live-search #live-search-results ul li a:hover { background: #fff251; }
#live-search #live-search-results ul li h2,
#live-search #live-search-results ul li#lsShowAll a {
	font-size: 10px; background: #050d13;
	padding: 2px 5px; color: #FFF;
	line-height: 14px; font-weight: bold;
	text-transform: uppercase;
	border: 0;
}

#area-select, #local-office { padding: 18px 34px; font-size: 11px; }

#palautelomake { padding: 18px 34px; }

#yhteydet-karttahassakka {
	position: relative; left: -17px; top: -9px;
	width: 196px; height: 370px; margin-bottom: 9px;
	background: url(../i/map2010-fin-base.png) no-repeat left top;
}
#yhteydet-karttahassakka a {
	position: absolute;
	background-repeat: no-repeat;
	background-position: -9999px top;
	z-index: 1; text-decoration: none;
}
#yhteydet-karttahassakka a:hover { background-position: left top; z-index: 2; }
#yhteydet-karttahassakka a span {
	display: block; position: absolute;
	left: -9999em; top: 25%;
	width: 110px; background: #FFF;
	border: 1px solid #000;
	opacity: 0.85; z-index: 3;
	padding: 0 3px;
	font-size: 10px;
}
/* #yhteydet-karttahassakka a:hover span { left: 25%; } */

a#map-area-ita-lappi {
	left: 2px; top: 3px; width: 191px; height: 288px;
	background-image: url(../i/map2010-hover-ita-lappi.png);
}
a#map-area-lansi {
	left: 28px; top: 213px; width: 92px; height: 146px;
	background-image: url(../i/map2010-hover-lansi.png);
}

a#map-area-etela {
	left: 70px; top: 280px; width: 105px; height: 82px;
	background-image: url(../i/map2010-hover-etela.png);
}



/* ========================================================
		Referenssit
======================================================== */

#ratkaisu #header, #tuotteet #header, #goteborg #header { height: 360px; background-image: none; overflow: hidden; }
#header { height: 360px; background-image: none; overflow: hidden; }
#header #path { z-index: 2; }
#ratkaisu #header #path, #tuotteet #header #path, #goteborg #header #path { z-index: 2; }

#header #jcarousel {
	position: absolute; left: 0px; top: 0px;
	width: 720px; height: 360px; margin: 0; padding: 0;
	overflow: hidden; list-style: none outside;
	z-index: 1;
}
#header .jcarousel-next, #header .jcarousel-prev {
	position: absolute; display: block; cursor: pointer;
	width: 34px; height: 34px; top: 159px; z-index: 3;
	opacity: 0.5;
}
#header .jcarousel-next { right: 34px; background: url(../i/j-next.gif) no-repeat left top; }
#header .jcarousel-prev { left: 34px; background: url(../i/j-prev.gif) no-repeat left top; }
#header .jcarousel-next:hover, #header .jcarousel-prev:hover { background-position: left -34px; }

#header #jcarousel li {
	position: relative; float: left; width: 720px; height: 360px;
	overflow: hidden; list-style: none outside; margin: 0; padding: 0;
}
#jcarousel-control * { margin: 0; padding: 0; list-style: none outside; }
#jcarousel-control a {
	position: relative; float: left; margin: 0 10px 10px 0;
	width: 79px; height: 79px; border: 1px solid #78787e;
	background-repeat: no-repeat; background-position: 50% 50%;
}
#jcarousel-control a:hover { width: 75px; height: 75px; border: 3px solid #fc0; }
#jcarousel-control a.even { margin-right: 0; }


a.ratkaisu-nosto, p.ilmoitus {
	position: relative; display: block;
	border: 1px solid #e2e0dc; background: #f5f3ef;
	padding: 2px; margin: 0 0 12px; color: #5d5c4c;
	font-weight: bold; text-decoration: none;
	text-align: left;
}
p.ilmoitus { text-align: center; padding: 12px; margin: 0 0 18px; background: #e1f5e1; border-color: #bcccbc; }

a.ratkaisu-nosto:hover { background: #ffdc00; border-color: #ffcc00; color: #00001a; }
a.ratkaisu-nosto img { position: relative; float: left; margin: 0; padding: 0; }

a.ratkaisu-nosto span { display: block; margin: 0; padding: 0; }
a.ratkaisu-nosto span.tarina { font-size: 10px; font-weight: bold; margin: 18px 0 0 90px; }
a.ratkaisu-nosto span.ratkaisunnimi { font-size: 24px; margin-left: 90px; }

#etusivu a.ratkaisu-nosto { text-align: center; }