/* css vars */

/* Varit ja yhteiset front-/backend tyylit  */
@import 'style-main.css';

:root {
  --gap: 25px;
  --grid-gap: 15px;
  --cont-padding: min(70px, 7%);
  --side-margin: var(--gap);
  --full-nega-margin: calc(-1 * var(--side-margin));
  --large-nega-margin: calc(-1 * var(--side-margin));
  --grid-2: 1fr 1fr;
  --admin-bar: 0px;
}

@media (min-width: 1200px){
  :root{
    --side-margin: 50px;
  }
}
@media (min-width: 1301px){
  :root {
    --full-nega-margin: calc((var(--wrap) - 100vw) / 2 - var(--side-margin));
    --large-nega-margin: calc((var(--wrap) + 300px - 100vw) / 2 - var(--side-margin));
    /*--side-margin: calc((100vw - var(--wrap)) / 2);*/
  }
}

@media (max-width: 880px){
  :root {
  --gap: 15px;
  --grid-gap: 10px;
  --side-margin: 25px;
  }
}

body.admin-bar{
  --admin-bar: 32px;
}
@media (max-width: 765px) {
  body.admin-bar{
    --admin-bar: 46px;
  }
}
/* /css vars */

/* HTML5 fixes */
div,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
	display: block;
}

*{
  margin:0;
  padding:0;
}
html {
  box-sizing: border-box;
  font-size: 100%;
  scroll-behavior: smooth;
}
::selection{
  background-color: var(--primary);
  color: #fff;
}

*,
*::before,
*::after {
  box-sizing: inherit; }

[id]{
  scroll-snap-margin-top: 170px;
  scroll-margin-top: 170px;
}

.hide{
  display: none;
}

a img{
	border:none;
}
svg, img{
  display: inline-block;
  vertical-align: middle;
  max-width: 100%;
  height: auto;
}
.bw > img{
  filter: greyscale(1) contrast(1.15);
}
figure > a{
  display: inline-block;
  transition: all 0.3s;
}
figure > a:hover{
  transform: scale(1.03);
}

.kuva.circle img, .img.circle img, img.circle{
  aspect-ratio: 1/1;
  object-fit: cover;
  border-radius: 500px;
}
.single .post-thumb img{
  /* aspect-ratio: 16/7;
  object-fit: cover; */
  max-height: 500px;
  object-fit: contain;
}
figure.wp-block-image{
  margin: 0;
}
figure.wp-block-image + p,
p + figure.wp-block-image{
  margin-top: 2em;
}

p.post-thumb{
  margin-bottom: 2em;
}
.kuva.cover{
  align-self: stretch;
}
.kuva.cover .wp-block-image{
  height: 100%;
}
.cover .wp-block-image img,
.wp-block-image.cover img{
  object-fit: cover;
  width: 100%;
  height: 100%;
}
div.svg-image:not(.no-scale) figure.svg-image img,
div:not(.svg-image) > figure.svg-image:not(.no-scale) img{
  /* width: 100% !important; */
}
.breadcrumb{
  font-size: 0.9em;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  margin-bottom: 20px;
}
@media (max-width: 750px){
  .breadcrumb{
    margin-bottom: 10px;
    font-size: 13px;
  }
}

.breadcrumb .sep{
  display: inline-block;
  margin: 0 10px;
  font-size: 1.1em;
}

hr{
  margin: min(50px, 10vw) auto;
  border:0;
  width: 100%;
  border-bottom: 1px solid var(--light-grey);
}
.has-primary-background-color hr{
  border-bottom-color: var(--secondary);
}

hr:first-child{
  margin-top: min(40px, 4vw);
}

.icon{
  display: inline-flex;
  margin-right: 0.6em;
  width: 1em;
  vertical-align: text-bottom;
  padding-bottom: 0.2em;
}
a[href*="tel:"] .icon,
.icon.inline {
    margin: 0 0.3em 0 0.5em;
}
a.icon #Fill-1{
transition: all .3s;
}
a.icon:hover{
  background: none !important;
}
a.icon:hover #Fill-1{
  fill: var(--secondary);
}

.icon i{
  display: inline-block;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: 0 100%;
  width: 1em;
  height: 1em;
  filter: var(--primary-filter);
}
.has-cyan-background-color .icon i{
  filter: var(--secondary-filter);
}
.icon i.phone{
  background-image: url(../img/svg-icons/phone.svg);
}
.icon i.email{
  background-image: url(../img/svg-icons/email.svg);
}
.icon i.location{
  background-image: url(../img/svg-icons/location.svg);
}
.icon i.calendar{
  background-image: url(../img/svg-icons/calendar.svg);
}
.icon i.time{
  background-image: url(../img/svg-icons/time.svg);
}
.icon i.arrow-right, .icon i.arrow-left{
  font-size: 1.25em;
  vertical-align: text-bottom;
  background-image: url(../img/svg-icons/arrow-right.svg);
}
.icon.rotate, .icon i.arrow-left{
  transform: rotate(180deg);
}

.pagination .icon{
  border: none !important;
  vertical-align: initial;
  margin-right: 0;
  width: auto;
}
.pagination .icon i{
  height: 0.5em;
  filter:none;
}

.single #content .pagination{
  max-width: 350px;
  margin: 6vh auto;
  display: flex;
  justify-content: space-between;
}

iframe{
  width: 100%;
}
.wp-embed-aspect-16-9 .wp-block-embed__wrapper{
  padding-top: 56.25%;
  position: relative;
}

.video-embed{
  position: relative;
}

.video-embed iframe,
.wp-embed-aspect-16-9 .wp-block-embed__wrapper iframe{
  position: absolute;
  top: 0;
  height: 100%;
  width: 100%;
}

/* Typography */

body {
  margin: 0;
  padding: 0;
  background: #fff;
  color: var(--black);
  text-align: left;
  --body-font-size: var(--base-font-size); 
  font:400 var(--body-font-size)/1.5 var(--body-font);
}

@media (min-width: 1400px){
  body{
    --body-font-size: 18px;
  }
}
@media (max-width: 480px){
  body{
    --body-font-size: 15px;
  }
}
@media (max-width: 320px){
  body{
    --body-font-size: 14px;
  }
}
body{
  font-size: var(--body-font-size);
}

p{
    margin-bottom:1em;
}
p:empty:last-of-type{
  display: none;
}
.wp-block-column p:last-child,
p:last-child {
    margin-bottom: 0;
}


h1, h2, h3, h4, h5, .h2, .h3{
  font:900 3em/1.2 var(--title-font);
  margin:1em 0 0.5em;
  color: var(--black);
  word-break: normal;
}

/* h1, h2 {
  font:400 3em/1.2 'Black Ops One';
} */


h1, h2.has-large-font-size{
  line-height: 1.1;
  --font-size: clamp(min(2rem, 10vw), 10vw, min(2.4em, 40px));
  font-weight: 400;
  letter-spacing: -0.01em;
  text-transform: uppercase;
  
}
h1{
  margin: 0;
  margin-bottom: 1.2em;
}
.hero h1{
  margin: 0.3em 0 !important;
}
.home h1{
  /*font-size: min(8em, 120px);*/
}


.has-white-text-color h1, .has-white-text-color h2{
  color: #fff;
}

.hero h1{
  color: #fff;
}

#content h1{
  margin-bottom: 1.2em;
}

h2:first-child, h3:first-child, h4:first-child, .h2:first-child, .h3:first-child {
  margin-top: 0;
}
h1:last-child, h2:last-child, h3:last-child, .h2:last-child, .h3:last-child, h4:last-child, .wp-block-image:last-child, .hero h2 {
  margin-bottom: 0;
}

.single h1{
  text-align: center;
}
h2, h3.has-large-font-size, .h2{
  --font-size: clamp(min(1.7rem, 9vw), 7.5vw, min(3em, 52px));
  text-transform: uppercase;
  margin-bottom: 1em;
}

h2.has-large-font-size,
h3.has-large-font-size{
  --wp--preset--font-size--large: var(--font-size);
}

h3{
  --font-size: clamp(1.2em, 5vw, min(2.25em, 36px));
}
.loop-wrapper h3{
  --font-size: clamp(1em, 5vw, min(1.25em, 20px));
  line-height: 1.5;
}
.loop-wrapper{
  font-size: min(16px, var(--font-size));
}
h4{
  --font-size: min(1.625em, 26px);
  --font-size: clamp(1em, 4.8vw, min(1.625em, 26px));
}
h5{
  --font-size: min(1.1875em, 20px);
  --font-size: clamp(1em, 4vw, min(1.1875em, 20px));
}
#footer {
  font-size: 1em;
}

@media (max-width: 760px){
  h1, h2.has-large-font-size{
    /* --font-size: calc(3 * var(--body-font-size) ); */
  }

}

h1, h2, h3, h4, h5{
  font-size: var(--font-size);
}
h1 + h2{
  margin-top: 0;
}
h4 + h2{
  margin-top: 0.3em;
}
.doughnut + h4{
  margin-top: 0;
}
.wp-block-column > h3{

}
.nostot h3{
/*    font-size:1.625em;
    line-height: 1.2;
*/}

.wp-block-image figcaption,
.has-small-font-size{
  font-size: min(1em, 20px);
}

.has-medium-font-size{
    font-size: 1.25em;
}
.has-large-font-size, .ingressi p{
    font-size: 1.65em;
}
h3 span.has-inline-color {
    float: left;
    margin-right: 30px;
    font-size: 2.5em;
}

b, strong{
  font-weight: 700;
  font-family: var(--body-font);
}
.date{
  font-size: 0.85em;
}

.wp-block-image figcaption{
  margin-top: 1em;
  margin-bottom: 0;
}

blockquote{
    border: 1px solid #ccc;
    text-align: center;
    padding: 40px 20px;
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px #ccc;
    font-style: italic;
    font-size: 1.4em;
    margin: 50px 0;
}
blockquote *{
    margin: 0;
    font-style: italic;
}

.ingressi{
    text-align: center;
    margin-bottom: 10vh;
}
.home .ingressi{
  font-size: 1.2em;
}

a{
  border: none;
  outline: none;
  text-decoration: none;
  color: inherit;
}

p a, label a, h2 a, h3 a, h4 a{
  --color: var(--white);
  color: var(--color);
  background: linear-gradient(to right, var(--color), var(--color) 50%, rgba(140,140,140,.5) 50%);
  background-size: 200% 1px;
  background-repeat: no-repeat;
  background-position: 100% 100%;
  transition: all .3s;
}
p a:hover, label a:hover, h2 a:hover, h3 a:hover, h4 a:hover{
  background-position: 0% 100%;
}
/*p a{
  --color: var(--primary);
}*/

a[href*="tel:"] {
    /*white-space: nowrap;*/
    display: inline-block;
    line-height: 1.3; /* alleviivauksen takia */
}
@media (min-width: 600px){
  a[href*="tel:"] {
    background: none !important;
  }
}
#copy{
  font-size: min(0.875em, 14px);
}

.contact p{
  margin-bottom: 0.2em;
}
.contact + p{
  margin-top: 1em;
}

@media (max-width: 599px){
  #content .has-text-align-right{
    text-align: left;
  }
}

@media(max-width: 500px) {
  .main-container h2 {

  font-size: 1.85em;
}
}

/* /Typography */

/* Layout & columns */

.clear{
  clear:both;
}
.left, .alignleft {float:left;}
.right, .alignright  {float:right;}

.aligncenter{
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.main-container{
  overflow: hidden;
  position: relative;
}



.flex{
  display: flex;
  flex-wrap: wrap;
  gap: var(--grid-gap);
}
.f-nowrap{ flex-wrap: nowrap;}
.f-center{ justify-content: center; }
.f-justify{ justify-content: space-between; }
.f-end{ justify-content: flex-end; }
.f-start{ justify-content: flex-start; }
.f-vstart{ align-items: flex-start; }
.f-vend{ align-items: flex-end; }
.f-vcenter{ align-items: center; }
.f-c-justify{ align-content: space-between; }
.f-dir-col {display: flex; flex-direction: column;}
.flex > div, .f-col { flex: 1 1 auto;}
#content .flex > div, #content .f-col{
  padding-bottom: var(--grid-gap);
}
.flex > .f-50{
  flex-basis: 50%;
}
.flex > .f-33{
  flex-basis: 33.33%;
}
.flex > .f-66{
  flex-basis: 66.66%;
}
.flex > .f-min{
  flex-basis: auto;
  flex-grow: 0;
}

.max-w-90{
  max-width: 90%;
}

.no-margin {
  margin: 0!important;
}

/* wp-columns tweak -> */
#content > *,
.wp-block-group,
.hero .wrap{
  max-width: var(--wrap);
  width: 100%;
  margin: 0 auto 0;
  padding-left: var(--side-margin);
  padding-right: var(--side-margin);
}
#content > .is-style-full-width,
.wp-block-group.is-style-full-width {
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
}
@media (min-width: 950px){
  #content > .is-style-narrow-width,
  .wp-block-group.is-style-narrow-width{
    max-width: var(--narrow-wrap);
  }
}
#content > .wp-block-group,
#content > .wp-block-cover,
#content > .post-wrapper,
#content > .block-wrapper{
  margin-top: clamp(7vh, 7vw, 100px);
}
#content > div:not(.has-background):last-of-type {
  padding-bottom: clamp(7vh, 7vw, 100px);
}
.wp-block-group.is-style-full-width:first-of-type {
  margin-top: 0 !important;
}
#content .wp-block-group.bottom-0 {
    margin-bottom: 0;
}
#content .nostot{
  margin-top: 0;
  margin-bottom: 0;
}
#content .nostot.wp-block-columns {
  gap: min(5%, 4vw);
  row-gap: 2em;
}
#content .nostot.wp-block-columns .wp-block-column{
  padding: 0;
}

#content{
  min-height: 80vh;
}


.wrap,
.wp-block-group.has-background > .wp-block-group__inner-container{
    padding: 0 var(--gap);
}
.wrap.wp-block-columns,
.wrap > .wp-block-columns,
#content > .block-wrapper.core-columns > .wp-block-columns,
#content .wp-block-columns .wp-block-columns,
#footer .wp-block-columns .wp-block-columns,
.wp-block-group.is-style-full-width .wp-block-group.is-style-normal-width .wp-block-columns,
#content > .wp-block-group > div > .block-wrapper.core-columns > .wp-block-columns,
.wp-block-group.has-background .wp-block-group__inner-container > .block-wrapper.core-columns{
  margin-left: calc(-1 * var(--gap));
  margin-right: calc(-1 * var(--gap));
}
#content > .block-wrapper.core-columns > .wp-block-columns[class*="columns-grid-"]{
  margin-left: 0;
  margin-right: 0;
}
@media (max-width: 599px){
  #content .wp-block-columns .wp-block-columns{
    margin-left: 0;
    margin-right: 0;
  }
}
.wrap .wp-block-columns.wrap{
    padding-left: 0;
    padding-right: 0;
}

.wp-block-group .wp-block-columns{
    margin: 0 auto;
}
/*.wp-block-columns.full{
    max-width: 100%;
}*/
/*.wp-block-group.full, .wp-block-group.full-wrap, .wp-block-group.full-width, .full-width, .wrap > .wp-block-group.has-background{
  margin-left: var(--full-nega-margin);
  margin-right: var(--full-nega-margin);
  width: auto;
}
.large-width{
  margin-left: var(--large-nega-margin);
  margin-right: var(--large-nega-margin);
  width: auto;
}*/
.wp-block-group.full-wrap .wp-block-group__inner-container{
    max-width: var(--wrap);
    margin-left: auto;
    margin-right: auto;
}

.wp-block-columns[class*="columns-grid-"] {
  gap: calc(var(--grid-gap) * 2);
}
/* #content .wp-block-columns[class*="columns-grid-"] .wp-block-column{
  padding: 0;
} */
.wp-block-column,
#content .wp-block-column,
#footer .wp-block-column {
    margin: 0;
    padding: 20px var(--gap);
}
.block-wrapper.core-media-text{
  padding: 2% 0;
}
/*#content .wp-block-media-text__content{
  padding: calc(2 * var(--gap)) 0 0 0;
}*/


#content .wp-block-column:last-child.extend,
#content .wp-block-column:last-child.extend-bg{
  margin-right: calc(var(--full-nega-margin));
  flex-grow: 1;
}
#content .wp-block-column:first-child.extend,
#content .wp-block-column:first-child.extend-bg{
  margin-left: calc(var(--full-nega-margin));
  flex-grow: 1;
}
#content .wp-block-column:last-child.extend-bg{
  padding-right: calc(-1 * var(--full-nega-margin) + 25px);
}
#content .wp-block-column:first-child.extend-bg{
  padding-left: calc(-1 * var(--full-nega-margin) + 25px);
}

@media (max-width: 600px) {
  #content .wp-block-column.has-background.extend,
  #content .wp-block-column.has-background.extend-bg{
    margin-inline: calc(var(--full-nega-margin) + var(--gap));
    padding-inline: 0;
  }
}


#content .wp-block-column.wp-block-cover-inside{
  min-width: 50%;
  padding: 0;
}
#content .wp-block-column.wp-block-cover-inside .wp-block-cover{
  height: 100%;
}

@media (min-width: 601px){
  #content .wp-block-media-text__content{
    /*padding-bottom: calc(2 * var(--gap));*/
    padding-left: calc(2 * var(--gap));
    padding-right: 0;
  }
  #content .has-media-on-the-right .wp-block-media-text__content{
    padding-right: calc(2 * var(--gap));
    padding-left: 0;
  }
}
@media (max-width: 600px){
  #content .wp-block-media-text__content{
    padding: calc(2 * var(--gap)) 0 0 0;
  }
  #content .wp-block-column.wp-block-cover-inside{
    order: -1;
  }
  #content .wp-block-column.wp-block-cover-inside .wp-block-cover{
    min-height: 60vw !important;
  }
}
#content .wp-block-media-text.has-background .wp-block-media-text__content,
#content .wp-block-columns.block-columns-2.has-background .wp-block-column.is-vertically-aligned-center{
  padding: calc(2 * var(--gap));
  padding-top: calc(2.5 * var(--gap));
  --wp--style--block-gap: 0px;
}
.wp-block-media-text.is-style-small-pic{
  grid-template-columns: min(23%, 20vw) 1fr !important;
  align-items: start;
}
#content .wp-block-media-text.is-style-small-pic .wp-block-media-text__content{
  padding-top: 0;
  --gap: 5%;
  align-self: start;
}
#content .wp-block-media-text.is-style-small-pic .wp-block-media-text__media{
  max-width: 85px;
  max-height: 95px;
  width: 100%;
  height: 100%;
  margin-top: 5px;
  margin-bottom: var(--gap);
  justify-self: center;
  align-self: start;
}
#content .wp-block-media-text.is-style-small-pic .wp-block-media-text__media img{
  max-height: 100%;
  object-fit: contain;
}
figure.wp-block-media-text__media img {
  max-height: 80vh;
  object-fit: cover;
}

#content .wp-block-column.cover{
    padding: 0;
}

#content .wp-block-group.has-background .wp-block-column:not(.cover){
  padding: 15px var(--gap);
}

#content .wp-block-column.kuva,
#content .wp-block-columns .wp-block-column.empty-column,
#content .wp-block-group.has-background .wp-block-column.kuva {
  padding: 0;
}

@media (min-width: 600px){
    .wp-block-column {
        flex-basis: 50%;
    }
}
@media (min-width: 600px) and (max-width: 781px){
  .wp-block-column:not(:only-child) {
    flex-basis: 50% !important;

  }
}
@media (max-width: 599px){
    .wp-block-column{
        padding-top: 2px;
        padding-bottom: 2px;
    }
    #content .wp-block-column{
/*      padding-left: 0;
      padding-right: 0;*/
    }
    .kuva{
      order: -1;
    }
    .wp-block-media-text.is-stacked-on-mobile.is-style-small-pic .wp-block-media-text__content{
      grid-column: 2;
      grid-row: 1;
    }
}
@media (max-width: 650px) {
  .wp-block-columns .wp-block-column {
    margin: 10px 0;
  }
}
.wp-block-columns + p{
  margin-top: 1em;
}

.wp-block-cover{
  height: auto;
  padding: 8vh 0;
}
.wp-block-columns.has-background{
  padding: 0;
}

.wrap > .wp-block-group + .wp-block-columns,
.wrap > .wp-block-group + .wp-block-group,
.wrap > .wp-block-columns + .wp-block-group,
.wrap > .wp-block-columns + .wp-block-columns{
  /*margin-top: var(--gap);*/
}
#content > .hero + .is-style-full-width.has-background,
#content > .is-style-full-width.has-background + .is-style-full-width.has-background{
  margin-top: 0;
}
.wp-block-group.has-background,
#content > .wrap > .wp-block-group,
#content > .wrap > .wp-block-group.no-padding .wp-block-group,
#content > .wrap > .wp-block-group.no-padding .padding{
  padding-top: var(--cont-padding);
  padding-bottom: var(--cont-padding);
}

#content > .wrap > .wp-block-group.no-padding{
  padding-top: 0;
  padding-bottom: 0;
}



/* <- wp-columns tweak */

.wp-block-columns{
  /*content-visibility: visible;*/
  contain:layout;
/*  contain-intrinsic-size: 1000px;*/
}

@media (max-width: 1000px) {
  .wp-block-columns.block-columns-3{
    flex-wrap: wrap!important;
  }
  .wp-block-columns.block-columns-3 .wp-block-column{
    min-width: 280px;
  }
}

.wp-block-cover{
  contain: paint layout;
}
.wp-block-video {
  contain: layout;
}
.text-right{
    text-align: right;
}
.text-left{
    text-align: left;
}
.text-center{
    text-align: center;
}

.single-post p{
  max-width: 1000px;
}

.padding-right-0{
    padding-right: 0;
}
.padding-left-0{
    padding-left: 0;
}
.padding-top-0{
    padding-top: 0 !important;
}
.padding-bottom-0{
    padding-bottom: 0 !important;
}
.padding-0,
.wp-block-columns.padding-0 .wp-block-column,
.wp-block-media-text.padding-0 .wp-block-media-text__content{
  padding: 0px !important;
}
.padding-10{
  padding: 10px;
}
.margin-0{
    margin: 0 !important;
}
.margin-top-0{
  margin-top: 0 !important;
}
.margin-bottom-0{
  margin-bottom: 0 !important;
}
.wrap,
.wp-block-group.has-background > .wp-block-group__inner-container{
  max-width: var(--wrap);
  margin:0 auto;
  width: 100%;
}

.wp-block-columns.padding-0{
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.wp-block-column.wrap-margin{
  width: calc((100vw - var(--wrap) + var(--side-margin)) / 2 + var(--gap));
  flex-basis: auto !important;
  min-width: var(--side-margin);
  flex-grow: 0;
}
@media (min-width: 1200px){
 .wp-block-column.wrap-margin{
  padding-left: var(--gap) !important;
 }
}

.wrap.full{
    max-width: 100%;
}

.message-div{
  text-align: center;
  padding: var(--grid-gap);
}
.row.padding{
    padding: 40px 0;
}

.scroll-show{
  opacity: 0;
  transform: translateY(100px);
  transition: opacity 0.8s, transform 0.6s;
}
.scroll-show.scrolled{
  transform: none;
  opacity: 1;
}
#content{
  position: relative;
}
#content.padding-bottom{
  padding-bottom: 10vh;
}
#content.padding-top,
#content .wrap.padding-top{
  padding-top: 8vh;
}
#content .block-wrapper.nega-margin,
#content .wrap.nega-margin,
#content .wp-block-group.nega-margin{
  margin-top: -50px;
}

/*.single-reference #content,
.single-post #content {
  max-width: 950px;
  margin: -35vh auto 0;
}*/

.bg-white{
  background: #fff;
}

@media (min-height: 650px){
  #content .block-wrapper.nega-margin,
  #content .wrap.nega-margin,
  #content .wp-block-group.nega-margin{
    margin-top: calc(650px - 100vh);
    margin-top: -15vh;
  }
}

@media screen and (max-width: 840px){
  .wp-block-spacer{
    max-height: 5vh;
  }

}
@media (max-width: 780px){
  .wp-block-column:not(:only-child){
    flex-grow: 1;
  }
  .wp-block-column.empty-column{
    flex-basis: 0 !important;
    flex-grow: 0;
  }

}

 @media screen and (min-width: 600px) {
  .hide-desktop {
    display: none;
  }
 }

/* wp-kolumnit yhteen palstaan t�ss� kohtaa */
@media screen and (max-width: 599px){
  .hide-mobile,
  .home .hero .isologo{
    display: none;
  }
  .full-mobile {
      margin-left: calc(var(--side-margin) * -1);
      margin-right: calc(var(--side-margin) * -1);
      width: 100vw;
      padding-left: var(--side-margin);
      padding-right: var(--side-margin);
  }

}

/* gallery */

#content .wp-block-gallery.aligncenter .blocks-gallery-grid{
  justify-content: center;
}
#content .wp-block-gallery .blocks-gallery-item{
  margin: 0;
  padding: 20px;
  flex-grow: 0;
  min-width: 200px;
}
#content .wp-block-gallery .blocks-gallery-item figure{
  align-items: center;
}
.wp-block-gallery.columns-6 .blocks-gallery-item{
  flex-basis: 16.66%;
}
.wp-block-gallery.columns-5 .blocks-gallery-item{
  flex-basis: 20%;
}
.wp-block-gallery.columns-4 .blocks-gallery-item{
  flex-basis: 25%;
}
.wp-block-gallery.columns-3 .blocks-gallery-item{
  flex-basis: 33.33%;
}
.wp-block-gallery.columns-2 .blocks-gallery-item{
  flex-basis: 50%;
}

#content .wp-block-gallery.logot .blocks-gallery-item{
  padding: 2px 20px;
}
@media (max-width: 456px){
  #content .wp-block-gallery.logot .blocks-gallery-item{
    padding: 10px 20px;
  }
}



/* /Layout & columns */

/* Ul & Ol lists */

ul{
  margin:10px 0 10px 0px;
}
li{
  margin-left:15px;
}
li a{
    text-decoration: none;
}
ol {
  list-style: none;
  counter-reset: mek-counter;
  margin: 40px 0;
}
ol li {
  counter-increment: mek-counter;
  line-height: 1.5;
  padding-top: 0.6em;
  margin-bottom: 0.5em;
  margin-left: 0px;
  padding-left: 1.5em;
  border-top: 1px solid var(--primary);
}
ol.no-border li{
  border:0;

}
ol li::before {
  content: counters(mek-counter, ".") "";
  color: inherit;
  font-weight: 400;
  --size: 1em;
  font-size: 1em;
  margin-left: calc(-1 * var(--size));
/*  margin-top: 2px;*/
  /*line-height: 1;*/
  width: var(--size);
  height: var(--size);
  display: inline-block;
  font-family: var(--body-font);
  text-align: right;
  /*float: left;*/
  padding-right: 13px;
}
#content ul li{
  list-style: none;
  margin-left: 30px;
  line-height: 1.4;
  margin-bottom: 0.5em;
}
#content ul:not(.blocks-gallery-grid) li::before{
  content: '';
  --size: 0.42em;
  --margin: 12px;
  margin-left: calc(-1 * (var(--size) + var(--margin)));
  margin-right: var(--margin);
  margin-bottom: 0.1em;
  line-height: 1;
  width: var(--size);
  height: var(--size);
  background: var(--primary);
  display: inline-block;
  border-radius: 50%;
}
#content .wp-block-cover ul{
  margin-left: 0;
}
#content .wp-block-cover li::before{
  background: url(../img/svg-icons/check.svg) no-repeat 50% 100%;
  border-radius: 0;
  margin-bottom: 0;
  --size: 1em;
  --margin: 0.5em;
}
/*li::marker{
  font-size: 1.2em;
  line-height: 1;
  color: var(--primary);
}*/

#content ul.icons {
  margin-bottom: 1.5em;
}
#content ul.icons li,
ul.icons li{
  margin-left: 1.6em;
  list-style: none;
}
#content ul.icons li .icon,
ul.icons li .icon{
  margin-left: -1.6em;
  display: block;
  float: left;
  margin-top: 0.15em;
}
#content ul.icons li::before,
ul.icons li::before{
  display: none;
}

/* /Ul & Ol lists */

/* Buttons*/

p + .wp-block-buttons {
  margin-top: 2em;
}

.wp-block-button__link, .button{
display: inline-block;
text-transform: none;
line-height: 1.3;
height: auto;
background: var(--btn-color);
font-family: var(--title-font);
color: var(--primary);
font-size: min(1.3em, 20px);
font-weight: 700;
min-width: 170px;
max-width: 300px;
margin-top: 1em;
text-transform: uppercase;
padding: var(--padding, 0.5em 1.2em) !important;
transition: all .3s;
border: 0;
}

#top-bar .wp-block-button .wp-block-button__link {
text-transform: none;
background-image: none;
}


.wp-block-button__link:focus, .button:focus{
background: var(--btn-color);
outline: none;
color: var(--primary);
}


@media (max-width: 400px){
.wp-block-button {
    margin-top: 0.5em;
}
}

.wp-block-button.is-style-arrow .wp-block-button__link,
.arrow-btn .wp-block-button .wp-block-button__link,
a.arrow{
display: inline-block;
margin-left: 2em;
font-size: 1em;
margin-top: 0;
padding: 0;
border: 0;
min-width: 0;
box-shadow: none !important;
background-color: transparent;
position: relative;
font-weight: bold;
line-height: inherit;
color: var(--black);
background: transparent linear-gradient(to right, var(--black), var(--black)) no-repeat 0 100%;
background-size: 0% 1px;

}
a:hover .wp-block-button.is-style-arrow .wp-block-button__link,
.hero.arrow-btn .wp-block-button .wp-block-button__link:hover,
.hero .wp-block-button.is-style-arrow .wp-block-button__link:hover,
.arrow-btn .wp-block-button .wp-block-button__link:hover,
.wp-block-button.is-style-arrow .wp-block-button__link:hover,
a.arrow:hover{
background: transparent linear-gradient(to right, var(--black), var(--black)) no-repeat 0 100%;
background-size: 100% 1px;
color: var(--black);
}
.arrow-btn .wp-block-button .wp-block-button__link::before,
.wp-block-button.is-style-arrow .wp-block-button__link::before,
a.arrow::before{
content: '';
display: inline-block;
position: absolute;
font-size: 1em;
left: -1em;
background: url(../img/svg-icons/arrow-right2.svg) no-repeat 0 50%;
background-size: contain;
/*filter: contrast(0.15);  grey */
width: 1em;
height: 1em;
transform: scale(1.2) translate(-50%, 18%);
transition: all .3s;
}
a:hover .wp-block-button.is-style-arrow .wp-block-button__link::before,
.arrow-btn .wp-block-button .wp-block-button__link:hover::before,
.wp-block-button.is-style-arrow .wp-block-button__link:hover::before,
a.arrow:hover::before{
transform: scale(1.2) translate(-30%, 18%);
}

.has-primary-background-color .wp-block-button.is-style-arrow .wp-block-button__link{
color: #fff;
background-image: linear-gradient(to left, #fff, #fff);
}

.has-primary-background-color .wp-block-button.is-style-arrow .wp-block-button__link:before{
filter: invert(1);
}

.wp-block-quote + .wp-block-buttons{
margin-left: 20px;
}

.hero .wp-block-button.is-style-arrow .wp-block-button__link,
.hero.arrow-btn .wp-block-button .wp-block-button__link{
color: #fff!important;
background-image: linear-gradient(to left, #fff, #fff) !important;
}
.hero .wp-block-button.is-style-arrow .wp-block-button__link:before,
.hero.arrow-btn .wp-block-button .wp-block-button__link:before{
filter: invert(1);
}
.hero .wp-block-button.is-style-outline .wp-block-button__link:not(:hover){
  background-color: rgba(255,255,255,.2);
}

/* /Buttons*/

/* Header & Top bar*/

#top-bar{
    padding: 15px var(--side-margin);
    width: 100%;
    z-index: 1000;
    position: fixed;
    background: transparent;
    text-align: center;
    font-size: 18px;
    /*box-shadow: 0 3px 6px rgba(0,0,0,.15);*/
    scroll-snap-margin-top: 0px;
    scroll-margin-top: 0px;
    transition: padding 0.5s;
    color: #fff;
}
.logo{
    display: inline-block;
}
.logo div{
    max-width: 200px;
    transition: all 0.4s;
    opacity: 0;
    margin-top: 0.2em!important;
    margin-bottom: 0.2em;
}


/* .home #top-bar:not(.fixed) .logo{
    filter: greyscale(1) contrast(7) invert(1);
} */
#top-bar.fixed{
  background: hsl(0, 0%, 0%, 0.85);
  padding-top: 10px;
  padding-bottom: 10px;


}
#top-bar.fixed .logo div{
    max-width: 170px;
    margin-top: -10px;
    opacity: 1;
}
#top-bar.white,
#top-bar.white #secondary-navi{
    color: var(--black)
}

#top-bar.fixed #secondary-navi{
   display: none;
}


@media(min-width: 1000px) {
    #top-bar .flex {
        justify-content: center;
    }

    #top-bar.fixed .flex {
        margin-right: 0;
    }

}


#top-bar .flex .f-col{
    flex: 0 1 auto;
}
@media (min-width: 750px) {
    #top-bar .flex .f-col{
        /* min-width: 200px; */
    }
}
@media (max-width: 580px) {
    #top-bar .flex #secondary-navi{
        position: absolute;
        top: 5px;
        right: 10px;
    }
    #top-bar{
        /* padding-top: 50px; */
    }
}
#top-bar .search{
  margin-right: 10px;
}
#top-bar .wp-block-button .wp-block-button__link{
    margin-top: 0;
}

@media (max-width: 1000px){
   #top-bar{
    /* position: absolute; */
   }
}
@media (min-width: 800px){
    #top-bar .f-col.right{
        width: 150px;
    }
}


@media screen and (max-width: 583px) {
    body.admin-bar{
        margin-top: calc(-1 * var(--admin-bar));
    }
    body.admin-bar .main-container{
        padding-top: var(--admin-bar);
    }
    .logo div img{
        max-width: 100px; 
    }
}
.hero{
    position: relative;
}
.hero .bg{
    padding: 60px 0 60px;
    text-align: left;
    background: url() no-repeat 50% 50%;
    background-size: cover;
    min-height: calc(max(65vh, 550px) - var(--admin-bar, 0px));
    display: flex;
    position: relative;
}

.home .hero .bg, .hero.landing-page{
    min-height: 500px;
    min-height: calc(100vh - var(--admin-bar, 0px) - var(--top-bar, 0px));
    padding: 120px 0 60px;
    position: relative;
}
.hero.landing-page{
    padding-bottom: 0;
}
.hero.landing-page .bg{
    background: url() no-repeat 50% 50%;
    background-size: cover;
    height: 85vh;
    width: 100%;
    position: absolute;
    top: 0;
}

#top-bar + .hero .bg,
#top-bar + #content .hero .bg{
    /* --top-bar: 142px;
    margin-top: var(--top-bar) !important; */
}

@media (max-width:980px) {
    #top-bar + .hero .bg,
    #top-bar + #content .hero .bg{
        --top-bar: 100px;
    }
}

.hero.landing-page .wp-block-group{
    margin-top: calc(30vh - 120px);
    position: relative;
    z-index: 3;
}
.hero.landing-page .wp-block-group .bg-white{
    padding: 4% 7%;
    min-height: 60vh;
}

.hero.bg:after,
.hero .bg:after {
    content: '';
    background: rgba(0,0,0,0.70);
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
}


@media (max-width: 1000px){
  .hero .bg{
    padding: 90px 0 50px;
  }
}
@media (max-width: 750px){
  .hero .bg{
    padding: 70px 0 30px;
  }
  .home .hero .bg{
    min-height: 65vh;
  }
}
/* @media (min-width: 750px){
  .home .hero h1{
    max-width: 65%;
  }
} */

body .main-container .hero.plain{
    height: 200px;
    padding: 0;
    min-height: 0;
    background: none;
}
.home .main-container .hero.plain{
    height: 0;
}


@media (max-width: 1000px){
    .header-mask{
        max-width: 50vw;
        min-width: 300px;
        align-items: flex-start;
    }
    .home .hero{

    }
    body .main-container .hero.plain{
        height: 100px;
    }
}

.hero .wrap{
  position: relative;
  z-index: 2;
}
.hero .cont{
    height: 100%;
}
.hero .ingressi{
    margin-bottom: 0;
    margin-top: 1.5em;
    max-width: 600px;
    text-align: left;
}
.hero .ingressi p{
    font-size: 1em;
    font-weight: 400;
}

.hero .form-container{
    padding: 5% 8%;
}

.wp-block-group.hero .wp-block-cover{
    padding-top: calc(100px + 15vh);
    padding-bottom: 0;
    height: 60vw;
    max-height: 90vh;
    min-height: 65vh;
}
@media (max-width: 640px){
 .wp-block-group.hero .wp-block-cover{
    height: auto;
 }
 .wp-block-group.hero .wp-block-cover .wp-block-cover__inner-container{
    /* background: var(--primary-20); */
    padding: 25px 0;
 }
 .wp-block-group.hero .wp-block-cover img{
    height: 50%;
 }
 .wp-block-group.hero .wp-block-button{
    margin: 0;
 }
}

.wp-block-group.hero .wp-block-cover.has-primary-background-color{
    background-color: var(--primary-50);
}


/* /Header & Top bar*/
/* custom-blocks */

/* nostot */

.nosto-link-container, .nosto-block{
  height: 100%;
  display: block;
  transition: all .2s;
}
.nosto-block{
  display: flex;
}
.nosto-link-container:hover{
  transform: scale(1.02);
}

.people-nosto .kuva img{
  max-width: 250px;
  margin-bottom: 15px;
}
@media (min-width: 500px){
  .people-nosto .kuva{
    text-align: right;
  }
  .people-nosto .cont{
    padding-left: 5%;
  }

}

.wp-block-acf-person{
  display: flex;
  flex-direction: column;
  height: 100%;
} 
.person .kuva{
  --size: 270px;
  margin-bottom: 1em;
  width: var(--size);
  height: var(--size);
  max-width: 100%;
  display: flex;
  align-items: flex-end;
}
.person .kuva img{
  object-fit: cover;
  object-position: 0 0;
  height: 100%;
  width: 100%;
}
.person .kuva.no-image{
  background: var(--light-grey);
}
.person.small-pic .kuva{
  --size: 200px;
}

.person h4{
  font-size: 1.25em;
  margin-top: 0.5em;
  margin-bottom: 0.3em;
}

.person p{
  margin-bottom: 0.3em;
  line-height: 1.4;
  font-weight: 300;
}
.person .contact{
  align-content: flex-end;
  flex-grow: 1;
  display: flex;
  align-items: flex-end;
}

.writer{
  margin-top: 8vh;
}
.writer .person{
  display: flex;
  align-items: center;
}
@media (max-width: 600px) {
  .writer .person{
    display: block;
  }
  
}
.writer .contact,
.writer .job-title{
  display: none;
}

.writer .person .kuva{
  max-width: 200px;
}
#content .writer .person h4 {
  text-align: left;
  margin-top: 0;
}
.writer h5{
  font-family: var(--title-font-italic);
  font-size: 1.4em;
  opacity: 0.5;
  margin-bottom: 0.5em;
}

/* accordion-block */

.accordion-block{
  padding: 15px 20px;
  border-bottom: 1px solid rgba(0,0,0,0.2);
}
.accordion-block:first-child{
  border-top: 1px solid rgba(0,0,0,0.2);
}
.accordion-block ol {
  margin: 0;
}
.accordion-block ol li{
  border:0;
  padding: 0;
  margin: 0;
}
.accordion-block .accordion-title{
  font-weight: bolder;
  color: var(--primary);
  cursor: pointer;
}
.accordion-block:hover{
  background: var(--light-grey);
}
.accordion-block.open:hover{
  background: #fff;
}
.accordion-block .accordion-content{
  max-height: 0;
  padding: 0;
  opacity: 0;
  overflow: hidden;
  transition: all .3s;
}
#content .accordion-block .accordion-content strong{
  font-size: 0.9em;
}

.accordion-block.open .accordion-content{
  margin-top: 10px;
  opacity: 1;
  max-height: 1000px;
}

.accordion-block .plus{
    font-size: 30px;
    --color: var(--black);
    color: var(--color);
    float: right;
    display: inline-block;
    /* background: rgba(216, 216, 216, .8); */
    width: 1.1em;
    height: 1.1em;
    line-height: 1.1em;
    border-radius: 50%;
    margin: -5px -20px 0 15px;
    text-align: center;
    cursor: pointer;
    vertical-align: middle;
    position: relative;
}

/* plus/minus */
/* .accordion-block .plus:before, .accordion-block .plus:after{
    content: "";
    width: 14px;
    height: 2px;
    background: var(--color);
    display: block;
    position: absolute;
    top: 0.5em;
    left: 0.3em;
}
.accordion-block .plus:after{
    transform: rotate(90deg);
    transition: all .3s;
}
.accordion-block.open .plus:after{
    transform: rotate(0deg);
} */

/* arrow down/up */
.accordion-block .plus:before{
  content: "";
  position: absolute;
  top: 50%;
  left: calc(50% - 5px);
  border: solid black;
  border-width: 0 2px 2px 0;
  display: inline-block;
  padding: 4px;
  transform: rotate(45deg) translate(-4px, -4px);
  transition: all .3s;
}
.accordion-block.open .plus:before{
  transform: rotate(-135deg) translate(1px, 1px);
}
.accordion-block .plus:hover{
  background: var(--light-grey);
}


/* Video block */

.bg-video-block{
  position: relative;
}

.home .bg-video-block {
  min-height: 95vh;
  align-items: center;
  justify-content: center;
  display: flex;
}

.bg-video-block .overlay{
  height: 100%;
  width: 100%;
  background: #000;
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0;
}
.bg-video-block video.bg-video {
  background-size: cover;
  width: 100%;
  /*min-width: calc(90vh * 1.778);*/
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  object-fit: cover;
}

.bg-video-block .content-container{
  position: relative;
  z-index: 2;
}

.bg-video-block .content-container .cont{
  min-height: 78vh;
  padding: 10vh 0;
  max-width: 750px;
}

.bg-video-block p {
  font-size: clamp(1.1em, 2.5vw, 1.2em);
}

@media(max-width: 650px) {
  .home .bg-video-block {
    margin-top: 92px;
    min-height: 85vh;
  }
}

@media screen and (max-height: 650px){
/* video#bgvid{
min-width: calc(650px * 1.778);
}*/

}
.bg-video-block video{
  width: 100%;
  height: auto;
}


.numbers-block {
  text-align: center;
}
.numbers-block .number{
  font-size: 6em;
  font-weight: 800;
  white-space: nowrap;
}
.columns-4 .numbers-block .number{
  font-size: 6em;
}
.columns-5 .numbers-block .number{
  font-size: 4.8em;
}
.numbers-block .number .suffix{
  padding-left: 0.1em;
}
.numbers .number .suffix.plus{
  display: none;
}
.numbers-block .number.done .suffix.plus{
  display: inline;
}
.numbers-block .text{
  font-size: 1.125em;
}
@media (max-width: 800px) {
  .numbers-block .number{
    line-height: 1.2;
  }
}
/* /custom-blocks */

/* Navi */

#menu-top{
    display:block;
    padding:2px 0;
    text-transform: uppercase;
}
#menu-top a{
    color: inherit;
    font-size: 0.9em;
}

.menu{
    margin:0 auto;
    text-align:center;
}
.menu ul{
    margin:0;
}
.menu ul ul{
    margin:5px 0px 5px 15px;
}
.menu li{
    list-style: none;
    padding:2px 0.7em;
    margin:0;
    display:inline-block;

    /*letter-spacing: 0.03em;*/
}

#menu-top .menu li > ul {
    visibility: hidden;
    opacity: 0;
    position: absolute;
    z-index: 1;
    text-align: left;
    max-width: 100%;
    background: #fff;
    padding: 20px 20px;
    margin: 0;
    margin-left: -10px;
    max-width: 250px;
    /*border: 1px dotted #ccc;*/
    transition: opacity 0.3s;
    /*box-shadow: 0 10px 15px rgba(0,0,0,.15);*/
    border: 1px dotted rgba(0,0,0,.15);
  }
.home #menu-top .menu li > ul {
  background: rgba(19, 38, 47,.75);
}
.fixed #menu-top .menu li > ul {
    background: #fff;
}
#menu-top .menu li > ul a{
  display: inline;
  font-size: 0.9em;
}

#menu-top ul li ul li {
    display: block;
    margin: 0 0 10px 0;
    padding: 0;
}

#menu-top ul li:hover > ul, #menu-top ul li:focus-within > ul, #menu-top ul li ul:hover {
    visibility: visible;
    opacity: 1;
    display: block;
    justify-content: center;
    transition: opacity 0.3s 0.2s;
}

#menu-top li a {
  transition: 0.4s ease;
}

#menu-top li a:hover {
  color: var(--secondary);
}

.menu li li a{
  background-position: 0% 100%;
}
.menu li > ul {
    /*display: none;*/
}


#menu-top li.lang{
  padding-right: 0;
}
#menu-top li.lang a{
  text-transform: uppercase;
  font-family: var(--body-font);
  font-size: 0.8em;
  background: var(--grey);
  border-radius: 50px;
  width: 40px;
  height: 40px;
  line-height: 47px;
}
#menu-top li.lang a:hover{
  background: var(--primary);
  color: #fff;
}

nav#secondary-navi {
    display: flex;
    justify-content: flex-end;
    /* margin: 0 0 15px; */
}
nav#secondary-navi ul{
  margin: 0;
}
nav#secondary-navi .lang {
  margin-left: 1.5em;
  padding-right: 0.2em;
}
nav#secondary-navi .lang li{
  display: inline-block;
  text-transform: uppercase;
  font-size: 0.95em;
  padding: 2px 0.5em;
}
nav#secondary-navi #secondary-menu li {
    display: inline-block;
    font-size: 0.95em;
    padding-right: 20px;
}

#footer .menu li{
  display: block;
  text-align: left;
  padding-left: 0;
}

/* /Navi */

/* Post loops */

#content > .loop-wrapper{
  padding-left: calc(var(--side-margin) - var(--grid-gap));
  padding-right: calc(var(--side-margin) - var(--grid-gap));
}
.loop-wrapper{
  display: flex;
  flex-wrap: wrap;
}
#content > .loop-wrapper{
  margin-bottom: 20px;
  margin-top: 30px;
}
#content > .loop-wrapper.padding-bottom {
  padding-bottom: 5vh;
}
.loop-wrapper {
  margin-left: calc(var(--grid-gap) * -1);
  margin-right: calc(var(--grid-gap) * -1);
}
.loop-wrapper .post{
  position: relative;
  flex-basis: 33.33%;
  padding: var(--grid-gap);
  margin-bottom: var(--gap);
}
.people-wrapper .post{
  flex-basis: 25%;
}
.loop-wrapper .post.button-post:not(.one-row){
  padding-bottom: 60px;
}
.seminar-wrapper.featured .post{
  flex-basis: 50%;
}
.people-wrapper .post{
  display: flex;
  flex-direction: column;
}
.loop-wrapper .image-wrapper{
  margin-bottom: 1.8em;
  aspect-ratio: 7 / 4;
  text-align: center;
}
.people-wrapper .image-wrapper{
  aspect-ratio: 1 / 1;
}
@supports not (aspect-ratio: 7 / 4){
  .loop-wrapper .image-wrapper{
    height: 220px;
  }
}
.image-wrapper.no-image {
    background: #eee;
    /*box-shadow: inset 0 0 0 30px #fff, inset 0 0 0 31px #ccc;*/
}
.loop-wrapper .image-wrapper img{
  object-fit: cover;
  height: 100%;
  width: auto;
  width: 100%;
}
.loop-wrapper .post-type-post .image-wrapper img,
.people-wrapper .image-wrapper img{
  object-fit: cover;
  width: 100%;
  object-position: 50% 20%;
}

.loop-wrapper .image-wrapper.rounded {
    border-radius: 50%;
    overflow: hidden;
}

.loop-wrapper .text-container{
  display: flex;
  flex-direction: column;
}
.loop-wrapper .text-container .actions{
  order: 5;
}
.loop-wrapper .post p{
  font-size: min(20px, 1em);
  /*margin-bottom: 0.2em;*/
}
.loop-wrapper .post .date{
  font-size: 0.94em;
  margin-bottom: 0.2em;
  color: var(--grey);
}

.loop-wrapper .post h2{
  margin-bottom: 0.6em;
}
.people-wrapper .post h2{
  margin-bottom: 0;
}
.loop-wrapper .post h3,
.loop-wrapper .post h4{
  margin-bottom: 0.9em;
}
.loop-wrapper .post .type + h3{
  margin-top: 0.2em;
}
.loop-wrapper .text-container .type{
  color: var(--grey);
  font-size: 0.9em;
  font-weight: 400;
}

.loop-wrapper .post.arkisto{
  margin: 0;
}
.loop-wrapper .post .cont{
  /* border-radius: 2em; */
  /* box-shadow: 0 0 18px rgba(0,0,0,.05); */
  text-align: left !important;
  /* padding: var(--gap); */
  height: 100%;
}

.loop-wrapper .post p.text{
  font-size: 0.94em;
}

@media (max-width: 920px){
 .loop-wrapper .post,
 .people-wrapper .post{
  flex-basis: 50%;
 }
}
@media (max-width: 560px){
 .loop-wrapper .post,
 .people-wrapper .post{
  /*padding-left: 20px;*/
  /*padding-right: 0;*/
  flex-basis: 100% !important;
  margin: 15px 0;
 }
 .loop-wrapper .post.arkisto .cont{
  padding: 6%;
 }
}

/* one-row loop */
.loop-wrapper > .post.one-row{
    flex-basis: 100%;
}
.loop-wrapper > .post.one-row .wp-block-button{
    position: static;
}
@media (min-width: 561px){
  .loop-wrapper > .post.one-row.last{
    margin-bottom: 50px;
  }
  .loop-wrapper > .post.one-row .cont{
      display: flex;
      align-items: center;
  }
  .loop-wrapper > .post.one-row .image-wrapper{
      margin-bottom: 0;
  }
  .loop-wrapper > .post.one-row .cont > div{
      flex-basis: 50%;
      width: 50%;
      align-self: stretch;
  }
  .loop-wrapper > .post.one-row .cont .text-container{
      padding: 0 max(4%, 25px);
  }
  .loop-wrapper > .post.one-row:nth-child(odd) .cont .text-container{
      order: -1;
      padding-left: 0;
  }
  .loop-wrapper > .post.one-row:nth-child(even) .cont .text-container{
      padding-right: 0;
  }
}

#content .pagination{
  text-align: center;
  padding: 30px;
  margin-bottom: 6vh;
}
.pagination span:not(.dots){
  color: #000;
  border-bottom: 1px solid #ccc;
}
.pagination span,
.pagination a{
  padding: 0 5px;
}

.loop-wrapper .text-container [class*="field-"]{
  margin-right: 0.5em;
}

/* filters */
.filterbuttons-wrapper, .ajax-more-button{
  display: flex;
  gap: 0.5em;
  flex-wrap: wrap;
  align-items: center;
  align-items: center;
  justify-content: center;
}
.filterbuttons-wrapper a.wp-block-button__link{
  min-width: 0;
  border-radius: 50px;
  font-weight: 400;
}
.filterbuttons-wrapper .active a.wp-block-button__link{
  font-weight: bolder;
}
.ajax-more-button{
  margin-block: 2em;
}
a.ajax-load-more svg {
  height: 2.5em;
  width: 2.5em;
  cursor: pointer;
}
a.ajax-load-more:hover svg path{
  fill: var(--secondary);
}
.ajax-more-button{
  width: 100%;
}
a.filter-button{
  display: inline-flex;
  align-items: center;
  margin-right: 30px;
  font-size: 16px;
  max-width: 250px;
  margin-bottom: 20px;
}
a.filter-button .name{
  font-weight: 700;
  color: var(--grey);
  transition: all .3s;
}
a.filter-button .filter-icon{
  margin-right: 10px;
  transition: all .3s;
}
a.filter-button img,
a.filter-button svg{
  object-fit: contain;
  max-width: 60px;
  height: 50px;
}
a.filter-button svg path,
a.filter-button svg line,
a.filter-button svg rect{
  stroke-width: 7;
}
a.filter-button:not(.active) .filter-icon,
a.filter-button.active:hover .filter-icon{
  filter: contrast(5) invert(69%) sepia(70%) saturate(251%) hue-rotate(1deg) brightness(90%) contrast(88%);
}
a.filter-button:hover .filter-icon{
  filter: none;
}
a.filter-button.active .name,
a.filter-button:hover .name{
  color: var(--primary);
}

.loader {
  position: fixed;
  background: rgba(255, 255, 255, 0.5);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 999;
}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
.loader::after{
  border: 8px solid #f3f3f3;
  border-top: 8px solid var(--primary);
  border-radius: 50%;
  width: 50px;
  height: 50px;
  position: absolute;
  animation: spin 1s linear infinite;
  z-index: 9999;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  content: '';
}

/* /Post loops */

/* Mobile buttons & mobile menu */

#mobilebuttons{
    padding: 0;
    display: none;
    position: fixed;
    bottom: 0;
    border-top: 1px solid rgba(200, 200, 200, .4);
    font-size: 15px;
    width: 100%;
    z-index: 999;
    /*background: var(--primary);*/
    background: #fff;
    padding-bottom: env(safe-area-inset-bottom);
}
#mobilebuttons .flex{
    flex-wrap: nowrap;
}
#mobilebuttons .column{
    flex:1 0 20%;
}
#mobilebuttons .column:not(.mobile-menu){
    background: var(--primary);
}
#mobilebuttons .column:not(.mobile-menu) a{
    color: #fff;
}
#mobilebuttons.menu-open .column:not(.mobile-menu){
    background: #ccc;
}
#mobilebuttons a{
    color: var(--primary);
    text-align: center;
    display: flex;
    justify-content:center;
    align-items: center;
    padding: 5px 0;
    text-decoration: none;
    background: none;
    font-size: 14px;
    height: 100%;
    min-height: 50px;
}
#mobilebuttons .ikoni svg{
    width: 25px;
    fill: currentColor;
    vertical-align: middle;
}
#mobilebuttons .teksti{
    padding: 0 10px;
}

#mobilebuttons .mobile-Email .ikoni svg{
    width: 32px;
}
#mobilebuttons .mobile-Map .ikoni svg{
    width: 23px;
}

#mobilebuttons .column + .column {
    border-left: 1px solid rgba(170,170,170,.6);
}


a.mobilemenu{
    display: none;
    font-size: 12px !important;
    height: 2.2em;
    line-height: 2.2em;
    z-index: 999;
    position: relative;
}

a.mobilemenu span.teksti{
    float: left;
    text-decoration: none;
    color: #fff;
    font-size: 1.5em;
    padding-left: 10px;
    padding-right: 10px;
}
a.mobilemenu span.ikoni{
    position: relative;
    float: right;
    width: 3.5em;
    height: 4px;
    margin-top: 1em;
    background-color: var(--white);
    -webkit-transition: -webkit-transform .5s;
    transition: transform .5s;

}
a.mobilemenu span.ikoni{
  vertical-align: middle;
  margin-top: -0.1em;
}
a.mobilemenu span.ikoni, a.mobilemenu span.teksti{
  float:none;
  display: inline-block;
  line-height: 1;
}
#mobilebuttons a.mobilemenu span.teksti{
  font-size: 14px;
  /*display: none;*/
}
a.mobilemenu span.ikoni:before,
a.mobilemenu span.ikoni:after{
    content: '';
    display: block;
    width: 3.5em;
    height: 4px;
    background-color: var(--white);
    position: absolute;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}
a.mobilemenu span.ikoni:before{
    top: -10px;
}
a.mobilemenu span.ikoni:after{
    bottom: -10px;
}
a.mobilemenu:hover{
    border-color: #ca0e04;
}


a.mobilemenu.open span.ikoni{
    background: transparent;
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
}
a.mobilemenu.open span.ikoni:before{
  width: 3.5em;
  top:-1em;
    -webkit-transform: translateY(1em) rotate(-45deg);
    transform: translateY(1em) rotate(-45deg);
}
a.mobilemenu.open span.ikoni:after{
  width: 3.5em;
  bottom:-1em;
    -webkit-transform: translateY(-1em) rotate(45deg);
    transform: translateY(-1em) rotate(45deg);
}

#menu-mobile{
/*display: none;*/
    max-height: 0;
    height: 100vh;
    overflow: hidden;
    background: #fff;
    color: var(--black);
    position: fixed;
    z-index: 9;
    width: 100%;
    left: 0;
    top: 0;
    /* bottom: 50px; t�� pois jos menu topissa*/
    padding: 0 20px;
    font-size: 1.1em;
    line-height: 1.4;
    transition: all .3s;
    font-family: var(--title-font)!important;
    text-transform: uppercase;
    font-weight: 700;
}
.fixed #menu-mobile{
    margin-top: 10px;
}
#menu-mobile div{
    height: 100%;
    overscroll-behavior: contain;
    max-width: 500px;
    margin: 0 auto;
    display: flex;
    align-items: center;
}

#menu-mobile ul{
  margin: 0;
  width: 100%;
}
#menu-mobile ul.menu {
    max-height: 100%;
    overflow: auto;
     padding-top: 2em;
     padding-bottom: 2em;
   }
 
#menu-mobile li ul{
  display: none;
}
#menu-mobile li{
  display: block;
  text-align: left;
}
#menu-mobile .menu > li + li{
  padding-top: 0.6em;
}
#menu-mobile .menu > li + li.wp-block-button{
  margin-top: 10px;
}
#menu-mobile li:not(.wp-block-button) a{
  display: inline-block;
  padding: 5px 10px;
}

#menu-mobile li.current-menu-item > a,
#menu-mobile li a:hover{
  background-size: calc(100% - 20px) 1px;
  background-position: 50% 100%;
}

#menu-mobile li li{
}
#menu-mobile.open{
    max-height: 100vh;
    margin-top: 0;
    background-color: var(--primary);
    color: var(--white);
    /*box-shadow: 0 0 0 2px #fff, 0 0 10px rgba(0,0,0,.3);*/
}

#menu-mobile ul.menu .plussa{
    font-size: 30px;
    --color: var(--black);
    color: var(--color);
    float: right;
    display: inline-block;
    /*background: rgba(216, 216, 216, .8);*/
    width: 1.1em;
    height: 1.1em;
    line-height: 1.1em;
    border-radius: 50%;
    margin: 0px 5px 0 0;
    text-align: center;
    cursor: pointer;
    vertical-align: middle;
    position: relative;
}

#menu-mobile ul.menu .plussa:before, #menu-mobile ul.menu .plussa:after{
    content: "";
    width: 14px;
    height: 2px;
    background: var(--color);
    display: block;
    position: absolute;
    top: 0.5em;
    left: 0.3em;
}

#menu-mobile ul.menu .plussa:after{
    transform: rotate(90deg);
    transition: all .3s;
}

#menu-mobile ul.menu .plussa.open:after{
    transform: rotate(0deg);
}

#menu-mobile ul.menu .plussa:hover{
    background: #fff;
}


@media screen and (min-width: 1001px){
    div[class*='-menu-container']{
        display: block !important;
    }
    #menu-mobile,
    #menu-top li.secondary{
      display: none;
    }
    #secondary-menu{
        display: block;
    }
}
@media screen and (max-width: 1000px){

    #mobilebuttons, #menu-mobile, a.mobilemenu{
        display: block;
    }
    body{
        /* margin-bottom: 50px; */
    }
   #menu-top,
   #secondary-menu{
    display: none;
   }

 }


 @media(max-width: 500px) {
    .logo div {
        max-width: 120px;
        margin-bottom: 0;
    }
    form {
        margin-top: 0!important;
    }
 }
/* /Mobile buttons & mobile menu */

/* Modal */

/* The Modal (background) */
.modal {
  display: none;
  position: fixed;
  z-index: 99999;
  left: 0;
  top: 0;
  width: 100%;
  max-width: 100% !important;
  height: 100%;
  overflow: auto;
  background-color: rgba(0,0,0,0.4);
  align-items: center;
  overflow: hidden;
}

/* Modal Content/Box */
.modal-content {
  background-color: #fff;
  margin: 10px auto;
  padding: 4%;
  border: 1px solid #888;
  width: 90%;
  max-width: 800px;
  position: relative;
  top:0;
  max-height: 95vh;
  overflow: auto;
}
.admin-bar .modal-content {
    margin-top: 50px;
}
@media (max-width: 500px){
  .modal-content {
    width: 100%;
  }
}

/* The Close Button */
.close-button {
  font-family: auto;
  color: #555;
  background: #e8e8e8;
  font-size: 33px;
  border-radius: 1em;
  text-align: center;
  line-height: 1em;
  position: absolute;
  width: 1em;
  height: 1em;
  top: 8px;
  right: 8px;
}

.close-button:hover,
.close-button:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

a[data-open]{
  cursor: pointer;
}

/* Tooltip container */
.tooltip {
  position: relative;
  display: inline-block;
}

/* Tooltip text */
.tooltip .tooltiptext {
  visibility: hidden;
  opacity: 0;
  white-space: nowrap;
  background-color: black;
  color: #fff;
  text-align: center;
  padding: 5px 10px;
  border-radius: 6px;
  right: 0;
  bottom: -30px;
  font-size: 0.95em;

  /* Position the tooltip text - see examples below! */
  position: absolute;
  z-index: 1;
  transition: opacity 1s;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}

/* TABS */
.tabs{
	padding: 20px;
	margin-top: 30px;
}

.tab-link {
	background-color: inherit;
	border: none;
	outline: none;
	cursor: pointer;
	border-radius: 5px 5px 0 0;
	padding: 14px 16px;
	margin-right: 10px;
	transition: 0.3s;
	background: #ddd;
}

.tab-link:hover {
	background-color: #e9e9e9;
}

.tab-link.active {
	background-color: #fff;
}

.tab-content {
	display: none;
	padding: 6px 12px;
}
.tab-content.active {
	display: block;
	background: #fff;
}

/* /Modal */

/* Forms */

form{
  max-width: 500px;
  margin: 50px auto;
  accent-color: var(--primary);
}
button, .button{
    cursor: pointer;
    outline: none;
    border: 0;
    background: transparent;
    display: inline-block;
}

textarea { overflow: auto; }
input, textarea{
    padding:0.3em 0.8em;
    font:inherit;
    color: var(--black);
    /*letter-spacing: 0.02em;*/
    border:0;
    border:1px solid rgba(140,140,140,.5);
    background: #fff;
    border-radius: 5px;
    width: 100%;
}
textarea:focus,
input:focus{
    outline: none;
}

::placeholder {
  color: var(--black);
  opacity: 1; /* Firefox */
}
::-ms-input-placeholder {
  color: var(--black);
}

label{
  margin-bottom: 0.3em;
  display: inline-block;
}

/* FORMIDABLE FORMS */
/* .frm_forms input*/

.frm_submit{
  margin-top: 1em;
  text-align: center;
}

.frm_forms input[type=text], .frm_forms input[type=number], .frm_forms input[type=email], .frm_forms input[type=tel], .frm_forms input[type=url], .frm_forms select, .frm_forms textarea {
    display: inline-block;
    margin-bottom: 12px;
}

.frm_forms .frm_required{
    display: inline-block;
    width: 10px;
    margin-top: -5px;
    color: #C70501 !important;
    font-weight: inherit !important;
    vertical-align: text-bottom;
}

fieldset{
  border: 0;
}

.frm_blank_field input, .frm_blank_field textarea, .frm_blank_field select{
  border: 1px solid rgba(254, 85, 82, .8) !important;
}
.frm_error, .frm_error_style, .frm_message {
  color: #C70501;
  text-align: center;
}
.frm_error_style, .frm_message {
  background-color: #ffffff;
  border: 1px solid #ea6262;
  border-radius: 0;
  font-size: inherit;
  margin: 0;
  margin-bottom: 20px;
  padding: 20px;
}
.frm_message{
  border: 1px solid var(--primary);
  color: var(--primary);
  font-size: 1.2em;
}
form input[type=text].frm_verify {
    display: none !important;
}
.frm_inside_container label{
  display: none;
}
.frm_field_checkbox_container{
  margin-top: 0.5em;
}
.form-field.bigger{
  font-size: 1.2em;
  margin-bottom: 1em;
}


button.frm_button_submit.frm_final_submit.wp-block-button__link {
  background: none;
  color: var(--white);
  transition: 0.3s ease;
  box-shadow: 0px 0px 0px 2px #fff;
}

button.frm_button_submit.frm_final_submit.wp-block-button__link:hover {
  background: var(--white);
  transition: 0.3s ease;
  color: var(--primary);
}


/* GRAVITY FORMS */
#content .gform_wrapper ul li::before{
    display: none;
}
#content .gform_wrapper ul li,
.gform_wrapper form ul li {
    margin-top: 0em;
    margin-bottom: 0.9em;
    padding-right: 0;
}
.gform_wrapper form input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]){
    padding: 0.5em 0.8em;
}
.gform_wrapper form .gform_fields{
  grid-column-gap: 5%;
}
.gform_wrapper form .gfield{
  margin-bottom: 0;
}
.gform_wrapper form .top_label label.gfield_label{
  font-weight: 400;
  display: none; /* label placeholderina */
  display: block;
  margin-bottom: 0.2em;
}
input[type=checkbox],
.gform_wrapper form input[type=checkbox] {
  width: 1.1em;
  height: 1.1em;
  margin: 0.08em 0.5em 0 0;
  vertical-align: text-top;
  appearance: none;
  padding: 0;
}
input[type=checkbox]:checked,
.gform_wrapper form input[type=checkbox]:checked {
  appearance: auto;
}
.gform_wrapper form li.gfield.gfield_error,
.validation_error{
  background-color: rgba(255,223,224,.5);
}
.gform_wrapper .gform_confirmation_message{
    padding: 20px;
    border: 2px solid var(--secondary);
}
.gform_footer{
  text-align: center;
}
.gform_footer .wp-block-button .wp-block-button__link{
  margin-top: 0;
}
.gform_wrapper form ul.gform_fields li.gfield{
  padding-right: 0;
}
.gform_wrapper form h3.gform_title{
  font-size: 1.5em;
  color: inherit;
}
.gform_wrapper .gfield_consent_label{
  font-size: 0.9em;
}

/* Search */

.search-form {
  margin-bottom: 40px;
}
.search-form input::placeholder {
  color: var(--grey);
  font-weight: 400;
}
.search-form input::-ms-input-placeholder {
  color: var(--grey);
  font-weight: 400;
}

.search-form .screen-reader-text{
    display: none;
}
.search-form{
    display: flex;
    position: relative;
    --height: 38px;
    width: 330px;
    max-width: 80vw;
    border: 2px solid var(--secondary);
    border-radius: 20px;
    background: #fff;
}
.search-form label{
    flex-grow: 1;
}
.search-form input{
    width: 100%;
    background: transparent;
    padding:3px 15px;
    border: 0;
    height: var(--height);
    line-height: var(--height);
    transition: all .3s;
}
.search-form button{
    height: 38px;
    height: var(--height);
    background: transparent;
    padding: 7px 12px;
    position: relative;
    z-index: 2;
    transition: all .3s;
}
.search-form button svg{
  height: 100%;
}
.search-form button path{
    fill: var(--secondary);
}
.search-form button:hover path{
    fill: var(--primary);
}

/* Range inputs (sliders) */

.frm_field_range_container{
  text-align: right;
}

.with_frm_style .frm_top_container.frm_field_range_container label.frm_primary_label{
  float: left;
  margin-top: 12px;
}

#content input[type="range"] {
  -webkit-appearance: none;
  margin-right: 15px;
  /* width: 200px; */
  height: 12px;
  --thumb-size: 26px;
  --thumb-color: #fff;
  background: #ccc !important;
  border-radius: 10px;
  background-image: linear-gradient(var(--secondary), var(--secondary)) !important;
  background-size: 0% 100% !important;
  background-repeat: no-repeat !important;
}

/* Input Thumb */
#content input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  height: var(--thumb-size);
  width: var(--thumb-size);
  margin-top: 0;
  border-radius: 50%;
  background: var(--thumb-color);
  cursor: ew-resize;
  box-shadow: 0 0 2px 0 #555;
  transition: background .3s ease-in-out;
}

#content input[type="range"]::-moz-range-thumb {
  -webkit-appearance: none;
  height: var(--thumb-size);
  width: var(--thumb-size);
  margin-top: 0;
  border-radius: 50%;
  background: var(--thumb-color);
  cursor: ew-resize;
  box-shadow: 0 0 2px 0 #555;
  transition: background .3s ease-in-out;
}

#content input[type="range"]::-ms-thumb {
  -webkit-appearance: none;
  height: var(--thumb-size);
  width: var(--thumb-size);
  margin-top: 0;
  border-radius: 50%;
  background: var(--thumb-color);
  cursor: ew-resize;
  box-shadow: 0 0 2px 0 #555;
  transition: background .3s ease-in-out;
}


/* Input Track */
#content input[type=range]::-webkit-slider-runnable-track  {
  -webkit-appearance: none;
  height: auto;
  box-shadow: none;
  border: none;
  background: transparent;
}

#content input[type=range]::-moz-range-track {
  -webkit-appearance: none;
  height: auto;
  box-shadow: none;
  border: none;
  background: transparent;
}

#content input[type="range"]::-ms-track {
  -webkit-appearance: none;
  height: auto;
  box-shadow: none;
  border: none;
  background: transparent;
}


/* /Forms */

/* Footer */

#footer{
    position: relative;
}

#footer, #footer p, #footer a, #footer h4{
    /*color: #fff;*/
}


#footer ul li{
  margin-bottom: 0.5em;
  line-height: 1.5;
}

#footer .wp-block-buttons{
  margin-top: 1em;
}

#footer .wp-block-columns .wp-block-columns .wp-block-column{
  padding-top: 0;
}
#footer .wp-block-columns{
  justify-content: space-between;
}

#copy{
  padding: 20px 0;
}

#copy > p,
#copy > div > p,
#copy .wp-block-column{
  opacity: 0.75;
}

#copy .wp-block-column{
  padding-top: 0;
  padding-bottom: 0;
}

@media (max-width: 840px) {
  #footer #copy .wp-block-column{
    flex-basis: auto !important;
    min-width: 0;
    flex-grow: 1;
    margin-left: 0;
  }
  #copy .has-text-align-center{
    text-align: center;
  }
  #footer #copy .wp-block-column.empty-column{
    min-width: 0;
  }
}

/* wp muokkaa-nappi */
span.muokkaa{
    text-align:right;
    position: absolute;
    right: 1%;
    margin-top: -30px !important;
    z-index: 999;
}
span.muokkaa a{
    text-decoration:none !important;
    background:none !important;
}
span.muokkaa a:after{
    display:none;
}
span.muokkaa a:before{
    content: '\f464' !important;
    font: 400 22px/24px dashicons;
    background: #cfcfcf;
    color:#000;
    border-radius:24px;
    -moz-border-radius:24px;
    -webkit-border-radius:24px;
}
span.muokkaa a:hover:before{
    background:var(--primary);
    color:#fff;
}

/* GDPR plugari */

.gdpr.gdpr-privacy-bar .gdpr-wrapper .gdpr-content a {
    color: #fff !important;
    text-decoration: underline;
}
.gdpr.gdpr-privacy-bar .gdpr-wrapper .gdpr-content a:hover {
    text-decoration: none;
}

/* /Footer */
/* Theme spesific details */

/* h1, h2:not(.tilaa-tasta) {
    box-shadow: 0 0 0 1px var(--secondary), 0 0 0 6px var(--primary), 0 0 0 8px var(--secondary);
    text-align: center;
    padding: 0.1em;

} */

/* .korostettu {
    box-shadow: 0 0 0 1px var(--secondary), 0 0 0 6px var(--primary), 0 0 0 8px var(--white);
    text-align: center;
    padding: 0.1em;
} */

.ruokalista .wp-block-columns.block-columns-3 {
    margin-bottom: 1.2em;
}


/* .ruokalista h2 {
    box-shadow: 0 0 0 1px var(--secondary), 0 0 0 6px var(--primary), 0 0 0 8px var(--secondary);
    text-align: center;
    padding: 0.2em 1.5em;
    width: 100%;
    text-transform: uppercase;
    margin-bottom: 1.5em;
    margin-top: 1.5em;
    margin-left: 0.3em;
    font-size: 1.4em;
} */



/* .ruokalista .korostettu {
    box-shadow: 0 0 0 1px var(--secondary), 0 0 0 6px var(--primary), 0 0 0 8px var(--white);
    text-align: center;
    padding: 0.1em;
    margin-top: 1.5em;
    margin-left: 0.4em;
    padding: 0.5em;
} */


.ruokalista h3 {
    font-size: 1.4em;
    text-transform: uppercase;
}

.juomat h3 {
    margin-top: 0;
}



.ruokalista p {
    font-size: min(0.9em, 15px);
    font-weight: 300;
}

.suositukset h3 {
    font-size: 1.5em;
}

.suositukset p {
    font-size: 0.9em;
}

.juomat .wp-block-column {
    padding-bottom: 0!important;
}


#tapahtumat strong {
    color: var(--secondary);
}

.some .wp-block-group {
    gap: 1.5em;
}

#content .ruokalista ul li {
    font-size: 0.7em;
    text-align: left;
    margin-left: 0;
    width: 50%;
}

#content .ruokalista ul {
    text-align: left;
}

#tilaa img, .some img {
    transition: 0.3s ease;
}

#tilaa img:hover, .some img:hover {
    transform: scale(1.05);
}


.lounaslista h2 {
    font-size: clamp(min(1.7rem, 9vw), 7.5vw, min(3em, 40px));
    width: fit-content;
    margin-inline: auto;
}


.animations { 
    animation: fadeIn 3s, spin 2s; 
}

@keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
    
  }

  @keyframes spin {
    from {
        transform:rotate(0deg);
    }
    to {
        transform:rotate(360deg);
    }
}




@media(max-width: 1000px) {
    .ruokalista .wp-block-columns.block-columns-3 {
        gap: 0;
    }
}


@media(max-width: 500px) {
    .ruokalista .wp-block-columns.block-columns-9.columns-grid-3,
    .ruokalista .wp-block-columns.block-columns-9.block-columns-2,
    #content .wp-block-columns .wp-block-columns,
    .wp-block-columns.block-columns-2
     {
        gap: 0!important;
    }
    h2.pizzat {
        margin-top: 0;
    }
    #content .wp-block-column.siivet {
        padding-left: 0!important;
    }
    .lounaslista .wp-block-columns.block-columns-6.columns-grid-3 {
        gap: 0;
    }
}




/* /Theme spesific details */