/***********************************
************************************
***
** 1. Defaults.
** 2. Helpers
** 2. Common
** 3. Navigation
** 4. Modules
** 5. Structure
** 6. Installation specific
*

Guidelines:
- Please maintain the files general structure as is.
- Maintain style selectors' (tree like) indentations.
- Insert special pages style overrides next to the original style.
- Exception to previous: Structure overrides of some template pages with major
  modifications are to be placed as a separate block at the end of the file.
- Header styles are in components.css, but place color their definitions here.
- Default font should be placed in components.css AND in the first selector
  of this file.
- ID-selectors must always include the element name (i.e. div#search_box)
- Class-selectors, same thing. If you want to allow all element types
  use the star-selector i.e. *.class
 
/****************************************************************************
                     Defaults
*****************************/

/* Default font (normal_text). Same as in components.css */
body, table, td, li, *.normal_text {
	font-size: 11px;
	line-height: 12px;
	font-family: Verdana, sans-serif;
}

html, body, table, form td, th { padding: 0; margin: 0; border: 0 none; }

body {
	background: white;
	color: #333333;
	padding: 0; margin: 0;
	
	/* Centers main container for IE. Requires text-align: left;
	 * in the container, because center seems to be inherited.
	 */
	text-align: center;  
}
table {
	border-collapse: collapse; /* setting cellspacing is therefore redundant */ 
	empty-cells: show;
	margin: 0;
}
td { vertical-align: top; padding: 0; }
th { text-align: left; font-weight: bold; }

p {/* margin: 0; padding: 0; */}

ul, ol {
	padding: 0;
	margin: 0;
	margin-left: 15px;
	list-style-position: outside;
	text-indent: 0;
}
ul { list-style-type: disc;
	 padding-top: 7px; }
ol { list-style-type: decimal; }

form { padding: 0; margin: 0; }


/****************************************************************************
                       Helpers
*****************************/

h1.left	 { display: block; margin-bottom: 5px; font-weight: bold; }
h1.right { display: block; margin-bottom: 5px; font-weight: bold; }

*.tiny_text					{ font-size: 10px; }
*.small_text				{ font-size: 11px; }
*.large_text				{ font-size: 16px; }
*.huge_text					{ font-size: 18px; }

input.short_width	 { width: 100px; }
input.normal_width { width: 150px; }
input.long_width	 { width: 200px; }

input.button			 {	}
input.text				 {	}

*.nopad							{ margin: 0 !important; padding: 0 !important; }
*.bmargin						{ margin-bottom: 15px; }
*.padblock					{ display: block; padding: 10px 0; }

*.error							{ font-weight: bold; color: red; }
*.ok								{ font-weight: bold; color: green; }

td.align_middle			{ vertical-align: middle; }
td.align_top				{ vertical-align: top; }
td.align_bottom			{ vertical-align: bottom; }
*.align_left				{ text-align: left; }
*.align_center			{ text-align: center; }
*.align_right				{ text-align: right; }

*.verdana						{ font-family: 'Verdana', 'san-serif'; }
*.arial							{ font-family: 'Arial', 'san-serif'; }

/** add you own here **/
 hr {
	color: #e4e4e4;
	background-color: #e4e4e4;
	height: 2px;
	border: 0px;
	margin-top: 3px;
	margin-bottom: 10px;
	clear: both;
 }
/****************************************************************************
                       Common
*****************************/

/****
links
*****/

	/** Normal links within text etc. **/
	a, a:visited {
		color: #ab9500;
		text-decoration: none;
	}
	a:hover	{
		text-decoration: underline;
	}
	
	/* internal_link and file_link */
	table.link { padding-bottom: 10px; }
		table.link a {  }
	
	table.internal_link   {  }
		table.internal_link td.bullet { vertical-align: top; padding-right: 3px; width: auto; }
		table.internal_link td.link   { vertical-align: top; }
			table.internal_link a {  }
	
	table.file { margin-left: 21px; clear: both; margin-top: 2px; }
	#con_right table.file { margin-left: 0px; }
		table.file td.bullet { padding-right: 3px; width: auto; vertical-align: top; }
		table.file td.link   {  }
			table.file a {  }
			table.file .filesize { font-size: smaller !important; color: #999999; }

/*****
header
******/


/*****
footer
******/

	div#footer {}
		div#footer table { width: 100%; }
			div#footer table td { 
				height: 30px; 
				vertical-align: middle; 
				text-align: left;
				color: #999;
				font-size: 10px;
				height: 40px;
			}
				div#footer a,
				div#footer a:visited {}
				div#footer a:hover {}
				div#footer td.powered_by { text-align: right; padding-top: 5px;}
				div#footer .powered_by, 
				div#footer .powered_by a, 
				div#footer .powered_by a:visited {}
				div#footer .powered_by a:hover {}

/****************************************************************************
                   Navigation
*****************************/

/***
path
****/

	div#path, div#path a,	div#path a:visited  { 
		color: #999999;

		font-size: 10px;
		line-height: 14px;
		letter-spacing: 1px;

		text-decoration: none;
		margin-bottom: 7px;
	}
	div#path span {
		margin: 0 3px;
	}
		div#path a:hover, div#path .last { text-decoration: underline !important; }

/*************
top navigation
**************/

	div#top_nav { }
		div#top_nav table {}
			div#top_nav td { 
				padding-right: 40px;
			}
			div#top_nav td.first { }
				div#top_nav a,
				div#top_nav a:visited {
					display: block;
					height: 30px;
					color: transparent;
					text-indent: -9999px;
				}
				div#top_nav a:hover   { 
				}
				
				div#top_nav a.active,
				div#top_nav a.active:visited,
				div#top_nav a.active:hover {
				}
				
				div#top_nav td.page_yritys a {
					background: url('/images/customer/yritys.gif');
					width: 56px;
				}
				div#top_nav td.page_yritys a:hover,
				div#top_nav td.page_yritys a.active {
					background: url('/images/customer/yritys-selected.gif');
				}
				
				div#top_nav td.page_palvelut a {
					background: url('/images/customer/palvelut.gif');
					width: 74px;
				}
				div#top_nav td.page_palvelut a:hover,
				div#top_nav td.page_palvelut a.active {
					background: url('/images/customer/palvelut-selected.gif');
				}
				
				div#top_nav td.page_yhteystiedot a {
					background: url('/images/customer/yhteystiedot.gif');
					width: 99px;
				}
				div#top_nav td.page_yhteystiedot a:hover,
				div#top_nav td.page_yhteystiedot a.active {
					background: url('/images/customer/yhteystiedot-selected.gif');
				}
				
				div#top_nav td.page_extranet a {
					background: url('/images/customer/extranet.gif');
					width: 73px;
				}
				div#top_nav td.page_extranet a:hover,
				div#top_nav td.page_extranet a.active {
					background: url('/images/customer/extranet-selected.gif');
				}
				
				

/**************
side navigation
***************/

	div#side_nav { 
		padding-right: 15px;
		margin-top: 2px;
	}
		ul#side_menu {
			list-style-type: none;
			marker-offset: 0;
			padding: 0;
			margin: 0;
			text-indent: 0;
		}
		ul#side_menu li { 
			padding: 5px 0 5px 0;
			border-bottom: 2px solid #e4e4e4;
		}
		ul#side_menu li.first { 
			padding: 0 0 5px 0;
		}
		ul#side_menu li.last {
			border-bottom: 0px;
		}
			ul#side_menu li a {
				padding-left: 0px;
				display: block;
				
				text-decoration: none;
				font-weight: bold;
				font-size: 10px;
				line-height: 12px;
				color: #01538e;
			}
			ul#side_menu li a.inactive {  }
			ul#side_menu li a.inactive:hover { text-decoration: underline; }
			ul#side_menu li a.active { text-decoration: underline; }
			ul#side_menu li a.active_parent   {  }

/****************************************************************************
                      Modules
*****************************/

/**
FAQ
***/

	*.faq_question, *.faq_questioner,
	*.faq_answer, *.faq_answerer { display: block; margin-bottom: 15px; }
	
	*.faq_answer     { }
	*.faq_answerer   { }
	*.faq_question   { }
	*.faq_questioner { }
	
	*.faq_back { }

/******
sitemap
*******/

	div#sitemap { margin-bottom: 29px; }
		div#sitemap table { width: 100%; }
			div#sitemap table td      { padding-right: 20px; }
			div#sitemap table td.last { padding-right: 0px; }
				div#sitemap span.level_1 {
					font-family: Arial, Verdana, sans-serif;
					font-size: 17px;
					font-weight: bolder;

					line-height: 18px;
					display: block;
				}
					div#sitemap a.level_1  { color: #01538E; }
				div#sitemap ul       { margin-left: 0; padding-left: 15px; list-style-type: none}
					div#sitemap ul li  { }
						div#sitemap ul a { color:#01538E !important; }
				div#sitemap ul.level_2    { margin-left: 5px; }
					div#sitemap li.level_2  { }
						div#sitemap a.level_2, div#sitemap a.level_3 {
							text-decoration: none;
							font-weight: bold;
							font-size: 10px;
							line-height: 12px;
							color: #01538e;
						}
						div#sitemap .level_2 a:hover, div#sitemap .level_3 a:hover {
							text-decoration: underline;
						}

				div#sitemap ul.level_3    { }
					div#sitemap li.level_3  { }
						div#sitemap a.level_3 { }

/***********
product card - tuotekortti
************/

	div.product_link { padding-bottom: 15px; }
	*.product_category_link {  }

/************
person folder - henkilökortti
*************/

	div.embedded_person {
		color: #000;
		font-size: 10px;
		margin-bottom:12px;
		line-height: 22px;
		float: left;
	}

	#con_right div.embedded_person {
		width: 134px;
		margin-right: 31px;
	}

	#con_center div.embedded_person {
		width: 200px;
		height: 170px;
		margin-right: 50px;
	}

	div.embedded_person strong {
		font-weight: bolder;
	}

	div.embedded_person .light_text {
		color: #999999;
	}

	div.embedded_person * {	
		font-size: 10px;
		line-height: 17px;
	}

	div.embedded_person table.file  {
		margin-left: 0px;
	}

/*******
feedback - palaute
********/

	div#feedback { }
	table.feedback_form { 
		width: 424px;  
		vertical-align: top;
		text-align: left;
		line-height: 20px;
		padding-right: 5px;
	}
		table.feedback_form td {
			padding-bottom: 10px;
		}
		table.feedback_form td input {
			margin-top: 4px;
			width: 190px;
		}
	 table.feedback_form td textarea {
			margin-top: 4px;
			width: 420px;
		}
	 table.feedback_form td input.button {
			margin-top: 4px;
			margin-right:3px;
			width: 80px;
			float: right;
		}
	 table.feedback_form td input.check {
			margin-top: 4px;
			width: 18px;
		}
	td.feedback_error { 
		padding-bottom: 15px; 
	}
	
	td.feedback_error { 
		padding-bottom: 15px; 
	}

/*******
sendlink - kerro kaverille
********/

	table.sendlink_form {}

/************
Search - haku
*************/

	div#search_box        {  }
		div#search_box form {  }
		div#search_box form input.text { width: 100px; }
	
	div#search { }
		div#search form { }
		div#search_results { padding-top: 15px; }
			div#search_results div.no_results { font-size: 16px; line-height: 20px; }
			div#search_pages { width: 250px; padding-top: 15px; }
				div#search_pages span.previous { padding-right: 15px; }
				div#search_pages span.next { }
				div#search_results table.results td { padding-bottom: 3px; }
				div#search_results table.results td.number { width: 20px; }
				div#search_results table.results td.target { }
					div#search_results div.result_link { }
						a.search_result, 
						a.search_result:visited { color: black; }
						a.search_result:hover   { color: #666666; }
					div#search_results div.result_description { }
					div#search_results div.result_path { }
						a.search_result_path, 
						a.search_result_path:visited { color: #666666; }
						a.search_result_path:hover   { color: black; }

/*************
News - Uutiset
**************/
	
	div#news       { margin-top: 5px; }
		div#news_nav {
			float: right; 
		}
		a.news, 
		a.news:visited, 
		a.news:hover {  }
		
	/* Nostot */
	div#news_hoist { margin-top: 20px; }
		div#news_hoist div.list_item { margin: 5px 0 15px 0; }
			a.news_hoist, 
			a.news_hoist:visited, 
			a.news_hoist:hover {  }
		div#news_hoist h1 {
			color: #ab9500 !important;
		}
		
	a.news_heading:hover {
		text-decoration: none;
	}
		
	div#news_list  {  }
		div#news_list  div.list_item {  margin: 5px 0 15px 0;  }
		
	div#news h2,
	div#news_list h2,
	div#news_hoist h2 { }
	
	div#news .news_lead,
	div#news_list .news_lead,
	div#news_hoist .news_lead { display: block; }
	
	div#news .date,
	div#news_list .date,
	div#news_hoist .date { display: block; }

/****************************************************************************
                    Login
*****************************/
	
table.login_form th {
	text-align: right;
	padding-right: 5px;
}
table.login_2 th {
	text-align: left;
}

table.login_form th, table.login_form td {
	padding-bottom: 5px;
}

/****************************************************************************
                    Structure
*****************************/
	
div#header {
	height: 131px;
	background: url('/images/customer/top-bg-repeater.gif') repeat-x top;
}

/* ylämarginaalin taustan siivekkeet */

div#left_wing {		
		position: absolute;
		left: 0;
		margin-left: 0;

		background: url('/images/customer/wing-left.jpg') no-repeat;
		width: 185px;
		height: 90px;

		margin-top:42px;
		float: left;
}	

div#right_wing {		
		position: absolute;
		right: 0;

		background: url('/images/customer/wing-right.jpg') no-repeat;
		width: 185px;
		height: 90px;

		margin-top:42px;
		float: right;
}	

table.repeat_table {
	width: 100%;
	height: inherit;
}
	table.repeat_table td.left_repeat {
		background: url('z/images/customer/wing-left.jpg') no-repeat;
		background-position: left 42px;
	}
	table.repeat_table td.right_repeat {
		background: url('z/images/customer/wing-right.jpg') no-repeat;
		background-position: right 42px;
	}
		table.repeat_table td.left_repeat div.spacer, 
		table.repeat_table td.right_repeat div.spacer { 
			height: 1px;
			width: 120px;
		}
	table.repeat_table td.center_area {
		width: 759px; 
	}
		table.repeat_table td.center_area div.spacer { 
			height: 0;
			font-size: 0;
			line-height: 0;
			width: 759px;
		}
	
		div#top_nav_container {
			position: absolute;
			margin-top: 101px;
		}
		div#logo {
			position: absolute;
			margin-top: 15px;
		}
		
		div#quicklinks_container {
			position: absolute;
			width: 270px;
			margin-top: 20px;
			/*759-*/
			margin-left: 505px;
			text-align: right;
		}
			div#quicklinks a {
				color: #8ab8da;
				font-size: 10px; 
				line-height: 12px;
				font-family: arial, sans-serif;
				text-decoration: none;
				padding-right: 25px;
			}
			div#quicklinks a.last {
				padding-right: 0;
			}
			div#quicklinks a:hover, div#quicklinks a.active {
				text-decoration: underline !important;
			}
		
/*** MIDDLE ROW & CONTENT ***/

div#mid {}
div#mid table {
	border: 0px; padding: 0px;
}

div#mid table #margin_left_mid {
	width: 50%;
	background: url('/images/customer/content-gradient-repeater.jpg') top repeat-x;
	margin: 0px;
	padding: 0px;
}
div#mid table #margin_left_mid div {
	background: url('/images/customer/content-img-left.jpg') no-repeat right;
	float: right;
	width: 120px;
	height: 241px;
}

div#mid table #margin_right_mid {
	width: 50%;
	background: url('/images/customer/content-gradient-repeater.jpg') top repeat-x;

}

div#mid table #margin_right_mid div {
	background: url('/images/customer/content-img-right.jpg') no-repeat left;
	float: left;
	width: 120px;
	height: 241px;
}

div#mid table #mid_container_cell {
}

div#mid table #mid_container_cell #page {
	width: 759px;
	background: url('/images/customer/content-repeater.gif') repeat-y;
	height: 100%;
}

div#mid table #mid_container_cell #bottom_decour {
	background: url('/images/customer/content-bottom.gif') top center no-repeat;
	width: 759px;
	height: 7px;
	margin-bottom: 17px;
}

/*** PAGE CONTENT FIELDS ***/

/** Resets against components.css etc **/
#content h1, #content h2, #content p { padding: 0; margin: 0; border: 0 none; }

#mid_container_cell #page #content {
	width: 100%; /** Tää tarvitaan, että sisältökentät on aina täyden levyisiä
									mutta hajoaako ie6:lla nyt? **/
}

div#mid table #mid_container_cell #page #content #con_left {
	width: 150px;
}
	div#mid table #mid_container_cell #page #content #con_left .left_container {
		padding: 0 0 0 14px;
	}
	
div#mid table #mid_container_cell #page #content #con_center {
	padding: 0 14px 20px 14px;
}

div#mid table #mid_container_cell #page #content #con_right {
	width: 179px;
	font-size: 10px;
} 

#mid_container_cell #page #content {
	margin-top: 10px;
	text-align: left;
	color: #474747;

	font-family: Verdana, sans-serif;
	font-size: 11px;
	line-height: 14px;
}

#mid_container_cell #page #content #con_center .html_area_block {
	clear: both;

}

#mid_container_cell #page #content p, #midi_container_cell #page #content span, #mid_container_cell #page #content #con_center h2 {	 font-family: Verdana, sans-serif;
	font-size: 11px;
	line-height: 14px;
}

#mid_container_cell #page #content .html_area_block p, #mid_container_cell #page #content .html_area_block span.small_text {  
	margin-top: 6px;
	margin-bottom: 14px;
}

#mid_container_cell #page #content h1, 
#mid_container #page #content .html_area_block .normal_text h1,
#mid_container_cell #page #content h2, 
#mid_container #page #content .html_area_block .normal_text h2,
.embedded_person strong {
	font-family: Times New Roman, serif;
	font-size: 17px;
	font-weight: normal;

	line-height: 21px;
	color: #01528e;

	margin-top: 3px;
}

#mid_container_cell #page #con_center h1, 
#mid_container_cell #page #con_center h2 { 
	text-transform: uppercase;
}

div#mid table #mid_container_cell #page #content .html_area_block h2 {
	margin-top: 6px;
}

#mid_container_cell #page #content #con_right h1 {
	font-size: 11px;
}

div#mid table #mid_container_cell #page #content h2, 
#mid_container_cell #page #content #con_right h2 {
	font-size: 12px !important;
}
.embedded_person strong {
	font-size: 11px !important;
}
#mid_container_cell #page #content #con_right h1,
#mid_container_cell #page #content #con_right h2, .embedded_person strong {
	font-weight: bold;
	color: #000;
	text-transform: inherit;
	line-height: 13px;
}

#mid_container_cell #page #content #con_right .html_area_block p, #mid_container_cell #page #content #con_right .html_area_block span.small_text {
	margin-top: 0px;
	margin-bottom: 14px;

	font-family: Verdana, sans-serif;
	font-size: 10px;
}


#mid_container_cell #page #content #con_right .html_area_block {
	width: 165px;
}

#mid_container_cell #page #content #con_right .html_area_block span {
	font-size: 11px;
}


/*****/

div#footer {
	background: url('/images/customer/footer-repeater.gif') repeat-x top;
}


/************************/
/******* Frontpage ******/
/************************/
/* Usually quite different from default template and therefore separate 
   block of styles. if there are only minor modifications, please insert 
	 them into the normal structure (above) at the appropriate tree level. 
	 All this applies to other templates also. */

	 #frontpage div#container { }


/****************************************************************************
				 Installation specific
*****************************/

	/* kill me / delete me */
	div#example_form { }
		div#example_form h1    { padding-bottom: 7px; border-bottom: 2px dashed #333; }
		div#example_form p     { margin: 20px 0; }
		div#example_form form  { border: 1px solid pink; padding: 20px 10px; }
		div#example_form table { }
			div#example_form td, div#example_form th { padding: 7px 0; }
			div#example_form th  { font-weight: bold; padding-right: 10px !important; }
			div#example_form td  { }
			div#example_form tr.hilight td,
			div#example_form tr.hilight th { background-color: red; }
				div#example_form table td input.text { width: 100px; }