@charset "UTF-8";
/*ymparisto.fi*/
/*Header*/
/*Top nav*/
/*Extra menu*/
/*Left navi*/
/*TODO pitäskö tämä poistaa?*/
/*Header quick search*/
/*Footer*/
body {
  margin: auto;
  background-color: #fff; }

div {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

/*Responsive images*/
.content-main img,
.sidebar img {
  max-width: 100% !important; }

/*Header*/
.header-top {
  border: 0; }

/*Header background*/
.header-middle {
  background-color: #fff;
  background: #fff;
  min-height: 105px;
  /*sinivihreä taustakuva pois ja väri tilalle*/
  /*Quick search*/ }
  .header-middle .left {
    background: #fff; }
    .header-middle .left .image.logo {
      left: 10px; }
  .header-middle .image-bg .title {
    position: absolute;
    top: 30%;
    font-size: 14px;
    color: #000;
    left: 25%; }
  .header-middle .right {
    right: 0; }
    .header-middle .right .search {
      width: 210px;
      padding: 0px;
      background-color: #6aae22;
      border-color: none; }
      .header-middle .right .search a {
        color: #fff; }
      .header-middle .right .search input.queryfield {
        width: 68%;
        padding: 4px;
        border-color: none;
        border: solid 2px #6aae22;
        border-right: none;
        margin-right: 0;
        border-radius: 0px 0 0 0px; }
      .header-middle .right .search input.button {
        background: #6aae22;
        /* background:url("suurennuslasi_white.png") no-repeat;*/
        border-color: none;
        border: solid 2px #6aae22;
        border-left: none;
        padding: 4px 8px;
        font-size: 12px;
        color: #fff;
        float: none;
        border-radius: 0 4px 4px 0; }

/*Content area*/
.wrapper {
  max-width: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: none; }

.layout {
  max-width: 996px;
  margin: 0 auto;
  float: none; }

/*Footer*/
.themebottom {
  /*Piiloitetaan viiva*/
  display: none;
  max-width: 996px;
  margin: 0 auto;
  float: none; }
  .themebottom .image img {
    width: 100%; }

.footer .padder.fleft {
  max-width: 996px;
  margin: 0 auto;
  float: none; }

/*Copyright link*/
ul.footer-links {
  max-width: 996px;
  margin: 0 auto;
  float: none; }

.top-navi .nav {
  margin: 0 auto;
  max-width: 996px; }

/*Nodepage*/
/*556 + 20 padding = 576px*/
.main {
  /*Sidebars 200px + 20 padding = 220px*/
  /*Left*/ }
  .main .content-main {
    max-width: 556px;
    width: 100%;
    margin: 0;
    padding: 0; }
  .main .sidebar {
    max-width: 220px;
    width: 100%;
    padding: 0;
    padding-right: 20px;
    /*Right*/ }
    .main .sidebar.aside {
      padding: 0;
      padding-left: 20px; }

.main.wide-content .content-main {
  max-width: 776px;
  width: 100%;
  margin: 0; }

.wide-content.main .sidebar {
  width: 220px; }

/*Front page*/
/*556 + 20 padding = 576px*/
.frontpage .content-main {
  max-width: 576px;
  width: 100%;
  margin: 0;
  padding: 0;
  padding-right: 20px; }

.frontpage .content-aside {
  max-width: 420px;
  width: 100%; }

/*Search*/
#Main_Main_pnlSearch .sidebar-search input[type=text] {
  max-width: 148px;
  width: 100%; }

table.search-buttons td {
  width: 100%; }

.page-list-controls table {
  width: auto !important; }
  .page-list-controls table img {
    width: auto !important; }

/*556+420+ 60 (20+20+20 paddding)*/
@media only screen and (max-width: 1036px) {
  .wrapper {
    padding: 0 10px; }
  .main {
    /*left*/ }
    .main .content-main {
      width: 55.80%; }
    .main .sidebar, .main.aside {
      width: 22.1%; }
  .main.wide-content {
    /*left*/ }
    .main.wide-content .content-main {
      width: 75.0%; }
    .main.wide-content .sidebar {
      width: 22.1%; }
  /*Järjestyksellä väliä*/
  .frontpage .content-main {
    width: 57.8%; }
  .frontpage .content-aside {
    width: 42.2%; }
  .footer ul.horizontal li {
    width: 22%; } }

@media only screen and (max-width: 768px) {
  .full-width-banner {
    display: none; }
  .wrapper {
    border: none;
    width: auto;
    max-width: 100%;
    border-radius: 0;
    padding: 5px; }
  .layout {
    width: 100%; }
  .frontpage .content-main, .frontpage .content-aside {
    width: 100%;
    max-width: 768px;
    padding: 0; }
  .main .content-main, .main .sidebar {
    width: 100%;
    max-width: 768px; }
  .footer ul.horizontal {
    /*Remove bottom border from last item*/ }
    .footer ul.horizontal li {
      width: 100%;
      border-left: none;
      border-bottom: 1px solid #b5d791;
      padding-left: 0;
      padding-bottom: 10px;
      padding-top: 10px;
      padding-bottom: 20px;
      margin-left: 0;
      margin-bottom: 10px; }
    .footer ul.horizontal li:last-child {
      border-bottom: 0; }
  .main .sidebar,
  .main .sidebar.aside,
  .main .content-main,
  .main.wide-content .content-main,
  .main.wide-content .sidebar,
  body.frontpage .content-main,
  body.frontpage .columns-2 ul.item-wrap > li {
    width: 100%;
    max-width: 768px;
    float: none;
    padding: 0;
    margin: 0; }
  .nav-mobile {
    display: block; }
  /*Mobile Left navigation. Navigation contains nodes ja extra-menu nodes*/
  .navi-left {
    margin-top: 20px;
    border-top: 6px solid #6aae22; }
    .navi-left .nav-list {
      display: none; }
      .navi-left .nav-list.nav-active {
        border-bottom: 6px solid #6aae22;
        /*margin-top: 5px;*/ }
      .navi-left .nav-list li {
        text-align: center; }
        .navi-left .nav-list li a {
          color: #000;
          font-weight: normal;
          line-height: 18px; }
    .navi-left ul.vertical {
      /*Sub nodes*/ }
      .navi-left ul.vertical li {
        /*selected*/
        /*Sub nodes*/ }
        .navi-left ul.vertical li.toplevel {
          background-color: #fff; }
          .navi-left ul.vertical li.toplevel a {
            background-color: #fff; }
        .navi-left ul.vertical li.active-trail a {
          font-weight: bold;
          background-color: #e1efd3; }
        .navi-left ul.vertical li .active-trail a {
          font-weight: bold; }
        .navi-left ul.vertical li ul.level1 li a {
          background-color: #e1efd3; }
        .navi-left ul.vertical li ul.level3 li a {
          background-color: #cde5b7; }
        .navi-left ul.vertical li ul.level3 li.active-trail a {
          background-color: #cde5b7; }
    .navi-left .nav-active {
      display: block; }
  /*Mobile extra navi*/
  .extra-navi {
    margin: 0;
    border-radius: 3px; }
    .extra-navi ul li {
      float: none;
      padding-left: 0;
      text-align: center;
      border-bottom: 1px solid #fff;
      /*Remove vertial line*/ }
      .extra-navi ul li:after {
        border-right: 1px solid #6aae22; }
    .extra-navi .nav-list {
      display: none; }
    .extra-navi .nav-active {
      display: block; }
  /*Mobile top navi*/
  .top-navi {
    margin: 5px 0;
    background: none;
    padding: 0; }
    .top-navi li {
      /*Home icon*/ }
      .top-navi li a {
        background-color: #ff9900; }
      .top-navi li.home a {
        width: auto;
        text-indent: -9999px;
        background: #ff9900 url(icon-home.png) no-repeat 50% 0; }
    .top-navi .nav {
      width: 100%;
      padding: 40px 0 0; }
      .top-navi .nav .nav-list {
        display: none; }
      .top-navi .nav .nav-active {
        display: block; }
      .top-navi .nav ul.horizontal {
        padding: 0; }
        .top-navi .nav ul.horizontal li {
          float: none;
          padding-left: 0;
          text-align: center;
          border: none;
          margin: 0 0 1px 0; }
          .top-navi .nav ul.horizontal li a {
            margin-right: 0;
            max-width: inherit;
            height: auto;
            padding: 5px 9px;
            line-height: 20px;
            display: block;
            width: auto; }
  /*Home icon*/
  .top-navi li.home a.current, .top-navi li.home a.selected, .top-navi li.home a:hover {
    background: #ff9900 url(icon-home.png) no-repeat 50% 0px; }
  /*Selected*/
  .top-navi li a.current, .top-navi li a.selected, .top-navi li a:hover {
    color: #fff;
    background: #6aae22; } }

@media only screen and (max-width: 570px) {
  .extra-navi {
    margin: 10px 0 10px;
    border-radius: 3px; }
  .header-middle .left {
    background: #fff; } }

/*TODO: tämä on vielä omana lohkona jossa kaikki tähän liittyvät css:t*/
/*Banneri*/
.full-width-banner .banner-inner {
  max-width: 2000px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden; }
  .full-width-banner .banner-inner .banner-item {
    position: relative; }
    .full-width-banner .banner-inner .banner-item .img-fluid {
      max-width: 100%;
      width: 100%;
      height: auto;
      vertical-align: middle; }
    .full-width-banner .banner-inner .banner-item .banner-caption {
      width: 100%;
      max-width: 996px;
      position: relative;
      margin: 0 auto; }
      .full-width-banner .banner-inner .banner-item .banner-caption .banner-caption-inner {
        position: absolute;
        /*TODO: noston tekstilaatikon kohta*/
        bottom: 40px;
        /*Noston teksti kuvan alle*/
        left: 20px;
        z-index: 10;
        color: #fff;
        text-align: center;
        text-shadow: none;
        text-align: left;
        padding: 20px;
        max-width: 450px;
        background: rgba(255, 255, 255, 0.7);
        color: #000;
        word-wrap: break-word; }
        @media only screen and (max-width: 768px) {
          .full-width-banner .banner-inner .banner-item .banner-caption .banner-caption-inner {
            position: static;
            display: block;
            padding: 10px 10px 5px 10px;
            width: 100%;
            max-width: 100%; } }

/*Social links*/
.content-item.box-content.social-links {
  float: left;
  width: 100%;
  border: 0;
  margin: 0;
  padding: 0;
  margin-bottom: 20px; }
  .content-item.box-content.social-links h3 {
    margin: 0; }
  .content-item.box-content.social-links .content-item-inner {
    border: 0;
    margin: 0;
    padding: 0; }
  .content-item.box-content.social-links ul {
    list-style-type: none;
    margin: 0;
    padding: 0; }
    .content-item.box-content.social-links ul li {
      float: left;
      padding-right: 10px; }
      @media only screen and (max-width: 768px) {
        .content-item.box-content.social-links ul li {
          width: auto; } }

/*User control Social links*/
.page-shareandprint {
  height: 50px; }

.accordion-group {
  margin-bottom: 2px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px; }
  .accordion-group .accordion-heading {
    border-bottom: 0;
    background: url(minus.gif) no-repeat 0 7px; }
  .accordion-group .collapsed {
    background: url(plus.gif) no-repeat 0 7px; }
  .accordion-group .accordion-heading .accordion-toggle {
    display: block;
    padding: 8px 15px; }
  .accordion-group .accordion-toggle {
    cursor: pointer; }
  .accordion-group .accordion-inner {
    padding: 9px 15px; }
  .accordion-group .collapse.in, .accordion-group .collapse.show {
    display: block; }
  .accordion-group .collapsing {
    position: relative;
    height: 0;
    overflow: hidden;
    -webkit-transition: height .35s ease;
    transition: height .35s ease; }
  .accordion-group .collapse {
    position: relative;
    height: 0;
    overflow: hidden;
    -webkit-transition: height 0.35s ease;
    -moz-transition: height 0.35s ease;
    -o-transition: height 0.35s ease;
    transition: height 0.35s ease; }
  .accordion-group .collapse.in {
    height: auto; }

/*Accessibility: Jump to content */
.jump-to-content {
  padding: 6px;
  position: absolute;
  left: -99999px;
  min-height: 0;
  height: 1px;
  margin-top: -1px;
  background: #fff;
  color: #000;
  font-weight: bold;
  text-decoration: none;
  -webkit-transition: top 1s ease-out,background 1s linear;
  transition: top 1s ease-out,background 1s linear;
  z-index: 100; }
  .jump-to-content:focus {
    top: 0;
    left: 0;
    background: #fff;
    outline: 0;
    -webkit-transition: top .1s ease-in,background .5s linear;
    transition: top .1s ease-in,background .5s linear;
    height: 35px; }

article a[target^=_blank]:not(.color-alt):after, footer a[target^=_blank]:after, .datatable2-big a[target^=_blank]:after, .frontpage a[target^=_blank]:not(.color-alt):after {
  font-family: "FontAwesome";
  content: " \f08e"; }

.content-picture-new-center a[target^=_blank]:after {
  content: "" !important; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0; }