/* schibsted-grotesk-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Schibsted Grotesk';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/schibsted-grotesk-v7-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* schibsted-grotesk-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Schibsted Grotesk';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/schibsted-grotesk-v7-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* schibsted-grotesk-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Schibsted Grotesk';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/schibsted-grotesk-v7-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* schibsted-grotesk-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Schibsted Grotesk';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/schibsted-grotesk-v7-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* schibsted-grotesk-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Schibsted Grotesk';
  font-style: normal;
  font-weight: 800;
  src: url('../fonts/schibsted-grotesk-v7-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* schibsted-grotesk-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Schibsted Grotesk';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/schibsted-grotesk-v7-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


:root {
--primary-color: #304999;
--base-font-size: min(max(1rem, 1.05vw), 18px);
--base-font-color: #afc1c7;
--base-line-height: 160%;
--google-font: 'Schibsted Grotesk', sans-serif;
--google-heading-font: 'Schibsted Grotesk', sans-serif;
--navi-background: #304999;
--footer-navi-background: #304999;
--navilink-font-size: min(max(0.8rem, 1.125vw), 18px);
--navilink-color: #fff;
--navilink-font-weight: 700;
--navilink-padding: 20px 15px;
--navilink-selected-bg: #fff;
--navilink-selected-color: #142036;
--heading-size-1: min(max(1.4rem, 2.8vw), 56px);
--heading-size-2: min(max(1.4rem, 2vw), 40px);
--heading-size-3: min(max(1.2rem, 1.6vw), 30px);
--heading-size-4: min(max(1.1rem, 1.6vw), 30px);
--heading-size-5: min(max(1.2rem, 1.4vw), 26px);
--heading-size-6: min(max(1rem, 1.2vw), 24px);
--grid-gap: 2em 3em;
--button-background: #304999;
--button-text-color: #fff;
--button-font-size: min(max(0.9rem, 1vw), 1rem);
--button-font-weight: 700;
--button-padding: 8px 30px;
--max-button-width: 450px;
--max-input-width: max-content;
--img-gallery-rows: repeat(auto-fit, minmax(200px, 1fr));
--img-gallery-img-size: 300px;
--mobilemenu-container-height: 63px;
--mobilemenu-open-close-color: #121a2f;
--mobilemenu-menutext-color: #121a2f;
--mobilemenu-button-background: #121a2f;
--mobilemenu-link-color: #fff;
--mobilemenu-link-background: #304999;
--mobilemenu-expand-button: #fff;
--mobilemenu-submenu-background: #243D8D;
--padding-s: min(max(20px, 1vw), 20px);
--padding-m: min(max(30px, 2vw), 40px);
--padding-xl: min(max(40px, 3vw), 60px);
--padding-xxl: min(max(20px, 4vw), 80px);
--animate: all .3s ease 0s;
  --hrcolor:rgba(255,255,255,.4);
 }
body, html, p {margin: 0;padding: 0;font-family: var(--google-font);color: var(--base-font-color);font-size: var(--base-font-size);line-height: var(--base-line-height)} .col-left a,.col-left a span, .col-full a, .col-full a span{color:#fff !important}img {max-width: 100%;height: auto;display: block;}header.content-col { position: absolute;z-index: 2;padding-top:2em}a {color: var(--primary-color);text-decoration: none; font-family:var(--google-font)}a:hover {text-decoration: underline}h1, h1 a, h2, h2 a, h3, h3 a, h4, h4 a, h5, h5 a, h6, h6 a {font-family: var(--google-heading-font);margin: 0;padding: 0;line-height: 110%;color: #fff; font-weight:800;}h1, h1 a {font-size: var(--heading-size-1);}h2, h2 a {font-size: var(--heading-size-2);}h3, h3 a {font-size: var(--heading-size-3);}h4, h4 a {font-size: var(--heading-size-4);}h5, h5 a {font-size: var(--heading-size-5);}h6, h6 a {font-size: var(--heading-size-6);}picture {width: 100%}section, article, .center-col, .content-col{box-sizing:border-box;}table, td, tr {border-collapse: unset !important}@media screen and (max-width:1024px) {table, td, tr {height: auto !important;max-width: 100%}}@media screen and (max-width:480px) {body {line-height: calc(1rem + 1.2vw)}}@media screen and (max-width:420px) {h1, h2, h3, h4, h5, h6 {word-wrap: anywhere}}
header > .center-col {grid-template-columns:auto 1fr}@media screen and (max-width:1280px) {header > .center-col {width: 96%;}}
#subheader{background:url(../img/header/bg-header.jpg) center top no-repeat; background-size:cover; position:relative; z-index:3000; padding:var(--padding-s) 0}
/* Wrappers */
.content-col, .center-col {width: 100%;clear: both;position: relative;}.center-col {width: min(max(60vw, 1600px), 90%);margin: 0 auto}.center-col iframe { max-width: 100%;margin: 0 auto}.narrow-col{max-width:1200px;}.erikoiskuva, .kuva, .kuva2 {box-sizing:border-box;border: 0;outline: 0;height: auto;margin: 0;cursor: pointer; max-width:100%;}

/* Grids */
.autogrid,.dgrid-2-cols, .dgrid-3-cols, .dgrid-4-cols, .dgrid-s-m-s-cols, .dgrid-s-xl-cols, .dgrid-xl-s-cols, .dgrid-m-l-cols, .dgrid-l-m-cols {display: grid;grid-gap: var(--grid-gap);clear: both;position: relative;} .dgrid-s-m-s-cols {grid-template-columns: 1fr 2fr 1fr}.dgrid-s-xl-cols {grid-template-columns: 1fr 3fr} .dgrid-xl-s-cols {grid-template-columns: 3fr 1fr}.dgrid-m-l-cols {grid-template-columns: 1fr 2fr}.dgrid-l-m-cols {grid-template-columns: 2fr 1fr}.autogrid, .dgrid-3-cols{grid-template-columns:repeat(auto-fit, minmax(350px,1fr))}.dgrid-2-cols {grid-template-columns:repeat(2,1fr)}.nogap {grid-gap: 2em 0;}.dgrid-4-cols{grid-template-columns:repeat(2,1fr);}@media screen and (max-width:1024px) {.dgrid-m-l-cols, .dgrid-l-m-cols, .dgrid-s-m-s-cols, .dgrid-s-xl-cols, .dgrid-xl-s-cols {grid-template-columns: 1fr}}@media screen and (max-width:768px) {.dgrid-2-cols, .dgrid-4-cols{grid-template-columns:1fr;}} @media screen and (max-width:480px) {.autogrid, .dgrid-2-cols, .dgrid-3-cols {grid-template-columns:repeat(auto-fit, minmax(220px,1fr))}}

/* Navigation */
#navi-wrap {grid-column:1 / -1}#main-navi, #top-navi, #footernavi {margin: 0 auto;padding: 0;list-style: none;z-index: 2;position: relative;flex-direction: row;justify-content:space-around;width:100%}#main-nav{background:var(--navi-background);transform: skew(-30deg)}#main-navi {transform: skew(30deg)}#top-navi {justify-content: flex-end}#footernavi {justify-content:center}.mainnavi-link, .topnavi-link, .footerlink {padding: var(--navilink-padding);font-size: var(--navilink-font-size);font-weight: var(--navilink-font-weight);text-decoration: none;text-transform: uppercase; color: var(--navilink-color);display: block;}.topnavi-link{color:#919191}.mainnavi-link:hover, .topnavi-link:hover, .footerlink:hover {color: #c6c6c6;}.footerlink {padding:0 2vw}.mainnavi-selected,#link-sel-1-3, #link-sel-2-4, #link-sel-3-5, #link-sel-4-6, #link-sel-5-7, #link-sel-6-8, #link-sel-5-28 {color: var(--navilink-selected-color);background: none;color: #fff;border-bottom: 10px solid #ca414c;padding-bottom: 10px;text-decoration: none}#logoimg {margin: 0;float: none;display: block;height: auto;padding: 40px 0;}#logo img {margin:0; max-width:10vw; min-width:200px;padding:30px 0}#sidenavi ul, #sidenavi li{list-style:none; margin:0; padding:0;}#sidenavi > ul {padding: 1em 2em;height: auto;background: var(--primary-color);}#sidenavi > ul a.valikkolinkki,#sidenavi > ul a.valikkolinkki-sel{padding:5px 0} #sidenavi ul li ul {padding: 0 0 0 20px !important;margin: 0;}#sidenavi ul li ul li ul {padding-bottom: 2em !important;}
.naviblock ul {display:none; position:absolute; width:100%;background: #fff; padding: 1em 2em;left:0; box-sizing:border-box} .naviblock ul, .naviblock li {list-style-type:none; padding:0; margin:0;} .naviblock:hover ul{display: grid;grid-template-columns: repeat(4,1fr); margin:0;padding: 1em 2em 2em 2em;border-radius: 6px;} .naviblock ul li a {padding:10px 0;display:flex;color:#142036} 

/* General classes, heroimg, banners */
#main-heroimg {width: 100%; max-height:1109px; object-fit: cover}
.heroimg {position: relative;}
picture img {width:100%; max-height:1040px;object-fit:cover}
#herofront, #introduction {overflow:hidden}
#herotext h1,#herotext h2, #herotext h3, #herotext h4, #herotext h5, #herotext h6, #introduction h1, #introduction h2,  #introduction h3,  #introduction h4,  #introduction h5,  #introduction h6{color:#fff; text-transform:uppercase}
#herotext h2 {font-size:var(--heading-size-1)}
#herotext p {color:#fff}
#herotext-col, #introduction-text-col {max-width: 650px;float: right;padding: 0 100px 0px 0;}
#introduction-text-col {float:left;}
#herotext, #introduction-text {width:100%; display:flex;}
#empty {width: 60px;}
.abs-element {position: absolute;z-index: 200;max-width: 100%;flex-direction: column;display: flex;width: 80%;} 
.dflex {display: flex;flex-wrap: wrap;flex-direction: column;} 
.dflex-row {display: flex;flex-wrap: wrap;flex-direction: row;} 
.center-elements {align-items: center;justify-content: center}
.fwimg {width:100%}
.white-p {color: #fff}
.shadow {text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);}
.headerbox {position: relative;margin-bottom: 1em;width: 100%;display: flex;z-index: 220;}
.headerbox p{font-family: var(--google-font);font-weight: 700;background: #ca404c;color: #fff;text-shadow: none;display: block;max-width: max-content;margin: 0;padding: 10px 3vw;text-align: center;text-transform: uppercase;}
.headerbox .col-full {margin: 0;}
.bnr {position:relative;} /* Bannerikuva position container */
.bnr img {width:100%;object-fit: cover;} /* Bannerikuvan maksimileveys */
.bnr.basic .bannertext img{width: auto;min-height:unset;max-height: unset}
.bgcolor-wrapper {background:#000} /* Optional */
.bgcolor-wrapper img {opacity:0.7} /* Optional */
#breadcrump, #breadcrump a {color:font-family: var(--google-font);color: #fff;font-size:16px}
footer {background:url(../img/header/footerbg.jpg) center top no-repeat; background-size:cover; overflow:hidden;}
#some-icons {display:flex; justify-content:center; align-items:center;}
#some-icons p {padding-right:10px}
.redbox, .whitebox{max-width:max-content;}
.redbox {background:#ca404c}
.bluebox {background:#3ec6cb}
.whitebox {background:#fff}
.blackbox {background:#000}
.blackbox span, .blackbox span a {color:#b0c4c9}
.bluebox .dgrid-s-m-s-cols{grid-template-columns: auto auto auto;justify-content: center;align-items: center;max-width: max-content;margin: 0 auto;}
#leftbox.bluebox p {font-size:min(max(1rem, 1.3vw), 24px)}
#leftbox.bluebox h3{font-size:min(max(1.6rem, 2.1vw), 44px);}
.bluebox span {display:block;}
.bluebox .webiolinkkipainike {background:#fff;color:#ca404c}

/* Hero -> Sloganboxes */
#sideboxes{align-self: flex-end;display:grid; grid-gap:20px;max-width:50%;grid-template-columns: auto 1fr;width: 100%;margin-right: -20px;min-width: 952px;}
#sideboxes span {display:block; font-weight:700;display: block;font-weight: 700;padding: 6px 30px;}
#sideboxes .whitebox{max-width:unset;padding-left:60px}
#sideboxes .redbox {padding-left: 100px;}
.skew-r{transform: skew(20deg)}
.counter-skew-r {transform: skew(-20deg)}
.skew-l{transform: skew(-20deg)}
.counter-skew-l {transform: skew(20deg)}
.whitebox, .whitebox span {color:var(--primary-color)}
.redbox, .redbox span {color:#fff}
#leftbox{margin-left:-40px;}
#leftbox.bluebox{padding:var(--padding-s) 0 !important; max-width:1600px} 
.bluebox .dgrid-s-m-s-cols {padding-right: 2vw;}
#leftbox.lp-leftbox {width:140%; max-width:2000px}

/* Footer */
#fcontact-left {background:#2f4a9a; margin-left:-40px}
#fcontact-right {background:#ca414c; margin-right:-40px}
#fcontact-left h4, #fcontact-right h4,#fcontact-left h4 span, #fcontact-right h4 span{font-size:min(max(1rem, 1.6vw), 34px); font-weight:900; text-transform:uppercase}
#fcontact-left h5, #fcontact-right h5,#fcontact-left h5 span, #fcontact-right h5 span{font-size:min(max(1.1rem, 2vw), 40px); font-weight:400}
#fcontact-left .counter-skew-r {float: right;padding: var(--padding-s) var(--padding-xxl);}
#fcontact-right .counter-skew-l {float: left;padding: var(--padding-s) var(--padding-xxl);}
footer h6 {font-size:min(max(1.4rem, 2vw), 40px); font-weight:800; text-transform:uppercase}
#footer-logo img {max-width: 20vw;min-width: 180px;}
footer .dgrid-3-cols {grid-template-columns:1fr 1fr 1fr}
#ftr-logos {display:flex; flex-direction:column; align-items:center;}

@media screen and (max-width:1750px) {.bluebox .dgrid-s-m-s-cols {grid-template-columns: auto 1fr auto;justify-content: flex-start;align-items: center;max-width: unset;margin: 0; padding-left: 7vw;}#leftbox.bluebox {max-width: 80vw;}}
@media screen and (max-width:1100px) {#ftr-logos img {max-height: 100px;width: auto;max-width: 220px;height: auto;}}
@media screen and (max-width:1024px) {#sideboxes {max-width: max-content;min-width: unset;}.bluebox .dgrid-s-m-s-cols {grid-template-columns: auto 1fr auto;grid-gap: 10px 1em;padding-bottom:1em}.bluebox .dgrid-s-m-s-cols img{max-width:60px} #leftbox.bluebox {max-width: unset;}}
@media screen and (max-width:780px) {#footer-logo{grid-row: 1;grid-column: 1/-1;}footer .dgrid-3-cols {grid-template-columns:1fr 1fr;grid-gap: 1em;}footer .skew-l{transform: skew(20deg)}footer .counter-skew-l {transform: skew(-20deg)}#fcontact-left .counter-skew-r,#fcontact-right .counter-skew-l {float:unset;text-align: center;}#fcontact-right .counter-skew-l h4,#fcontact-right .counter-skew-l h5{text-align:center !important;}}
@media screen and (max-width:768px) {#empty {width: 0px;}}
@media screen and (max-width:720px) {#herofront .abs-element {position: relative;order: 2;z-index: 201;background: #0f2b5b;width: 100%;padding: var(--padding-xxl);box-sizing: border-box;}#herofront #main-heroimg {min-height: 300px;object-position: left top;object-fit: cover;max-height: 900px;}#herotext-col {max-width: unset;float: unset;padding: 0 0 4em 0;}#herotext .center-col {width:100%}#sideboxes {max-width: 95%}  #sideboxes {grid-template-columns: 1fr;grid-gap: 0;margin-bottom: 4em;padding-top: 0;}  #herofront .abs-element {padding: 0;}#herotext-col{padding:var(--padding-xl)}#sideboxes .redbox {padding-left: 0;width: 100%;max-width: unset;}#sideboxes .whitebox {max-width: unset;padding-left: 0;margin-left: 13px;}.bluebox .dgrid-s-m-s-cols section:last-of-type {grid-column: 1/-1;}#leftbox.bluebox {margin-left: 0; transform:unset;width: 100%;}#leftbox.bluebox .counter-skew-r,#introduction .skew-r,#introduction .counter-skew-r{transform: unset;}.bluebox .webiolinkkipainike {transform: unset; margin: 10px 0;}}
@media screen and (max-width:575px) {#leftbox.bluebox h3 {font-size: 1.2rem;}#leftbox.bluebox {width: 90%;margin: 0 auto 2em auto;} .bluebox .dgrid-s-m-s-cols {padding: 0 1em;}#fcontact-left .counter-skew-r {padding: 10px 0 10px var(--padding-s);}#fcontact-right .counter-skew-l {padding: 10px var(--padding-s) 10px 0;}#fcontact-left,#fcontact-right{margin-top: 1em;}#footer-bottom{margin-top:3em}}
@media screen and (max-width:480px) {.bluebox .webiolinkkipainike {width: 100%;}#leftbox.bluebox p {font-size: 0.9em;line-height: 140%;}}

/* Endorse banners */
.col-full:has(.page-banner){display:grid;grid-template-columns:repeat(3,1fr);grid-gap:1em;}
.page-banner {border: 1px solid #758589;;background:rgba(26,34,49,0.7)}

.page-endorse {overflow: hidden;line-height: 1.5em;max-height: 4.5em; position: relative;}
@supports (-webkit-line-clamp: 3) {
    .page-endorse {display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;max-height: none;}
}
.page-img {overflow:hidden}
.page-img img{ width: 100%;max-height: 300px;object-fit: cover;aspect-ratio: 16/9;transition:var(--animate); transform:scale(100%)}
.page-img.cpadding-s {padding-bottom:0}
.bannertext {padding: var(--padding-s); color:#afc1c7; padding-bottom:var(--padding-xl)}
.bannertext p {color:#afc1c7}
.bannertext h3 {display:flex;}
.bannertext h3 a {color:#fff}
.bannertext h3::after {content: "›";color: #fff;float: right;font-weight: 400;padding-left: 20px;}
.bannertext.front-bannertext {padding-top:0}
.customer-endorse-blog .webiolinkkipainike {background: var(--primary-color)}
.page-banner:hover img {transform:scale(103%)}

@media screen and (max-width: 1280px) {.col-full:has(.page-banner){ grid-template-columns: repeat(2,1fr);}}
@media screen and (max-width: 1024px) {.bannertext h3 {font-size: min(max(1.4rem, 1.8vw), 36px);}}
@media screen and (max-width: 768px) {.col-full:has(.page-banner){grid-template-columns: 1fr;}}

/* Frontpage -> Introduction */
#introduction .fwimg {min-height: 560px;}
#introduction h1 {font-size:min(max(1.6rem, 2.3vw), 46px); text-shadow: 0px 0px 6px rgba(0,0,0,.3)}
@media screen and (max-width: 678px) {#introduction-text{position: relative;order: 2; background: #16264f;}#introduction .fwimg {object-position: top}#introduction-text-col{padding: 0 0 var(--padding-xl) 0;}#introduction-text > .center-col {padding-bottom:0;}#leftbox {max-width: 90%;padding: 0 0 2em 0;}#leftbox .blackbox {padding: var(--padding-s) 0;}#introduction .fwimg {min-height: 280px;}#introduction-text h1 {font-size: min(max(1.4rem, 1.5vw), 24px);line-height: 140%;margin-top: -140px;padding-bottom: 49px;}}
@media screen and (max-width: 510px) {#introduction-text h1 {padding-bottom: 20px;word-wrap: anywhere;}}
@media screen and (max-width: 420px) {#introduction-text h1 {padding-bottom: 15px;}#introduction-text h1 { margin-top: -160px;}}

/* Frontpage -> Product endorse */
#endorse-front, .basic-maincontent {background:#1e2637 url(../img/header/bannersbg.jpg) center top no-repeat; background-size:cover}
#endorse-front h3:after {display:none}

/* Frontpage -> References, Partnership */
#partnership {grid-template-columns:1fr 1fr}
#partnership .cpadding-xxl{max-width:800px; margin:0 auto}
#figure-img, #figure-img img{width:100%}
#figure-img img{object-fit: cover;}
#figure-img {padding:var(--padding-s) 0}
#figures{position:relative;}
#figures .dgrid-3-cols {grid-template-columns:auto auto auto; grid-gap:1em 0}
#figures .dgrid-3-cols img {max-width: 7vw;min-width: 60px;}
#partnership h4 {font-weight:800; text-transform:uppercase}
#partnership a {text-transform:uppercase; text-decoration:underline;font-weight:700}
#partnership h4{font-size:min(max(1.6rem, 2.1vw), 40px);}
#figures h4 {font-size:min(max(1.8rem, 2.8vw), 56px);}

/* Frontpage -> News */
#frontpage-news-wrapper{border: 1px solid #3ec6cb;margin-bottom:2em}

@media screen and (max-width: 1280px) {#figure-img, #figure-img img, #figure-img .col-full, #solu1291, #figure-img p{height: 100%; margin-bottom:0}}
@media screen and (max-width: 1024px) {#partnership .cpadding-xxl{padding-top: 0;}#partnership {grid-template-columns: 1fr;} #partnership .cpadding-xxl {padding-bottom: 0;}}
@media screen and (max-width: 575px) {#partnership .cpadding-xxl {padding-top: 0;padding-bottom: 0;} #partnership .cpadding-xxl {padding: 0 var(--padding-s);}#partnership {padding-top:3em}#figure-img img {min-height: 800px;}#partnership .abs-element {width: 90%;}}
@media screen and (max-width: 480px) {#figures table,#figures tbody,#figures tr,#figures td{width:100% !important; height:auto !important;max-width:100% !important}#figures table tr {display: flex;flex-direction: column;}#figures .dgrid-3-cols span {font-size: 12px;line-height: 100%;}}

/* Landing page -> Hero section */
#landing-page-hero, #basic-page-hero {background:#0e2658 url(../img/header/bg-content.jpg) left top no-repeat; background-size:100%; border-bottom:10px solid #ca414c}
#landing-page-hero #leftbox .col-full {margin-bottom:0}
#lp-hero-mask #main-heroimg {max-height: 800px;object-fit: cover;}
#lp-hero-mask img {mask-image: url(../img/header/maskimage.png);mask-repeat: no-repeat;mask-position: left top;mask-size: 100%;}
#lp-hero-text {width:100%; max-width:700px; margin:0 0 auto auto}
#lp-hero-text h1 {color:#fff; text-transform:uppercase}
#leftbox.lp-leftbox {transform:skew(35deg); margin-left:-180px}
#leftbox.lp-leftbox .counter-skew-r{transform:skew(-32deg)}
#leftbox.lp-leftbox {transform:skew(32deg)}
#leftbox.lp-leftbox .skew-r{transform:skew(32deg); margin-top:0}
#personel-imgdiv{padding-left: 7vw;}

@media screen and (max-width:1750px) {#leftbox.lp-leftbox {width: 170%;max-width: unset;z-index: 2;}}
@media screen and (max-width:1300px) {#leftbox.lp-leftbox {width: 190%;}}
@media screen and (max-width:1200px) {#leftbox.lp-leftbox {width: 220%;}#leftbox.lp-leftbox p {font-size:16px !important}}
@media screen and (max-width:1024px) {#leftbox.lp-leftbox {width: calc(280% - 11vw);}#leftbox.lp-leftbox .dgrid-s-m-s-cols {padding-left: 11vw;}}
@media screen and (max-width:768px) {#leftbox.lp-leftbox {transform:skew(35deg); margin-left:0px; margin-bottom:0}#leftbox.lp-leftbox {width: 100%}#leftbox.lp-leftbox .dgrid-s-m-s-cols {padding: 0 var(--padding-s);}#leftbox.lp-leftbox .counter-skew-r,#leftbox.lp-leftbox,#leftbox.lp-leftbox .skew-r{transform:unset}#personel-imgdiv {padding: 0 0 0 1em;} #leftbox.lp-leftbox .dgrid-s-m-s-cols img {max-width: 100%;}#leftbox.lp-leftbox .webiolinkkipainike {width: 100%;}#landing-page-hero .cpadding-xxl {padding: var(--padding-s);order:2}#lp-hero-mask img {mask-image: unset;}#lp-hero-mask #main-heroimg {max-height: 300px;}#basic-page-hero .center-col {padding: 2em 0;}.center-col {width: min(max(60vw, 1600px), 94%);}}

/* Landing page -> Main content */
.lp-maincontent,.solutions-maincontent{background:#1e2637 url(../img/header/bannersbg.jpg) center top repeat-y; background-size:100%}
.product-documents .webiolinkkipainike {margin-top: 20px !important};

/* Product page -> Additional links, brochures */
.product-documents:has(a)::before {content: "Lisätiedot ja esitteet";font-weight: 700;color: #fff;display: block;}
.product-documents:has(.webiolinkkipainike)::before {display: none;}

/* Landing page -> Solutions page -> endorse col */
.solutions-maincontent .dgrid-3-cols{grid-gap:1.5em; grid-template-columns:repeat(3,1fr)}
.solutions-maincontent .page-banner {padding:1em 1em 2em 1em}
.solutions-maincontent .dgrid-3-cols img {width:100%}

/* Landing page -> Partners */
#partners-wrapper-landing-page td {background:#fff; padding:var(--padding-m); box-sizing:border-box}
#partners-wrapper-landing-page table,#partners-wrapper-landing-page tbody, #partners-wrapper-landing-page tr, #partners-wrapper-landing-page td {width:100% !important; height:auto !important}
#partners-wrapper-landing-page tr {display:grid; grid-template-columns:repeat(auto-fit, minmax(400px,1fr)); grid-gap:1em;} 
#partners-wrapper-landing-page h2,#partners-wrapper-landing-page h3,#partners-wrapper-landing-page h4,#partners-wrapper-landing-page h5,#partners-wrapper-landing-page h6, #partners-wrapper-landing-page p,#partners-wrapper-landing-page li {color:#142a51}

@media screen and (max-width:1024px) {.solutions-maincontent .dgrid-3-cols{grid-template-columns:repeat(2,1fr)}#partners-wrapper-landing-page {padding: 1em 0;}}
@media screen and (max-width:650px) {.solutions-maincontent .dgrid-3-cols{grid-template-columns:1fr}}
@media screen and (max-width:575px) {#partners-wrapper-landing-page tr {display:grid; grid-template-columns:1fr; grid-gap:1em;}}

/* Product page -> Contact wrapper */
#contact-info-wrapper {background:#3ec6cb}
#pcard-contact-wrapper {grid-template-columns:1fr 1fr auto; text-align:center;align-items: flex-start;padding: 0;}
#pcard-contact-wrapper .webiolinkkipainike {margin-top:0}
#pcard-contact-wrapper p {line-height:120%}
.ask-for-more p {color:#142a51;}

/* Product page -> Product image */
#whitebg-box {background: #fff;}
#whitebg-box img {padding:0 !important;margin:0 auto}

@media screen and (max-width:1280px) {#pcard-contact-wrapper {grid-template-columns: auto 1fr auto;}}
@media screen and (max-width:768px) {#pcard-contact-wrapper {grid-template-columns: 1fr;}#pcard-contact-wrapper .webiolinkkipainike {margin-top: 1em;}#pcard-contact-wrapper h4, #pcard-contact-wrapper h4 a, #landing-page-hero h4, #landing-page-hero h4 a{font-size: 1.6rem;}#pcard-contact-wrapper h3 {padding-bottom: 10px;}#landing-page-hero #leftbox{text-align:center}}
@media screen and (max-width:575px) {.pcard-contact-person tr {display: grid;grid-template-columns: auto 1fr;grid-gap: 1em;}.pcard-contact-person table,.pcard-contact-person tbody, .pcard-contact-person tr, .pcard-contact-person td, .pcard-contact-person tr {width:100% !important; height:auto !important; text-align:center;}.pcard-contact-person img {margin:0 auto} .pcard-contact-person tr { grid-template-columns: 1fr;}}

/* Blog pages */
.blog-content-wrapper p,.blog-content-wrapper h1, .blog-content-wrapper h2, .blog-content-wrapper h3, .blog-content-wrapper h4, .blog-content-wrapper h5,.blog-content-wrapper h6, .blog-content-wrapper span{color:#2f4a9a}
.blog-content-text h2 {padding: 20px 0;font-size: min(max(1.4rem, 2vw), 36px);}
.blog-content-wrapper a {color:#ca414c !important}
.bwrapper-28 br {display: block;margin: 0 0 5px;}

/* Personel-> Table */
#hkunta, #hkunta tbody,#hkunta tr, #hkunta td{width:100% !important; height:auto !important} #hkunta tr {display:grid; grid-template-columns:repeat(3,1fr); grid-gap:2em;} @media screen and (max-width:575px) {#hkunta tr {display:grid; grid-template-columns:1fr; grid-gap:1em;}} 

/* Mobile tags*/
#mobilemenu-container{height:var(--mobilemenu-container-height);position: relative;right: 0;top: 0;z-index: 2000;width: 100%; background: url(../img/header/bg-header.jpg) left top no-repeat;background-size: cover;}
#mobile-logo {position: absolute;top: 0;left: 0px;z-index: 50000}
#mobilelogo-img { max-width: 160px;height: auto;padding: 13px 0px 0 1em}
@media screen and (max-width:1024px) {#main-nav, #logo, footer nav, footer ul, #sidenavi, #subheader {display: none}}

/* Paddings */
.cpadding-s{padding:var(--padding-s)}.cpadding-m{padding:var(--padding-m)}.cpadding-xl{padding:var(--padding-xl)}.cpadding-xxl{padding:var(--padding-xxl)}.cpadding-tb-s{padding:var(--padding-s) 0}.cpadding-tb-m{padding:var(--padding-m) 0}.cpadding-tb-xl{padding:var(--padding-xl) 0}.cpadding-tb-xxl{padding:var(--padding-xxl) 0}.cpadding-t-s{padding-top:var(--padding-s)}.cpadding-t-m{padding-top:var(--padding-m)}.cpadding-t-xl{padding-top:var(--padding-xl)}.cpadding-t-xxl{padding-top:var(--padding-xxl)}.cpadding-b-s{padding-bottom:var(--padding-s)}.cpadding-b-m{padding-bottom:var(--padding-m)}.cpadding-b-xl{padding-bottom:var(--padding-xl)}.cpadding-b-xxl{padding-bottom:var(--padding-xxl)}.cpadding-rl-s{padding:0 var(--padding-s)}.cpadding-rl-m{padding:0 var(--padding-m)}.cpadding-rl-xl{padding:0 var(--padding-xl)}.cpadding-rl-xxl{padding:0 var(--padding-xxl)}

/* Webio cols classes */
.col-3,.col-full,.col-left,.col-right{width:100%;float:none; margin:0}.col-full, .colpadding{clear:both;margin-bottom:20px;}.center-col .colpadding:last-of-type, .content-col .colpadding:last-of-type {display: none;}

/* Webio content classes */
 .webiolinkkipainike, .lomakenappi_submit, .takaisinuutisiin {box-sizing: border-box;cursor: pointer;margin-top: 20px;text-transform:uppercase;display: inline-block;text-align: center;font-size: var(--button-font-size);padding: var(--button-padding);background: var(--button-background);color: var(--button-text-color);font-weight: var(--button-font-weight);width: auto;max-width: var(--max-button-width);}.webiolinkkipainike:hover,.takaisinuutisiin:hover { transition: all .3s ease 0s;-webkit-filter: brightness(110%);filter: brightness(110%);text-decoration: none}.tapahtumat, .tapahtumakalenteri_otsikko, .tapahtumakalenteri_valiotsikko, .uutis_otsikko.tapahtumakalenteri_valiotsikko, .uutis_otsikko, .nostettumoduli, .nostettumoduli a, a.nostouutis_otsikko {color: var(--primary-color);font-size: 1.2rem;display: block;}.acc-news-wrapper .uutis_otsikko{border-top: 1px solid #707070;font-family: var(--google-heading-font);margin: 0;line-height: 120%;font-size:0.9rem; text-transform:uppercase;padding: 15px 0 15px 0; font-weight:700}
details{position:relative;margin-top:20px;}
details:after,details[open]:after{position:absolute; right:0; top: 15px;font-weight: 700;pointer-events:none}
details:after{content:"+"}details[open]:after{content:"-"}.valikkolinkki, .valikkolinkki-sel, .valikkomodulilinkki, .valikkomodulilinkki-sel {text-decoration: none;color: #fff;padding: 5px 0;display: block;}@media screen and (max-width:480px) {.webiolinkkipainike, .lomakenappi_submit, .takaisinuutisiin {padding: 10px 30px; max-width:100%}}.popupkalenteri iframe {height: 239px;}
hr{border-top-width: 1px;border-right-width: 0px;border-bottom-width: 0px;border-left-width: 0px;border-top-style: solid;border-right-style: solid;border-bottom-style: solid;border-left-style: solid;border-top-color: var(--hrcolor);border-right-color: var(--hrcolor);border-bottom-color: var(--hrcolor);border-left-color: var(--hrcolor);}

/* Image gallery */
.kuvagalleriagrid {display: grid;grid-template-columns: var(--img-gallery-rows);grid-gap: 1em}.kuvagalleriakuvatausta {width: 100% !important;height: auto !important;margin: 0 !important}.kuvagalleriakuvatausta .kuva {width: 100%;max-width: 100%;object-fit: cover; padding: 0 !important;aspect-ratio:4/3}@media screen and (max-width:575px) {.kuvagalleriagrid {grid-template-columns: repeat(2, 1fr)}}@media screen and (max-width:480px) {.kuva, .kuva2 {float: none !important;clear: both;padding: 20px 0; box-sizing:border-box;}}

/* Semio referencelinks*/
#swlinkit {text-align: center;padding:10px 0;}.swlinkki {font-family:var(--google-font);font-size: 12px;color: #424242; }.swlinkki:hover{color:#06b0a7; text-decoration: none;}

 @media screen and (max-width:678px) {.subpage table, .subpage td, .subpage tr {display: block;width: 100% !important;height: auto; clear: both;box-sizing: border-box}.subpage tbody {width: 100%;display: inline-block}.subpage tr {display: flex;}.subpage tr td {flex:1;}}@media screen and (max-width:480px) {.subpage tr {display: grid;grid-template-columns: repeat(auto-fit,minmax(220px,1fr));}}
/* Forms */
.lomakeotsikko {color: #fff;font-weight: 700; padding:10px 0;}.lomake-ve-solu input[type=checkbox] {display: none}.lomake-ve-solu input[type=checkbox] + label, .lomake-ve-solu input[type=checkbox]:checked + label {-webkit-appearance: none;display: block;position: relative;height: auto;clear: both;}.lomake-ve-solu input[type=checkbox] + label::before, .lomake-ve-solu input[type=checkbox]:checked + label::before {border-radius: 100%;border: 1px solid #8e8e8e;border-radius: 4px;color: #fff;content: "✓";float: left;font-size: 1.2em !important;font-weight: 700;height: 18px;line-height: 11px;margin-right: 20px;padding: 8px 12px 0 8px;position: relative; width: 9px}.lomake-ve-solu input[type=checkbox] + label::before {content: ""}.lomake-ve-solu input[type=checkbox]:checked + label::before { background: #2a2a2a none repeat scroll 0 0;color: #fff !important;border: none;padding: 8px 15px 0 7px}#suodatin input[type=checkbox]:checked + label,.lomake-ve-solu input[type=checkbox]:checked + label {color: #000;box-shadow: 0 1px 2px rgba(0, 0, 0, .05), inset 0 -15px 10px -12px rgba(0, 0, 0, .05), inset 15px 10px -12px rgba(255, 255, 255, .1), inset 0 0 10px rgba(0, 0, 0, .1)}.lomake-ve-solu input[type=checkbox] + label:active, .lomake-ve-solu input[type=checkbox]:checked + label:active {box-shadow: 0 1px 2px rgba(0, 0, 0, .05), inset 0 1px 3px rgba(0, 0, 0, .1)}.lomake-ve-solu [type=radio]:checked, .lomake-ve-solu [type=radio]:not(:checked) {position: absolute;left: -9999px}.lomake-ve-solu [type=radio]:checked + label, .lomake-ve-solu [type=radio]:not(:checked) + label {position: relative; padding-left: 28px;cursor: pointer;line-height: 20px;padding-bottom: 10px;display: inline-block;color: #666}.lomake-ve-solu [type=radio]:checked + label:before, .lomake-ve-solu [type=radio]:not(:checked) + label:before {content: '';position: absolute;left: 0;top: 0;width: 18px; height: 18px;border: 1px solid #8e8e8e;border-radius: 100%;background: #fff}
.lomake-ve-solu [type=radio]:checked + label:after, .lomake-ve-solu[type=radio]:not(:checked) + label:after {content: '';width: 12px;height: 12px;background: #9ec72a;position: absolute;top: 4px;left: 4px;border-radius: 100%;-webkit-transition: all .2s ease;transition: all .2s ease}.lomake-ve-solu [type=radio]:not(:checked) + label:after {opacity: 0;-webkit-transform: scale(0);transform: scale(0)}.lomake-ve-solu [type=radio]:checked + label:after {opacity: 1;-webkit-transform: scale(1); transform: scale(1)}input[type="text"].pmvk, input[type="button"].lpainike { width: auto !important;}@media screen and (max-width:1200px) {.lomake-ve-solu input[type=checkbox] + label::before, .lomake-ve-solu input[type=checkbox]:checked + label::before { margin-bottom: 10px}}tr[id^=lomakerivi] {display: grid;grid-template-columns: repeat(auto-fit, minmax(240px, 1fr))}input[type=button], input[type=file], input[type=text], textarea {max-width: var(--max-input-width);height:35px;width: 100% !important;box-sizing: border-box;border: 1px solid #8e8e8e}textarea,.lomakenappi_submit, input[type=file] {height: auto}.lomakenappi_submit {-webkit-appearance: none;-moz-appearance: none;appearance: none;color: var(--button-text-color);font-size: var(--button-font-size);width: auto;border: none !important;border-radius: 6px;height: 45px !important;font-weight: 700;margin-top: 10px;line-height: 100%}tr[id^="lomakerivi"] select {border: 1px solid #888 !important;padding: 10px;border-radius: 4px;appearance: auto;-webkit-appearance: auto;-moz-appearance: auto;-ms-appearance: auto; width: auto !important;}.lpainike, .pmvk {width: auto;height: auto}.lomake-ve-solu {padding-bottom: 5px;padding-right: 10px}tr[id^="lomakerivi"] table tr {grid-gap: 2em;display: grid;grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));}tr[id^="lomakerivi"] table { width: 100%;}.rbcb-table tr {grid-gap: 0 !important;}

 /* Mobilemenu */
.meanmenu-reveal{display:none;font-size:30px!important}.meanmenu-reveal{color:var(--mobilemenu-open-close-color);cursor:pointer;display:block;font-size:1px;font-weight:700;height:47px;line-height:22px;margin-top:0;padding: 8px 10px 0 10px;position:absolute;text-decoration:none;text-indent:-9999em;top:4px;width:39px;}.meanmenu-reveal.meanclose {padding: 12px 12px 4px 12px;}.meanmenu-reveal span{background:var(--mobilemenu-button-background);border-radius:2px;display:block;height:6px;margin-top:4px;line-height:100%!important}.mean-nav{float:left;width:100%;margin-top:var(--mobilemenu-container-height)}.mean-nav ul{padding:0;margin:0;width:100%;list-style-type:none}.mean-nav li a{display:block;float:left;width:90%;padding:10px 5% 10px 5%;font-weight:700;height:auto;margin:0;text-align:left;color:var(--mobilemenu-link-color);border-top:1px solid rgba(255,255,255,.2);text-decoration:none;font-size:14px;background:var(--mobilemenu-link-background);text-transform:uppercase}.mean-nav ul li li a{width:89%;padding:10px 5% 10px 6%;background:var(--mobilemenu-submenu-background)!important;visibility:visible}.mean-nav ul li li li a{width:86%;padding:10px 5% 10px 9%;}.mean-nav ul li li li li a{width:82%;padding:10px 5% 10px 13%;}.mean-nav ul li{position:relative;float:left;width:100%}.mean-nav a.mean-expand{background:var(--mobilemenu-expand-button)!important;border:medium none;border-radius:3px;color:#121a2f;font-weight:700;height:20px!important;margin-top:3px !important;padding:3px 4px 4px!important;line-height: 120%;position:absolute;right:10px;text-align:center!important;top:6px;width:23px!important;z-index:2}.mean-remove{display:none!important}#main-navi-resp{display:none}@media screen and (max-width:1024px) {#mobilemenu-container, #main-navi-resp {display: block !important;}#mobile-logo {display: block;}}.acc-news-wrapper {font-family: var(--google-font);margin: 0;line-height: 120%;font-size:0.9rem;}

/* Accessibility */
#skip-to-content {position: absolute;left: -9999px; z-index: 999; padding: 1em;background-color: black;color: white;opacity: 0; }#skip-to-content:focus {left: 50%; transform: translateX(-50%); opacity: 1;}