/* reset */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dd,dl,dt,li,ol,ul,fieldset,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;font-weight:inherit;font-style:inherit;font-family:inherit;text-align:left;vertical-align:baseline;text-decoration:none;}
table{border-collapse:collapse;border-spacing:0;}
q:before,q:after,blockquote:before,blockquote:after{content:"";}
*{outline:none;}
img {border:0;}
/* eo reset */

html, body { height: 100%; }

body
{
	background: #dadee6 url(../img/bg-etusivu.jpg) no-repeat top center;
	height: 100%;
	font-family: "trebuchet ms",arial,helvetica,tahoma,sans-serif;
	font-size: 13px;
	color: #000000;
}

body.blue,
body.project-detail { background-image: url(../img/bg-blue.jpg); }
body.green { background-image: url(../img/bg-green.jpg); }
body.pink,
body.blog { background-image: url(../img/bg-pink.jpg); }
body.orange { background-image: url(../img/bg-orange.jpg); }
body.purple { background-image: url(../img/bg-purple.jpg); }


/* general type, links */
a 		{ color:#0c1830; }
a:hover { color:#4e586b; }

strong { font-weight: bold; }
em { font-style: italic; }

div#inner-content a { color: #4060b2; font-weight: bold;}
div#inner-content a:hover { color: #4d73d6; }

div#inner-content h1
{
	margin: 12px 0 10px 0;
	font-size: 22px;
}

div#inner-content h2,
div#inner-content h3,
div#inner-content h4
{
	margin: 32px 0 10px 0;
	clear: both;
}

div#inner-content h2 { font-size: 16px; font-weight: normal; }
div#inner-content h3 { font-size: 13px; font-weight: bold; }
div#inner-content h4 { font-size: 12px; font-weight: bold; }

div#inner-content h2 + h3 { margin-top: 0; }

div#inner-content p
{
	margin: 0 0 10px 0;
	line-height: 1.6em;
}

div#inner-content ol,
div#inner-content ul
{
	margin: 0 0 10px 20px;
	line-height: 1.6em;
}

div#inner-content img
{
	margin: 10px;
}

div#inner-content blockquote
{
	float: left;
	margin: 20px 20px 20px 10px;
	background: #4e586b url(../img/quote.jpg) scroll 10px 10px no-repeat;
	padding: 20px 10px 20px 60px;
	width: 200px;
	color: #ffffff;
	line-height: 175%;
	font-size: 14px;
}

div.comment p
{
	margin-bottom: 0 !important;
}

table td
{
	vertical-align: top;
}
/* eo general type, links */


div#body
{
	position: relative;
	min-height: 100%;
}

div#top
{
	width: 980px;
	margin: 0 auto;
	padding-bottom: 380px;
	position: relative;
}

div#header
{
	width: 960px;
	padding: 0 10px;
}

	div#logo
	{
		background: transparent url("../img/visual-logo.png") no-repeat;
		width: 184px;
		height: 75px;
		float: left;
		margin: 37px 0 0 0;
	}
	
	div#logo a
	{
		display: block;
		width: 100%;
		height: 100%;
	}

/* main navigation */
div#navigation { float: right; }

div#navigation ul
{
	list-style-type: none;
	margin: 70px 0 0 0;
}

div#navigation li
{
	float: left;
	font-size: 16px;
	margin: 0 10px;
	text-transform: lowercase;
}

div#navigation li a 		{ color: #000000;}
div#navigation li a:hover	{ color: #4e586b;}
div#navigation li.selected a { color: #f4811d; }

.flash-navigation {
	position:absolute !important;
	right: -22px;
	top: 14px;
	z-index: 0;
}
/* eo main navigation */

/* border, top headers */	
div#top-border
{
	width: 960px;
	height: 53px;
	margin: 0 0 0 10px;
	/*background: transparent url("../img/splash-border.jpg") no-repeat bottom left;*/
}
	
div#left-header
{
	float: left;
	margin: 0 0 0 10px;
}
div#right-header
{
	float: right;
	margin: 0 281px 0 0;
}
	
div.border-header h4
{
	margin: 30px 0 0 0;
	font-size: 12px;
	text-transform: uppercase;
}


div.top-980shadow
{
	width: 980px;
	height: 5px;
	background: transparent url("../img/top-980shadow.png") no-repeat bottom left;
}

div.content-980shadow
{
	width: 940px;
	padding: 10px 20px 10px 20px;
	background: transparent url("../img/content-980shadow.png") repeat-y;
}

body.index div.content-980shadow
{
	min-height: 280px;
}

div.bottom-980shadow
{
	width: 980px;
	height: 10px;
	background: transparent url("../img/bottom-980shadow.png") no-repeat;
}

div.campaign
{
	background: #fff;
	width: 560px;
	height: 280px;
	float: left;
	overflow: hidden;
	position: absolute;
	z-index: 900;
}

div.campaign img
{
	float: left;
}

div.googlemap
{
	width: 470px;
	height: 320px;
	float: left;
}

div.mapheader
{
	width: 470px;
	float: left;
}


/* project windows */
div#tease-references
{
	width: 380px;
	float: right;
}

div.window
{
	background: transparent none no-repeat scroll 0 0;
	width: 180px;
	height: 135px;
	overflow: hidden;
	position: relative;
	float: left;
	margin: 0 0 0px 10px;
	cursor: pointer;
}

div#window-1, div#window-2
{
	margin-bottom: 10px;
}

div.window:hover
{
	background-position: 0px -135px;
}

div.window div.tooltip
{
	background: transparent url(../img/white-70.png);
	color: #000;
	padding: 5px;
	position: absolute;
	height: 65px;
	width: 100%;
	bottom: -70px;
}

div.window div.tooltip h2
{
	font-size: 16px;
	margin: 0; padding: 0;
}

div.window div.tooltip a {
	color: #000000;
	display: block;
	width: 100%;
	height: 100%;
}

div.window div.tooltip a p {
	font-size: 9px;
}
/* eo project windows */


div#content {
	width: 970px;
	padding: 50px 0 0 10px;
}


	div#content div.column
	{
		width: 300px;
		float: left;
		margin-left:20px;
	}

	div#content div.firstcol
	{
		margin-left: 10px;
	}
	
	div.colheader {
		width: 300px;
		background: transparent url(../img/content-header-border.jpg) scroll 0px 50px repeat-x;
	}
	
	div.colheader img
	{
		margin: 0 !important;
	}
	
	div.colheader h2,
	div.colheader img
	{
		float: left;
	}
	
	div.colheader h2
	{
		font-size: 18px !important;
		margin: 22px 0 0 10px !important;
		clear: none !important;
	}
	
	div.colheader a 		{color: #000000 !important;}
	div.colheader a:hover	{color: #111111 !important;}
	
	div.colcontent p
	{
		margin: 4px 4px 4px 4px;
		line-height: 160%;
		text-align: left;
	}
	
	div.colcontent ul
	{
		list-style-image: url(../img/check.png);
	}
	
	div.colcontent ul li
	{
		margin: 0 0 10px 10px;
	}
	
	div.colcontent img
	{
		margin: 2px 2px 0px 10px !important;
	}
	
	div.colcontent div.contact-content
	{
		margin: 0 0 0 20px;
	}
	

body.three-columns div.column div.content-300shadow
{
	height: 280px;
}

div.top-300shadow
{
	width: 300px;
	height: 5px;
	background: transparent url("../img/top-300shadow.png") no-repeat bottom left;
}

div.content-300shadow
{
	width: 280px;
	padding: 10px;
	background: transparent url("../img/content-300shadow.png") repeat-y;
}

div.bottom-300shadow
{
	width: 300px;
	height: 10px;
	background: transparent url("../img/bottom-300shadow.png") no-repeat;
}


div.index-slogan
{
	margin: 10px 0 20px 20px;
}


/* submenu */
div.top-340shadow
{
	width: 340px;
	height: 5px;
	background: transparent url("../img/top-340shadow.png") no-repeat bottom left;
}

div.content-340shadow
{
	width: 320px;
	padding: 10px 10px 30px 10px;
	background: transparent url("../img/content-340shadow.png") repeat-y;
}

div.bottom-340shadow
{
	width: 340px;
	height: 10px;
	background: transparent url("../img/bottom-340shadow.png") no-repeat;
}

div#menu h2
{
	font-size: 18px;
	margin: 0 0 10px 10px;
}

div.menu-item
{
	width: 100%;
	position: relative;
}

div#menu div.menu-icon,
div#menu div.menu-text
{
	float: left;
}

div#menu div.menu-text
{
	margin: 0 0 10px 10px;
	padding-left: 15px;
}

div#menu div.menu-text h2
{
	margin: 10px 0 0 0;
	padding: 0;
	font-size: 16px;
	font-weight: normal;
}

div#menu div.menu-text p
{
	margin: -4px 0 0 0;
	padding: 0;
	font-size: 12px;
	color: #3e4045;
}

div#menu a
{
	display: block;
	width: 100%;
	height: 100%;
	background-color: #ffffff;
	border-bottom: 1px solid #dadee6;
}

div#menu a:hover { background-color: #f0f2f7; }

div.first-item a { border-top: 1px solid #dadee6; }

div.selected a { background-color: #dadee6 !important; }

div.selected a:hover 
{
	background-color: #dadee6 !important;
	color: #0c1830;
}

div#menu div.hoverdiv
{
	display: none;
	position: absolute;
	top:0;
	right: -231px;
	background-color: #f0f2f7;
	width: 231px;
	z-index: 1000;
	
}

div.selected div.hoverdiv { background-color: #dadee6 !important; }

div#menu div.logo
{
	padding: 20px;
	margin: 10px;
	background-color: #ffffff;
	text-align: center;
}

div#menu div.logo img { max-width: 100%; }
/* eo submenu */


body.project-detail div#content,
body.page div#content,
body.blog div#content,
body.comment div#content
{
	padding: 0;
}
body.index div#content
{
	padding: 0 0 0 10px;
}

div#menu
{
	float: left;
}

body.index div#inner-content
{
	width: 960px;
	float: left;
	padding-bottom: 0;
}

body.no-menu div#inner-content
{
	width: 960px;
}

div#inner-content
{
	float: right;
	padding-bottom: 40px;
	width: 620px;
}

div#inner-content div.profile-img
{
	float: left;
	margin: 15px 0 0 0;
	width: 230px;
	height: 280px;
}

div#inner-content div.info-wrapper
{
	float: left;
	margin: 10px 0 0 0;
	width: 380px:
}

div#inner-content div.profile-header
{
	float: left;
}

div#inner-content div.profile-icons
{
	float: right;
	margin: 10px 0 0 0;
}



div#inner-content div.profile-info
{
	margin: 15px 0 0 0;
	width: 380px;
}

div#inner-content div.profile-info p
{
	margin: 0 0 1px 0 !important;
	
}


/* project */
div#image-ctr 
{
	display: block;
	-moz-box-shadow: 0 0 10px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.2);
	margin: 10px 0;
	position: relative;
}

div#image-ctr img
{
	margin: 0 auto;
	display: block;
	max-width: 100%;
}

div#project-images
{
	text-align: center;
	padding: 8px 0;
	margin: 0 0 15px 0;
	background-color: #c5c9d0;
}

div#project-images img
{
	margin: 5px 0 5px 5px;
	border: 1px solid #eee;
}
/* eo project */

/* ajax loader */
div.loader
{
	background: transparent url(../img/loader-bg.png) no-repeat center center;
	z-index: 1000;
	display: block;
	position: absolute;
	width: 82px;
	height: 82px;
	left: 50%;
	top: 50%;
	margin-top: -41px;
	margin-left: -41px;
}

span.loading-icon
{
	background: transparent url(../img/ajax-loader.gif) no-repeat center center;
	width: 50px;
	height: 50px;
	display: block;
	margin: 15px auto 0 auto;
}
/* eo ajax loader */


/* blog */
div.author
{
	margin: 60px 0 10px 0;
	background: #c5c9d0;
	padding: 10px;
}

div.userbox
{
	margin-top: 20px !important;
}

div.author-avatar img
{
	margin: 0 10px 0 0 !important;
	display: block;
}

div.author-info h3
{
	clear: none !important;
	margin: 0 !important;
	font-size: 13px;
	font-weight: bold;
}

div.author-info
{
	font-size: 12px;
}

div.comment
{
	/*background: #d6d9da;*/
	padding: 10px;
	margin: 10px 0;
	border-top: 1px solid #c0c0c0;
}

span.comment-info
{
	color: #666;
	font-style: italic;
}

div#post-comments div.zebra0 { background: #CDD0D6; }
div#post-comments div.zebra1 { background: #D6D8DB; }

ul#blog-archive
{
	list-style: none;
}

ul#blog-archive li { list-style: none; }

ul#blog-archive a.level-1 { font-weight: bold; }

ul#blog-archive ul.sub li a { padding-left: 20px; }

ul#blog-archive li a
{
	padding: 5px 10px;
	width: auto;
}

div.post
{
	border-bottom: 1px solid #b1b7b8;
	padding-bottom: 10px;
}

div.last-post { border: 0; }

div.post-info
{
	color: #8d8d8d;
	display: block;
	margin-top: -10px;
	margin-bottom: 10px;
	font-size: 12px;
}
/* eo blog */


/* forms */
input, select, textarea
{
	font-family: "trebuchet ms",arial,helvetica,tahoma,sans-serif;
	font-size: inherit;
}

input[type="submit"] { cursor: pointer; }

table.form-table td { padding: 2px 10px 2px 0; }

table.form-table tr.required label { font-weight: bold; }

table.form-table textarea { width: 100%; }

table#comment-table { width: 80%; }

table#comment-table td.label { width: 110px; }

table#comment-table input[type="text"] { width: 60%; }

table#comment-table textarea { height: 90px; }

table#comment-table input,
table#comment-table textarea
{
	background: #f0f0f0;
	border: 1px solid #ccc;
	padding: 2px;
}

table#comment-table input:focus,
table#comment-table textarea:focus,
input.submit-post:hover
{
	background: #f8f8f8 !important;
	border: 1px solid #aaa;
}

.has-error input,
.has-error textarea
{
	border-color: #cc1100 !important;
	background-color: #e5c9d5 !important;
}

.errorlist
{
	margin-left: 0 !important;
}

.errorlist li
{
	font-style: italic;
	list-style: none;
}
/* eo forms */


div#inner-content div.imagewrap
{
	float: left;
	margin: 10px 20px 20px 10px;
	text-align: center;
}

div#inner-content div.imagewrap img
{
	float: none !important;
	margin: 0 !important;
}

div#inner-content div.imagewrap span
{
	font-style: italic;
	color: #3d3d3d;
	text-align: center;
}


/* footer */
div#footer
{
	position: absolute;
	bottom: 0;
	height: 350px;
	width: 100%;
	border-top: 1px solid #f6f7f9;
	background: #c5c9d0 url(../img/footer-shadow.png) no-repeat top center;
}

	div#fwrapper
	{
		width: 960px;
		margin: 0 auto;
		margin-top: 40px;
	}
	
		div#blog
		{
			float:left;
			width: 300px;
			margin-left: 10px;
			padding-bottom: 5px;
			background: transparent url(../img/footer-header-border.jpg) scroll 0px 23px repeat-x;
		}
		
		div#footer h2
		{
			font-size: 16px;
			margin-bottom: 20px;
		}
		
		div.blog-item
		{
			margin: 10px 0 0 0;
			width: 300px;
		}
		
		div.blog-item h3
		{
			display: inline-block;
			width: 280px;
			/*background-color: #4e586b;*/
			background-color: transparent;
			color: #dce0e7;
			font-size: 14px;
			font-weight: normal;
		}
		
		div.blog-item h3 a
		{
			color: #fbfbfb;
			padding: 6px 10px 6px 10px;
		}
		
		div.blog-item span.writer
		{
			float: left;
			font-size: 11px;
			padding: 0px 0 0 2px;
		}
		
		div.blog-item span.date
		{
			float: right;
			font-size: 11px;
			padding: 0px 2px 0 0;
		}
		
		div.blog-item a.zebra0,
		div.blog-item a.zebra1
		{
			display: block;
			width: 100%;
			height: 100%;
			cursor: pointer;
		}
		
		div.blog-item a.zebra0	{background-color: #4e586b;}
		div.blog-item a.zebra1	{background-color: #6c7a92;}
		
		div.blog-item a.zebra0:hover	{background-color: #323b4c;}
		div.blog-item a.zebra1:hover	{background-color: #323b4c;}
		
		div#contact
		{
			float: left;
			width: 630px;
			margin-left: 20px;
			padding-bottom: 5px;
			background: transparent url(../img/footer-header-border.jpg) scroll 0px 23px repeat-x;
		}
		
		div#contact h1
		{
			font-size: 16px;
			margin-bottom: 15px;
		}
		
		div#form-left,
		div#form-right
		{
			width: 315px;
			float: left;
		}
		
		div.fieldname
		{
			color: #1e1e1e;
			font-size: 13px;
		}
		
		div.field
		{
			width: 315px;
			margin-bottom: 5px;
		}
		
		div.field input.textfield
		{
			width: 275px;
			margin: 2px 0 0 5px;
			background-color: #dadee6;
			border: 1px solid #b2b5bc;
			padding: 5px;
			font-family: inherit;
			font-size: 13px;
		}
		
		.checkbox, .radio
		{
			width: 13px;
			height: 13px;
			padding: 0 3px 0 0;
			background: url(../img/checkbox.png) no-repeat;
			display: block;
			float: left;
			margin: 10px 0 0 5px;
		}
		
		div.field label.check
		{
			float: left;
			margin: 7px 10px 7px 0;
		}
		
		
		div.field textarea
		{
			width: 290px;
			height: 90px;
			margin: 2px 0 0 5px;
			background-color: #dadee6;
			border: 1px solid #b2b5bc;
			padding: 5px;
			font-family: "trebuchet ms",arial,helvetica,tahoma,sans-serif;
			font-size: 13px;
		}
		
		div.submit
		{
			float:right;
		}
		
		div.submit input.submit
		{
			margin: 2px 10px 0 5px;
			background-color: #6c7a92;
			border: 1px solid #b2b5bc;
			padding: 5px;
			width: 120px;
			color: #fff;
			font-family: inherit;
			cursor: pointer;
		}
		
		div#contactinfo
		{
			width: 960px;
			margin: 0 auto;
		}

		div#contactinfo p
		{
			padding: 10px 0 10px 0;
			position: absolute;
			width: 960px;
			bottom: 0;
			text-align: center;
			color: #4e586b;
			background: transparent url(../img/footer-header-border.jpg) scroll 0px 0px repeat-x;
		}
		
		div#contactinfo a:hover {
			color: #020711;
		}
		
/* eo footer */

/* ie6 notice */
div#ie-box
{
	display: none;
}

div#ie-box h1
{
	font-size: 24px;
}
/* eo ie6 notice */

/* menu icons */
div#menu-service1 div.menu-icon,
div#menu-service2 div.menu-icon,
div#menu-service3 div.menu-icon,
div#menu-eduskuntavaalit div.menu-icon,
div#menu-markkinoinninsuunnittelu div.menu-icon,
div#menu-myynnintyokalut div.menu-icon,
div#menu-perinteinenmedia div.menu-icon
{
	width: 48px;
	height: 48px;
	background: transparent none no-repeat right;
}

div#menu-service1 div.menu-icon 				{ background-image: url(../img/icon-small03.png); }
div#menu-service2 div.menu-icon 				{ background-image: url(../img/icon-small02.png); }
div#menu-service3 div.menu-icon 				{ background-image: url(../img/icon-small01.png); }
div#menu-eduskuntavaalit div.menu-icon 			{ background-image: url(../img/icon-eduskuntavaalit.png); }
div#menu-markkinoinninsuunnittelu div.menu-icon { background-image: url(../img/icon-markkinoinninsuunnittelu.png); }
div#menu-myynnintyokalut div.menu-icon 			{ background-image: url(../img/icon-myynnintyokalut.png); }
div#menu-perinteinenmedia div.menu-icon 		{ background-image: url(../img/icon-perinteinenmedia.png); }
/* eo menu icons */

/* social media icons */
div.social-links
{
	position: absolute;
	right: 20px;
	top: 25px;
	z-index: 1000;
}

img.andersinno
{
	margin-left: 5px;
}

span.sm-icon
{
	background: transparent none no-repeat center center;
	width: 24px;
	height: 24px;
	display: block;
	float: left;
	margin: 2px;
}

span.twitter-icon	{ background-image: url(../img/twitter-24.png); }
span.facebook-icon	{ background-image: url(../img/facebook-24.png); }
span.linkedin-icon	{ background-image: url(../img/linkedin-24.png); }
/* eo social media icons */

/* twitter */
div.twtr-widget
{
	margin-top: 32px;
}

div.twtr-hd h3,
div.twtr-hd h4
{
	clear: none !important;
}

div.twtr-doc img { margin: 0 !important; }
div.twtr-tweet-text a { font-weight: normal !important; }
a.twtr-user { color: #000 !important; }
/* eo twitter */


/* helpers */
.left { float: left; }
.right { float: right; }
.clear { clear: both; }
.padded-block { padding: 2px 10px; }
/* eo helpers */

div.error-dialog { position: fixed !important; }

/* styled checkboxes */
input.styled { display: none; }
select.styled { position: relative; width: 190px; opacity: 0; filter: alpha(opacity=0); z-index: 5; }
.disabled { opacity: 0.5; filter: alpha(opacity=50); }
/* eo styled checkboxes */