@charset "utf-8";
/* CSS Document */


/* TYPOGRAPHY */
body
{font-size:13px;
line-height:1.4em;
color:#4e4e4e;
margin-top:20px;
font-family:Verdana, Geneva, sans-serif;}

h1{color:#a0a09e;
font-size:25px;
   letter-spacing: 2px;
   margin-bottom: 0.6em;}
h2{color:#99b20e;
font-size:15px;
font-weight:normal;
   letter-spacing: 1px;
}

.sidebar h3
 {margin-top:0px;}
  
h3{color:#99b20e;
font-size:13px;
font-weight:normal;
   letter-spacing: 1px;
   margin:0.2em 0;}
   
.fabricProduct h3
{text-transform:uppercase; color:#a0a09e; font-weight:bold;}


h4{
	color:#a0a0a0;
	margin:0;
}

p{margin-top:0.5em;}

ul{}

li{}

img
{border:0px none;}

a{ text-decoration:none; color:#b63382;}

	
a:hover
{text-decoration:underline;}

a.linkki_nuolella
{color:#232321;
padding-left:15px;
margin:5px;
background:url("../images/linkki_nuoli.jpg") top left no-repeat;
font-size:11px;
}

.korostus
{color:#99b20e; font-weight:bold;}

.tuote_ingressi
{font-size:13px;}


hr{
}
	
table
{}

td
{vertical-align:top;}

html
{

}

body
{
}

#content img
{margin:3px 0;}

table input, table textarea
{margin: 5px 6px;}
#container
{
	width:1003px;
	margin-left:auto;
	margin-right:auto;
	overflow:auto;
	position:relative;
}


/*HEADER*/
header
{
	width:100%;
	overflow:auto;
	border-bottom:1px solid #e0e0e0;
	padding-bottom:7px;
	margin-bottom:7px;
}

#header_elements
{float:right; color:#969696;     position: absolute;
    right: 0;
    top: 0;
	   z-index: 300;}

#header_elements a.button
{color:#969696; display:block; padding:2px 15px; border:1px solid #e3e3e3;
-webkit-border-radius: 12px;
-moz-border-radius: 12px;
border-radius: 12px;
float:left;
margin:7px 0 7px 14px; }
#header_elements a.button:hover
{background-color:#f7f7f7;
text-decoration:none;
}

.float_item
{float:left; margin: 0px 5px;}

#mainNav
{margin:10px 0 0 0;}
#mainNav ul
{margin:0px; padding:0px;}
#mainNav li {
    display: block;
    float: left;
    margin: 0;
}

#mainNav li a {
    color: #949494;
	font-family:Verdana, Geneva, sans-serif;
    font-size: 14px;
    padding: 0 29px 0 9px;
    text-decoration: none;
}
#mainNav li a:hover {text-decoration:underline;}
#mainNav li a.current {font-weight:bold;} 

#logo
{margin-bottom:10px;}

#flags
{text-align:right; margin-bottom:5px; min-height: 19px;}
#flags p
{margin:0px;}
	
/*CONTENT*/

#content
{position:relative;}

.ie7 #content
{overflow:hidden;}


.jousistopage #content
{overflow-y:auto; background:url("../images/JOUSISTOalakuva.jpg") bottom right no-repeat;}

.sidebar
{width:215px;
margin:15px 30px 20px 10px;
float:left;
 min-height: 270px;
position: relative; }

.sidebar .right
{margin:0 10px 20px 30px;
}

.sidebar-content
{position: absolute; bottom: 0; left: 0; }


.productpage .sidebar-content
{ position:relative}

.productpage .sidebar-content img
{ margin-top:15px !important;}


.sidebar-content h3
{color:#9f9f9f;
font-weight:normal;
text-align:center;
margin-bottom:0.5em;}


.mainText
{width:490px;
text-align:center;
padding-bottom:20px;
float:left;
}

.perussivu .mainText
{min-height:370px;
}
.jousistopage .mainText
{text-align:left;
margin-right:10px;}

.largeImagePage .mainText
{ width: 350px; margin-right:20px;}
.bigImage
{float:left;}


.pageTitles
{width:100%; text-align:center;}

.bottom_line
{    float: left;
    min-height: 20px;
    width: 1000px;}
.bottom_line img
{margin:0px !important;}


.infoBall
{    background: url("../images/nosto_vihreapallo.png") no-repeat scroll left top transparent;
    color: #FFFFFF;
    height: 111px;
    line-height: 1.2em;
    padding: 9px 10px 0;
    text-align: center;
    width: 97px;
  left: 110px;
    position: absolute;
    top: 40px;
	z-index:50;}

.jalleenmyyjatpage #mainText
{width:520px;}
.jalleenmyyjatpage #content table
{    margin-left: 10px;
    width: 100%; margin-top:20px;}

.jalleenmyyjatpage #content td
{width:30%; text-align:left; padding-bottom:20px;}
.jalleenmyyjatpage td strong
{	color:#a0a0a0;
	}

.bottom-line
{width:100%; min-height:10px;}
.bottom_line p
{margin:0px; line-height: 1em;}

#mediapankki, .pressikuvat{
    float: left;
    width: 100%;
}


.pressikuvat .pressikuva {
    float: left;
    height: 170px;
    margin: 5px;
    padding: 10px;
    width: 137px;
    word-wrap: break-word;
}

/*Tuotteet*/

.navProduct
{width:140px; float:left; text-align:center; border:1px solid #c9c9c9; border-bottom:20px solid #c6c6c6;}
.ie7 .navProduct
{margin-bottom:20px;}
#fabricNav .navProduct
{width:331px; overflow:hidden; height:168px;}
#fabricNav .navProduct img
{margin:0px;}

.navProduct:hover
{border-color:#DADADA;}

.navProduct a
{color:#949494;
}

.navProduct p, .navProduct img
{margin:0px;}
.navProduct h3
{display:block;
width:100%;
background-color:#dadada;
color:#a6a6a6;
margin:0px;
padding:7px 0;
font-weight:normal;
	border-bottom:1px solid #c9c9c9;
	text-transform:none;}

.navProduct.current h3
{
	background-color:#ffffff;
	border-bottom:1px solid #c9c9c9;
	padding-bottom:7px;
}


.productHead
{width:590px;
text-align:center;
padding-bottom:15px;
float:left;
font-size:11px;
color:#292929;
}

.fabricProduct .productHead
{width:100%;
min-height: 263px;}
.productHead table
{
border-collapse: collapse;
}
.productHead td
{width:76px; height:85px; border:1px solid #d7d7d7; padding:0px; overflow:hidden;line-height: 1em;}
.productHead td img
{margin:0px !important;}
.productHead td a
{opacity:1;}
.productHead td a:hover
{opacity:0.9;}

.productImage
{min-height:195px;}
.productpage .sidebar p, .productpage .sidebar img
{margin:0px;}


.productInfo
{width:690px;
text-align:center;
padding-bottom:40px;
float:left;}

.productInfo td
{min-width:270px; text-align:left; padding-right:15px;}

.productInfo td:first-child 
{text-align:center;
width:270px;
}
.productInfo td:last-child 
{font-size:11px;}
.productInfo ul
{padding-left:15px; margin-top:5px;}

.fabricProduct .productInfo
{width:100%; text-align:right;}
.fabricProduct .productInfo td, .fabricProduct .productInfo td:first-child, .fabricProduct .productInfo td:last-child 
{width:470px; padding-left:20px; text-align:right; padding-right:0px;}



/*FOOTER*/
footer
{width:100%; min-width:1000px; background-color:#000; text-align:center; min-height:250px; color:#fff;}

#slogan
{margin:14px 10px 30px 10px;}

footer ul
{margin: 0 auto; width: 500px; padding:0;}

.sv footer ul {
    width: 582px;
}

footer li {
display: inline-block;
    margin: 0;
}

footer li a {
    color: #fff;
	font-family:Verdana, Geneva, sans-serif;
    font-size: 14px;
    padding: 0 15px 0 15px;
    text-decoration: none;
}

#footerText
{border-top: 1px solid #22231d; width:100%; margin-top:10px; padding-top:10px;}

/*SLIDESHOW*/
/* Just for the example. Fee free to delete these three lines */

.pikachoose {width: 1000px; margin: 0 auto;}

/* Style the thumbnails */
.pika-thumbs {
    height: 105px;
    margin: 0;
    padding: 8px 0 0 2px;
	background:url("../images/slider_tumbs_bg.jpg") top left repeat-x;
}
.pika-thumbs li{ width: 130px; height:85px;  padding: 0; overflow: hidden;
		float: left; list-style-type: none;padding: 0px; margin: 6px 6px;  cursor: pointer;}
.pika-thumbs li .clip {position:relative;height:100%;text-align: center; vertical-align: middle; overflow: hidden;}
.pika-thumbs li .clip img{float:right; width: auto !important;}
	
/* The stage is the wrapper. The image fills 100% the height of the stage */
.pika-stage, .pika-textnav {width: 1000px;}
.pika-stage {position: relative; background: #fafafa; text-align:center; height:408px;}
.pika-stage img{height:100%;}
.pika-stage .caption {position: absolute; background: #000; background: rgba(0,0,0,0.75);  border: 1px solid #141414; font-size: 11px; 
			color: #fafafa; padding: 10px; text-align: right; bottom: 50px; right: 10px;}
	.pika-stage .caption p {padding: 0; margin: 0; line-height: 14px;}

/* Ths play, pause, prev and next buttons */
.pika-imgnav a {position: absolute; text-indent: -5000px; display: block;z-index:3;}
	.pika-imgnav a.previous {background: url(prev.png) no-repeat left 45%; height: 100%; width: 50px; top: 10px; left: 10px;cursor:pointer; display:none;}
	.pika-imgnav a.next {background: url(next.png) no-repeat right 45%; height: 100%; width: 50px; top: 10px; right: 10px;cursor:pointer; display:none;}
	.pika-imgnav a.play {background: url(play.png) no-repeat 0% 50%; height: 100px; width: 44px;top:0;left:50%;display: none;cursor:pointer;}
	.pika-imgnav a.pause {background: url(pause.png) no-repeat 0% 50%; height: 100px; width: 44px;top:0;left:50%;display:none;cursor:pointer;}

/* The previous and next textual buttons */
.pika-textnav {overflow: hidden; margin: 10px 0 0 0;bottom:10px; position:absolute;}
.pika-textnav a {font-size: 12px; text-decoration: none; color: #333; padding: 4px;}
	.pika-textnav a.previous {float: left; width: auto; display:none;}
	.pika-textnav a.next {float: right; width: auto; display:none;}

/*for the tool tips*/
.pika-tooltip{font-size:12px;position:absolute;color:white;padding:3px; background-color: rgba(0,0,0,0.7);border:3px solid black;}
.pika-counter{position: absolute;bottom: 45px;left:15px;color:white;background:rgba(0,0,0,0.7);font-size:11px;padding:3px;-moz-border-radius: 5px;border-radius:5px;}

/* If using user thumbnails there's a pause well the new large image loads. This is the loader for that */		
.pika-loader{ background:url(loading.gif) 3px 3px no-repeat #000; background-color:rgba(0,0,0,0.9); color:white; width:60px; font-size:11px; padding:5px 3px; 
	text-align:right; position:absolute; top:15px; right:15px; }

/*LIGHTBOX*/
/* line 6, ../sass/lightbox.sass */
#lightboxOverlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  background-color: black;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85);
  opacity: 0.85;
  display: none;
}

/* line 15, ../sass/lightbox.sass */
#lightbox {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 10000;
  text-align: center;
  line-height: 0;
  font-family: "lucida grande", tahoma, verdana, arial, sans-serif;
  font-weight: normal;
}
/* line 24, ../sass/lightbox.sass */
#lightbox img {
  width: auto;
  height: auto;
}
/* line 27, ../sass/lightbox.sass */
#lightbox a img {
  border: none;
}

/* line 30, ../sass/lightbox.sass */
.lb-outerContainer {
  position: relative;
  background-color: white;
  *zoom: 1;
  width: 250px;
  height: 250px;
  margin: 0 auto;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
}
/* line 38, ../../../../.rvm/gems/ruby-1.9.2-p290/gems/compass-0.12.1/frameworks/compass/stylesheets/compass/utilities/general/_clearfix.scss */
.lb-outerContainer:after {
  content: "";
  display: table;
  clear: both;
}

/* line 39, ../sass/lightbox.sass */
.lb-container {
  padding: 10px;
}

/* line 42, ../sass/lightbox.sass */
.lb-loader {
  position: absolute;
  top: 40%;
  left: 0%;
  height: 25%;
  width: 100%;
  text-align: center;
  line-height: 0;
}

/* line 51, ../sass/lightbox.sass */
.lb-nav {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
}

/* line 59, ../sass/lightbox.sass */
.lb-container > .nav {
  left: 0;
}

/* line 62, ../sass/lightbox.sass */
.lb-nav a {
  outline: none;
}

/* line 65, ../sass/lightbox.sass */
.lb-prev, .lb-next {
  width: 49%;
  height: 100%;
  background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
  /* Trick IE into showing hover */
  display: block;
}

/* line 72, ../sass/lightbox.sass */
.lb-prev {
  left: 0;
  float: left;
}

/* line 76, ../sass/lightbox.sass */
.lb-next {
  right: 0;
  float: right;
}

/* line 81, ../sass/lightbox.sass */
.lb-prev:hover {
  background: url(../images/prev.png) left 48% no-repeat;
}

/* line 85, ../sass/lightbox.sass */
.lb-next:hover {
  background: url(../images/next.png) right 48% no-repeat;
}

/* line 88, ../sass/lightbox.sass */
.lb-dataContainer {
  margin: 0 auto;
  padding-top: 5px;
  *zoom: 1;
  width: 100%;
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
  -ms-border-bottom-left-radius: 4px;
  -o-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  -ms-border-bottom-right-radius: 4px;
  -o-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}
/* line 38, ../../../../.rvm/gems/ruby-1.9.2-p290/gems/compass-0.12.1/frameworks/compass/stylesheets/compass/utilities/general/_clearfix.scss */
.lb-dataContainer:after {
  content: "";
  display: table;
  clear: both;
}

/* line 95, ../sass/lightbox.sass */
.lb-data {
  padding: 0 10px;
  color: #bbbbbb;
}
/* line 98, ../sass/lightbox.sass */
.lb-data .lb-details {
  width: 85%;
  float: left;
  text-align: left;
  line-height: 1.1em;
}
/* line 103, ../sass/lightbox.sass */
.lb-data .lb-caption {
	display: none !important; /*Piilottaa kuvatekstin*/
  font-size: 13px;
  font-weight: bold;
  line-height: 1em;
}
/* line 107, ../sass/lightbox.sass */
.lb-data .lb-number {
  display: block;
  clear: left;
  padding-bottom: 1em;
  font-size: 11px;
}
/* line 112, ../sass/lightbox.sass */
.lb-data .lb-close {
  width: 35px;
  float: right;
  padding-bottom: 0.7em;
  outline: none;
}
/* line 117, ../sass/lightbox.sass */
.lb-data .lb-close:hover {
  cursor: pointer;
}





/*SIVUNEDITOINTINÄKYMÄ - komponentin linkit*/

.component_editorHeader
{
padding:5px;
font-weight:bold;
display: block;
}

.addComponentStyle a
{
	text-transform:uppercase;
	border:none !important;
	display:inline !important;
}

.component_editorHeader a
{
color: #0085A8 !important;
padding:1px;
width:auto;
font-weight:bold;
float:none !important;
display:inline !important;
background-color:transparent !important;
}



