/*
###		Petri Vilén
###		Bolder Helsinki
###		Copyright 2008
*/



/*
###		RAKENTEET
*/

* { outline: none; }

body {
	background: #202020;
	font-family: Georgia, Times New Roman, Times, serif;
	font-size: 0.75em;
	line-height: 1.2em;
	padding: 0;
	margin: 0;
}

.blogimage {
	margin-top: 0;
	padding-top: 0;
	clear:both;

}

#wrap {
	background: #fff url(/images/topbar.png) repeat-x top;
	padding-top: 0;
}

#main {
	width: 1000px;
	margin: 0 auto 0 auto;
	padding: 30px 0 60px 0;
	display: block;
}



/*
###		LINKS
*/

a { text-decoration: none; color: #58b9c2; }
a:hover { text-decoration: underline; }


/*
###		HEADER
*/

#header_wrap {
	margin-top: 0;
	z-index: 99;
	display: block;
	height: 490px;
}

#blog #header_wrap {
	height: 320px;
}

#header {
	position: absolute;
	top: 10px;
	left: 50%;
	margin-left: -500px;
	padding: 0;
	background: url(/images/header_normal.png) no-repeat center;
	height: 163px;
	width: 1000px;
	z-index: 99;
	display: block;
}



#subheader_wrap {
	margin-top: 0px;
	z-index: 2;
}

#subheader {	
	height: 380px;
	width: 868px;	
	margin: 0 auto 0 auto;
	padding-top: 125px;
}

#subheader_contents {
	height: 380px;
	width: 868px;
}

#blog #subheader {
	height: 217px;
}

#blog #subheader_contents {
	height: 217px;
	background: url(/images/headers/blog_header.png) no-repeat;
}


#subheader_contents h1 {
	color: #fff;
	font-weight: normal;
	text-align: center;
}


#buttons {
	position: absolute;
	top: 0;
	right: 50%;
	margin-right: -400px;
	margin-top: -10px;
}


/*
###		MENU
*/

#menu {
	width: 903px;
	height: 97px;
	padding-top: 40px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 0;
	display: block;
}

#menu ul {
	margin: 0 auto 0 auto;
	padding: 0;
	list-style: none;
	text-align: right;
}

#menu li {
	margin: 0 auto;
	padding: 0;
	float: left;
}


#menu a {
	background-repeat: no-repeat;
	color: #666;
	text-decoration: none;
	display: block;
	padding: 0;
	margin-top: 37px;
	text-transform:uppercase;
	text-indent: -9999px;
	font-size: 11px;
	width: 136px;
	height: 37px;
	text-align: center;
	background-image: url(/images/menu_perus.png);
	outline: none;
}

#menu a:hover {
	background-image: url(/images/header_hover.png);
}

#menu li.selected a {
	background-image: url(/images/header_active.png);
}

#menu a#logo {
	width: 80px;
	height: 69px;
	margin-top: 19px;
}

a#logo, a#logo:hover, .selected a#logo {
	background: none;
}



/* menun efektit */

a#menu-bolder,
a#menu-bolder:hover,
.selected a#menu-bolder { background-position: -48px -77px; }

a#menu-ideas,
a#menu-ideas:hover,
.selected a#menu-ideas { background-position: -184px -77px; }


a#menu-design,
a#menu-design:hover,
.selected a#menu-design { background-position: -320px -77px; }


a#menu-blog,
a#menu-blog:hover,
.selected a#menu-blog { background-position: -536px -77px; }


a#menu-people,
a#menu-people:hover,
.selected a#menu-people { background-position: -672px -77px; }


a#menu-contact, 
a#menu-contact:hover, 
.selected a#menu-contact { background-position: -808px -77px; }



/*
### 	SUBMENU
*/


#submenu {
	position: relative;
	top: -9px;
	left: 50%;
	margin-left: -500px;
	width: 1000px;
	text-align: center;
}

#submenu ul {
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

#homepage #submenu ul { margin-top: 66px; width: 226px; }
#about #submenu ul {  width: 226px; }
#bolder #submenu ul { width: 226px; }
#people #submenu ul { width: 775px; }
#contact #submenu ul { width: 226px; }
#blog #submenu ul { width: 444px; }

#submenu li {
	float: left;
}

#submenu a {
	color: #a6a6a6;
	display: block;
	font-family: Gotham, Helvetica, Verdana, Arial;
	font-size: 10px;
	font-weight: bold;
	width: 109px;
	height: 43px;
	background: url(/images/submenu_back.png) no-repeat;
	text-align: center;
	outline: none;
	padding-top: 15px;
	text-decoration: none;
	text-transform: uppercase;
}



#submenu a:hover {
	color: #000;
}


#submenu .submenu-first a {
	width: 112px;
	background: url(/images/submenu_first.png) no-repeat;
}

#submenu .submenu-last a {
	width: 114px;
	background: url(/images/submenu_last.png) no-repeat;
}

#submenu a:hover {
	background: url(/images/submenu_hover.png) no-repeat;
}

#submenu li.submenu-first a:hover {
	background: url(/images/submenu_first_hover.png) no-repeat;
}

#submenu li.submenu-last a:hover {
	background: url(/images/submenu_last_hover.png) no-repeat;
}



#submenu .selected a {
	color: #58b9c2;
	background: url(/images/submenu_hover.png) no-repeat;
}


#submenu .submenu-first-selected a {
	color: #58b9c2;
	background: url(/images/submenu_first_hover.png) no-repeat;
}

#submenu .submenu-last-selected a {
	color: #58b9c2;
	background: url(/images/submenu_last_hover.png) no-repeat;
}



/*
###		CONTENTS
*/

#homepage #contents {
	margin-top: 70px;
}

#contents {
	width: 1000px;
	margin: 0 auto;
}


.c2 {
	width: 400px;
	float: left;
	margin-left: 40px;
}

.c3 {
	width: 260px;
	float: left;
	margin-left: 30px;
}

.first {
	margin-left: 0;
	background: #fff;
}


.c2 h2, .c3 h2 {
	color: #58b9c2;
	font-weight: normal;
	margin-bottom: 12px;
	font-size: 16px;
}

.c2 ul { margin: 15px 0; padding: 0; list-style: none; }

.c2 li { float: left; width: 150px; margin: 5px; color: #666; }



/*
###		SISÄLTÖ
*/


#contents_in {
	width: 850px;
	margin-top: 20px;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}

#design #contents_in, #ideas #contents_in { margin-top: 0; }

#blog #contents_in { width: 868px; }

p {
	color: #333;
	margin-bottom: 20px;
	line-height: 170%;
}


#text ul {
	margin: 10px 20px;
	padding: 0;
}

#text li {
	margin: 5px 20px;
}




/*
###		PEOPLE
*/


#personal-info {
	width: 310px;
	float: left;
	text-align: right;
	clear:left;
}

#personal-description {
	width: 450px;
	margin-left: 50px;
	float: left;
}



#personal-info h1 {
	color: #58b9c2;
	font-weight: normal;
	margin-bottom: 0;
	font-size: 1.8em;
}

#personal-info h2 {
	color: #666;
	font-size: 1.2em;
	margin-top: 6px;
	font-weight: normal;
	line-height: 140%;
}

#personal-info ul {
	margin: 20px 0 0 0;
	padding: 0;
	list-style: none;
}


/*
###		CONTACT
*/

#contacts {
	padding-left: 30px;
}

.contact {
	float: left;
	width: 270px; 
	margin: 0 0 30px 0;
}

.contact_img {
	float: left;
	width: 87px;
}

.contact_info {
	float: left;
	margin-left: 20px;
	padding-top: 5px;
}


.contact h2 {
	font-weight: normal;
	margin: 0;
	color: #58b9c2;
	font-size: 15px;
}


.contact .title {
	color: #666;
	margin: 2px 0 10px 0;
	text-transform: uppercase;
}

.contact .responsibility {
	color: #444;
	margin-bottom: 10px;
}

.contact .email {
	font-size: 0.8em;
}

.contect a {
	color: #444;
	text-decoration: none;
}


.contact .phone {
	font-size: 0.8em;
	color: #444;
}




/*
###		CONTACT FORM
*/

#contact-form {
	background:url(/images/headers/dropby.png); 
	width: 868px; 
	height: 380px;
}

#contact-form input {
	background: transparent;
	border: 0;
	color: #ddd;
	width: 140px;
	margin-right: 25px;
}

#contact-form div.lomake {
	float:left;
}

#contact-styles {
	padding: 330px 0 0 183px;
}

#contact-form input#time { margin-right: 0; }

#contact-form input#submit {
	width: 55px;
}



/*
###		BLOG
*/


.entry {
	clear: both;
	margin-bottom: 40px;
}


.entry-header { height: 7px; background: url(/images/entry-header.png) no-repeat; }

.entry-info {
	width: 291px;
	float: left;
	margin-right: 6px;
	background: url(/images/entryinfo_back.png) repeat-y;
}

.entry-info-header {
	height: 6px;
	background: url(/images/entryinfo_header.png) repeat-y;
}

.entry-info-footer {
	height: 10px;
	background: url(/images/entryinfo_footer.png) repeat-y;
}

.entry-meta {
	padding: 20px;
}


.entry-meta-comments { float: right; margin-top: -30px; }
.entry-meta-comments a { display: block; width: 56px; height: 43px; background: url(/images/comments-button.png) no-repeat; text-align: center; font-size: 16px; line-height: 180% }

.entry-meta-author { margin-bottom: 10px; }
.entry-meta h2 { font-weight: normal; line-height: normal }

.entry-meta ul {
	margin: 10px 0;
	padding: 0;
	list-style: none;
}

.entry-meta li { margin: 5px 0; }

.entry-contents {
	width: 571px;
	float: left;
	background: url(/images/entry_back.png) repeat-y;
}

.entry-text { padding: 20px; }
.entry-text img { margin: 0 -20px; }

img.first { margin-top: -20px; }

.entry-footer a {
	display: block;
	width: 570px;
	height: 26px;
	background: url(/images/entry_footer.png);
	text-indent: -9999px;
}

.entry-footer-empty {
	display: block;
	width: 570px;
	height: 26px;
	background: url(/images/entry-footer-empty.png);}
.navigation { padding: 3px 20px; }



/*
###		FOOTER
*/


#footer {
	clear: both;
	display: block;
	height: 200px;
	background: #202020 url(/images/footerbg.png) repeat-x;
}

#footer-contents {
	width: 800px;
	margin: 0 auto;
	padding-top: 60px;
}

#footer-contents p {
	color: #ccc;
	padding: 0;
	margin: 0;
	font-size: 11px;
}

.f5 {
	width: 200px; 
	float: left;
}

.f5-first, .f5-last { width: 100px; }







/*
###		MISC
*/

#preload { visibility: hidden; }
.clear { clear: both; }

img { border: 0; }

.alignleft { float: left; }
.alignright { float: right; }
