@font-face {
  font-family: 'General Sans';
  src: url('/wp-content/themes/netello_fi/fonts/General_Sans/GeneralSans-Bold.woff2') format('woff2'), url('/wp-content/themes/netello/fonts/General_Sans/GeneralSans-Bold.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'General Sans';
  src: url('/wp-content/themes/netello_fi/fonts/General_Sans/GeneralSans-Semibold.woff2') format('woff2'), url('/wp-content/themes/netello/fonts/General_Sans/GeneralSan-Semibold.woff') format('woff');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'General Sans';
  src: url('/wp-content/themes/netello_fi/fonts/General_Sans/GeneralSans-Regular.woff2') format('woff2'), url('/wp-content/themes/netello/fonts/General_Sans/GeneralSan-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}


@font-face {
  font-family: 'General Sans';
  src: url('/wp-content/themes/netello_fi/fonts/General_Sans/GeneralSans-Italic.woff2') format('woff2'), url('/wp-content/themes/netello/fonts/General_Sans/GeneralSan-Italic.woff') format('woff');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
body p, body li, body a, body div, body strong, body b {
font-family: "DM Sans", "Open Sans", sans-serif !important;
}

h1,h2,h3,h4,h5 {
font-family: "General Sans", "Open Sans", sans-serif !important;
font-weight: 700 !important;
text-wrap: balance;
line-height: 130% !important;
color: #000;
word-break: break-word;
}

body h1, body h2 {
    line-height: 1.1875em !important;
}
    
.content h1, .content h2, .content h3, .content h4 {
  color: #000;
}
html body .content h1 {
  font-size: clamp(2.5rem, 2.1875rem + 1vw, 3rem);
  margin-top: 2.5rem;
  margin-bottom: 1rem; 
}

html body .content h2, html body main.site-main h2 {
  font-size: clamp(2rem, 1.5946rem + 1.7297vw, 3rem);
  margin-top: 2rem;
  margin-bottom: 2rem; 
}
html body .content h2> span, html body main.site-main h2>span {
  font-weight: inherit;
}
html body .content h2> span>span, html body main.site-main h2>span>span {
  font-weight: inherit;
}


body .banner h1, body .banner .otsikko {
font-family: "General Sans", "Open Sans", sans-serif !important;
font-weight: 700 !important;
line-height: 1.1875em !important;
text-wrap: balance;
}

.frontpage-hero .sisalto h1 {
font-family: "General Sans", "Open Sans", sans-serif !important;

}

html body .reunaviivalla {
    background-color: #f6f6f4 !important;
    border-color: #E31E2C;
    padding: 2rem 2.5rem;
}

@media (max-width: 600px) {
    html body .reunaviivalla {
        padding: 1rem 1.5rem;
    }
}

body .content h3 {
    margin-top: 2rem;
    margin-bottom: 1rem;
}

body .content h2, body .content .h3, body .content h4 {
	font-weight: 700 !important;
}
html .content ul li{
    line-height: inherit;
    margin-bottom: 0.75em;
    padding-left: 1.5em;
}
html .content ul li:before {
    content: "";
    width: 0.75em;
    height: 0.75em;
    position: absolute;
    line-height: inherit;
    left: 0;
    top: 0.375em;
    border-radius: 100%;
    border: 3px solid #E31E2C;
}
.content nav#sivumenu ul li:before {
display: none !important;

}


body.page-template-template-sivumenullinen .container > .row > .col-md-9 {
    max-width: initial !important;
}
body.page-template-template-sivumenullinen .container > .row article.page > .entry-content > p, body.page-template-template-sivumenullinen .content .container-sivumenu > div > p, body.page-template-template-sivumenullinen .container > .row article.page > .entry-content > h2, body.page-template-template-sivumenullinen .container > .row article.page > .entry-content > h3, body.page-template-template-sivumenullinen .container > .row article.page > .entry-content > ul, body.page-template-template-sivumenullinen .content .container-sivumenu > div > ul {
    max-width: 53em;
}
body.page-template-template-sivumenullinen .content > .container-sivumenu > .grid > div > p, body.page-template-template-sivumenullinen .content > .container-sivumenu > .grid > div > h2, body.page-template-template-sivumenullinen .content > .container-sivumenu > .grid > div > h3, body.page-template-template-sivumenullinen .content > .container-sivumenu > .grid > div > ul {
    max-width: 53em;
}

/* Etusivu banner */
.frontpage-hero {

min-height: 43rem;
}
.frontpage-hero .vasen .gradient {
background:  rgb(20, 33, 61, 0.6);
}
html .frontpage-hero .laatikko .gradient {
background:  rgb(20, 33, 61, 0.6);
}
/*
html .frontpage-hero .laatikko:nth-child(2) .gradient {
background:  rgb(20, 33, 61, 0.75);
}
*/
.frontpage-hero .teksti::after {
display: none !important;
}
.frontpage-hero h1 {
    font-size: clamp(2.5rem, 1.5625rem + 3vw, 4rem) !important;
    line-height: 115% !important;
}
.frontpage-hero .napit .nappi {
    border-radius: 3em !important;
    border-color: #e21e2c !important;
    font-weight: 700 !important;
    padding: 0.75em 2.375em !important;
    background: none !important;
    background-color: #e21e2c !important;
    border: 1px solid #e21e2c !important;
    transition: all 0.075s !important;
    text-wrap: balance;
}

@media (max-width: 500px) { 
    .frontpage-hero .napit .nappi {
        padding-left: 1.5em !important;
        padding-right: 1.5em !important;
    }
}

.frontpage-hero .napit .nappi:hover {
    background: none !important;
background-color: transparent !important;
border-color: white !important;
transition: all 0.075s !important;
}
.frontpage-hero .napit .nappi:hover:after {
    background-image:url('/wp-content/themes/netello_fi/img/icon-arrow-up-right-white.svg') !important;
}
.frontpage-hero .oikea .laatikot {
height: 100%;
}
.frontpage-hero .laatikko .gradient {
    transition: all 0.2s ease;
}
html body .frontpage-hero .napit .nappi:last-child {
    background-color: transparent !important;
    border-color: white !important;
}
html body .frontpage-hero .napit .nappi:last-child:hover {
    background-color: #e21e2c !important;
    border-color: #e21e2c !important;
}

body .frontpage-hero .vasen .sisalto .teksti {
    font-size: clamp(1.125rem, 1.0469rem + 0.25vw, 1.25rem);
}
.frontpage-hero .laatikko h2 {
    margin-bottom: 0;
}
.frontpage-hero .laatikko .linkki {
    margin-top: 0.75rem;
}

body .frontpage-hero .sisalto {
    position: initial;
}

@media (max-width: 600px) {
    body .frontpage-hero .laatikko .sisalto {
        padding: 1.25rem 1rem;
        
    }
    html .frontpage-hero .laatikko .sisalto .kuvake {
        max-width: 30px;
    }
    .frontpage-hero .laatikko .linkki {
        display: none;
    }
    body .frontpage-hero .vasen {
        padding-top: 3rem;
        padding-bottom: 3.5rem;
    }
}


@media (max-width: 600px) {
    body #valintanapit .valintanappi {
        padding: 0.5em 1em !important;
    }
}
body #valintanapit .valintanappi.selected:hover {
    color: white !important;
}
body #valintanapit > .nappi.selected {
    background: #E31E2C;
    border: 2px solid #E31E2C !important;
}

body .linkkilaatikot-tekstilla .linkkilaatikko {
    border-radius: 0.75rem;
    overflow: hidden;
}

body main .linkkilaatikot-tekstilla .linkkilaatikko {
    background: #f6f6f4;
}

html body div.tumma .nappi-pun:hover {
    border-color: #fff !important;
    color: #fff !important;
}
html body div.tumma .nappi-pun:hover:after {
    background-image:url('/wp-content/themes/netello_fi/img/icon-arrow-up-right-white.svg') !important;
}

body .content p.nappi>a {
    padding: 0.75em 2.375em;
    background-color: #e21e2c;
    border-radius: 3em;
    font-weight: 700;
    border: 1px solid #E31E2C;
    display: inline-block;
    text-wrap: balance;
}
@media (max-width: 500px) { 
    body .content p.nappi>a {
        padding-left: 1.5em;
        padding-right: 1.5em;
    }
}

body .banner:not(.banner-columns) .center {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
body .banner:not(.banner-columns) .otsikko, body .banner:not(.banner-columns)  h1 {
    max-width: 23em;
    margin-left: auto;
    margin-right: auto;
}


body .banner:not(.banner-columns) .nappi-pun:hover {
    color: white !important;
    border-color: white !important;
}
body .content p.nappi, body .content a.nappi, body .content .nappi-1, body .content .nappi-2, body .content .wp-block-button__link, body .content a.nappi-pun, body .content .wp-block-button.nappi-outline>a, .banner .nappi-pun, body .content input[type="submit"], body .nappi-pun.load-more-posts {
    background: none;
	font-weight: 700 !important;
    border-radius: 3rem;
    transition: all 0.075s;
    border-image: none;
    border-width: 1px;
    padding: 0.75em 2.375em;
    display: inline-block;
    text-wrap: balance;
    word-break: break-word;
}
@media (max-width: 500px) { 
    .content p.nappi, body .content a.nappi, body .content .nappi-1, body .content .nappi-2, body .content .wp-block-button__link, body .content a.nappi-pun, body .content .wp-block-button.nappi-outline>a, .banner .nappi-pun, body .content input[type="submit"], body .nappi-pun.load-more-posts {
        padding-left: 1.5em;
        padding-right: 1.5em;
    }
}
body .content .wp-block-button.nappi-outline>a {
    padding: 0.75em 2.375em !important;
    border-radius: 3rem !important;
    border: 1px solid #E31E2C !important;
}
@media (max-width: 500px) { 
    body .content .wp-block-button.nappi-outline>a {
        padding-left: 1.5em  !important;
        padding-right: 1.5em !important;
    }
}
body .content p.nappi {
    background: none;
    padding: 0;
    color: inherit;
    border: 0;
}
body .content p.nappi>a, body .content .nappi-1, body .content .wp-block-button__link, body .content a.nappi-pun, .banner .nappi-pun, body .content input[type="submit"], body .nappi-pun.load-more-posts {
    background: none;
    background-color: #E31E2C;
    color: white !important;
    border-color: #E31E2C;
    border-image: none;
     border-width: 1px;
     display: inline-block;
}
body .content p.nappi>a:after, body .content .nappi-1:after, body .content .wp-block-button__link:after, body .content a.nappi-pun:after, .banner .nappi-pun:after, .banner-columns .nappi-pun:after, .frontpage-hero .nappi:after, body .content input[type="submit"]:after {
    content: "";
  display: inline-block;
  background-image:url('/wp-content/themes/netello_fi/img/icon-arrow-up-right-white.svg');
  background-size: contain;
  width: 0.75em;
  height: 0.75em;
  margin-left: 0.5em;
}



body .content p.nappi>a:hover, body .content .nappi-1:hover, body .content .wp-block-button__link:hover, body .content a.nappi-pun:hover, .banner .nappi-pun:hover, body .content input[type="submit"]:hover, body .nappi-pun.load-more-posts:hover {
    background: none;
    background-color: transparent;
    color: #000 !important;
    border-color: #E31E2C !important;
    border-image: none;
     border-width: 1px;
}

body .content .wp-block-button.is-on-dark-bg .wp-block-button__link:hover {
    background: none;
    background-color: transparent;
    color: #fff !important;
    border-color: #fff !important;
}

body .content p.nappi>a:hover:after, body .content .nappi-1:hover:after, body .content .wp-block-button__link:hover:after, body .content a.nappi-pun:hover:after, .banner-columns .nappi-pun:hover:after, body .content input[type="submit"]:hover:after {
    background-image:url('/wp-content/themes/netello_fi/img/icon-arrow-up-right-black.svg');
}

body .content .wp-block-button.is-on-dark-bg .wp-block-button__link:hover:after {
    background-image:url('/wp-content/themes/netello_fi/img/icon-arrow-up-right-white.svg');
}


.banner .nappi-pun:hover:after {
    background-image:url('/wp-content/themes/netello_fi/img/icon-arrow-up-right-white.svg');
}



body .content .nappi-2, body .content a.nappi, body .content .wp-block-button.nappi-outline>a {
    background-color: transparent;
    border-color: #E31E2C;
    color: #000 !important;
    border-image: none;
     border-width: 1px;
     display: inline-block;
}
body .content .nappi-2:after, body .content a.nappi:after, body .content .wp-block-button.nappi-outline>a:after {
    display: inline-block;
  background-image:url('/wp-content/themes/netello_fi/img/icon-arrow-up-right-black.svg');
  background-size: contain;
  width: 0.75em;
  height: 0.75em;
  margin-left: 0.5em;
}


body .content .nappi-2:hover, body .content a.nappi:hover, body .content .wp-block-button.nappi-outline>a:hover {
    background-color: #E31E2C;
    border-color: #E31E2C;
    color: #FFF;
    border-image: none;
     border-width: 1px;
}

body .content .nappi-2:hover:after, body .content a.nappi:hover:after, body .content .wp-block-button.nappi-outline>a:hover:after {
    background-image:url('/wp-content/themes/netello_fi/img/icon-arrow-up-right-white.svg');
}

html body .content .wp-block-button.nappi-outline>a:hover, body .content a.nappi:hover {
    background: none !important;
    background-color: #E31E2C !important;
    color: #FFF !important;
     border: 1px solid #E31E2C !important;
     border-radius: 3rem !important;
}
html body .content .wp-block-button.nappi-outline:hover {
    background-color: transparent !important;
    border: none !important;
    background: none !important;
    color: white !important;
}



body .wp-block-cover.alignfull .wp-block-cover__inner-container {
max-width: 1380px;
margin-left: auto;
margin-right: auto;
padding-left: 25px;
padding-right: 25px;

}

/* Slick styles */
.slick-arrow {
  border: 0;
  background: none;
  background-color: transparent;
  cursor: pointer;
}
.slick-arrow.slick-next {
  transform: rotate(180deg);
}
.slick-arrow {
    max-height: 37px;
}
@media (max-width: 880px) { 
    .slick-arrow {
        max-height: 25px;
    }
}
.slick-arrow svg {
    height: 100%;
}
.slick-arrow svg, .slick-arrow svg path {
  fill: #000;
  transition: all 0.08s ease;
}
.slick-arrow:hover svg, .slick-arrow:hover svg path {
  fill: #e21e2c;
}


/* vanhojen tyylien parannukset */
.content ul.wp-block-social-links li:before {
    display: none;
}
.refboxit .refbox, .post-cards-container > .post, body .artikkelit > .post {
	padding-left: 0.875rem;
	padding-right: 0.875rem;
	border-radius: 0.75rem;
	margin-top: 1.75rem;
}

@media (min-width: 992px) {
    .post-cards-container > .post {
    	padding-left: 1.25rem;
    	padding-right: 1.25rem;
    	border-radius: 0.75rem;
    	margin-top: 2.5rem;
    }
    
}
html body .refbox h3 {
    margin-top: 1.5rem;
}
.refboxit .refbox .kuva {
	position: relative;
}
.refboxit .refbox:hover .varjo, .post-cards-container > .post:hover .varjo, body .artikkelit > .post:hover .varjo {
	-webkit-box-shadow: 0px 14px 26px -3px rgba(0, 0, 0, 0.15);
box-shadow: 0px 14px 26px -3px rgba(0, 0, 0, 0.15);

}

.refboxit .refbox .varjo, .post-cards-container > .post .varjo, body .artikkelit > .post .varjo {
	border-radius: 0.5rem;
	overflow: hidden;
	padding: 0 0 0 0;
	/*padding: 0;*/
	transform: none;
	-webkit-box-shadow: 0px 12px 22px -6px rgba(0, 0, 0, 0.1);
	box-shadow: 0px 12px 22px -6px rgba(0, 0, 0, 0.1);
}

.refboxit h3, .refboxit p, body .artikkelit > .post h3, body .artikkelit > .post .varjo > p, body .artikkelit > .post .varjo > div:not(.kuva) {
	margin-left: 1rem;
	margin-right: 1rem;
}
.refboxit .refbox p {
	line-height: 1.4em;
}

.refboxit .refbox .nappi-pun, .post-cards-container > .post .nappi-pun, body .artikkelit > .post .nappi-pun {
/*display: none;*/
border-radius: 3rem;
display: none;
}
body .refbox h3 {
    font-size: 1.375rem;
    margin-bottom: -0.5rem;
}
body .refbox .varjo {
    color: inherit;
}
body .refbox .varjo p {
    font-size: 0.9375rem;
}

body .post-cards-container > .post .kuva::after, body .artikkelit > .post .kuva::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgb(20, 33, 61, 0.01875);
}
body .post-cards-container > .post .kuva, body .artikkelit > .post .kuva {
    position: relative;
    aspect-ratio: 16/10;
    height: auto;
}
.post-cards-container > .post .varjo > h3 {
    color: #000;
    margin-top: 1.5rem;
}
body .artikkelit.post-cards-container {
    margin-bottom: 2rem;
}
.post-cards-container > .post .varjo > h3, .post-cards-container > .post .varjo > div, .post-cards-container > .post .varjo > p, body .artikkelit > .post .varjo > p { 
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

html .frontpage-hero .laatikko .sisalto .kuvake {
    margin-bottom: 0.75rem;
    max-width: 38px;
}

body.logged-in #mainheader {
    top: 73px !important;
}

@media (max-width: 781px) {
    body.logged-in #mainheader {
        top: 86px !important;
    }
}



body.logged-in #mainheader.fixed-margin {
top: 32px !important;
}

#main article > .entry-content .wp-block-cover:first-child {
margin-top: -3.5em;
}
html body .container {
        max-width: 1360px;
        width: auto;
}
/* container korjaukset */
@media (min-width: 1930px) {
    body .container {
        max-width: 1360px;
    }
}

body .content .container-kapea {
    max-width: 1160px !important;
}

.haitari .item, .haitari .schema-faq-section, .wp-block-yoast-faq-block .item, .wp-block-yoast-faq-block .schema-faq-section, .sp-easy-accordion .ea-card {
    background: #f6f6f4 !important;
    border: 0 !important;
    border-radius: 0.5rem;
    overflow: hidden;
    margin-bottom: 1rem !important;
}

.haitari .item .schema-faq-question, .haitari .item h3, .haitari .schema-faq-section .schema-faq-question, .haitari .schema-faq-section h3, .wp-block-yoast-faq-block .item .schema-faq-question, .wp-block-yoast-faq-block .item h3, .wp-block-yoast-faq-block .schema-faq-section .schema-faq-question, .wp-block-yoast-faq-block .schema-faq-section h3, .ea-card .ea-header {
    font-size: 1.25rem;
    padding-left: 1.25rem;
}

.ea-card.ea-expand .ea-header {
    background-color: #000;
}
.ea-card.ea-expand .ea-header > a {
    color: white !important;
}
.ea-card.ea-expand .ea-header > a > i {
    color: white !important;
}
.ea-card .ea-body {
    background: none !important;
    color: inherit !important;
}

.ea-card .ea-header > a{
    padding-left: 0 !important;
    color: #000 !important;
    font-family: "General Sans", "DM Sans", "Open Sans", sans-serif !important;
}

.haitari .item .schema-faq-question, .haitari .item h3::after, .haitari .schema-faq-section .schema-faq-question, .haitari .schema-faq-section h3::after, .wp-block-yoast-faq-block .item .schema-faq-question, .wp-block-yoast-faq-block .item h3::after, .wp-block-yoast-faq-block .schema-faq-section .schema-faq-question, .wp-block-yoast-faq-block .schema-faq-section h3::after {
    background-image: none;
    content: "+";
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 400;
    font-size: 1.5rem;
}

.haitari .item .schema-faq-question, .haitari .item h3.is-active, .haitari .schema-faq-section .schema-faq-question, .haitari .schema-faq-section h3.is-active, .wp-block-yoast-faq-block .item .schema-faq-question, .wp-block-yoast-faq-block .item h3.is-active, .wp-block-yoast-faq-block .schema-faq-section .schema-faq-question, .wp-block-yoast-faq-block .schema-faq-section h3.is-active {
    background-color: #000;
    color: white;
}
.haitari .item .schema-faq-question, .haitari .item h3.is-active::after, .haitari .schema-faq-section .schema-faq-question, .haitari .schema-faq-section h3.is-active::after, .wp-block-yoast-faq-block .item .schema-faq-question, .wp-block-yoast-faq-block .item h3.is-active::after, .wp-block-yoast-faq-block .schema-faq-section .schema-faq-question, .wp-block-yoast-faq-block .schema-faq-section h3.is-active::after {
    color: white;
    content: "-";
}

body #valintanapit > .nappi {
    padding: 0.75em 2.375em;
    font-weight: 700 !important;
    border-radius: 3rem;
}
@media (max-width: 500px) { 
    body #valintanapit > .nappi {
        padding-left: 1.5em;
        padding-right: 1.5em;
    }
}


body:not(.home) main .entry-content > .wp-block-cover:last-child {
    margin-bottom: -4.5em;
}

@media (max-width: 500px) {
    body .tayslevea .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content, body .alignfull .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content {
        padding-left: 0;
        padding-right: 0;
    }
}

body .wp-block-group.container {
    padding-left: 0;
    padding-right: 0;
}

html body .content .esittely {
    font-size: clamp(1.125rem, 1.0469rem + 0.25vw, 1.25rem);
}

body .wp-block-columns.is-layout-flex {
    gap: 6%;
}
@media (min-width: 1300px) {
    body .wp-block-columns.has-large-gap.is-layout-flex {
        gap: 10%;
    }
}

@media (max-width: 880px) {
    .wp-block-columns.mobile-column-reverse.is-layout-flex {
        flex-direction: column-reverse;
    }
    html body .wp-block-columns.is-layout-flex  {
        gap: 2rem;
    }
}



body .content h4 {
    font-size: 1.125rem;
}
html body {
    color: #132B49;
}
html body .content p {
    line-height: 1.55em;
}
.wp-block-column > h1.wp-block-heading:first-child {
    margin-top: 0;
}
.wp-block-column > h2.wp-block-heading:first-child {
    margin-top: 0;
}
.wp-block-column > h3.wp-block-heading:first-child {
    margin-top: 0;
}

/* Valikon korjaukset */

body #mainheader ul.navbar-nav > li.current-menu-ancestor > a, body #mainheader ul.navbar-nav > li.current-menu-item > a {
    font-weight: 600 !important;
}

body #mainheader {
    background: #FFF;
}
body #mainheader #valikko .navbar-nav.menu-level-0>li>a, body #mainheader #valikko .navbar-nav.menu-level-0>li>span {
    color: #000;
}
body #mainheader #valikko .navbar-nav.menu-level-0>li>ul li {
    border-top: 0;
    border-bottom: 0;
}
body #mainheader #valikko .navbar-nav.menu-level-0>li>ul li a, body #mainheader #valikko .navbar-nav.menu-level-0>li>ul li span {
    background: #FFF;
    /*background: #f6f6f4;*/
    color: #000;
    border-left: 2px solid #000;
}

body #mainheader #valikko .navbar-nav.menu-level-0 li:hover>ul {
    /*box-shadow: 0 1em 2em rgba(0, 0, 0, .1);*/
    box-shadow: none;
}
body #mainheader #valikko .navbar-nav.menu-level-0>li:hover>ul {
    left: 0;
    top: 100%;
}

body #mainheader #valikko .navbar-nav.menu-level-0>li>ul li a, body #mainheader #valikko .navbar-nav.menu-level-0>li>ul li span {
    white-space: initial;
}
.yhteystiedot-palkki {
    background: #f6f6f4;
}

/*Sivumenu korjaus */
.page-template-template-sivumenullinen .content > .container > .row {
    display: grid;
    grid-template-columns: 300px auto;
}
@media (max-width: 991px) {
    .page-template-template-sivumenullinen .content > .container > .row {
        grid-template-columns: 1fr;
    }
}

body .content .container-sivumenu {
    max-width: 1360px !important;
}
@media (min-width: 992px) {
    body .content .container-sivumenu>div {
        margin-left: 300px !important;
    }
}


@media (min-width: 1930px) {
    .page-template-template-sivumenullinen .col-sivumenu {
        -webkit-box-flex: none;
        -ms-flex: none;
        flex: none;
        max-width: none;
        margin-left: 0;
    }
}
@media (min-width: 1930px) {
    .page-template-template-sivumenullinen .row .col-xl-8 {
        -webkit-box-flex: none;
        -ms-flex: none;
        flex: none;
        max-width: none;
    }
}


body .container-sivumenu .nostot > div > div {
    border-radius: 0.75rem;
    overflow: hidden;
}

body .container-sivumenu .nostot .kuvacontainer {
    aspect-ratio: 16/10;
    height: auto !important;
    position: relative;
}
body .container-sivumenu .nostot .kuvacontainer .kuva {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


/* sivumenu otsikko koko korjaus, refe single post otsikko koko korjaus */

body.page-template-template-sivumenullinen .container > .row article.page > .entry-content > h2 {
    font-size: clamp(2rem, 1.6875rem + 1vw, 2.5rem);
    margin-top: 3rem;
}
body.page-template-template-sivumenullinen .content > .container-sivumenu > .grid > div > h2, body.page-template-template-sivumenullinen .content > .container-sivumenu > div > h2, body.page-template-template-sivumenullinen .content > .container-sivumenu > .grid > div > div > h2 {
    font-size: clamp(2rem, 1.6875rem + 1vw, 2.5rem);
    margin-top: 3rem;
    margin-bottom: 1rem;
}
body.wp-singular.referenssit-template-default .content > .container-kapea > div > div > h2 {
    font-size: clamp(2rem, 1.6875rem + 1vw, 2.5rem);
    margin-top: 3rem;
    margin-bottom: 1rem;
}
body.wp-singular.referenssit-template-default .content > .container-kapea > .col-md-10, body.wp-singular.referenssit-template-default .content > .container-kapea > .h-center > .col-md-10 {
    padding-left: 0;
    padding-right: 0;
}

body.page-template-template-sivumenullinen article.page > .post-thumbnail {
    max-width: 40rem;
    border-radius: 0.75rem;
    overflow: hidden;
    margin-top: 2rem;
    margin-bottom: 2rem;
}


/* single post korjaukset */
body.wp-singular.post-template-default .content h2 {
    font-size: clamp(2rem, 1.6875rem + 1vw, 2.5rem);
    margin-top: 3rem;
}

body .content h3.mt-0, body .content h2.mt-0, body .content h1.mt-0, body .content h4.mt-0, body .content p.mt-0 {
    margin-top: 0;
}

/* Mobiili valikko korjaus */

@media (max-width: 991px) {
#page > main {
    margin-top: 65px;
}
html body #mainheader .row {
    min-height: 65px;
}
body #mainheader .mobileMenu span {
    background-color: #000;
    height: 4px;
}
body #mainheader .mobileMenu > a {
    padding: 0;
}
body #mainheader .yhteysnappi {
    max-width: 6rem;
}
body #mainheader .yhteysnappi > a {
    background: #E31E2C !important;
    height: 65px;
    padding: 0;
    display: flex;
    align-items: center;
}

html body #mainheader .hide-dt {
    height: 65px;
}
html body #mainheader .logo a {
    height: auto;
}
}



/* footer */
footer#mainfooter {
    color: white;
}
footer#mainfooter h3 {
    color: inherit;   
}

/* Vaiheet animoitu */
.vaiheet-animoitu.has-size-normal .vaiheet-animoitu__item {
  grid-template-columns: 38px 1fr;
  gap: 1rem 2rem;
}
.vaiheet-animoitu.has-size-normal .vaiheet-animoitu__line {
  width: 8px;
  left: 15px;
}
.vaiheet-animoitu.has-size-normal .vaiheet-animoitu__progress {
  width: 8px;
  left: 15px;
}

.vaiheet-animoitu.has-size-normal .vaiheet-animoitu__marker {
    width: 38px;
    height: 38px;
    background: #fff;
    border-width: 8px;
    margin-top: 0;
    margin-left: 0;
}
.vaiheet-animoitu.has-size-normal .vaiheet-animoitu__heading {
  font-size: 1.5rem !important;
}
.vaiheet-animoitu.has-size-normal .vaiheet-animoitu__item:last-child:after {
    top: 38px;
    width: 38px;
    height: calc(100% - 38px);
}



.vaiheet-animoitu {
  position: relative;
  margin-top: 0;
  margin-bottom: 0;
  overflow: hidden;
}

.vaiheet-animoitu__line {
  position: absolute;
  left: 9px;
  top: 0.5rem;
  bottom: 0;
  width: 3px;
  background: #000;
  
  z-index: 1;
}

.vaiheet-animoitu__progress {
  position: absolute;
  left: 9px;
  top: 8px;
  width: 3px;
  background: #e21e2c;
  z-index: 2;
  transition: height 0.1s ease-out;
  height: 0;
}

.vaiheet-animoitu__item {
  position: relative;
  display: grid;
  grid-template-columns: 20px 1fr;
  grid-template-rows: auto auto;
  gap: 0.5rem 1rem;
  margin-bottom: 2rem;
}

.vaiheet-animoitu__item:last-child {
  margin-bottom: 0 !important;
}

.vaiheet-animoitu__marker {
  grid-column: 1;
  grid-row: 1;
  position: relative;
  margin-top: 5px;
  margin-left: 3px;
  width: 15px;
  height: 15px;
  background: #fff;
  border: 3px solid #000;
  border-radius: 50%;
  z-index: 3;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.vaiheet-animoitu__item:last-child:after {
    content: "";
    position: absolute;
    display: block;
    top: 20px;
    left: 0;
    width: 20px;
    height: calc(100% - 20px);
    background: white;
    z-index: 2;
}
.banner-columns.has-banner-bg-gray .vaiheet-animoitu__item:last-child:after {
    background: #f6f6f4;
}

.vaiheet-animoitu__item.is-visible
.vaiheet-animoitu__marker {
  border-color: #e21e2c;
  /*transform: scale(1.2);*/
}

.vaiheet-animoitu__content-wrapper {
  grid-column: 2;
  grid-row: 2;
  text-align: left;
}

.vaiheet-animoitu__heading {
  grid-column: 2;
  grid-row: 1;
  margin: 0 !important;
  font-size: 18px !important;
}

.vaiheet-animoitu__content {
  font-size: 16px !important;
}

.vaiheet-animoitu__content > :first-child {
  margin-top: 0;
}

.vaiheet-animoitu__content p {
  margin: 0 0 0.75rem;
}

.vaiheet-animoitu__content h3 {
  font-size: 1.25rem;
}

.vaiheet-animoitu__content p:last-child {
  margin-bottom: 0;
}


body .content ol li {
    background-color: #f6f6f4;
}

body .wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
    background-color: #f6f6f4;
}

/* Taulukkojen scrollaus pienellä näytöllä */
body figure.wp-block-table {
    width: 100%;
    max-width: calc(100vw - 42px);
    overflow-x: auto;
}
body figure.wp-block-table tbody td, body figure.wp-block-table tbody td p {
    font-size: 0.9375rem;
    line-height: 1.45em;
}
thead h3 b {
    font-family: "General Sans" !important;
    font-weight: 600;
}


/* Kuvanosto pyöreällä kulmalla */
.kuvanosto {
    position: relative;
    position: relative;
    border-radius: 8rem 1rem 1rem 1rem;
    overflow: hidden;
    aspect-ratio: 11/12;
}
.kuvanosto-kuva {
    width: 100%;
    height: 100%;
}
.kuvanosto-kuva img, .kuvanosto-kuva picture {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.kuvanosto-linkit {
    position: absolute;
    bottom: 0;
    padding: 5%;
    background-color: #000;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    row-gap: 0.75rem;
}
.kuvanosto-linkit a {
    color: white;
    text-transform: uppercase;
    font-family: "General Sans", "DM Sans", "Open Sans", sans-serif !important;
    font-weight: 600;
    line-height: 1.25em;
    text-wrap: balance;
    font-size: clamp(0.875rem, 0.7969rem + 0.25vw, 1rem);
}
.kuvanosto-linkit a::after {
    content: "";
    display: inline-block;
    background-image: url(/wp-content/themes/netello_fi/img/icon-arrow-up-right-white.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 0.73em;
    height: 0.73em;
    margin-left: 0.325em;
}
.kuvanosto-linkit a:hover {
    opacity: 0.85;
}

.kuvanosto .punainen-laatikko {
    position: absolute;
    border-radius: 0.625rem;
    bottom: 3%;
    left: 6%;
    padding: 7% 4% 3%;
    background-color: #E31E2C;
    display: flex;
    flex-direction: column;
    gap: 0;
    color: #FFF;
}
.kuvanosto p.ylaosa {
    margin: 0;
    font-family: "General Sans", "Open Sans", sans-serif !important;
    font-weight: 700;
}
.kuvanosto p.ylaosa .pieni-otsikko {
    font-size: clamp(1.5rem, 1.0313rem + 1.5vw, 2.25rem);
    font-weight: 700;
}
.kuvanosto p.ylaosa .iso-otsikko {
    font-size: clamp(2.5rem, 1.5625rem + 3vw, 4rem);
    font-weight: 700;
}
.kuvanosto .laatikko-teksti {
    font-size: clamp(0.8125rem, 0.6953rem + 0.375vw, 1rem);
}
.kuvanosto .laatikko-teksti p:first-child {
    margin-top: 0;
}
.kuvanosto .laatikko-teksti p:last-child {
    margin-bottom: 0;
}

/* Palvelulaatikot */

.palvelulaatikot {
display: grid;
gap: 1.25rem;
 margin-top: 3rem;
  margin-bottom: 3rem;

}
.palvelulaatikot.has-columns-4 {
  grid-template-columns: 1fr 1fr 1fr 1fr;
}
.palvelulaatikot.has-columns-3 {
  grid-template-columns: 1fr 1fr 1fr;
}

.palvelulaatikot.has-columns-2 {
  grid-template-columns: 1fr 1fr;
  gap: 2.5rem;
}

.palvelulaatikot.has-columns-1 {
  grid-template-columns: 1fr;
}
@media (max-width: 1400px) {
    .palvelulaatikot.has-columns-4 {
      grid-template-columns: 1fr 1fr 1fr;
    }
}
@media (max-width: 991px) {
    .palvelulaatikot.has-columns-4 {
      grid-template-columns: 1fr 1fr;
    }
    .palvelulaatikot.has-columns-3 {
      grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 820px) {
    .palvelulaatikot.has-columns-2 {
      grid-template-columns: 1fr;
      gap: 1.5rem;
    }
    .palvelulaatikot.has-columns-4 {
      grid-template-columns: 1fr 1fr;
    }
    .palvelulaatikot.has-columns-3 {
      grid-template-columns: 1fr;
    }
}



.palvelulaatikot.has-columns-1 .palvelulaatikko {
  padding: 3rem;
}

.palvelulaatikot.has-columns-2 .palvelulaatikko {
  padding: 2.5rem;
}

@media (max-width: 600px) {
    .palvelulaatikot.has-columns-1 .palvelulaatikko {
      padding: 1.75rem;
      border-radius: 1rem;
    }

    .palvelulaatikot.has-columns-2 .palvelulaatikko {
      padding: 1.75rem;
      border-radius: 1rem;
    }
}

.palvelulaatikot.has-columns-4 .palvelulaatikko {
  border-radius: 1rem;
 
}
.palvelulaatikot.has-dark-boxes .nappi-1 {
	background-color: white;
	border-color: white;
	color: #000 !important;
}
.palvelulaatikot.has-dark-boxes .nappi-1:after {
	background-image:url('/wp-content/themes/netello_fi/img/icon-arrow-up-right-black.svg');
}

.palvelulaatikot.has-dark-boxes .palvelulaatikko .lue-lisaa {
  color: #FFF;
}

.palvelulaatikot.has-dark-boxes .palvelulaatikko .lue-lisaa::after {
  content: "";
  background-image:url('/wp-content/themes/netello_fi/img/icon-arrow-up-right-white.svg');
}


.palvelulaatikot.has-dark-boxes .palvelulaatikko:hover .nappi-1 {
	background-color: #E31E2C;
	color: #FFF !important;
	border-color: #E31E2C;
	transition: all 0.075s;
}
.palvelulaatikot.has-dark-boxes .palvelulaatikko:hover .nappi-1:after {
	background-image:url('/wp-content/themes/netello_fi/img/icon-arrow-up-right-white.svg');
}

.palvelulaatikot.has-columns-3 .palvelulaatikko {
  border-radius: 1rem;
}
.palvelulaatikot.has-small-heading-size .palvelulaatikko h3 {
    font-size: 1.5rem;
}

.palvelulaatikko h4.alaotsikko {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    padding-bottom: 0.5em;
}

.palvelulaatikot .palvelulaatikko {
  padding: 2rem 1.75rem;
  background-color: white;
  border-radius: 1.75rem;
position: relative;
/*transition: all 0.35s ease;*/
}
.palvelulaatikot .palvelulaatikko p  {
  line-height: 1.5em;
}
.palvelulaatikot .palvelulaatikko p:first-child  {
  margin-top: 0;
}
.palvelulaatikot .palvelulaatikko p:last-child  {
  margin-bottom: 0;
}
.palvelulaatikot h3.otsikko {
  margin-top: 0;
  font-size: 2rem;
  margin-bottom: 1rem;
}
.palvelulaatikko .nappi-1 {
    margin-bottom: 0 !important;
    margin-top: 2rem !important;
}
.palvelulaatikko ul li {
    margin-bottom: 0.5em !important;
}

.palvelulaatikot.has-dark-boxes .palvelulaatikko {
  color: white !important;
  background-color: #2b3750;
  transition: background-color 0.15s;
}
.palvelulaatikot.has-dark-boxes .palvelulaatikko:hover {
  background-color: #323e56;
}
.palvelulaatikot.has-dark-boxes .palvelulaatikko h3,
.palvelulaatikot.has-dark-boxes .palvelulaatikko h4,
.palvelulaatikot.has-dark-boxes .palvelulaatikko p,
.palvelulaatikot.has-dark-boxes .palvelulaatikko a,
.palvelulaatikot.has-dark-boxes .palvelulaatikko li {
  color: white !important;
}

.palvelulaatikot.has-dark-boxes .palvelulaatikko .teksti-lopussa::after, .palvelulaatikot.has-dark-boxes .palvelulaatikko .teksti-otsikon-alla::after {
    background: linear-gradient(to bottom, rgba(43, 55, 80, 0), #2b3750);
}

.palvelulaatikko .is-collapsed{
  max-height: var(--collapse-max, 10em);
  overflow: hidden;
  position: relative;
}

.palvelulaatikko .is-collapsed::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height: 3.5em;
  pointer-events:none;
  background: linear-gradient(to bottom, rgba(255,255,255,0), #fff);
}


.palvelulaatikko .lue-lisaa{
  display: inline-block;
  margin-top: .5em;
  color: #000;
  display: flex;
  align-items: center;
  position: relative;
  z-index: 2;
}

.palvelulaatikko .lue-lisaa:hover {
  opacity: 0.85;
}

.palvelulaatikko .lue-lisaa::after {
  content: "";
  display: inline-block;
  background-image:url('/wp-content/themes/netello_fi/img/icon-arrow-up-right-black.svg');
  background-size: contain;
  width: 0.75em;
  height: 0.75em;
  margin-left: 0.5em;
}