/* ------------------------------------------------------------

    Yritys:   JS Media
    Päivitetty:   9.10.2008

------------------------------------------------------------ */

/* -----------------------------------

YLEISET MUOTOILUT 

-------------------------------------- */

* {
padding:0;
margin:0;
}

div {
margin:0px;
padding:0px;
text-align: left;
}

p {
padding-bottom:15px;
}

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

a:hover {
text-decoration:underline;
}

.strong {
font-weight:bolder;
}
.left {
float:left;
}

.right {
float:right;
}

.image_border{
margin:1px;
border:1px solid #999;
}

.clear {
clear:both;
}

.center {
text-align:center;
}

.underline {
text-decoration:underline;
}

select {
font-size:95%;
}

.sale {
text-decoration:line-through;
color:#CC0000;
}

.news_datetime {
padding-left:10px;
color:#666;
font-size:0.9em;
}


.note {
color:#669933;
font-size:95%;
margin-top:-20px;
clear:both;
}



a.button {
background-image:url('../images/bg_takaisin.gif');
background-repeat:no-repeat;
background-position:bottom left;
width:154px;
height:23px;
display:block;
float:left;
padding-top:3px;
margin-right:10px;
text-align:center;
font-weight:bolder;
} 

a.button:hover {
} 

a.takaisin2 {
background-image:url('../images/bg_takaisin.gif');
background-repeat:no-repeat;
background-position:bottom left;
width:154px;
height:23px;
display:block;
float:left;
padding-top:3px;
margin-right:10px;
text-align:center;
} 

a.takaisin2:hover {
}


/* -----------------------------------

RAKENTEEN MUOTOILUT

-------------------------------------- */
html {
height:100%;
}

body {
margin: 0;
padding: 0;
background-color: #ececec;
color: #4f4f4f;
font: 12px arial, sans-serif;
text-align: center; /*ie hack for centered layout*/
height:100%;
/* background-image:url(../images/bg.gif);
background-repeat:repeat-x; */
}

#wrapper {
width:963px;
margin: auto;
text-align: left; /*for previous ie hack*/
padding:0 7px 0 7px;
background-color:#FFF;
}

/* -----------------------------------

SISÄÄNTULOSIVU

-------------------------------------- */
body.intro { background-color:#131313;}

#intro-wrapper { margin-left:auto; margin-right:auto; margin-top:10px; width:809px; }
#intro-wrapper #borders {background-color:#fff; width:809px; padding:6px; float:left; }

#intro-wrapper #intro-main { padding:0 17px 10px 18px; background-color:#212121; float:left;}
#intro-wrapper #intro-main h4 { color:#fff;}
#intro-wrapper #intro-main #intro-main-top { padding:0;}
#intro-wrapper #intro-main #intro-main-top .maintop-left { width:500px; padding-top:30px; color:#fff; padding-right:25px; float:left; line-height:1.5em;}
#intro-wrapper #intro-main #intro-main-top .maintop-right { width:224px; color:#fff; background-color:#111111; float:left; margin-top:10px; margin-right:5px; padding:5px 10px 0px 10px;}
#intro-wrapper #intro-main #intro-main-bottom { padding:15px 0 0 0; margin:0 7px 5px 7px; float:left;}
#intro-wrapper #intro-main #intro-main-bottom .mainbottom-left {  float:left; margin-right:20px; }
#intro-wrapper #intro-main #intro-main-bottom .mainbottom-right { float:left;}
/* -----------------------------------

TEKSTIEN MUOTOILUT

-------------------------------------- */


h1 {
color:#333;
margin-bottom:6px;
font-size: 1.6em;
font-weight:bolder;
padding-top:0px;
}


h2 {
color:#514e3a;
margin-bottom:15px;
padding:3px 0 2px 0;
font-size: 1.3em;
clear:both;
font-weight:bold;
}

h3 {
color:#4c4a3e;
margin-bottom:15px;
padding:5px 0 2px 0;
font-size: 1.2em;
}

h4 {
color:#4c4a3e;
margin-bottom:10px;
padding-bottom:4px;
padding-top:5px;
font-size: 1.1em;
}

h5 {
color:#696759;
margin-bottom:10px;
padding-bottom:4px;
padding-top:5px;
font-size: 1.1em;
}

h6 {
color:#4c4a3e;
margin-bottom:10px;
padding-bottom:4px;
padding-top:5px;
font-size: 1.0em;
}



/* -----------------------------------

YLÄOSA

-------------------------------------- */

#header  {
height:88px;
background-image:url(../images/bg_header2.gif);
background-repeat:repeat-x;	
}

#logo {
float:left;
}

	

/* -----------------------------------

PÄÄNAVIGAATIO

-------------------------------------- */

#mainnavi {
height:32px;
background-image:url(../images/bg_mainmenu2.gif);
background-repeat:repeat-x;
}

#framenavi {
height:35px;
float:left;
background-image:url(../images/bg_navi.gif);
background-repeat:repeat-x;
}

#navi {
height:31px;
float:left;
background-image:url(../images/bg_mainmenu.gif);
background-repeat:repeat-x;
}

#print {
height:31px;
float:right;
background-image:url(../images/bg_mainmenu.gif);
background-repeat:repeat-x;
}

#navi_empty {

float:left;
width:400px;
height:35px;
display:block;
}

#navi_right {
float:right;
}

/* -----------------------------------

SISÄLTÖOSA

-------------------------------------- */


#contentframe  {
float:left;
} 


/* -----------------------------------

VASEMMAN JA OIKEAN KOLUMNIN BOXIT

-------------------------------------- */
#contentframe .box_contact {
background-color:#474747;
height:208px;
}

	#contentframe .box_contact p {
	padding: 5px 15px 5px 30px;
	color:#fff;
	}
	
	#contentframe .box_contact a {
	color:#fef201;
	text-decoration:none;
	background-image:url(../images/link_arrow_darkbg.gif);
	background-repeat:no-repeat;
	padding:0 0 0 12px;
	}
	
	#contentframe .box_contact a:hover {
	text-decoration:underline;
	}
	


#contentframe .box_news {
background-color:#eee;
font-size:11px;
}

	#contentframe .box_news p {
	padding: 3px 15px 9px 15px;
	border-bottom:1px solid #dbdbdb;
	}
	
	#contentframe .box_news .newstime {
	color:#666;
	}
	
	#contentframe .box_news a {
	color:#2d2d2d;
	text-decoration:none;
	font-weight:bolder;
	}
	
	#contentframe .box_news a:hover {
	text-decoration:underline;
	}


/* -----------------------------------

VASEN KOLUMNI

-------------------------------------- */

#content_left {
float:left;
width:204px;
}


/* -----------------------------------

SISÄLTÖOSA

-------------------------------------- */

#maincontent {
float:left;
width:553px;
margin:1px;
line-height:1.7;
}

/* Etusivu */

.textarea {
padding:20px 20px 20px 20px;
clear:both;
font-size:9pt;
}

.thanks_msg{
padding:40px 20px 20px 20px;
float:left;
text-align:center;
font-size:105%;
}

.textarea_contact {
padding:20px 20px 20px 20px;
clear:both;
font-size:105%;
}

.textarea fieldset {
padding:10px;
margin:0 20px 10px 0;
border:#F4F4F4 px solid;
}

.textarea legend {
padding:0 5px 0 5px;
}

/* -----------------------------------
HAKU LISTAUS
-------------------------------------- */
.searchresult_row {
float:left;
display:block;
border-bottom:1px dashed #ccc;
}

	.searchresult_row .img {
	float:left;
	padding:3px 5px 3px 5px;
	width:50px;
	text-align:center;

	}
	.searchresult_row .name {
	float:left;
	padding:3px 5px 3px 5px;
	width:135px;
	}
	.searchresult_row .brand {
	float:left;
	padding:3px 5px 3px 5px;
	width:140px;
	}
	
	.searchresult_row .category {
	float:left;
	padding:3px 5px 3px 5px;
	width:145px;
	}
	
	a.listlink {
	display:block;
	float:left;
	}
	
	a.listlink:hover {
	background-color:#fdfdb0;
	display:block;
	text-decoration:none;
	cursor:pointer;
	}
	


/* -----------------------------------

OIKEA KOLUMNI

-------------------------------------- */

#content_right {
width:204px;
float:right;
}




/* -----------------------------------

ALAOSA

-------------------------------------- */

#footer {
	width:963px;
	height:40px;
	color:#777777;
	clear:both;
	border-top:#eeeeee 1px solid;
	margin-top:10px;	
}



#footer_left {
	float:left;
	padding-top:10px;
	padding-left:3px;
}

#footer_left p {
padding:0 0 6px 0;
}


#footer_right {
	float:right;
	padding-top:10px;
	padding-right:5px;
}

		#footer a {
			text-decoration:underline;
			color:#9b9b9b;
			font-weight:normal;
			}
			
		#footer a:hover {
			color:#000;
			}
			
			
#bottom_border{
	width:100%;
	height:25px;
	text-align:center;
	padding-top:4px;
	color:#666;
}	

	#bottom_border a {
		color:#666;
	}
	
	#bottom_border a:hover {
		color:#fef201;
		text-decoration:underline;
	}	
	
	

#contentframe .box_topproducts {
float:left;
display:block;
border-bottom:1px solid #dbdbdb;
width:204px;
background-color:#545454;
}

	
	#contentframe .topproduct {
	float:left;
	padding:0 0 0 0;
	border-bottom:1px solid #838383;
	background-image:url(../images/bg_newproducts.gif);
	background-repeat:repeat-x;
	background-position:right;
	display:block;
	width:204px;
	padding:5px 0 5px 0;
	}
		
		#contentframe .topproduct_img {
		clear:both;
		margin-right:4px;
		text-align:center;
		}
		
		#contentframe .topproduct_img img {
		padding:2px;
		border:1px solid #999;
		}
		
				
		
		#contentframe .topproduct_info {
		clear:both;
		color:#fff;
		padding:5px 5px 5px 20px;
		}
	
	#contentframe .box_topproducts a.moreinfo {
	text-decoration:none;
	float:right;
	background-image:url(../images/bt_bg_moreinfo2.gif);
	background-repeat:no-repeat;
	width:88px;
	height:17px;
	text-align:center;
	padding:1px 0 0 0;
	margin-top:20px;
	}
	
	#contentframe .box_topproducts a.moreinfo:hover {
	text-decoration:underline;
	}
		


/* ------------------------------------------------------------

	Alanavi

------------------------------------------------------------ */
#submenu { 
	margin: 0 0 0 0;
	font-size: 1.1em;
}

#submenu ul {
	float:left;
	width:100%;
	padding:0px 0px 20px 0px;
}


#submenu li {
	list-style:none;
}

#submenu li.taso1_act a {
	text-decoration:none;
	display:block;
	color:#fff;
	background-color:#353535;
	border-bottom:#636363 solid 1px;
	padding: 4px 10px 4px 30px;
}

#submenu li.taso1_act a:hover {
	text-decoration:underline;
}

#submenu li.taso1_noact a {
	text-decoration:none;
	display:block;
	color:#fff;
	background-color:#353535;
	border-bottom:#636363 solid 1px;
	padding: 4px 10px 4px 30px;
}

#submenu li.taso1_noact a:hover {
	text-decoration:underline;
}



#submenu li.taso2_act a {
	text-decoration:none;
	display:block;
	color:#000;
	border-bottom:#636363 solid 1px;
	padding: 2px 10px 2px 40px;
	background-color:#ff9503;
}

#submenu li.taso2_act a:hover {
}


#submenu li.taso2_noact a {
	text-decoration:none;
	display:block;
	color:#fff;
	border-bottom:#636363 solid 1px;
	padding: 2px 10px 2px 40px;
	background-color:#474747;
}

#submenu li.taso2_noact a:hover {
	text-decoration:underline;
}

#submenu li.logout a{
background-color:#CC0000;
	text-decoration:none;
	display:block;
	color:#fff;
	border-bottom:#990033 solid 1px;
	border-top:#990033 solid 1px;
	padding: 10px 10px 10px 40px;
	margin-top:70px;
}

#submenu li.logout a:hover{
background-color:#FF0000;
	text-decoration:none;
	display:block;
	color:#fff;
	border-bottom:#990033 solid 1px;
	border-top:#990033 solid 1px;
	padding: 10px 10px 10px 40px;
}
   
   
   
   
/* ------------------------------------------------------------

	TUOTEMENU

------------------------------------------------------------ */


/*  NAVIGAATIO */
.suckertreemenu ul{
margin: 0;
padding: 0;
list-style-type: none;
border-bottom:1px #fff solid;
}

/*Top level list items*/
.suckertreemenu ul li{
position: relative;
display: inline;
float: left;

}

/*Top level menu link items style*/
.suckertreemenu ul li a{
display:block;
width:118px; /*Width of top level menu link items*/
height:21px;
text-decoration: none;
background-image:url(../images/bg_productmenu.gif);
background-repeat:no-repeat;
color:#000;
font-size:1.3em;
padding:6px 10px 8px 10px;
}
	
/*1st sub level menu*/
.suckertreemenu ul li ul{
left: 0;
position: absolute;
top: 1em; /* no need to change, as true value set by script */
display: block;
visibility: hidden;
}

/*Sub level menu list items (undo style from Top level List Items)*/
.suckertreemenu ul li ul li{
display: list-item;
float: none;
}

/*All subsequent sub menu levels offset after 1st level sub menu */
.suckertreemenu ul li ul li ul{ 
left: 159px; /* no need to change, as true value set by script */
top: 0;
}

/* Sub level menu links style */
.suckertreemenu ul li ul li a{
display: block;
width: 140px; /*width of sub menu levels*/
color: white;
text-decoration: none;
background-image:none;
height:18px;
padding:0px 4px 0px 20px;
border-bottom:1px solid #333;
background: #353535 url(../images/product_menuarrow.gif) no-repeat center left;
font-size:10px;
}

.suckertreemenu ul li a:hover{
background-color:#666666;
}

/*Background image for top level menu list links */
.suckertreemenu .mainfoldericon{

}

/*Background image for subsequent level menu list links */
.suckertreemenu .subfoldericon{
background: #950808 url(../images/arrow.gif) no-repeat center right;
}

* html p#iepara{ /*For a paragraph (if any) that immediately follows suckertree menu, add 1em top spacing between the two in IE*/
padding-top: 1em;
}
	
/* Holly Hack for IE \*/
* html .suckertreemenu ul li { float: left; height: 1%; }
* html .suckertreemenu ul li a { height: 1%; }
/* End */