@charset "utf-8";
/* CSS Document */

/* =Clearfix
--------------------------------------------------------------------------------------------------------*/
.clear { clear: both; }
.clearfix:after { content: "."; display:block; height:0; clear:both; visibility:hidden; }/* ----- clear fix for floats ----- */
.clearfix { display:inline-block; }
* html .clearfix { height:1%; }/* hides clearfix from IE-mac */
.clearfix { display:block; }/* end hide from IE-mac */
.alignleft { float:left; }
.alignright { float:right; }
.aligncenter { margin:auto; display:block; }
.alignnone { clear:both; font-size:0; line-height:0; margin:0; padding:0; border:0; height:0; width:0; }
.centered { text-align:center; font-weight:bold; }
/* End Clearfix
--------------------------------------------------------------------------------------------------------*/


/* =Typography
--------------------------------------------------------------------------------------------------------*/
body { font: 14px "Droid Sans", "Book Antiqua", Palatino, serif; color:#3b3c3c; background: #F6F6F6; z-index:0}
strong { font-weight:bold; }
a, a > * {-webkit-transition: all 0.2s ease 0s; -moz-transition: all 0.2s ease 0s; -o-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; }
p { padding:5px 0px 5px 0; line-height:23px;}
a { color:#184e96; text-decoration:none; }
a:hover { text-decoration:none; color:#f44253; }
/* End Typography
--------------------------------------------------------------------------------------------------------*/

.taustavari {
background:url() #ebebeb repeat;
}

.taustavari2 {
background:url() #F6F6F6 repeat;
}

.topslider{
  position: absolute;
  margin-left: auto;
  margin-right: auto;
  left: 0;
  top: 0;
  width: 100%;
  height:100%;
  max-height:999px;
  overflow: hidden;
	  overflow-x: hidden;
	  overflow-y: hidden;
  z-index: 0;
  text-align: center;
 }

.arrowdown{
	display:block;
	position: relative;
	text-align: center;
	margin-top: 5em;
	margin-bottom: 10em;
}

.referenssit {
text-align: center;
}

#userCoomment {
display:none;
}

 
/* =Headings
--------------------------------------------------------------------------------------------------------*/
h1#logo { display:block; width:500px; height:180px; margin:0 auto; margin-top:10em; margin-bottom:1px; }
h1#logo a { display:block; width:700px; height:180px; text-indent:-9999px; text-decoration:none; background:url(../images/bg-logo2.png) left top no-repeat; margin-left: -105px; margin-top:0px;}
h2 { font-size:38px; font-weight:700; color:#184e96; font-family: 'Oswald', 'Trebuchet MS', Arial, sans-serif; padding:5px 0px 20px 0px; margin:38px 0 5px 0px; text-transform:uppercase; background:url(../images/bg-h2.png) no-repeat right bottom; display:inline-block }
.page-title > * { background:#474747; color:#184e96; display:inline-block;  text-decoration:none;  }
.page-title {background: url(../images/title-arrow.png) no-repeat 40px 100%; padding-bottom:17px; text-align:left; }
h3 { font-size:23px; font-weight:normal; line-height:35px; padding:4px 0px 22px 0; text-align:center; font-family: 'Oswald', 'Trebuchet MS', Arial, sans-serif;}
h6 { font-size:23px; font-weight:normal; line-height:35px; padding:4px 0px 22px 0; text-align:center; color:#fff; font-family: 'Oswald', 'Trebuchet MS', Arial, sans-serif; }
h3 span {color:#184e96; font-style:italic; }
h4 { font-size:16px; font-weight:700; color:#184e96; line-height:20px; padding:14px 0px 13px 0; text-transform:uppercase; font-family: 'Oswald', 'Trebuchet MS', Arial, sans-serif; }
h7 { font-size:16px; font-weight:700; color:#3b3c3c; line-height:20px; padding:14px 0px 13px 0; text-transform:uppercase; font-family: 'Oswald', 'Trebuchet MS', Arial, sans-serif; }
h8 { font-size:22px; font-weight:700; color:#184e96; line-height:20px; margin:0px 10px; padding:14px 0px 13px 0; text-transform:uppercase; font-family: 'Oswald', 'Trebuchet MS', Arial, sans-serif; }
h8:hover {color:#3b3c3c;}
h5 { font-size:14px; font-weight:600; line-height:20px; padding:14px 20px 13px 0; font-family: 'Oswald', 'Trebuchet MS', Arial, sans-serif; text-transform:uppercase}


h21 { font-size:38px; font-weight:700; color:#F6F6F6; font-family: 'Oswald', 'Trebuchet MS', Arial, sans-serif; padding:5px 0px 20px 0px; margin:38px 0 5px 0px; text-transform:uppercase; background:url(../images/bg-h2.png) no-repeat right bottom; display:inline-block }
h10 { font-size:23px; font-weight:normal; line-height:35px; padding:4px 0px 22px 0; text-align:center; font-family: 'Oswald', 'Trebuchet MS', Arial, sans-serif;}
h10 span {color:#F6F6F6; font-style:italic; }
h41 { font-size:16px; font-weight:700; color:#F6F6F6; line-height:20px; padding:14px 0px 13px 0; text-transform:uppercase; font-family: 'Oswald', 'Trebuchet MS', Arial, sans-serif; }
h51{ font-size:14px; font-weight:600; line-height:20px; padding:14px 20px 13px 0; font-family: 'Oswald', 'Trebuchet MS', Arial, sans-serif; text-transform:uppercase}
h61 { font-size:23px; font-weight:normal; line-height:35px; padding:4px 0px 22px 0; text-align:center; color:#fff; font-family: 'Oswald', 'Trebuchet MS', Arial, sans-serif; }
h71 { font-size:16px; font-weight:700; color:#F6F6F6; line-height:20px; padding:14px 0px 13px 0; text-transform:uppercase; font-family: 'Oswald', 'Trebuchet MS', Arial, sans-serif; }

h3.blockquote { padding-left:25px !important; padding-right:25px !important; font-style:italic; font-weight:400; }
h3.blockquote span.name { font-size:14px; color:#184e96; font-style:normal;}
/* End Headings
--------------------------------------------------------------------------------------------------------*/


/* =Buttons and Borders
--------------------------------------------------------------------------------------------------------*/
.border-shade {width:960px; background:url(../images/bg-border-shade.png) no-repeat center 63px; min-height:161px; overflow:visible}
.next-to-button {margin-left:90px; }
p a.button {padding:5px 10px; border:2px solid #184e96; color:#184e96; font-size:14px; font-weight:600; line-height:20px; font-family:'Open Sans', Arial, Helvetica, sans-serif; text-transform:uppercase }
/* End Branding
--------------------------------------------------------------------------------------------------------*/


/* =Main Nav
--------------------------------------------------------------------------------------------------------*/
nav { width:100%; height:45px; position:fixed; z-index:300; background-color:rgba(255, 255, 255, 0.98) !important; background-color:#fff; text-align:center; margin-top:0px; -webkit-box-shadow:0 0 1px rgba(0, 0, 0, 0.1); -moz-box-shadow:0 0 1px rgba(0, 0, 0, 0.1); box-shadow:0 0 1px rgba(0, 0, 0, 0.1); }
nav.dedicated {margin-top:-39px; }
ul#nav { display:block; height:45px; padding-top:10px;}
ul#nav li {  display:inline }
ul#nav li a { color:#242424; font-family: "Open Sans", Arial, Helvetica, sans-serif; font-size:11px; font-weight:600; letter-spacing:1px; text-decoration:none; text-transform:uppercase; display:inline-block; padding:5px 15px 5px 13px;  margin:0px; border-right:1px solid #ededed;}
ul#nav li a:hover, ul#nav li a.active { color:#184e96; }
ul#nav li.active a { color:#184e96; }
ul#nav li a.last { border-right:0px; }
/* End Main Nav
--------------------------------------------------------------------------------------------------------*/




/* =Social
--------------------------------------------------------------------------------------------------------*/
ul.social { margin-top:10px; margin-bottom:0px; display:none }
.social li { display:inline-block; border-left:1px solid #ededed; }
.social li a { margin:4px 15px 4px 15px; display:block; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; }
.social li.first {  border-left:0px solid #ededed; }
ul.social a {padding:0px 10px;}
ul.social .facebook a { text-indent:-9000px; text-decoration:none; height:16px; background:url(../images/buttons/bg-facebook.png) no-repeat right -16px; }
ul.social .facebook a:hover { background:url(../images/buttons/bg-facebook.png) no-repeat right 0px; }
ul.social .dribble a { text-indent:-9000px; text-decoration:none; height:16px; background:url(../images/buttons/bg-dribble.png) no-repeat right -16px; }
ul.social .dribble a:hover { background:url(../images/buttons/bg-dribble.png) no-repeat right 0px; }
ul.social .flickr a { text-indent:-9000px; text-decoration:none; height:16px; background:url(../images/buttons/bg-flickr.png) no-repeat right -16px; }
ul.social .flickr a:hover { background:url(../images/buttons/bg-flickr.png) no-repeat right 0px; }
ul.social .vimeo a { text-indent:-9000px; text-decoration:none; height:16px; background:url(../images/buttons/bg-vimeo.png) no-repeat right -16px; }
ul.social .vimeo a:hover { background:url(../images/buttons/bg-vimeo.png) no-repeat right 0px; }
ul.social .google a { text-indent:-9000px; text-decoration:none; height:16px; background:url(../images/buttons/bg-google.png) no-repeat right -16px; }
ul.social .google a:hover { background:url(../images/buttons/bg-google.png) no-repeat right 0px; }
ul.social .skype a { text-indent:-9000px; text-decoration:none; height:16px; background:url(../images/buttons/bg-skype.png) no-repeat right -16px; }
ul.social .skype a:hover { background:url(../images/buttons/bg-skype.png) no-repeat right 0px; }
ul.social .email a { text-indent:-9000px; text-decoration:none; height:16px; background:url(../images/buttons/bg-email.png) no-repeat right -16px; }
ul.social .email a:hover { background:url(../images/buttons/bg-email.png) no-repeat right 0px; }
ul.social .twitter a { text-indent:-9000px; text-decoration:none; height:16px; background:url(../images/buttons/bg-twitter.png) no-repeat right -16px; }
ul.social .twitter a:hover { background:url(../images/buttons/bg-twitter.png) no-repeat right 0px; }
/* End Social
--------------------------------------------------------------------------------------------------------*/


/* =Main Content
--------------------------------------------------------------------------------------------------------*/
#wrapper { margin-top:6px; width:100%; height:29px; position:absolute; z-index:29;  background:url(../images/bg-shade.png) repeat-x; }
a.ribbon {width:62px; height:90px; display:block; text-indent:-9999px; right:30px; position:fixed; margin-top:-20px; background:url(../images/bg-ribbon.png) no-repeat; cursor:pointer; z-index:301;}	
.container { padding:0px; width:960px; position:relative;  margin:0 auto;}
.ancor { padding-top:80px; position:relative; margin-top:0px; padding-bottom:60px;}
.col1-1 { width:940px; margin:0px 10px 60px; }
.col1-2 { width:460px; margin:0px 10px; float:left; }
.col1-2-1 { width:460px; margin:0px 10px; float:right; }
.col1-3 { width:300px; margin:0px 10px; float:left; }
.col2-3 { width:620px; margin:0px 10px; float:left; }
.col1-4 { width:220px; margin:0px 10px; float:left; }
.col3-4 { width:700px; margin:0px 10px; float:left; }
.col1-6 { width:140px; margin:0px 10px; float:left; }
.col1-9 { width:300px; margin:0px 10px; float:left; }
.col1-10 { width:940px; margin:0px 10px 350px; }
.col1-11 { width:940px; margin:0px 10px 200px; }
.padding-top { padding-top:30px; }
.break { height:10px; position:relative; }
.big-break { height:19px; position:relative; }
.huge-break { height:39px; position:relative; }
.icon {padding-top:19px; }
.images { display:block; margin:10px 0 10px 0; position:relative;  -webkit-transition: all 0.2s ease 0s; -moz-transition: all 0.2s ease 0s; -o-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; }
.slide {opacity:0; }
/* =End Main Content
--------------------------------------------------------------------------------------------------------*/


/* .two-col-special {
    margin: 0;
    padding: 0;
}

.two-col-special li {
    display: inline-block;
    width: 45%;
    margin: 0;
    padding: 0;

}
.two-col-special li:before {
    padding: 5px;
    margin-right: 5px; 
    color: orange;
    background-color: white; 
    display: inline-block;
}

.two-col-special li a:hover { color:#3f6fa0; 
  -webkit-transition: 0.2s ease;
  -moz-transition: 0.2s ease;
  -o-transition: 0.2s ease;
  transition: 0.2s ease;
  background-color: #c7c7c7;
  color: #ffffff;
} 
.two-col-special li a.selected { color:#fff; cursor:default; background-color: #184e96; } */




/* =Separator2
--------------------------------------------------------------------------------------------------------*/
.separator2 { height:800px; position:relative; width:100%; margin:57px 0 50px 0; text-align:center; }
.separator2.map {margin:37px 0 58px 0; }
.separator2.logos {margin:34px 0 56px 0; }
.bg-image2 { -webkit-background-size: cover !important; -moz-background-size: cover !important; background-size: cover !important; margin: 0 auto; padding: 0; position: absolute; z-index: 200;	width: 100%; height: 800px; }
.bg1 {background: url(../images/slider/tausta1.jpg) repeat center #184e96; }
.bg2 {background: url(../images/bg2.jpg) repeat center #184e96; }	
.bg3 {background: url(../images/slider/tausta2.jpg) repeat center #184e96; }
.separator2 h4 a {color:#184e96; }
.separator2 h4 a:hover {color:#f44253; }	
/* =End Separator
--------------------------------------------------------------------------------------------------------*/




/* =Single Work
--------------------------------------------------------------------------------------------------------*/
/*.single-work {width:100%; height:100%; position:fixed; background-color:rgba(36, 36, 36, 0.95) !important; background-color:#242424; z-index:400;  }
.single-work .content {top:50%; margin-top:-210px; height:400px; position:absolute }
.single-work .container { position:static;}*/
.close {width:52px; height:52px; background:url(../images/bg-close2.png) no-repeat; text-indent:-9999px; right:10px; margin-top:25px; position:absolute;}
.dedicated-page {padding-top:100px; }
.videos {width:450px !important; height:263px !important; border:none; margin:0px; display:block; z-index:8; }
.videos.single-work {width:610px !important; height:353px !important;  }
/* =End Single Work
--------------------------------------------------------------------------------------------------------*/


/* =Twitter
--------------------------------------------------------------------------------------------------------*/
#twitter_update_list { margin:83px 0 2px 0; }
ul.jta-tweet-list li { background:url(../images/bg-twitter.png) center 5px no-repeat; display:block; min-height:100px; font-size:23px; font-weight:normal; line-height:35px; padding:44px 0px 0px 0; color:#242424; text-align:center }
ul.jta-tweet-list li a.jta-tweet-link { color:#242424; text-decoration:none; font-size:23px !important; font-weight:400; text-transform:none; -webkit-transition: all 0.2s ease 0s; -moz-transition: all 0.2s ease 0s; -o-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; margin-right:4px; line-height:20px; }
ul.jta-tweet-list li a.jta-tweet-link:hover { text-decoration:none; color:#f44253; }
ul.jta-tweet-list li a.jta-tweet-timestamp-link { font-size:23px !important; color:#242424; text-decoration:none; -webkit-transition: all 0.2s ease 0s; -moz-transition: all 0.2s ease 0s; -o-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; text-transform:uppercase; display:block; cursor:default }
ul.jta-tweet-list li a.jta-tweet-timestamp-link:hover { text-decoration:none; color:#242424; }
span.jta-tweet-twitter-bird-icon, span.jta-tweet-twitter-bird-icon:hover { display:none }
a.jta-tweet-a { color:#242424; text-decoration:none; }
a.jta-tweet-a:hover { color:#f44253; }

.sidebar-feed #twitter_update_list { margin:0px 0 0px 0; }
.sidebar-feed ul.jta-tweet-list { margin-bottom:0px; }
.sidebar-feed ul.jta-tweet-list li { display:block; padding:0px 0 !important; padding-right:10px; margin-right:0px; line-height:20px !important; font: 14px "Palatino Linotype", "Book Antiqua", Palatino, serif; color:#c7c7c7; text-align:left; min-height:0px; background:none }
.sidebar-feed ul.jta-tweet-list li a.jta-tweet-link { color:#fff; text-decoration:none; font-size:12px !important; font-weight:400; text-transform:none; -webkit-transition: all 0.2s ease 0s; -moz-transition: all 0.2s ease 0s; -o-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; margin-right:4px; line-height:20px; }
.sidebar-feed ul.jta-tweet-list li a.jta-tweet-link:hover { text-decoration:none; color:#f12937; }
.sidebar-feed ul.jta-tweet-list li a.jta-tweet-timestamp-link { font-size:11px !important; color:#888; text-decoration:none; -webkit-transition: all 0.2s ease 0s; -moz-transition: all 0.2s ease 0s; -o-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; text-transform:uppercase; line-height:20px; padding-left:0px; display:block }
.sidebar-feed ul.jta-tweet-list li a.jta-tweet-timestamp-link:hover { text-decoration:none; color:#888; }
.sidebar-feed span.jta-tweet-twitter-bird-icon, span.jta-tweet-twitter-bird-icon:hover { display:none }
.sidebar-feed a.jta-tweet-a {color:#fff; text-decoration:none; -webkit-transition: color 0.2s ease 0s; -moz-transition: color 0.2s ease 0s; -o-transition: color 0.2s ease 0s; transition: color 0.2s ease 0s; }
.sidebar-feed a.jta-tweet-a:hover { text-decoration:none; color:#f12937; }
.sidebar-feed .jta-clear {height:5px; }
/* End Twitter
--------------------------------------------------------------------------------------------------------*/


/* =Googlemaps
--------------------------------------------------------------------------------------------------------*/
#googlemaps {margin:0; width:100%; height:400px; position:relative; z-index:200; border:0}
#googlemaps:before, #googlemaps:after {	background: none; content: ''; left: 0;	position: absolute;	top: 0;	width: 100%; }
#googlemaps:after {	bottom: 0; top: auto; }
/* End Googlemaps
--------------------------------------------------------------------------------------------------------*/


/* =Price Tables
--------------------------------------------------------------------------------------------------------*/
.table-standard { border: 3px solid #fff; height:auto; width:184px; float:left; text-align:center; padding:25px 15px 0px 15px; margin-right:5px; margin-top:49px;  }
.table-featured { height:auto; width:198px; float:left; text-align:center; padding:25px 30px 10px 30px; margin-right:5px; margin-top:20px; margin-bottom:11px; border: 3px solid #fff;}
.last-table { margin-right:0px !important; }
.table-standard h3 { padding:0px; margin-bottom:5px; color:#fff; }
.table-featured h3 { padding:15px 0px 0 0; text-transform:uppercase; margin-bottom:5px; color:#fff; }
.table-standard ul { padding:18px 0 0px 0; }
.table-featured ul { padding:18px 0 15px 0; }
.table-standard ul li, .table-featured ul li { line-height:20px; padding:4px 0px 6px 0px; width:auto; border-bottom:1px solid #5d5d5d; }
.table-standard ul li.first, .table-featured ul li.first { border-top:1px solid #5d5d5d; }
.table-standard p a.button, .table-featured p a.button { display:block; text-transform:uppercase; cursor:pointer; position:relative; padding:8px 13px 8px 13px !important; margin:19px 0 18px 0;  font-weight:700; font-family:'Open Sans', Arial, Helvetica, sans-serif; color:#242424; text-align:center; font-size:12px; line-height:20px; -webkit-transition: all 0.1s ease-in-out 0s; background:url(../images/bg-submit.png) center no-repeat; width:auto !important; -moz-transition: all 0.2s ease 0s; -o-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; border:0px; }
.table-standard p a.button:hover, .table-featured p a.button:hover {  }
.specification {font-weight:700; font-family:'Open Sans', Arial, Helvetica, sans-serif; font-size:11px; text-transform:uppercase }
/* =Price Tables
--------------------------------------------------------------------------------------------------------*/


/* =jCarousel
--------------------------------------------------------------------------------------------------------*/
#carousel-about, #carousel-blog { margin-top:17px !important; }
.jcarousel-skin-tango .jcarousel-direction-rtl { direction: rtl; }
.jcarousel-skin-tango .jcarousel-container-horizontal { width: 960px; padding:17px 0 22px 0; }
.jcarousel-clip { overflow: hidden; }
.jcarousel-item-placeholder { background: #fff; color: #000; }
.jcarousel-next-horizontal { position: absolute; top: -11px; right: -36px; cursor: pointer; border: 2px solid #fff; -webkit-transition: all 0.2s ease 0s; -moz-transition: all 0.2s ease 0s; -o-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; background:url(../images/buttons/bg-arrow-right.png) center no-repeat; text-indent:-9999px; display:inline-block; width:22px; height:21px; }
.jcarousel-next-horizontal:hover, .jcarousel-next-horizontal:focus { border:2px solid #fff;}
.jcarousel-next-horizontal:active { border:2px solid #fff; }
.jcarousel-next-disabled-horizontal, .jcarousel-next-disabled-horizontal:hover, .jcarousel-next-disabled-horizontal:focus, .jcarousel-next-disabled-horizontal:active { cursor: default; border: 2px solid #fff; background:url(../images/buttons/bg-arrow-right.png) center no-repeat; }
.jcarousel-prev-horizontal { position: absolute; top: -11px; left: -36px; cursor: pointer; border: 2px solid #fff; -webkit-transition: all 0.2s ease 0s; -moz-transition: all 0.2s ease 0s; -o-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; background:url(../images/buttons/bg-arrow-left.png) center no-repeat; text-indent:-9999px; display:inline-block; width:22px; height:21px; }
.jcarousel-prev-horizontal:hover, .jcarousel-prev-horizontal:focus { border:2px solid #fff;}
.jcarousel-prev-horizontal:active { border:2px solid #fff; }
.jcarousel-prev-disabled-horizontal, .jcarousel-prev-disabled-horizontal:hover, .jcarousel-prev-disabled-horizontal:focus, .jcarousel-prev-disabled-horizontal:active { cursor: default; border:2px solid #fff; background:url(../images/buttons/bg-arrow-left.png) center no-repeat;  }
.jcarousel-skin-tango2 .jcarousel-direction-rtl { direction: rtl; }
.jcarousel-skin-tango2 .jcarousel-container-horizontal { width: 960px; padding:10px 0 10px 0; float:left }
.jcarousel-skin-tango2 .jcarousel-next-horizontal, .jcarousel-skin-tango2 .jcarousel-prev-horizontal { top: 58px; }
.logo { padding:160px 0px; }
/* End jCarousel
--------------------------------------------------------------------------------------------------------*/


/* =Image Hover
--------------------------------------------------------------------------------------------------------*/
.images img {width:100%; display: block; z-index:9 }
.images .img-wrap {-webkit-box-shadow:0 0 5px rgba(0, 0, 0, 0.6); -moz-box-shadow:0 0 5px rgba(0, 0, 0, 0.6); box-shadow:0 0 5px rgba(0, 0, 0, 0.6); padding:2px; background:#fff; }
.images2 {margin-bottom: 15px;}
.images2 img {width:100px; height:142px; display: inline-block; z-index:9;}
.images2 .img-wrap2 {display:inline-block; width:101px; height:143px; -webkit-box-shadow:0 0 1px rgba(0, 0, 0, 0.6); -moz-box-shadow:0 0 1px rgba(0, 0, 0, 0.6); box-shadow:0 0 1px rgba(0, 0, 0, 0.6); padding:2px; background:#fff; margin-bottom: 30px;}
.infos {width:100%; height:100%; top:0; left:0; border:0; padding:0; display:inline-block; z-index:10; opacity:0; position:absolute; }
.infos2 {width:50%; height:50%; top:0; left:0; border:0; padding:0; display:inline-block; z-index:10; opacity:0; position:absolute; }
a .infos p { color:#184e96; text-decoration:none; -webkit-transition: color 0.2s ease 0s; -moz-transition: color 0.2s ease 0s; -o-transition: color 0.2s ease 0s; transition: color 0.2s ease 0s; padding-right:0px; margin-left:82px; font-family:'Open Sans', Arial, Helvetica, sans-serif; line-height:15px; font-size:11px;}
a .infos h5 { margin-top:25px; line-height:20px; padding:0px 30px 3px 0px; display:inline-block; margin-left:82px; font-size:14px; color:#184e96;}
a .infos .arrow {background:url(../images/bg-project-arrow.png) no-repeat center center #fff; width:27px; height:23px; display:block; bottom:30px; left:30px; position:absolute }
.video-icon {background:url(../images/bg-video-icon.png) no-repeat; left:30px; top:30px; height:36px; width:36px; position:absolute; }
.link-icon {background:url(../images/bg-link-icon.png) no-repeat; left:30px; top:30px; height:36px; width:36px; position:absolute; }
.zoom-icon {background:url(../images/bg-zoom-icon.png) no-repeat; left:30px; top:30px; height:36px; width:36px; position:absolute; }
/* End Image Hover
--------------------------------------------------------------------------------------------------------*/


/* =Lists
--------------------------------------------------------------------------------------------------------*/
ul.list { display:block; position:relative; padding:5px 20px 5px 0; }
ul.list li { line-height:23px; width:auto; padding-left:20px; }
ul.float li { margin-right:15px; }
ul.bullet li { background:url(../images/list-bullet.png) no-repeat 7px 11px; }
ul.check li { background:url(../images/list-check.png) no-repeat 1px 7px; }
ul.list li a { text-decoration:none; color:#c7c7c7; }
ul.list li a:hover, ul.normal li a:hover { color:#f12937; }
/* =End Lists
--------------------------------------------------------------------------------------------------------*/


/* =Footer
--------------------------------------------------------------------------------------------------------*/
#footer { width:100%; height:110px; margin:0px 0px 0 0px; padding:26px 0 0 0px;  font-family: 'Oswald', 'Trebuchet MS', Arial, sans-serif;}
#footer p, #footer p a { color:#3b3c3c; }
#footer p span.top { font-size:20px; color:#3b3c3c; line-height:34px; background:none; border-bottom:0px; font-family: 'Oswald', 'Trebuchet MS', Arial, sans-serif;}
#footer p a:hover {color:#f12937; }
/* End Footer
--------------------------------------------------------------------------------------------------------*/


/* =Backtotop Navi
--------------------------------------------------------------------------------------------------------*/
#backtotop { height:auto; position:fixed; right:30px; bottom:30px; display:none; z-index:30;}
#backtotop ul { padding:15px 0px; }
#backtotop ul li a { background:url(../images/bg-backtotop.png) no-repeat;-webkit-transition: all 0.2s ease 0s; -moz-transition: all 0.2s ease 0s; -o-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; display:block; width:53px; height:53px; float:right; right:10px; text-indent:-9000px;}
#backtotop ul li a:hover { bottom:20px;  }
/* End Backtotop Navi
--------------------------------------------------------------------------------------------------------*/


/* =Isotope
--------------------------------------------------------------------------------------------------------*/
.isotope-item { z-index: 2; }
.isotope-hidden.isotope-item { pointer-events: none; z-index: 1; }
/**** Isotope CSS3 transitions ****/
.isotope, .isotope .isotope-item { -webkit-transition-duration: 0.8s; -moz-transition-duration: 0.8s; -ms-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; }
.isotope { -webkit-transition-property: height, width; -moz-transition-property: height, width; -ms-transition-property: height, width; -o-transition-property: height, width; transition-property: height, width; }
.isotope .isotope-item { -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property:    -moz-transform, opacity; -ms-transition-property:     -ms-transform, opacity; -o-transition-property:         top, left, opacity; transition-property:         transform, opacity; }
/**** disabling Isotope CSS3 transitions ****/
.isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition { -webkit-transition-duration: 0s; -moz-transition-duration: 0s; -ms-transition-duration: 0s; -o-transition-duration: 0s; transition-duration: 0s; }
/* End: Recommended Isotope styles */

/* disable CSS transitions for containers with infinite scrolling*/
.isotope.infinite-scrolling { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; }

#options { min-height: 30px; font-family: 'Oswald', 'Trebuchet MS', Arial, sans-serif; text-transform:uppercase;}
#options li { font-size:20px; font-weight:normal; color:#3b3c3c; line-height:30px; text-align:center }
#options li a {   display: inline-block;
  text-decoration: none;
  height: 20px;
  width: 120px;
  line-height: 20px;
  color: #3b3c3c;
  font-size: .8em;
  padding: .5em;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
  background: #ffffff;
  cursor: pointer;
  -webkit-backface-visibility: hidden;
  border:1px solid #fff;
   }
#options li a:hover { color:#3f6fa0; 
  -webkit-transition: 0.2s ease;
  -moz-transition: 0.2s ease;
  -o-transition: 0.2s ease;
  transition: 0.2s ease;
  background-color: #c7c7c7;
  color: #ffffff;
} 
#options li a.selected { color:#fff; cursor:default; background-color: #184e96; }

.image-grid {width:960px;}

.select-menu {display:inline-block; margin:22px 20px 0 0; margin-left:-20px !important; }

.description {background:#fff; border-bottom:1px solid #e7e7e7; margin-top:-9px; padding:7px 20px 8px 10px; z-index:5;}




@media screen and (max-width : 767px){
#options li a {   display: block; position:relative; margin:0 auto; }
}

/* End Isotope
--------------------------------------------------------------------------------------------------------*/


.preloader { background:url(../images/ajax-loader.gif) center center no-repeat #ffffff; }




/* Standard 960 or larger (browsers) */
@media only screen and (min-width: 960px) {
.bg3 {background-attachment: fixed !important;}	
.bg2 {background-attachment: fixed !important;}	
.bg1 {background-attachment: fixed !important;}

}


/* Smaller than 1060 (outside container carousel nav) */
@media only screen and (max-width: 1059px) {
.jcarousel-skin-tango2 .jcarousel-next-horizontal {right:10px; top:-8px; }
.jcarousel-skin-tango2 .jcarousel-prev-horizontal {left:10px; top:-8px; }
}

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 959px) {

}

/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {



.container { padding:0px; width:768px; position:relative; }
.col1-1 { width:748px; margin:0px 10px; }
.col1-10 { width:748px; margin:0px 10px; }
.col1-11 { width:748px; margin:0px 10px; }
.col1-2 { width:364px; margin:0px 10px; float:left; }
.col1-3 { width:236px; margin:0px 10px; float:left; }
.col2-3 { width:492px; margin:0px 10px; float:left; }
.col1-4 { width:172px; margin:0px 10px; float:left; }
.col3-4 { width:556px; margin:0px 10px; float:left; }
.col1-6 { width:108px; margin:0px 10px; float:left; }
.col1-9 { width:100px; margin:0px 10px; float:left; }

.referenssit{

}



.taustavari2 {
background-color: #F6F6F6;
height: 900px;
}

h8 { margin-top: 200px; }


a.ribbon { display:none; }
nav { margin-top:0px; }
#nav-open {display:none; }

.border-shade {width:768px; background:url(../images/bg-border-shade_748px.png) no-repeat center 63px;}

.table-standard { border:2px solid #fff; width:159px; padding:25px 10px 0px 10px;  }
.table-featured { width:160px; padding:25px 10px 10px 10px; border:2px solid #fff;}

.jcarousel-skin-tango .jcarousel-container-horizontal { width: 768px; }
.jcarousel-skin-tango .jcarousel-item {width:172px; text-align:center; }
.jcarousel-skin-tango2 .jcarousel-container-horizontal { width: 768px; }

#contact input, select { float: left; width: 430px !important; }
#contact textarea {float:left; width: 350px; height: 200px; margin-bottom:4px; resize: none;}
#contact input.submit {float: left; width:80px !important; }

.logos .col1-6 {width:236px; }
.logo {padding:80px 0 20px 0; }

.videos {width:354px !important; height:208px !important; }
.videos.blog {width:226px !important; height:128px !important; }

.search { width:128px; }
}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
h1#logo { display:block; width:400px; height:180px; margin:0 auto; margin-top:30px; margin-bottom:13px; }
h1#logo a { display:block; width:400px; height:180px; text-indent:-9999px; text-decoration:none; background:url(../images/bg-logo23.png) left top no-repeat; margin-left: 0px; margin-top:70px; }

}

@media only screen and (min-width: 500px){
ul#nav_mobile {display:none;}

toggle {display:none;}
}

@media only screen and (max-width: 499px){
ul#nav_mobile {
	display:inline-block;
	padding-top: 15px;
	position: relative; 
	color:#184e96; 
	font-family: "Droid Sans", Arial, Helvetica, sans-serif; 
	font-size:13px; 
	font-weight:600; 
	line-height:13px; 
	text-decoration:none; 
	text-transform:uppercase; 
	background:none; 
	border:0px; 
	text-align:center; 
	width:100% !important;
}

ul#nav {display:none;}
}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {
	
	

.flexslider {
display:none;
}

.taustavari2 {
background:url() #184e96 repeat;
height: 600px;
}

.referenssit {
text-align: center;
}

h1#logo { display:block; width:400px; height:180px; margin:0 auto; margin-top:30px; margin-bottom:13px; }
h1#logo a { display:block; width:400px; height:180px; text-indent:-9999px; text-decoration:none; background:url(../images/bg-logo23.png) left top no-repeat; margin-top:10px; }

.container { padding:0px; width:440px; position:relative; overflow:visible !important}
.col1-3, .col2-3, .col1-2, .col3-4 { width:420px; margin:0px 10px; float:left; }
.col1-1 {width:420px; margin:0px 10px; }
.col1-10 {width:420px; margin:0px 10px; }
.col1-11 {width:420px; margin:0px 10px; }
.col1-4 { width:200px; margin:0px 10px; float:left; }
.videocentered {margin-left: -95px;}

a.ribbon { display:none; }
nav { margin-top:0px; }

.border-shade {width:440px; background:none;}
.slide {opacity:1; }

.table-standard { border:2px solid #fff; width:176px; padding:25px 10px 0px 10px; margin-right:20px; margin-top:70px; margin-bottom:11px; }
.table-featured { width:176px; padding:25px 10px 0px 10px; border:2px solid #fff; margin-right:20px; margin-top:70px; margin-bottom:11px; }
.responsive-table {margin-right:0px; }
.table-featured h3 {padding-top:0px; }
.table-featured ul {padding-bottom:0px; }

.jcarousel-skin-tango2 .jcarousel-container-horizontal { width: 440px; }
.jcarousel-skin-tango2 .jcarousel-item {width:200px; }
#carousel-blog .col1-3 {width:420px !important; }


nav {position:absolute }
#nav-open {display:none; }


.element {width:200px !important; display:block; }
.responsive-folio { overflow:visible !important }

#contact input, select { float: left; width: 430px !important; }
#contact textarea {float:left; width: 350px; height: 200px; margin-bottom:4px; resize: none;}
#contact input.submit {float: left; width:80px !important; }
aside {display:none; }


.option-set {margin-left:10px !important; margin-top:-10px !important; float:none}

.logos .col1-6 {width:200px; }
.logo {padding:48px 0 0px 0; }

.single-work .content {margin-top:60px; top:0; height:auto }

#googlemaps {height:240px; }
.separator.map {height:240px; }

.videos, .videos.blog {width:410px !important; height:230px !important; }
}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 499px) {

h1#logo { display:block; width:400px; height:180px; margin:0 auto; margin-top:100px; margin-bottom:200px; }
h1#logo a { display:block; width:400px; height:180px; text-indent:-9999px; text-decoration:none; background:url(../images/bg-logo23.png) left top no-repeat; margin-left: -30px; margin-top:10px; }

.container { padding:0px; width:320px; position:relative; overflow:hidden !important}
.col1-3, .col2-3, .col1-2, .col1-4, .col3-4 { width:300px; margin:0px 10px; float:left; }
.col1-1 {width:300px; margin:0px 10px; }
.col1-10 {width:300px; margin:0px 10px; }
.col1-11 {width:300px; margin:0px 10px; margin-top: -270px; }
.videocentered {margin-left: -85px;}
.flexslider {
display:none;
}
.taustavari2 {
background:url() #184e96 repeat;
height: 600px;
}

.referenssit {
text-align: center;
}


a.ribbon { display:none; }
nav { margin-top:0px; }

.border-shade {width:320px; background:none;}
.slide {opacity:1; }

.table-standard { border:2px solid #fff; width:236px; padding:25px 30px 0px 30px; margin-right:20px; margin-top:70px; margin-bottom:11px; }
.table-featured { width:236px; padding:25px 30px 0px 30px; border:2px solid #fff; margin-right:20px; margin-top:70px; margin-bottom:11px;}
.responsive-table {margin-right:0px; }
.table-featured h3 {padding-top:0px; }
.table-featured ul {padding-bottom:0px; }

.jcarousel-skin-tango2 .jcarousel-container-horizontal { width: 320px; }
.jcarousel-skin-tango2 .jcarousel-item {width:140px; }
#carousel-blog .col1-3 {width:300px !important; }


.element {width:300px; display:block; }
.responsive-folio { overflow:visible !important }
.images .title, .images .subtitle {z-index: 0; display:none !important; }

#options { margin-right:10px; margin-left:0px; margin-top:20px;}
.responsive {display:block; float:none; height:160px }
#options li {margin-bottom:5px; }

#contact input, textarea { width: 272px !important; margin: 0px 0px 0px 0; float:none !important; display:block; margin-bottom:20px}
#contact textarea { width: 272px !important; margin-top:20px; }
#contactform .alignleft {float:none; padding-right:0 !important;}
#contact input.submit {width:300px !important; height: 80px; margin-top: 20px;}
aside {display:none; }

.blog-stats {float:none; width:auto; text-align:left; }
.blog-content { margin-left:0px; clear:both }
.blog-icon {float:left; }
.blog-stats p {float:left; margin-left:15px; padding-top:3px; margin-bottom:1px; }
.blog-stats .clear {clear:none; }

.option-set {margin-left:10px !important; margin-top:-10px !important; float:none}

.logos .col1-6 {width:140px; }
.logo {padding:48px 0 0px 0; }

.single-work .content {margin-top:60px; top:0; height:auto }

#googlemaps {height:240px; }
.separator.map {height:240px; }
.separator h4 a {display:none }

.videos {width:290px !important; height:170px !important; }
}

.ghost-btn {
  font-family: "Arial";
  display: inline-block;
  text-decoration: none;
  border: 1px solid #3f6fa0;
  height: 36px;
  line-height: 36px;
  color: #3f6fa0;
  -webkit-border-radius: 5px;
  -webkit-background-clip: padding-box;
  -moz-border-radius: 5px;
  -moz-background-clip: padding;
  border-radius: 5px;
  background-clip: padding-box;
  font-size: 1em;
  padding: .5em 1.5em;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
  background: #ffffff;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  cursor: pointer;
  zoom: 1;
  -webkit-backface-visibility: hidden;
  position: relative;
}
.ghost-btn:hover {
  -webkit-transition: 0.2s ease;
  -moz-transition: 0.2s ease;
  -o-transition: 0.2s ease;
  transition: 0.2s ease;
  background-color: #3f6fa0;
  color: #ffffff;
}
.ghost-btn:focus {
  outline: none;
}


@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation : portrait) { 
    /* iPhone 6 Portrait */
}


@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation : landscape) { 
    /* iPhone 6 landscape */
}


@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (orientation : portrait) { 
    /* iPhone 6+ Portrait */
h1#logo { display:block; width:414px; height:180px; margin:0 auto; margin-top:30px; margin-bottom:13px; }
h1#logo a { display:block; width:414px; height:180px; text-indent:-9999px; text-decoration:none; background:url(../images/bg-logo23.png) left top no-repeat; margin-left: -28px; margin-top:70px; }
#options li a {   display: block; position:relative; margin:0 auto; }

.container { padding:0px; width:320px; position:relative; overflow:hidden !important}
.col1-3, .col2-3, .col1-2, .col1-4, .col3-4 { width:300px; margin:0px 10px; float:left; }
.col1-1 {width:300px; margin:0px 10px; }
.col1-10 {width:300px; margin:0px 10px; }
.col1-11 {width:300px; margin:0px 10px; margin-top: -50px; }
.videocentered {margin-left: -85px;}
.flexslider {
display:none;
}
.taustavari2 {
background:url() #184e96 repeat;
height: 620px;
}

.referenssit {
text-align: center;
}

}


/* :D:D:D */

.toggle_hide{
	margin-top:10px;
    display:none;
	background:url() #fff repeat;
}

.toggle_hide li {
	margin-bottom:3px;
}