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

  AaltoCMS
  
  type			stylesheet
  name			styles
  copyright		Aalto & Hautanen
  
------------------------------------*/

/* Basics
------------------------------------*/


html
{
	height: 100%;
	padding-bottom: 1px;

}

body
{

	background:#f4f5f9 url(../gfx/bg.jpg) 50% 0 repeat-x;

	margin: 0;
	padding: 0;
	
	z-index: 0;

}

body, p, label, #inner
{

	font-family: Arial, Helvetica, Verdana;
	font-size: 12px;

	line-height: 18px;

	color: #000000;
}

h1
{

	font-family: Arial,  Helvetica, Trebuchet MS, Tahoma, sans-serif;

	font-size: 28px;
	font-weight: normal;
	
	padding: 0;
	margin: 0;
	
	line-height: 28px;

	color: #0067b1;

}

p
{
	padding: 10px 0;
	margin: 0;
}

img
{

	border: 0;
	margin: 0;
}

a
{

	text-decoration: underline;
	color: #fa6c4b;
}

a:hover
{
	color: #361f1a;
}


/* Structure
------------------------------------*/

#main
{
	z-index: 1;

	width: 100%;
	float: left;
}

#page
{

	margin: 0 auto;
	
	position: relative;
	
	width: 900px;
	z-index: 1;
}

#left
{
	float: left;

	position: relative;

	width: 298px;	
	
	z-index: 2;

}

#right
{

	float: right;
	
	position: relative;
	
	width: 600px;
	
	padding-top: 60px;
	
	z-index: 3;
	
}


/* logo
------------------------------------*/


div.logo
{

	position: absolute;
	top: 42px;
	left: 72px;
	
	z-index: 4;

	display: block;
	height: 100px;
	width: 170px;

}


div.logo span img
{
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
}

div.logo span
{
	position: absolute;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='templates/y4/gfx/y4.png');
}


div.logo h1
{
	display: none;
}

/* mainmenu
------------------------------------*/

div.mainmenu
{

	float: left;

	width: 200px;

	margin: 190px 0 0 60px !important;
	margin: 190px 0 0 30px;
	
	z-index: 10;

}

div.mainmenu ul
{

	float: left;
	
	margin: 0;
	padding: 0;
	
	width: 200px;
	
	list-style: none;
}


div.mainmenu li
{

	margin: 0;
	padding: 0 0 0 3px;
	
	line-height: 18px;

	clear: both;
}

div.mainmenu a
{

	display: block;
	
	height: 26px;
	width: 172px;

	margin: 0;
	padding: 0 0 0 28px;

	color: #000;
	
	font-size: 12px;
	text-decoration: none;
	
	background: url(../gfx/menu/passive.gif) 0 0 no-repeat;
	
}

div.mainmenu  a.mainmenu_active
{

	background: url(../gfx/menu/active.gif) 0 0 no-repeat;
	
}

div.mainmenu ul.treemenu
{

	float: left;

	width: 180px;

	margin: 0;
	padding: 0 0 0 20px;

	list-style: none;
}


div.mainmenu ul.treemenu li
{

	margin: 0;
	
	width: 176px;
	
	padding: 0 0 0 3px;
	border: 0;
}

div.mainmenu ul.treemenu span a
{

	display: block;

	height: 26px;
	width: 148px;

	margin: 0;
	padding: 0 0 0 14px;

	color: #000;
	
	font-size: 11px;
	text-decoration: none;
	
	background: url(../gfx/menu/submenu.gif) 0 7px no-repeat;
	
}

div.mainmenu ul.treemenu span.treemenu_level1_active a
{

	text-decoration: underline;
	
}


div.languages
{

	float: left;

	width: 200px;

	margin: 24px 0 0 60px !important;
	margin: 24px 0 0 30px;
	
	z-index: 10;
	
	clear: both;

}

div.languages a
{

	display: block;
	
	height: 26px;
	width: 131px;
	
	line-height: 18px;

	margin: 0;
	padding: 0 0 0 31px;

	color: #000;
	
	font-size: 12px;
	text-decoration: none;
	
	background: url(../gfx/menu/passive.gif) 3px 0 no-repeat;
	
}


/* content-area
------------------------------------*/

#content
{

	float: left;
	
	width: 450px;
	
	padding: 0 50px 0 50px;
	
	border-left: 1px solid #b2d0e1;

}

#content h1
{

	display: block;
	
	height: 120px;
	width: 100%; 
	
	overflow: hidden;
	
	line-height: 34px;

}

#content a
{

	color: #0067b1;

}

#content a:hover
{

	text-decoration: none;

}

#sidepanel
{
	
	display: none;
	
	
	float: right;
	
	width: 180px;

}

.inner ul
{
	
	padding: 0 0 0 16px;
	margin: 0;
	
}

.inner li
{
	
	line-height: 18px;
	margin: 0;
	padding: 2px 0;

}

.inner img
{
	
	 margin:  0 0 10px 30px;

}

.inner .main-image
{
	margin: 0;
}


.inner table
{
	
	padding: 0 0 16px 0;
	margin: 0;
	border: 0;

}

.inner table img
{
	
	margin: 4px;

}

.inner tr
{
	
	padding: 0;
	margin: 0;
	border: 0;

}

.inner td
{
	
	width: 220px;
	padding: 0 0 16px 15px;
	margin: 0;
	border: 0;
	
	vertical-align: top;

}

.inner td p, ul
{

	margin: 0;
	padding: 2px 0;

}




.flash
{
	
	width: 450px;
}

/* news 
------------------------------------*/

.news 
{
       width: 450px;
  
       margin: 20px 0px 20px 0px;
	   
	   float: left;
	   
	   clear: both;
}

.news .title, .news .link
{
       padding: 5px 0px 4px 0px !important;

       padding: 0px 0px 0px 0px;
	  
	   float: left;
	   
	   width: 450px;
	   
	   clear: both;
}

.news .title a
{

       float: right;
  
       width: 373px;
	   
	   margin: 0;
	   
	   padding: 0;

}

.news .title .date, .news .link .date
{


       float: left;
  
       width: 75px;

       color: #fa6c4b;

       font-weight: bold;
	   
	   padding: 0;
	   
	   margin: 0;
	   
	   clear: both;
}

.news .title a
{
       text-decoration: none;

       color: #000 !important;
}

.news .title a:hover
{ 
       text-decoration: underline !important;
}

.news .dotted
{
      height: 1px;

      padding: 0px;

      margin: 0px;

      border: 0px;
	  
	  display: block;
	  
      color: #c8d8e0;

      background: #c8d8e0;
	  
	  clear: both;
	  

}

.news .entry .date
{
       color: #333333;
       margin-left: 10px;
}

.news .entry h2
{
       display: inline;
       font-size: 14px;
       font-family: arial;
}

.news .entry .entrytext
{
       margin: 1em 0 1em 0;
}

.news .entry .left
{
       float: left;
}

.news .entry .right
{
       float: right;
}

/* footer
------------------------------------*/

#divider
{
	width: 950px;
	height: 40px;
	
	display: block;
	float:left;
	clear: both;
}

#footer
{


	clear: both;
}

#footer div
{

	width: 950px;
	height: 65px;

	margin: 0 auto;	
	padding: 0 0 10px 0;
	background: url(../gfx/footer.jpg) 0 0 no-repeat;

}