 /*Jarno M. Koponen - Personal digital Nexus*/ 
 
 
html, body{ 
 margin:0; 
 padding:0; 
 text-align:left; 
 background-color:#1e1e1e;
} 


#pagewidth{ 
 width:100%; 
 background:#262626;
 text-align:left;
 margin:0; 
 margin-right:auto;
} 


/*- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  HEADER*/

#header{
 position:relative; 
 height:90px; 
 width:100%;
 margin:0 0 15px 0;
 padding:0;
}  

.jklogo{
float:left;
margin:38px 0 0 25px;
padding:0;
}

img a {
border: 0;
}



/*- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  MAIN NAVIGATION + SEARCH*/

#mainnav{
border-top:1px solid #c9c9c9;
width:909px;
display:block;
float:left;
margin:0 0 15px 62px;
padding:10px 0 0 0;
}

#mainnav strong{
font:normal 13px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;
color:#42889a;
}
	
#mainnav ul{
padding:0;
margin:0 0 0 21px;
list-style-type:none;
border:0;
}
	
#mainnav li{
float:left;
display:inline;
padding:0 9px 0 7px;
margin:0;
}
	
#mainnav li a{
font:normal 14px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;
text-decoration:none;
text-transform:none;
color:#b3bdbd;
padding:0;
margin:0;
}
		
#mainnav li a:hover{
text-decoration:none;
color:#66bbd0;
padding:0;
margin:0;
}
	
#mainnav li a:active{
color:#ffffff;
margin:0;
padding:0;
}
	
.active {
color:#ffffff;
}
	
.search{
float:left;
padding:0;
margin:49px 0 0 118px;
text-align: center;
}


.searchfield{
padding:0;
margin:0 1px 0 0;
float: left;
}

.searchbutton {
background: url(../../Omat/images/bg_searchbutton.gif) no-repeat;
border:0;
color:#717171;
height:21px;
width:21px;
padding:0;
margin:0;
text-indent:-9999px;
float: left;
}



/*- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  VASEN PALSTA*/ 

/*#leftcol{
width:10px; 
float:left;
position:relative; 
background-color:#ffff;
border:1px solid #999;
 }*/
 
 
/*- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  KESKIPALSTA*/


#twocols{
width:960px; 
float:left; 
position:relative;
padding:0;
margin:0;
 }

#maincol{
background-color:#4c4c4c;
float:left; 
display:inline; 
position:relative; 
width:600px; 
margin:0 15px 15px 70px;
padding:0;
}
 
.keskisisalto{
width:600px;
margin:0;
padding:0 0 10px 0;
border-bottom: 10px solid #262626;
}
 
.c_column_header{
height:29px;
width:600px; 
padding:0;
margin:0;
}

.icon_main{
float:right;
padding:4px 4px;
}

.signature{
float:right;
padding:10px 4px;
}

#pointers{
background-color:#262626;
height:202px;
display:block;
padding:5px 0 0 0;
margin:0;
}

.pointer_block{
background:url(../../Omat/Portfolio/images/bg_pointer.gif) no-repeat;
display:block;
height:191px;
width:191px; 
float:left;
display:inline;
padding:0 3px 0 0;
margin:0 0 0 5px;
}

.pointer_quote{
font:normal 16px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;
color:#bfd9d8;
padding:0;
margin:15px 10px 15px 0;
text-align:left; 
}
	
.quote{
font:italic 15px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;
color:#bfd9d8;
padding:0;
margin:15px 10px 15px 0;
text-align:left;
line-height:1.4em;
}
 
.article_pic{
margin:0 0 10px 10px;
padding:0;
float:right;
}

.posted{ 
color:#949494;
font:normal 12px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;	
}

.share{ 
color:#949494;
font:normal 12px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;
margin:11px 0 0 10px;
padding:0;
}
	
.readmore{ 
margin:3px 0 0 0;
padding:0;
}
	
hr{ 
color:#2f2f2f;
background-color:#2f2f2f;
width:90%;
text-align:center;
}
	
.portfolio_pic { 
text-align:center;
margin:0 0 5px 0;
padding:0; 
}

.journalpic { 
margin:5px 0 0 10px;
padding:0;
}
	
#maincol ul{
list-style-type:none;
font:normal 13px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;  
color:#ffefa1;
margin:0;
padding:10px 10px 10px 15px;
}
	
#maincol li{
margin:2px 0 12px 0;
padding:0;
}
	
#address ul{
margin:2px 0 2px 0;
padding:0;
}

#address li{
margin:0 0 3px 0;
padding:0;
	}
	
	#synapses_main ul{
margin:2px 0 2px 0;
padding:0;
}

#synapses_main li{
margin:0 0 15px 0;
padding:0;
	}
	

/*- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - COMMENTS*/	


#comment_form{
margin:10px;
padding:10px;
}
	
#comment_form label{
font:normal 12px "Lucida Sans Unicode", "Lucida Grande", "Lucida Console", Geneva, Arial, sans-serif; 
color:#b7b7b7;
text-transform: uppercase;
float:left;
width:60px;
margin:3px 10px 5px 5px;
text-align:left;
}
	
#comment_form strong{
font: bold 0.825em Verdana, Helvetica, sans-serif; 
color: #262626;
}
	
#comment_form dt {
margin: 5px 0 5px 0;
}
	
#comment_form dd {
font:normal 12px "Lucida Sans Unicode", "Lucida Grande", "Lucida Console", Geneva, Arial, sans-serif;
color: #ffefa1; 
margin:5px 60px 0 75px;
padding:0;
}

.comment_buttons {
margin: 5px 0 5px 70px;
}

.send_button {
background: url(../../Omat/images/bg_sendbutton.gif) no-repeat;
border:0;
color:#717171;
height:21px;
width:21px;
padding:0;
margin:0;
text-indent:-9999px;
float: left;
}

.comment_message{ 
background-color:#3c3c3c;
margin:5px 10px 15px 10px;
padding:0;
border-left:2px solid #d5e2e1;
}

#comment_form input { 
font:normal 12px "Lucida Sans Unicode", "Lucida Grande", "Lucida Console", Geneva, Arial, sans-serif;
color: #262626;
}

.comments_error{ 
background-color: #e2d9c5;
font:normal 14px "Lucida Sans Unicode", "Lucida Grande", "Lucida Console", Geneva, Arial, sans-serif;
color:#e96237;
}

div.comments_error{
padding:10px;
margin:0;
}


/*- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - CONTACT FORM*/	
	   
   
.zemContactForm fieldset{
border:none;
padding:0;
margin:0 0 10px 10px;
}

.zemContactForm legend{
font:normal 14px "Lucida Sans Unicode", "Lucida Grande", "Lucida Console", Geneva, Arial, sans-serif;
color:#eb805d;
padding:0;
margin:0;
display:none;
}
   
.zemContactForm label{
font:normal 12px "Lucida Sans Unicode", "Lucida Grande", "Lucida Console", Geneva, Arial, sans-serif; 
color:#b7b7b7;
text-transform: uppercase;
float:left;
width:60px;
margin:3px 10px 5px 5px;
text-align:left;
}
   
 .zemContactForm textarea{
font:normal 12px "Lucida Sans Unicode", "Lucida Grande", "Lucida Console", Geneva, Arial, sans-serif; 
float:left;
margin:0;
width:450px;
}
   
.zemContactForm input{
margin-bottom:10px;
}
   
.zemContactForm input #Name, #Name, #Email{
margin-bottom:10px;
width:300px;
}
   
.zemContactForm input #Email{
margin-bottom:10px;
width:300px;
}
   
.zemContactForm br{
clear:left;
}

.zemContactForm .zemSubmit{
margin:7px 0 0 70px;
}

#keskisisalto dl{
margin:10px 0 10px 10px;
padding:5px;
}
	
#keskisisalto dt{
margin:10px 0 0 5px;
line-height:1.3em;
font:normal 14px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif; 
color:#ffffff; 
}
	
#keskisisalto dd {
margin-left:55px;
font:normal 12px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;
color:#eeeeee;
}   
   



/*- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - OIKEA PALSTA*/
 

#rightcol{
width:275px; 
float:right; 
position:relative; 
margin:0 0 10px 0;
padding:0;
 }
 
.oikeanosto{
width:275px; 
float:right; 
position:relative; 
margin:5px 15px 10px 0 ;
padding:0;
}
 
#right_content{
display:block;
padding:0;
margin:0 0 10px 0;
background-color:#d5e2e1;
}

.basic_side_header{
width:275px; 
padding:0;
margin:0 0 10px 0;
background-color:#4c4c4c;
float:right;
}  

.simple_side_header{
width:275px; 
padding:0;
margin:0 0 10px 0;
float:right;
} 
 
.oikeasisalto{
width:275px; 
background:#d5e2e1;   
padding:0 0 10px 0;
margin:0 0 10px 0;
float:right;
}

.oikeanosto_text{
position:relative; 
margin:10px;
padding:0;
}
 
 
#rightcol dl{
font:normal 13px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;    
color:#d1d1d1;
margin:0;
padding:10px 10px 12px 10px;
}
	
#rightcol strong{
font:bold 14px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;
}
	
#rightcol dt{
margin:3px 0 8px 0;
	}
	
.profile_pic{
margin:0 0 10px 0;
padding:0;
}

.basic_side_header ul{
list-style-type:none;
font:normal 12px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif; 
color:#b7b7b7;
margin:0;
padding:10px 0 10px 5px;
}
	
.basic_side_header li{
margin:2px 0 5px 5px;
padding:0;
}


.simple_side_header ul{
list-style-type:none;
font:normal 12px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif; 
color:#b7b7b7;
margin:0;
padding:10px 0 10px 5px;
}
	
.simple_side_header li{
margin:2px 0 0 5px;
padding:0;
}


.synapses {
float:left;
padding:0;
margin:0 5px 5px 0;
}
	

/*- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  FOOTER*/

#footer{
width:100%; 
float:left;
font:normal 11px Arial, Geneva, sans-serif;
clear:both;
}
 
#footer_text{
float:left;
font:normal 11px Arial, Geneva, sans-serif;
text-transform:none;
padding:10px 0 10px 20px;
color:#4c4c4c;   
}
 
 
/*- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  TYPOGRAFIA*/ 

 
#maincol h1{
font:normal 16px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;
text-decoration: none;
text-transform:uppercase;
color:#fff; 
margin:0;
padding:8px 0 0 10px;
}
 
#maincol h1 a{
font:normal 16px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;
text-decoration: none;
text-transform:uppercase;
color:#fff; 
margin:0;
padding:8px 0 0 0;
 }
 
#maincol h1 a:hover{
color:#66bbd0; 
}
 
.oikeasisalto h1{
font:normal 16px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;
color:#27525e;
text-transform:uppercase;
padding:8px 0 0 10px;
margin:0;
 }
 
.oikeasisalto h1 a{
font:normal 16px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;
color:#27525e;
text-transform:uppercase;
padding:8px 0 0 0;
margin:0;
}
 
.oikeasisalto h1 a:hover{
color:#262626; 
text-decoration: none;
}
 
.basic_side_header h1{
font:normal 16px "Lucida Sans Unicode", "Lucida Grande", "Lucida Console", Geneva, Arial, sans-serif;
text-decoration:none;
text-transform:uppercase;
color:#ffffff; 
margin:0;
padding:8px 0 0 10px;
}
 
.basic_side_header h1 a{
font:normal 16px "Lucida Sans Unicode", "Lucida Grande", "Lucida Console", Geneva, Arial, sans-serif;
text-decoration:none;
text-transform:uppercase;
color:#ffffff; 
margin:0;
padding:8px 0 0 0;
}
 
.simple_side_header h1{
font:normal 16px "Lucida Sans Unicode", "Lucida Grande", "Lucida Console", Geneva, Arial, sans-serif;
text-decoration:none;
text-transform:uppercase;
color:#ffffff; 
margin:0;
padding:8px 0 0 10px;
}
 
.basic_side_header h1 a:hover{
color:#66bbd0; 
}
 
#maincol h2{
font:normal 15px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;
color:#bfd9d8;
padding:15px 15px 5px 10px;
margin:15px 0 0 0;
background-color:#3c3c3c;
border-bottom: 1px dotted #a6a6a6;
}
 
#maincol h2 a{
font:normal 15px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;
color:#a6e551;
}
 
#maincol h2 a:hover{
color:#bfd9d8;
text-decoration: none;
}
 
#rightcol h2{
font:bold 14px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;
color:#262626;
padding:10px 10px 0 10px;
margin:0;
}
 
.date {
font:normal 11px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif; 
color:#6b7a79;
margin:0;
padding:0;
} 
 
h3{
font:normal 14px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;
color:#eb805d;
padding:14px 10px 0 10px;
margin:0;
}

blockquote{
font:normal 16px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;
color:#ffefa1;
padding:20px 15px 10px 25px;
margin:0;
}
 
#rightcol h3{
font:bold 14px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;
text-transform: uppercase;
color:#f39f84;
padding:10px 10px 0 10px;
margin:0;
}
 
h4{
font:bold 13px Arial, Helvetica, Geneva, sans-serif;
color:#000;
padding:2px 0 1px 0;
margin:5px 0 3px 0;
}
 
#maincol p{
font:normal 13px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif; 
color:#f4f4f4;
padding:10px 15px 4px 10px;
margin:0;
line-height:1.4em;
} 
 
.keskisisalto a{
font:normal 13px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;
text-decoration:none;
color:#90b8c0;
}

.keskisisalto a:hover{
color:#ffffff; 
}
 
.oikeasisalto p{
font:normal 12px Arial, Tahoma, Helvetica, Geneva, sans-serif; 
color:#262626;
padding:0 10px 7px 10px;
margin:0;
} 

.basic_side_header p{
font:normal 13px Arial, Tahoma, Helvetica, Geneva, sans-serif;  
color:#b7b7b7;
padding:10px 10px 7px 10px;
margin:0;
} 
 
.basic_side_header a{
font:normal 12px "Lucida Sans Unicode", "Lucida Grande", "Lucida Console", Geneva, Arial, sans-serif;
text-decoration:none;
text-transform:none;
color:#90b8c0; 
margin:0;
padding:0;
 }
 
.simple_side_header a{
font:normal 12px "Lucida Sans Unicode", "Lucida Grande", "Lucida Console", Geneva, Arial, sans-serif;
text-decoration:none;
text-transform:none;
color:#90b8c0; 
margin:0;
padding:0;
} 
 
a{
font:bold 12px "Lucida Grande", "Lucida Sans", Lucida, Geneva, Arial, Helvetica, sans-serif;
text-decoration:none;
color:#4a9cb1;
}
 
a:hover{
color:#ffffff; 
}
	
a:active{
color:#000;
text-decoration: none;
}
	
/*a:visited{
color: #c48d00;
text-decoration: none;
}*/
 

/*- - - - - - - SIVUTUS*/


.pages{
margin:25px 10px 15px 0; 
padding:0; 
text-align: right;
}
	
ul.pagination{
display:inline;
font:bold 12px Arial, Helvetica, Geneva, sans-serif;
color:#4b8c9c;
margin:0; 
padding:0; 
}
	
ul.pagination li{
display:inline;
font:bold 12px Arial, Helvetica, Geneva, sans-serif;
text-decoration:none;
color:#262626;
margin:0 0 0 7px; 
padding:2px 3px; 
}
	
ul.pagination li.active{
padding:2px 3px; 
background:#fff; 
}

/*- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  FIXES*/ 
 
.clearfix:after{
content:"."; 
display:block; 
height:0; 
clear:both; 
visibility:hidden;
}


.clearfix{display: inline-table;}

/* Hides from IE-mac \*/

* html .clearfix{height: 1%;}

.clearfix{display: block;}

/* End hide from IE-mac */  

 /*printer styles*/ 

@media print{ 

/*hide the left column when printing*/ 

#leftcol{display:none;} 

/*hide the right column when printing*/ 

#rightcol{display:none;} 

#twocols, #maincol{width:100%; float:none;}

}


