:root{
    /* 1300*/
    --pad: clamp(5px, 5.23vw, 68px);
    --widepad: clamp(5px, 5.23vw, 133px);

    /* 1300*/
    --toppad: clamp(40px, 6.15vw, 80px);
    --botpad: clamp(40px, 6.15vw, 80px);

    --insidecontent: 1300px;
    /* 1200 */
    --textblock-padding: clamp(5px, 4.16vw, 50px);

    --edge-cut: 25px;
    --edge-cut-nav: 15px;

    /* 1100 */
    --feed-gap: 20px;

    /* 1300*/
    --font80: clamp(38px, 6.15vw, 80px);
    --font66: clamp(34px, 5.1vw, 66px);
    --font58: clamp(34px, 4.46vw, 58px);
    --font55: clamp(34px, 4.2vw, 55px);
    --font54: clamp(34px, 4.15vw, 54px);
    --font50: clamp(32px, 3.85vw, 50px);
    --font45: clamp(30px, 3.46vw, 45px);
    --font42: clamp(28px, 3.2vw, 42px);
    --font40: clamp(27px, 3.07vw, 40px);
    --font30: clamp(24px, 2.3vw, 30px);
    --font28: clamp(23px, 2.15vw, 28px);
    --font26: clamp(22px, 2vw, 26px);
    --font24: clamp(20px, 1.85vw, 24px);
    --font23: clamp(18px, 1.77vw, 23px);
    --font22: clamp(18px, 1.7vw, 22px);
    --font21: clamp(17px, 1.62vw, 21px);
    --font20: clamp(17px, 1.5vw, 20px);
    --font18: clamp(16px, 1.4vw, 18px);
    --font17: clamp(16px, 1.31vw, 17px);
    --font16: clamp(15px, 1.2vw, 16px);
    --font15: clamp(14px, 1.15vw, 15px);
    --font14: clamp(13px, 1.07vw, 14px);

}

@media(max-width: 1200px){
    :root{
        --pad: clamp(5px, 4.16vw, 68px);
        --widepad: clamp(5px, 4.16vw, 133px);
        --textblock-padding: clamp(10px, 4.16vw, 50px);
    }
}

body{
    color: #000000;
    background: #fff;
}

.container{
    animation: startopa 0.3s linear forwards;
    animation-direction: alternate;
    opacity: 0.7;
    position: relative;
}

@keyframes startopa{
    from {opacity: 0.7; }
    to { opacity: 1;}
}

.project-pads{
    padding-left: var(--pad);
    padding-right: var(--pad);   
}

.project-pads-left{
    padding-left: var(--pad);
}

.project-pads-right{
    padding-right: var(--pad);
}

.topbotpad{
    padding-top: var(--toppad);
    padding-bottom: var(--botpad);
}

.toppad{
    padding-top: var(--toppad); 
}

.botpad{
    padding-bottom: var(--botpad);
}

h1, h2, h3, h4, h5, h6{
    font-family: "Manrope", sans-serif;
    font-style: normal;
    font-optical-sizing: auto;
}

h1{
    font-size: var(--font50);
    font-family: "Manrope", sans-serif;
    font-weight: 700;
    letter-spacing: -3%;
    margin-bottom: 30px;
}

.h145 h1{
    font-size: var(--font45);
}

h2{
    font-size: var(--font40);
    font-weight: 600;
    letter-spacing: -1%;
    /* 1000 */
    margin-bottom: clamp(20px, 4vw, 40px);
}

h3{
    font-size: var(--font26);
    font-weight: 600;
    letter-spacing: -1%;
}

h4{
    font-size: var(--font23);
}

.h424 h4{
    font-size: var(--font24);
}

h5{
    font-size: var(--font21);
}

h6{
    font-size: var(--font15);
    font-weight: 600;
}

.h616 h6{
    font-size: var(--font16);
}

p, a, li{
    font-family: "Manrope", sans-serif;
    font-optical-sizing: auto;
}

p{
    font-size: var(--font18);
    padding-bottom: 1em;
    line-height: 1.4em;
    font-weight: 400;
    letter-spacing: 0;
}

.p24 p{
    font-size: var(--font24);
}

.p23 p{
    font-size: var(--font23);
}

.p20 p{
    font-size: var(--font20);
}

.p18 p{
    font-size: var(--font18);
}

.p16 p{
    font-size: var(--font16);
}

.p15 p{
    font-size: var(--font15);
}

.p14 p{
    font-size: var(--font14);
}

.numberboxes-plate-text p{
    font-weight: 600;
}

a, li{
    font-size: var(--font18);
}

.a15 a{
    font-size: var(--font15);
}

footer a, footer p, footer li{
    font-size: var(--font15);
}


.btn{
    font-size: var(--font16);
    display: grid;
    width: fit-content;
    max-width: 100%;
    padding: 15px 30px;
    font-weight: 400;
}

.btn.green{
    background-color: #008839;
    color: #fff;
}

.btn.green:hover{
    background-color: #007A33;
}

.btn.orange{
    background-color: #FF790A;
    color: #020202;
}

.btn.orange:hover{
    background-color: #FF8622;
}

.btn.no-bacground{
    font-size: var(--font15);
    padding: 0px 10px 10px 0px;
    gap: 10px;
    grid-template-columns: auto 40px;
}

.btn svg{
    align-self: center;
    height: var(--font22);
    width: 40px;
    margin-left: 4px;
}

.btn.no-bacground svg{
    height: var(--font16);
}

.btn:hover svg{
    animation: wiggle 0.6s ease-in-out infinite;
}

@keyframes wiggle{
	0%   { margin-left: 4px; }
	50%  { margin-left: 0px; }
	100% { margin-left: 4px; }
}

@keyframes wiggle2{
	0%   { margin-right: 0px; }
	50%  { margin-right: 4px; }
	100% { margin-right: 0px; }
}

.thenav-li{
    font-weight: 600;
}

.insidecontent-area{
    max-width: var(--insidecontent);
    margin: 0 auto;
}

#banner-content{
    background: rgba(255,255,255, 0.8);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    align-self: end;
    width: calc(50% - var(--pad) - var(--textblock-padding));
    padding: var(--textblock-padding);
    margin-left: var(--pad);
    clip-path: polygon(
    0 var(--edge-cut),
    var(--edge-cut) 0,
    calc(100% - var(--edge-cut)) 0,
    100% var(--edge-cut),
    100% 100%,
    0 100%
    );
}

.small-services-feedpart{
    gap: var(--feed-gap);
}

.small-services-card-toppart img{
    aspect-ratio: 10/7.8;
}

.small-services-card-bottompart h3{
    margin-top: 20px;
    margin-bottom: 30px;
}

.small-services-card{
    cursor: pointer;
}

.small-services-card-arrowblock{
    background-color: rgba(0, 107, 45, 0.65);
    align-self: end;
    justify-self: end;
    padding: 20px 15px;
    display: grid;
    color: #fff;
    position: relative;
    max-height: 20px;
}

/*
.small-services-card-arrowblock.text:hover{
    gap: 20px;
    grid-template-columns: max-content 40px;
} */
/*
.small-services-feedpart a:hover .small-services-card-arrowblock.text{
    gap: 20px;
    grid-template-columns: max-content 40px;
}*/

.small-services-card-arrowblock h4{
    font-size: var(--font20);
    width: 0;
    overflow: hidden;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.4s ease;
    position: absolute;
    margin-top: -1px;
    font-weight: 400;
}

/*
.small-services-card-arrowblock:hover h4{
    width: 100%;
    transform: scaleX(1);
    position: relative;
} */


/*.small-services-feedpart a:hover h4{
    width: 100%;
    transform: scaleX(1);
    position: relative;
}*/

.small-services-card-toppart img{
    clip-path: polygon( 0 var(--edge-cut), var(--edge-cut) 0, 100% 0, 100% 100%, 0 100% );
}

.bcg-white{
    background-color: #fff;
    color: #000;
}

.bcg-light-green{
    background-color: #DFF7E9;
    color: #000;
}

.multiarea-text-content.no-right{
    padding: var(--textblock-padding) 0px var(--textblock-padding) var(--textblock-padding);
}

.multiarea-text-content.no-left{
    padding: var(--textblock-padding) var(--textblock-padding) var(--textblock-padding) 0px;
}

.multiarea-image-content img{
    aspect-ratio: 10/8.43;
    clip-path: polygon( 0 var(--edge-cut), var(--edge-cut) 0, calc(100% - var(--edge-cut)) 0, 100% var(--edge-cut), 100% calc(100% - var(--edge-cut)), calc(100% - var(--edge-cut)) 100%, var(--edge-cut) 100%, 0 calc(100% - var(--edge-cut)) );
}


#bcgimagetext{
    color: #fff;
}

.bcgimagetext-text-helper{
    width: 100%;
    max-width: 670px;
}

#bcgimagetext img{
    min-height: 100%;
    aspect-ratio: 10/4.62;
    filter: brightness(65%);
}

#bcgimagetext h2{
    text-align: center;
}

.bcgimagetext-text{
    align-self: center;
    justify-self: center;
    z-index: 1;
    margin-top: 100px;
    margin-bottom: 100px;
}

.num-boxes-green{
    background-color: #88E6AF;
    color: #008839;
}

.num-boxes-orange{
    background-color: #FF790A;
    color: #FF790A;
}

.numberboxes-plate-text .number-text{
    color: #000;
}

.left-cut{
    clip-path: polygon( 0 var(--edge-cut), var(--edge-cut) 0, 100% 0, 100% 100%, 0 100% );
}

.cutedges{
    clip-path: polygon( 0 var(--edge-cut), var(--edge-cut) 0, calc(100% - var(--edge-cut)) 0, 100% var(--edge-cut), 100% calc(100% - var(--edge-cut)), calc(100% - var(--edge-cut)) 100%, var(--edge-cut) 100%, 0 calc(100% - var(--edge-cut)) );
}

.numberboxes-plate-border{
    padding: 1px;
    display: inherit;
}

.numberboxes-plate-text{
    background-color: #fff;
    /* 1200 */
    padding: var(--textblock-padding) clamp(5px, 3.33vw, 40px) 20px;
    display: grid;
    grid-template-rows: var(--font80) auto;
}

.numberboxes-plate-text p.big{
    font-size: var(--font80);
}

.numberboxes-plate-text p.small{
    font-size: var(--font50);
}

.numberboxes-plate-text p.big, .numberboxes-plate-text p.small{
    padding-bottom: 0px;
    line-height: 1;
    align-self: end;
}

#numberboxes .ugrid3{
    gap: var(--feed-gap);
}

.multiarea-text-content li{
    list-style-type: square;
}

.multiarea-text-content ul li::marker{
    color: #008839;
}

.quoteimagebox-right-switch, .quotewhiteimagebox-right-switch{
    align-self: end;
    justify-self: end;
    gap: 10px;
    margin-bottom: 40px;
}

#quoteimageboxes{
    background-color: #DFF7E9;
}

.quoteimagebox, .quotewhiteimagebox{
    opacity: 0;
    transition: opacity 0.5s ease-out;
}

.quoteimagebox.active, .quotewhiteimagebox.active{
    opacity: 1;
}

.quoteimagebox-right-switch-dot, .quotewhiteimagebox-right-switch-dot{
    cursor: pointer;
    background-color: #fff;
    height: 15px;
    width: 15px;
    z-index: 1;
}

.quotewhiteimagebox-right-switch-dot{
    border: 1px solid #FF790A;
}


.quoteimagebox-right-switch-dot.active{
    background-color: #008839;
}

.quotewhiteimagebox-right-switch-dot.active{
    background-color: #FF790A;
}

.quoteimagebox-left{
    align-self: end;
}

.quoteimagebox-left img, .quotewhiteimagebox-left img{
    aspect-ratio: 10/8.2;
}

.quoteimagebox-right, .quotewhiteimagebox-right{
    justify-self: end;
    align-self: start;
    margin-bottom: 80px;
    z-index: 1;
}

.quoteimagebox.ugrid12, .quotewhiteimagebox.ugrid12{
    /* 1100 */
    gap: clamp(20px, 3.64vw, 40px);
}

.quotewhiteimagebox-left img{
    aspect-ratio: 9.4/10;
}

#multiarea .ugrid21 .no-left{
    padding: var(--textblock-padding);
}

#multiarea .ugrid21 .multiarea-right .multiarea-image-content img{
    clip-path: polygon( 0 0, calc(100% - var(--edge-cut)) 0, 100% var(--edge-cut), 100% calc(100% - var(--edge-cut)), calc(100% - var(--edge-cut)) 100%, 0 100% );
    height: inherit;
    min-height: 100%;
}

#multiarea .ugrid12 .multiarea-left .multiarea-image-content img{
    clip-path: polygon(var(--edge-cut) 0, 100% 0, 100% 100%, var(--edge-cut) 100%, 0 calc(100% - var(--edge-cut)), 0 var(--edge-cut));
    height: inherit;
    min-height: 100%;
}

#multiarea .ugrid21 .multiarea-right .multiarea-image-content, #multiarea .ugrid12 .multiarea-left .multiarea-image-content{
    height: 100%;
}

#multiarea .ugrid21 .multiarea-left .multiarea-text-content, #multiarea .ugrid12 .multiarea-right .multiarea-text-content{
    padding: var(--textblock-padding);
}


.news-card img{
    aspect-ratio: 10/5.62;
}

.news-card-category{
    color: #008839;
}

.news-card-info{
    gap: 7px;
}

.newsfeed-small-feedpart{
    gap: var(--feed-gap);
}

.textbtn-content, .quotewhiteimageboxes-helper{
    max-width: 775px;
    width: 100%;
    margin: 0 auto;
}

.videoimagetext-content{
    max-width: 875px;
    width: 100%;
    margin: 0 auto;
}

.videoimagetext-content-media.kuvatext{
    margin-bottom: 20px;
}

.textbtn-content p a{
    color: #008839;
    display: inline;
    text-decoration: none;
}

.textbtn-content ul li::marker{
    color: #008839;
}

.textbtn-content li{
  list-style-type: square;
}

.reference-smallfeed-feedpart{
    width: 100%;
    margin: 0 auto;
    max-width: 775px;
}

.reference-smallfeed-feedpart-helper{
    max-width: 670px;
    width: 100%;
    border-top: 1px solid #008839;
}

.reference-smallfeed-feedpart-helper .reference-card{
    grid-template: "part1 part2" "part3 part4" "part5 part5";
    grid-template-columns: 1fr 1fr;
    /* 1000 */
    gap: 30px clamp(30px, 9vw, 90px);
}


.reference-smallfeed-feedpart-helper .reference-card .reference-card-part1{
    grid-area: part1;
}

.reference-smallfeed-feedpart-helper .reference-card .reference-card-part2{
    grid-area: part2;
}

.reference-smallfeed-feedpart-helper .reference-card .reference-card-part3{
    grid-area: part3;
}

.reference-smallfeed-feedpart-helper .reference-card .reference-card-part4{
    grid-area: part4;
}

.reference-smallfeed-feedpart-helper .reference-card .reference-card-part5{
    grid-area: part5;
}

.reference-smallfeed-feedpart-helper .reference-card .reference-card-part1 h6{
    color: #008839;
}

.reference-card{
    border-bottom: 1px solid #008839;
    padding: 40px 0px 30px;
}

.reference-smallfeed-buttonpart{
    margin-top: 30px;
}


/* FAQ Area */

.faq-item, .faq-question, .faq-area, .q-toggle{
    display: grid;
}

.faq-item{
    transition: none;
    -moz-transition: none;
    -webkit-transition: none;
    -o-transition: none;
    grid-template-rows: auto 0fr;
    border-bottom: 1px solid #008839;
}

.faq-question{
    grid-template-columns: auto max-content;
    cursor: pointer;
    grid-template-rows: max-content auto;
}


.q-toggle-linearea{
    width: 25px;
    height: 25px;
    background-color: #FFF;
    border-radius: 50%;
}

.q-toggle-line1{
    width: 3px;
    height: 17px;
}

.q-toggle-line2{
    width: 17px;
    height: 3px;
}

.q-toggle-line1, .q-toggle-line2{
    background-color: #CB3189;
    align-self: center;
    justify-self: center;
}

.faq-item.active {
    grid-template-rows: auto 1fr;
}

.faq-item.active .faq-answer{
    padding: 10px 30px 20px;
    border: unset;
}

.faq-item.active .q-toggle-line1{
    transform: rotate(90deg);
}

.q-text{
    font-size: var(--font22);
    padding: 15px 30px 10px;
}


.faq-answer{
    transition: none;
    -moz-transition: none;
    -webkit-transition: none;
    -o-transition: none;
    padding: 10px 10px 0px;
    overflow: hidden;
    border-top: none;
}

.faq-area{
    gap: 10px;
    max-width: 1000px;
}

.q-toggle{
    align-content: center;
    padding: 0px 15px;
}

.q-toggle, .q-text{
    background-color: #fff;
    color: #000;
}

.greenline{
    background-color: #008839;
    width: 100%;
    height: 1px;
}

.faq-section-helper{
    max-width: 775px;
    width: 100%;
    margin: 0 auto;
}

.q-toggle-triangle{
    align-self: center;
    justify-self: center;
}

.faq-item.active .q-toggle-triangle{
    transform: scaleY(-1);
}

/* FAQ end */

#stickytxt-area{
    background-color: #DFF7E9;
    color: #000000;
}

.stickytxt-area-content-left{
    padding: 0px var(--textblock-padding) var(--textblock-padding) 0px;
}

.stickytxt-area-content-left{
    position: sticky;
    top: 40px;
    align-self: start;
}

.footer-toppart-part3-images{
    aspect-ratio: 1/1;
    max-width: 150px;
    object-fit: contain;
}

.staff-card-name{
    color: #008839;
    font-weight: 600;
}

.staff-card-title{
    margin-bottom: 20px;
}

.staff-card img{
    aspect-ratio: 9.4/10;
    margin-bottom: 20px;
    object-position: 50% 0%;
}

.staff-card{
    margin-bottom: 60px;
    max-width: 400px;
}

.stafffeed-helper.col-3{
    gap: 0px var(--feed-gap);
}

.staff-card a{
    font-size: var(--font18);
    text-decoration: none;
    color: inherit;
}

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

.multiarea-history-content.no-right{
    padding: var(--textblock-padding) 0px var(--textblock-padding) var(--textblock-padding);
}

.multiarea-history-content.no-left{
    padding: var(--textblock-padding) var(--textblock-padding) var(--textblock-padding) 0px;
}

.multiarea-history-content-years-helper{
    grid-template-columns: 80px auto;
    max-width: 85%;
    margin: 0 auto;
}

.multiarea-history-content-years{
    border-bottom: 1px solid #008839;
    padding-top: 21px;
    padding-bottom: 15px;
}

.multiarea-history-content-years:first-child{
    border-top: 1px solid #008839;
}

.multiarea-history-content-years-helper h3{
    margin-top: -6px;
    font-weight: 600;
}

.reference-bigfeed-feed-services-cat, .reference-bigfeed-feed-areas-cat, .reference-bigfeed-feed-type-cat{
    border: 1px solid #008839;
    color: #000;
    padding: 5px 20px;
    cursor: pointer;
}

.reference-bigfeed-feed-services-cat.active, .reference-bigfeed-feed-areas-cat.active, .reference-bigfeed-feed-type-cat.active{
    background-color: #008839;
    border: 1px solid #008839;
    color: #fff;
}

.reference-bigfeed-feed-services-cats-cats, .reference-bigfeed-feed-areas-cats-cats, .reference-bigfeed-feed-type-cats-cats{
    gap: 7px;
}

.reference-bigfeed-card{
    display: none;
}

.reference-bigfeed-card:nth-child(-n+15){
    display: block;
}

#reference-notfound{
    display: none;
    margin-top: 40px;
}

.reference-bigfeed-feed-feedpart .reference-card{
    grid-template-columns: 1fr 1fr 1fr 50px;
    gap: 0px 40px;
}

.reference-bigfeed-feed-areas-cats-cats{
    border-bottom: 1px solid #008839;
    /* 1300 */
    padding-bottom: clamp(40px, 5.8vw, 75px);
}

.reference-bigfeed-card .reference-card-part1 h6{
    color: #008839;
}

.textleft .textleft-content{
    max-width: 775px;
    width: 100%;
}

#newsfeed-full #usimplefeed-categories p{
    padding-bottom: 0px;
    padding: 5px 20px;
    cursor: pointer;
}

#newsfeed-full .usimplefeed-cats{
    border: 1px solid #000;
    color: #000;
}

#newsfeed-full .usimplefeed-cats.active{
    background-color: #008839;
    border: 1px solid #008839;
    color: #fff;
}

#newsfeed-full #usimplefeed-categories{
    gap: 7px;
}

.himmel.active{
    background-color: #008839;
    border: 2px solid #008839;
    color: #fff;
}

.himmel{
    color: #000;
    border: 2px solid #008839;
    font-size: var(--font16);
}

#himmeli {
    margin: 0 auto;
    margin-top: clamp(30px, 3.3vw, 50px);
    margin-bottom: 50px;
}

#single-news-banner{
    padding-top: 150px;
}

.single-news-banner-toppart-infoline{
    gap: 7px;
}

.single-news-banner-toppart-infoline .category-name{
    color: #008839;
}

.nostobox-content{
    background-color: #DFF7E9;
    max-width: 775px;
    width: 100%;
    margin: 0 auto;
}

.nostobox-content-helper{
    padding: var(--textblock-padding);
}

.askomore-content{
    max-width: 775px;
    width: 100%;
    margin: 0 auto;
}

.askomore-content img{
    aspect-ratio: 8.96/10;
}

.askomore-content-helper{
    max-width: 650px;
    width: 100%;
    grid-template-columns: 1fr 1.5fr;
    gap: 25px;
}

.askomore-content-right{
    align-self: center;
}

.askomore-jobtitle{
    margin-bottom: 40px;
}

.askomore-content-right a{
    text-decoration: none;
    color: inherit;
}

.askomore-content-right a:hover{
    text-decoration: underline;
}

.infoboxes-green-card{
    background-color: #DFF7E9;
    padding: 40px 40px 30px;
}

.infoboxes-content-helper{
    gap: var(--feed-gap);
}

.infoboxes-content-bottom{
    max-width: 775px;
    width: 100%;
    margin-top: 40px;
}

.contact-persons-content-helper.col-3{
    /* 1300 */
    gap: clamp(20px, 3.1vw, 40px);
}

.infoboxes-white-card{
    max-width: 275px;
    width: 100%;
}

.faq-section.full .faq-section-helper{
    max-width: unset;
    width: 100%;
    margin: unset;
}

.faq-section.full .faq-section-area.faq-area{
    max-width: 100%;
}

.contact-form-area{
    background-color: #DFF7E9;
}

.contact-form-area-helper{
    /* 1300 */
    gap: clamp(20px, 3.1vw, 40px);
}

.wpcf7-submit{
    background: #008839;
}

.media-card img{
    aspect-ratio: 16/9;
    /* 1200 */
    margin-bottom: clamp(20px, 2.5vw, 30px);
}

.mediabank-content{
    gap: var(--feed-gap);
}

.anchor-buttons-butotns.uflex{
    gap: 10px;
}

footer{
    background-color: #008839;
    color: #fff;
    padding-top: 60px;
    padding-bottom: 35px;
}

#footer-bottom-part3-socialmedia svg{
    height: 20px;
    width: auto;
}

#footer-bottom-part3-socialmedia{
    gap: 10px;
}

#footer-bottom-content{
    border-top: 1px solid #fff;
    margin-top: 35px;
    padding-top: 35px;
}

#footer-bottom-content img{
    width: 90px;
    aspect-ratio: 1/1;
    object-fit: contain;
}

#footer-bottom-content-helper{
    gap: var(--feed-gap);
    grid-column: 2/4;
}

.buttonpart{
    gap: 15px;
    margin-top: 20px;
}

#bcgimagetext .btn{
    margin: 0 auto;
}

#numberboxes p.number-text{
    margin-top: 20px;
}

#multiarea li, .textbtn li{
    line-height: var(--font28);
    font-weight: 400;
}

.news-card-button, .news-card-text{
    margin-top: 20px;
}

.textleft h4, .textbtn h4{
    font-weight: 400;
}

#newsfeed-small .buttonpart, .large-services-feedpart .buttonpart{
    margin-top: 40px;
}

.quotewhiteimagebox-right svg{
    margin-bottom: 30px;
}

.q-text{
    font-size: var(--font26);
    font-weight: 600;
}

.staff-card-title{
    font-size: var(--font18);
    font-weight: 600;
}

.stafffeed-feedpart .subheadline, .plainstafffeed-content-bottom h5{
    margin-bottom: 20px;
}

.stafffeed-item .stafffeed-helper{
    margin-top: 30px;
}

.textbtn h3{
    margin-bottom: 20px;
}

.reference-bigfeed-feed-services-cats-cats, .reference-bigfeed-feed-areas-cats-cats, .reference-bigfeed-feed-type-cats-cats{
    margin-top: 25px;
}

.reference-bigfeed-feed-areas-cats, .reference-bigfeed-feed-type-cats{
    margin-top: 40px;
}

#newsfeed-full #usimplefeed-categories{
    margin-bottom: clamp(40px, 5.8vw, 75px);
}

#newsfeed-full .ajankohtaista-feedsectionhelper.col-3{
    gap: 50px clamp(15px, 1.33vw, 20px);
}

.infoboxes-green-card h3, .contact-persons-content h3{
    margin-bottom: 20px;
}

.infoboxes-white-card h3{
    margin-bottom: 25px;
}

.footer-content.col-4{
    /* 1100 */
    gap: clamp(20px, 3.63vw, 40px);
}

footer a, #footer-bottom-part3-otherlinks p{
    margin-bottom: 10px;
}

#footer-bottom-part3-socialmedia{
    margin-bottom: 15px;
}

#footer-footerlogo img{
    object-fit: contain;
    max-width: 225px;
}

#buttons-section .buttonpart{
    max-width: 775px;
    width: 100%;
    margin: 0 auto;
}


/* Navi */


#thenav-toppart{
    display: grid;
    grid-template-columns: 150px auto max-content;
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 15px;
    padding-bottom: 15px;
    clip-path: polygon( 0 var(--edge-cut-nav), var(--edge-cut-nav) 0, calc(100% - var(--edge-cut-nav)) 0, 100% var(--edge-cut-nav), 100% calc(100% - var(--edge-cut-nav)), calc(100% - var(--edge-cut-nav)) 100%, var(--edge-cut-nav) 100%, 0 calc(100% - var(--edge-cut-nav)) );

}

.thenav-ul{
    display: flex;
    gap: 30px;
}

#thenav-helper{
    color: #F7FCFE;
    width: 100%;
    margin-top: 20px;
}

#thenav{
    position: fixed;
    width: calc(100% - (2 * var(--pad)));
    max-width: calc(1300px - (2 * var(--pad)));
    left: 50%;
    transform: translate(-50%, 0px);
    z-index: 1000;
}

.thenav-li{
    cursor: pointer;
}

#thenav-toppart, #thenav-bottompart{
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    background: rgba(0,107,45, 0.8);
}

#thenav-bottompart{
    background: rgba(255,255,255, 0.84);
    /* 1200 */
    margin-left: clamp(0px, 5.83vw, 70px);
    margin-right: clamp(0px, 5.83vw, 70px);
    margin-top: 10px;
    /* 1100 */
    padding-left: clamp(20px, 4.09vw, 45px);
    padding-right: clamp(20px, 4.09vw, 45px);
}


.undernavs{
    padding-top: 30px;
    padding-bottom: 30px;
    display: none;
    text-align: unset;
}

.undernav-card img{
    aspect-ratio: 9/10;
    width: 200px;
    max-width: 100%;
    object-fit: contain;
    margin: 0 auto;
}

.undernav-bottom{
    gap: clamp(20px, 3.5vw, 80px);
}

#thenav-links{
    align-self: center;
    justify-self: center;
}

#thenav-bottompart{
    position: relative;
    transform: scale(0);
}

#thenav-bottompart.active{
    transform: scale(1);
}

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

#thenav-bottompart #navexit{
    position: absolute;
    top: 25px;
    right: 50px;
    height: 35px;
    cursor: pointer;
}

.undernav-card-content-otherparts{
    margin-top: 30px;
}

.undernav-card-content-otherparts .undernav-card-content h4{
    color: #000;
    font-size: var(--font21);
    font-weight: 600;
    margin-bottom: 15px;
}

.undernav-card-content .undernav-card h4, .undernav-card.first-under h4{
    color: #008839;
    font-size: var(--font17);
    font-weight: 600;
    margin-bottom: 10px;
}

.undernav-card-content .undernav-card h4:hover, .undernav-card.first-under h4:hover {
    text-decoration: underline;
}

.undernav-bottom a, .undernav-bottom h4{
    width: fit-content;
}

.clickable-thenav-li-span{
    display: inline-block;
    margin-left: 8px;
}

#thenav-logopart{
    margin-top: 5px;
    margin-bottom: 10px;
}

/* Navi end */

#banner-link, #single-news-banner-banner-link{
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    width: fit-content;
    height: fit-content;
    background-color: #008839;
    color: #fff;
    padding: 15px 10px;
    align-self: center;
    justify-self: end;
}

#banner-link p, #single-news-banner-banner-link p{
    font-size: var(--font15);
    font-weight: 600;
}

#single-news-banner #single-news-banner-banner-link{
    align-self: end;
    margin-right: calc(-1 * var(--pad));
}

.single-news-banner-toppart-content{
    margin-bottom: 40px;
}

.widebanner-area #banner-content{
    margin-left: var(--widepad);
    max-width: 750px;
}

footer a:hover{
    text-decoration: underline;
}

#footer-bottom-part3-socialmedia a:hover svg{
    transform: scale(1.1);
}

.news-card-image{
    aspect-ratio: 10/5.62;
    overflow: hidden;
    margin-bottom: 20px;
}

.news-card-image:hover img{
    transform: scale(1.1);
}

.nostobox-content-helper h3{
    margin-bottom: 20px;
}

.q-text{
    font-family: "Manrope", sans-serif;
}

.textbtn-content ul, .textbtn-content ol{
    margin-bottom: 18px;
}

.multiarea-text-content p a{
    display: inline-block;
    color: #008839;
    text-decoration: unset;
}

.widebanner-area.wideimg #banner-content{
    margin-top: 250px;
}

.widebanner-area.wideimg img, .insidecontent-area.wide img{
    height: 100%;
    object-fit: cover;
    aspect-ratio: 10/4.5;
}

.insidecontent-area.wide{
    max-width: 100%;
}

.textbtn-content li a{
    display: inline-block;
    color: #008839;
    text-decoration: unset;
}

.reference-bigfeed-toppart-prologue {
    max-width: 775px;
    width: 100%;
}

.reference-bigfeed-feed-services-cat:hover, .reference-bigfeed-feed-areas-cat:hover, .reference-bigfeed-feed-type-cat:hover{
    border: 1px solid #008839;
    background-color: #DFF7E9;
    color: #000;
}

.reference-bigfeed-feed-services-cat.active:hover, .reference-bigfeed-feed-areas-cat.active:hover, .reference-bigfeed-feed-type-cat.active:hover{
    background-color: #008839;
    border: 1px solid #008839;
    color: #fff;
}

.numberboxes-plate-border{
    max-width: 375px;
}

.usimplefeed-section.active .usimple-feed-section-helper .news-card:nth-child(-n+15){
    display: block;
}

#himmeli{
    justify-content: center;
}

/* Burger nav */

#thenav-burger{
    display: none;
}

@media (max-width: 1100px){
    #thenav{
        display: none;
    }
    #thenav-burger{
        display: block;
    }
}

#thenav-burger-top-logopart{
    position: relative;
    z-index: 1;
    width: fit-content;
}

#thenav-burger-top{
    padding-top: 10px;
    padding-bottom: 12px;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    background: rgba(0,107,45, 0.8);
    clip-path: polygon( 0 var(--edge-cut-nav), var(--edge-cut-nav) 0, calc(100% - var(--edge-cut-nav)) 0, 100% var(--edge-cut-nav), 100% calc(100% - var(--edge-cut-nav)), calc(100% - var(--edge-cut-nav)) 100%, var(--edge-cut-nav) 100%, 0 calc(100% - var(--edge-cut-nav)) );
}

.burgers-line{
    background-color: #fff;
    width: 25px;
    height: 2px;
    margin-bottom: 4px;
}

#thenav-burger-top-burger{
    width: fit-content;
    align-self: center;
    justify-self: end;
    cursor: pointer;
}

#thenav-burger-bottom{
    height: 100vh;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    background: rgba(0,107,45, 0.8);
    position: absolute;
    z-index: 100;
    width: 100%;
    transition: transform 0.3s linear;
    transform-origin: top;
    transform: scaleY(0);
    color: #fff;
}

#thenav-burger-bottom.active{
    transform: scaleY(1);
}

#thenav-burger-bottom ul{
    list-style-type: none;
    padding: 0;
    margin: 0;
    padding-bottom: 10px;
}

#thenav-burger-bottom .burger-ul{
    margin-top: 60px;
    padding-left: var(--pad);
    padding-right: 10px;
}

.btext-center{
    justify-self: center;
}

.btext-right{
    justify-self: end;
}


.burger-ul a, .burger-ul li{
    font-family: "Manrope", sans-serif;
    font-style: normal;
    font-optical-sizing: auto;
    font-weight: 600;
    font-size: 18px;
    margin-top: 12px;
}

.burger-ul p{
    font-family: "Manrope", sans-serif;
    font-style: normal;
    font-optical-sizing: auto;
    font-weight: 600;
    font-size: 18px;
}

.burgerchild-ul{
    display: none;
}

.bur-parent-li svg{
    height: 12px;
    margin-left: 12px;
    position: absolute;
    margin-top: 6px;
    display: inline-block;
    rotate: 90deg;
}

.burgerchild-ul li, .burgerchild-ul a{
    color: #fff;
}

.bur-parent-li{
    cursor: pointer;
}

.bur-parent-li.active svg{
    rotate: -90deg;
    margin-top: 6px;
}

#thenav-burger{
    position: fixed;
    z-index: 1000;
    width: calc(100% - (2 * var(--pad)));
    max-width: calc(1300px - (2 * var(--pad)));
    left: 50%;
    transform: translate(-50%, 0);
    margin-top: 5px;
}

#thenav-burger-bottom .btn.longpink{
    margin: 0 auto;
    margin-top: 50px;
    padding: 5px 15px 5px 15px;
    font-size: 14px;
    grid-template-columns: unset;
}

#thenav-burger-bottom .btn.longpink svg{
    display: none;
}

#thenav-burger-top-logopart a{
    width: fit-content;
}

#thenav-burger-top-logopart img{
    height: 50px;
}

#thenav-burger-top.active{
    clip-path: polygon( 0 var(--edge-cut-nav), var(--edge-cut-nav) 0, calc(100% - var(--edge-cut-nav)) 0, 100% var(--edge-cut-nav), 100% 100%, 0 100% );
}

.burgerchild-ul .underlink{
    margin-left: 40px;
}

.burgerchild-ul .burger-linkheadline{
    margin-left: 20px;
}

/* Burger end */

#stickytxt-area h3{
    margin-bottom: 10px;
}



#thenav-burger-top-burger.active #burline1{
    transform: rotate(-45deg);
    position: absolute;
}

#thenav-burger-top-burger.active #burline2{
    transform: rotate(45deg);
}

#thenav-burger-top-burger.active #burline3{
   display: none;
}

.faq-section-area p a{
    display: inline-block;
    text-decoration: none;
    color: #008839;
}

#usimplefeed-content.mobiili .usimplefeed-section.active .usimple-feed-section-helper .news-card:nth-child(-n+15) {
    display: none;
}

#usimplefeed-content.mobiili .usimplefeed-section.active .usimple-feed-section-helper .news-card:nth-child(-n+6) {
    display: block;
}

.reference-bigfeed-card .reference-card-part3 a{
    color: #008839;
}

.reference-card-part5{
    margin-top: 30px;
}

.reference-card-part5 .btn.green{
    padding: 10px 30px;
}

.reference-card-part2 p, .reference-card-part4 p{
    font-weight: 600;
}

.reference-card-part3 a, .reference-card-part3 p{
    font-weight: 700;
}

.reference-smallfeed-feedpart .reference-card-part3 a{
    color: #008839;
}

.anchor-box-buttons-button{
    background-color: #008839;
    color: #FFF;
    grid-template-rows: auto min-content;
    padding: 40px 40px 30px;
    /* 1300 */
    max-width: clamp(210px, 20.38vw, 265px);
}

.anchor-box-buttons{
    gap: var(--feed-gap);
}

.anchor-box-buttons-button svg{
    align-self: end;
    justify-self: end;
    margin-top: 20px;
    margin-right: -20px;
    margin-bottom: -10px;
}

.anchor-box-buttons-button h5{
    font-weight: 600;
}

.anchor-box-buttons-button:hover svg{
    animation: wiggles 0.6s ease-in-out infinite;
}

@keyframes wiggles{
	0%   {margin-right: -20px;}
	50%  {margin-right: -15px;}
	100% {margin-right: -20px;}
}

.nostobox-fullwidth-helper-helper{
    background-color: #DFF7E9;
    color: #000000;
}

.nostobox-fullwidth-helper-image{
    /* 1100 */
    max-width: clamp(200px, 26.36vw, 290px);
    align-self: end;
    justify-self: end;
    margin-bottom: calc(-1 * var(--botpad));
}

.nostobox-fullwidth-helper-content{
    justify-self: center;
    text-align: center; 
}

.toimipisteet-card{
    padding: 1px;
    background-color: #008839;
    display: inherit;
}

.toimipisteet-card-helper{
    padding: 40px 40px 30px;
    background-color: #fff;
}

.toimipisteet-content-bottom{
    gap: var(--feed-gap);
}

.toimipisteet-content-bottom{
    margin-top: clamp(40px, 7vw, 70px);
}

.toimipisteet-card-button{
    margin-top: 40px;
}

.infoboxes-content.narrow{
    max-width: 775px;
    width: 100%;
    margin: 0 auto;
}

.infoboxes-content.narrow p{
    padding-bottom: 0px;
}

.infoboxes-content.narrow .infoboxes-white-card{
    max-width: unset;
}

.toimipisteet-card-toimialue{
    margin-bottom: 20px;
}

.txtandhighlightbox-right{
    background-color: #DFF7E9;
    padding: 40px 40px 30px;
    height: fit-content;
}

.txtandhighlightbox-right h3{
    margin-bottom: 20px;
}

.txtandhighlightbox-right-button{
    margin-top: 20px;
}

.txtandhighlightbox .ugrid21, .plainstafffeed-content-bottom-feed{
    gap: var(--feed-gap);
}

.plainstafffeed-helper{
    max-width: 775px;
    width: 100%;
    margin: 0 auto;
}

.plainstafffeed-content-bottom{
    margin-top: 40px;
}
p.btn.green{
    padding: 15px 30px !important;
}

.toimipisteet-card-helper h3{
    margin-bottom: 7px;
}

.nostobox-content-helper p a, .infoboxes-green-card p a, .contact-form-area-left p a{
    color: #008839;
    display: inline;
    text-decoration: none;
}

.q-text{
    color: #008839;
}

.stickytxt-area-content-left, .stickytxt-area-content-right{
    padding-top: 100px;
}

.stickytxt-area-content-numberarea-button{
    margin-bottom: 20px;
}

@media (max-width:2100px){
    .widebanner-area.wideimg img, .insidecontent-area.wide img{
        aspect-ratio: 10/4.75;
    }
}

@media (max-width:1900px){
    .widebanner-area.wideimg img, .insidecontent-area.wide img{
        aspect-ratio: 10/5;
    }
}

@media(max-width:1700px){
    .widebanner-area.wideimg img, .insidecontent-area.wide img{
        aspect-ratio: 10/5.25;
    }
}

@media(max-width:1500px){
    .widebanner-area.wideimg img, .insidecontent-area.wide img{
        aspect-ratio: 10/6;
    }
}

@media(max-width:1300px){
    .widebanner-area.wideimg img, .insidecontent-area.wide img{
        aspect-ratio: unset;
    }

    .widebanner-area #banner-content{
        margin-left: var(--pad);
    }
}

@media(max-width:1200px){
    .thenav-ul{
        gap: 20px;
    }
}

@media(max-width:1100px){
    .thenav-ul{
        gap: 30px;
    }
}

@media(max-width:1000px){
    .banner-area.ultra-allinone{
        grid-template-rows: max-content auto;
    }

    #banner-content, .widebanner-area.wideimg #banner-content{
        margin-top: 0px;
        grid-row: 2;
        width: calc(100% - var(--pad) - var(--textblock-padding));
        padding-left: 0px;
        padding-bottom: 0px;
    }

    .reference-bigfeed-feed-feedpart .reference-card {
        grid-template-columns: 1fr 1fr;
        gap: 30px 40px;
    }

    .anchor-box-buttons.ugrid4{
        grid-template-columns: 1fr 1fr;
    }
}

@media(max-width:900px){
    .multi-text, .multi-history{
        order: 2;
    }

    .multi-image .multi-textimg{
        order: 1;
    }

    #multiarea .project-pads.ugrid2, #multiarea .ugrid21, #multiarea .ugrid12{
        grid-template-columns: 1fr;
    }

    .multiarea-text-content, .multiarea-text-content.no-right, .multiarea-text-content.no-left{
        padding-left: 0px;
        padding-right: 0px;
        max-width: 775px;
    }

    .multiarea-text-content, .multiarea-text-content.no-right, .multiarea-text-content.no-left{
        padding-top: 30px;
    }

    #numberboxes .ugrid3{
        grid-template-columns: repeat(2, 1fr);
    }

    .numberboxes-plate-text, .nostobox-content-helper{
        padding: 30px;
    }

    #multiarea .ugrid21 .multiarea-left .multiarea-text-content, #multiarea .ugrid12 .multiarea-right .multiarea-text-content {
        padding: 30px;
    }

    .stickytxt-area-content.ugrid2{
        grid-template-columns: 1fr;
    }

    .stickytxt-area-content-left{
        position: unset;
        margin-bottom: 30px;
        padding: 0px;
    }

    .stickytxt-area-content-left, .stickytxt-area-content-right{
        padding-top: 0px;
    }

    #stickytxt-area{
        padding-top: var(--toppad);
    }

    .multiarea-history-content.no-right{
        padding-left: 0px;
        padding-right: 0px;
    }

    .multiarea-history-content-years-helper {
        max-width: unset;
        margin: unset;
        padding-left: 30px;
        padding-right: 30px;
    }

    .contact-form-area-helper.ugrid12{
        grid-template-columns: 1fr;
    }

    .contact-form-area-helper.ugrid12 img{
        max-width: 400px;
    }

    .txtandhighlightbox .ugrid21{
        grid-template-columns: 1fr;
    }

    .txtandhighlightbox-right{
        max-width: 300px;
    }

}

@media(max-width:800px){
    #quoteimageboxes .quoteimagebox.ugrid12{
        grid-template-columns: 1fr;
    }

    #quoteimageboxes .quoteimagebox.ugrid12 .quoteimagebox-left{
        order: 2;
        max-width: 300px;
    }

    #quoteimageboxes .quoteimagebox.ugrid12 .quoteimagebox-right{
        order: 1;
        margin-bottom: 20px;
    }

}

@media(max-width:700px){
    .multiarea-history-content-years-helper {
        padding-left: 20px;
        padding-right: 20px;
    }

    #footer-bottom-content-helper{
        grid-column: 1/5;
    }

    
}

@media(max-width:600px){
    #numberboxes .ugrid3 {
        grid-template-columns: 1fr;
    }

    #quotewhiteimageboxes .quotewhiteimagebox.ugrid12{
        grid-template-columns: 1fr;
    }

    #quotewhiteimageboxes .quotewhiteimagebox.ugrid12 .quotewhiteimagebox-left{
        max-width: 300px;
    }

    .quotewhiteimagebox-right svg {
        margin-bottom: 10px;
        max-width: 40px;
    }

    #banner-link, #single-news-banner-banner-link{
        display: none;
    }

    .reference-bigfeed-feed-feedpart .reference-card{
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .reference-smallfeed-feedpart-helper .reference-card{
        grid-template: "part1" "part2" "part3" "part4" "part5";
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .anchor-box-buttons.ugrid4{
        grid-template-columns: 1fr;
    }
}

@media(max-width:500px){
    .btn{
        padding: 15px 20px;
    }

    #quoteimageboxes .quoteimagebox.ugrid12 .quoteimagebox-left {
        max-width: 50%;
    }

    .q-text {
        font-size: var(--font22);
        font-weight: 500;
        line-height: 1.3;
        padding: 10px 30px 12px;
    }

    .infoboxes-green-card, .txtandhighlightbox-right, .toimipisteet-card-helper{
        padding: 40px 30px 30px;
    }

    .anchor-box-buttons-button{
        padding: 40px 40px 30px 30px;
    }
}

@media(max-width:400px){
    .q-text {
        font-size: var(--font20);
        font-weight: 500;
        line-height: 1.3;
        padding: 10px 0px 12px;
    }

    .faq-item.active .faq-answer{
        padding: 10px 0px 20px;
    }

    .multiarea-history-content-years-helper{
        padding-left: 0px;
        padding-right: 0px;
    }

    .infoboxes-green-card, .txtandhighlightbox-right, .toimipisteet-card-helper{
        padding: 40px 20px 30px;
    }

    .anchor-box-buttons-button{
        padding: 40px 40px 30px 20px;
    }

    .burger-ul a, .burger-ul li, .burger-ul p{
        font-size: 16px;
    }

    #thenav-burger-top-logopart img {
        height: 50px;
    }
}