@font-face {
  font-family: "calibre-r";
  src: url("/tiedostot/calibre-regular.woff2") format('woff2');
  font-weight:normal;
  font-display:swap;
}
@font-face {
  font-family: "calibre-r";
  src: url("/tiedostot/calibre-semibold.woff2") format('woff2');
  font-weight:500;
  font-display:swap;
}
@font-face {
  font-family: "calibre-r";
  src: url("/tiedostot/calibre-bold.woff2") format('woff2');
  font-weight:bold;
  font-display:swap;
}

@font-face {
  font-family: "roobert";
  src: url("/tiedostot/Roobert-Medium.woff2") format('woff2'), url("/tiedostot/Roobert-Medium.woff") format('woff');
  font-display:swap;
}

@font-face{
  font-family:"sampo-icons";
  src:url("/tiedostot/sampo-icons.ttf") format("truetype"),url("/tiedostot/sampo-icons.woff") format("woff");
  font-weight:normal;font-style:normal;font-display:block;
}
[class^=icon-],[class*=" icon-"]{font-family:"sampo-icons" !important;speak:never;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

.icon-external-link:before{content:"\e92a"}
.icon-arrow-right-tail:before{content:"\e919"}
.icon-language-select:before{content:"\e934"}


body {
    background-color: #f8f9fa;
    background-image: none;
    color: #111;
    font-family: "calibre-r", Arial, Helvetica, sans-serif;
    font-size: clamp(16px, 1.8vw, 20px); /* clamp(16px, 1.103vw, 20px) */
}
@media (min-width: 410px) {
    body { }
}
@media (min-width: 768px) {
  #pageheader {max-width: 720px; }
  main {
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  }
}
@media (min-width: 992px) {
  #pageheader {max-width: 960px; }
}
@media (min-width: 1200px) {
  #pageheader {max-width: 1140px; }
}
@media (min-width: 1400px) {
  #pageheader {max-width: 1320px; }
  main {
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175)
  }
@media (min-width: 1600px) {
  #pageheader {
        max-width: none; 
        border-left: 0 !important;
    }
    .container-fluid {
        padding-left: 1.75rem; 
        padding-right: 1.75rem; 
    }
}

#pageheader #lang { display: none; }

#pageheader {
    background-color: #1E416C;
    border-bottom: 4px solid #1E416C;
    border-bottom: 1px solid rgba(0,0,0,.11);
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    margin: auto;
}
#pageheader .nav-link {
    color: #fff;
    font-weight: 500;
}
#pageheader .nav-link:hover {
    color: #85bbf9;
}

#navbarMenu1_nav a {
  pointer-events: none;
  text-decoration: none;
  cursor: default;
}

header .navbar-nav .nav-link.active {
    color: #85bbf9;
    border-bottom: 1px solid #fff;
    font-weight: 500;
}

.avatar:after{content:"\e934"; font-family:"sampo-icons" !important;speak:never;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size: clamp(1.7rem, 3vw, 2.2rem);position: relative;top:.2rem;}
.avatar-head {display: none;}
.avatar-body {display: none;}
#kayttaja .navbar-toggler-title {visibility: hidden;}

h1, .h1  {
    color: #000;
    font-family:"roobert", Arial, Helvetica, sans-serif;
    font-size: clamp(32px, 4.7vw, 56px); /* 3.5rem */
    letter-spacing: -0.03em;
}
h2, h3 {
    font-family:"calibre-r", Arial, Helvetica, sans-serif;
    font-weight: 400;
}

.table thead th {
    border-bottom: 2px solid #000;
    color: #000;
    font-weight: 500;
}

.table .tfoot th, .table .tfoot td {
    border-top: 1px solid #000;
    font-weight: 500;
}

a {
    color: #1c72d4;
    font-weight: 500;
    letter-spacing: .2px;
}
#pageheader .dropdown-menu .nav-link {
    color: #1c72d4;
    font-weight: 400;
}

/* Rivivälin säätö */
.nav-link {
    letter-spacing: .5px;
}

 /* Muuttaa alleviivauksen värin siniseksi */
.nav-link,
.nav-link.active,
.nav-link:hover,
.nav-link:focus,
.nav-link:visited {
    color: #fff;
    text-decoration: none !important;
    border-bottom: none !important;
    /* text-decoration-color: #2d8f2e !important; */
}


header .navbar-nav .nav-link.active {
    color: #1c72d4;
    font-weight: 500;
}

.form-control {
    font-size: clamp(16px, 1.8vw, 20px); /* clamp(16px, 1.103vw, 20px) */
}

.btn {
  font-family: "calibre-r",Arial,Helvetica,sans-serif;
  padding: .74rem 1.2rem .74rem !important;
  text-transform: uppercase;
  text-align: left;
  letter-spacing: .077em;
  transition: all .3s linear;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
  font-size: .8rem;
  /* font-size: clamp(15px, 1.103vw, 20px); */
  font-weight: 500;
  line-height: 1; /*1.4 */
  border-radius: 3px;
}
.btn-primary {
  color: #fff;
  border-color: #000;
  background: linear-gradient(258deg, #222836 0%, #1C3E69 100%);
}
.btn-primary:hover {
  border-color: #222836;
  color: #fff;
  opacity: 0.8;
}
.btn-outline-primary {
  color: #1c72d4;
  border-color: #1c72d4;
  background-color: #fff;
}
.btn-outline-primary:hover {
  background: #f7fafd;
  border-color: #222836;
  color: #000;
}

.btn-danger:hover, .btn-outline-danger:hover {
  background: #f8d7da;
  color: #000;
}
.btn-secondary:hover, .btn-outline-secondary:hover {
  background: #e9ecef;
  color: #000;
}

.btn-primary::after {
    content: "\e919";
   display: inline-block;
   padding-left: 0.8em;
font-family:"sampo-icons" !important;speak:never;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale
}
a[rel=noopener]:after{content:"\e92a"; font-family:"sampo-icons" !important;speak:never;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;padding-left: 0.5em;text-decoration: underline #fff;}
a.ext-telia:after{content:"\e92a"; font-family:"sampo-icons" !important;speak:never;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;padding-left: 0.5em;text-decoration: underline #fff;}
.suomifi-valtuudet a.btn-primary:after{content:"\e92a"; font-family:"sampo-icons" !important;speak:never;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;padding-left: 0.8em;font-size:15px;}
a.suomifi-valtuudet:after{content:"\e92a"; font-family:"sampo-icons" !important;speak:never;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;padding-left: 0.8em;text-decoration: underline #fff;}

.alert-info, .alert-success, .alert-warning {
  background: #d9e3ee;
  border-color: #222836;
  color: #000;
}

.kuvaEtusivu {display:none}

.form-control-file[type=file] {
  font-size: .875rem;
  margin-bottom: 5px;
}
.form-control-file[type=file]::file-selector-button {
    background: #fff;
    border: 1px solid #1c72d4;
    color: #1c72d4;
    cursor: pointer;
  font-family: "calibre-r",Arial,Helvetica,sans-serif;
  padding: .74rem 1.2rem .74rem !important;
  text-transform: uppercase;
  letter-spacing: .077em;
  transition: all .3s linear;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
  font-size: .8rem;
  /* font-size: clamp(15px, 1.103vw, 20px); */
  font-weight: 500;
  line-height: 1; /*1.4 */
  border-radius: 3px;
}
.form-control-file[type=file]::file-selector-button:hover {
  background: #f7fafd;
  border-color: #222836;
  color: #000;
}
.proxy-select { padding-bottom: .4em;}