/*
Theme Name: Kulmaus v3
Theme URI: http://www.kulmaus.com
Description: Pixel perfect simple theme
Version: 3.0
Author: Sami Kallio
Author URI: http://www.kulmaus.com
Tags: simple, handcrafted
*/

@import "style/css/reset.css";
@import "style/css/typography.css";
@import "style/css/layout.css";
body {
	background: url(style/images/bg.png) repeat #f0f0e7;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #484c43;
}
#top-div {
	background: url(style/images/top_div_bg.png) repeat-x;
	height: 41px;
	margin-bottom: 25px;
}
#top-div .twitter {
	width: 960px;
	margin: 0 auto;
	padding: 7px 0 0 35px;
	color: #bbc49f;
	font-size: 0.75em;
	background: url(style/images/twitter_icon_top.png) no-repeat;
	text-shadow: 1px 1px 1px rgba(0,0,0,.20);	
}
.twitter a {
	color: #bbc49f;
	text-decoration: none;
}
.twitter a:hover {
	color: #ccc;
}
#hire {
	display: block;
	position: absolute;
	background: url(style/images/hire.png) top left no-repeat;
	width: 228px;
	height: 231px;
}
#wrapper {
	background: url(style/images/white_fade.png) repeat-x;
	margin: 0;
}
.container {
	max-width: 60em;
	width: expression(document.body.clientWidth < 48? "47.5em" : document.body.clientWidth > 61? "60em" : "auto");
	margin: 0 auto;
	padding: 0.625em 0;
}
#sisalto {
	margin: 2.5em 0 2em 0;
}
#header {
	width: 100%;
	float: left;
}
#logo {
	float: left;
	width: 12.5em;
}
.clear {
	clear: both;
}
/***** NAVIGAATIO *****/
ul#navigation {
	list-style:none;
	float: right;
	}
ul#navigation li {
	display: inline;
	float: left;
	padding: 0.93em 0.93em 0 0.45em;
	}
ul#navigation li a {
	display: inline;
	color: #5e6058;
	text-decoration: none;
	font-size: 0.8em;
	text-transform: uppercase;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	padding: 0.5em;
	-moz-border-radius-topleft: 5px;
	-webkit-border-top-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	-webkit-border-bottom-right-radius: 5px;
	}
ul#navigation li a:hover {
	color: #484c43;
	background: #ebebe2;
}
ul#navigation li.current_page_item a, ul#navigation li.current_page_parent a {
	color: #f1f1e6;
	background: #484c43;
}
ul#navigation li.current_page_item a:hover, ul#navigation li.current_page_parent a:hover {
	color: #ffffff;
}
/***** SISÄLTÖ *****/
#slogan {
	margin: 2.18em auto;
	text-align: center;
}
h2 {
	font-size: 1em;
	font-weight: normal;
	line-height: 1.25em;
	margin: 0.31em 0 1.5em 0;
}
h3 {
	padding: 0 0 0.12em 0;
	border-bottom: 0.19em solid #5e605a;
	margin: 0 0 0.18em 0;
}
#sisalto h3 {
	font-size: 1.4em;
	padding: 0 0 0.12em 0;
	border-bottom: 0.19em solid #5e605a;
	margin: 1em 0 0.18em 0;
}
#sisalto p {
	line-height: 1.25em;
	font-size: 0.95em;
	margin: 1em 0;
}
#sisalto a {
	color: #64802e;
	text-decoration: none;
}
#sisalto a:hover {
	color: #40423e;
	text-decoration: underline;
}
.info img {
	border: 0.06em solid #c8cdc2;
	padding: 0.3em;
	background-color: #ffffff;
}
/***** VIIMEISIMMÄT TYÖT *****/
.work {
	width: 100%;
	margin: 0.93em 0;
}
.work_img {
	float: left;
	background: url(style/images/work_bg.png) no-repeat;
	padding: 0.75em 0.68em;
	margin:0;
	width: 15.1875em;
	height: 8.8em;
}
.description {
	float: left;
	width: 30em;
	height: 7em;
}
.description h2 {
	font-size: 1.4em;
	font-weight: bold;
	margin: 0 0 0.62em 0;
	line-height: normal;
}
.description p {
	font-size: 0.8em;
	line-height: normal;
}
.work_footer {
	float: left;
	width: 30em;
	background: #f7f7f4;
	border: 0.06em solid #e2e2d8;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}
.work_footer span {
	padding: 0.37em 0.37em 0 0.37em;
}
.work_footer a {
	font-size: 0.75em;
	color: #9c9e97;
	text-decoration: none;
}
.work_footer a:hover {
	color: #5e605a;
}
/***** VASEN *****/
#left {
	float: left;
	width: 47em;
	padding: 0 2em 0 0;
}
/***** POST *****/
#blogsisalto {
	margin: 2.5em 0 2em 0;
}
#blogsisalto p {
	line-height: 1.25em;
	font-size: 0.95em;
	margin: 1em 0;
}
.post {
	margin: 2em 0;
}
.post p {
	padding: 0 0.5em;
}
.post h2 {
	font-size: 1.4em;
	font-weight: bold;
	margin: 0 0 0.2em 0;
	padding: 0.5em 0 0 0.3em;
}
.readmore {
	background: #f7f7f4;
	padding: 0.3em 0.4em;
	color: #484c43;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
.readmore:hover {
	background: #484c43;
	color: #ffffff;
}
.pvm {
	font-size: 0.75em;
	padding: 0.1em 0.7em;
	background: #f7f7f4;
	border: 1px solid #dfe0d5;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	color: #5e605a;
}
.pvm a {
	color: #9c9e97;
	text-decoration: none;
}
.pvm a:hover {
	color: #5e605a;
}
.comments {
	background: #f7f7f4;
	border: 0.06em solid #cccec1;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	padding: 0.5em;
	font-weight: bold;
	width: 1.8em;
	text-align: center;
}
.comments a {
	color: #94988e;
	text-decoration: none;
}
.comments a:hover {
	color: #484c43;
}
/***** KOMMENTIT *****/
.comment-body {
				padding: 0 0 1.5em 0;
				font-size: 0.9em;
				}
				
				ol.commentlist {
					margin: 1.25em 0 0;
					clear:both;
					overflow:hidden;
					list-style:none;
				}
					ol.commentlist li {
						margin: 0.62em 0;
						line-height: 1.1em;
						padding: 0.62em;
					}
						ol.commentlist li .comment-author {
							
						}
							ol.commentlist li .comment-author .fn {
								color:#000;
							}
							ol.commentlist li .comment-author .avatar{
								float:left;
								border:1px solid #dddddd;
								background:#ededed;
								padding: 0.18em;
								margin: 0 1em 0 0;
							}
						ol.commentlist li .comment-meta{
							font-size: 0.8em;
						}
						
						ol.commentlist li p {
							line-height: 1.3em;
							margin-top: 0.3em;
						}
						ol.commentlist li .reply{
							float: right;
							clear: both;
						}
							#comments-wrapper ol.commentlist li .reply a{
								font-size: 0.9em;
								background:#484c43;
								color:#fff;
								text-decoration:none;
								padding: 0.3em 0.4em;
							}
							#comments-wrapper ol.commentlist li .reply a:hover{
								background:#232520;
								color:#fff;
							}
						ol.commentlist li.odd {
							border:1px solid #d0d0c6;
							background:#ebebe5;
						}
						ol.commentlist li.even {
							border:1px solid #dfe0d5;
							background: #f7f7f4;
						}
							
/***** PORTFOLIO *****/
ul.gallery {
	width: 60em; /*--Adjust width according to your scenario--*/
	list-style: none;
	margin: 0; padding: 0;
}
ul.gallery li {
	float: left;
	margin: 10px; padding: 0;
	text-align: center;
	border: 1px solid #ccc;
	background: #ffffff;
	-moz-border-radius: 3px; /*--CSS3 Rounded Corners--*/
	-khtml-border-radius: 3px; /*--CSS3 Rounded Corners--*/
	-webkit-border-radius: 3px; /*--CSS3 Rounded Corners--*/
	display: inline; /*--Gimp Fix aka IE6 Fix - Fixes double margin bug--*/
}
ul.gallery li a.thumb {
	width: 204px; /*--Width of image--*/
	height: 182px; /*--Height of image--*/
	padding: 5px;
	background: #ffffff;
	border-bottom: 1px solid #ccc;
	cursor: pointer;
}
ul.gallery li span { /*--Used to crop image--*/
	width: 204px;
	height: 182px;
	overflow: hidden;
	display: block;
	background: #ffffff;
}
ul.gallery li a.thumb:hover {
	background: #333; /*--Hover effect for browser with js turned off--*/
}
ul.gallery li h2 {
	font-size: 1em;
	font-weight: normal;
	margin: 0; padding: 10px;
	background: #f0f0f0;
	border-top: 1px solid #fff; /*--Subtle bevel effect--*/
}
ul.gallery li a {text-decoration: none; color: #777; display: block;}
.breadcrumb {
	font-size: 0.85em;
}
.workfooter {
	padding: 0.4em 0.5em;
	font-size: 0.75em;
	background: #f7f7f4;
	color: #858881;
	border: 0.06em solid #e2e2d8;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}
/***** OTA YHTEYTTÄ *****/
	#commentform p {
		font-size: 0.9em;
		margin: 0.9em 0;
	}
	#commentform label, label {
		display: inline;
		float: left;
		text-align: right;
		width: 10em;
		color: #484c43;
		margin: 0;
		padding: 0;
		
	}
	#commentform input, #commentform select, input, select {	
		margin: 0 0 0 0.5em;
		width: 14.6em;
		border: 0.06em solid #b0b5a7;		
		padding: 0.18em 0.31em;
		background: #f7f7f4;
		color: #484c43;
		display: inline;
		}	
	#commentform textarea, textarea{
		height:125px;
		border: 0.06em solid #b0b5a7;
		background: #f7f7f4;
		margin: 0 0 0 0.5em;
		overflow:auto;
		width: 30em;
		color: #484c43;
		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
		}					
	#commentform p.submit, p.submit{
		clear:both;
		margin:1em 0;
		padding:.5em 70px;
		border-top:1px solid #f1f1f1;
		color: #484c43;
		}			
/***** OIKEA *****/
#right {
	float: left;
	width: 10em;
	font-size: 0.9em;
}
.right_block {
	width: 10em;
	margin: 0 0 0.93em 0;
	background: #f3f3ee;
	border: 0.06em solid #cccec1;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	padding: 0.62em;
}
.right_block p {
	font-size: 0.75em;
	margin: 0.31em 0;
}
/***** RSS *****/
.rss-popup {
margin: .5em 0;
padding: 0;
width: 100px;
position: relative;
text-align: left;
}
 
div.rss-popup em {
background: url(style/images/bubble.png) no-repeat;
width: 100px;
height: 49px;
position: absolute;
top: -70px;
left: -0px;
text-align: center;
z-index: 2;
display: none;
}
 
#rss-icon {
width: 64px;
height: 64px;
background: url(style/images/rss.png) no-repeat 0 0;
margin: 0 auto;
display: block;
}
/***** FOOTER *****/
#footer {
	background: url(style/images/footer_bg.png) repeat;
}
#footer p img {
	margin: 0.4em 0.3em 0 0.3em;}
/***** FRONT COLUMN *****/
.front_columns {
	width: 15em;
	float: left;
	font-size: 0.81em;
	margin: 0 1.31em 0 0;
}
.front_columns h3 {
	font-size: 1.2em;
	padding: 0 0 0.2em 0;
	border-bottom: 0.18em solid #5e605a;
	margin: 0 0 0.5em 0;
}
.front_columns h4 {
	font-size: 1em;
	margin: 0 0 0.17em 0;
	font-weight: bold;
}
.front_columns p {
	line-height: 1.43em;
	margin: 0;
	}
.front_columns a {
	color: #4c4e4b;
	text-decoration: none;
	}
.front_columns a:hover {
	color: #40423e;
	text-decoration: underline;
	}
p.small {
	font-size: 0.9em;
	color: #888888;
	line-height: 0.68em;
	margin: 0 0 0.31em 0;
	}
p.small a {
	font-size: 0.9em;
	color: #888888;
	}
.small a {
	font-size: 0.85em;
	color: #888888;
}
.small {
	font-size: 0.85em;
}
#footer_nav a {
	font-size: 1em;
	color: #747571;
	font-weight: bold;
	text-decoration: none;
	line-height: 1.8em;
}
#footer_nav a:hover {
	color: #4c4e49;
}
.copy {
	display: inline;
	color: #8a8d84;
	font-size: 0.75em;
}
.copy a {
	color: #4c4e4b;
	text-decoration: none;
}
.copy a:hover {
	color: #000000;
	text-decoration: underline;
}