/*
MAIN STYLES FOR PORTFOLIO24
Jarkko Ruonakoski 2024-2025
*/

/* FONTIT > asetetaan paikallisesti > Cabin + Cabin Condensed > */

/* Cabin Regular 400 */
@font-face {
    font-display: swap;
    font-family: 'Cabin';
    font-style: normal;
    font-weight: 400;
    src: url('/wp-content/themes/portfolio24/fonts/cabin-v27-latin_latin-ext-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
         url('/wp-content/themes/portfolio24/fonts/cabin-v27-latin_latin-ext-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
  }
  /* Cabin Regular 400 Italic */
  @font-face {
    font-display: swap;
    font-family: 'Cabin';
    font-style: italic;
    font-weight: 400;
    src: url('/wp-content/themes/portfolio24/fonts/cabin-v27-latin_latin-ext-italic.woff2') format('woff2'),
         url('/wp-content/themes/portfolio24/fonts/cabin-v27-latin_latin-ext-italic.ttf') format('truetype'); 
  }
  /* Cabin Medium 500 */
  @font-face {
    font-display: swap;
    font-family: 'Cabin';
    font-style: normal;
    font-weight: 500;
    src: url('/wp-content/themes/portfolio24/fonts/cabin-v27-latin_latin-ext-500.woff2') format('woff2'),
         url('/wp-content/themes/portfolio24/fonts/cabin-v27-latin_latin-ext-500.ttf') format('truetype');
  }
  /* Cabin Medium 500 Italic */
  @font-face {
    font-display: swap;
    font-family: 'Cabin';
    font-style: italic;
    font-weight: 500;
    src: url('/wp-content/themes/portfolio24/fonts/cabin-v27-latin_latin-ext-500italic.woff2') format('woff2'),
         url('/wp-content/themes/portfolio24/fonts/cabin-v27-latin_latin-ext-500italic.ttf') format('truetype');
  }
  /* Cabin SemiBold 600 */
  @font-face {
    font-display: swap;
    font-family: 'Cabin';
    font-style: normal;
    font-weight: 600;
    src: url('/wp-content/themes/portfolio24/fonts/cabin-v27-latin_latin-ext-600.woff2') format('woff2'),
         url('/wp-content/themes/portfolio24/fonts/cabin-v27-latin_latin-ext-600.ttf') format('truetype');
  }
  /* Cabin SemiBold 600 Italic */
  @font-face {
    font-display: swap;
    font-family: 'Cabin';
    font-style: italic;
    font-weight: 600;
    src: url('/wp-content/themes/portfolio24/fonts/cabin-v27-latin_latin-ext-600italic.woff2') format('woff2'),
         url('/wp-content/themes/portfolio24/fonts/cabin-v27-latin_latin-ext-600italic.ttf') format('truetype'); 
  }
  /* Cabin Bold 700 */
  @font-face {
    font-display: swap;
    font-family: 'Cabin';
    font-style: normal;
    font-weight: 700;
    src: url('/wp-content/themes/portfolio24/fonts/cabin-v27-latin_latin-ext-700.woff2') format('woff2'),
         url('/wp-content/themes/portfolio24/fonts/cabin-v27-latin_latin-ext-700.ttf') format('truetype');
  }
  /* Cabin Bold 700 Italic */
  @font-face {
    font-display: swap;
    font-family: 'Cabin';
    font-style: italic;
    font-weight: 700;
    src: url('/wp-content/themes/portfolio24/fonts/cabin-v27-latin_latin-ext-700italic.woff2') format('woff2'),
         url('/wp-content/themes/portfolio24/fonts/cabin-v27-latin_latin-ext-700italic.ttf') format('truetype');
  }
  /* Cabin Condensed Regular 400 */
  @font-face {
    font-display: swap;
    font-family: 'Cabin Condensed';
    font-style: normal;
    font-weight: 400;
    src: url('/wp-content/themes/portfolio24/fonts/cabin-condensed-v20-latin_latin-ext-regular.woff2') format('woff2'),
         url('/wp-content/themes/portfolio24/fonts/cabin-condensed-v20-latin_latin-ext-regular.ttf') format('truetype');
  }
  /* Cabin Condensed Medium 500 */
  @font-face {
    font-display: swap;
    font-family: 'Cabin Condensed';
    font-style: normal;
    font-weight: 500;
    src: url('/wp-content/themes/portfolio24/fonts/cabin-condensed-v20-latin_latin-ext-500.woff2') format('woff2'),
         url('/wp-content/themes/portfolio24/fonts/cabin-condensed-v20-latin_latin-ext-500.ttf') format('truetype');
  }
  /* Cabin Condensed SemiBold 600 */
  @font-face {
    font-display: swap;
    font-family: 'Cabin Condensed';
    font-style: normal;
    font-weight: 600;
    src: url('/wp-content/themes/portfolio24/fonts/cabin-condensed-v20-latin_latin-ext-600.woff2') format('woff2'),
         url('/wp-content/themes/portfolio24/fonts/cabin-condensed-v20-latin_latin-ext-600.ttf') format('truetype');
  }
  /* Cabin Condensed Bold 700 */
  @font-face {
    font-display: swap;
    font-family: 'Cabin Condensed';
    font-style: normal;
    font-weight: 700;
    src: url('/wp-content/themes/portfolio24/fonts/cabin-condensed-v20-latin_latin-ext-700.woff2') format('woff2'),
         url('/wp-content/themes/portfolio24/fonts/cabin-condensed-v20-latin_latin-ext-700.ttf') format('truetype');
  }

/* MAIN STYLES: Portfolio 2024 */

/*Portfolion perusmääritteet > Fontit + Värit*/

:root {
--heading-font: 'Cabin Condensed'; /*oletus-fontti otsikoihin ja tehosteisiin: Cabin Condensed*/
--main-font: 'Cabin'; /*oletus-fontti: Cabin*/
--pagepadding: 60px; /* Sivuston reunusten koko */

--zeikki-blue-main: 77, 0, 255; /* #4D00FF - pää-sininen tumma */
--zeikki-blue-light: 211, 233, 243; /* #D3E9F3 - vaalean sininen*/
--zeikki-green-dark: 33, 132, 160; /* #2184A0 - tumman sinivihreä / petrooli */
--zeikki-green-light: 60, 190, 169; /* #3CBEA9 - vaalea kirkas vihreä */
--zeikki-purple-light: 244, 156, 255; /* #F49CFF - vaalea kirkas violetti */
--zeikki-orange: 255, 223, 0; /* #FFDF00 - oranssi */
--zeikki-yellow: 227, 255, 0; /* #E3FF00 - kirkas huomio keltainen */
--zeikki-gray-mud: 179, 166, 185; /* #B3A6B9 - sävyharmaa */

--black: 31, 25, 38; /*#1F1926 > sävytetty musta*/
--basic-black: 0, 0, 0; /*#000000 > perus-musta*/
--mat-black: 23, 23, 23; /*#171717 > "leikattu" musta*/
--gray90: 25, 25, 25; /*#191919*/
--gray80: 51, 51, 51; /*#333333*/
--gray70: 76, 76, 76; /*#4C4C4C*/
--gray60: 102, 102, 102; /*#666666*/
--gray50: 127, 127, 127; /*#7F7F7F*/
--gray40: 153, 153, 153; /*999999*/
--gray30: 178, 178, 178; /*#b2b2b2*/
--gray20: 204, 204, 204; /*#cccccc*/
--gray10: 229, 229, 229; /*#e5e5e5*/
--gray5: 243, 243, 243; /*#F3F3F3*/
--white: 255, 255, 255; /*FFF*/
--access-white: 232, 232, 232; /*E8E8E8 ––> leikattu valkoinen > saavutettavuus*/

--alpha0: 0; /*transparent*/
--alpha05: 0.05; /*"textbox"*/
--alpha10: 0.1; /*e7e7e7*/
--alpha20: 0.2; /*d1d1d1*/
--alpha30: 0.3; /*b9b9b9*/
--alpha40: 0.4; /*a2a2a2*/
--alpha50: 0.5; /*8b8b8b*/
--alpha60: 0.6; /*747474*/
--alpha70: 0.7; /*5c5c5c*/
--alpha80: 0.8; /*454545*/
--alpha90: 0.9; /*2e2e2e*/
--alpha100: 1; /*2e2e2e*/

/** INLINE SVG:t globaalisti ––> **/

--monogrammi24-black: url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTAwIDEwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJtNTguODI1IDUxLjYzMnYtNy44ODJoLTEwLjM2NHYzMS4yNWgxMS44ODljMC0xMy44MDcgMTEuMTkzLTI1IDI1LTI1di0xMC4zNWMtMTAuNTY1IDAtMjAuMDQ3IDQuNjM1LTI2LjUyNSAxMS45ODJ6Ii8+PHBhdGggZD0ibTM5LjY1IDI1YzAgMTMuODA3LTExLjE5MyAyNS0yNSAyNXYxMC4zNWMxOS41MjMgMCAzNS4zNS0xNS44MjcgMzUuMzUtMzUuMzV6Ii8+PHBhdGggZD0ibTUwIDBjLTI3LjYxNCAwLTUwIDIyLjM4Ni01MCA1MHMyMi4zODYgNTAgNTAgNTAgNTAtMjIuMzg2IDUwLTUwLTIyLjM4Ni01MC01MC01MHptMzAuOTAxIDgwLjkwMWMtNC4wMTUgNC4wMTUtOC42ODkgNy4xNjctMTMuODkyIDkuMzY4LTUuMzgzIDIuMjc3LTExLjEwNiAzLjQzMi0xNy4wMDggMy40MzJzLTExLjYyNS0xLjE1NS0xNy4wMDgtMy40MzJjLTUuMjAzLTIuMjAxLTkuODc3LTUuMzUyLTEzLjg5Mi05LjM2OC00LjAxNS00LjAxNS03LjE2Ny04LjY5LTkuMzY4LTEzLjg5My0yLjI3Ny01LjM4My0zLjQzMi0xMS4xMDYtMy40MzItMTcuMDA4czEuMTU1LTExLjYyNSAzLjQzMi0xNy4wMDhjMi4yMDEtNS4yMDMgNS4zNTItOS44NzcgOS4zNjgtMTMuODkzIDQuMDE1LTQuMDE1IDguNjg5LTcuMTY3IDEzLjg5Mi05LjM2OCA1LjM4My0yLjI3NyAxMS4xMDYtMy40MzIgMTcuMDA4LTMuNDMyczExLjYyNSAxLjE1NSAxNy4wMDggMy40MzJjNS4yMDMgMi4yMDEgOS44NzcgNS4zNTIgMTMuODkyIDkuMzY4IDQuMDE1IDQuMDE1IDcuMTY3IDguNjkgOS4zNjggMTMuODkzIDIuMjc3IDUuMzgzIDMuNDMyIDExLjEwNiAzLjQzMiAxNy4wMDhzLTEuMTU1IDExLjYyNS0zLjQzMiAxNy4wMDhjLTIuMjAxIDUuMjAzLTUuMzUyIDkuODc3LTkuMzY4IDEzLjg5M3oiLz48L3N2Zz4=); /* JR-monogrammi esim. headerit ja sivuston alueiden kuvitus > */

--facebook-icon: url(data:image/svg+xml;base64,PHN2ZyBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMDAgMTAwIiB2aWV3Qm94PSIwIDAgMTAwIDEwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJtNTAgLjE4M2MtMjcuNjE0IDAtNTAgMjIuMzg2LTUwIDUwIDAgMjMuNDQ5IDE2LjE0MyA0My4xMjQgMzcuOTIxIDQ4LjUyOHYtMzMuMjQ5aC0xMC4zMXYtMTUuMjc5aDEwLjMxdi02LjU4NGMwLTE3LjAxOCA3LjcwMi0yNC45MDYgMjQuNDEtMjQuOTA2IDMuMTY4IDAgOC42MzMuNjIxIDEwLjg2OSAxLjI0MnYxMy44NTFjLTEuMTgtLjEyNC0zLjIzLS4xODYtNS43NzYtLjE4Ni04LjE5OSAwLTExLjM2NiAzLjEwNi0xMS4zNjYgMTEuMTh2NS40MDRoMTYuMzMybC0yLjgwNiAxNS4yNzloLTEzLjUyN3YzNC4zNTVjMjQuNzU4LTIuOTkxIDQzLjk0My0yNC4wNzEgNDMuOTQzLTQ5LjYzNSAwLTI3LjYxNC0yMi4zODYtNTAtNTAtNTB6Ii8+PC9zdmc+); /* facebook-ikoni esim. footeriin > */

--instagram-icon: url(data:image/svg+xml;base64,PHN2ZyBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA4MCA4MCIgdmlld0JveD0iMCAwIDgwIDgwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Im00MC44IDgwYy0uMyAwLS41IDAtLjggMC02LjMgMC0xMi4xLS4xLTE3LjctLjUtNS4yLS4zLTkuOS0yLjEtMTMuNi01LjItMy42LTMtNi4xLTctNy40LTExLjktMS4xLTQuMi0xLjItOC40LTEuMi0xMi41IDAtMi45LS4xLTYuNC0uMS05LjlzLjEtNyAuMS05LjljLjEtNC4xLjEtOC4zIDEuMi0xMi42IDEuMy00LjkgMy43LTguOSA3LjQtMTEuOCAzLjgtMy4xIDguNS00LjggMTMuNi01LjIgNS42LS40IDExLjQtLjUgMTcuNy0uNXMxMi4xLjEgMTcuNy41YzUuMi4zIDkuOSAyLjEgMTMuNiA1LjIgMy42IDMgNi4xIDcgNy40IDExLjkgMS4xIDQuMyAxLjIgOC41IDEuMiAxMi42IDAgMi45LjEgNi40LjEgOS45cy0uMSA3LS4xIDkuOWMtLjEgNC4xLS4xIDguMy0xLjIgMTIuNi0xLjMgNC45LTMuNyA4LjktNy40IDExLjktMy44IDMuMS04LjUgNC44LTEzLjYgNS4yLTUuNC4xLTEwLjkuMy0xNi45LjN6bS0uOC02LjNjNi4yIDAgMTEuOC0uMSAxNy4zLS41IDMuOS0uMiA3LjMtMS41IDEwLjEtMy44IDIuNi0yLjEgNC4zLTUgNS4yLTguNnMxLTcuNCAxLTExLjFjMC0yLjkuMS02LjMuMS05LjhzLS4xLTYuOS0uMS05LjhjLS4xLTMuNy0uMS03LjUtMS0xMS4xcy0yLjctNi41LTUuMi04LjZjLTIuOC0yLjItNi4yLTMuNC0xMC4xLTMuNy01LjUtLjMtMTEuMS0uNS0xNy4zLS40LTYuMiAwLTExLjguMS0xNy4zLjUtMy45LjItNy4zIDEuNS0xMC4xIDMuOC0yLjYgMi4xLTQuMyA1LTUuMiA4LjZzLTEgNy40LTEgMTEuMWMwIDIuOS0uMSA2LjMtLjEgOS44cy4xIDYuOS4xIDkuOGMuMSAzLjcuMSA3LjUgMSAxMS4xczIuNyA2LjUgNS4yIDguNmMyLjggMi4zIDYuMiAzLjUgMTAuMSAzLjggNS41LjIgMTEuMS40IDE3LjMuM3ptLS4yLTE0LjJjLTEwLjggMC0xOS41LTguOC0xOS41LTE5LjVzOC44LTE5LjUgMTkuNS0xOS41YzEwLjggMCAxOS41IDguOCAxOS41IDE5LjVzLTguNyAxOS41LTE5LjUgMTkuNXptMC0zMi44Yy03LjMgMC0xMy4zIDYtMTMuMyAxMy4zczYgMTMuMyAxMy4zIDEzLjMgMTMuMy02IDEzLjMtMTMuMy01LjktMTMuMy0xMy4zLTEzLjN6bTIxLjgtMTIuNWMtMi42IDAtNC43IDIuMS00LjcgNC43czIuMSA0LjcgNC43IDQuNyA0LjctMi4xIDQuNy00LjctMi4xLTQuNy00LjctNC43eiIvPjwvc3ZnPg==); /* instagram-ikoni esim. footeriin > */

--linkedin-icon: url(data:image/svg+xml;base64,PHN2ZyBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA1MTIgNTEyIiB2aWV3Qm94PSIwIDAgNTEyIDUxMiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJtMTYwLjAwOCA0MjNoLTcwdi0yMjZoNzB6bTYuOTg0LTI5OC4wMDRjMC0yMi42MjktMTguMzU5LTQwLjk5Ni00MC45NzctNDAuOTk2LTIyLjcwMyAwLTQxLjAxNSAxOC4zNjctNDEuMDE1IDQwLjk5NiAwIDIyLjYzNyAxOC4zMTIgNDEuMDA0IDQxLjAxNiA0MS4wMDQgMjIuNjE3IDAgNDAuOTc2LTE4LjM2NyA0MC45NzYtNDEuMDA0em0yNTUuMDA4IDE3My42NjhjMC02MC42NjgtMTIuODE2LTEwNS42NjQtODMuNjg4LTEwNS42NjQtMzQuMDU1IDAtNTYuOTE0IDE3LjAzMS02Ni4yNDYgMzQuNzQyaC0uMDY2di0zMC43NDJoLTY4djIyNmg2OHYtMTEyLjIxMWMwLTI5LjM4NyA3LjQ4LTU3Ljg1NSA0My45MDYtNTcuODU1IDM1LjkzIDAgMzcuMDk0IDMzLjYwNSAzNy4wOTQgNTkuNzIzdjExMC4zNDNoNjl6bTkwIDE1My4zMzZ2LTM5MmMwLTMzLjA4Ni0yNi45MTQtNjAtNjAtNjBoLTM5MmMtMzMuMDg2IDAtNjAgMjYuOTE0LTYwIDYwdjM5MmMwIDMzLjA4NiAyNi45MTQgNjAgNjAgNjBoMzkyYzMzLjA4NiAwIDYwLTI2LjkxNCA2MC02MHptLTYwLTQxMmMxMS4wMjcgMCAyMCA4Ljk3MyAyMCAyMHYzOTJjMCAxMS4wMjctOC45NzMgMjAtMjAgMjBoLTM5MmMtMTEuMDI3IDAtMjAtOC45NzMtMjAtMjB2LTM5MmMwLTExLjAyNyA4Ljk3My0yMCAyMC0yMHoiLz48L3N2Zz4=); /* linkedin-ikoni esim. footeriin > */

--bluesky-icon: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj4KICA8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMjkuMi4xLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogMi4xLjAgQnVpbGQgMTE2KSAgLS0+CiAgPHBhdGggZD0iTTIxLjY3NiwxMS45MDNjMTEuNDY1LDguNjA3LDIzLjc5NiwyNi4wNTgsMjguMzI0LDM1LjQyNCw0LjUyOC05LjM2NSwxNi44NTktMjYuODE3LDI4LjMyNC0zNS40MjQsOC4yNzItNi4yMSwyMS42NzYtMTEuMDE2LDIxLjY3Niw0LjI3NSwwLDMuMDU0LTEuNzUxLDI1LjY1My0yLjc3OCwyOS4zMjItMy41NjksMTIuNzU2LTE2LjU3NiwxNi4wMDktMjguMTQ2LDE0LjA0LDIwLjIyNCwzLjQ0MiwyNS4zNjksMTQuODQzLDE0LjI1OCwyNi4yNDUtMjEuMTAyLDIxLjY1My0zMC4zMjktNS40MzMtMzIuNjk1LTEyLjM3My0uNDMzLTEuMjcyLS42MzYtMS44NjgtLjYzOS0xLjM2MS0uMDAzLS41MDYtLjIwNi4wODktLjYzOSwxLjM2MS0yLjM2NCw2Ljk0LTExLjU5MiwzNC4wMjctMzIuNjk1LDEyLjM3My0xMS4xMTEtMTEuNDAxLTUuOTY2LTIyLjgwMywxNC4yNTgtMjYuMjQ1LTExLjU3LDEuOTY5LTI0LjU3Ny0xLjI4NC0yOC4xNDYtMTQuMDQtMS4wMjctMy42NjktMi43NzgtMjYuMjY5LTIuNzc4LTI5LjMyMkMwLC44ODcsMTMuNDA0LDUuNjkyLDIxLjY3NiwxMS45MDNoMFoiLz4KPC9zdmc+); /* bluesky-ikoni esim. footeriin > */

--salama-icon: url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjQgMjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0ibTExIDIxLjloLS4zYy0uNCAwLS43LS41LS43LS45di02aC02Yy0uNCAwLS43LS4yLS45LS42LS4yLS4zIDAtLjggMC0xLjFsOS4xLTEwLjljLjMtLjMuNy0uNSAxLjEtLjMuNCAwIC43LjUuNy45djZoNmMuNCAwIC43LjIuOS42LjIuMyAwIC44IDAgMS4xbC05IDExYy0uMi4yLS41LjQtLjguNHptLTQuOS05aDQuOWMuNiAwIDEgLjQgMSAxdjQuMmw1LjktNy4yaC00LjljLS42IDAtMS0uNC0xLTF2LTQuMnMtNS45IDcuMi01LjkgNy4yeiIvPjwvc3ZnPg==); /* salama-ikoni sähköpostiin > yhteystiedot */

--kanykka-icon: url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjQgMjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0ibTE2IDJoLThjLTEuNyAwLTMgMS4zLTMgM3YxNGMwIDEuNyAxLjMgMyAzIDNoOGMxLjcgMCAzLTEuMyAzLTN2LTE0YzAtMS43LTEuMy0zLTMtM3ptMSAxN2MwIC42LS40IDEtMSAxaC04Yy0uNiAwLTEtLjQtMS0xdi0xNGMwLS42LjQtMSAxLTFoOGMuNiAwIDEgLjQgMSAxeiIvPjxwYXRoIGQ9Im0xMiAxN2MtLjYgMC0xIC40LTEgMXMuNSAxIDEgMSAxLS40IDEtMS0uNC0xLTEtMXoiLz48L3N2Zz4=); /* puhelin aka kännykkä-ikoni > yhteystiedot */

--arrow-right-icon: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9IjAgMCAyNCAyNCIgc3Ryb2tlPSJjdXJyZW50Q29sb3IiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIiBkPSJNMTQgNWw3IDdtMCAwbC03IDdtNy03SDMiLz4KPC9zdmc+Cg==); /* nuoli/arrow osoittaa oikealle > painikkeisiin > */

--arrow-down-icon: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9IjAgMCAyNCAyNCIgc3Ryb2tlPSJjdXJyZW50Q29sb3IiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIiBkPSJNMTkgMTRsLTcgN20wIDBsLTctN203IDdWMyIvPgo8L3N2Zz4K); /* nuoli/arrow osoittaa alas > painikkeisiin > */

--arrow-left-icon: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9IjAgMCAyNCAyNCIgc3Ryb2tlPSJjdXJyZW50Q29sb3IiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIiBkPSJNMTAgMTlsLTctN20wIDBsNy03bS03IDdoMTgiLz4KPC9zdmc+Cg==); /* nuoli/arrow osoittaa vasemmalle > painikkeisiin > */

--arrow-up-icon: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9IjAgMCAyNCAyNCIgc3Ryb2tlPSJjdXJyZW50Q29sb3IiPgogIDxwYXRoIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIiBkPSJNNSAxMGw3LTdtMCAwbDcgN20tNy03djE4Ii8+Cjwvc3ZnPgo=); /* nuoli/arrow osoittaa ylös > painikkeisiin > esim. back to top jne.*/

--plus-icon: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0iY3VycmVudENvbG9yIj4KICA8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMCA1YTEgMSAwIDAxMSAxdjNoM2ExIDEgMCAxMTAgMmgtM3YzYTEgMSAwIDExLTIgMHYtM0g2YTEgMSAwIDExMC0yaDNWNmExIDEgMCAwMTEtMXoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPgo8L3N2Zz4K); /* plussa-merkki > suodattimiin */

--minus-icon: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0iY3VycmVudENvbG9yIj4KICA8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0zIDEwYTEgMSAwIDAxMS0xaDEyYTEgMSAwIDExMCAySDRhMSAxIDAgMDEtMS0xeiIgY2xpcC1ydWxlPSJldmVub2RkIi8+Cjwvc3ZnPgo=); /* miinus-merkki > suodattimiin */

}

/* GUTENBERG ––> WP6 nollausta  */
.wp-container-1, .wp-container-2, .wp-container-3, .wp-container-4, .wp-container-5, .wp-container-6, .wp-container-7, .wp-container-8, .wp-container-9, .wp-container-10,
.wp-container-11, .wp-container-12, .wp-container-13, .wp-container-14, .wp-container-15, .wp-container-16, .wp-container-17, .wp-container-18, .wp-container-19, .wp-container-20,
.wp-container-21, .wp-container-22, .wp-container-23, .wp-container-24, .wp-container-25, .wp-container-26, .wp-container-27, .wp-container-28, .wp-container-29, .wp-container-30,
.wp-container-31, .wp-container-32, .wp-container-33, .wp-container-34, .wp-container-35, .wp-container-36, .wp-container-37, .wp-container-38, .wp-container-39, .wp-container-40,
.wp-container-41, .wp-container-42, .wp-container-43, .wp-container-44, .wp-container-45, .wp-container-46, .wp-container-47, .wp-container-48, .wp-container-49, .wp-container-50,
.wp-container-51, .wp-container-52, .wp-container-53, .wp-container-54, .wp-container-55, .wp-container-56, .wp-container-57, .wp-container-58, .wp-container-59, .wp-container-60,
.wp-container-61, .wp-container-62, .wp-container-63, .wp-container-64, .wp-container-65, .wp-container-66, .wp-container-67, .wp-container-68, .wp-container-69, .wp-container-70,
.wp-container-71, .wp-container-72, .wp-container-73, .wp-container-74, .wp-container-75, .wp-container-76, .wp-container-77, .wp-container-78, .wp-container-79, .wp-container-80,
.wp-container-81, .wp-container-82, .wp-container-83, .wp-container-84, .wp-container-85, .wp-container-86, .wp-container-87, .wp-container-88, .wp-container-89, .wp-container-90,
.wp-container-91, .wp-container-92, .wp-container-93, .wp-container-94, .wp-container-95, .wp-container-96, .wp-container-97, .wp-container-98, .wp-container-99, .wp-container-100,
.wp-container-101, .wp-container-102, .wp-container-103, .wp-container-104, .wp-container-105, .wp-container-106, .wp-container-107, .wp-container-108, .wp-container-109, .wp-container-110,
.wp-container-111, .wp-container-112, .wp-container-113, .wp-container-114, .wp-container-115, .wp-container-116, .wp-container-117, .wp-container-118, .wp-container-119, .wp-container-120,
.wp-container-121, .wp-container-122, .wp-container-123, .wp-container-124, .wp-container-125, .wp-container-126, .wp-container-127, .wp-container-128, .wp-container-129, .wp-container-130,
.wp-container-131, .wp-container-132, .wp-container-133, .wp-container-134, .wp-container-135, .wp-container-136, .wp-container-137, .wp-container-138, .wp-container-139, .wp-container-140,
.wp-container-141, .wp-container-142, .wp-container-143, .wp-container-144, .wp-container-145, .wp-container-146, .wp-container-147, .wp-container-148, .wp-container-149, .wp-container-150,
.wp-container-151, .wp-container-152, .wp-container-153, .wp-container-154, .wp-container-155, .wp-container-156, .wp-container-157, .wp-container-158, .wp-container-159, .wp-container-160,
.wp-container-161, .wp-container-162, .wp-container-163, .wp-container-164, .wp-container-165, .wp-container-166, .wp-container-167, .wp-container-168, .wp-container-169, .wp-container-170,
.wp-container-171, .wp-container-172, .wp-container-173, .wp-container-174, .wp-container-175, .wp-container-176, .wp-container-177, .wp-container-178, .wp-container-179, .wp-container-180,
.wp-container-181, .wp-container-182, .wp-container-183, .wp-container-184, .wp-container-185, .wp-container-186, .wp-container-187, .wp-container-188, .wp-container-189, .wp-container-190,
.wp-container-191, .wp-container-192, .wp-container-193, .wp-container-194, .wp-container-195, .wp-container-196, .wp-container-197, .wp-container-198, .wp-container-199, .wp-container-200,
.wp-container-201, .wp-container-202, .wp-container-203, .wp-container-204, .wp-container-205, .wp-container-206, .wp-container-207, .wp-container-208, .wp-container-209, .wp-container-210,
.wp-container-211, .wp-container-212, .wp-container-213, .wp-container-214, .wp-container-215, .wp-container-216, .wp-container-217, .wp-container-218, .wp-container-219, .wp-container-220,
.wp-container-221, .wp-container-222, .wp-container-223, .wp-container-224, .wp-container-225, .wp-container-226, .wp-container-227, .wp-container-228, .wp-container-229, .wp-container-230,
.wp-container-231, .wp-container-232, .wp-container-233, .wp-container-234, .wp-container-235, .wp-container-236, .wp-container-237, .wp-container-238, .wp-container-239, .wp-container-240,
.wp-container-241, .wp-container-242, .wp-container-243, .wp-container-244, .wp-container-245, .wp-container-246, .wp-container-247, .wp-container-248, .wp-container-249, .wp-container-250,
.wp-container-251, .wp-container-252, .wp-container-253, .wp-container-254, .wp-container-255, .wp-container-256, .wp-container-257, .wp-container-258, .wp-container-259, .wp-container-260,
.wp-container-261, .wp-container-262, .wp-container-263, .wp-container-264, .wp-container-265, .wp-container-266, .wp-container-267, .wp-container-268, .wp-container-269, .wp-container-270,
.wp-container-271, .wp-container-272, .wp-container-273, .wp-container-274, .wp-container-275, .wp-container-276, .wp-container-277, .wp-container-278, .wp-container-279, .wp-container-280,
.wp-container-281, .wp-container-282, .wp-container-283, .wp-container-284, .wp-container-285, .wp-container-286, .wp-container-287, .wp-container-288, .wp-container-289, .wp-container-290,
.wp-container-291, .wp-container-292, .wp-container-293, .wp-container-294, .wp-container-295, .wp-container-296, .wp-container-297, .wp-container-298, .wp-container-299, .wp-container-300
{gap: 0 !important;}

/* GUTENBERG ––> WP6 nollausta */
.wp-block-columns.is-not-stacked-on-mobile {flex-wrap: wrap !important;}
.wp-block-image .aligncenter {margin-left: auto !important; margin-right: auto !important;}

:where(.wp-block-columns.is-layout-flex) {gap: 0 !important;} /*Gutenberg nollaus > WP 6.4.1 */
:where(.wp-block-columns) {margin-bottom: 0 !important;} /*margin-tyylitys > yleinen Gutenberg*/

body .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) { max-width: var(--wp--style--global--content-size); margin-left: 0 !important; margin-right: 0 !important; } /*Gutenberg nollaus > WP 6.5.2 • 17.4.2024 */

/* PORTFOLIO 2024 // TEEMAN TYYLITYS –––> FONTIT + PERUSTYYLIT  */
body {font-size: 20px; line-height: 1.75; font-family: var(--main-font), Arial, Helvetica, sans-serif; font-weight: 400; color: rgba(var(--black)); background-color: rgba(var(--white));} /* line-height: 1.75 = 35px */
button, input, select, optgroup, textarea {font-family: var(--main-font); font-size: 100%;}
body, p, a, ul, li, ol {font-family: var(--main-font); letter-spacing: 0.05em;}
h1, h2, h3, h4, h5, h6 { font-family: var(--heading-font); color: rgba(var(--zeikki-blue-main)); line-height: 1.26; font-weight: 400; text-transform: uppercase; letter-spacing: 0.05em;}
h1 {font-size: 300%;}
h2 {font-size: 200%; margin-bottom: 20px; }
h3 {font-size: 175%;}
h4 {font-size: 125%;}
h5 {font-size: 100%;}

p a {overflow-wrap: break-word !important; word-wrap: break-word !important; -ms-word-break: break-all !important; word-break: break-all !important; word-break: break-word !important; -ms-hyphens: auto !important; -moz-hyphens: auto !important; -webkit-hyphens: auto !important; hyphens: auto !important;} /*tavutus teksteihin -> pitkät linkit esim. saadaan pakkaantumaan*/
strong {font-weight: 700;} /*p:n boldaus*/
p {font-size: 100%; font-weight: 400; color: rgba(var(--black)); line-height: 1.5 !important; letter-spacing: 0.025em; } /*perus-p aka paragraph > line-height: 1.777777 = 32px */
p ul, p ol {font-size: 100%; font-weight: 400; line-height: 1.625; margin: 0px 0px 18px 0 !important; color: rgba(var(--black)); letter-spacing: 0.025em; } /**listat**/
p ul { list-style-type: square !important; margin: 0px 0px 18px 0 !important; }
/*linkit ja alleviivaus ––> */
p a { color: rgba(var(--zeikki-blue-main)); font-family: var(--heading-font); text-decoration: none; padding-bottom: 3px;}
p a { background-image: linear-gradient(rgba(var(--zeikki-blue-light)), rgba(var(--zeikki-blue-light))); background-position: center 100%; background-repeat: no-repeat; background-size: 100% 3px; transition: background-size .25s;}
p a:hover, p a:focus { color: rgba(var(--black)); background-size: 0% 3px; text-decoration: none !important; }
p a { transition: all 0.25s ease-in-out !important; -webkit-transition: all 0.25s ease-in-out !important; -moz-transition: all 0.25s ease-in-out !important; -o-transition: all 0.25s ease-in-out !important; } /*linkkien siirtymät*/
/*hox: poista p a > background-image: none !important esim. footerissa*/

/*tekstin valinta selaimessa*/
-moz-::selection, ::selection {color: rgba(var(--black)); background: rgba(var(--zeikki-green-light));}

/*Neliöt + kuutiot*/
sub, sup { line-height: 0; position: relative; vertical-align: baseline; font-size: 66.666666% !important; font-weight: 500 !important;}
sup {top: -0.66em !important;} /*neliö/ylennys-merkin hienosäätö*/

/* Wordpress Gallery >> esim. artikkeleihin */
.wp-block-gallery figure {overflow: hidden; background-color: rgba(var(--zeikki-blue-main)) !important;}
.wp-block-gallery figure a:hover img {mix-blend-mode: overlay; transform: scale(1.333);}

/* buttonit / painikkeet - oletus */
button {font-family: var(--heading-font); font-size: 100%; line-height: 1.75; letter-spacing: 0.05em !important; border: 1px solid; padding: 12px 12px 10px 12px; color: rgba(var(--zeikki-green-dark)) !important; background-color: rgba(var(--white)); border: 1px solid rgba(var(--zeikki-blue-main)); border-radius: 0px; /*-moz-border-radius: 0px;*/ transition: all 0.25s ease-in-out; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out;}
button:hover {/*color: rgba(var(--main-beige)) !important; background: rgba(var(--main-beige), var(--alpha10)); border: 1px solid rgba(var(--main-beige), var(--alpha50));*/}

/*painikkeet ––>*/
a.wp-block-button__link {font-family: var(--heading-font); color: rgba(var(--white)) !important; font-size: 90% !important; font-weight: 600; letter-spacing: 0.1em !important; text-transform: uppercase; padding: 12px 30px 8px 30px !important; margin-top: 20px; margin-right: 20px; margin-bottom: 20px; margin-left: 20px; border: 1px solid rgba(var(--zeikki-blue-main)); background-color: rgba(var(--zeikki-blue-main)); border-radius: 100px; /*-moz-border-radius: 100px;*/}
a.wp-block-button__link:after { content: ''; display: inline-block; width: 20px !important; height: 20px !important; margin-bottom: -3px; margin-left: 9px; margin-right: auto; mask-repeat: no-repeat !important; -webkit-mask-repeat: no-repeat; mask-position: center; -webkit-mask-position: center; mask-image: var(--arrow-down-icon); -webkit-mask-image: var(--arrow-down-icon); mask-size: cover !important; -webkit-mask-size: cover !important; background-color: rgba(var(--white)); }
a.wp-block-button__link:hover {background-color: rgba(var(--zeikki-green-dark)) !important; color: rgba(var(--white)) !important; border: 1px solid rgba(var(--black)) !important;}
a:hover.wp-block-button__link:after { background-color: rgba(var(--white)); }
.eteenpain a.wp-block-button__link:after { mask-image: var(--arrow-right-icon) !important; -webkit-mask-image: var(--arrow-right-icon) !important; }

/*PIILOTA ELEMENTTI TAI SISÄLTÖ TARVITTAESSA esim. sisältö tulossa myöhemmin tms.*/
.hide-element {display: none !important; visibility: hidden;}

/* LINKIT */
a, a:visited, a:active { color: rgba(var(--zeikki-blue-main)); }
a:hover { color: rgba(var(--zeikki-green-dark)); }
a:hover.white-link { background-color: rgba(var(--zeikki-blue-main), var(--alpha50)); }
a.white-link, a:visited.white-link, a:active.white-link { color: rgba(var(--zeikki-green-dark)); }
a.no-decoration, a:visited.no-decoration, a:active.no-decoration, a:hover.no-decoration { text-decoration: none; }
a, a:link, a:active, a:visited, .button a:hover svg path, a:hover svg, a img, a img:hover, a.wp-block-button__link, a.wp-block-button__link:hover { transition: all 0.25s ease-in-out; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out; } /*linkkien siirtymät*/
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.home-link { display: inline-block; }
:focus, a:focus, input[type="search"]:focus, button:focus, .top-header button:focus { /*outline-style: dashed; outline-color: black; outline-offset: 1px; outline-width: 1px;*/ transition: none !important; }
.screen-reader-text:focus { /*background-color: red !important;*/ color: white !important; }
.top-header:focus, .top-header a:focus, .top-header button:focus { outline-color: white; }
.home-link:focus, .home-link a:focus { outline-offset: -1px;}

/*Accessibility: topheader icons + and some more*/
.visually-hidden {border: 0; padding: 0; margin: 0; position: absolute !important; height: 1px; width: 1px; overflow: hidden;
    clip: rect(1px 1px 1px 1px); /* IE6, IE7 - a 0 height clip, off to the bottom right of the visible 1px box */
    clip: rect(1px, 1px, 1px, 1px); /*maybe deprecated but we need to support legacy browsers */
    clip-path: inset(50%); /*modern browsers, clip-path works inwards from each corner*/
    white-space: nowrap; /* added line to stop words getting smushed together (as they go onto seperate lines and some screen readers do not understand line feeds as a space */
}
.skip-link {background: rgba(var(--zeikki-blue-main)) !important;}

/* GUTENBERG */
.page h1.entry-title {display: none !important; visibility: hidden;}
body.home .post-thumbnail, body.page .post-thumbnail {display: none !important; visibility: hidden;}
footer.entry-footer {display: none !important; visibility: hidden;}
figure { margin: 0 0 0 0 !important; line-height: 0 !important; } /*nollausta etusivua varten*/
.widget { margin: 0; }
.wp-block-image { background-color: transparent !important; }
.wp-block-image img { min-width: 100% !important; }
.wp-block-image figcaption { padding: 18px; margin: 0; font-style: italic; line-height: 1.5 !important; background-color: rgba(var(--zeikki-blue-main)); font-size: 88.888888% !important; color: rgba(var(--white)); }
.wp-block-column { word-break: normal; overflow-wrap: normal; }
/*.home .widget-area {display: none !important;}*/
/*youtube-videot 100% kokoon ––>*/
figure.wp-block-embed.is-type-video, .wp-block-embed__wrapper {position: relative; width: 100%; height: 0; padding-bottom: 56.25%; /*16:9*/}
figure.wp-block-embed.is-type-video iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

/* SIVUT JA ARTIKKELIT */
.post, .page { margin: 0; }
.page-content, .entry-content, .entry-.card {margin: 0;}
.archive .site-main, .search .site-main, .search-results .site-main { padding: 0px calc(var(--pagepadding)); }
.page .site-main { padding: 0px 0px; } /*sisäsivut*/
body.home aside#secondary, body.page aside#secondary {display: none !important;} /* footer piiloon normi-sivuilla: etusivu + sisäsivut */
/** hakutulokset + sivua ei löytynyt 404 + tietosuojaseloste yms. yleiset **/
.archive .site-main, .search .site-main, .search-results .site-main { display: flex; flex-wrap: wrap; margin-bottom: 35px; }
.single .site-main { display: flex; flex-wrap: wrap; padding: 0px calc(var(--pagepadding)); }
.error404 .site-main .widget_recent_entries, .error404 .site-main .widget_categories, .error404 .site-main .widget_archive, .error404 .site-main .widget_tag_cloud {margin-top: 15px !important; }
.error404 .site-main .widget_categories, .error404 .site-main .widget_tag_cloud {display: none;} /*404: sivua ei löytynyt*/
.error404 .site-main .widget_recent_entries ul {margin: 0 0 0 0 !important; padding-inline-start: 19px; } /*404: sivua ei löytynyt*/

/*404 / Page Not Found / Sivua ei löytynyt*/
.error404 .site-main .widget_archive, .error404 .page-content form {display: none;} /*artikkeli-suodatin ja haku piiloon*/

.error404 .site-main { display: flex; flex-wrap: wrap; padding: 0px calc(var(--pagepadding)); /*margin-bottom: 35px;*/ } /*404: sivua ei löytynyt*/
.error404 .site-main { min-height: 50vh; }

/*Tekstibanneri aka Marquee*/

.marquee-text {
  overflow: clip;
  margin-left: -60px; /* pagepadding */
  margin-right: -60px; /* pagepadding */
  background-color: rgba(var(--zeikki-blue-light), var(--alpha50));
}

.marquee-text-track {
  display: flex;
  padding-left: 12rem;
  gap: 12rem;
  width: max-content;
  animation: marquee-move-text 26s linear infinite forwards;
}

.marquee-text p {
  border: 1px solid rgba(var(--zeikki-blue-light));
  background-color: rgba(var(--zeikki-blue-light), var(--alpha50));
  color: rgba(var(--zeikki-blue-main));
  border-radius: 999px;
  padding: 1rem 2.5rem 0.5rem 2.5rem;
  font-size: 300%;
  margin-bottom: 1em;
  -webkit-transform: translateZ(0);
  -webkit-backface-visibility: hidden;
}

@keyframes marquee-move-text {
  to {
    transform: translateX(-50%);
  }
}

/** arkistot: artikkelit **/
.archive .site-main .posts-navigation { margin: inherit !important; }
.archive article:last-of-type .content-box { padding-bottom: 35px; }
.archive .archive-description {display: none !important; visibility: hidden;}

/** HEADER + MAIN MENU **/
.site-header { background: rgba(var(--white)); width: 100%; display: flex; height: auto; align-items: center; padding: 26px var(--pagepadding) 26px; border-top: 1px solid rgba(var(--black)); border-bottom: 1px solid rgba(var(--black)); position: fixed; top: 0; left: 0; right: 0; z-index: 9; } /* fixed navigation */
.site-main { padding-top: 131px !important; } /* fixed navigation > huomioi mobiilissa */
body.logged-in .site-main { margin-top: -32px !important; } /* fixed navigation > wp:n käyttönäkymä */

/* HEADER: Päälogo < monogrammi */
.site-branding {width: 40%; display: flex; height: auto; align-items: center; justify-content: space-between; /*padding: 14px var(--pagepadding) 7px;*/ }
.site-branding .home-link {line-height: 0 !important; display: flex; align-items: center; justify-content: flex-start; } /*width: 100% !important;*/
.site-branding .home-link svg { height: 78px; width: auto; fill: rgba(var(--black)); margin-right: 30px;}
.site-branding a { text-decoration: none; }
.site-branding a .kuvaus-box { text-align: left; }
.site-branding a .kuvaus-box h2 { font-size: 100%; text-transform: none !important; margin-top: 0; margin-bottom: 0; color: rgba(var(--black)) !important; letter-spacing: 0.05em;}
.site-branding a .kuvaus-box h3 { font-size: 80%; text-transform: uppercase; margin-top: 0; margin-bottom: 0; color: rgba(var(--black)) !important; letter-spacing: 0.025em;}
.site-branding a:hover .kuvaus-box h2, .site-branding a:hover .kuvaus-box h3 { color: rgba(var(--zeikki-blue-main)) !important; }
.site-branding a.home-link:hover svg { fill: rgba(var(--zeikki-blue-main)); }
.site-branding a.home-link svg, .site-branding a.home-link:hover svg, .site-branding a .kuvaus-box h2, .site-branding a:hover .kuvaus-box h2, .site-branding a .kuvaus-box h3, .site-branding a:hover .kuvaus-box h3  { transition: all 0.25s ease-in-out; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out; } /* linkkien siirtymät */

/*päävalikko*/
.menu-paavalikko-container, .main-navigation ul { height: 100% !important; }
.main-navigation { width: 60% !important; }
.main-navigation ul { display: flex; justify-content: space-between !important; align-items: unset; margin-top: 0px !important; margin-left: 0px !important; margin-bottom: 0px !important; margin-right: 0px !important; }

/* MOBILE MENU + Mobile Styles */
button.menu-toggle { margin: 0px 0 0 0 !important; padding: 8px 0 0 0 !important; border: 0 !important; background: none !important; cursor: pointer !important; float: right;}
button.menu-toggle:before {content: "Valikko"; margin-right: 6px !important; top: -9px !important; position: relative; font-size: 100% !important; font-weight: 500; letter-spacing: 0.1em !important; color: rgba(var(--zeikki-blue-main));} /*zeikki*/
/*mobiili-painike*/
button.menu-toggle svg { height: 30px !important; fill: rgba(var(--zeikki-blue-main)); }

/* MAIN NAVIGATION + mobiilityylit: PÄÄVALIKKO // MOBILE MENU */
.main-navigation ul li { line-height: 1 !important; padding: 9px 0px 0px 0px; }
.main-navigation ul li a {color: rgba(var(--black)); font-size: 100% !important; font-weight: 500; padding-left: 0px !important; padding-right: 0px !important; text-align: center; text-transform: uppercase; width: -moz-fit-content; width: fit-content; width: auto; } /*padding-left: 18px !important;*/
.main-navigation ul li a:hover { color: rgba(var(--zeikki-green-dark)) !important; }
.main-navigation ul li a:after { content: ''; display: block; background-image: linear-gradient(transparent, transparent); background-repeat: no-repeat; background-position: top center; height: 3px; margin: 9px 0 0 0; width: auto !important; } /* <–– alleviivaus */
.main-navigation ul li a:hover:after { background-image: linear-gradient(rgba(var(--zeikki-green-dark)), rgba(var(--zeikki-green-dark))); } /* <–– alleviivaus > hover */

.main-navigation li.current-menu-parent a, .main-navigation li.current-menu-item a, .main-navigation li.current-page-ancestor a { color: rgba(var(--zeikki-blue-main)) !important; font-weight: 500; width: -moz-fit-content; width: fit-content; width: auto;} /*aktiivinen pääsivu valittuna > väritys */
.main-navigation li.current-menu-parent a:after, .main-navigation li.current-menu-item a:after, .main-navigation li.current-page-ancestor a:after {content: ''; display: block; background-image: linear-gradient(rgba(var(--zeikki-blue-light)), rgba(var(--zeikki-blue-light))); background-repeat: no-repeat; background-position: top center; height: 3px; margin: 9px 0 0 0; width: auto !important; } /* <–– alleviivaus */

.main-navigation ul li a, .main-navigation ul li a:after, .main-navigation ul li a:hover, .main-navigation ul li a:hover:after, .main-navigation li.current-menu-parent a, .main-navigation li.current-menu-item a, .main-navigation li.current-page-ancestor a, .main-navigation li.current-menu-parent a:after, .main-navigation li.current-menu-item a:after, .main-navigation li.current-page-ancestor a:after {transition: all 0.25s ease-in-out; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out;} /* > linkkien siirtymät*/

.main-navigation ul li ul { display: block !important; background-color: rgba(var(--white)) !important; box-shadow: 0px 2px 2px rgba(23, 23, 23, 0.2); }
.main-navigation ul ul li { height: 100% !important; }
.main-navigation ul ul li a { font-size: 80% !important; font-weight: 400 !important; padding: 0 7px !important; }
.main-navigation ul ul a { margin-left: 7px; margin-right: 7px; width: 100%; }
.main-navigation ul ul li a:hover {color: rgba(var(--zeikki-blue-main)) !important;}
.main-navigation ul ul li a::before { border: none !important; }
/*3-tason alavalikko auki ––>*/
.main-navigation ul ul ul { display: block !important; background-color: transparent !important; box-shadow: none !important; }
.main-navigation ul ul ul li { height: unset !important; }

/*pääosa > alasveto-valikko*/
.main-navigation ul.sub-menu { width: 100%; height: auto !important; min-width: 240px !important; flex-flow: column; margin-left: -0.5vw !important; }
.main-navigation ul.sub-menu li a {color: rgba(var(--zeikki-blue-main)) !important; font-weight: 400 !important; text-transform: none !important; line-height: 1.5 !important; text-align: left;}
.main-navigation ul.sub-menu li a:after {display: none;}
.main-navigation ul.sub-menu li a:hover { color: rgba(var(--zeikki-green-dark)) !important; }
.main-navigation .sub-menu .menu-item { padding: 9px 9px 9px 9px !important; width: 100%; }
.main-navigation ul.sub-menu li.current-page-ancestor a { color: rgba(var(--zeikki-orange)) !important; } /*aktiivinen pääsivu valittuna > väritys */

/*pääosa > alasveto-valikko > alavalikkoo 3-tasolle "auki" */
.main-navigation ul.sub-menu li.menu-item-has-children { height: auto !important; width: 100% !important; flex-wrap: wrap !important; flex-direction: row !important; }
.main-navigation ul.sub-menu ul.sub-menu { position: static !important; margin-left: 0 !important; margin-right: 0 !important; min-width: 100% !important; margin-top: 4px !important;}
.main-navigation ul.sub-menu ul li a {color: rgba(var(--zeikki-green-dark)) !important; font-weight: 400 !important; text-transform: none !important; line-height: 1.5 !important; padding: 0 0 0 0 !important; font-style: italic !important; font-size: 88.888888% !important;}
.main-navigation ul.sub-menu ul li a:hover {color: rgba(var(--black), var(--alpha50)) !important;}
.main-navigation ul.sub-menu .sub-menu .menu-item { padding: 4px 14px 4px 14px !important; width: 100%;}
.main-navigation ul.sub-menu li.current_page_item a { /*color: rgba(var(--zeikki-orange)) !important;*/ } /*aktiivinen pääsivu valittuna > väritys */

/* <––– MAIN NAVIGATION + mobiilityylit: PÄÄVALIKKO // MOBILE MENU loppuu*/


/* ETUSIVU + SISÄSIVUT –––>*/

/** HERO // JUMBOTRON > esittelyt sivun alkuun + pääkuva **/
.hero-alue { background-color: rgba(var(--zeikki-blue-light)); border-top: 1px solid rgba(var(--black)); border-bottom: 1px solid rgba(var(--black)); }
.hero-alue.tekija { background-color: rgba(var(--zeikki-green-dark), var(--alpha10));  } /*alasivu: Tekijä >*/
.hero-alue.wp-block-columns { display: flex; flex-wrap: wrap !important; justify-content: space-between; align-items: stretch !important; margin-bottom: 0px !important; }
/*.hero-alue.wp-block-columns { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; -webkit-flex-wrap: wrap; }*/ /*flexaus > jos järjestystä muutetaan */
.hero-alue .wp-block-column { flex-grow: 0 !important; margin-left: 0% !important; margin-right: 0%; }

.hero-alue .wp-block-column.otsikko-palkki { flex-basis: calc(60px) !important; border-right: 1px solid rgba(var(--black)); padding: 60px 0 60px 0; display: flex; align-items: center; flex-direction: column;} /*osion otsikko*/
.hero-alue .wp-block-column.otsikko-palkki:before { content: ''; height: 20px; width: 20px !important; display: inline-block; margin: 0 20px 0 20px; mask-repeat: no-repeat !important; -webkit-mask-repeat: no-repeat; mask-position: center; -webkit-mask-position: center; mask-image: var(--monogrammi24-black); -webkit-mask-image: var(--monogrammi24-black); background-color: rgba(var(--black)) !important; } /*osion otsikko > ikoni*/
.hero-alue .wp-block-column.otsikko-palkki p {  text-transform: uppercase; line-height: normal !important; letter-spacing: 0.05em; margin-top: 20px !important; margin-bottom: 0 !important; text-align: right; writing-mode: vertical-rl; transform: rotate(180deg); } /*osion otsikko > teksti*/

.hero-alue .wp-block-column.teksti-alue { flex-basis: calc(50% - 60px) !important; align-self: center; padding: 120px 60px; } /** esittelyt ja painikkeet + taustakuvilla **/
.hero-alue .wp-block-column.teksti-alue h2 { font-family: var(--main-font); font-size: 200%; color: rgba(var(--black)); text-transform: none; }
.hero-alue .wp-block-column.teksti-alue p { font-family: var(--heading-font); font-size: 125%; color: rgba(var(--black)); letter-spacing: 0.05em; }

.hero-alue .wp-block-column.kuva-alue { flex-basis: calc(50%) !important; align-self: center; padding: 120px 60px; } /** pääkuva **/
.hero-alue .wp-block-column.kuva-alue figure {position: relative; overflow: hidden; border-radius: 100%; } /*display: contents;*/ 
.hero-alue .wp-block-column.kuva-alue figure:after { content: ""; position: absolute; inset: 0; border-radius: 100%; padding: 30px; background: linear-gradient(45deg, rgba(var(--zeikki-blue-light)), rgba(var(--zeikki-blue-main))); -webkit-mask: linear-gradient(#171717 0 0) content-box, linear-gradient(#171717 0 0); -webkit-mask-composite: xor; mask-composite: exclude; }
.hero-alue .wp-block-column.kuva-alue figure:after { animation: rotate 9s infinite linear; } /* animaatio v1 > */
.hero-alue .wp-block-column.kuva-alue figure img { aspect-ratio: 1 / 1; object-fit: cover; object-position: center; width: 100% !important; height: auto !important; min-height: 100%; max-width: unset !important; border-top-left-radius: 100%; border-top-right-radius: 100%; border-bottom-left-radius: 100%; border-bottom-right-radius: 100%; position: relative; z-index: 3 !important; filter: grayscale(1);}
.hero-alue .wp-block-column.kuva-alue .wp-block-image .aligncenter {display: block !important;} /* fix > Safari + Firefox */

/** ESITTELYT > esittelyt etusivulle **/
.esittely-alue { background-color: rgba(var(--white)); border-bottom: 1px solid rgba(var(--black)); }
.esittely-alue.wp-block-columns { display: flex; flex-wrap: wrap !important; justify-content: space-between; align-items: stretch !important; margin-bottom: 0px !important; }
.esittely-alue .wp-block-column { flex-grow: 0 !important; margin-left: 0% !important; margin-right: 0%; }
.esittely-alue .wp-block-column.otsikko-palkki { flex-basis: calc(60px) !important; border-right: 1px solid rgba(var(--black)); padding: 60px 0 60px 0; display: flex; align-items: center; flex-direction: column; } /*osion otsikko*/
.esittely-alue .wp-block-column.otsikko-palkki:before { content: ''; height: 20px; width: 20px !important; display: inline-block; margin: 0 20px 0 20px; mask-repeat: no-repeat !important; -webkit-mask-repeat: no-repeat; mask-position: center; -webkit-mask-position: center; mask-image: var(--monogrammi24-black); -webkit-mask-image: var(--monogrammi24-black); background-color: rgba(var(--black)) !important; } /*osion otsikko > ikoni*/
.esittely-alue .wp-block-column.otsikko-palkki p { text-transform: uppercase; line-height: normal !important; letter-spacing: 0.05em; margin-top: 20px !important; margin-bottom: 0 !important; text-align: right; writing-mode: vertical-rl; transform: rotate(180deg); } /*osion otsikko > teksti*/
.esittely-alue .wp-block-column.sisalto-alue { flex-basis: calc(100% - 60px) !important; align-self: center; padding: 96px 60px 60px 60px; } /** esittelyt ja painikkeet + taustakuvilla **/
.esittely-alue .wp-block-column.sisalto-alue p:first-child {margin-top: 0;} /*esim. tekijän taustaa -palstan ensimmäinen kappale >*/
/** sisäkkäinen 2-palstaa **/
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns { display: flex; flex-wrap: wrap !important; justify-content: space-between; align-items: center !important; margin-bottom: 0px !important;  } 
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column { flex-grow: 0 !important; margin-left: 0% !important; margin-right: 0%; /*border: 1px solid blueviolet;*/ }

/* testi 2 > https://tympanus.net/codrops/2024/01/17/a-practical-introduction-to-scroll-driven-animations-with-css-scroll-and-view/ - mutta toimi iainoastaan Chromium-selaimilla */

/* testi 3 > animaatio on scroll + js > esittely-aluuet: pääsivut ja työt-sivut > */
.esittely-alue .wp-block-column.otsikko-palkki:before, body.single-tyot .sisalto-alue .otsikko-palkki:before {
  animation-name: rotate;
  animation-duration: 0.333s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  animation-play-state: paused;
  animation-delay: calc(var(--scroll) * -1s);
}

/* ANIMAATIO v1 > kuvan kehykseen esim. transform: rotate(360deg);*/

@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/*Scrollilla pyörivä elementti: Safari ja non-Chromium Mobile fix*/
@-webkit-keyframes rotate {
	0% { -webkit-transform:rotate(0deg); }
	100% { -webkit-transform:rotate(360deg); }
}

/** yhteystiedot etusivulle > **/
.esittely-alue.yhteys { background-color: rgba(var(--zeikki-gray-mud), var(--alpha10));}
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.info-yhteys-box { flex-basis: calc(60%) !important; padding: 0px 60px 30px;}
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.info-yhteys-box h3 { font-size: 200%; color: rgba(var(--black)); text-transform: none; margin-top: 0; margin-bottom: 18px;}
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.info-yhteys-box p { font-size: 200%; }
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.info-yhteys-box .infot p a { margin: 0px 18px 18px 18px !important; }
/*puhelin ja sähköposti -linkit*/
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.info-yhteys-box .infot .is-layout-flex { flex-wrap: wrap !important; } /*tasoittaa yhteys-linkit*/
/*some-linkit*/
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.info-yhteys-box .somet {margin-top: 60px;}
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.info-yhteys-box .somet .is-layout-flex { flex-wrap: wrap !important; } /*tasoittaa some-linkit*/

/*kuva tehosteella > */
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.kuva-alue { flex-basis: calc(40%) !important; padding: 0 60px; /*border: 1px dotted salmon;*/ }
body.page-id-396 .esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.kuva-alue {display: none;} /*piilota yhteys-kuva varsinaisella sivulla > toistuu jumbossa */
body.page-id-396 .esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.info-yhteys-box {flex-basis: calc(100%) !important; }
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.kuva-alue figure {position: relative; overflow: hidden; border-radius: 100%;}
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.kuva-alue figure:after { content: ""; position: absolute; inset: 0; border-radius: 100%; padding: 30px; background: linear-gradient(45deg, rgba(var(--zeikki-blue-light)), rgba(var(--zeikki-blue-main))); -webkit-mask: linear-gradient(#171717 0 0) content-box, linear-gradient(#171717 0 0); -webkit-mask-composite: xor; mask-composite: exclude;}
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.kuva-alue figure:after { animation: rotate 9s infinite linear; } /* animaatio v1 > */
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.kuva-alue figure img { aspect-ratio: 1 / 1; object-fit: cover; object-position: center; width: 100% !important; height: auto !important; min-height: 100%; max-width: unset !important; border-top-left-radius: 100%; border-top-right-radius: 100%; border-bottom-left-radius: 100%; border-bottom-right-radius: 100%; position: relative; z-index: 3 !important; filter: grayscale(1);}
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.kuva-alue .wp-block-image .aligncenter {display: block !important;} /* fix > Safari + Firefox */

/* Ikonit some-linkkeihin */
.wp-block-column.info-yhteys-box .somet p.facebook a, .wp-block-column.info-yhteys-box .somet p.instagram a, .wp-block-column.info-yhteys-box .somet p.linkedin a, .wp-block-column.info-yhteys-box .somet p.bluesky a { margin: 0px 18px 18px 18px !important; background-position: right 100%; background-size: calc(100% - 54px) 3px; } /*hox: poista p a > background-image: none !important */
.wp-block-column.info-yhteys-box .infot p.email a, .wp-block-column.info-yhteys-box .infot p.puhelin a { margin: 0px 18px 18px 18px !important; background-position: right 100%; background-size: calc(100% - 54px) 3px; } /*hox: poista p a > background-image: none !important */
.wp-block-column.info-yhteys-box .somet p.facebook a:before, .wp-block-column.info-yhteys-box .somet p.instagram a:before, .wp-block-column.info-yhteys-box .somet p.linkedin a:before, .wp-block-column.info-yhteys-box .somet p.bluesky a:before, .wp-block-column.info-yhteys-box .infot p.email a:before, .wp-block-column.info-yhteys-box .infot p.puhelin a:before { height: 36px; width: 36px !important; display: inline-block; mask-repeat: no-repeat !important; -webkit-mask-repeat: no-repeat; mask-position: center; -webkit-mask-position: center; background-color: rgba(var(--zeikki-blue-main)) !important; margin-right: 18px; margin-bottom: -3px; }
.wp-block-column.info-yhteys-box .somet p.facebook a:before { content: ''; mask-image: var(--facebook-icon); -webkit-mask-image: var(--facebook-icon);}
.wp-block-column.info-yhteys-box .somet p.instagram a:before { content: ''; mask-image: var(--instagram-icon); -webkit-mask-image: var(--instagram-icon);}
.wp-block-column.info-yhteys-box .somet p.linkedin a::before { content: ''; mask-image: var(--linkedin-icon); -webkit-mask-image: var(--linkedin-icon);}
.wp-block-column.info-yhteys-box .somet p.bluesky a::before { content: ''; mask-image: var(--bluesky-icon); -webkit-mask-image: var(--bluesky-icon);}
.wp-block-column.info-yhteys-box .infot p.email a:before { content: ''; mask-image: var(--salama-icon); -webkit-mask-image: var(--salama-icon); margin-bottom: -5px;}
.wp-block-column.info-yhteys-box .infot p.puhelin a:before { content: ''; mask-image: var(--kanykka-icon); -webkit-mask-image: var(--kanykka-icon); }
/* > visually-hidden a-pätkään*/
.wp-block-column.info-yhteys-box .somet p.facebook a:hover, .wp-block-column.info-yhteys-box .somet p.instagram a:hover, .wp-block-column.info-yhteys-box .somet p.linkedin a:hover, .wp-block-column.info-yhteys-box .somet p.bluesky a:hover {color: rgba(var(--zeikki-green-light)) !important; text-decoration: none; background-position: right bottom 0%; background-size: 0% 3px;}
.wp-block-column.info-yhteys-box .infot p.email a:hover, .wp-block-column.info-yhteys-box .infot p.puhelin a:hover {color: rgba(var(--zeikki-gray-mud)) !important; text-decoration: none; background-position: right bottom 0%; background-size: 0% 3px;}
.wp-block-column.info-yhteys-box .somet p.facebook a:hover:before, .wp-block-column.info-yhteys-box .somet p.instagram a:hover:before, .wp-block-column.info-yhteys-box .somet p.linkedin a:hover:before, .wp-block-column.info-yhteys-box .somet p.bluesky a:hover:before { background-color: rgba(var(--zeikki-green-dark)) !important; }
.wp-block-column.info-yhteys-box .infot p.email a:hover:before, .wp-block-column.info-yhteys-box .infot p.puhelin a:hover:before {background-color: rgba(var(--zeikki-gray-mud)) !important;}

.wp-block-column.info-yhteys-box .somet p.facebook a:hover, .wp-block-column.info-yhteys-box .somet p.instagram a:hover, .wp-block-column.info-yhteys-box .somet p.linkedin a:hover, .wp-block-column.info-yhteys-box .somet p.bluesky a:hover, .wp-block-column.info-yhteys-box .somet p.facebook a:hover:before, .wp-block-column.info-yhteys-box .somet p.instagram a:hover:before, .wp-block-column.info-yhteys-box .somet p.linkedin a:hover:before, .wp-block-column.info-yhteys-box .somet p.bluesky a:hover:before, .wp-block-column.info-yhteys-box .infot p.email a:hover, .wp-block-column.info-yhteys-box .infot p.puhelin a:hover, .wp-block-column.info-yhteys-box .infot p.email a:hover:before, .wp-block-column.info-yhteys-box .infot p.puhelin a:hover:before {transition: all 0.25s ease-in-out; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out;} /* > linkkien siirtymät*/

/* CV aka Resume > ETUSIVU + TEKIJÄ - taustakuva animaatiolla ? */
.esittely-alue.ceevee {position: relative; overflow: hidden; }
.esittely-alue.ceevee {background-image: url('/wp-content/themes/portfolio24/svg/jr-monogrammi-bg-blue.svg'); background-repeat: no-repeat; background-size: 50% 50%; background-position: center right 12.5%;}

/* CV aka Resume > ETUSIVU */
.resume-kehys { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 60px; margin: 0 0 30px 0 !important; }
.resume-kehys .ceevee-otsake h3 { color: rgba(var(--black)); font-size: 100%; text-transform: uppercase; font-family: var(--main-font); font-weight: 500; margin-top: 0; margin-bottom: 0px; border-bottom: 1px solid rgba(var(--black)); padding-bottom: 20px; }
.resume-kehys .resume-kortti { border-bottom: 1px solid rgba(var(--black)); padding-top: 10px; padding-bottom: 10px; display: flex; flex-wrap: wrap; /*align-items: center;*/}
.resume-kehys .resume-kortti {display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; -webkit-flex-wrap: wrap;} /*mobiili > järjestys */

/*1. ja 2. palsta > Työt ja koulutukset*/
.resume-kehys .resume-kortti p { margin: 0 0 0 0 !important; }
.resume-kehys .resume-palsta.tyot .resume-kortti p:nth-child(1), .resume-kehys .resume-palsta.koulut .resume-kortti p:nth-child(1) { width: 80%; -webkit-order: 1; order: 1; }
.resume-kehys .resume-palsta.tyot .resume-kortti p:nth-child(2), .resume-kehys .resume-palsta.koulut .resume-kortti p:nth-child(2) { width: 20%; justify-content: flex-end; text-align: right; -webkit-order: 2; order: 2; }
.resume-kehys .resume-palsta.tyot .resume-kortti p:nth-child(3), .resume-kehys .resume-palsta.koulut .resume-kortti p:nth-child(3) { width: 100%; font-style: italic; letter-spacing: 0.05em; -webkit-order: 3; order: 3; } 

/*Kolmas palsta > Tiedot ja taidot*/
.resume-kehys .resume-palsta.taidot p.taidot-otsikointi {font-weight: 700;}
.resume-kehys .resume-palsta.taidot p {width: 100%;}
.resume-kehys .resume-palsta.taidot p:nth-child(2) {font-style: italic; letter-spacing: 0.05em;}

/*TÖITÄNI-alue > esim. 12 kpl työ-kortteja esille >*/
.tyot-kortit { } 
.tyot-kortit ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 60px; margin: 0 0 30px 0 !important; }
.tyot-kortit li { border: 1px solid rgba(var(--black)); border-radius: 6px; padding: 30px 30px 60px 30px;}
.tyot-kortit li:hover { background-color: rgba(var(--zeikki-blue-light)); }
.tyot-kortit li figure { border: 1px solid rgba(var(--black)); border-radius: 6px; background-color: rgba(var(--zeikki-blue-light)); margin-left: 60px !important; margin-bottom: 60px !important; }
.tyot-kortit li:hover figure, .tyot-kortit li:focus figure { border: 1px solid rgba(var(--black), var(--alpha50)); background-color: rgba(var(--white), var(--alpha50)); }
.tyot-kortit li .wp-block-post-featured-image img {aspect-ratio: 16 / 9; filter: none; mix-blend-mode: normal; }
.tyot-kortit li:hover .wp-block-post-featured-image img { filter: grayscale(1); mix-blend-mode:darken; }
.tyot-kortit li h2.wp-block-post-title { font-size: 150%;  }
.tyot-kortit li h2.wp-block-post-title a {text-decoration: none; text-transform: none; color: rgba(var(--black)); }
.tyot-kortit li span {margin: 0 6px; } /*portfolion tyyppi: jakaja*/
.tyot-kortit li .wp-block-post-terms a {display: inline-block; text-decoration: none; text-transform: uppercase; color: rgba(var(--black)); font-size: 70%;}

.tyot-kortit li, .tyot-kortit li:hover, .tyot-kortit li .wp-block-post-featured-image img, .tyot-kortit li:hover .wp-block-post-featured-image img { transition: all 0.25s ease-in-out; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out; } /* linkkien siirtymät */

/** SISÄSIVUT > YKSITTÄINEN TYÖ-ARTIKKELI / ACF > template-parts/content-tyo.php **/
body.single-tyot .site-main {padding: 0 0 !important;}
body.single-tyot .entry-header {display: none !important;} /**oletus-pääotsikko piiloon**/
body.single-tyot .article-content {width: calc(100%) !important; margin-right: 0% !important; padding-top: 131px !important;} /* fixed navigation */

/** Hero-alue > yksittäisen työn esittelyt sivun alkuun + pääkuva **/
body.single-tyot .kortti-hero-alue { background-color: rgba(var(--zeikki-blue-light)); border-top: 1px solid rgba(var(--black)); border-bottom: 1px solid rgba(var(--black)); display: flex; flex-wrap: wrap !important; justify-content: space-between; align-items: stretch !important; margin-bottom: 0px !important; }
body.single-tyot .kortti-hero-alue { /*display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; -webkit-flex-wrap: wrap;*/ }
/*osion otsikko-palkki*/
body.single-tyot .kortti-hero-alue .otsikko-palkki { width: calc(60px) !important; border-right: 1px solid rgba(var(--black)); padding: 60px 0 30px 0; display: flex; align-items: center; flex-direction: column;} /*osion otsikko*/
body.single-tyot .kortti-hero-alue .otsikko-palkki:before { content: ''; height: 20px; width: 20px !important; display: inline-block; margin: 0 20px 0 20px; mask-repeat: no-repeat !important; -webkit-mask-repeat: no-repeat; mask-position: center; -webkit-mask-position: center; mask-image: var(--monogrammi24-black); -webkit-mask-image: var(--monogrammi24-black); background-color: rgba(var(--black)) !important; } /*osion otsikko > ikoni*/
body.single-tyot .kortti-hero-alue .otsikko-palkki p { text-transform: uppercase; line-height: normal !important; letter-spacing: 0.05em; margin-top: 20px !important; margin-bottom: 0 !important; text-align: right; writing-mode: vertical-rl; transform: rotate(180deg); } /*osion otsikko > teksti*/
/* hero-alueen tekstit ja kuvat */
body.single-tyot .kortti-hero-alue .otsikko-palkki, body.single-tyot .kortti-hero-alue .teksti-alue, body.single-tyot .kortti-hero-alue .kuva-alue { flex-grow: 0 !important; margin-left: 0% !important; margin-right: 0%; }
body.single-tyot .kortti-hero-alue .teksti-alue { width: calc(50% - 60px); padding: 150px calc(var(--pagepadding)); align-self: center; text-align: center;} /** esittelyt ja painikkeet + taustakuvilla **/
body.single-tyot .kortti-hero-alue .teksti-alue h1, body.single-tyot .kortti-hero-alue .teksti-alue p { color: rgba(var(--black)); }
body.single-tyot .kortti-hero-alue .teksti-alue h1 { text-transform: none; }
body.single-tyot .kortti-hero-alue .kuva-alue { width: calc(50%); padding: 60px calc(var(--pagepadding)); display: flex; flex-direction: column; align-self: center;} /** pääkuva-alue **/
body.single-tyot .kortti-hero-alue .kuva-alue figure { /*display: contents;*/ border-radius: 36px; overflow: hidden; border: 1px solid rgba(var(--black));} /*mobile styles > mobile Safari fix > display: block */
body.single-tyot .kortti-hero-alue .kuva-alue figcaption {display: none !important; visibility: hidden;}
body.single-tyot .kortti-hero-alue .kuva-alue figcaption:empty {display: none !important; visibility: hidden;} /*kuvateksti: tyhjänä piilotetaan*/
body.single-tyot .kortti-hero-alue .kuva-alue figure img { aspect-ratio: 16 / 9; object-fit: cover; object-position: center; width: 100% !important; height: auto !important; min-height: 100%; max-width: unset !important; margin-bottom: 0 !important;}
/* heron linkki >> painikkeet ––>*/
.kortti-hero-alue a.lue-lisaa { display: inline-block; font-family: var(--heading-font); color: rgba(var(--white)) !important; font-size: 90% !important; font-weight: 600; letter-spacing: 0.1em !important; text-transform: uppercase; padding: 16px 30px 12px 30px !important; margin-top: 20px; margin-right: 20px; margin-bottom: 20px; margin-left: 20px; border: 1px solid rgba(var(--zeikki-blue-main)); background-color: rgba(var(--zeikki-blue-main)); border-radius: 100px; /*-moz-border-radius: 100px;*/ text-decoration: none !important; }
.kortti-hero-alue a.lue-lisaa:after { content: ''; display: inline-block; width: 20px !important; height: 20px !important; margin-bottom: -3px; margin-left: 9px; margin-right: auto; mask-repeat: no-repeat !important; -webkit-mask-repeat: no-repeat; mask-position: center; -webkit-mask-position: center; mask-image: var(--arrow-down-icon); -webkit-mask-image: var(--arrow-down-icon); mask-size: cover !important; -webkit-mask-size: cover !important; background-color: rgba(var(--white)); }
.kortti-hero-alue a.lue-lisaa:hover { background-color: rgba(var(--zeikki-green-dark)) !important; color: rgba(var(--white)) !important; border: 1px solid rgba(var(--black)) !important; }
.kortti-hero-alue a.lue-lisaa:hover:after { background-color: rgba(var(--white)); }

/*heron jälkeen varsinaiset sisältöalueet */
body.single-tyot .sisalto-alue { padding: 0 0 0 0 !important;}
body.single-tyot .entry-content { display: flex !important; flex-wrap: wrap; margin-top: 0px !important; justify-content: space-between; }
body.single-tyot .sisalto-alue .taysi-palsta { display: flex; width: calc(100%); margin-bottom: 0px; border-bottom: 1px solid rgba(var(--black));} /*sisällön pääotsikko ja kuvagalleria 100% leveys*/

/* yksittäinen työ > otsikko-palkki */
body.single-tyot .sisalto-alue .otsikko-palkki { width: calc(60px) !important; border-right: 1px solid rgba(var(--black)); padding: 60px 0 60px 0; display: flex; align-items: center; flex-direction: column;} /*osion otsikko*/
body.single-tyot .sisalto-alue .otsikko-palkki:before { content: ''; height: 20px; width: 20px !important; display: inline-block; margin: 0 20px 0 20px; mask-repeat: no-repeat !important; -webkit-mask-repeat: no-repeat; mask-position: center; -webkit-mask-position: center; mask-image: var(--monogrammi24-black); -webkit-mask-image: var(--monogrammi24-black); background-color: rgba(var(--black)) !important; } /*osion otsikko > ikoni*/
body.single-tyot .sisalto-alue .otsikko-palkki p { text-transform: uppercase; line-height: normal !important; letter-spacing: 0.05em; margin-top: 20px !important; margin-bottom: 0 !important; text-align: right; writing-mode: vertical-rl; transform: rotate(180deg); } /*osion otsikko > teksti*/

/* yksittäinen työ > sisalto-alueet */
body.single-tyot .sisalto-alue .vasen-palsta { width: calc(66.666666% - 60px); padding: 96px calc(var(--pagepadding)); /*align-self: baseline;*/}
body.single-tyot .sisalto-alue .vasen-palsta h2.entry-title, body.single-tyot .sisalto-alue .oikea-palsta h3 { color: rgba(var(--black)); font-size: 100%; text-transform: uppercase; font-family: var(--main-font); font-weight: 500; padding-bottom: 20px !important; border-bottom: 1px solid rgba(var(--black)); margin-top: 0px !important; }
body.single-tyot .sisalto-alue .vasen-palsta h4 { font-weight: 700 !important; margin-bottom: 6px; font-size: 100%;} /*työn kuvaus-alue > h4 */
body.single-tyot .sisalto-alue .oikea-palsta { width: calc(33.333333%); padding: 96px calc(var(--pagepadding)) 0; /*align-self: baseline;*/}

/*info-laatikko*/
body.single-tyot .sisalto-alue .info-laatikko {margin-bottom: 30px; /*border: 1px solid red;*/ }
body.single-tyot .sisalto-alue .info-laatikko h4 { color: rgba(var(--black)); font-size: 100%; font-family: var(--main-font); font-weight: 500; margin-top: 0; margin-bottom: 0px; text-transform: lowercase !important; font-variant: small-caps; }
body.single-tyot .sisalto-alue .info-laatikko p { margin-top: 0; margin-bottom: 0;}
body.single-tyot .sisalto-alue .info-kohde {border-bottom: 1px solid rgba(var(--black)); margin-bottom: 10px; padding-bottom: 10px;}
body.single-tyot .sisalto-alue .info-kohde:last-child {border-bottom: none !important;}

/* Yksittäisen Työ-kortin Kuvagalleria */
body.single-tyot .kuvagalleria {padding: 60px var(--pagepadding); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 36px;}
body.single-tyot .kuvagalleria .galleria-kuva {border: 1px solid rgba(var(--black)); border-radius: 6px; /*-moz-border-radius: 6px;*/ overflow: hidden; } /*figcaption > absolute/relative*/
body.single-tyot .kuvagalleria .galleria-kuva figure { height: 100%; overflow: hidden; background-color: rgba(var(--white)); }
body.single-tyot .kuvagalleria .galleria-kuva figure:hover { background-color: rgba(var(--zeikki-blue-light)); }
body.single-tyot .kuvagalleria .galleria-kuva figure a { width: 100%; display: inline-block; overflow: hidden; }
body.single-tyot .kuvagalleria .galleria-kuva figure a img { aspect-ratio: 16 / 9; object-fit: cover; object-position: top center; width: 100% !important; height: auto !important; min-height: 100%; max-width: unset !important; margin-bottom: 0 !important; } /* 16/9 > 22/9 > 26/9 */
body.single-tyot .kuvagalleria .galleria-kuva figure:hover img { transform: scale(1.333); filter: grayscale(1); mix-blend-mode: darken; } /*mix-blend-mode: overlay; */
body.single-tyot .kuvagalleria .galleria-kuva figure figcaption { width: 100%; padding: 12px 30px; font-size: 90%; line-height: normal !important; border-top: 1px solid rgba(var(--black)); /*background-color: rgba(var(--zeikki-blue-light), var(--alpha80));*/}
body.single-tyot .kuvagalleria .galleria-kuva figure:hover figcaption {/*color: rgba(var(--zeikki-blue-main));*/}
body.single-tyot .kuvagalleria .galleria-kuva figure figcaption {/*display: none !important; visibility: hidden;*/}
body.single-tyot .kuvagalleria .galleria-kuva figure figcaption:empty { display: none !important; visibility: hidden; }

/*jos ei ole galleriaa näytettäväksi, poistaa koko tyhjän galleria-osion näkyvistä > */
body.single-tyot .sisalto-alue .taysi-palsta.galleriabox:not(body.single-tyot .sisalto-alue .taysi-palsta.galleriabox:has(.kuvagalleria)) { display: none; } 

/*Työ-korttien "katso kaikki" painike */
.back-to-button { display: flex; width: calc(100%); margin-bottom: 0px; padding: 20px calc(var(--pagepadding)); } /* < painikkeen alue loppuun */
/*painikkeet ––>*/
a.kortti-takaisin { display: inline-block; font-family: var(--heading-font); color: rgba(var(--white)) !important; font-size: 90% !important; font-weight: 600; letter-spacing: 0.1em !important; text-transform: uppercase; padding: 12px 30px 8px 30px !important; margin-top: 20px; margin-right: 20px; margin-bottom: 20px; margin-left: 20px; border: 1px solid rgba(var(--zeikki-blue-main)); background-color: rgba(var(--zeikki-blue-main)); border-radius: 100px; /*-moz-border-radius: 100px;*/ text-decoration: none !important; }
a.kortti-takaisin:after { content: ''; display: inline-block; width: 20px !important; height: 20px !important; margin-bottom: -3px; margin-left: 9px; margin-right: auto; mask-repeat: no-repeat !important; -webkit-mask-repeat: no-repeat; mask-position: center; -webkit-mask-position: center; mask-image: var(--arrow-right-icon) !important; -webkit-mask-image: var(--arrow-right-icon) !important; mask-size: cover !important; -webkit-mask-size: cover !important; background-color: rgba(var(--white)); }
a.kortti-takaisin:hover {background-color: rgba(var(--zeikki-green-dark)) !important; color: rgba(var(--white)) !important; border: 1px solid rgba(var(--black)) !important;}


/* YLEISET >>> PORTFOLIO 2024 */

/*SISÄSIVUT ––> PERUSSISÄLLÖT*/
.sisalto-alue { padding: 36px calc(var(--pagepadding)) 36px; } /*sisäsivut: perusalue sisältöihin*/
/* <–––––SISÄSIVUT loppuu */

/** ARKISTOT aka Archives **/
body.archive .archive-description {/*display: none;*/} /*archive-sivun kuvaus piiloon*/
body.archive h1.page-title, h1.page-title { font-size: 200% !important; margin-top: 54px; } /*archive-sivun oletus-otsikointi piiloon + lisätty normi-otsikko php-pohjaan*/
h2.entry-title a { text-decoration: none !important; color: rgba(var(--zeikki-blue-main)) !important; font-family: var(--heading-font) !important; font-weight: 400 !important;}
h2.entry-title a:hover {text-decoration: underline !important;}

/*ARCHIVES: Ajankohtaista*/
body.archive .article-content {width: calc(70% - 3%) !important; margin-right: 3% !important; } /* archives/ajankohtaista */
body.archive .sidebar {/*display: none !important; visibility: hidden;*/}

body.archive article, body.search article { /*width: 100%;*/ padding: 9px 18px 9px 0; background-color: rgba(var(--white)); border-bottom: 1px solid rgba(var(--zeikki-green-light)); }

body.archive .news-archive, body.search .news-archive {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px;}

body.archive article, body.search article {display: -webkit-box; display: -moz-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; flex-flow: column; }
body.archive article .entry-header, body.search article .entry-header {-webkit-order: 2 !important; order: 2 !important; border-bottom: none !important; padding: 36px 0 0 0 !important; font-size: 88.888888%; color: rgba(var(--black)); }
body.archive article .entry-header .entry-meta, body.search article .entry-header .entry-meta {border-bottom: none !important; padding: 0px 0 0 0 !important; font-size: 88.888888%; color: rgba(var(--black)); }
body.archive article .entry-header h2, body.search article .entry-header h2 { -webkit-order: 3 !important; order: 3 !important; font-size: 200% !important; text-transform: none; }
body.archive article .post-thumbnail, body.search article .post-thumbnail { -webkit-order: 1 !important; order: 1 !important; }  /*display: none !important; visibility: hidden;*/
body.archive article .post-thumbnail img, body.search article .post-thumbnail img { aspect-ratio: 16 / 9; object-fit: cover; object-position: center; width: 100% !important; height: auto !important; min-height: 100%; max-width: unset !important; }  /*display: none !important; visibility: hidden;*/
body.archive .entry-content, body.search .entry-content, body.archive .entry-summary, body.search .entry-summary {display: none !important; visibility: hidden;} /*postauksen sisältö piiloon*/

/*hakutulokset-sivu*/
body.search-results article a.post-thumbnail {display: none !important; visibility: hidden;}
h2.widgettitle {color: rgba(var(--zeikki-blue-main));}
.widget_categories h2.widget-title {color: rgba(var(--zeikki-blue-main));}

/*Posted on –> "Julkaistu" käännetty inc/template-tags + kirjoittaja piiloon css ––>*/
.entry-meta span.byline, .entry-meta span.author {display: none !important; visibility: hidden;}

/* artikkelien navigointi: vanhempaan <-> uudempaan */
.site-main .comment-navigation, .site-main .posts-navigation, .site-main .post-navigation {padding: 18px var(--pagepadding); border-top: 1px solid rgba(var(--zeikki-blue-main)) !important; background-color: rgba(var(--white)); margin: 0 0 0 0 !important; } /*artikkeli: navigointi –> uudet/vanhat*/
.archive .comment-navigation, .archive .posts-navigation, .archive .post-navigation {padding: 18px var(--pagepadding); border-top: none !important; background-color: rgba(var(--white)); } /*postaukset-arkisto - artikkeli: navigointi –> uudet/vanhat*/
.site-main .comment-navigation a, .site-main .posts-navigation a, .site-main .post-navigation a {text-decoration: none !important; font-size: 88.888888% !important; color: rgba(var(--zeikki-blue-main));}
.site-main .comment-navigation a:hover, .site-main .posts-navigation a:hover, .site-main .post-navigation a:hover {text-decoration: underline !important;}

/** <–––– ARKISTOT loppuu**/

/** FOOTER **/
.page aside#secondary {display: none !important;} /*oletus-footer piiloon*/
.site-footer { background: rgba(var(--zeikki-blue-main)); padding: 0 0 !important; }

/*Footer: Päälogo < monogrammi + linkki */
.site-info {width: 100%; display: flex; height: auto; align-items: center; padding: 120px var(--pagepadding) 60px; justify-content: flex-start;}
.site-info .home-link {width: auto !important; line-height: 0 !important; display: flex; align-items: center; }
.site-info a.home-link { font-size: 100% !important; text-decoration: none !important; width: auto !important; display: flex; flex-wrap: wrap; flex-direction: column; align-items: flex-start;} /* nollataan > kuvaus-teksti + logon ohessa */
.site-info .home-link svg { height: 60px; width: 60px; fill: rgba(var(--zeikki-blue-light)); margin-bottom: 20px; }
.site-info a { text-decoration: none; }
.site-info a .kuvaus-box { text-align: left; }
.site-info a .kuvaus-box h2 { font-size: 100%; text-transform: none !important; margin-top: 0; margin-bottom: 0; color: rgba(var(--zeikki-blue-light)) !important; letter-spacing: 0.05em;}
.site-info a .kuvaus-box h3 { font-size: 80%; text-transform: uppercase; margin-top: 0; margin-bottom: 0; color: rgba(var(--zeikki-blue-light)) !important; letter-spacing: 0.025em;}
.site-info a:hover .kuvaus-box h2, .site-info a:hover .kuvaus-box h3 { color: rgba(var(--zeikki-green-light)) !important; }
.site-info a.home-link:hover svg { fill: rgba(var(--zeikki-green-light)); }
.site-info a.home-link svg, .site-info a.home-link:hover svg, .site-info a .kuvaus-box h2, .site-info a:hover .kuvaus-box h2, .site-info a .kuvaus-box h3, .site-info a:hover .kuvaus-box h3 { transition: all 0.25s ease-in-out; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out; } /* linkkien siirtymät */

/* Footer: Infot */
.footer-info { display: flex; flex-wrap: wrap; justify-content: space-between; width: calc(100%) !important; padding: 0px calc(var(--pagepadding)) 90px !important;}

/*footerin info-palstat*/
.footer-info-columns { width: calc(100%); display: flex; flex-wrap: wrap; }
.footer-column { margin-bottom: 30px; width: calc(50% - 30px) !important; } /*padding: 0 18px 0 0;*/ 
.footer-column:nth-child(2) {text-align: right;}

/* Footer: linkit ja infot */
.footer-column .widget-title { /*display: none; visibility: hidden;*/ font-size: 80% !important; color: rgba(var(--zeikki-blue-light)); font-weight: 700; font-family: var(--main-font) !important; text-transform: none !important; margin-top: 0px !important; margin-bottom: 9px !important;} /*html-osion otsikko - piiloon*/
.footer-column section {width: calc(100%); margin-bottom: 36px;} /*info-boxit*/
.footer-column p { color: rgba(var(--white)) !important; line-height: 1.35 !important; font-weight: 400; font-size: 88.88888% !important; margin-top: 0px; margin-bottom: 9px;}
.footer-column p a { color: rgba(var(--zeikki-blue-light)) !important; text-decoration: none; }
.footer-column p a:hover { color: rgba(var(--zeikki-orange)) !important; text-decoration: underline; }
.footer-column p a, .footer-column p a:hover { transition: all 0.25s ease-in-out; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out; } /*linkkien siirtymät*/

/* Footer: somet*/
.footer-column p a.facebook, .footer-column p a.instagram, .footer-column p a.linkedin, .footer-column p a.bluesky {display: inline-block; margin: 6px 18px 12px 0px !important; text-decoration: none; background-image: none !important; background-size: 0% 0px !important; } /*hox: poista p a > background-image: none !important */
.footer-column p a.facebook:before, .footer-column p a.instagram:before, .footer-column p a.linkedin:before, .footer-column p a.bluesky:before { height: 30px; width: 30px !important; display: inline-block; mask-repeat: no-repeat !important; -webkit-mask-repeat: no-repeat; mask-position: center; -webkit-mask-position: center; background-color: rgba(var(--zeikki-blue-light)) !important;}
.footer-column p a.facebook:before { content: ''; mask-image: var(--facebook-icon); -webkit-mask-image: var(--facebook-icon);}
.footer-column p a.instagram:before { content: ''; mask-image: var(--instagram-icon); -webkit-mask-image: var(--instagram-icon);}
.footer-column p a.linkedin:before { content: ''; mask-image: var(--linkedin-icon); -webkit-mask-image: var(--linkedin-icon);}
.footer-column p a.bluesky:before { content: ''; mask-image: var(--bluesky-icon); -webkit-mask-image: var(--bluesky-icon);}
/* > visually-hidden a-pätkään*/
.footer-column p a.facebook:hover, .footer-column p a.instagram:hover, .footer-column p a.linkedin:hover, .footer-column p a.bluesky:hover {color: rgba(var(--zeikki-orange)) !important; text-decoration: underline;}
.footer-column p a.facebook:hover:before, .footer-column p a.instagram:hover:before, .footer-column p a.linkedin:hover:before, .footer-column p a.bluesky:hover:before { background-color: rgba(var(--zeikki-orange)) !important; }
.footer-column p a.facebook:hover, .footer-column p a.instagram:hover, .footer-column p a.linkedin:hover, .footer-column p a.bluesky:hover, .footer-column p a.facebook:hover:before, .footer-column p a.instagram:hover:before, .footer-column p a.linkedin:hover:before, .footer-column p a.bluesky:hover:before {transition: all 0.25s ease-in-out; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out;} /* > linkkien siirtymät*/

/* Footer: sivukartta */
.widget_nav_menu ul { margin: 0 0 0 0 !important; list-style: none !important; padding-inline-start: 0 !important;}
.widget_nav_menu ul .menu-item {padding: 0 0 6px 0 !important;}
.widget_nav_menu ul.menu { padding-top: 0 !important; border-top: none; border-bottom: none; } /*footerin valikosta viivoitus pois*/
.widget_nav_menu ul li { line-height: 1.35 !important; margin-bottom: 6px !important; }
.widget_nav_menu ul li a { font-family: var(--heading-font) !important; color: rgba(var(--zeikki-blue-light)); font-size: 88.888888% !important; font-weight: 400; text-decoration: none !important; letter-spacing: 0.05em !important; padding-bottom: 3px; }
.widget_nav_menu ul li a { background-size: 0% 3px; }
.widget_nav_menu ul li a:hover { color: rgba(var(--zeikki-orange)) !important; }
.widget_nav_menu ul li a:hover { background-image: linear-gradient(rgba(var(--zeikki-orange)), rgba(var(--zeikki-orange))); background-position: center 100%; background-repeat: no-repeat; background-size: 100% 3px; transition: background-size .25s; }
.xyzit {transition: all 0.25s ease-in-out; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out;} /* > linkkien siirtymät*/
/* valikon 2-taso piiloon >*/
.widget_nav_menu ul.sub-menu { list-style: none !important; display: none !important;} /*alavalikko*/

/* Footer: legal-osio aka copyright */
.footer-legal {padding: 15px calc(var(--pagepadding)) !important; background-color: rgba(var(--zeikki-blue-main)) !important; display: flex; flex-wrap: wrap; flex-direction: row; width: calc(100%); border-top: 1px solid rgba(var(--black), var(--alpha30));}
.footer-legal p {margin-bottom: 7px !important; } .footer-legal p a { color: rgba(var(--white)); text-decoration: underline; } .footer-legal p a:hover { color: rgba(var(--zeikki-green-dark)); text-decoration: none !important; }
.footer-legal span { margin: 0 15px !important; color: rgba(var(--white), var(--alpha50));}
.footer-legal .copyright { width: calc(100%); margin-right: 0%;}
.footer-legal .copyright p { font-size: 70% !important; font-weight: 400 !important; line-height: 1.5 !important; color: rgba(var(--white)) !important; }

/** MOBILE STYLES **/

/*** Responsive Styles XXL Desktop And Above ***/
@media all and (min-width: 2000px) {

/** HERO // JUMBOTRON > esittelyt sivun alkuun + pääkuva **/
.hero-alue .wp-block-column.teksti-alue { flex-basis: calc(60% - 60px) !important; align-self: center; padding: 120px 120px; } /** esittelyt ja painikkeet + taustakuvilla **/
.hero-alue .wp-block-column.kuva-alue { flex-basis: calc(40%) !important; align-self: center; padding: 60px 120px; } /** pääkuva **/

/* CV aka Resume > ETUSIVU + TEKIJÄ - taustakuva animaatiolla ? */
.esittely-alue.ceevee { background-repeat: no-repeat; background-size: 70% 70% !important; background-position: center right -52.5% !important; }

/** ESITTELYT > esittelyt etusivulle **/
/** sisäkkäinen 2-palstaa **/
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.info-yhteys-box { flex-basis: calc(60% - 60px) !important; padding: 0px 30px 0px 30px; }
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.kuva-alue { flex-basis: calc(40%) !important; padding: 0px 120px 30px; }

/** Hero-alue > yksittäisen työn esittelyt sivun alkuun + pääkuva **/
body.single-tyot .kortti-hero-alue .teksti-alue { width: calc(60% - 60px); } /** esittelyt ja painikkeet + taustakuvilla **/
body.single-tyot .kortti-hero-alue .kuva-alue { width: calc(40%); } /** pääkuva-alue **/

}

/*** Responsive Styles Large Desktop And Above ***/
@media all and (min-width: 1406px) and (max-width: 1998px) {

/** HERO // JUMBOTRON > esittelyt sivun alkuun + pääkuva **/
.hero-alue .wp-block-column.teksti-alue { flex-basis: calc(60% - 60px) !important; padding: 120px 120px; } /** esittelyt ja painikkeet + taustakuvilla **/
.hero-alue .wp-block-column.kuva-alue { flex-basis: calc(40%) !important; align-self: center; padding: 60px var(--pagepadding) 60px 0px; } /** pääkuva **/

/* CV aka Resume > ETUSIVU */
.resume-kehys { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 60px; }
.resume-kehys .resume-palsta:nth-child(1) { grid-row: 1 / span 2; } /*1. palsta 100-korkoon*/

/*TÖITÄNI-alue > esim. 12 kpl työ-kortteja esille >*/
.tyot-kortit ul { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 60px; margin: 0 0 30px 0 !important; }

/** ESITTELYT > esittelyt etusivulle **/
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.kuva-alue { padding: 60px 0px 60px 0px; }

}

/*** Responsive Styles Standard Desktop Only ***/
@media all and (min-width: 981px) and (max-width: 1405px) {

/*HEADER + MAIN MENU*/
.main-navigation ul li a {font-size: 90% !important; padding-left: 18px !important; /*padding-right: 18px !important;*/ }

/* PÄÄVALIKKO */
/*pääosa > alasveto-valikko*/
ul.sub-menu { min-width: 220px !important; margin-left: -1vw !important;}

/** HERO // JUMBOTRON > esittelyt sivun alkuun + pääkuva **/
.hero-alue .wp-block-column.teksti-alue { padding: 120px 60px; } /** esittelyt ja painikkeet + taustakuvilla **/
.hero-alue .wp-block-column.teksti-alue { flex-basis: calc(60% - 60px) !important; align-self: center; padding: 90px 60px; } /** esittelyt ja painikkeet + taustakuvilla **/
.hero-alue .wp-block-column.teksti-alue h2 { font-size: 150%; }
.hero-alue .wp-block-column.kuva-alue { flex-basis: calc(40%) !important; align-self: center; padding: 60px var(--pagepadding) 60px 0px; } /** pääkuva **/

/* CV aka Resume > ETUSIVU */
.resume-kehys { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 90px; }
.resume-kehys .resume-palsta:nth-child(1) { grid-column: 1 / span 2; } /*1. palsta 100-leveyteen*/

/*TÖITÄNI-alue > esim. 12 kpl työ-kortteja esille >*/
.tyot-kortit ul { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 60px; margin: 0 0 30px 0 !important; }
.tyot-kortit li figure { margin-left: 30px !important; margin-bottom: 30px !important; }

/** ESITTELYT > esittelyt etusivulle **/
/** sisäkkäinen 2-palstaa **/
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.info-yhteys-box { flex-basis: calc(50%) !important; padding: 30px 0px;}
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.info-yhteys-box h3 { font-size: 150%; }
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.info-yhteys-box p { font-size: 150%; }
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.kuva-alue { flex-basis: calc(50%) !important; padding: 30px 0px 30px 60px; }
/* Ikonit some-linkkeihin */
.wp-block-column.info-yhteys-box .somet p.facebook a:before, .wp-block-column.info-yhteys-box .somet p.instagram a:before, .wp-block-column.info-yhteys-box .somet p.linkedin a:before, .wp-block-column.info-yhteys-box .somet p.bluesky a:before{ height: 36px; width: 36px !important; margin-bottom: -6px; }
.wp-block-column.info-yhteys-box .infot p.email a:before, .wp-block-column.info-yhteys-box .infot p.puhelin a:before { height: 36px; width: 36px !important; margin-bottom: -6px; }

/** SISÄSIVUT > YKSITTÄINEN TYÖ-ARTIKKELI / ACF > template-parts/content-tyo.php **/
body.single-tyot .kortti-hero-alue .teksti-alue { width: calc(60% - 60px); padding: 60px calc(var(--pagepadding)); }
body.single-tyot .kortti-hero-alue .kuva-alue { width: calc(40%); padding: 60px calc(var(--pagepadding)) 60px 0px; }
body.single-tyot .kortti-hero-alue .teksti-alue h1 {font-size: 200%;}
body.single-tyot .kortti-hero-alue .kuva-alue figure img {aspect-ratio: 1.5 / 1;}
/* yksittäinen työ > sisalto-alueet */
body.single-tyot .sisalto-alue .vasen-palsta { width: calc(60% - 60px); padding: 60px calc(var(--pagepadding)) 0 ;}
body.single-tyot .sisalto-alue .oikea-palsta { width: calc(40%); padding: 60px calc(var(--pagepadding));}

/* Yksittäisen Työ-kortin Kuvagalleria */
body.single-tyot .kuvagalleria { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px;}

/* FOOTER */
/*footerin info-palstat*/
.footer-column:nth-child(1), .footer-column:nth-child(2), .footer-column:nth-child(3), .footer-column:nth-child(4) {width: calc(50% - 18px) !important;}

}

@media (min-width: 981px) {
/* PÄÄVALIKKO // MOBILE MENU –>>> */
.main-navigation.toggled ul { display: flex !important; }
.main-navigation li { display: flex; }
.main-navigation li a { align-self: center; }
}

/*** Responsive Styles Tablet Only ***/
@media all and (max-width: 980px) {

/** HEADER + MAIN MENU **/
.site-main { padding-top: 98px !important; } /* fixed navigation > huomioi mobiilissa */

/* PÄÄVALIKKO // MOBILE MENU ––> */
.main-header { flex-wrap: wrap; }
ul.menu { border-top: 1px solid rgba(var(--black)); border-bottom: 1px solid rgba(var(--zeikki-blue-main)); padding-top: 18px; } /*valikon alaosaan viiva + väritystä*/
.main-navigation { height: 40px !important; display: block !important; }
.main-navigation ul { height: auto !important; }
.main-navigation ul li {line-height: 1.5 !important; padding: 0px 0px 9px 0px; margin-bottom: 0;}
.menu-toggle, .main-navigation.toggled ul {display: block !important;}
.main-navigation ul {display: none !important;}
.main-navigation.toggled ul {display: block !important;}

/*valikot*/
.main-navigation ul {position: absolute !important; left: 0 !important; z-index: 8 !important; width: calc(100%) !important; margin-left: 0%; margin-right: 0%; background-color: rgba(var(--white)) !important; } /*top: 136px –> korjattu zeikki/js-modauksella + z-index –> 88888*/
.main-navigation ul li a {color: rgba(var(--zeikki-blue-main)) !important; text-align: left !important; padding-left: 18px !important; padding-right: 18px !important;}
.main-navigation ul ul { box-shadow: none !important; float: none !important; position: initial !important; top: 0 !important; left: 0 !important;}
.main-navigation ul ul a {width: 100% !important;}
.main-navigation ul li ul { margin-top: 9px !important; background-color: transparent !important;} /*alavalikon taustaväri pois*/
.main-navigation ul ul li a { padding: 0 18px !important; }
.menu-item { margin-left: 0; padding: 9px 36px; }
ul.sub-menu ul.sub-menu {margin-left: 1.1% !important;} /*uusi 3-tason valikko - testing*/
ul.sub-menu li.menu-item-has-children a:after {display: none !important; visibility: hidden;}
.mobile-menu-item {display: block !important;} /*päälinkki toistetaan valikossa: mobiili menu + piilotetaan isossa // parent not clickable*/
.menu-item-has-children > a { width: 100% !important; }
.sub-menu .menu-item { background-color: transparent !important; padding: 9px 9px 0px 36px !important;}
.main-navigation .current-page-ancestor > a::before, .main-navigation .current_page_item > a::before { display: none !important;}
.main-navigation li.menu-item-home a:after {display: none !important;}
.main-navigation ul li a:after, .main-navigation li.current-menu-parent a:after, .main-navigation li.current-menu-item a:after, .main-navigation li.current-page-ancestor a:after {display: none !important;}

/* <–– PÄÄVALIKKO // MOBILE MENU */

/* HEADER: Päälogo < monogrammi */
.site-branding .home-link svg {height: 33px; width: auto;}

/* GUTENBERG */
.wp-block-columns.is-not-stacked-on-mobile {flex-wrap: wrap !important;}

/* painikkeet ––> mobiilissa pienemmällä + ikonin sijoitus*/
a.wp-block-button__link { font-size: 80% !important; } a.wp-block-button__link:after {margin-bottom: -4px;}
.kortti-hero-alue a.lue-lisaa { font-size: 80% !important; } .kortti-hero-alue a.lue-lisaa:after {margin-bottom: -4px;}
a.kortti-takaisin {font-size: 80% !important; } a.kortti-takaisin:after {margin-bottom: -4px;}

/*Jumbotronin ja esittelyalueiden kuvan kehys-tehoste*/
.hero-alue .wp-block-column.kuva-alue figure:after, .esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.kuva-alue figure:after { padding: 20px; } /*kevennetään kehystä mobiilissa*/

/** HERO // JUMBOTRON > esittelyt sivun alkuun + pääkuva **/
.hero-alue .wp-block-column.otsikko-palkki { flex-basis: calc(100%) !important; border-right: none; border-bottom: 1px solid rgba(var(--black)); padding: 20px 0; flex-direction: row; } /*osion otsikko*/
.hero-alue .wp-block-column.otsikko-palkki:before { margin: 0 20px; } /*osion otsikko > ikoni*/
.hero-alue .wp-block-column.otsikko-palkki p { margin-top: 3px !important; margin-bottom: 0 !important; margin-left: 0px; text-align: left; writing-mode: unset; transform: rotate(0deg); } /*osion otsikko > teksti*/
.hero-alue .wp-block-column.teksti-alue { flex-basis: calc(100%) !important; padding: 60px 30px; } /** esittelyt ja painikkeet + taustakuvilla **/
.hero-alue .wp-block-column.teksti-alue h2 { font-size: 150%; }
.hero-alue .wp-block-column.kuva-alue { flex-basis: calc(100%) !important; padding: 0px 180px 60px 180px; } /** pääkuva **

/* CV aka Resume > ETUSIVU + TEKIJÄ - taustakuva animaatiolla ?*/
.resume-kehys { display: grid; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 60px; }

/** ESITTELYT > esittelyt etusivulle **/
.esittely-alue .wp-block-column.otsikko-palkki { flex-basis: calc(100%) !important; border-right: none; border-bottom: 1px solid rgba(var(--black)); padding: 20px 0; flex-direction: row; } /*osion otsikko*/
.esittely-alue .wp-block-column.otsikko-palkki:before { margin: 0 20px; } /*osion otsikko > ikoni*/
.esittely-alue .wp-block-column.otsikko-palkki p { margin-top: 3px !important; margin-bottom: 0 !important; margin-left: 0px; text-align: left; writing-mode: unset; transform: rotate(0deg); } /*osion otsikko > teksti*/
.esittely-alue .wp-block-column.sisalto-alue { flex-basis: calc(100%) !important; align-self: center; padding: 60px 60px; } /** esittelyt ja painikkeet + taustakuvilla **/

/*TÖITÄNI-alue > esim. 12 kpl työ-kortteja esille >*/
.tyot-kortit ul { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 60px; margin: 0 0 30px 0 !important; }
.tyot-kortit li figure { margin-left: 30px !important; margin-bottom: 30px !important; }
body.home .tyot-kortit li:nth-child(n+7) {display: none; } /* < piilota 7-12 työ-kortit mobiilissa */

/** ESITTELYT > esittelyt etusivulle **/
/** sisäkkäinen 2-palstaa **/
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.info-yhteys-box { flex-basis: calc(100%) !important; padding: 30px 0px;}
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.info-yhteys-box h3 { font-size: 150%; }
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.info-yhteys-box p { font-size: 150%; }
/* Ikonit some-linkkeihin */
.wp-block-column.info-yhteys-box .somet p.facebook a:before, .wp-block-column.info-yhteys-box .somet p.instagram a:before, .wp-block-column.info-yhteys-box .somet p.linkedin a:before, .wp-block-column.info-yhteys-box .somet p.bluesky a:before { height: 36px; width: 36px !important; margin-bottom: -6px; }
.wp-block-column.info-yhteys-box .infot p.email a:before, .wp-block-column.info-yhteys-box .infot p.puhelin a:before { height: 36px; width: 36px !important; margin-bottom: -6px; }
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.kuva-alue { flex-basis: calc(100%) !important; padding: 30px 120px; }

/** SISÄSIVUT > YKSITTÄINEN TYÖ-ARTIKKELI / ACF > template-parts/content-tyo.php **/
body.single-tyot .article-content {padding-top: 98px !important;} /* fixed navigation */
/** Hero-alue > yksittäisen työn esittelyt sivun alkuun + pääkuva **/
body.single-tyot .kortti-hero-alue { /*display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; -webkit-flex-wrap: wrap;*/ }
/*osion otsikko-palkki*/
body.single-tyot .kortti-hero-alue .otsikko-palkki { width: calc(100%) !important; border-right: none; border-bottom: 1px solid rgba(var(--black)); padding: 20px 0; flex-direction: row; } /*osion otsikko*/
body.single-tyot .kortti-hero-alue .otsikko-palkki:before { margin: 0 20px; } /*osion otsikko > ikoni*/
body.single-tyot .kortti-hero-alue .otsikko-palkki p { margin-top: 3px !important; margin-bottom: 0 !important; margin-left: 0px; text-align: left; writing-mode: unset; transform: rotate(0deg); } /*osion otsikko > teksti*/
/* hero-alueen tekstit ja kuvat */
body.single-tyot .kortti-hero-alue .teksti-alue { width: calc(100%); padding: 60px calc(var(--pagepadding)) 30px; } /** esittelyt ja painikkeet + taustakuvilla **/
body.single-tyot .kortti-hero-alue .teksti-alue h1 {font-size: 150%;}
body.single-tyot .kortti-hero-alue .kuva-alue { width: calc(100%); padding: 0px calc(var(--pagepadding)) 60px; } /** pääkuva-alue **/
body.single-tyot .kortti-hero-alue .kuva-alue figure { border-radius: 18px; }

/* yksittäinen työ > sisalto-alueet */
body.single-tyot .sisalto-alue .taysi-palsta { display: flex; flex-wrap: wrap;} /*sisällön pääotsikko ja kuvagalleria 100% leveys*/

/* yksittäinen työ > otsikko-palkki */
body.single-tyot .sisalto-alue .otsikko-palkki { width: calc(100%) !important; border-right: none; border-bottom: 1px solid rgba(var(--black)); padding: 20px 0; flex-direction: row; } /*osion otsikko*/
body.single-tyot .sisalto-alue .otsikko-palkki:before { margin: 0 20px;  } /*osion otsikko > ikoni*/
body.single-tyot .sisalto-alue .otsikko-palkki p { margin-top: 3px !important; margin-bottom: 0 !important; margin-left: 0px; text-align: left; writing-mode: unset; transform: rotate(0deg);; } /*osion otsikko > teksti*/

/* yksittäinen työ > sisalto-alueet */
body.single-tyot .sisalto-alue .vasen-palsta { width: calc(100%); padding: 60px calc(var(--pagepadding)) 0 ;}
body.single-tyot .sisalto-alue .oikea-palsta { width: calc(100%); padding: 30px calc(var(--pagepadding));}

/* Yksittäisen Työ-kortin Kuvagalleria */
body.single-tyot .kuvagalleria { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px;}

/*SISÄSIVUT ––> PERUSSISÄLLÖT*/
.sisalto-alue { padding: 36px calc(var(--pagepadding)) 36px; } /*sisäsivut: perusalue sisältöihin*/

/* artikkelien navigointi: vanhempaan <-> uudempaan */
.comment-navigation .nav-links, .posts-navigation .nav-links, .post-navigation .nav-links {display: block !important;}
.comment-navigation .nav-previous, .posts-navigation .nav-previous, .post-navigation .nav-previous, .comment-navigation .nav-next, .posts-navigation .nav-next, .post-navigation .nav-next {text-align: left !important; width: 100% !important; margin: 15px 0 !important;}

/* FOOTER */
/*footerin info-palstat*/
.footer-column:nth-child(1), .footer-column:nth-child(2), .footer-column:nth-child(3), .footer-column:nth-child(4) {width: calc(50% - 18px) !important;}

}

/*** Responsive Styles Tablet Only ***/
@media all and (min-width: 768px) and (max-width: 980px) {

/** HEADER + MAIN MENU **/
.site-main { padding-top: 98px !important; } /* fixed navigation > huomioi mobiilissa */

/** SISÄSIVUT > YKSITTÄINEN TYÖ-ARTIKKELI / ACF > template-parts/content-tyo.php **/
body.single-tyot .article-content {padding-top: 98px !important;} /* fixed navigation */

}

/*** Responsive Styles Smartphone Only ***/
@media all and (max-width: 767px) {

/*Portfolio 2024 perusmääritteet > Fontit + Värit*/
:root { --pagepadding: 30px; } /* Sivuston reunusten koko */

/* YLEISET TYYLIT */
h1 {font-size: 200%;}
h2 {font-size: 150%;}
h3 {font-size: 125%;}
h4 {font-size: 111.1111%; }
h5 {font-size: 100%;}

/*TOP BAR > toimintojen pakkaantuminen*/

/*HEADER + MAIN MENU*/
.site-branding {width: 100% !important; text-align: center;}
.main-navigation {height: 40px !important; display: block !important; }

/* HEADER: Päälogo < monogrammi */
.site-branding .home-link svg { margin-right: 15px;}

/** HEADER + MAIN MENU **/
.site-main { padding-top: 98px !important; } /* fixed navigation > huomioi mobiilissa */

/*mobiilit*/
.main-navigation .mobile-menu {display: block; visibility: visible !important; }
.main-navigation .mobile-menu {border-top: 1px solid rgba(var(--zeikki-blue-main)) !important;}
.main-navigation ul li.mobile-menu a { width: unset !important; margin: 7px 0 !important; } /*hakulaatikko täyteen leveyteen*/

/** HERO // JUMBOTRON > esittelyt sivun alkuun + pääkuva **/
.hero-alue .wp-block-column.teksti-alue { padding: 30px 30px; } /** esittelyt ja painikkeet + taustakuvilla **/
.hero-alue .wp-block-column.kuva-alue { padding: 0px 60px 60px 60px; } /** pääkuva **/

/* CV aka Resume > ETUSIVU */
.resume-kehys .resume-palsta.tyot .resume-kortti p:nth-child(1), .resume-kehys .resume-palsta.koulut .resume-kortti p:nth-child(1) { width: 100%; -webkit-order: 2 !important; order: 2 !important;}
.resume-kehys .resume-palsta.tyot .resume-kortti p:nth-child(2), .resume-kehys .resume-palsta.koulut .resume-kortti p:nth-child(2) { width: 100%; justify-content: flex-start; text-align: left; -webkit-order: 1 !important; order: 1 !important; }
.resume-kehys .resume-palsta.tyot .resume-kortti p:nth-child(3), .resume-kehys .resume-palsta.koulut .resume-kortti p:nth-child(3) { -webkit-order: 3 !important; order: 3 !important; }

/* CV aka Resume > ETUSIVU + TEKIJÄ - taustakuva animaatiolla ? */
.esittely-alue.ceevee { background-repeat: no-repeat; background-size: 70% 70% !important; background-position: center top -70% !important; }

/*TÖITÄNI-alue > esim. 12 kpl työ-kortteja esille >*/
.tyot-kortit ul { grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 30px; margin: 0 0 30px 0 !important; }
.tyot-kortit li figure { margin-left: 0px !important; margin-bottom: 30px !important; }

/** ESITTELYT > esittelyt etusivulle **/
.esittely-alue .wp-block-column.sisalto-alue { padding: 30px 30px;} /** esittelyt ja painikkeet + taustakuvilla **/

/** ESITTELYT > esittelyt etusivulle **/
/** sisäkkäinen 2-palstaa **/
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.info-yhteys-box {padding: 0 0 !important;}
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.info-yhteys-box p {font-size: 110%;} /* 22px */
/* Ikonit some-linkkeihin */
.wp-block-column.info-yhteys-box .somet p.facebook a, .wp-block-column.info-yhteys-box .somet p.instagram a, .wp-block-column.info-yhteys-box .somet p.linkedin a , .wp-block-column.info-yhteys-box .somet p.bluesky a {margin: 0px 18px 18px 18px !important; background-position: right 100%; background-size: calc(100% - 34px) 3px; } /*hox: poista p a > background-image: none !important */
.wp-block-column.info-yhteys-box .somet p.facebook a:before, .wp-block-column.info-yhteys-box .somet p.instagram a:before, .wp-block-column.info-yhteys-box .somet p.linkedin a:before, .wp-block-column.info-yhteys-box .somet p.bluesky a:before { height: 22px; width: 22px !important; margin-right: 12px; margin-bottom: -3px; }
.wp-block-column.info-yhteys-box .infot p.email a, .wp-block-column.info-yhteys-box .infot p.puhelin a { margin: 0px 18px 18px 18px !important; background-position: right 100%; background-size: calc(100% - 34px) 3px; } /*hox: poista p a > background-image: none !important */
.wp-block-column.info-yhteys-box .infot p.email a:before, .wp-block-column.info-yhteys-box .infot p.puhelin a:before { height: 22px; width: 22px !important; margin-right: 12px; margin-bottom: -3px; }
.esittely-alue .wp-block-column.sisalto-alue .wp-block-columns .wp-block-column.kuva-alue { padding: 60px 45px 30px 45px; }

/** SISÄSIVUT > YKSITTÄINEN TYÖ-ARTIKKELI / ACF > template-parts/content-tyo.php **/
body.single-tyot .article-content {padding-top: 98px !important;} /* fixed navigation */
/* hero-alueen tekstit ja kuvat */
body.single-tyot .kortti-hero-alue .teksti-alue { padding: 30px 30px; } /** esittelyt ja painikkeet + taustakuvilla **/

/* Yksittäisen Työ-kortin Kuvagalleria */
body.single-tyot .kuvagalleria { grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 36px;}

/* FOOTER */
/*footerin info-palstat*/
.footer-column:nth-child(1), .footer-column:nth-child(2), .footer-column:nth-child(3), .footer-column:nth-child(4) {width: calc(100% - 36px) !important;}
.footer-column:nth-child(2) {text-align: left;}

/* FOOTER: legal sekä valakian logo ja linkki */
.footer-legal {padding: 15px calc(var(--pagepadding) + 4%) !important;}
.footer-legal .copyright, .footer-legal .valakia-footer { width: calc(100%); margin-right: 0%; text-align: center;}
.footer-legal p a { width: 100% !important; display: block; margin-top: 15px; } /*tietosuoja-linkki täyteen leveyteen + span*/
.footer-legal span { display: none !important; visibility: hidden; }

}

/*** Responsive Styles Smartphone Portrait ***/
@media all and (max-width: 479px) {

/** HEADER + MAIN MENU **/
.site-main { padding-top: 118px !important; } /* fixed navigation > huomioi mobiilissa */

/** SISÄSIVUT > YKSITTÄINEN TYÖ-ARTIKKELI / ACF > template-parts/content-tyo.php **/
body.single-tyot .article-content {padding-top: 118px !important;} /* fixed navigation */

}

/*** Responsive Styles Smartphone Small Devicess ***/
@media all and (max-width: 320px) {


}

/** ei enää tyylitystä tämän alapuolelle !!! **/