/*!
Theme Name: Ateljeesaatio
Author: La&La & Days Agency
Version: 1.0.1
Text Domain: lala

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/
/* Normalize
--------------------------------------------- */
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/* Document
	 ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
}

/* Sections
	 ========================================================================== */
/**
 * Remove the margin in all browsers.
 */
body {
    margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
    display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
    font-size: 2em;
    margin: 0.67em 0;
}

/* Grouping content
	 ========================================================================== */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
    font-family: monospace, monospace;
    font-size: 1em;
}

/* Text-level semantics
	 ========================================================================== */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
    background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    text-decoration: underline dotted;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b, strong {
    font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code, kbd, samp {
    font-family: monospace, monospace;
    font-size: 1em;
}

/**
 * Add the correct font size in all browsers.
 */
small {
    font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sub {
    bottom: -0.25em;
}

sup {
    top: -0.5em;
}

/* Embedded content
	 ========================================================================== */
/**
 * Remove the border on images inside links in IE 10.
 */
img {
    border-style: none;
}

/* Forms
	 ========================================================================== */
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button, input, optgroup, select, textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button, input {
    overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button, select {
    text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button, [type="button"], [type="reset"], [type="submit"] {
    -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
    padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *		`fieldset` elements in all browsers.
 */
legend {
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
    vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
    overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"], [type="radio"] {
    box-sizing: border-box;
    padding: 0;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {
    height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
    -webkit-appearance: textfield;
    outline-offset: -2px;
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit;
}

/* Interactive
	 ========================================================================== */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
    display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
    display: list-item;
}

/* Misc
	 ========================================================================== */
/**
 * Add the correct display in IE 10+.
 */
template {
    display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
    display: none;
}

/* Box sizing
--------------------------------------------- */
/* Inherit box-sizing to more easily change it's value on a component level.
@link http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
*, *::before, *::after {
    box-sizing: inherit;
}

html {
    box-sizing: border-box;
}

/*--------------------------------------------------------------
# Base
--------------------------------------------------------------*/
html {
    scroll-behavior: smooth;
}

/* Variables
--------------------------------------------- */
:root {
    --width-page: 1600px;
    --width-content: 840px;
    --padding-page: 60px;
    --padding-header: 30px;
    --padding-menu: 20px;
	--margin-heading: 50px;
    --gap-elements: 40px;
    --gap-flexible: 120px;
    --color-text: #000;
    --color-pink: #E7BFB3;
    --color-pink-hover: #efdad4;
	--color-orange-hover: #E7BFB3;
    --color-brick: #C35E41;
    --color-dark-brick: #68270D;
    --color-beige: #F3E9DF;
    --color-blue: #D2E8F6;
    --color-white: #fff;
    --color-blue-hover: #F0F7FC;
    --color-background: var(--color-pink);
    --border: solid 1px #000;
    --font-family-p: 'InstrumentSans', sans-serif;
    --font-family-h: 'StyreneA', sans-serif;
}

/* Typography
--------------------------------------------- */
/* Easy font sizes */
html {
    font-size: 62.5%;
    /* 1rem = 10px */
}

/* Webfonts */
@font-face {
    font-family: 'InstrumentSans';
    src: url('fonts/instrument-sans-v4-latin-regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'InstrumentSans';
    src: url('fonts/instrument-sans-v4-latin-italic.woff2') format('woff2');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'InstrumentSans';
    src: url('fonts/instrument-sans-v4-latin-600.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'InstrumentSans';
    src: url('fonts/instrument-sans-v4-latin-600italic.woff2') format('woff2');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'StyreneA';
    src: url('fonts/StyreneA-Regular-Web.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'StyreneA';
    src: url('fonts/StyreneA-Medium-Web.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

body, button, input, select, optgroup, textarea {
    color: var(--color-text);
    font-family: var(--font-family-p);
    font-size: 1.9rem;
    line-height: 1.45;
    letter-spacing: 0.01em;
}

.entry-content > * {
    margin-bottom: 30px;
}

.lala-hero-text,
.h2,
h1, h2, h3, h4, h5, h6,
summary {
    font-family: var(--font-family-h);
    clear: both;
    font-weight: normal;
}

h1 {
    font-size: 5rem;
    line-height: 1;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    text-align: center;
    margin: calc(20px + var(--padding-page)) 0 var(--gap-elements);
}

.blog h1 {
	margin-bottom: 0;
}

.single-haettavana h1, .single-post h1 {
	text-transform: none;
	font-size: 4.4rem;
}

.h2,
h2 {
    font-size: 2.6rem;
    line-height: 1.35;
    letter-spacing: 0.01em;
    font-weight: 500;
    margin-top: var(--margin-heading);
}

h3, .searchandfilter h4, .wp-block-lala-blocks-lala-infobox-with-title h2, summary {
    font-size: 1.8rem;
    line-height: 1.35;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    margin-top: var(--margin-heading);
	font-weight: 500;
}

.searchandfilter h4 {
    margin-top: 0;
}

.home h2 {
    font-size: 4rem;
    line-height: 1;
    letter-spacing: 0.04em;
    font-weight: 500;
    text-transform: uppercase;
    text-align: center;
    margin: 0;
    padding-top: 20px;
    padding-bottom: var(--padding-page);
}

.lala-flexibles h2 {
    font-size: 3rem;
    line-height: 1.35;
    letter-spacing: 0.02em;
    font-weight: 500;
    text-transform: uppercase;
    text-align: left;
}

.lala-archive-search h2,
.archive .type-post h2, .lala-archive-posts h3, .lala-archive-posts h2, .lala-hero-text {
    font-size: 2.8rem;
    line-height: 1.4;
    letter-spacing: -0.02em;
    font-weight: 400;
    text-align: center;
    text-transform: none;
}

.lala-archive:not(.lala-archive-search) .type-haettavana h2,
.lala-archive:not(.lala-archive-search) .type-kohde h2, .lala-archive .type-haettavana h3 {
    font-size: 2rem;
    line-height: 1.4;
    letter-spacing: 0;
    font-weight: 500;
    text-align: center;
    margin-top: 0;
	text-transform: none;
}

.entry-haku-paattyy {
	font-family: var(--font-family-h);
	font-size: 1.8rem;
}

p {
    margin-bottom: 1.5em;
}

.wp-block-lala-blocks-lala-ingressi {
    font-size: 2.3rem;
    font-family: var(--font-family-h);
    line-height: 1.4;
    letter-spacing: -0.01em;
    margin-bottom: calc(10px + var(--padding-page));
}

dfn, cite, em, i {
    font-style: italic;
}

.entry-content blockquote {
    margin: 0 1.5em;
    font-size: 2.2rem;
    color: var(--color-dark-brick);
    font-style: italic;
    margin: var(--padding-page) auto;
}

address {
    margin: 0 0 1.5em;
}

pre {
    background: #eee;
    font-family: "Courier 10 Pitch", courier, monospace;
    line-height: 1.6;
    margin-bottom: 1.6em;
    max-width: 100%;
    overflow: auto;
    padding: 1.6em;
}

code, kbd, tt, var {
    font-family: monaco, consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

abbr, acronym {
    border-bottom: 1px dotted #666;
    cursor: help;
}

mark, ins {
    background: #fff9c0;
    text-decoration: none;
}

big {
    font-size: 125%;
}

/* Elements
--------------------------------------------- */
body {
    background: #fff;
    overflow-wrap: break-word;
    word-wrap: break-word;
    -ms-word-break: break-all;
    word-break: break-word;
}

hr {
    background-color: var(--color-text);
    border: 0;
    height: 1px;
    margin-bottom: 1.5em;
}

ul, ol {
    margin: 0 0 1.5em 0;
    padding: 0 0 0 1em;
}

ul {
    list-style: disc;
}

ol {
    list-style: decimal;
}

li > ul, li > ol {
    margin-bottom: 0;
    margin-left: 1.5em;
}

dt, dd {
    font-family: var(--font-family-h);
}

dt {
}

dd {
    margin: 0 1.5em 1.5em;
    font-weight: 500;
}

/* Make sure embeds and iframes fit their containers. */
embed, iframe, object {
    max-width: 100%;
}

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

table {
    margin: 0 0 1.5em;
    width: 100%;
}

details {
	border-bottom: var(--border);
	padding-bottom: 20px;
	position: relative;
}

summary::marker {
	content: "";
}

summary::after {
	content: "+";
	display: block;
	position: absolute;
	right: 0;
	top: -2px;
	font-size: 120%;
	font-weight: 400;
}

details:open summary::after {
	content: "\2014";
	
}

/* Links
--------------------------------------------- */
a {
    color: var(--color-text);
	text-underline-offset: 3px;
	text-decoration-thickness: 0.1em;
	transition: background-color 0.25s, color 0.25s;
}

/* keep deafult focus for accessibility but give it a bit more spece */
a:focus {
    outline-offset: 2px;
    outline: 2px dotted #000;
}

a:hover, a:active {
    outline: 0;
}

.single-post .entry-content a:not(.wp-block-button__link ):hover,
.single-post .entry-content a:not(.wp-block-button__link ):active,
.page-template-default .entry-content a:not(.wp-block-button__link ):hover,
.page-template-default .entry-content a:not(.wp-block-button__link ):active {
	color: var(--color-brick);
}

/* Social links */
@font-face {
    font-family: 'as_social';
    src: url('fonts/as_social.eot?1361915');
    src: url('fonts/as_social.eot?1361915#iefix') format('embedded-opentype'), url('fonts/as_social.woff2?1361915') format('woff2'), url('fonts/as_social.woff?1361915') format('woff'), url('fonts/as_social.ttf?1361915') format('truetype'), url('fonts/as_social.svg?1361915#as_social') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
	font-family: 'as_social';
	src: url('fonts/as_social.svg?1361915#as_social') format('svg');
  }
}
*/

.nav-next a:after,
.nav-previous a:before,
[class^="icon-"]:before, [class*=" icon-"]:before, [class^="icon-"]:before, [class*=" icon-"]:before, .lala-button:after, .wp-block-button__link:after, .icon-arrow:after, a:not([href^="#"],[href^="/"],[href^=javascript],[href^=tel],[href*=localhost],[href*="domain.fi"]):after, a.wp-block-button__link:not([href^="#"],[href^="/"],[href^=javascript],[href^=tel],[href*=localhost],[href*="domain.fi"]):after {
    font-family: "as_social";
    font-style: normal;
    font-weight: normal;
    speak: never;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .5em;
    text-align: center;
    /* opacity: .8; */
    /* For safety - reset parent styles, that can break glyph codes*/
    font-variant: normal;
    text-transform: none;
    /* fix buttons height, for twitter bootstrap */
    line-height: 1em;
    /* Animation center compensation - margins should be symmetric */
    /* remove if not needed */
    margin-left: .5em;
    /* Font smoothing. That was taken from TWBS */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* Uncomment for 3D effect */
    /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}

.icon-share:before {
    content: '\e800';
}

.icon-tiktok:before {
    content: '\e803';
}

.icon-link:before {
    content: '\e804';
}

.icon-email:before, .icon-mail:before {
    content: '\e805';
}

.icon-linkedin-1:before {
    content: '\e806';
}

.icon-bluesky:before, .social a[href*="bsky.app"]:before {
    content: '\e80c';
}

.icon-threads:before, .social a[href*="threads.net"]:before {
    content: '\e80e';
}

.icon-facebook-1:before, .icon-facebook:before, .social a[href*="facebook.com"]:before {
    content: '\f09a';
}

.icon-youtube-play:before, .icon-youtube:before, .social a[href*="youtube.com"]:before {
    content: '\f16a';
}

.icon-whatsapp:before {
    content: '\f232';
}

.icon-snapchat-circled:before {
    content: '\f2ab';
}

.icon-snapchat:before {
    content: '\f2ac';
}

.icon-flickr:before, .social a[href*="flickr.com"]:before {
    content: '\f303';
}

.icon-flickr-circled:before {
    content: '\f304';
}

.icon-vimeo-1:before, .icon-vimeo:before, .social a[href*="vimeo.com"]:before {
    content: '\f306';
}

.icon-vimeo-circled:before {
    content: '\f307';
}

.icon-x-twitter:before {
    content: '\f309';
}

.icon-facebook:before {
    content: '\f30c';
}

.icon-facebook-circled:before {
    content: '\f30d';
}

.icon-pinterest-1:before, .icon-pinterest:before, .social a[href*="pinterest.com"]:before {
    content: '\f312';
}

.icon-pinterest-circled:before {
    content: '\f313';
}

.icon-linkedin-2:before, .icon-linkedin:before, .social a[href*="linkedin.com"]:before {
    content: '\f318';
}

.icon-linkedin-circled:before {
    content: '\f319';
}

.icon-instagram:before, .social a[href*="instagram.com"]:before {
    content: '\f32d';
}

.icon-behance:before, .social a[href*="behance.net"]:before {
    content: '\f34e';
}

.nav-next a:after,
.icon-arrow:after, .lala-button:after, .wp-block-button__link:after, a:not([href^="#"],[href^="/"],[href^=javascript],[href^=tel],[href^=mailto], [href*=localhost],[href*="ateljeesaatio.fi"]):after, a.wp-block-button__link:not([href^="#"],[href^="/"],[href^=javascript],[href^=tel],[href*=localhost],[href*="ateljeesaatio.fi"]):after {
    content: '\e808';
    font-size: 75%;
    text-decoration: none;
}

.nav-next,
.nav-next a,
.nav-previous,
.nav-previous a {
	display: flex;
	align-items: center;
}

.nav-previous a:before,
.icon-arrow-left:before {
	content: '\e811';
	font-size: 75%;
	text-decoration: none;
}

.lala-button:after, .wp-block-button__link:after {
    font-size: 70%;
    vertical-align: middle;
    margin-right: 2px !important;
}

.lala-button {
	display: inline-flex;
	align-items: center;	
}

a:not([href^="#"],[href^="/"],[href^=javascript],[href^=tel],[href*=localhost],[href*="ateljeesaatio.fi"]):after, a.wp-block-button__link:not([href^="#"],[href^="/"],[href^=javascript],[href^=tel],[href*=localhost],[href*="ateljeesaatio.fi"]):after {
    transform: rotate(-45deg);
}

.lala-share-links a {
    text-decoration: none;
    margin-top: 1em;
    display: inline-block;
}

#lala-native-share-link, #lala-share-links {
    display: none;
}

/* Forms
--------------------------------------------- */
label {
    font-size: 1.8rem;
    font-family: var(--font-family-h);
    text-transform: uppercase;
    letter-spacing: 0.02em;
    font-weight: 500;
}

.wp-block-button__link,
input[type="button"], input[type="reset"], input[type="submit"], button, .searchandfilter label:has(input[type=radio]), .searchandfilter label:has(input[type=checkbox]), .lala-button-starred {
    border: 1px solid;
    border-color: var(--color-text);
    border-radius: 0;
    background: transparent;
    line-height: 1;
    padding: 15px 20px;
    min-height: 33px;
    display: inline-flex;
    align-items: center;
    text-align: center;
    cursor: pointer;
    font-size: 1.4rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 500;
    font-family: var(--font-family-h);
    text-decoration: none;
}

.wp-block-button__link {
	background-color: #000;
	color: var(--color-white);
}

.nav-links a,
a.lala-button, .entry-meta {
    font-size: 1.7rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 400;
    text-decoration: none;
    background: transparent;
    border-radius: 0;
    color: inherit;
    height: auto;
    font-family: var(--font-family-h);
    padding: 0;
}

.lala-archive:not(.lala-archive-search) a:not(.type-post) .entry-meta {
	text-transform: none;
}

button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover {
}

a.lala-button:hover {
    border-bottom: 1px solid;
}

.wp-block-button__link:hover,
.entry-content .wp-block-button__link:hover {
	background-color: var(--color-white);
	color: #000;
}

button:active, button:focus, input[type="button"]:active, input[type="button"]:focus, input[type="reset"]:active, input[type="reset"]:focus, input[type="submit"]:active, input[type="submit"]:focus {
    outline-offset: 2px;
    outline: 2px dotted #000;
}

input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea {
    color: var(--color-text);
    border: 1px solid var(--color-text);
    border-radius: 0;
    padding: 3px;
}

input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="number"]:focus, input[type="tel"]:focus, input[type="range"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="time"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="color"]:focus, textarea:focus {
    outline: 2px dotted #000;
}

/* select custom styles */
select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url(img/arrow-down.svg);
    background-repeat: no-repeat;
    background-size: 13px;
    background-position: calc(100% - 10px) center;
    background-color: transparent;
    box-sizing: border-box;
    padding-right: 25px;
    color: black;
    border: 1px solid var(--color-text);
    background-color: transparent;
    border-radius: 0;
    padding: 0.5em 2em 0.5em 1em;
    font-family: var(--font-family-h);
    text-transform: uppercase;
	font-size: 1.4rem;
    letter-spacing: 0.04em;
    font-weight: 500;
}

textarea {
    width: 100%;
}

/* checbox & radio custom styles */
.searchandfilter ul {
    text-align: center;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--gap-elements);
}

.lala-filter-no-tags .searchandfilter ul {
	grid-template-columns: repeat(2, 1fr);
}

.searchandfilter ul ul {
    display: block;
}

.searchandfilter li {
    padding: 5px;
}

.searchandfilter > li {
    padding: 0;
    margin: 10px;
    width: 100%;
}

.searchandfilter > div > ul > li:last-of-type {
    display: none;
}

.searchandfilter input[type=radio], .searchandfilter input[type=checkbox] {
    position: absolute;
	opacity: 0;
	cursor: pointer;
}

.searchandfilter label:has(input[type=radio]), .searchandfilter label:has(input[type=checkbox]) {
    cursor: pointer;
    padding: 15px 20px;
}

.lala-button-starred:hover,
.searchandfilter label:hover {
	background-color: var(--color-white) !important;
	color: var(--color-text) !important;
}

.searchandfilter label:has(input[type=radio]:checked), .searchandfilter label:has(input[type=checkbox]:checked) {
    background-color: var(--color-text);
    color: var(--color-white);
}

.searchandfilter input[type=submit] {
    display: none;
}


/*
input[type=radio],
input[type=checkbox] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

input[type=radio]+span,
input[type=checkbox]+span {
	display: flex;
	align-items: center;
	position: relative;
	padding-left: 30px;
	margin-bottom: 12px;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	line-height: 2em;
}

input[type=radio]+span::before,
input[type=checkbox]+span::before {
	content: "";
	position: absolute;
	left: 0;
	height: 21px;
	width: 21px;
	background-color: transparent;
	border: solid 2px #000;
}

input[type=radio]+span::before {
	border-radius: 100%;
}

input[type=radio]+span::after,
input[type=checkbox]+span::after {
	content: "";
	position: absolute;
	display: none;
	left: 5px;
	width: 11px;
	height: 11px;
	background-color: #000;
}

input[type=radio]+span::after {
	border-radius: 100%;
}

input[type=radio]:checked+span::after,
input[type=checkbox]:checked+span::after {
  display: block;
}

.wpcf7-list-item {
	display: block;
	margin: 0;	
}
*/
/*--------------------------------------------------------------
# Layouts
--------------------------------------------------------------*/
body {
    background-color: var(--color-background);
}

body.blog:not(.lala-kohde-archive), body.single-post, body.blog:not(.lala-kohde-archive) .main-navigation ul ul, body.single-post .main-navigation ul ul {
    background-color: var(--color-white);
}

body.page-template-page-haettavana, body.page-template-page-haettavana .main-navigation ul ul {
    background-color: var(--color-brick);
}

body.page-template-page-taiteilijat, body.page-template-page-taiteilijat .main-navigation ul ul {
    background-color: var(--color-blue);
}

body.page-template-default, body.single-haettavana, body.page-template-default .main-navigation ul ul, body.single-haettavana .main-navigation ul ul {
    background-color: var(--color-beige);
}

.site {
    position: relative;
}

.site-header, .site-footer, input[type="search"].search-field {
    font-family: var(--font-family-h);
    font-size: 1.2rem;
    letter-spacing: 0.03em;
    font-weight: 500;
    text-transform: uppercase;
}

.site-header a {
    text-decoration: none;
}

.site-header a:hover {
	text-decoration: underline;
	color: #000;
}

.main-navigation ul.nav-menu > li > a:hover {
	text-decoration: none;
}

.site-footer {
    letter-spacing: 0.07em;
}

.lala-page-width {
    max-width: var(--width-page);
    margin-left: auto;
    margin-right: auto;
    padding: var(--padding-page);
}

.entry-header > *, .entry-content > *, .entry-footer > * {
    max-width: var(--width-content);
    margin-left: auto;
    margin-right: auto;
}

.entry-content > .lala-full-width, .entry-content > .wp-block-image.alignwide, .entry-content > .wp-block-image.alignfull {
    max-width: none;
}

/*--------------------------------------------------------------
# Components
--------------------------------------------------------------*/
/* Generic */
.lala-flexible-bg-5, .lala-bg-pink {
    background-color: var(--color-pink);
}

.lala-bg-brick {
    background-color: var(--color-brick);
}

.lala-flexible-bg-3, .lala-bg-dark-brick {
    background-color: var(--color-dark-brick);
    color: var(--color-white);
}

.lala-flexible-bg-3 a, .lala-bg-dark-brick a {
    color: var(--color-white);
}

.lala-flexible-bg-4, .lala-bg-beige {
    background-color: var(--color-beige);
}

.lala-flexible-bg-1, .lala-bg-blue {
    background-color: var(--color-blue);
}

.lala-flexible-bg-2 {
    background-color: var(--color-white);
}

/* Header
--------------------------------------------- */
.site-header {
    display: flex;
    flex-direction: column;
}

.site-header-upper {
    width: 100% ;
    display: flex;
    justify-content: space-between;
    padding: var(--padding-header);
}

.site-header-upper-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: end;
    gap: 4px;
}

.site-logo img {
    width: 310px;
    max-width: 100%;
}

.site-title {
    margin: 0;
}

.search-form {
    display: flex;
}

.search-form label {
    display: block;
}

input[type="search"].search-field {
    -webkit-appearance: none;
    background-color: transparent;
    border: none;
    width: 70px;
    text-align: right;
    padding: 0;
    height: 24px;
	position: relative;
	top: -2px;
}

input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: none;
}

input[type="search"].search-field:not(:placeholder-shown), input[type="search"].search-field:focus {
    width: 150px;
    outline: none;
}

input[type="search"].search-field::placeholder {
    color: var(--color-text);
}

input[type="search"].search-field:focus::placeholder {
    opacity: 0.4;
}

button.search-submit {
    border: none;
    padding: 8px 0 8px 4px;
    min-height: 24px;
    width: 15px;
}

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

.site-languages li {
    display: inline-block;
}

.site-languages li + li:before {
    content: "| ";
    margin: 0 5px;
}

/* fixattu header joka ilmestyy kun skrollaa. kommentoi esiin myos navigation.js:ssa.  */
/*
.site-header {
	width: 100%;
	position: fixed;
	left: 0;
	z-index: 1;
	margin-top: calc(-1 * var(--header-height)); 
	transition: margin-top .2s ease-in-out, background-color .2s ease-in-out;
}

.lala-scrolled-up .site-header {
	margin-top: 0;
}
*/
/* Footer
--------------------------------------------- */
.site-footer ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.site-info, .site-info-left {
    gap: var(--padding-page);
}

.site-info {
    padding: var(--padding-page);
    align-items: end;
}

.site-info > * {
    width: 100%;
}

.site-info-left {
    min-width: 290px;
}

.site-info-right, .site-info-left, .site-info {
    display: flex;
}

.site-footer .site-logo img {
    width: 48px;
    max-width: 100%;
}

.site-info p {
    margin-top: 0;
}

.site-info p:last-of-type {
    margin-bottom: 0;
}

.site-info-left .widget {
    width: 100%
}

.site-info a:hover {
	text-decoration: none;
}

.lala-footer-ruudukko {
    height: 46px;
    background: url(img/ruutu.png);
    background-size: 54px;
    background-position: left top;
    background-repeat: repeat-x;
}

/* Navigation v1
--------------------------------------------- */
.main-navigation {
    display: block;
    width: 100%;
}

.main-navigation ul {
    display: none;
    list-style: none;
    margin: 0;
    padding-left: 0;
}

.main-navigation ul ul {
    float: left;
    position: absolute;
    top: 100%;
    left: -999em;
    z-index: 99999;
    display: flex;
    flex-direction: column;
	align-items: center;
    background-color: var(--color-background);
}

.main-navigation.toggled ul li.focus ul {
    float: none;
	background: transparent;
	margin-top: 7px;
}

.main-navigation ul ul ul {
    left: -999em;
    top: 0;
}

.main-navigation ul ul li {
    display: none;
	max-width: 100%;
}

.main-navigation ul li.focus > ul {
    display: block;
    position: static;
}

.main-navigation ul li.focus > ul li {
    display: list-item;
}

.main-navigation ul ul li.focus > ul {
    display: block;
    left: auto;
}

.main-navigation ul ul a {
    width: 200px;
}

.main-navigation li {
    position: relative;
    z-index: 1;
}

.main-navigation ul li {
    line-height: 1.75;
    padding: 10px 0;
}

.main-navigation:not(.toggled) ul.nav-menu > li {
	padding: 0.5em;
}

.main-navigation:not(.toggled) ul li a {
	display: flex;
	height: 100%;
	align-items: center;
	justify-content: center;
}

.main-navigation .sub-menu li:has(a:hover) {
	background: transparent;
}

.main-navigation ul li .main-navigation a {
    text-decoration: none;
}

.main-navigation li.current-menu-item > a, .main-navigation li.current-menu-ancestor > a {
    text-decoration: underline;
}

.menu-toggle, .main-navigation.toggled ul.menu {
    display: block;
}

.main-navigation.toggled > div {
    position: absolute;
    top: 163px;
	padding-top: 20px;
    background-color: var(--color-background);
    width: 100%;
    left: 0;
    min-height: 100vh;
    padding-left: 0;
    padding-right: 0;
    z-index: 1;
	text-align: center;
}

.main-navigation.toggled li {
    width: 100%;
	padding: 18px;
}

.main-navigation.toggled .sub-menu {
	
}

.main-navigation.toggled .sub-menu li {
	padding: 5px 0;
}

.main-navigation.toggled > div > ul > li {
	border-top: 1px solid;
}

button.menu-toggle {
    position: relative;
    z-index: 3;
    border: none;
    border-radius: 0;
    background: 0 0;
    color: var(--color-text);
    line-height: inherit;
    padding: 0;
    width: auto;
    position: absolute;
    top: 20px;
    right: 0;
    box-shadow: none;
    padding: var(--padding-header);
    cursor: pointer;
}

.menu-toggle:after {
    display: block;
    content: '';
    width: 24px;
    height: 27px;
    background-repeat: no-repeat;
    vertical-align: middle;
    background-image: url(img/menu.svg);
}

.toggle-submenu {
    width: 24px;
    height: 24px;
    min-height: auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    background-color: transparent;
    margin-left: 0.5em;
    display: inline-flex;
    justify-content: center;
}

.icon-minus img, .icon-plus img, .icon-minus, .icon-plus {
    width: 10px;
    height: 10px;
    display: block;
}

.toggle-submenu[aria-expanded=true] .icon-minus, .toggle-submenu[aria-expanded=true] .icon-minus, .toggle-submenu[aria-expanded=false] .icon-plus {
    display: block;
}

.toggle-submenu[aria-expanded=false] .icon-minus, .toggle-submenu[aria-expanded=true] .icon-plus {
    display: none;
}

.desktop {
	display: none;
}

@media screen and (min-width: 920px) {
	
	.main-navigation ul.nav-menu > li:hover,
	.main-navigation ul > li:has(a:hover) {
		background: var(--color-white);
		transition: background-color 0.25s, color 0.25s;
	}
	
	.main-navigation ul.nav-menu > li:hover:has(.sub-menu:hover), 
	.main-navigation ul > li:has(.sub-menu a:hover) {
		background: transparent;
	}

	.menu-item:hover > .toggle-submenu .icon-minus {
	    display: block;
	}
	
	.menu-item:hover > .toggle-submenu .icon-plus {
	    display: none;
	}

	
	.desktop {
		display: block;
	}
	
    .menu-toggle {
        display: none;
    }

	.mobile {
        display: none !important;
    }

    .main-navigation ul.nav-menu {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(9%, 1fr));
        width: 100%;
        border-top: var(--border);
    }

    .main-navigation ul.nav-menu > li {
        text-align: center;
        border-left: var(--border);
        border-bottom: var(--border);
        min-height: 80px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
	
	/*
	.main-navigation ul.nav-menu > li a {
		display: block;
		width: 100%;
		height: 100%;	
	}
	*/

    .main-navigation ul.nav-menu > li:first-child {
        border-left: none;
    }

    .main-navigation ul.nav-menu > li:hover {
    }

    .main-navigation ul ul {
        opacity: 0;
        width: calc(100% + 2px);
        transition: opacity 250ms;
        border: 1px solid;
        padding: 10px;
    }

    .main-navigation ul li:hover ul, .main-navigation ul li.focus ul {
        left: -1px;
        opacity: 1;
        position: absolute;
    }

    .main-navigation ul li:hover > ul li, .main-navigation ul li.focus > ul li {
        display: flex;
    }
}

.site-main .comment-navigation, .site-main .posts-navigation, .site-main .post-navigation {
	margin-top: var(--padding-page);
	margin-bottom: var(--padding-page);
}

.comment-navigation .nav-links, .posts-navigation .nav-links, .post-navigation .nav-links {
    display: flex;
	justify-content: center;
	gap: var(--padding-page);
}

.comment-navigation .nav-previous, .posts-navigation .nav-previous, .post-navigation .nav-previous {
	/*
    flex: 1 0 50%;
	*/
}

.comment-navigation .nav-next, .posts-navigation .nav-next, .post-navigation .nav-next {
	/*
    text-align: end;
    flex: 1 0 50%;
	*/
}

.lala-breadcrumbs ol {
    text-align: center;
    list-style: none;
    gap: 0.5em;
    margin: 0;
    margin-top: calc(var(--padding-page) + 20px);
    padding: 0 var(--padding-page);
    font-family: var(--font-family-h);
    font-size: 1.5rem;
}

.lala-breadcrumbs ol li {
    display: inline-block;
	max-width: 100%;
	overflow: hidden;
	text-wrap: nowrap;
	text-overflow: ellipsis;
}

.lala-breadcrumbs ol li + li::before {
    content: '>';
    margin: 0.5em;
}

ul.lala-sub-menu {
    list-style: none;
    margin: 0;
    padding-left: 0;
}

.lala-sub-menu .lala-sub-menu {
    margin-left: 1em;
}

/* Front page elements
--------------------------------------------- */
.lala-hero {
    position: relative;
}

.lala-hero-text {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
	padding: var(--padding-page) calc(2 * var(--padding-page));
}

.lala-hero-text > div {
    max-width: 720px;
}

.lala-hero-image .post-thumbnail {
    margin: 0;
}

.lala-hero-image .post-thumbnail img {
    width: 100%;
    height: 525px;
    display: block;
    object-fit: cover;
    object-position: center;
    mix-blend-mode: multiply;
	filter: grayscale(1);
	opacity: 0.3;
}

.lala-archive-posts .post-thumbnail img {
    width: 100%;
    aspect-ratio: 1/1;
    object-fit: cover;
}

.lala-flexible {
    display: flex;
    gap: var(--gap-flexible);
}

.lala-flexible > * {
    flex-basis: 100%;
}

.lala-flexible > *:last-child {
	max-width: 412px;	
}

.lala-flexible-outer:nth-of-type(2n+1) .lala-flexible > *:first-child {
    order: 1;
}

.lala-flexible img {
	width: 100%;
	aspect-ratio: 412/534;
	object-fit: cover;
	object-position: center;
}

.lala-flexible-image {
    height: 100%;
}

.lala-flexible-left {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.lala-flexible-text {
	flex-basis: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	font-family: var(--font-family-h);
}

.center {
    text-align: center;
    margin-top: var(--padding-page);
}

/* Posts and pages
--------------------------------------------- */
.lala-archive {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--gap-elements);
}

.lala-archive.lala-archive-search {
	grid-template-columns: repeat(1, 1fr);
	margin-bottom: var(--padding-page);
}

.lala-archive a:hover {
    background: var(--color-pink-hover);
    transition: 0.25s;
}

.lala-archive.lala-archive-haettavana a:hover {
	background: var(--color-orange-hover);
	transition: 0.25s;
}

.lala-archive a:hover figure img {
    filter: grayscale(100%);
    mix-blend-mode: multiply;
    transition: 0.25s;
}

.lala-archive-haettavana {
    grid-template-columns: repeat(2, 1fr);
}

.lala-post-types-kohde .lala-archive, .archive.tag .lala-archive, .tax-kohde_cat .lala-archive, .post-type-archive-kohde .lala-archive {
    grid-template-columns: repeat(3, 1fr);
}

.lala-archive-posts {
    grid-template-columns: repeat(2, 1fr);
}

.lala-archive-search a,
.lala-archive-posts a {
    text-decoration: none
}

.lala-archive-search a {
	margin-bottom: var(--gap-elements)
}

.lala-archive-search  a:hover,
.lala-archive-posts a:hover {
    background: transparent;
}

.lala-archive-search a:hover h2,
.lala-archive-posts a:hover h3, .lala-archive-posts a:hover h2 {
    text-decoration: underline;
	text-decoration-thickness: 0.1em;
}

.lala-archive-posts a:hover figure img {
    filter: none;
    mix-blend-mode: normal;
}
.page-template-page-haettavana .lala-page-width {
	padding-top: 0;
}

.lala-archive-haettavana a {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    background: var(--color-beige);
    text-decoration: none;
}

.lala-archive-haettavana a figure, .lala-archive-kohteet a figure {
    margin: 0;
}

.lala-archive-haettavana a figure img {
    display: block;
    height: 100%;
    width: 100%;
	aspect-ratio: 1;
    object-fit: cover;
	object-position: center;
}

.lala-archive-haettavana.lala-archive-odd a:first-of-type {
    grid-column: span 2;
	grid-template-columns: 1fr calc(25% - calc( var(--gap-elements) / 4) );
}

.lala-archive-haettavana.lala-archive-odd a:first-of-type figure img {
    aspect-ratio: 999/483;
}

.lala-archive-haettavana .entry-header, .lala-archive-kohteet .entry-header {
    padding: 40px;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 1em;
}

.lala-archive-haettavana .entry-header > *, .lala-archive-kohteet .entry-header > * {
    margin: 0;
}

.lala-archive-haettavana .entry-header .entry-meta {
	margin-top: 0;
}

.entry-content.lala-haettavana-details div {
    display: flex;
    max-width: var(--width-content);
    margin: 0 auto;
    padding: 0;
    gap: 20px;
}

.lala-haettavana-details dl {
    display: flex;
    width: 50%;
    flex-wrap: wrap;
    margin: 0;
}

.lala-haettavana-details dt, .lala-haettavana-details dd {
    width: 50%;
    padding: 5px 0;
    margin: 0;
}

.lala-haettavana-details dd {
    padding-left: 10px;
}

.entry-meta-starred {
    margin-top: var(--padding-page);
}

.entry-meta-starred a img {
    margin-right: 10px;
}

.lala-starred-label {
    text-align: center;
    margin-top: var(--padding-page);
}

.lala-starred-label img {
    width: 23px;
    vertical-align: -3px;
}

.filters.lala-page-width {
	padding-top: 20px;
}

details.mobile > *:first-of-type {
	margin-top: 30px;
}

.lala-archive-search h2 {
	margin-top: 0;
}

/* Taiteilijat */
.page-template-page-taiteilijat .wp-block-lala-blocks-lala-ingressi, .page-template-page-haettavana .wp-block-lala-blocks-lala-ingressi {
    text-align: center;
}

.lala-artist-filter {
    display: flex;
	justify-content: center;
}

.lala-artist-filter {
	display: flex; 
	flex-wrap: wrap;
	align-items: center;
	/* haloo */
	gap: 0.5em;	
}

.lala-artist-filter label {
	margin-right: 20px;
}

.lala-taiteilijat {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin: var(--padding-page) auto;
}

.lala-taiteilijat ul:empty {
    display: none;
}

.lala-taiteilijat ul {
    list-style: none;
    padding: 0;
    margin: 0 0 var(--padding-page) 0;
}

.lala-taiteilijat li {
	font-family: var(--font-family-h);
	font-weight: 500;
	font-size: 1.8rem;
	letter-spacing: 0.02em;
	margin: 5px 0;
}

.lala-taiteilijat-letters {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.5em;
	margin-bottom: var(--padding-page);
}

.lala-taiteilijat-letters a {
	text-decoration: none;
	margin-top: 0;
	text-transform: uppercase;
}

.lala-taiteilijat-letters a:hover {
	text-decoration: underline;
	text-decoration-thickness: 0.1em;
}

.lala-taiteilijat .h2 {
	text-transform: uppercase;
}

/* Kohteet */
.lala-archive-kohteet a {
    background: var(--color-white);
    text-decoration: none;
    position: relative;
}

.lala-archive-kohteet a .lala-starred {
    position: absolute;
    top: -20px;
    right: -20px;
}

.lala-archive-kohteet a img {
    aspect-ratio: 1/1;
    object-fit: cover;
}

/* General */
.wp-block-lala-blocks-lala-infobox-with-title {
    background-color: var(--color-white);
    padding: var(--gap-elements);
    margin: var(--padding-page) auto;
	font-family: var(--font-family-h);
}

.wp-block-lala-blocks-lala-infobox-with-title h2 {
    margin-top: 0;
}

.sticky {
    display: block;
}

.post, .page {
}

.updated:not(.published) {
    display: none;
}

.page-content, .entry-content {
    margin: var(--padding-page) 0 calc(2 * var(--gap-elements));
	padding: 0 var(--gap-elements);
}

.entry-header {
	padding: 0 var(--padding-page);
}

.entry-meta {
    text-align: center;
}

.entry-meta span {
    margin-right: 1em;
}

.entry-header .entry-meta {
    margin-top: var(--margin-heading);
}

.lala-archive:not(.lala-archive-posts) .entry-header .entry-meta {
	margin-top: 0;
}

.lala-archive-search .entry-meta {
	margin-top: 0;
}

/* Consistent top and bottom margin */
.entry-content > *:last-child, .entry-content > *:last-child > *:last-child, .entry-content > *:last-child > *:last-child > *:last-child {
    margin-bottom: 0;
}

.entry-content > *:first-child, .entry-content > *:first-child > *:first-child, .entry-content > *:first-child > *:first-child > *:first-child {
    margin-top: 0;
}

.page-links {
    clear: both;
    margin: 0 0 1.5em;
}

/* Load more functionality */
/*
.lala-load-more .lala-load-more-load,
.lala-load-more .lala-load-more-loading,
.lala-load-more .lala-load-more-no-more {
	display: none;
}

.lala-load-more:not(.lala-loading):not(.lala-loading-all-loaded) .lala-load-more-load {
	display: inline;
}

.lala-load-more.lala-loading .lala-load-more-loading {
	display: inline;
}

.lala-load-more.lala-loading-all-loaded .lala-load-more-no-more {
	display: inline;
}
*/
/* Comments
--------------------------------------------- */
.comment-content a {
    word-wrap: break-word;
}

.bypostauthor {
    display: block;
}

/* Widgets
--------------------------------------------- */
.widget {
    margin: 0;
}

.widget select {
    max-width: 100%;
}

/* Media
--------------------------------------------- */
body.wp-singular:not(.home, .page-template-page-haettavana) .post-thumbnail {
    max-width: 1440px;
    margin: var(--padding-page) auto;
	padding: 0 var(--padding-page);
}

body.wp-singular:not(.home, .page-template-page-haettavana) .post-thumbnail img {
    width: 100%;
    aspect-ratio: 13.2 / 6;
    object-fit: cover;
}

.page-content .wp-smiley, .entry-content .wp-smiley, .comment-content .wp-smiley {
    border: none;
    margin-bottom: 0;
    margin-top: 0;
    padding: 0;
}

.entry-content figure {
    margin: var(--padding-page) auto;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
    display: inline-block;
}

/* Captions
--------------------------------------------- */
.wp-caption, figcaption {
    margin-bottom: 1.5em;
    max-width: 100%;
    margin: 0.8075em 0;
}

.wp-caption img[class*="wp-image-"] {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
    background: none;
    color: inherit;
    margin-bottom: 0;
    max-height: none;
    overflow: initial;
    padding: 10px 0 0 0;
    position: static;
    text-align: left;
    text-shadow: none;
}

.wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image figcaption {
}

.wp-block-gallery.has-nested-images figure.wp-block-image:has(figcaption):before {
    display: none;
}

/* Galleries
--------------------------------------------- */
.gallery, .wp-block-gallery {
    margin-bottom: 1.5em;
    gap: var(--gap-elements) !important;
}

/* Classic gallery */
.gallery-item {
    display: inline-block;
    text-align: center;
    width: 100%;
}

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

.gallery-columns-3 {
    grid-template-columns: repeat(3, 1fr);
}

.gallery-columns-4 {
    grid-template-columns: repeat(4, 1fr);
}

.gallery-columns-5 {
    grid-template-columns: repeat(5, 1fr);
}

.gallery-columns-6 {
    grid-template-columns: repeat(6, 1fr);
}

.gallery-columns-7 {
    grid-template-columns: repeat(7, 1fr);
}

.gallery-columns-8 {
    grid-template-columns: repeat(8, 1fr);
}

.gallery-columns-9 {
    grid-template-columns: repeat(9, 1fr);
}

.gallery-caption {
    display: block;
}

/* Block gallery */
.wp-block-gallery.columns-2, .columns-default {
    grid-template-columns: repeat(2, 1fr);
}

.wp-block-gallery.columns-3 {
    grid-template-columns: repeat(3, 1fr);
}

.wp-block-gallery.columns-4 {
    grid-template-columns: repeat(4, 1fr);
}

.wp-block-gallery.columns-5 {
    grid-template-columns: repeat(5, 1fr);
}

.wp-block-gallery.columns-6 {
    grid-template-columns: repeat(6, 1fr);
}

.wp-block-gallery.columns-7 {
    grid-template-columns: repeat(7, 1fr);
}

.wp-block-gallery.columns-8 {
    grid-template-columns: repeat(8, 1fr);
}

.wp-block-gallery.columns-9 {
    grid-template-columns: repeat(9, 1fr);
}

.wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) {
    width: calc(50% - 40px);
}

.wp-block-gallery.has-nested-images.columns-4 figure.wp-block-image:not(#individual-image) {
    width: calc(25% - var(--gap-elements));
}

.wp-block-gallery.has-nested-images.columns-3 figure.wp-block-image:not(#individual-image) {
    width: calc(33.33% - var(--gap-elements));
}

.wp-block-gallery.has-nested-images.columns-2 figure.wp-block-image:not(#individual-image) {
    width: calc(50% - var(--gap-elements));
}

figcaption, .wp-block-gallery.caption, .wp-element-caption {
    font-size: 1.6rem !important;
    letter-spacing: 0.02em;
}

.wp-lightbox-overlay .scrim {
    background-color: var(--color-yellow) !important;
    opacity: 0.9 !important;
}

/* gallery fix */
 .wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image:not(#individual-image) img {
	height: auto;
}

/*--------------------------------------------------------------
# Plugins
--------------------------------------------------------------*/
/* Jetpack infinite scroll
--------------------------------------------- */
/* Hide the Posts Navigation and the Footer when Infinite Scroll is in use. */
.infinite-scroll .posts-navigation, .infinite-scroll.neverending .site-footer {
    display: none;
}

/* Re-display the Theme Footer when Infinite Scroll has reached its end. */
.infinity-end.neverending .site-footer {
    display: block;
}

/*--------------------------------------------------------------
# Utilities
--------------------------------------------------------------*/
/* Accessibility
--------------------------------------------- */
/* Text meant only for screen readers. */
.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute !important;
    width: 1px;
    word-wrap: normal !important;
}

.screen-reader-text:focus {
    background-color: var(--color-background);
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    clip: auto !important;
    clip-path: none;
    color: var(--color-black);
    display: block;		
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000;
}

/* Do not show the outline on the skip link target. */
#primary[tabindex="-1"]:focus {
    outline: 0;
}

/* Alignments
--------------------------------------------- */
.alignleft {
    /*rtl:ignore*/
    float: left;
    /*rtl:ignore*/
    margin-right: 1.5em;
    margin-bottom: 1.5em;
}

.alignright {
    /*rtl:ignore*/
    float: right;
    /*rtl:ignore*/
    margin-left: 1.5em;
    margin-bottom: 1.5em;
}

.aligncenter {
    clear: both;
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1.5em;
}

/* Mobile version
-----------------*/



@media screen and (max-width: 919px) {
  
  :root {
      --width-page: 1600px;
      --width-content: 800px;
      --padding-page: 20px;
      --padding-header: 20px 20px 15px;
      --padding-menu: 20px;
      --gap-elements: 40px;
      --gap-flexible: 30px;
	  --margin-heading: 30px;
  }

	body.menu-toggled {
		background-color: var(--color-background) !important;
	}

	.site-header {
		border-bottom: var(--border);
	}
	
	.menu-toggled .site-header {
		border: none;
	}

	
	.toggle-submenu {
		position: absolute;
		right: 10px;
		top: 17px;
	}
	

	.site-logo img {
	    width: 209px;
	}
  
	.site-header-upper-right {
		display: none;
	}

	.menu-toggled .site-header-upper-right {
		display: block;
		position:absolute;
		width: 100%;
		top: 110px;
		text-align: center;
		left: 0;
		background: var(--color-background);
		z-index: 1;
	}

	.menu-toggled .search-form {
		justify-content: center;
		margin-top: 10px;
	}

	.menu-toggled input[type="search"].search-field {
		width: 45px;
	}

	.menu-toggled input[type="search"].search-field:focus {
		width: 145px;
		margin-right: 10px;
		display: inline-block;
		border-bottom: var(--border);
	}

	.site-info-right, .site-info-left, .site-info, .lala-flexible {
		flex-wrap: wrap;
	}

	.lala-archive-haettavana, 
	.lala-post-types-kohde .lala-archive, 
	.archive.tag .lala-archive, 
	.tax-kohde_cat .lala-archive, 
	.post-type-archive-kohde .lala-archive, 
	.lala-archive-posts {
	    grid-template-columns: repeat(1, 1fr);
	}

	.lala-archive-haettavana.lala-archive-odd a:first-of-type {
	    grid-column: unset;
	}

}

@media screen and (max-width: 600px) {

	.center {
		margin-top: var(--gap-elements);
	}
	
	.home h2 {
		padding-top: var(--padding-page);
		padding-bottom: calc(2 * var(--padding-page));
	}
	
	.home .lala-page-width {
		padding: calc(2 * var(--padding-page)) var(--padding-page);
	}
	
	.lala-archive-haettavana a,
	.lala-archive-haettavana.lala-archive-odd a:first-of-type {
	    grid-template-columns: repeat(1, 1fr);
	}
	.lala-hero-image .post-thumbnail img {
		height: 375px;
	}

	body, button, input, select, optgroup, textarea {
		font-size: 1.5rem;
	}

	button, input, select, optgroup, textarea {
		max-width: 100%;
	}

	h1 {
		font-size: 3rem;
		margin: var(--gap-elements) 0;
	}

	.blog h1 {
		margin-bottom: var(--padding-page);
	}

	.single-haettavana h1, .single-post h1 {
		font-size: 2.4rem;
	}

	h2 {
		font-size: 2rem;
	}

	h3, .searchandfilter h4, .wp-block-lala-blocks-lala-infobox-with-title h2, summary {
		font-size: 1.3rem;
	}

	.lala-archive-search h2,
	.archive .type-post h2, .lala-archive-posts h3, .lala-archive-posts h2, .lala-hero-text {
		font-size: 1.9rem;
	}

	.home h2 {
		font-size: 2.4rem;
	}

	.lala-flexibles h2 {
		font-size: 1.9rem;
		padding-bottom: 10px;
		padding-top: 0;
	}
	
	.lala-flexible > *:last-child {
		max-width: none;	
	}

	.entry-content blockquote {
		font-size: 1.9rem;
	}

	.lala-archive .type-haettavana h2,
	.lala-archive .type-kohde h2, .lala-archive .type-haettavana h3 {
		font-size: 1.7rem;
	}

	a.lala-button, .wp-block-button__link, .entry-meta,
	.entry-haku-paattyy {
		font-size: 1.5rem;
	}

	.wp-block-lala-blocks-lala-ingressi {
		font-size: 1.8rem;
	}

	figcaption, .wp-block-gallery.caption, .wp-element-caption {
		font-size: 1.4rem !important;
	}

	.lala-archive-haettavana .entry-meta, .lala-archive-kohteet .entry-meta {
		margin-top: 0;
	}

	.wp-block-gallery  figure {
		width: 100% !important;
	}

	body.wp-singular:not(.home, .page-template-page-haettavana) .post-thumbnail img {
	    aspect-ratio: 33 / 22;
	}

	.main-navigation ul > li:has(a:hover) {
		background: transparent;
	}

	.page-template-page-haettavana .lala-archive-haettavana {
		margin-left: calc(-2 * var(--padding-page));
		margin-right: calc(-2 * var(--padding-page));
	}

	.lala-haettavana-details div {
		flex-wrap: wrap;
	}

	.lala-haettavana-details dl {
		width: 100%;
	}

	.wp-block-lala-blocks-lala-infobox-with-title {
		padding: var(--padding-page);
	}

	.wp-block-lala-blocks-lala-infobox-with-title p {
		margin-bottom: 1em;
	}

	.searchandfilter ul {
	    grid-template-columns: repeat(1, 1fr) !important;
		text-align: left;
		gap: var(--padding-page)
	}

	.searchandfilter li {
		padding: 0
	}

	.searchandfilter li + li h4 {
		margin-top: 1em;
	}
	
	.searchandfilter ul ul {
		display: flex;
		flex-wrap: wrap;
		gap: 10px;
	}

	.filters.lala-page-width {
		padding-top: 0;
	}
	
	.lala-starred-label {
		margin-top: calc(2 * var(--padding-page));
		display: flex;
		justify-content: center;
		gap: 0.25em;
		align-items: center;
	}
	
	input[type="button"], input[type="reset"], input[type="submit"], button, .searchandfilter label:has(input[type=radio]), .searchandfilter label:has(input[type=checkbox]), .lala-button-starred {
		font-size: 1.2rem;
	}

	.lala-artist-filter {
		margin-top: var(--gap-elements);
	}

	.lala-taiteilijat ul {
		margin-top: 30px;
	}

	.lala-taiteilijat {
	    grid-template-columns: repeat(1, 1fr);
	}

	.lala-taiteilijat li {
		font-size: 1.5rem;
	}

}