/*
Theme Name: Milla Keller
Theme URI: https://markkinointiukkonen.fi/kotisivut-hinta/
Author: Markkinointi Ukkonen Oy
Author URI: https://markkinointiukkonen.fi/
Description: Milla Kellerille tehty WordPress-teema
Version: 1.0
Text Domain: millakeller
*/

:root {
	--tumma: #41150D;
	--ruskea: #7B2910;
	--vali: #F9C4A0;
	--vaalea: #FDE7DD;
	--musta: #000000;
	--valkoinen: #FFFFFF;
}

html, body {
	margin: 0;
	font-size: 20px;
}

body {
	font-family: "Bricolage Grotesque", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	font-variation-settings: "wdth" 100;
}

h1, h2, h3, h4, h5, h6 {
    word-break: break-word;
    overflow-wrap: break-word;
    color: var(--ruskea);
    /*-webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;*/
    font-weight: 800;
}

.kehys {
	width: 1234px;
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box;
	padding-left: 2.5rem;
	padding-right: 2.5rem;
	box-sizing: border-box;
	max-width: 100%;
}

.rivi, .sisalto_osio > .rivi, .sisalto_osio > .kehys.rivi {
	display: flex;
	flex-wrap: wrap;
	box-sizing: border-box;
}

.solu {
	display: block;
	box-sizing: border-box;
}

.solu12 {
	width: 100%;
}

.solu11 {
	width: calc(100% / 12 * 11);
}

.solu10 {
	width: calc(100% / 1.2);
}

.solu9 {
	width: 75%;
}

.solu8 {
	width: calc(100% / 1.5);
}

.solu7 {
	width: calc(100% / 12 * 7);
}

.solu6 {
	width: 50%;
}

.solu5 {
	width: calc(100% / 2.4);
}

.solu4 {
	width: calc(100% / 3);
}

.solu3 {
	width: 25%;
}

.solu2 {
	width: calc(100% / 6);
}

.solu1 {
	width: calc(100% / 12);
}

header.etusivu_hero {
    background-color: var(--ruskea);
    color: var(--vaalea);
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: url(images/hero_kuvio.svg);
    background-position: center left calc(50% - 425px);
    background-repeat: no-repeat;
    background-size: auto 100%;
}

nav.paavalikko ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: flex-end;
    gap: 1.3rem;
}

a {
    color: var(--ruskea);
    text-decoration: none;
    transition: 0.25s color;
}

a:hover, a:hover * {
	color: var(--tumma);
}

nav.paavalikko ul a {
    color: var(--vali);
    text-transform: uppercase;
    font-weight: 800;
}

nav.paavalikko ul a:hover {
	color: var(--vaalea);
}

nav.paavalikko {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

.paavalikko > .kehys {
    width: 1920px;
    max-width: 100%;
    padding-left: 3.600rem;
    padding-right: 3.600rem;
    box-sizing: border-box;
    margin-top: 2.800rem;
}

img.etusivu_kuva {
    display: block;
    padding-right: 5.700rem;
    width: 797px;
    box-sizing: border-box;
    max-width: 50%;
}

.bg_vaalea {
    background: var(--vaalea);
    color: var(--tumma);
}

.bg_valkoinen {
    background: var(--valkoinen);
    color: var(--tumma);
}

main.paasisalto {
    display: block;
    padding-top: 9.800rem;
    padding-bottom: 10.300rem;
    position: relative;
}

h1, h2 {
    font-size: 2.5rem;
    line-height: 1.300em;
    margin-bottom: 2rem;
}

h1.iso_otsikko {
    display: flex;
    align-items: center;
    min-height: 215px;
    background: url(images/ikoni_iso_otsikko.svg);
    background-size: auto 100%;
    background-position: center left;
    background-repeat: no-repeat;
    padding-left: 4.780em;
    margin-bottom: 3.780em;
}

h3,
.etusivusisalto h2,
h2.koko3,
.blogiteksti_sisalto h2 {
    font-size: 1.400rem;
    line-height: 1.286em;
    margin-top: 2.857em;
    margin-bottom: 1.536em;
}

.blogiteksti_sisalto h2 {
    margin-top: 4.500rem;
    margin-bottom: 2.150rem;
}

.blogiteksti_sisalto h3 {
    font-size: 1rem;
    margin-top: 4.500rem;
    margin-bottom: 2.150rem;
}

p {
    font-size: 1rem;
    line-height: 1.750em;
    margin: 2.1em 0;
}

p a {
    font-weight: 600;
}

.nappula {
    display: inline-block;
    font-size: 1rem;
    line-height: 1.750em;
    background-color: var(--ruskea);
    color: var(--vaalea);
    padding: 0.45em 3.3166em 0.45em 1.7166em;
    border-radius: 7px;
    background-image: url(images/arrow_right_vaalea.svg);
    background-size: auto 0.900em !important;
    background-position: center right 1.3em !important;
    background-repeat: no-repeat !important;
    transition: 0.25s background;
    font-weight: 800;
    margin-right: 0.500em;
    margin-bottom: 1rem;
    border: 0;
    font-family: inherit;
}

.nappula:hover {
    color: var(--vaalea);
    background-color: var(--tumma);
}

p+p > .nappula {
    margin-top: 2.300em;
}

.bg_ruskea {
    background: var(--ruskea);
    color: var(--vali);
}

.sisalto_osio > .kehys {
    display: block;
    padding-top: 8.350rem;
    padding-bottom: 9.600rem;
    position: relative;
}

.bg_ruskea h1, .bg_ruskea h2, .bg_ruskea h3, .bg_ruskea h4, .bg_ruskea h5 {
    color: var(--vali);
}

.sisalto_osio > .kehys > *:first-child,
.yhteydessa_rajaus > *:first-child,
.tutustu_rajaus > *:first-child {
    margin-top: 0;
}

.sisalto_osio > .kehys > *:last-child,
.yhteydessa_rajaus > *:last-child,
.tutustu_rajaus > *:last-child {
    margin-bottom: 0;
}

.bg_ruskea .nappula {
    background-color: var(--vali);
    color: var(--ruskea);
    background-image: url(images/arrow_right_ruskea.svg);
}

.bg_ruskea .nappula:hover {
    background-color: var(--vaalea);
    color: var(--ruskea);
}

.kuvio_bg_ruskea::after {
	display: block;
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: -3.150rem;
	bottom: 0;
	background-image: url(images/kuvio_bg_ruskea.svg);
	background-size: auto 100%;
	background-repeat: no-repeat;
	background-position: right center;
	z-index: 0;
}

.sisalto_osio > .kehys > * {
    z-index: 1;
    position: relative;
}

img.tutustu_kuva {
    display: block;
    position: absolute !important;
    bottom: -205px;
    right: -30px;
    width: 646px;
}

img.yhteydessa_kuva {
    display: block;
    position: absolute !important;
    bottom: 0;
    right: -30px;
    width: auto;
    height: calc(100% - 50px);
}

.bg_vali {
    background: var(--vali);
    color: var(--ruskea);
}

.blogitekstit {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 7.7rem;
    margin-top: 5rem;
    margin-bottom: 5.450rem;
}

article.yksi_blogiteksti h2 {
    margin-top: 2rem;
    margin-bottom: 1rem;
}

a.luelisaa {
    display: inline-block;
    min-height: 12px;
    padding-right: 1.5rem;
    font-weight: 600;
    transition: 0.25s background, 0.25s color;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24.99" height="18.186" viewBox="0 0 24.99 18.186"><path id="arrow_right_alt" d="M180.891-700.694h-19.7a1.159,1.159,0,0,1-.856-.338,1.159,1.159,0,0,1-.338-.855,1.159,1.159,0,0,1,.338-.856,1.16,1.16,0,0,1,.856-.338h19.7L175-708.971a1.078,1.078,0,0,1-.338-.836,1.221,1.221,0,0,1,.378-.836,1.145,1.145,0,0,1,.836-.358,1.145,1.145,0,0,1,.836.358l7.919,7.919a1.213,1.213,0,0,1,.279.4,1.168,1.168,0,0,1,.08.438,1.168,1.168,0,0,1-.08.438,1.214,1.214,0,0,1-.279.4l-7.879,7.879a1.146,1.146,0,0,1-.836.358,1.146,1.146,0,0,1-.836-.358,1.168,1.168,0,0,1-.358-.856,1.168,1.168,0,0,1,.358-.856Z" transform="translate(-160 711)" fill="%237B2910"/></svg>');
    background-size: auto 12px !important;
    background-repeat: no-repeat !important;
    background-position: center right !important;
}

a.luelisaa:hover {
    color: var(--tumma);
    background: url(
    'data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24.99" height="18.186" viewBox="0 0 24.99 18.186"><path id="arrow_right_alt" d="M180.891-700.694h-19.7a1.159,1.159,0,0,1-.856-.338,1.159,1.159,0,0,1-.338-.855,1.159,1.159,0,0,1,.338-.856,1.16,1.16,0,0,1,.856-.338h19.7L175-708.971a1.078,1.078,0,0,1-.338-.836,1.221,1.221,0,0,1,.378-.836,1.145,1.145,0,0,1,.836-.358,1.145,1.145,0,0,1,.836.358l7.919,7.919a1.213,1.213,0,0,1,.279.4,1.168,1.168,0,0,1,.08.438,1.168,1.168,0,0,1-.08.438,1.214,1.214,0,0,1-.279.4l-7.879,7.879a1.146,1.146,0,0,1-.836.358,1.146,1.146,0,0,1-.836-.358,1.168,1.168,0,0,1-.358-.856,1.168,1.168,0,0,1,.358-.856Z" transform="translate(-160 711)" fill="%2341150D"/></svg>');
}

.tutustu_rajaus {
    display: block;
    padding-right: 450px;
}

.yhteydessa_rajaus {
    padding-right: 550px;
}

.yhteydessa_rajaus a.nappula {
    margin-top: 1rem;
}

.sisalto_osio.yhteystiedot {
    background: var(--vaalea);
    background: linear-gradient(90deg, var(--vaalea) 0%, var(--vaalea) 50%, var(--valkoinen) 50%, var(--valkoinen) 100%);
}

.yhteystiedot > .kehys {
    display: grid;
    grid-template-columns: 1fr 1fr;
    position: relative;
}

.yhteystiedot_vasen {
    display: block;
    padding-right: 200px;
}

.yhteystiedot_oikea {
    display: block;
    position: relative;
    padding-left: 200px;
    text-align: center;
}

img.yhteystiedot_kuva {
    display: inline-block;
    width: 346px;
    max-width: 100%;
}

.yhteystiedot h2.koko3 {
    margin-top: 1rem;
    margin-bottom: 2.5rem;
}

.yhteystiedot > .kehys::after {
    content: '';
    position: absolute;
    top: 0;
    left: calc(50% - 150px);
    width: 300px;
    bottom: 0;
    height: 100%;
    background: url(images/kuvio_footer_jakaja.svg);
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
}

a.some {
    display: flex;
    font-weight: 600;
    min-height: 2.050rem;
    align-items: center;
    padding-left: 2.750rem;
    background: url(images/ikoni_li.svg);
    background-size: 2.050rem 2.050rem !important;
    background-position: center left !important;
    background-repeat: no-repeat !important;
    margin-bottom: 0.600rem;
    transition: 0.25s background, 0.25s color;
}

a.some.some_li {
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="41.195" height="41.195" viewBox="0 0 41.195 41.195"><path id="linkedin" d="M22.6,2A20.6,20.6,0,1,0,43.2,22.6,20.587,20.587,0,0,0,22.6,2ZM17.629,31.136H13.481V18.69h4.148ZM15.651,16.568a2.122,2.122,0,1,1,2.122-2.122A2.141,2.141,0,0,1,15.651,16.568ZM32.583,31.136H28.435V24.479c0-1.688-.579-2.8-2.074-2.8a2.276,2.276,0,0,0-2.122,1.544,3.672,3.672,0,0,0-.145,1.013v6.946H19.945s.048-11.288,0-12.445h4.148v1.785a4.247,4.247,0,0,1,3.763-2.074c2.7-.048,4.727,1.737,4.727,5.547Z" transform="translate(-2 -2)" fill="%237b2910"/></svg>');
}

a.some.some_li:hover {
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="41.195" height="41.195" viewBox="0 0 41.195 41.195"><path id="linkedin" d="M22.6,2A20.6,20.6,0,1,0,43.2,22.6,20.587,20.587,0,0,0,22.6,2ZM17.629,31.136H13.481V18.69h4.148ZM15.651,16.568a2.122,2.122,0,1,1,2.122-2.122A2.141,2.141,0,0,1,15.651,16.568ZM32.583,31.136H28.435V24.479c0-1.688-.579-2.8-2.074-2.8a2.276,2.276,0,0,0-2.122,1.544,3.672,3.672,0,0,0-.145,1.013v6.946H19.945s.048-11.288,0-12.445h4.148v1.785a4.247,4.247,0,0,1,3.763-2.074c2.7-.048,4.727,1.737,4.727,5.547Z" transform="translate(-2 -2)" fill="%2341150D"/></svg>');
}

a.some.some_ig {
    background: url('data:image/svg+xml,<svg id="instagram" xmlns="http://www.w3.org/2000/svg" width="42.02" height="42.02" viewBox="0 0 42.02 42.02"><path id="Path_103" data-name="Path 103" d="M38.5,32.6a6,6,0,1,0,6,6A6,6,0,0,0,38.5,32.6Zm0,9.89A3.887,3.887,0,1,1,42.39,38.6,3.834,3.834,0,0,1,38.5,42.49Z" transform="translate(-17.493 -17.544)" fill="%237b2910"/><ellipse id="Ellipse_1" data-name="Ellipse 1" cx="1.329" cy="1.329" rx="1.329" ry="1.329" transform="translate(25.881 13.531)" fill="%237b2910"/><path id="Path_104" data-name="Path 104" d="M23.01,2A21.01,21.01,0,1,0,44.02,23.01,21,21,0,0,0,23.01,2ZM34.327,28.127a6.258,6.258,0,0,1-6.249,6.249H17.893a6.258,6.258,0,0,1-6.249-6.249V17.942a6.258,6.258,0,0,1,6.249-6.249H28.127a6.185,6.185,0,0,1,6.2,6.249Z" transform="translate(-2 -2)" fill="%237b2910"/></svg>');
}

a.some.some_ig:hover {
    background: url('data:image/svg+xml,<svg id="instagram" xmlns="http://www.w3.org/2000/svg" width="42.02" height="42.02" viewBox="0 0 42.02 42.02"><path id="Path_103" data-name="Path 103" d="M38.5,32.6a6,6,0,1,0,6,6A6,6,0,0,0,38.5,32.6Zm0,9.89A3.887,3.887,0,1,1,42.39,38.6,3.834,3.834,0,0,1,38.5,42.49Z" transform="translate(-17.493 -17.544)" fill="%237b2910"/><ellipse id="Ellipse_1" data-name="Ellipse 1" cx="1.329" cy="1.329" rx="1.329" ry="1.329" transform="translate(25.881 13.531)" fill="%237b2910"/><path id="Path_104" data-name="Path 104" d="M23.01,2A21.01,21.01,0,1,0,44.02,23.01,21,21,0,0,0,23.01,2ZM34.327,28.127a6.258,6.258,0,0,1-6.249,6.249H17.893a6.258,6.258,0,0,1-6.249-6.249V17.942a6.258,6.258,0,0,1,6.249-6.249H28.127a6.185,6.185,0,0,1,6.2,6.249Z" transform="translate(-2 -2)" fill="%2341150D"/></svg>');
}

a.some.some_ss {
    background: url('data:image/svg+xml,<svg id="Group_52" data-name="Group 52" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="42.02" height="42.02" viewBox="0 0 42.02 42.02"><defs><clipPath id="clip-path"><rect id="Rectangle_33" data-name="Rectangle 33" width="42.02" height="42.02" fill="%237b2910"/></clipPath></defs><g id="Group_39" data-name="Group 39" transform="translate(0 0)" clip-path="url(%23clip-path)"><path id="Path_105" data-name="Path 105" d="M21.01,0A21.01,21.01,0,1,0,42.02,21.01,21,21,0,0,0,21.01,0m9.014,31.3-9.016-5.057L12,31.3V19.937H30.024Zm0-13.446H12V15.328H30.024Zm0-4.609H12V10.719H30.024Z" transform="translate(0 0)" fill="%237b2910"/></g></svg>');
}

a.some.some_ss:hover {
    background: url('data:image/svg+xml,<svg id="Group_52" data-name="Group 52" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="42.02" height="42.02" viewBox="0 0 42.02 42.02"><defs><clipPath id="clip-path"><rect id="Rectangle_33" data-name="Rectangle 33" width="42.02" height="42.02" fill="%237b2910"/></clipPath></defs><g id="Group_39" data-name="Group 39" transform="translate(0 0)" clip-path="url(%23clip-path)"><path id="Path_105" data-name="Path 105" d="M21.01,0A21.01,21.01,0,1,0,42.02,21.01,21,21,0,0,0,21.01,0m9.014,31.3-9.016-5.057L12,31.3V19.937H30.024Zm0-13.446H12V15.328H30.024Zm0-4.609H12V10.719H30.024Z" transform="translate(0 0)" fill="%2341150D"/></g></svg>');
}

a.some.some_tt {
    background: url('data:image/svg+xml,<svg id="tiktok" xmlns="http://www.w3.org/2000/svg" width="42.02" height="42.02" viewBox="0 0 42.02 42.02"><g id="OBJECTS"><path id="Path_275" data-name="Path 275" d="M21.01,0A21.01,21.01,0,1,0,42.02,21.01,21,21,0,0,0,21.01,0ZM31.737,18.894s-3.789-.148-5.806-1.968v8.266a11.99,11.99,0,0,1-.049,1.329,7.815,7.815,0,1,1-6.741-8.758v4.428a3.746,3.746,0,0,0-1.033-.148,3.444,3.444,0,1,0,3.444,3.444V8.709H25.93a5.776,5.776,0,0,0,5.806,5.9v4.33Z" fill="%237b2910"/></g></svg>');
}

a.some.some_tt:hover {
    background: url('data:image/svg+xml,<svg id="tiktok" xmlns="http://www.w3.org/2000/svg" width="42.02" height="42.02" viewBox="0 0 42.02 42.02"><g id="OBJECTS"><path id="Path_275" data-name="Path 275" d="M21.01,0A21.01,21.01,0,1,0,42.02,21.01,21,21,0,0,0,21.01,0ZM31.737,18.894s-3.789-.148-5.806-1.968v8.266a11.99,11.99,0,0,1-.049,1.329,7.815,7.815,0,1,1-6.741-8.758v4.428a3.746,3.746,0,0,0-1.033-.148,3.444,3.444,0,1,0,3.444,3.444V8.709H25.93a5.776,5.776,0,0,0,5.806,5.9v4.33Z" fill="%2341150D"/></g></svg>');
}

.kehys.kuvio_bg_ruskea {
    width: 1418px;
    padding-left: 7.1rem;
}

footer.alapalkki {
    display: block;
    background: var(--tumma);
    color: var(--vaalea);
    padding-top: 9.800rem;
    padding-bottom: 9.700rem;
}

.alapalkki_logo {
    width: 222px;
    display: block;
    max-width: 100%;
}

.alapalkki_logo img {
    display: block;
}

img {
    max-width: 100%;
    height: auto;
}

.alapalkki > .kehys {
    display: grid;
    grid-template-columns: 250px 1fr;
}

.alapalkki_oikea {
    display: block;
    padding-left: 5rem;
}

.alapalkki_linkkirivi {
    display: flex;
    justify-content: flex-end;
	align-items: flex-end;
    gap: 1.300rem;
    margin-bottom: 1.200rem;
}

.alapalkki_linkkirivi span {
	text-align: right;
}

.alapalkki_linkkirivi.ohut span {
	font-size: 0.9rem;
}

.alapalkki_linkkirivi.ohut a {
	font-size: 0.9rem;
	font-weight: 700;
}

.alapalkki_linkkirivi a {
    color: var(--vaalea);
    font-weight: 600;
    min-height: 12px;
    padding-right: 1.25rem;
    font-weight: 600;
    transition: 0.25s background, 0.25s color;
    background: url(images/arrow_right_vali.svg);
    background-repeat: no-repeat !important;
    background-position: center right !important;
    background-size: auto 12px;
}

.alapalkki_linkkirivi a:hover {
    color: var(--vali);
}

.alapalkki_linkkirivi.ohut a {
    background: none;
    padding: 0;
    font-weight: 600;
}

.alapalkki_linkkirivi.ohut {
    margin-bottom: 0;
}

.etusivu_logo {
    display: block;
    max-width: 40%;
    padding-top: 3.800rem;
}

.yksi_blogiteksti p {
    margin-top: 1.8em;
}

a.nappula:last-child {
    margin-right: 0;
}

header.ylapalkki {
    background-color: var(--ruskea);
    background-image: url(images/kuvio_bg_ruskea.svg);
    background-size: auto 100%;
    background-position: right 2.9rem center;
    background-repeat: no-repeat;
}

header.ylapalkki > .kehys {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

a.sivusto_logo {
    display: block;
    width: 138px;
    max-width: 25%;
    margin-top: 2.800rem;
    margin-bottom: 2.900rem;
    box-sizing: border-box;
}

.ylapalkki nav.paavalikko {
    position: relative;
    max-width: 75%;
}

a.sivusto_logo img {
    display: block;
}

.kuva_alhaalla > .kehys {
    display: block;
    padding-right: 460px;
    position: relative;
    padding-bottom: 10rem;
}

img.kuva_alhaalla_obj {
    display: block;
    width: 446px;
    position: absolute;
    bottom: 0;
    right: -4.5rem;
}

main.paasisalto.kuva_alhaalla {
    padding-bottom: 0;
}

.rivi > h2 {
    display: block;
    width: 100%;
}

.kaksi_rivissa {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 4.5rem;
}

.bg_valkoinen h2+.kaksi_rivissa {
    margin-top: -2rem;
}

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

li::before {
    content: '– ';
}

nav.paavalikko li::before {
    display: none;
    content: '';
}

li {
    line-height: 1.750em;
}

nav.paavalikko li {
    line-height: 1em;
}

.bg_valkoinen .kaksi_rivissa > * {
    display: block;
    padding-right: 2rem;
}

.kehys > h2 {
    width: 1000px;
    max-width: 100%;
}

.kaksi_rivissa > p {
    margin: 1rem 0;
}

.seuraavaanosioon img.kuva_alhaalla_obj {
    width: 558px;
    bottom: -170px;
}

.kuva_alhaalla.seuraavaanosioon .kehys {
    padding-right: 550px;
}

.isompi_turvaalue {
    padding-top: 1rem;
    padding-bottom: 0;
}

.iso_otsikko_container {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    background: url(images/ikoni_iso_otsikko.svg);
    min-height: 197px;
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center left;
    padding-left: 250px;
    box-sizing: border-box;
    width: 950px;
    max-width: 100%;
}

.iso_otsikko_container > h2 {
    margin: 0 0 1rem 0;
}

span.iso_otsikko_alateksti {
    display: block;
    font-size: 1rem;
    line-height: 1.750em;
}

article.julkaistu_kirja {
    display: grid;
    grid-template-columns: 1fr 25.31%;
    gap: 6.450rem;
    margin: 4rem 0;
    padding-bottom: 1.650rem;
}

article.julkaistu_kirja > div > *:first-child {
    margin-top: 0;
}

article.julkaistu_kirja:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
}

img.kirja_kansi {
    display: block;
    margin-top: 5px;
}

.bg_valkoinen a.nappula {
    color: var(--valkoinen);
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24.99" height="18.186" viewBox="0 0 24.99 18.186"><path id="arrow_right_alt" d="M180.891-700.694h-19.7a1.159,1.159,0,0,1-.856-.338,1.159,1.159,0,0,1-.338-.855,1.159,1.159,0,0,1,.338-.856,1.16,1.16,0,0,1,.856-.338h19.7L175-708.971a1.078,1.078,0,0,1-.338-.836,1.221,1.221,0,0,1,.378-.836,1.145,1.145,0,0,1,.836-.358,1.145,1.145,0,0,1,.836.358l7.919,7.919a1.213,1.213,0,0,1,.279.4,1.168,1.168,0,0,1,.08.438,1.168,1.168,0,0,1-.08.438,1.214,1.214,0,0,1-.279.4l-7.879,7.879a1.146,1.146,0,0,1-.836.358,1.146,1.146,0,0,1-.836-.358,1.168,1.168,0,0,1-.358-.856,1.168,1.168,0,0,1,.358-.856Z" transform="translate(-160 711)" fill="%23FFFFFF"/></svg>');
}


.kuva_alhaalla > .kehys > p:last-of-type {
    margin-bottom: 0;
    padding-bottom: 0;
}

nav.blogiarkisto_sivutus {
    display: block;
    margin-top: 4.750rem;
}

.kehys.blogiarkisto {
    display: grid;
    grid-template-columns: 1fr 28%;
    gap: 7.8rem;
    /* margin-top: 1.700rem; */
}

.blogiarkisto_oikea {
    display: block;
    font-size: 0.900rem;
    text-align: center;
    padding-top: 8px;
}

.blogiarkisto_oikea p {
    font-size: inherit;
}

article.blogiarkisto_blogiteksti {
    display: block;
    margin: 4.5rem 0;
}

img.blogiarkisto_profiilikuva {
    width: 243px;
    max-width: 90%;
    border-radius: 50%;
    display: block;
    margin: 0 auto 2.5rem auto;
}

h3.pieniotsikko {
    margin-top: 4.25rem;
    font-size: 1em;
    color: var(--tumma);
}

a.blogiarkisto_vuosi {
    font-weight: 600;
    margin: 0.5rem 0;
    display: inline-block;
    cursor: pointer;
    padding: 0 1rem;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="10.01" height="5.704" viewBox="0 0 10.01 5.704"><path id="chevron_arrow_down" d="M257.242-609.34a.673.673,0,0,1-.22-.154l-4.361-4.361a.609.609,0,0,1-.187-.473.687.687,0,0,1,.209-.474.646.646,0,0,1,.473-.2.646.646,0,0,1,.474.2l3.854,3.876,3.876-3.876a.6.6,0,0,1,.462-.187.676.676,0,0,1,.462.209.646.646,0,0,1,.2.474.646.646,0,0,1-.2.474l-4.339,4.339a.673.673,0,0,1-.22.154.647.647,0,0,1-.242.044A.647.647,0,0,1,257.242-609.34Z" transform="translate(-252.474 615)" fill="%237b2910"/></svg>');
    background-position: center right !important;
    background-repeat: no-repeat !important;
    transition: 0.25s background;
}

.blogiarkisto_vuosi {
    box-sizing: border-box;
    display: none;
}

.blogiarkisto_vuosi > * {
    display: block;
    padding: 0.25rem 0;
    line-height: 1.667em;
    color: var(--tumma);
}

.blogiarkisto_vuosi > *:last-child {
    padding-bottom: 1.25rem;
}

.blogiarkisto_blogiteksti h2 {
    margin-top: 2rem;
    margin-bottom: 1.75rem;
}

.blogiarkisto_vasen h1 {
    margin-bottom: 8.250rem;
    margin-top: 0;
}

a.blogiarkisto_vuosi:hover {
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="10.01" height="5.704" viewBox="0 0 10.01 5.704"><path id="chevron_arrow_down" d="M257.242-609.34a.673.673,0,0,1-.22-.154l-4.361-4.361a.609.609,0,0,1-.187-.473.687.687,0,0,1,.209-.474.646.646,0,0,1,.473-.2.646.646,0,0,1,.474.2l3.854,3.876,3.876-3.876a.6.6,0,0,1,.462-.187.676.676,0,0,1,.462.209.646.646,0,0,1,.2.474.646.646,0,0,1-.2.474l-4.339,4.339a.673.673,0,0,1-.22.154.647.647,0,0,1-.242.044A.647.647,0,0,1,257.242-609.34Z" transform="translate(-252.474 615)" fill="%2341150D"/></svg>');
}

a.blogiarkisto_vuosi.auki {
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="10.01" height="5.704" viewBox="0 0 10.01 5.704"><path id="chevron_arrow_down" d="M4.769,5.66a.673.673,0,0,1-.22-.154L.188,1.145A.609.609,0,0,1,0,.672.687.687,0,0,1,.21.2.646.646,0,0,1,.683,0a.646.646,0,0,1,.474.2L5.011,4.074,8.887.2A.6.6,0,0,1,9.349.011.676.676,0,0,1,9.812.22a.646.646,0,0,1,.2.474.646.646,0,0,1-.2.474L5.473,5.506a.673.673,0,0,1-.22.154.688.688,0,0,1-.484,0Z" transform="translate(10.01 5.704) rotate(180)" fill="%237b2910"/></svg>');
}

a.blogiarkisto_vuosi.auki:hover {
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="10.01" height="5.704" viewBox="0 0 10.01 5.704"><path id="chevron_arrow_down" d="M4.769,5.66a.673.673,0,0,1-.22-.154L.188,1.145A.609.609,0,0,1,0,.672.687.687,0,0,1,.21.2.646.646,0,0,1,.683,0a.646.646,0,0,1,.474.2L5.011,4.074,8.887.2A.6.6,0,0,1,9.349.011.676.676,0,0,1,9.812.22a.646.646,0,0,1,.2.474.646.646,0,0,1-.2.474L5.473,5.506a.673.673,0,0,1-.22.154.688.688,0,0,1-.484,0Z" transform="translate(10.01 5.704) rotate(180)" fill="%2341150D"/></svg>');
}

.blogiarkisto_vuosi > *:hover {
    color: var(--ruskea);
}

.nappula.uudemmat {
    padding: 0.45em 1.7166em 0.45em 3.3166em;
    background-position: center left 1.3em !important;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24.99" height="18.156" viewBox="0 0 24.99 18.156"><path id="arrow_left_alt" d="M176.092-698.71l5.84,5.84a1.076,1.076,0,0,1,.338.834,1.219,1.219,0,0,1-.377.834,1.144,1.144,0,0,1-.834.358,1.144,1.144,0,0,1-.834-.358l-7.866-7.867A1.143,1.143,0,0,1,172-699.9a1.143,1.143,0,0,1,.358-.834l7.906-7.906A1.143,1.143,0,0,1,181.1-709a1.143,1.143,0,0,1,.834.358,1.166,1.166,0,0,1,.358.854,1.166,1.166,0,0,1-.358.854l-5.84,5.84H195.8a1.158,1.158,0,0,1,.854.338,1.158,1.158,0,0,1,.338.854,1.158,1.158,0,0,1-.338.854,1.158,1.158,0,0,1-.854.338Z" transform="translate(-172 709)" fill="%23fde7dd"/></svg>');
}

nav.blogiarkisto_sivutus > * {
    margin-right: 0.95rem;
}

nav.blogiarkisto_sivutus > *:last-child {
    margin-right: 0;
}


.blogiteksti_sisalto {
    display: block;
    margin-bottom: 5.25rem;
}

.wp-caption {
    display: block;
    margin: 5rem 0;
    max-width: 100% !important;
}

.wp-caption img {
    display: block;
}

.wp-caption p {
    display: block;
    font-size: 0.9rem;
    margin-top: 1rem;
}

.blogiteksti h1 {
    margin-top: 3.750rem;
    margin-bottom: 3.750rem;
}

@supports not ((initial-letter:2) or (-webkit-initial-letter:2)) {
    .blogiteksti_sisalto > p:first-child::first-letter {
        float: left;
		font-size: 6.3em;
		color: var(--ruskea);
		margin-top: 0.1em;
        margin-right: 0.07em;
    }
}
@supports (initial-letter:2) or (-webkit-initial-letter:2) {
    .blogiteksti_sisalto > p:first-child::first-letter {
		-webkit-initial-letter:3;
        initial-letter: 3;
        color: var(--ruskea);
        margin-right: 0.5em;
    }
}

.blogiteksti {
    display: block;
    color: var(--tumma);
}


.bg_ruskea a {
    color: var(--vaalea);
    font-weight: 600;
}

.bg_ruskea a:hover {
    color: var(--inherit);
}

.otayhteytta .kuva_alhaalla_obj {
    width: 407px;
    right: 2.5rem;
}

.kuva_alhaalla.otayhteytta > .kehys {
    padding-right: 510px;
}

.kaksirivissa {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 13px 13px;
}

.wpcf7-text, .wpcf7-email, .wpcf7-textarea {
    display: block;
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 13px;
    font-size: 1rem;
    padding: 0.75em 1.05em;
    border: 0;
    font-family: inherit;
    /* font-optical-sizing: auto; */
    font-weight: 400;
    border-radius: 0;
    color: var(--musta);
    background: #fce2d0;
    border-radius: 7px;
}

.wpcf7-text::placeholder,
.wpcf7-email::placeholder,
.wpcf7-textarea::placeholder {
    color: var(--ruskea);
}

span.radio_label {
    display: block;
    margin: 1.5em 0 1em 0;
}

span.wpcf7-form-control.wpcf7-radio {
    display: flex;
    margin-bottom: 1.5rem;
    gap: 2rem;
    flex-wrap: wrap;
}

.wpcf7-radio input {
    display: inline-block;
    font-size: 1em;
    width: 1em;
    height: 1em;
    margin: 0;
    cursor: pointer;
}

.wpcf7-radio label {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.wpcf7-submit.nappula {
    margin-top: 1.5rem;
    cursor: pointer;
    color: var(--vali);
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24.99" height="18.186" viewBox="0 0 24.99 18.186"><path id="arrow_right_alt" d="M180.891-700.694h-19.7a1.159,1.159,0,0,1-.856-.338,1.159,1.159,0,0,1-.338-.855,1.159,1.159,0,0,1,.338-.856,1.16,1.16,0,0,1,.856-.338h19.7L175-708.971a1.078,1.078,0,0,1-.338-.836,1.221,1.221,0,0,1,.378-.836,1.145,1.145,0,0,1,.836-.358,1.145,1.145,0,0,1,.836.358l7.919,7.919a1.213,1.213,0,0,1,.279.4,1.168,1.168,0,0,1,.08.438,1.168,1.168,0,0,1-.08.438,1.214,1.214,0,0,1-.279.4l-7.879,7.879a1.146,1.146,0,0,1-.836.358,1.146,1.146,0,0,1-.836-.358,1.168,1.168,0,0,1-.358-.856,1.168,1.168,0,0,1,.358-.856Z" transform="translate(-160 711)" fill="%23F9C4A0"/></svg>');
}

span.wpcf7-list-item-label a {
    color: var(--ruskea);
    font-weight: 600;
    text-decoration: none;
    transition: 0.25s color;
}

span.wpcf7-list-item-label a:hover {
    color: var(--tumma);
}

span.wpcf7-form-control.wpcf7-acceptance {
    margin-top: 1.773rem;
    display: block;
    margin-bottom: 1.364rem;
    font-size: 0.909rem;
}

.wpcf7 input[type="checkbox"] {
    font-size: 21px;
    width: 24px;
    height: 24px;
    margin: 0;
    border: none;
    cursor: pointer;
}

.wpcf7-acceptance label {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 11px;
    cursor: pointer;
    text-align: left;
    font-weight: inherit;
}

.paasisalto > .kehys > h1:first-child {
    margin-top: 1.700rem;
}

main.paasisalto.bg_vaalea.kuva_alhaalla > .kehys > h1:first-child {
    margin-top: 0;
}

.julkaistu_kirja > div > p:last-child, .julkaistu_kirja > div > p:last-child .nappula {
    margin-bottom: 0;
}

.blogiteksti_ote > *:first-child {
    margin-top: 0;
}

h2+p {
    margin-top: 0;
}

.wpcf7 {
    padding-top: 0.5rem;
    display: block;
}

.wpcf7-email:focus,
.wpcf7-textarea:focus,
.wpcf7-text:focus {
    outline-style: solid;
	outline-color: var(--ruskea);
}

blockquote {
	quotes: '"' '"' '"' '"';
	font-style: italic;
}

blockquote:before {
    content: open-quote;
}

blockquote:after {
    content: close-quote;
}

.alignleft {
    float: left;
    margin: 0.3em 2em 2em 0;
}

.aligncenter {
	display: block;
	margin: 2em auto;
}

.alignright {
    float: right;
    margin: 0.3em 0 2em 2em;
}

.wp-caption-text {
    font-size: 0.9em;
    font-style: italic;
    margin-top: 0.25em;
}

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.embed-container {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	max-width: 100%;
} 

.embed-container iframe,
.embed-container object,
.embed-container embed { 
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.wpcf7-textarea {
    min-height: 232px;
}

.wpcf7-textarea {
    min-height: 232px;
}

.wpcf7-not-valid-tip {
    background: #8d0000;
    margin-top: -13px;
    padding: 0.5em 1.05em;
    margin-bottom: 13px;
    color: var(--valkoinen);
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
    background: #8d0000;
    border: 0;
    margin: 3rem 0;
    padding: 5rem 2rem;
    text-align: center;
    color: var(--valkoinen);
    font-size: 1.25rem;
}

.wpcf7 form.sent .wpcf7-response-output {
    background: #338d00;
    border: 0;
    margin: 3rem 0;
    padding: 2rem 2rem;
    text-align: center;
    color: var(--valkoinen);
    font-size: 1.25rem;
}

.yhteystiedot_oikea_upotus iframe {
	display: block;
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
}

@media screen and (max-width: 1600px) {
    html, body {
        font-size: 18px;
    }
    
    .kuvio_bg_ruskea::after {
        right: 0;
    }
        
    img.tutustu_kuva {
        max-width: 46%;
        right: 0;
    }

    img.yhteydessa_kuva {
        right: 20px;
    }

    .etusivu_logo {
        display: block;
        max-width: 30%;
    }

    .sisalto_osio > .kehys,
    main.paasisalto {
        padding-top: 6rem;
        padding-bottom: 6rem;
    }

    img.yhteydessa_kuva {
        height: calc(100% - 20px)
    }

    header.etusivu_hero {
        background-position: center left calc(50% - 325px);
    }
        
    .isompi_turvaalue {
        padding-top: 5rem;
        padding-bottom: 4rem;
    }

    .otayhteytta .kuva_alhaalla_obj {
        width: 350px;
    }

    .kuva_alhaalla > .kehys {
        padding-top: 3rem;
    }

    .kehys.blogiarkisto {
        padding-top: 3rem;
    }
}

@media screen and (max-width: 1500px) {
    header.etusivu_hero {
        background-position: center left calc(50% - 310px);
    }
}

@media screen and (max-width: 1400px) {
    img.tutustu_kuva {
        bottom: unset;
        top: 20px;
        max-width: 43%;
    }

    .kehys.kuvio_bg_ruskea {
        width: 1234px;
        padding-left: 2.5rem;
    }

    img.kuva_alhaalla_obj {
        width: 30vw;
        right: -2.5rem;
    }

    .kuva_alhaalla > .kehys {
        padding-right: 30vw;
    }
}

@media screen and (max-width: 1300px) {
    html, body {
        font-size: 17px;
    }

    img.kuva_alhaalla_obj {
        width: 30vw;
        right: -0;
    }

    .kuva_alhaalla > .kehys {
        padding-right: calc(30vw + 3rem);
    }

    .seuraavaanosioon img.kuva_alhaalla_obj {
        width: 40vw;
        bottom: -150px;
    }

    .kuva_alhaalla.seuraavaanosioon .kehys {
        padding-right: calc(40vw + 3rem);
    }
}

@media screen and (max-width: 1200px) {
    html, body {
        font-size: 16px;
    }
    
    .otayhteytta .kuva_alhaalla_obj {
        width: 300px;
    }
}

@media screen and (max-width: 1000px) {
    header.etusivu_hero {
        background-position: center left 15px;
        padding-top: 100px;
    }

    img.etusivu_kuva {
        padding-right: 3rem;
    }
        
    img.tutustu_kuva {
        top: -50px;
        height: calc(100% + 100px);
        width: auto;
        object-fit: contain;
        max-width: 52%;
    }

    .alapalkki > .kehys {
        display: block;
    }

    .alapalkki_logo {
        max-width: 60%;
        margin: 0 0 5rem 0;
    }

    .alapalkki_oikea {
        padding-left: 0;
    }

    .alapalkki_linkkirivi {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        margin-bottom: 3rem;
    }

    footer.alapalkki {
        padding-top: 6rem;
        padding-bottom: 5rem;
    }

    nav.paavalikko ul {
        justify-content: center;
    }

    .yhteydessa_rajaus {
        padding-right: 43%;
    }

    .yhteystiedot_vasen {
        padding-right: 100px;
    }

    .yhteystiedot_oikea {
        padding-left: 100px;
    }

    .blogitekstit {
        gap: 3rem;
    }

    .tutustu_rajaus {
        padding-right: 50%;
    }

    .kuva_alhaalla > .kehys {
        padding-bottom: 6rem;
        padding-top: 0;
    }

    .bg_valkoinen .kaksi_rivissa > * {
        padding-right: 0;
    }

    .kaksi_rivissa {
        gap: 0 3rem;
    }

    .seuraavaanosioon img.kuva_alhaalla_obj {
        bottom: -125px;
        width: 43vw;
    }

    .kuva_alhaalla.seuraavaanosioon .kehys {
        padding-right: calc(43vw + 2rem);
        padding-bottom: 8rem;
        padding-top: 1rem;
    }

    .kehys.blogiarkisto {
        padding-top: 1rem;
    }

    .kehys.blogiarkisto {
        grid-template-columns: 1fr 23%;
        gap: 5rem;
    }

    .kuva_alhaalla.otayhteytta > .kehys {
        padding-right: calc(30vw + 6rem);
        padding-bottom: 7rem;
    }

    .otayhteytta .kuva_alhaalla_obj {
        width: 30vw;
    }

	.etusivu_logo {
		padding-top: 0;
	}
	
	.alapalkki_linkkirivi span {
		text-align: left;
	}
}

@media screen and (min-width: 801px) {
    .mobile_nav_toggle {
        display: none !important;
    }
}

@media screen and (max-width: 800px) {
    html, body {
        font-size: 18px;
    }

    .mobile_nav_toggle {
		display: block;
		width: 40px;
		box-sizing: border-box;
		cursor: pointer;
		padding: 0;
		z-index: 2;
		position: absolute;
		top: 34px;
		right: 2.5rem;
		z-index: 3;
	}

	.viiva1, .viiva2, .viiva3 {
		width: 40px;
		height: 6px;
		background-color: var(--vali);
		margin: 6px 0;
		transition: 0.4s;
	}

	.avattu .viiva1 {
		-webkit-transform: rotate(-45deg) translate(-8px, 8px);
		transform: rotate(-45deg) translate(-8px, 8px);
		background: var(
		--ruskea);
	}

	.avattu .viiva2 {
		opacity: 0;
		background: var(--ruskea);
	}

	.avattu .viiva3 {
		-webkit-transform: rotate(45deg) translate(-9px, -8px);
		transform: rotate(45deg) translate(-9px, -8px);
		background: var(--ruskea);
	}

    header.etusivu_hero {
        padding-top: 130px;
        flex-direction: column-reverse;
        background-size: 100% auto;
        background-position: bottom -20% right;
    }

    nav.paavalikko {
        background: var(--vali);
        transition: 0.5s transform;
        transform: scaleY(0);
        transform-origin: top center;
    }

	.avattu+nav.paavalikko {
		transform: scaleY(1.0);
	}

    nav.paavalikko ul {
        display: block;
        margin-top: 120px;
        margin-bottom: 80px;
    }

    nav.paavalikko ul a, nav.paavalikko ul a:hover {
        color: var(--ruskea);
        font-size: 1.25rem;
    }

    nav.paavalikko ul li {
        margin-bottom: 1rem;
    }

    .etusivu_logo {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        padding: 0 3rem 3rem 3rem;
    }

    .etusivu_logo > img {
        max-width: 70%;
        display: block;
        margin: 0 auto;
    }

    img.etusivu_kuva {
        padding-right: 0;
        max-width: 90%;
    }

    .tutustu_rajaus {
        padding-right: 0;
        text-align: center;
        padding-bottom: calc(100vw - 230px);
    }

    img.tutustu_kuva {
        position: absolute;
        top: auto;
        left: 0;
        right: unset;
        bottom: -60px;
        max-width: 100%;
        width: 100%;
        margin: 2rem auto 0 auto;
        height: calc(100vw - 100px);
    }

    .blogitekstit {
        grid-template-columns: 1fr;
        gap: 4rem;
    }

    .yhteydessa_rajaus {
        padding-right: 0;
        padding-bottom: 450px;
        text-align: center;
    }

    img.yhteydessa_kuva {
        bottom: 0;
        left: 0;
        width: 100%;
        object-fit: contain;
        object-position: center bottom;
        height: 500px;
    }

    .sisalto_osio.yhteystiedot {
        background: none;
    }

    .yhteystiedot > .kehys {
        padding-left: 0;
        padding-right: 0;
        display: block;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .yhteystiedot_vasen, .yhteystiedot_oikea {
        padding-left: 2.5rem;
        padding-right: 2.5rem;
    }

    .yhteystiedot_vasen {
        padding-top: 3rem;
        background: var(--vaalea);
        padding-bottom: 0;
    }

    .yhteystiedot_oikea {
        padding-top: 2rem;
        background: var(--valkoinen);
        padding-bottom: 6rem;
        position: relative;
        text-align: center;
    }

    .yhteystiedot > .kehys::after {
        display: none;
    }

    .yhteystiedot_oikea::after {
        content: '';
        position: absolute;
        top: -18%;
        left: 0;
        width: 100%;
        height: 0;
        background: url(images/kuvio_footer_jakaja_mobiili.svg);
        background-size: 100% 100%;
        background-position: center;
        padding-top: 40%;
    }

    .yhteystiedot_vasen::after, .yhteystiedot_oikea::before {
        position: relative;
        content: '';
        display: block;
        width: 100%;
        padding-top: 30%;
        background: none;
    }

    img.yhteystiedot_kuva {
        margin: 0 auto;
    }

    h1.iso_otsikko {
        background-size: 2em auto;
        padding-left: 3em;
        margin-bottom: 2em;
    }

    .sisalto_osio > .kehys, main.paasisalto {
        padding-top: 6rem;
        padding-bottom: 6rem;
    }

    h1, h2 {
        font-size: 2rem;
    }
        
    .alapalkki_linkkirivi a {
        display: inline-block;
    }

	.kuvio_bg_ruskea::after {
	    background-size: 50% auto;
	    background-position: right bottom 0%;
	}

	.yhteydessa_rajaus a.nappula {
	    margin-top: 0;
	}

	.yhteydessa_rajaus h2 {
	    margin-bottom: 1.7rem;
	}
	
	.yhteydessa_rajaus h2+p {
	    margin-top: 0;
	}

    .kuva_alhaalla > .kehys {
        padding-bottom: calc(70vw + 50px);
        padding-right: 2.5rem;
        text-align: center;
    }

    img.kuva_alhaalla_obj {
        width: 100%;
        height: 65vw;
        object-fit: contain;
        object-position: center bottom;
    }

    .ylapalkki nav.paavalikko {
        position: absolute;
        z-index: 10;
        max-width: 100%;
        padding-left: 2.5rem;
        box-sizing: border-box;
        padding-right: 2.5rem;
    }

    .ylapalkki .mobile_nav_toggle {
        position: relative;
        top: unset;
        right: unset;
        z-index: 11;
    }

    a.sivusto_logo {
        margin-top: 1.3rem;
        margin-bottom: 1.3rem;
        max-width: 50%;
        width: 120px;
    }

    header.ylapalkki {
        background-position: right 5.25rem center;
    }

    .seuraavaanosioon img.kuva_alhaalla_obj {
        height: 85vw;
        width: 100%;
        object-fit: contain;
    }

    .kuva_alhaalla.seuraavaanosioon .kehys {
        padding-right: 2.5rem;
        padding-bottom: calc(90vw - 90px);
        padding-top: 0;
    }
        
    .iso_otsikko_container {
        padding-left: 10rem;
        background-size: 7rem auto;
    }

    article.julkaistu_kirja {
        display: flex;
        flex-direction: column-reverse;
        gap: 2rem;
    }
        
    img.kirja_kansi {
        width: 200px;
        max-width: 100%;
    }

    .kehys.blogiarkisto {
        display: block;
    }

    .blogiarkisto_oikea {
        text-align: left;
        margin-top: 5rem;
    }

    img.blogiarkisto_profiilikuva {
        margin: 0 0 2.5rem 0;
    }

    a.blogiarkisto_vuosi {
        padding-left: 0;
    }

    .blogiarkisto_vasen h1 {
        margin-bottom: 5rem;
    }

    .kuva_alhaalla.otayhteytta > .kehys {
        padding-right: 2.5rem;
        padding-bottom: calc(65vw + 1rem);
    }

    .otayhteytta .kuva_alhaalla_obj {
        width: 100%;
        height: 60vw;
        right: 0;
    }
	
	.yhteystiedot_oikea_upotus iframe {
		margin-left: auto;
		margin-right: auto;
	}
}

@media screen and (max-width: 600px) {
    h1.iso_otsikko {
        background-position: left top;
        padding-left: 0;
        background-size: auto 6rem;
        padding-top: 7rem;
        min-height: unset;
    }

    .yhteystiedot_oikea::after {
        top: -16%;
    }
	
	.kehys.kuvio_bg_ruskea {
	    padding-top: 4rem;
	}

    .kaksi_rivissa {
        grid-template-columns: 1fr;
    }

    .kuva_alhaalla > .kehys {
        padding-bottom: calc(90vw + 50px);
    }

    img.kuva_alhaalla_obj {
        height: 85vw;
    }

    .iso_otsikko_container {
        background-position: left top;
        padding-left: 0;
        padding-top: 8rem;
        background-size: auto 6rem;
    }

    .isompi_turvaalue {
        padding-top: 3rem;
        padding-bottom: 2rem;
    }
}

@media screen and (max-width: 500px) {
    html, body {
        font-size: 16px;
    }

    h1, h2 {
        font-size: 1.75rem;
        margin-bottom: 2.1rem;
    }

    .yhteystiedot_vasen, .yhteystiedot_oikea, .kehys, .kehys.kuvio_bg_ruskea, .kuva_alhaalla > .kehys, .kuva_alhaalla.seuraavaanosioon .kehys, .kuva_alhaalla.otayhteytta > .kehys {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }

    .etusivu_logo > img {
        max-width: 90%;
    }

    img.tutustu_kuva {
        height: 475px;
        object-fit: contain;
        bottom: -120px;
        margin: 0;
        object-position: bottom center;
    }

    .tutustu_rajaus {
        padding-bottom: calc(100vw - 180px);
    }

    img.yhteydessa_kuva {
        height: calc(100vw - 70px);
        object-fit: contain;
        object-position: top;
    }

    .yhteydessa_rajaus {
        padding-bottom: calc(100vw - 120px);
    }

    .yhteystiedot_oikea::after {
        top: -14%;
    }

	.bg_ruskea+.sisalto_osio.bg_vali {
	    padding-top: 5rem;
	}

    .kuva_alhaalla > .kehys {
        padding-bottom: calc(100vw + 50px);
    }

    img.kuva_alhaalla_obj {
        height: 95vw;
    }

	.mobile_nav_toggle {
	    right: 1.5rem;
	    top: 31px;
	}
}

@media screen and (max-width: 400px) {
    .tutustu_rajaus {
        padding-bottom: calc(100vw - 175px);
    }
}