:root {
    --tk-blue: #0073B0;
    --tk-gray: #f3f1f2;
    --tk-gray2:#f8f8f8;
    --dark-gray: #aaaaaa;
    --dark-gray2:#737373;
    --white: white;
    --tk-light-blue: #63B1E5;
    --tk-yellow: #FECB00;
    --blue-hover: #338fc0;
    --tk-lightest-blue: #f2f8fb;
    --tk-violet: rgba(164, 0, 132, 1);
    --tk-purple: #722EA5;
    --tk-orange: #F8941E;
    --tk-dark-orange: #DC5034;
    --tk-pink:#E21776;
    --tk-dark-red: #AA272F;
    --tk-red:  #C30045;
    --tk-lime: #C0D730;
    --tk-green: #7AB800;
    --tk-dark-green: #008542;
    --tk-coral: #00B2A9;
    --tk-dark-coral: #00857E;
    --tk-light-blue: #63B1E5;
    --tk-dark-blue: #0039A6;
    --tk-brown: #7E4600;
}
html, button, input, select, textarea,
.pure-g [class *= "pure-u"] {
    font-family: 'Source Sans Pro', sans-serif;
}
html {
    scroll-behavior: smooth;
}
h1,h2,h3,h4{
    font-family: 'Barlow', sans-serif;
}

h2,h3,h4,h5 {
    font-weight: normal;
}

a {
    color: var(--tk-blue);
    text-decoration: none;
}
a .fa-chevron-right {
    margin-left: .1em;
    transition: 0.3s ease-in-out;
}
a:hover .fa-chevron-right {

    margin-left: .4em;
 
}


.big-link {
    font-size: 1.2em;
}



a .fa-chevron-right {
    font-size: .6em;
}


a:hover {
    text-decoration: underline;
}

p a {    
    text-decoration: underline;
}

.button {
    border-radius: 2em;
    background-color: var(--white);
    border: 1px solid var(--tk-blue);
    color: var(--tk-blue);
    text-transform: uppercase;
    font-weight: bold;
    font-size: 0.9em;
    padding: 0.8em 1.2em 0.9em 1.2em;
    transition: 0.4s;
    cursor: pointer;
    display: inline-block;
}

.button .fas {
    margin-left: .3em;
}

.button--primary {
    background-color: var(--tk-blue);
    border: 1px solid var(--white);
    color: var(--white);
}

.button--small {
    font-size: 0.7em;
}

.button.button--primary:disabled,
.button.button--primary:disabled:hover {
    background-color: var(--dark-gray);
    border: 1px solid var(--white);
    color: var(--white);
}


.button:disabled,
.button:disabled:hover {
    border: 1px solid var(--dark-gray);
    color: var(--dark-gray);
    background-color: white;
}


.button:hover {
    background-color: var(--tk-blue);
    color: white;
    text-decoration: none;
}


.button--primary:hover {
    background-color: white;
    color: var(--tk-blue);
}


.container{padding-right:1em;padding-left:1em;margin-right:auto;margin-left:auto}

.header__nav {
    margin: 1em 0;
}

.submenu {
    margin: 1em 0 1em -1em;
}
.navbar__nav,
.header {
    display: none;
}
.navbar__nav {
    position: relative;
    width: auto;
    height: auto;
}


.navbar__mobile-nav {
    display: block;
}

.navbar__mobile-nav__menu,
.navbar__mobile-nav__search {
    color: white;
    float: right;
    font-size: 1.6em;
    margin-top: .3em;
    background: none;
    border: none;
}
.navbar__mobile-nav__menu span,
.navbar__mobile-nav__search span {
    font-size: .4em;
    display: block;
}

.navbar__mobile-nav__search {
    margin-right: 0.5em;
}

@media (min-width:64em){

    .container{max-width:540px}
    .navbar__nav,
    .header {
        display: block;
    }
    .navbar__mobile-nav {
        display: none;
    }

}

@media (min-width:48em){
    .container{max-width:720px}

    .header__nav {
        float: right;
        margin-top: 3.4em;
    }
    .header__logo {
        margin: 2em 0;
    }

    .submenu {
        margin: 1em 0 1em -3em;
    }

}
@media (min-width:64em){.container{max-width:960px}}
@media (min-width:80em){.container{max-width:1140px}}


.nav-pils__link {
    text-decoration: none;
    color: var(--tk-blue);
    padding: 0.3em 0.7em 0.3em 0.7em;
    margin-left: 1em;
    
    display: inline-block;
}

.nav-pils__link:hover,
.nav-pils__link--active {
    border-radius: 2em;
    background-color: var(--tk-blue);
    color: var(--white);
    text-decoration: none;
}

.header__nav-login {
    margin-right: 1em;
}


.section {
    padding: 3em 0;
}

.section:first-of-type {
    padding-top: 1em;
}

.section__header {
    text-align: center;
    font-weight: bold;
    margin-top: 0;
}

.section__header--statistic {
    text-align: left;
}

.section__intro {
    text-align: center;
}


.section--white .section__intro {
    color: var(--dark-gray2)
}

.section--gray {
    background-color: var(--tk-gray);
}
.section--white {
    background-color: var(--white);
}

.section--more-space {
    padding: 4em;
}

.section--blue {
    background-color: var(--tk-blue);
    color: white;
}

.section--blue a { 
    color: white;
}

.errorpage {
    text-align: center;
    padding: 7em 0 20em 0!important;
}
.errorpage__code {
    font-family: 'Barlow';
    font-size: 10em;
    color: var(--dark-gray);
}
.errorpage__text {
    max-width: 600px; margin: 2em auto;
}

.section--splitted {
    padding: 0;
    min-height: 300px;
}

.section__splitted_content {
    padding: 3em 3em 3em 0;
}

.section__splitted_content h2 {
    font-weight: bold;
    margin-top: 0;
}

.section__splitted_image {
    background: url('tiedote.png');
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 100%;
}

.navbar {
    height: 67px;
    background-color:var(--tk-blue);
    font-size: 1.1em;
    font-family: 'Barlow', sans-serif;
}

.navbar__nav {
    list-style-type: none;
    margin: 0;
    padding: 0;
}


.navbar__nav-item {
    float: left;
    border-right: 1px solid hsla(0,0%,100%,.1);
    line-height: 67px;
}
.navbar__nav-item--home {
    border-left: 1px solid hsla(0,0%,100%,.1);
}
.navbar__nav-link {
    padding: 0 18px;
    display: block;
    text-decoration: none;
    color: var(--white);
}
.navbar__nav-link--home {
    padding: 0 30px;
    font-size: 1.6em;
    padding-top: -4px;
}

.navbar__nav-search {
    float: right;
    border-left: 1px solid hsla(0,0%,100%,.1);
}
.navbar__nav-item:hover,
.navbar__nav-item--active {
    box-shadow: inset 0px -5px 0px 0px white;
}

.navbar__nav-item:hover a {
    text-decoration: none;
}

.mobilemenu {
    display: block;
    background-color: var(--tk-blue);
    width: 100%;
    max-width: none;
    height: 100%;
    position: fixed;
    top:0;
    left: 0;
    overflow: hidden;
    padding:0;
    margin: 0;
    z-index: 3;
}

.mobilemenu .navbar__nav {
    display: block;
    margin-top: 1em;
}
.mobilemenu .navbar__nav-item {
    display: block;
    float:none;
    border: none;
    border-bottom: 1px solid var(--tk-gray);
    animation: fadeIn2 ease .5s;
}


.mobilemenu .navbar__nav-search {
    display: none;
}
#hamburger__text {
    width: 50px;
}

.mobileLanguageSelector {
    display: none;
    animation: fadeIn2 ease .5s;
    margin-top: 1.5em;
}
.mobilemenu  .mobileLanguageSelector{
   display: block;
}

.mobileLanguageSelector label {
    color: white;
}

.crumbs {
    background-color: white;
}
   .crumbs__list__item {
        display: inline-block;
    }
 /* 
    @media screen and (min-width: 35.5em) {

        .crumbs__list__item {
            display: inline-block;
        }
        

    }	 */


.crumbs__list,
.crumbs__list__item__sublist {
    list-style-type: none;
    padding-left: 0;
}

.crumbs__list__item__link,
.crumbs__list__item__sublist__item__link {
    color: var(--tk-blue);
    text-decoration: none;
    user-select: none;  
}

.crumbs__list__item__link:hover,
.crumbs__list__item__sublist__item__link:hover {
    text-decoration: underline;
}

.crumbs__list__item:hover .crumbs__list__item__sublist {
    display: table;
}

.crumbs__list__item__link::after {
    display: inline-block;
    content: '/';
    padding: 0 3px;
    color: #ccc;
}
  
.crumbs__list__item__sublist {
    display: none;
    
    animation: fadeIn ease 2s;
}
.crumbs__list__item__sublist__item {
    margin:0.5em 0;

}
.crumbs {
    display: block;
    background-color: white;
     height: 50px;
   /* margin-bottom: 1em;
    padding: .1em 0 .6em .1em;
    box-shadow: 0px 10px 5px grey; */
}
.crumbs__arrow {
    color: var(--tk-blue);
    font-size: 1.6em;
    float: left;
    margin-right: .5em;
}

.crumbs__list__item:not(.crumbs__list__item:first-of-type),
.crumbs__list__item__link::after {
    display: none;
}
.crumbs__list__item {
    font-size: 1.5em;
    float: left;
}
@media screen and (min-width: 48em) {
    .crumbs {
        padding: 0;
        box-shadow: none;
        height: auto;
        top: 0;
    }
    .crumbs__arrow {
        display: none;
    }
    .crumbs__list__item:not(.crumbs__list__item:first-of-type),
    .crumbs__list__item__link::after {
        display: inline-block;
    }
    .crumbs__list__item {
        font-size: 1em;
        float: none;
    }
}

.page-type-tag {
    color: var(--dark-gray2);
    border-bottom: 1px solid var(--dark-gray);
    display: block;
    margin-bottom: 1.2em;
    font-size: 0.9em;
    padding-bottom: .2em;
}

.tags--on-top {
    
    position: absolute; 
    margin-top: 20px;
}
.tags__tag {
    background-color: var(--tk-blue);
    color: white;
    padding: .2em .6em;
    font-size: .8em;
    white-space: nowrap;
    margin-bottom: 0.2em;
    margin-right: 0.2em;
    display: inline-block;
}

.tags__tag:hover {
    text-decoration: underline;
}

.intro {
    background: transparent url('sukat.jpg') 0 0 no-repeat local;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.intro--aihe {
    background-image: url('liikenne.png ');
}

 .intro--matkailu {
    background-image: url('matkailu.jpg');
 }

.intro__box {
    background-color: var(--tk-blue);
    display: inline-block;
    padding: 2em;
    margin: 4.5em 0 5em;
    color: white;
    max-width: 50%;
}

.card-theme {
    background-color: var(--tk-gray);
    width: 88%;
    display: inline-block;
    height: 130px;
    padding: 2em 4em 2em 0;
    overflow: hidden;
    margin: 1em 1em 0em 0em;
    background-size: cover;
    background-position: center;
    
    position: relative;
}

.card-theme__content {
    color: white;
    background-color: var(--tk-blue);
    padding: .8em .5em .5em 1em;
    font-size: .8em;
    z-index: 2;
    position: relative;
}
.card-theme__content a{
    color: white;
}
.card-theme__content h2,
.card-theme__content h3 {
    font-weight: bold;
    margin-top: 0;
}



@media screen and (min-width: 48em) {

    .card-theme {
        width: 38%;
    }
}	
@media screen and (min-width: 64em) {
    .card-theme {
        width: 24%;
    }
}
@media screen and (min-width: 80em) {
    .card-theme {
        width: 297px;
    }
}	


/*
.card-theme__content p {
    display: none;
    animation: fadeIn ease 2s;
}

.card-theme:hover {
    background-image: none;
}

.card-theme:hover p {
    display: block;
}
*/
.card-theme::before {
    content: ' ';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    opacity: 0.6;
    background-size: cover;
    background-position: center;
    transition: 0.3s;
}

.card-theme:hover::before {
    opacity: 1;
}

.card-theme h2 {
    letter-spacing: 1px;
}

a .card-theme:hover h2 {
    text-decoration: underline;
}

.card-theme--asuminen-rakentaminen::before {
    background-image:  url('asunnot.jpg'); 
   }
.card-theme--hinnat-ja-kulutus::before {
    background-image:  url('raha2.jpg'); 
   }

   .card-theme--kansantalous::before {
       
    background-image:  url('raha.jpg'); 
}

   .card-theme--vaesto::before {
    background-image:  url('ihmiset.jpg'); 
   }
   .card-theme--kulttuuri-media-vapaa::before {
    background-image:  url('kulttuuri.jpg'); 
   }
   .card-theme--digitalisaatio::before {
    background-image:  url('digi.jpg'); 
   }
   .card-theme--koulutus-tutkimus::before {
    background-image:  url('opiskelu.jpg'); 
   }
   .card-theme--tyo-palkat::before {
    background-image:  url('tyo2.jpg'); 
   }
   .card-theme--yritykset::before {
    background-image:  url('yritys.jpg'); 
   }

   .card-theme--liikenne-ja-matkailu::before {
     background-image:  url('liikenne.png');
    }

   .card-theme--energia::before {
    background-image:  url('energia.jpg'); 
   }
   .card-theme--ymparisto::before {
    background-image:  url('tehdas.jpg'); 
   }
   .card-theme--maa-metsa-kala::before {
    background-image:  url('maatalous2.jpg'); 
   }
   .card-theme--terveys-sosiaaliturva::before {
    background-image:  url('nuorijavanha3.jpg'); 
   }

   .card-theme--matkailu::before {
    background-image:  url('matkailu.jpg'); 
   }

   /*card-theme--search-stat*/
.card-theme--search-stat {
    padding: .8em 2.3em 2.5em 1em;
    font-size: 1.2em;
    background: var(--tk-gray2);
}

.card-theme--search-stat .card-theme__content  {
    background-color: transparent;
}

.card-theme--search-stat .card-theme__content {
    color: black;
    padding-top: .4em;
}

.card-theme--search-stat h2 {
    margin-bottom: 0;
}

.card-theme--search-stat a {
    color: var(--tk-blue);
    font-size: 1.2em;
}

.card-theme--search-stat ul {
    padding-left: 2em;
}

.card-theme--search-stat li {
    margin-bottom: .3em;
    /* list-style-type: none; */
}


.footer {
    background-color: var(--tk-blue);
    color: white;
    padding: 4em 0 2em 0;
}

.footer img {
    margin-top: -2em;
    margin-bottom: .7em;
}

.footer__item {
    display: block;
    margin-bottom: .7em;
}

.footer__header {
    font-family: 'Barlow', sans-serif;
    font-size: 1.4em;
    margin-bottom: .7em;
    display: block;
    margin-top: 1em;
}

.footer__item a {
    color: white;
}
.footer__item__icon {
    margin-right: .5em;
}

.footer__item__icon.fab {
    width: 16px;
}

.footer__bottom {
    border-top: 1px solid white;
    margin-top: 2em;
        
}
.footer__bottom__container {
    text-align: left;
}
.footer__bottom__container__item  {
    padding: 1em;
    display: block;
}
.footer__bottom__container__item a {
    color: white;
}

@media screen and (min-width: 48em) {

    .footer__header {
       margin-top: 0;
    }

    .footer__bottom__container__item  {
        padding: 2em 4em 2em 0;
        display: inline-block;
    }
}	


.date-box {
    background-color: var(--tk-blue);
    display: inline-block;
    color: white;
    font-weight: bolder;
    font-size: 1.4em;
    width: 150px;
    height: 120px;
    text-align: center;
    margin-bottom: 1em;
}
.date-box__date {
    margin-top: 2em;
    display: inline-block;
}     

.placeholder {
    width: 80%;
    margin: 0 10%;
}

.svt {
    height: 2em;
    width: 2em;
    background-color: var(--tk-gray);
    border-radius: 50%;
    display: inline-block;
  }

  @media (min-width:1024px){
    .contents {
        margin: 2em 0em 2em 2em;
    }
  }

.contents {
    background:var(--tk-gray) none repeat scroll 0 0;
    padding: 2.5em 2em 2em 1.5em;
    margin-top: 2em;
}

.contents__header {
    font-weight: 700;
    margin-left: 1.5em;
}
.contents__body a{
    text-decoration: none;
    color:var(--tk-blue);
}


.contents__body a:hover{
    text-decoration: underline;
}


/* Alert

.alert {
    background-color: #feead2;
    display: block;

}

*/
.alert__closebtn {
    color: gray;
   font-weight: bold;
   float: right;
   font-size: 3em;
   line-height: 20px;
   cursor: pointer;
   transition: 0.3s;
   background: none;
   border:none;
 }
 
.alert__closebtn:hover {
color: var(--tk-blue);
}

 .alert-new-page {
    color: black;
    background-color: #feead2;
    padding: 1.8em 0;
}
.alert-new-page strong {
    font-size: 1.1em;
}



.alert,
.alert-bg {
    padding: 1em 1em 1em 2em;
}
.alert-bg {
    margin-bottom: 1em;
}

.alert-bg p {
    line-height: 1.5;
}

.alert-bg,
.alert-bg a {
    color: white;
}
.alert-bg--red {
    background-color: var(--tk-dark-red);
}


.alert-bg--violet {
    background-color: var(--tk-violet);
}


.alert-bg--coral {
    background-color: var(--tk-coral);
}


.alert--violet {
    border: 1px solid var(--tk-violet);
}

.alert--violet .alert__icon {
    color: var(--tk-violet);
}
.alert--orange {
    border: 1px solid var(--tk-orange);
}
.alert--yellow {
    border: 1px solid var(--tk-yellow);
}
.alert--coral {
    border: 1px solid var(--tk-coral);
}
.alert--coral .alert__icon {
    color: var(--tk-colar);
}

.alert__icon {
    font-size: 2em;
    float: left;
    margin: .7em 1em 1em 0;
}


.scrollToTopBtn {
    display: none;
    position: fixed;
    bottom: 30px;
    right: 30px; 
    z-index: 99; 
    border: none; 
    outline: none; 
    background-color: var(--tk-gray);
    color: var(--tk-blue);
    cursor: pointer; 
    padding: .5em;
    font-size: 1.5em;
    animation: fadeIn ease 2s;
  }
  
.scrollToTopBtn:hover {
    background-color: var(--tk-blue);
    color: white;
}

@keyframes fadeIn{
    0% {
      opacity:0;
    }
    100% {
      opacity:1;
    }
  }

  @keyframes fadeIn2{
    0% {
      opacity:0;
      -webkit-transform: translateY(-10%);
    }
    30% {    
      -webkit-transform: translateY(0%);
    }
    100% {
      opacity:1;    
    }
  }


  /* SEARCH */
.search {
    max-width: 800px;
    margin-bottom: .7em;
}
  
.search__input {
    box-sizing: border-box;
    padding: 1em;
    border: 1px solid #cccccc;
    float: left;
    width: 80%;
  }
  
.search__button {
    padding: 1em;
    background: var(--tk-blue);
    color: white;
    border: 1px solid #cccccc;
    border-left: none; 
    cursor: pointer;
  }
  
  .search::after {
    content: "";
    clear: both;
    display: table;
  }

  .search-alt__link {
    display: block;
    text-decoration: none;
    margin-right: 1em;
}
@media (min-width:35.5em){

    .search-alt__link {
        display: inline;
    }
    
    .search-alt__link:first-of-type {
        margin-left: 1em;
    }
}


.search-result-info__filter {
    display: inline-block;
    cursor: pointer;
}

.search-result-info__filter-link {
    margin-left: 1em;
    text-decoration: none;
}


.search-result-info__filter__filters {
    position: absolute;
    left: 1em;
    background-color: white;
    border-radius: 1em;
    box-shadow: 0 2px 10px 0 rgba(0,0,0,0.2);
    padding: 2em 2em 2em 1em;
    margin:.5em 1em 0 0;
    animation: fadeIn ease .5s;
    display: none;
}

@media (min-width:35.5em){

    .search-result-info__filter__filters {

        left: auto;
        width: auto;
    
    }

    h1 {
        margin: .6em 0;
    }
}




.search-result-info__filter__filters li {
    list-style-type: none;
    margin-top: .5em;
}

.search-result-info__filter__filters__link {
    text-decoration: none;
}

.search-result-info__filter__filters__link--main {
    font-weight: bold;
    display: block;
}

.search_help {
    margin-top: 1em;
}

.search_help__link {
    text-decoration: none;
}

  
/* HAKUTULOKSET (huom! poikkeaa nimeämiskäytönnöstä */

#search-result .label {
    font-size: 0.8em;
    padding: .2em .2em;
    color: white;
    margin-right: .1em;
}

#search-result .label--findikaattori {
    background-color: #0039a6;
}
#search-result .label--tieto-trendit {
    background-color: #722ea5;
}
#search-result .label--statfin {
    background-color: #0073b0;
}


#search-result a {
    text-decoration: none;
}

#search-result .url,
#search-result .date {
    color:#666;
    font-size: 0.8em;
    margin: 0;
}

#search-result h3 {
    margin-bottom: .2em;
}

#more-btn {
    display: none;
}
#search-result .description {
    margin: .4em 0;
}

#search-result article {
    margin: 2em 0;
    max-width: 700px;
    
    word-wrap: break-word;
}

#search-result .more-similar-results {
    padding-left: 3em;
    display: none;
    animation: fadeIn ease .5s;
}


.pagination {
    padding-left: 0;
}

.pagination li{
    margin-top: 1em;
    display: inline-block;
    padding: 1em;
  }

  .pagination .active {
    background-color: var(--tk-blue);
  }

  .pagination .active a{
    color: white;
  }


  /* RELEASECALENDAR / accordion-element */

  
  .accordion__main {
    /*  border-bottom: 1px solid var(--tk-gray);
      padding: 1em 0em;

    */
    cursor: pointer;
        padding: 1em;
      /* background:rgba(242, 248, 251, 1); */
      background-color: var(--tk-gray);
      margin: 1em 0em;
  }

  .accordion--open .accordion__main {
    cursor: default;
  }

  .section--gray .accordion,
  .section--gray .accordion__main {
      
    background-color: white;
  }

  .accordions--header-only .accordion__main {
    padding: 1em 1em 0em 1em;
  }

  .accordion h3,
  .accordion h4 {
      margin-top: 0;
  }
  
  .accordion__info {
      animation: fadeIn2 ease 2s;
  }
  
  .accordion__name{
      font-weight: bold;
  }

  .accordion__time__tag {
    font-size: 0.9em;
    margin-left: .3em;
  }

  .accordion__info p {
      max-width: 600px;
  }
  
.accordion__toggleMoreInfo {
    color: var(--tk-blue);
    cursor: pointer;
    font-size: 3em;
    margin-top: -1em;
    transition: 0.3s;
}

.accordion__toggleMoreInfo.open {
    transform: rotate(180deg);
    transition: 0.3s;
}

.accordions--header-only .accordion__toggleMoreInfo {
    margin-top: 0;
}


#releases .accordion__langs__lang,
#releases  .accordion__info__datatables__table__new,
#releases  .accordion__info__datatables__table__old,
#releases .accordion__date__tag
 {
     background-color: white;
     font-size: 0.7em;
     width: 20px;
     padding: .2em .1em .3em .1em;
     font-weight: bold;
     display: inline-block;
     text-align: center;
 }

 #releases .accordion__datatables__table__new,
 #releases .accordion__info__datatables__table__old,
 #releases .accordion__date__tag {
    width: auto;
    padding: .3em;
}


#releases .accordion__date__tag{
    background-color: #c4e7ff;
}

#releases .accordion__info table td{
    padding: .5em;
 }

 #releases .accordion__info .button {
     margin: 2em 1em 2em 0em;
 }

 #releases .accordion__info tr td:first-of-type {
     font-weight: bold;
 }


 #releases .accordion__info__datatables__title {
    padding: .5em;
    font-weight: bold;
 }

#releases .accordion__info__datatables__table {
    margin: .5em;
}

 @media (min-width:35.5em){
    #release-section {
        width: 80%;
    }
    
    .accordion__info {
        padding: 0em 2em 2em 2em;
    }
    .accordion__toggleMoreInfo {
        font-size: 1.9em;
        margin-top: .3em;
    }
}


.contact {
    margin: .9em;
}

.contact__item--name {
    font-size: 1.2em;
}

#yhteystiedot h3 {
}

#showContact {
    font-size: .8em;
}

#contact {
    
    animation: fadeIn ease 2s;
}


:focus {
    outline: solid 2px #0073b0;
    outline-offset: 2px;
}


.tilastotieto-link-box {
    text-align: center;
    padding: 2em 2em .5em 2em;
    margin-bottom: 1em;
}

.tilastotieto-link-box h2 {
    margin-bottom: .4em;
    font-weight: bold;
}
.tilastotieto-link-box p {
    margin-top: 0em;
    text-align: left;
    padding: 0 1em;
}

.tilastotieto-link-box i {
    display: block;
    font-size: 2.5em;
    margin-bottom: .1em;
}



  .stat-list li {
      list-style-type: none;
      margin-bottom: .7em;
  }


  .stat-list__producer {
    font-size: .9em;
    display: block;
  }

  .card-gray h3 {
      margin-top: 0;
  }

  .card-gray {
      background-color: var(--tk-gray);
      padding: 2em;
      margin: 0 1em 1em 0;
      height: 120px;
  }



  .card-white h3 {
      margin-top: 0;
  }

  .card-white {
      min-height: 190px;
      margin: 0 1em 1em 0;
      background-color: white;
      width: 90%;
  }

  .card-white img {
  
    width: 100%;
}
.card-white__content {
    padding: 2em;
}

  .card-white__producer {
      font-size: .9em;
  }
  .card-white__paid {
    font-size: .9em;
    display: block;
  }

  .card-white__date {
      display: block;
      color: var(--dark-gray2);
      margin-bottom: 1em;
  }

  


  .statFin {
      text-align: center;
  }
  
  @media (min-width:64em){

    .statFin {
        text-align: left;
    }
  }

  .statFin__text h2,
  .statFin__text h3 {
      margin-top: 0;
    font-size: 1.4em;
    font-weight: normal;
  }

  .statFin__nav a{
                                  
    display: block;
    font-size: 1.1em;
    margin-top: 1em;
  }
  .statFin__nav i {
    font-size: .8em;
  }


  
  .card-release {
    margin: 1em 1em 1em 0em;
    border-bottom: 1px solid var(--dark-gray);
  }

  /*IHAN VAAN KUN KUVAT ERI KOKOISA TÄSSÄ SUUNNITELMASSA*/
  @media (min-width:64em){

    .card-release__image {
        width: 364px;
        height: 205px;
      }
  }




    
  .card-release img {
    width: 100%;
  }

  .card-release h3 {
    font-weight: normal;
    margin-top: .5em;
  }

  .card-release__meta {
      font-size: 0.9em;
      display: block;
      height: 50px;
  }

  .card-release__intro {
      display: block;
  }

  .card-release__date {
    display: block;
    color: var(--dark-gray2);
    margin-bottom: 1em;
  }


  .keyvalue {
      background-color: var(--tk-blue);
      color: white;
      padding: 1.2em;
      position: relative;
      margin: 0 1em 1em 0;
  }

  .keyvalue__title {
      height: 33px;
  }
  .keyvalue__menu {
      position: absolute;
    right: 5px;
    top: 5px;
    border: none;
    font-size: 1.4em;
    background-color: transparent;
  }

  .keyvalue__value {
      height: 100px;
      padding-top: 1em;
      font-family: 'Barlow', sans-serif;
      border-top: 1px solid white;
      border-bottom: 1px solid white;
      margin-bottom: .5em;
  }

  .keyvalue__value__value {
    font-size: 4em;
    font-weight: bold;
    margin-right: .3em;
  }

  .keyvalue__value__unit {
    font-size: 2em;
  }

  .keyvalue__refiment {
    height: 30px;
    font-size: 0.9em;
  }

  .release-meta-table  {
      margin-bottom: 2em;
  }

  .release-meta-table td{
      vertical-align: top;
      padding: .3em;
  }

  .release-meta-table tr td:first-of-type {
      width: 150px;
  }

  .release-meta-table a{
      margin-bottom: .5em;
      display: block;
  }

  .release-key-points {
    margin-bottom: 3em;
  }

.ingress {
    margin-bottom: 1.5em;
    font-size: 1.1em;
}

  .release-key-points li {
    font-size: 1.2em;
    margin: 1em;
  }

  .release-content-area {
    padding-right: 1em;
  }

  .release-content-area h2 {
    margin-top: 2em;
  }

  .release-content-area p {
    line-height: 1.5em;
  }

  .db-table-expl {

    font-size: 0.8em;
  }
  .db-table-expl span {
      margin: 1em;
  }

  
  @media (min-width:35.5em){

    .release-content-area {
        padding-right: 10em;
      }
  }


  .videoscript {
    text-align: center;
    padding: 2em 4em;
    max-width: 800px;
    margin: 0 auto;
    
    animation: fadeIn ease 2s;
  }


  .card-db {
      border-bottom: 1px solid var(--tk-gray);
      padding-bottom: 1em;
      margin-bottom: 1em;
  }

  .card-db__body__classifications{display:block; padding-left: 0; margin-top:0;}
  .card-db__body__classifications li{display:inline-block; margin-right: 1em;}

  .card-db__heading__id {
      color: var(--dark-gray2);
      width: 70px;
      display: inline-block;
  }

  .card-db__heading__title {
      display: inline-block;
  }


.card-db__body {
    padding-left: 0em;
}
.card-db__body td {
vertical-align: top;
}
.card-db__heading__change {
    margin-bottom: 1em;
    display: inline-block;
}
@media screen and (min-width: 64em) {
    .card-db__body {
        padding-left: 5em;
    }
    .card-db__heading__change {
        margin-left: 2em;
    }
    
}


.card-db__body table td:first-of-type {
    width: 170px;
    padding: .3em 0;
}

.flex .card-white {
    margin-right: 0;
    
    width: 100%;
}



@media screen and (min-width: 64em) {
    .flex .card-white {
        width: 300px;
    }
    
    #taulukkopalvelut .card-white  {
        width: 45%;
        margin: auto;
    }
}
@media screen and (min-width: 80em) {
    .flex .card-white {
        width: 350px;
    }
    
    #taulukkopalvelut .card-white  {
        width: 45%;
        margin: auto;
    }
}	



.db-intro{
    color: var(--dark-gray2);
    margin-bottom:2em;
}



label {
    font-weight: bold;
}

select,
input {
    padding: 0.3em;
    width: 100%;
    border: 1px solid var(--dark-gray);
    margin-top: .2em;
    background-color: white;
    color: black;
}

input[type=date] {
    width: 96%;
}

.pad-r {
    padding-right: 1em;
}
.pad-r label {
    margin-top: 1em;
    display: block;
}


@media screen and (min-width: 64em) {
    .pad-r label {
        display: inline-block;
        margin-top: 0em;
    }
    
}

#ajankohta-list-daterange {
    padding-left: 1em;
    margin-top: 1em;
    animation: fadeIn2 ease 2s;
}


.orderby,
.pagination {
    text-align: left;
    margin-top: 1.5em;
}
 
.pagination__pagenumber {
    width: 50px;
    display: inline-block;
    text-align: center;
}


#times-list {
  text-transform: capitalize;
}

.pictureToggle .nav-pils__link:first-of-type {
    margin-left: 0;
}

.pictureToggle {
    margin-top: 1em;
    text-align: left;
}

@media screen and (min-width: 35.5em) {
    /* ≥ 568px	.pure-u-sm-* */
    .flex {
        display: block;
    }
    .pictureToggle,
    .orderby {
        text-align: right;
    }
    .pictureToggle,
    .orderby,
    .pagination {
        /* text-align: right; */
        margin-top:0 ;
    }
}	

@media screen and (min-width: 64em) {
    .flex {
    
        display: flex;
        
        justify-content: space-between; 
      }
    }


@media screen and (min-width: 35.5em) {
    /* ≥ 568px	.pure-u-sm-* */
 
}	
@media screen and (min-width: 48em) {
    /* ≥ 768px	.pure-u-md-* */

}	
@media screen and (min-width: 64em) {

}
@media screen and (min-width: 80em) {
    /* ≥ 1280px	 */

}