

/* Tyylit */
body {
text-align: center; 
font-family: Arial, Helvetica, sans-serif;
color: #505050;
font-size: 12px;
width: 100%;
height: auto;
margin: 0;
background-image: url(../img/yla-bg-viiva.jpg) top repeat-x;
line-height: 1.4em;
}

#body-tausta		{
position: relative;
top: 0px;
left: 0px;
width: 100%;
height:auto;
min-height: 467px;
background-image: url(../img/yla-bg.jpg);
background-position: top center; 
background-repeat: no-repeat;
} 


#body-page		{
width: 920px;
height: auto;
text-align: left;
margin: 0 auto;
background-image: url(../img/ver-bg.gif);
background-position: left; 
background-repeat: repeat-y;
overflow: none;
} 


#top	{
width: 920px;
height:427px;
float:left;
background: url(../img/top.jpg) top no-repeat;
z-index: -1;
}

#top_tuotteet	{
width: 920px;
height:427px;
float:left;
background: url(../img/top_bg.jpg) top no-repeat;
z-index: -1;
}


#left-menu	{
position: relative;
left:20px;
top:201px;
width: 189px;
height: auto;
float:left;
padding: 0 0 20px 0;
z-index:1; 
}

#top-kuva	{
position: relative;
left:407px;
top:153px;
width: 324px;
float:left;
}

#top-kuva-cont	{
position: relative;
top:185px;
left: 40px;
width: 690px;
float:left;
}

td.menu-1-1	{
width: 165px;
border-bottom: 1px #e4e4e4 solid;
}

td.menu-1-0	{
width: 165px;
border-bottom: 1px #e4e4e4 solid;

}  

td.menu-2-1	{
width: 165px;
} 

td.menu-2-0	{
width: 165px;
} 

td.menu-1-1_li{
width: 20px;
background: url(../img/menu/menu-1.gif) left no-repeat;
border-bottom: 1px #e4e4e4 solid;

}

td.menu-1-0_li	{
width: 20px;
background: url(../img/menu/menu-0.gif) left no-repeat;
border-bottom: 1px #e4e4e4 solid;

}  

td.menu-2-1_li{
width: 20px;
background: transparent;

}

td.menu-2-0_li	{
width: 20px;
background: transparent;

}  

#language	{
position: relative;
width: 920px;
height: 40px;
float:left;
background-image: url(../img/ylapalkki.jpg);
background-position: left; 
background-repeat: no-repeat;
}

#breadcrumb {
position: absolute;
left:275px;
top:3px;
width: auto;
height:12px;
}

#breadcrumb p {
color: white;
line-height: 12px;
text-decoration: none;
margin-top: 10px;
}

#breadcrumb a {
color: white;
line-height: 12px;
text-decoration: none;
}

#breadcrumb img {
position: relative;
top: 2px;
}

#fi {
position: absolute;
left:845px;
top:15px;
width: 18px;
height:12px;
display: block;
}

#en {
position: absolute;
left:867px;
top:15px;
width: 18px;
height:12px;
display: block;
}

#de {
position: absolute;
left:864px;
top:15px;
width: 18px;
height:12px;
display: block;
}

a.lang {
width: 18px;
height:12px; 
display: block;
text-decoration: none;
}

#l-content	{
position: relative;
padding: 0 38px 0 0;
top: 32px;
left: 39px;
width: 168px;
height:auto;
float:left;

}

#main-content {
position: relative;
padding: 0 0px 22px 0;
top: 32px;
left: 245px;
width: 620px;
height: auto;
min-height: 350px;
float:left;
}

#main-content-frontpage	{
position: relative;
padding: 0 66px 22px 0;
top: 32px;
left: 245px;
width: 367px;
min-height: 350px;
float:left;
}

#r-content	{
position: relative;
top: 32px;
left: 250px;
width: 211px;
height:auto;
float:left;
}

#news {
padding-top: 14px;
width: 368px;
float:left;
}

#bottom{
width: 920px;
height: 100px;
float:left;
padding: 30px 0 30px 0;
}

p{
	padding: 0 0 10px 0;
	font-family: inherit;
}

a, a:link, a:visited, a:active{
	font-family: inherit;
	color:#4c7507;
	
}

/* Tällä pakotetaan editorin sisällön linkit oikean näköisiksi
   Eli yleensä sama tyyli kuin tuossa yllä a-elementille, mutta jokaisen perään !important */
.mceContentBody a,.mceContentBody a:link, .mceContentBody a:visited{
	font-family: arial !important;
	color: #4c7507 !important;
	text-decoration: none !important;
}
.mceContentBody{
	background:transparent !important;
	text-align: left !important;
	height:auto !important;
}



a.news, a.news:link, a.news:visited {
font-family: inherit;
color:#4c7507;
	
}

td {
	font-family: inherit;
	font-size: 12px;

}
.login {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;

}

input, select, textarea {
	font-family: inherit;
	font-size: 10px;
}
.text{
	width:100%;
}

h1 {
font-family: "Trebuchet MS", arial, sans-serif;
font-size: 21px;
font-style: normal;
font-weight: 500;
text-transform: uppercase;
letter-spacing: -0.5px;
line-height: 1.3em;
color: #3a3a3a;
padding: 0 0 10px 0;
}

h2 {
font-family: "Trebuchet MS", arial, sans-serif;
font-size: 16px;
font-style: normal;
font-weight: 800;
text-transform: uppercase;
letter-spacing: -0.5px;
line-height: 1.3em;
color: #3a3a3a;
padding: 0 0 10px 0;
}

h3 {
font-family: "Trebuchet MS", arial, sans-serif;
font-size: 15px;
font-style: normal;
font-weight: 500;
letter-spacing: 0;
line-height: 1.3em;
color: #3a3a3a;
padding: 0 0 10px 0;
}

h4 {
font-family: "Trebuchet MS", arial, sans-serif;
font-size: 14px;
font-style: normal;
font-weight: 500;
letter-spacing: 0px;
line-height: 1.3em;
color: #3a3a3a;
padding: 0 0 10px 0;
}

h5 {
	color: #458AD7;
}

h6 {
	color: #458AD7;
}


.error_message{
	color:#ab0000;
	margin:10px 0 20px 0;
}
.success_message{
	color:#368b1c;
	margin:10px 0 20px 0;
}

/* Dropdownmenu */
.menuarea{
	position:absolute;
	display:none;
	width:180px;
	border:1px solid #c3c3c3;
	background-color:white;
	padding-bottom:5px;
}

#menutable .menutop_a{
	color:#6D3A78;
	padding:0 4px;
}
#menutable .menutop{
	color:#3c3c3c;
	padding:0 4px;
}

#menutable .menusub_a{
	color:#6D3A78;
	padding:0 4px;
	font-weight:bold;
	display:block;
}
#menutable .menusub{
	color:#3c3c3c;
	padding:0 4px;
	display:block;
}

#tuotepalstat{
	margin-top: 10px;
}

#tuotepalstat td{
	font-size: 11px;
}
