@charset "UTF-8";
/* Ota yhteyttä */
.ota-yhteytta-wrapper { z-index: 1001; height: 100vh; text-align: center; display: block; height: auto; position: fixed; bottom: 50%; transform: rotate(-180deg) translateY(-50%); top: 0; right: 0; writing-mode: vertical-rl; text-orientation: mixed; box-sizing: border-box; }
.ota-yhteytta-wrapper .ota-yhteytta-toggle { border-top-right-radius: 1em; border-bottom-right-radius: 1em; border-top-left-radius: 0; border-bottom-left-radius: 0; line-height: 1; padding: 0.75em; background-color: #f2de36; display: inline-block; width: auto; }

/* Ota yhteyttä */
body.lataaopas-popup-active { overflow: hidden !important; height: 100vh; }

.lataaopas-popup { box-sizing: border-box; display: none; opacity: 0; transition: opacity 250ms ease-in; position: fixed; top: auto; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 1000; background-color: #fff; }
.lataaopas-popup * { box-sizing: border-box; }
.lataaopas-popup.lataaopas-popup-active { opacity: 1; display: block; }

.lataaopas-popup-close { padding: 1em; font-size: 2em; width: 100%; max-width: 100%; text-align: right; margin-bottom: 1em; }
.lataaopas-popup-close:hover, .lataaopas-popup-close:focus { background-color: rgba(0, 0, 0, 0.05); }
.lataaopas-popup-close:hover .fa, .lataaopas-popup-close:focus .fa { color: red; }

.lataaopas-popup-content { padding: 0 1em; }

.lataaopas-toggle-wrapper { z-index: 1001; height: 100vh; text-align: center; display: block; height: auto; position: fixed; bottom: 50%; transform: rotate(-180deg) translateY(-50%); top: 0; right: 0; writing-mode: vertical-rl; text-orientation: mixed; box-sizing: border-box; }
.lataaopas-toggle-wrapper .lataaopas-toggle { line-height: 1; padding: 0.75em; background-color: #f2de36; display: inline-block; width: auto; }

.lataaopas-popup-active ~ .lataaopas-toggle-wrapper { display: none; }

/* Ota yhteyttä */
.kumppani-wrapper-inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-top: 2em; }
.kumppani-wrapper-inner .filter-item { margin: 0.8em; width: 350px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
@media only screen and (min-width: 960px) { .kumppani-wrapper-inner .filter-item { max-width: calc(100% / 3 - (0.8em * 2)); } }
@media only screen and (min-width: 768px) and (max-width: 959px) { .kumppani-wrapper-inner .filter-item { width: 300px; max-width: calc(100% / 3 - (0.8em * 2)); } }
@media only screen and (min-width: 500px) and (max-width: 767px) { .kumppani-wrapper-inner .filter-item { max-width: calc(100% / 2 - (0.8em * 2)); } }
@media only screen and (max-width: 499px) { .kumppani-wrapper-inner .filter-item { max-width: 100%; } }

.kumppani-inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
.kumppani-inner .kumppani-ib-wrapper { width: 100%; position: relative; overflow: hidden; display: block; }
.kumppani-inner .kumppani-ib-wrapper .kumppani-ib-text { position: absolute; width: 100%; bottom: -50px; -webkit-transition: bottom 250ms ease-in-out; -o-transition: bottom 250ms ease-in-out; transition: bottom 250ms ease-in-out; }
.kumppani-inner .kumppani-ib-wrapper .kumppani-ib-sizer { height: 0; padding-bottom: calc(100% * 0.65); display: block; position: relative; }
.kumppani-inner .kumppani-ib-wrapper .kumppani-ib-image { -webkit-transition: background 150ms ease-in-out; -o-transition: background 150ms ease-in-out; transition: background 150ms ease-in-out; background-size: auto calc(100% + (25px * 0.65)); background-position: 50% center; background-repeat: no-repeat; position: absolute; width: 100%; height: 100%; }
.kumppani-inner .kumppani-ib-wrapper .kumppani-ib-image:after { -webkit-transition: background-color 150ms ease-in-out; -o-transition: background-color 150ms ease-in-out; transition: background-color 150ms ease-in-out; background-color: rgba(0, 0, 0, 0); content: " "; width: 100%; height: 100%; top: 0; left: 0; display: block; }
.kumppani-inner .kumppani-ib-wrapper:hover .kumppani-ib-text, .kumppani-inner .kumppani-ib-wrapper:focus .kumppani-ib-text { padding: 0.5em 0.75em; color: #fff; font-weight: bold; text-shadow: 5px 5px 0 rgba(0, 0, 0, 0.2); bottom: 0; }
.kumppani-inner .kumppani-ib-wrapper:hover .kumppani-ib-image, .kumppani-inner .kumppani-ib-wrapper:focus .kumppani-ib-image { background-position: calc(50% + 25px) center; }
.kumppani-inner .kumppani-ib-wrapper:hover .kumppani-ib-image:after, .kumppani-inner .kumppani-ib-wrapper:focus .kumppani-ib-image:after { background-color: rgba(0, 0, 0, 0.15); }
.kumppani-inner .kumppani-content-box-container { border-color: #eee; border-width: 0 1px 1px; border-style: solid; padding: 2em; }

[class^="kumppani"] { font-family: 'Cabin'; }

.kumppani-main-heading-element { font-family: 'Cabin'; font-weight: 600; color: #222222; margin-bottom: 20px; }
@media only screen and (max-width: 767px) { .kumppani-main-heading-element { font-size: 22px; } }

.kumppani-sub-heading { font-family: 'Cabin'; font-size: 16px; font-style: normal; font-weight: 200; }
.kumppani-sub-heading a { font-weight: 600; }
.kumppani-sub-heading p:last-of-type { margin-bottom: 0; }

.isotope-filters { width: 100%; text-align: center; }

.kumppani-wrapper { width: 100%; }

.filter-group { display: inline-block; width: 200px; position: relative; margin: 0.25em; }
.filter-group [role="button"] { display: block; background-color: #f2de36; border-radius: 40px; color: #1c424c; padding: 0.5em 1em; font-weight: bold; }
.filter-group [role="button"].active { background-color: #1c424c !important; color: #f2de36 !important; }
.filter-group [role="button"]:hover ~ .filter-sub-group, .filter-group [role="button"]:focus ~ .filter-sub-group { display: block; }
.filter-group .filter-sub-group { position: absolute; top: 100%; left: 0; width: 100%; display: none; z-index: 100; padding-left: 1em; background-color: #fff; }
.filter-group .filter-sub-group:hover, .filter-group .filter-sub-group:focus { display: block; }
.filter-group .filter-sub-group-items { position: relative; margin: 0.5em 0 0; }
.filter-group .filter-sub-group-items [role="button"] { display: inline-block; width: 100%; }
.filter-group .filter-sub-group-items [role="button"] + [role="button"] { margin-top: 0.5em; }

.filter-sub-group-items:before { display: block; height: calc(100%); top: 0; width: 2px; background: #1c424c; content: " "; position: absolute; left: -0.5em; border-radius: 2px; }