/*
 * SIVUSTON HELPOT PÄÄASETUKSET
 *
 * Tavalliset ulkoasumuutokset tehdään tästä tiedostosta. Vanha style.css on
 * jätetty taustalle yhteensopivuuden vuoksi, eikä sitä tarvitse normaalisti
 * enää muokata.
 */
:root {
  --site-max-width: 1200px;
  --site-menu-color: #c6bfab;
  --site-footer-color: #080612;
  --site-text-color: #111;
  --site-muted-text-color: #666;
  --site-body-font: Poppins, sans-serif;
  --site-heading-font: Montserrat, sans-serif;
  --site-body-font-size: 1em;
  --site-content-font-size: 1.2em;
  --site-content-line-height: 1.3em;
  --site-heading-size: 2.4em;
  --news-max-width: 1200px;
  --news-gap: 20px;
}

body {
  background: var(--site-footer-color);
  color: var(--site-text-color);
  font-family: var(--site-body-font);
  font-size: var(--site-body-font-size);
}

.content-wrapper4,
.container,
.columnmenu,
.column-content-1-1,
.column-content-1,
.column-content-1 .c-span {
  background-color: var(--site-menu-color);
}

.content-wrapper5,
.columnmenu,
.content-wrapper {
  max-width: var(--site-max-width);
}

.yleistxt {
  color: var(--site-text-color);
  font-family: var(--site-body-font);
  font-size: var(--site-content-font-size);
  line-height: var(--site-content-line-height);
}

h1 {
  color: var(--site-text-color);
  font-family: var(--site-heading-font);
  font-size: var(--site-heading-size);
}

.news-card + .news-card {
  margin-top: var(--news-gap);
}

.news-card,
.news-card img,
.news-card__media {
  max-width: var(--news-max-width);
}

.page-info .maincnt a,
.page-info .cnt2 a,
.page-info .cnt3 a,
.page-info .cnt4 a,
.page-info .cnt5 a {
  color: inherit;
  text-decoration: none;
}

/* Liukuvalikko mahtuu myös 320 px leveään puhelimeen. */
.column-content-1 .slidea {
  width: min(400px, calc(100vw + 5px));
}

/* Alatunnisteen kello ei pakota kapeaa sivua 350 px leveäksi. */
#clock {
  width: min(350px, 100%);
}

/* Toistuva välikappale on luokka, ei sivulla moneen kertaan käytetty tunniste. */
.viiva2 {
  line-height: 40px;
  border-bottom: 3px solid transparent;
  margin: 5px 0;
  padding: 0;
}

.page-info .yleistxt,
.page-info h1,
.page-info h2,
.page-info li {
  overflow-wrap: anywhere;
}

@media screen and (max-width: 768px) {
  .slidshow {
    overflow: hidden;
  }

  .slidshow-image,
  .cnt3-cont,
  .cnt4-cont,
  .content-box,
  .infoteksti {
    max-width: 100%;
  }
}

@media screen and (max-width: 600px) {
  .yhteystieto img.hidden,
  .yhteystieto2 img.hidden {
    position: static;
    display: block;
    margin-top: 10px;
  }
}

/* Mobiiliraja on 800 px uutisissa ja 768 px sivun pääpalstoissa. */