:root {
   --grid-gap: 1em 2em;
   --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(60px, 4vw), 80px);
 }

/* CSS UPD */

body,a,li,ul,div,h1,h2,h3,h4,h5,h6,p,td {font-family: 'Montserrat', sans-serif !important;}

#content-wrapper, #footer-wrapper, #banneri-wrapper, #lasku-wrapper, #referenssi-oikea {background:#fff}
#lasku-wrapper td, #lasku-wrapper td p {color: #000 !important;}
#instagram {border:none}
.narrow-col {max-width:1200px; width:90%; padding:0;}
ul.main-navi li#koti-ikoni a{padding:24px 30px}
ul.main-navi li a {color:#000}
#valikko-wrapper{background:none;border-bottom: 1px solid #000;position: fixed;background: #fff;z-index: 200000000;}

ul.main-navi{width:100%;display: flex;align-items: center;}
ul.main-navi li a:hover {background:none; color:#a7a7a7}
#fronthdr{margin-top:80px;}

/* General classes */
.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}

/* 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))}}
.referenssisisennys.dgrid-l-m-cols {grid-gap:2em}.referenssisisennys.dgrid-l-m-cols .erikoiskuva{max-width: 100%;height: auto; width:100%}
/* 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)}

/* Content */
h1 {text-shadow:none; color:#000; display:none;}
.sivuotsikko {background:none; padding:0;}
#referenssi-lyhytkuvaus{padding: 0;width: 100%;}
#logoupd img {max-width: 240px;background: #fff;padding: 20px 40px;}
.reunus.content-col {background: #fff;}
ul.main-navi li a {padding: 35px 91px;}
#logoupd img {padding:0;}
li#arkkitehtisuunnittelu2 a, li#referenssit3 a, li#suunnittelija4 a, li#kivitaloedustus5 a, li#blogi6 a, li#yhteys7 a, li#instagram8 a {background: none;border-bottom: 5px solid #000;padding:40px 91px 35px 91px !important}
a#kotilinkki img {max-width: 18px;height: auto;}
#kohdecol-page h1 {display:block;font-size:min(max(2rem, 3vw), 3rem); margin-bottom:2vw}

#content-wrapper {padding:0;}
#contentitem-4 {width:100%; padding:0;}
.tuotelistaussivu-palsta {position:relative; background:#000}
.tuotelistaussivu-kuva img {opacity:1; transition: 0.3s;cursor:pointer;}
.tuotelistaussivu-kuva img:hover {opacity:0.2;cursor:pointer;}
.tuotelistaussivu-otsikko {display:none; top:0; left:0;height:100%; width:100%; position:absolute; z-index:10; box-sizing: border-box;justify-content: center;align-items: center; pointer-events:none;}
.tuotelistaussivu-palsta:hover > .tuotelistaussivu-otsikko {display:flex; }
.tuotelistaussivu-otsikko a {color:#000;display: flex;width: 100%;height: 100%;align-items: center;justify-content: space-between;flex-direction:column; text-decoration:none;}
.tuotelistaussivu-otsikko a:after {content:"Tutustu kohteeseen ›"; display:block; background:#fff; width:max-content; padding:10px 20px; line-height: 120%; color:#000 height:35px; font-size:1.1rem; margin-top:1em}
#referenssi-txt {padding:0 4em}
#referenssi-txt p {font-size:1.2rem}
#referenssit-wrapper .tuotelistaussivu-kuva {height:unset;}
#referenssit-wrapper div.tuotelistaussivu-palsta {display:block !important}

/* Image gallery */
.kuvagalleriagrid, #contentitem-4 table tr td, #referenssit-wrapper table tr td{display: grid;grid-template-columns: repeat(3,1fr);grid-gap: 1px;}.kuvagalleriakuvatausta {width: 100% !important;height: auto !important;margin: 0 !important}.kuvagalleriakuvatausta .kuva {width: 100%;max-height:unset;max-width: 100%;padding: 0 !important;height: min(max(160px,20vw),400px) !important;object-fit: cover;}
.tuotelistaussivu-palsta{position:relative;float: none;box-shadow: unset;margin: 0 auto;width: 100%;}.tuotelistaussivu-kuva {height:auto;}.tuotelistaussivu-kuva img {width: 100%;max-height:unset;max-width: 100%;object-fit: cover;padding: 0 !important;height: min(max(260px,20vw),400px) !important;object-fit: cover;}
@media screen and (max-width:1660px) {#valikko-wrapper .center-col {width: 100% !important;grid-template-columns: 1fr 3fr !important;}.main-navi{display:flex; justify-content: space-evenly;}#logoupd img {max-width: 200px;width: 100%;height: auto;min-width: 160px;}ul.main-navi li a{padding:40px 0 !important;}li#arkkitehtisuunnittelu2 a, li#referenssit3 a, li#suunnittelija4 a, li#kivitaloedustus5 a, li#blogi6 a, li#yhteys7 a, li#instagram8 a {background: none;border-bottom: 5px solid #000;padding:40px 0 35px 0 !important}}
@media screen and (max-width:1280px) {.referenssisisennys.dgrid-l-m-cols{grid-template-columns:1fr} #referenssi-txt{width: 1000px; margin: 0 auto;padding: 2em 0 0 0;}}
@media screen and (max-width:1024px) {#contentitem-4 table tr td, #referenssit-wrapper table tr td {grid-template-columns: repeat(2,1fr);}#referenssi-txt{width: 760px;}.tuotelistaussivu-otsikko {height:auto; top:unset; bottom:0;display:flex;display: flex;background: rgba(0,0,0,0.6);padding: 10px 5% 20px 5%;}.tuotelistaussivu-kuva img:hover {opacity:1;cursor:pointer;}.tuotelistaussivu-otsikko a::after {padding: 5px 20px;height: 17px;font-size: 0.8rem;}}
@media screen and (max-width:765px) {#semio_side_float_bar_open {width: 35px !important;background-size: 35px !important;}#semio_side_float_bar_open{top:40% !important}#referenssi-txt{width: 94%;}#fronthdr, #header-alasivu {margin-top: 54px !important;} #logo {display:block !important; position:fixed}.mean-container .mean-bar {position: fixed;}.mean-container a.meanmenu-reveal span {background: #212121;}.mean-currentpage{color: #212121;}.mean-container .mean-bar {background: #fff;border-bottom: 1px solid #212121;}.mean-container .mean-nav{background:#000;}.mean-nav > ul { height:100vh; overflow: auto;}.mean-container a.meanmenu-reveal{color:#000 !important}}
@media screen and (max-width:575px) {#contentitem-4 table tr td, #referenssit-wrapper table tr td {grid-template-columns: 1fr;grid-gap: 1.3em;}.tuotelistaussivu-kuva img  {height: min(max(320px,25vw),400px) !important} .kuvagalleriagrid {grid-template-columns: repeat(2, 1fr)}.kuvagalleriakuvatausta .kuva{height: 150px}}
@media screen and (max-width:480px) {.kuva, .kuva2 {float: none !important;clear: both;padding: 20px 0; box-sizing:border-box;}}

@media screen and (max-width:860px) {#referenssi-txt{max-width:90%}}

.refekuvakaruselli {position:relative;width:100%; max-height:unset;display:flex; justify-content: center; align-items:center; flex-direction:column}
.refekuvakaruselli .kuvagalleriagrid {grid-template-columns:1fr}
.refekuvakaruselli .kuvagalleriakuvatausta .kuva {height:auto !important;padding:0 !important;width: 100% !important;object-fit: cover;min-height:250px;max-height: 800px;}
.refekuvakaruselli div {width:100%}
.prev,.next { cursor: pointer;position: absolute;top: 40%;width: auto;padding: 16px;margin-top: -50px;color: white;font-weight: bold;font-size: 20px;border-radius: 0 3px 3px 0;user-select: none;-webkit-user-select: none;background: rgba(0,0,0,0.7);width: 20px;height: 20px;border-radius: 50px;display: flex;justify-content: center;align-items: center;margin-left: 1em;}
.next {right: 0; border-radius: 50px; margin-right:1em}
.kuvagalleriagrid {width:100%}
.kuvagalleriakuvatausta a {pointer-events:none;}
.prev:hover,.next:hover {background-color: rgba(0, 0, 0, 0.8);}
#slider-browsing {position: absolute; width:100%;}
.refekuvakaruselli .webionappi {width: max-content;}
@media screen and (max-width:1280px) {#kohdecol-page {padding-top: 90px !important;}.refekuvakaruselli .kuvagalleriakuvatausta .kuva {max-height: 600px;}}
@media screen and (max-width:1024px) {.refekuvakaruselli .kuvagalleriakuvatausta .kuva {max-height: 500px;}}
@media screen and (max-width:768px) {#kohdecol-page {padding-top: 50px !important;}}

.hkunta-tableelement {width:100% !important}
.hkunta-tableelement tr {display: grid !important;grid-template-columns: 1fr 3fr 1fr 3fr;grid-gap: 2em;height:auto !important;padding-bottom: 2em;}
.hkunta-tableelement td {width:100% !important; height:auto !important}
.lomakeotsikko {color:#000 !important; font-weight:400;line-height:160%}

@media screen and (max-width:720px) {.hkunta-tableelement tr {grid-template-columns: 1fr 3fr; grid-gap:1em}}
@media screen and (max-width:375px) {.hkunta-tableelement tr {grid-template-columns: 1fr;}.hkunta-tableelement td {text-align: center;}.hkunta-tableelement td img {display:block;margin:0 auto !important }}

.threecoltable,.threecoltable tbody,.threecoltable tr, .threecoltable td{width:100% !important; height:auto !important; box-sizing:border-box;}
.threecoltable tr {display:grid; grid-template-columns:1fr 1fr 1fr; grid-gap:1em;align-items:center;}
.threecoltable td {padding:1em; height: 100% !important;}

@media screen and (max-width:820px) {.threecoltable tr {display:grid; grid-template-columns:1fr 1fr}#table-overflow{overflow-x: auto;width: 90vw;}#table-overflow table {width: 100%;min-width: 800px;}}
@media screen and (max-width:768px) {.threecoltable tr {grid-gap: 10px;}}
@media screen and (max-width:575px) {.threecoltable tr {display:grid; grid-template-columns:1fr} .threecoltable tr img {max-width: 15vw;min-width: 60px;}#table-overflow::before {content: "-> Rullaa taulukkoa oikealle ->";text-align: right;display: block;width: 100%;font-style: italic;color: #c3c3c3;margin-bottom: 10px;border-bottom: 1px solid #f2ebeb;padding-bottom: 10px;}}