/*
Theme Name: 	Solidea 2014
Theme URI: 		http://viewportindustries.com/products/starkers
Description: 	The totally nude Wordpress theme!
Version: 		4.0
Author: 		Elliot Jay Stocks & Keir Whitaker
Author URI: 	http://viewportindustries.com
Tags: 			starkers, naked, clean, basic
*/

/*
===========================
CONTENTS:

01 Sensible defaults
02 Typography
03 Media queries
===========================
*/

/* ----------------------------------------------------------------------------------------------------------
01 Sensible defaults ----------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */

@import "css/reset.css";

div,
article,
section,
header,
footer,
nav,
li					{ position:relative; /* For absolutely positioning elements within containers (add more to the list if need be) */ }
.group:after 		{ display:block; height:0; clear:both; content:"."; visibility:hidden; /* For clearing */ }
body 				{ background:#fff; /* Don't forget to style your body to avoid user overrides */ }
::-moz-selection 	{ background:#3a6399; color:#fff; }
::selection 		{ background:#3a6399; color:#fff; }

/* ----------------------------------------------------------------------------------------------------------
02 Typography -----------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */
/*

14 / 16	= 		0.875em 		(14px equivalent)
16 / 16	= 		1em 			(16px equivalent)
18 / 16 = 		1.125em 		(18px equivalent)
21 / 16 = 		1.3125em 		(21px equivalent)
24 / 16 = 		1.5em 			(24px equivalent)
30 / 16 = 		1.875em 		(30px equivalent)

*/

/*
Sticky Footer Solution
by Steve Hatcher
http://stever.ca
http://www.cssstickyfooter.com
*/

* {margin:0;padding:0;}

/* must declare 0 margins on everything, also for main layout components use padding, not
vertical margins (top and bottom) to add spacing, else those margins get added to total height
and your footer gets pushed down a bit more, creating vertical scroll bars in the browser */

html, body {height: 100%;}

#wrap {min-height: 100%;}

#main {overflow:auto;
	padding-bottom: 459px;}  /* must be same height as the footer */

footer {position: relative;
	margin-top: -459px; /* negative value of footer height */
	height: 459px;
	clear:both;}

/*Opera Fix*/
body:before {/* thanks to Maleika (Kohoutec)*/
content:"";
height:100%;
float:left;
width:0;
margin-top:-32767px;/* thank you Erik J - negate effect of float*/
}

body,
input,
textarea 			{ /* We strongly recommend you declare font-weight using numerical values, but check to see which weights you're exporting first */ }

h1,
h2,
h3,
h4,
h5,
h6 	{
	font-weight: 300;
	}

a, a:link, a:visited, a:hover {
	color: #56d3ff;
	text-decoration: underline;
	}

a:hover {
	color: #8ee2ff;
	text-decoration: underline;
	}

h1 {
	font-size: 36px;
	padding-bottom: 1em;
	}

h2 {
	font-size: 24px;
	line-height: 1em;
	padding-bottom: 1.2em;
	}

h2.coupled {
	padding-bottom: 0.6em;
	}

h2 a {
	text-decoration: none !important;
	}

h3,
h2.ninja-forms-form-title {
	font-size: 24px;
	padding-bottom: 0.5em;
	    line-height: 1em;
	}


h4 {
	font-size: 21px;
	padding-bottom: 0.5em;
	    line-height: 1em;
	}

h5{
	font-size: 14px;
	font-weight: 700;
	padding-bottom: 1.5em;
	    line-height: 1em;
	}

h6{
	font-size: 18px;
	padding-bottom: 0.5em;
	    line-height: 1em;
	}

p {
	padding-bottom: 1.5em;
	}

p.small {
	font-size: 0.9em;
	padding-bottom: 1em;
	}

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}

/* */

body {
	background: #0d0d0d url(images/stripe.png);
	-webkit-text-size-adjust: 100%; /* Stops Mobile Safari from auto-adjusting font-sizes */
	padding: 0;
	color: #262626;
	font-size: 18px;
	line-height: 24px;
	font-family: 'Open Sans', sans-serif;
	text-align: center;
	}

header,
footer,
section{
	display: block;
	position: relative;
	width: 100%;
	text-align: left;
	}

section {

	}

.hidden {
	visibility: hidden;
	}

.section-wrap {
	width: 1120px;
	min-width: 1120px;
	max-width: 1700px;
	display: block;
	margin: 0 auto;
	position: relative;
	}

header {
	max-width: 1700px;
	margin: 0 auto;
	background: #0d0d0d
	}

body.home header {
	background: none;
	}

header  .section-wrap {
	height: 103px;

	}

.parallax {
	position: relative;
	}

body.home header .section-wrap {
	background: url(images/header_body.png) repeat-x;
	}

body.home .stripe {
	display: block;
	width: 100%;
	height: 58px;
	background: url(images/blue32.png);
	position: absolute;
	top: 358px;
	left: 0;
	}

body.home .intro h1{
	padding: 98px 0 18px 0;
	font-size: 36px;
	line-height: 1.3em;
	max-width: 800px;
	color: #fff;
	}

body.home .intro h3{
	font-size: 24px;
	line-height: 1.3em;
	max-width: 800px;
	color: #fbaf17;
	padding: 0;
	}

body.home .intro a{
	display: block;
	width: 42px;
	height: 42px;
	background: url(images/dn.png) no-repeat;
	position: absolute;
	top: 338px;
	left: 0;
	z-index: 500;
	}

footer {
	background: url(images/footer.jpg) 50% 0 no-repeat;
	}

footer .section-wrap {
	height: 459px;
	overflow: hidden;
	}

footer .cta p {
	margin: 48px 0 0 0;
	font-size: 27px;
	line-height: 146px;
	color: #fff;
	font-weight: 300;
	display: block;
	height: 146px;
	}

footer .contact {
	position: relative;
	display: block;
	width: 100%;
	height: 195px;
	font-size: 16px;
	line-height: 24px;
	color: #fff;
	}

footer .contact img {
	position: absolute;
	top: 52px;
	left: 0;
	width: 160px;
	/*height: 51px;*/
	height: 67px;
	}

footer .contact .contact1 {
	position: absolute;
	top: 52px;
	left: 240px;
	display: block;
	width: 200px;
	}

footer .contact .contact2 {
	position: absolute;
	top: 52px;
	left: 467px;
	display: block;
	width: 400px;
	}

footer .contact .contact2 img {
	width: 110px;
	height: auto;
	top: auto;
	left: auto;
	position: relative;
}

body.home header .section-wrap {

	}

header .section-wrap {

	}

body header img{
	/*padding-top: 26px;*/
	margin-top: 18px;
 -webkit-transition: all 0.4s ease;
     -moz-transition: all 0.4s ease;
       -o-transition: all 0.4s ease;
      -ms-transition: all 0.4s ease;
          transition: all 0.4s ease;
	width: 160px;
	/*height: 51px;*/
	height: 67px;

	}

body header img:hover {
	transform: scale(0.98);
	-ms-transform: scale(0.98); /* IE 9 */
	-webkit-transform: scale(0.98); /* Safari and Chrome */
	}

nav {
	position: absolute;
	top: 29px;
	right: 0px;
	}

nav ul {
	list-style: none;
	padding: 0;
	margin: 0;
	}

nav ul ul {
	display: none;
}

nav ul li{
	list-style: none;
	padding: 0;
	margin: 0 0 0 38px;
	float: left;
	}

nav ul li a,
nav ul li a:link,
nav ul li a:visited,
nav ul li a:active {
	font-weight: 700;
	display: block;
	margin: 0;
	line-height: 32px;
	padding: 0;
	color: #d7d7d7;
	text-decoration: none;
	font-size: 16px;
	padding: 10px 0;
	}


nav ul li a:hover,
nav ul li a:focus {
	color: #fff;
	text-decoration: none;
	}

nav ul li.current_page_item>a,
nav ul li.current-menu-item>a,
nav ul li.current-page-ancestor>a {
	color: #8be7ff !important;
	text-decoration: none;
	}

body.page-id-18 nav ul li.current_page_item a,
body.page-id-18 nav ul li.current-menu-item a,
body.page-id-18 nav ul li.current-page-ancestor a {
	color: #90ed9f !important;
	}

body.page-id-16 nav ul li.current_page_item a,
body.page-id-16 nav ul li.current-menu-item a,
body.page-id-16 nav ul li.current-page-ancestor a {
	color: #fbaf17 !important;
	}
/*
body.page-id-23 nav ul li.current_page_item a,
body.page-id-23 nav ul li.current-menu-item a,
body.page-id-23 nav ul li.current-page-ancestor a {
	color: #fff !important;
	}
*/
body.single section.headline,
body.category section.headline  {
	max-width: 1700px;
	margin: 0 auto;
	background: #222;
	}

body.single section.headline .section-wrap,
body.category section.headline .section-wrap {
	height: 116px;

	}

body.single section.headline .section-wrap h4,
body.category section.headline .section-wrap h4 {
	padding-top: 30px;
	}

section.headline .section-wrap {
	height: 416px;
	}

section.headline h1 {
	color: #fff;
	position: absolute;
	left: 0;
	top: 159px;
	}

section.headline h3 {
	color: #fff;
	position: absolute;
	left: 0;
	top: 234px;
	}

section.headline img {
	position: absolute;
	top: 88px;
	right: 0;

	}

section.headline img {

	}

section.punch {
	color: #ebebeb;
	}

section.punch .section-wrap {
	height: 320px;
	}

section.punch .content {
	padding: 60px 480px 0px 0px;
	}

body.page-id-16 	section.punch .content,
body.page-id-18 	section.punch .content {
	padding: 60px 0px 0px 0px;
	}


section.punch h1,
section.punch h2,
section.punch h3,
section.punch h4,
section.punch h5 {
	color: #fbaf17;
	}

body.tyonhakijalle section.punch h1,
body.tyonhakijalle section.punch h2,
body.tyonhakijalle section.punch h3,
body.tyonhakijalle section.punch h4,
body.tyonhakijalle section.punch h5 {
	color: #90ed9f;
	}

body.tyonhakijalle section.punch a {color: #90ed9f !important;}
body.tyonhakijalle section.punch a:hover {color: #fff !important;}

section.container {
	background: #e0e0e0;
	margin: 0 auto;
	max-width: 1700px;
	}


section.container .section-wrap {
	width: 1240px;
	min-width: 1240px;
	background: #fff;
	position: relative;
	top: -28px;
	margin-bottom: -28px;
	}


section.container article {
	padding: 0 60px;
	}

body.page-template-page-yhteys-php section.container article {
	/*padding: 60px;*/
	}

.takeaction,
.company {
	position: absolute;
	top: 60px;
	left: 900px;
	width: 280px;
	}
.blogikuvaus {
	position: absolute;
	top: 60px;
	left: 830px;
	width: 280px;
	}

article .takeaction h3,
article .company h3 {
	color: #56d3ff;
	}

.company {

	}

article h3 {
	/*color: #fbaf17;*/
	color: #000;
	font-weight: bold;
	font-size: 21px;
	}

article ul {
	/*
	border-left: 5px solid #ccc;
	padding: 7px 15px 10px 15px;
	margin-bottom: 1.5em;
	font-style: italic;*/
	padding: 7px 15px 10px 20px;
	margin-bottom: 1.5em;
	list-style: disc;
	}

article ul li {
	list-style: disc;
	}

article table {
	width: 67%;
	margin-bottom: 1.5em;
	}

article table img {
	margin: 0 10px 15px 0;
}

.alignright {
	float: right;
	padding: 0;
	margin: 25px 5px 15px 25px;
	}

.alignleft {
	float: left;
	padding: 0;
	margin: 25px 25px 15px 5px;
	}

.multiples,
div.single-post {
	padding: 60px 0;
	width: 780px;
	border-right: 1px solid #ddd;
	}

.multiples.withimage {
	border-right: 0;
	width: auto;
	}

.multiples.withimage .post{
	width: auto;
	padding-right: 240px;
	position: relative;
	}

.multiples.withimage .post .logo {
	position: absolute;
	top: 30px;
	right: 0;
	width: 200px;
	height: 100px;
	}

article .withlogo img{
	max-width: 280px;
	height: auto;
	}

article .logo img{
	max-width: 200px;
	height: auto;
	}

div.multiple-post,
div.single-helper {
	width: 720px;

	}

div.post p {
	font-size: 16px;
	line-height: 24px;
	}

div.multiple-post  {
	border-bottom: 1px solid #ddd;
	padding-bottom: 1.5em;
	margin-bottom: 2.5em;
	}

div.multiple-post p {
	padding-bottom: 0.5em;
	}

div.multiple-post:last-child  {
	border-bottom: none;
	margin-bottom: 0em;
	}

h4.category {
	color: #888;
	position: relative;
	}

h4.category span {
	position: absolute;
	top: 29px;
	left: -25px;
	}


div.parallax {
	background: url(images/main.jpg) 50% 0 no-repeat;
	height: 519px;
	}

/* */

section.intro {
	max-width: 1700px;
	margin: 0 auto;
	}

section.quote {
	background: url(images/quote.jpg) no-repeat;
	max-width: 1700px;
	margin: 0 auto;
	}

section.quote .section-wrap {
	height: 313px;
	overflow: hidden;
	}

section.quote blockquote {
	font-size: 27px;
	line-height: 40px;
	font-style: italic;
	color: #fff;
	margin: 100px 40px 25px 0;
	font-weight: 300;
	}

section.quote p{
	font-size: 21px;
	line-height: 21px;
	font-style: italic;
	color: #fbaf17	;
	margin: 0px 80px 0px 0;
	font-weight: 300;
	text-align: right;
	}


section.clients {
	/*background: #e0e0e0;*/
	background: #fff;
	max-width: 1700px;
	margin: 0 auto;
}

section.clients .section-wrap p {
	font-size: 27px;
	line-height: 1.4em;
	color: #262626;
	padding: 60px 0 20px 0;
	font-weight: 300;
	}

	.customer-grid {
	  text-align: left;
		margin-bottom: 2rem;
	}
	.customer-grid:after {
	  content: "";
	  display: table;
	  clear: both;
	}
	@media (max-width: 991px) {
	  .customer-grid {
	    padding-top: 0 !important;
	  }
	}
	@media (max-width: 767px) {
	  .customer-grid {
	    padding: 0 !important;
	  }
	}
	.customer-grid .customer-grid-item {
	  float: left;
	  display: block;
	  position: relative;
	}
	@media (max-width: 767px) {
	  .customer-grid .customer-grid-item {
	    width: 50%;
	    height: 0;
	    padding-bottom: 33%;
	  }
	}
	@media (min-width: 768px) {
	  .customer-grid .customer-grid-item {
	    width: 12rem;
	    height: 8rem;
	    margin-right: 1rem;
	    margin-bottom: 2rem;
	  }
	}
	.customer-grid .customer-grid-item img {
	  display: block;
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	  -webkit-transform: translate(-50%, -50%);
	}
	.customer-grid .customer-grid-item.image-portrait img {
	  height: 7rem;
	  width: auto;
	}
	@media (max-width: 575px) {
	  .customer-grid .customer-grid-item.image-portrait img {
	    height: 5rem;
	  }
	}
	.customer-grid .customer-grid-item.image-landscape img {
	  height: auto;
	  width: 8rem;
	}
	@media (max-width: 575px) {
	  .customer-grid .customer-grid-item.image-landscape img {
	    width: 6rem;
	  }
	}


/* */

section.introduction {
	background: #e0e0e0;
	max-width: 1700px;
	margin: 0 auto;
	padding-top: 60px;
	padding-bottom: 60px;
}

section.introduction.introduction-special,
section.introduction+section.introduction {
	border-top: 1px solid #ccc;
	background: #f5f5f5;
}

section.introduction h4 {
  font-size: 24px;
	font-weight: 300;
	line-height: 1.4em;
	max-width: 720px;
	padding-bottom: 1em;
}

section.introduction p {
	font-size: 18px;
	line-height: 1.5em;
	padding-top: 0;
	padding-bottom: 20px;
	max-width: 720px;
}

section.introduction ul {
	font-size: 18px;
	padding-top: 0;
	padding-bottom: 20px;
	max-width: 720px;
	font-weight: 300;
	font-style: italic;
	margin-left: 24px;
}

section.introduction ul li {
	margin-bottom: 10px;
	list-style: disc;
}

section.introduction-dark  {
	background: #1f1f1f;
	color: #fff;
	border-bottom: 1px solid #727272;
}

section.introduction-dark .section-wrap {
	padding-left: 40%;
	min-width: 1px;
	width: auto;
	margin-top: 50px;
	margin-bottom: 50px;
	margin-left: 25px;
	margin-right: 25px;
}

section.introduction-dark .section-image {
	background-image:url(guy.jpg);
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	display: block;
	width: 35%;
	background-size: cover;
	background-position: 10% 50%;
}

section.services-introduction a {
	display: inline-block;
	border: 1px solid #727272;
	background: #222;
	padding: 8px 16px;
	text-decoration: none !important;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 14px;
}

section.services-introduction a:hover {
	background: #000;
}

section.services-introduction h2 {
	padding-bottom: 0.5em;
}

section.services-introduction h2+p,
section.services-introduction h2+ul {
	margin-top: 1em;
}

section.services-introduction h3 {
	font-style: italic;
	font-size: 18px;
	padding-bottom: 1.5em;
}

section.services-introduction ul {
	font-size: 16px;
}

section.services-introduction ul li {
	margin-bottom: 5px;
}

section.services-introduction hr+h2 {
	margin-top: 1em;
}

/* */

@media only screen and (max-width: 767px) {


	section.introduction {
		padding-top: 30px;
		padding-bottom: 30px;
	}

	section.introduction h4 {
	  font-size: 16px;
	}

	section.introduction p {
		font-size: 14px;
		padding-bottom: 10px;
	}

	section.introduction ul {
		font-size: 14px;
		padding-bottom: 10px;
	}

	section.introduction ul li {
		margin-bottom: 10px;
	}

	section.introduction-dark .section-wrap {
		padding-left: 0%;
		margin-top: 20px;
		margin-bottom: 20px;
		margin-left: auto;
		margin-right: auto;
	}

	section.introduction-dark .section-image {
		display: none;
	}


	section.services-introduction h2 {
		font-size: 18px !important;
		padding-bottom: 0.5em;
	}

	section.services-introduction h2+p,
	section.services-introduction h2+ul {
		margin-top: 1em;
	}

	section.services-introduction h3 {
		font-size: 16px;
		padding-bottom: 1.0em;
	}

	section.services-introduction ul {
		font-size: 14px;
	}

	section.services-introduction ul li {
		margin-bottom: 5px;
	}

	section.services-introduction hr+h2 {
		margin-top: 1em;
	}

}

/* */

section.threepoints {
	background: #1f1f1f url(images/3points.png) no-repeat;
	max-width: 1700px;
	margin: 0 auto;
	}

section.threepoints .section-wrap {
	height: 531px;
	}

.point {
	display: block;
	position: absolute;
	top: 51px;
	width: 230px;
	color: #fff;
	}

.point img {
	margin-bottom: 26px;
 -webkit-transition: all 0.4s ease;
     -moz-transition: all 0.4s ease;
       -o-transition: all 0.4s ease;
      -ms-transition: all 0.4s ease;
          transition: all 0.4s ease;
	}

.point img:hover {
	transform: scale(0.95) rotate(3deg);
	-ms-transform: scale(0.95) rotate(3deg); /* IE 9 */
	-webkit-transform: scale(0.95) rotate(3deg); /* Safari and Chrome */
	}

.point h2 {
	font-size: 18px;
	}

.point p {
	font-size: 16px;
	line-height: 24px;
	}

.point-content {
	text-align: center;
	}

.point-content a {
	display: inline-block;
  border: 1px solid #727272;
  padding: 8px 16px;
  text-decoration: none !important;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 14px;
}

.point-content a:hover {
	background: #000 !important;
}

.point1 { left: -7px; }
.point2 { left: 366px; }
.point3 { left: 739px; }


.point2 a{ color: #fdd03b !important; }
.point3 a{ color: #90ed9f !important; }
.point2 a:hover{ color: #ffdb65 !important; }
.point3 a:hover{ color: #c6f9cf !important; }

/* */

a.solidea-button {
  display: inline-block;
  border: 2px solid #56d3ff;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 14px;
  text-decoration: none !important;
  padding: 8px 12px;
}

a.solidea-button:hover {
  background: #56d3ff !important;
	color: #fff !important;
}

a.solidea-button.button-larger {
  border-color: #000 !important;
	background: #000 !important;
	font-size: 16px;

}

a.solidea-button.button-larger:hover {
  border-color: #56d3ff !important;
	background: #56d3ff !important;
}

article img {
  max-width: 100%;
  height: auto;
}

button,
a.button,
input[type=submit],
input[type=button],
input[type=reset],
ul.button-nav li a,
div.generic-button a,
.comment-reply-link {
	background: #fff; /* Old browsers */
	background: -moz-linear-gradient(top, #ffffff 0%, #ededed 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#ededed)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #ffffff 0%,#ededed 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #ffffff 0%,#ededed 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, #ffffff 0%,#ededed 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 ); /* IE6-9 */
	background: linear-gradient(top, #ffffff 0%,#ededed 100%); /* W3C */
	border: 1px solid #ccc;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	color: #777;
	cursor: pointer;
	font: normal 12px/20px Arial, Tahoma, Verdana, sans-serif;
	outline: none;
	padding: 10px;
	text-align: center;
	text-decoration: none;
	line-height: 14px;
	margin: 0 !important;
}
button:hover,
a.button:hover,
a.button:focus,
input[type=submit]:hover,
input[type=button]:hover,
input[type=reset]:hover,
ul.button-nav li a:hover,
ul.button-nav li.current a,
div.generic-button a:hover,
.comment-reply-link:hover {
	background: #ededed;
	background: -moz-linear-gradient(top, #ffffff 0%, #e0e0e0 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e0e0e0)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #ffffff 0%,#e0e0e0 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #ffffff 0%,#e0e0e0 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, #ffffff 0%,#e0e0e0 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e0e0e0',GradientType=0 ); /* IE6-9 */
	background: linear-gradient(top, #ffffff 0%,#e0e0e0 100%); /* W3C */
	border: 1px solid #bbb;
	color: #555;
	outline: none;
	text-decoration: none;
}

.ninja-forms-all-fields-wrap {
	width: 50%;
	}

.ninja-forms-required-items {
	font-size: 0.9em;
	padding-bottom: 1em;
	font-style: italic;
	}

.ninja-forms-response-msg p {
	padding-bottom: 1em;
	font-weight: bold;
	}

.ninja-forms-field-error {
	font-size: 0.9em;
	font-style: italic;
	}

.desktop-hide { display: none; }


.fbbox {
	position:relative;
	left:0px;
	display: block;
	margin-bottom: 7px
	}

.linkedin-solidea {
	position: relative;
	top: 3px;
	}

img.suuri {
	width: 100% !important;
	height: auto;
	}

.embed {
	margin-bottom: 2em;
	display: inline-block;
	background: #56d3ff;
	color: #fff !important;
	border: 1px solid #56d3ff;
	padding: 5px 8px;
	text-decoration: none !important;
	font-weight: 700;
	}

.embed:hover {
	background: #fff;
	color: #56d3ff !important;
	}

.embed iframe,
.embed iframe[style] {

	}


@media only screen and (max-width: 1240px) {

.section-wrap {
	width: 780px;
	min-width: 780px;
	}

section.container .section-wrap {
	width: 900px;
	min-width: 900px;
	}

.multiples,
div.single-post {
	padding: 60px 0;
	width: 780px;
	border-right: 0;
	}

.multiples.withimage {
	border-right: 0;
	width: auto;
	}

.multiples.withimage .post{
	width: auto;
	}

div.multiple-post,
div.single-helper {
	width: 780px;

	}

h3 {
	font-size: 18px;
}

.takeaction {
	display: none;
	}

.multiples-company {
	padding-bottom: 30px;
	}

.company {
	position: static;
	top: auto;
	left: auto;
	width: auto;
	padding-bottom: 40px;
	}
.blogikuvaus {
	position: static;
	top: auto;
	left: auto !important;
	width: auto;
	padding-bottom: 40px;
	}

nav ul li a, nav ul li a:link, nav ul li a:visited, nav ul li a:active {
	font-weight: 400;
	font-size: 13px;
	}

nav ul li {
	margin: 0 0 0 18px;
	}

.point2 {left: 275px;}
.point3 {left: 550px;}

.single-quote img {
	width: 780px;
	}

section.clients .section-wrap p { font-size: 21px; }
footer .cta p { font-size: 21px; }

section.punch .content {padding: 60px 160px 0px 0px; font-size: 90%}

section.punch .content h2 {padding-bottom: 0.9em}


section.headline[style],
section.punch[style] { background-position: 69% 0 !important }


section.quote blockquote {
	font-size: 21px;
	line-height: 34px;
	}

footer .contact .contact2 {
	width: 280px;
	}


}

.short-introduction {
	margin-top: 25px;
}

.container {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

@media only screen and (min-width: 768px) {

nav ul ul {
	display:none;
	position:absolute;
	top:100%;
	left:0;
	background:#fff;
	padding:0;
	z-index: 6;
}

nav ul ul li
{
	float:none;
	width:240px;
	margin: 0;
}

nav ul ul li a
{
	display: block;
	border-bottom: 1px solid #ddd;
	padding: 15px !important;
	font-size: 14px !important;
	line-height: 20px !important;
	color: #444 !important;
}

nav ul ul li a:hover
{
	color: #8be7ff !important;
}

nav ul li:hover > ul
{
	display:block
}

/* */

.short-introduction {
	margin-left: 15%;
	margin-bottom: 25px;
	position: absolute;
	top: 47%;
	left: 0;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
}

ul.styled {
	font-size: 14px;
	line-height: 17px;
	color: #ccc;
	position: relative;
	top: -7px;
}

ul.styled li {
	list-style: none;
	float: left;
	display: block;
	width: 50%;
	font-style: italic;
	padding-bottom: 7px;
}

}

@media only screen and (min-width: 768px) and (max-width: 900px) {

h3 {
	font-size: 16px;
}

footer .cta p {
	font-size: 18px;
	}

.section-wrap {
	width: 648px;
	min-width: 648px;
	}

section.container .section-wrap {
	width: 768px;
	min-width: 768px;
	}

.multiples,
div.single-post {
	padding: 60px 0;
	width: 648px;
	border-right: 0;
	}

.multiples.withimage {
	border-right: 0;
	width: auto;
	}

.multiples.withimage .post{
	width: auto;
	}

div.multiple-post,
div.single-helper {
	width: 648px;

	}

.takeaction {
	display: none;
	}

.multiples-company {
	padding-bottom: 30px;
	}

.company {
	position: static;
	top: auto;
	left: auto;
	width: auto;

	}
.blogikuvaus {
	position: static;
	top: auto;
	left: auto;
	width: auto;

	}

nav ul li a, nav ul li a:link, nav ul li a:visited, nav ul li a:active {
	font-weight: 400;
	font-size: 11px;
	}

.point2 {left: 235px;}
.point3 {left: 470px;}

.single-quote img {
	width: 648px;
	}


section.punch .content {padding: 60px 28px 0px 0px;}

section.headline[style],
section.punch[style] { background-position: 69% 0 !important }


footer .contact .contact1 {font-size: 0.9em;width: 175px; left: 210px;}
footer .contact .contact2 {font-size: 0.9em;width: 250px; left: 390px;}

body.home .intro h1 { font-size: 30px; line-height: 40px }
body.home .intro h3 { font-size: 24px; line-height: 30px }

nav ul li {
	margin: 3px 0 0 8px;
	}

nav ul li a{
	font-size: 11px;
	}

section.quote blockquote {
	margin-top: 80px;
	}

}


@media only screen and (max-width: 767px) {

.navigation .alignleft,
.navigation .alignright {
	float: none;
	margin: 0;
}

section {

	}

section.parallax {
	padding: 0 !important;
	}

.mobilehide {
	display: none;
	}

body,
div.post p {
	font-size: 13px;
	line-height: 18px;
	}

h1 {
	font-size: 24px;
	padding-bottom: 1em;
	}

h2 {
	font-size: 21px !important;
	line-height: 24px;
	padding-bottom: 0.3em;
	}

.point h2 {
	font-size: 18px !important;
	}


h3,
h2.ninja-forms-form-title {
	font-size: 18px;
	}

h4 {
	font-size: 16px;
	}

h5{
	font-size: 14px;
	}

h6{
	font-size: 14px;
	}


#wrap,
header,
footer,
section {
	width: 100% !important;
	}


#wrap {
	text-align: center;
	min-height: inherit;
	}

.section-wrap,
section.container .section-wrap {
	width: 300px !important;
	min-width: 300px !important;
	}

.multiples,
div.single-post {
	padding: 0 0 0px 0;
	width: 300px !important;
	border-right: 0;
	}

.multiples.withimage .post{
	padding-right: 0 !important;
	}

.company { padding-bottom: 0 }
.blogikuvaus { padding-bottom: 0 }

div.multiple-post,
div.single-helper {
	width: 300px !important;
	}

section h1,
section h3,
body.home .intro h1,
body.home .intro h3 {
	position: static !important;
	left: auto !important;
	top: auto !important;
	padding: 15px 0 0px 0;
	font-size: 18px;
	line-height: 24px;
	}

section h1 {
	font-size: 24px;
	line-height: 30px;
	}

section h3,
body.home .intro h3 {
	padding: 5px 0 20px 0;
	}

article h3 {
	padding: 5px 0 !important;
	}

body.home .stripe,
body.home .intro a { display: none; }

div.parallax {
	background-image: url(images/mobile.jpg);
	background-size: cover;
	height: auto;
	}

section.threepoints {
	background: #1f1f1f;
	padding: 15px 0 5px 0;
	}

.point-content {
	margin-bottom: 1.5em;
	}

.point-content a {
	font-size: 14px;
	}

.point-content p {
	padding: 0 0 5px 0;
	}

section.threepoints .point {
	position: static;
	top: auto;
	left: auto;
	width: 300px !important;
	text-align: left;
	}

section.threepoints .point *{
	text-align: left !important;
	}

.point p {
	font-size: 14px;
	line-height: 18px;
	}

section.quote {
	background: #333;
	}

section.quote blockquote {
	font-size: 16px;
	line-height: 22px;
	margin: 15px 0px 5px 0;
	}

section.quote p {
	font-size: 16px;
	line-height: 16px;
	font-style: italic;
	color: #fbaf17;
	margin: 0px 0px 0px 0;
	}

section.quote .section-wrap {
	height: auto;
	}

section.clients .section-wrap p {
	font-size: 16px;
	line-height: 1.3em;
	color: #262626;
	padding: 15px 0 15px 0;
	font-weight: 300;
	}

footer { background: #000; text-align: left; }

footer .cta p {
	display: none;
	}

footer .contact {
	height: auto;
	line-height: 1.3em;
	}

footer .contact .contact1,
footer .contact .contact2 {
	position: static;
	top: auto;
	left: auto;
	display: block;
	width: auto;
	}

footer .contact .contact1 p,
footer .contact .contact2 p {
	font-size: 13px;
	line-height: 18px;
	}

footer .contact .contact1 p {
	padding-top: 15px;
	}

body header img {
	width: 80px;
	/*height: 25px;*/
	height: 34px;
	}

header .section-wrap,
body.home header .section-wrap {
	height: 75px !important;
	background: none;
	}

body.home header .section-wrap {
	border-bottom: 1px solid #666;
	}

footer,
footer .section-wrap {
	height: auto !important;
	margin-top: 0 !important;
	}

footer { padding-bottom: 10px; }

#main {
	padding-bottom: 0;
	}

section.headline,
section.headline[style] {
	background: #2c2c2c !important;
	}

body.page-id-18 section.headline,
body.page-id-18 section.headline[style] {
	background: #045a0f !important;
	}

body.page-id-6 section.headline,
body.page-id-6 section.headline[style] {
	background: #3883aa !important;
	}



section.punch,
section.punch[style] {
	background: #000 !important;
	}

section.punch .content {
	padding: 20px 0 15px 0;
	}

section.container {background: #fff !important;}

.section-wrap { height: auto !important; }

section.container .section-wrap {
	top: 0;
	margin-bottom: 0
	}

section.container article {
	padding: 15px 0 0 0;
	}

body.page-template-page-yhteys-php section.container article {
	padding: 30px 0 15px 0;
	}

div.multiple-post:last-child {

	}

.ninja-forms-all-fields-wrap {
	width: 98%;
	}

body.single section.headline { display: none; }
body.category section.headline { display: none; }

div.multiple-post {
	padding-bottom: 1em;
	margin-bottom: 1.5em;
	font-size: 15px;
	line-height: 20px;
	}

.hidden { display: none; }

.desktop-hide {
	display: block;
	}

.companies {
	padding-bottom: 15px;
	}

.companies ul {
	border-left: 5px solid #ccc;
	padding: 7px 15px 10px 15px;
	font-style: italic;
	}

article table { width: 100%; }

#mobilemenu {
	display: block;
	width: 45px;
	height: 45px;
	position: absolute;
	top: 15px;
	right: 0;
	background: #252525 url(images/bars.png) no-repeat;
	background-size: 45px 45px;
	}


body.page-id-18 #mobilemenu {
	background-color: #045a0f !important;
	}

body.page-id-6 #mobilemenu {
	background-color: #3883aa !important;
	}

nav {
	position: absolute;
	top: 60px;
	right: 0;
	z-index: 600;
	display: none;
	}


nav ul {
	list-style: none;
	padding: 0;
	margin: 0;
	}

nav ul li{
	margin: 0;
	float: none;
	}

nav ul li a,
nav ul li a:link,
nav ul li a:visited,
nav ul li a:active {
	font-weight: 400;
	display: block;
	margin: 0;
	line-height: 16px;
	padding: 10px;
	background: #252525;
	color: #d7d7d7;
	text-decoration: none;
	font-size: 16px;
	}


nav ul li a:hover,
nav ul li a:focus {
	color: #fff;
	text-decoration: none;
	}

}


/* */

img.stamp {
	width: 160px;
	height: auto;
	float: right;
	margin: 8px 0 72px 24px;
}

@media only screen and (max-width: 767px) {

	img.stamp {
		width: 80px;
		margin: 8px 0 24px 24px;
	}
}



.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 35px;
    height: 0;
    overflow: hidden;
}

.video-container iframe {
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
}