/**
 * White compact & high contrast reveal.js theme, with headers not in capitals.
 *
 * By Peter Kehl. Based on white.(s)css by Hakim El Hattab, http://hakim.se
 *
 * - Keep the source similar to black.css - for easy comparison.
 * - $mainFontSize controls code blocks, too (although under some ratio).
 */
@import url(./fonts/source-sans-pro/source-sans-pro.css);
section.has-dark-background, section.has-dark-background h1, section.has-dark-background h2, section.has-dark-background h3, section.has-dark-background h4, section.has-dark-background h5, section.has-dark-background h6 {
  color: #fff;
}

/*********************************************
 * GLOBAL STYLES
 *********************************************/
:root {
  --r-background-color: #fff;
  /*
  --r-main-font: Source Sans Pro, Helvetica, sans-serif;
  */
  --r-main-font: 'Raleway',sans-serif;
  --r-main-font-size: 16px;
  --r-main-color: #000;
  --r-block-margin: 20px;
  --r-heading-margin: 0 0 20px 0;
  /*
  --r-heading-font: Source Sans Pro, Helvetica, sans-serif;
  */
  --r-heading-font: 'Raleway',sans-serif;
  --r-heading-color: #000;
  --r-heading-line-height: 1.2;
  --r-heading-letter-spacing: normal;
  /*--r-heading-text-transform: uppercase;*/
    --r-heading-text-transform: none;
  --r-heading-text-shadow: none;
  --r-heading-font-weight: 500;
  --r-heading1-text-shadow: none;
  --r-heading1-size: 2.5em;
  --r-heading2-size: 1.6em;
  --r-heading3-size: 1.3em;
  --r-heading4-size: 18px;
  --r-code-font: monospace;
  --r-link-color: #2a76dd;
  --r-link-color-dark: rgb(30.7720647773, 99.5566801619, 192.7779352227);
  --r-link-color-hover: rgb(73.95, 138.55, 226.1);
  --r-selection-background-color: rgb(95.25, 152.25, 229.5);
  --r-selection-color: #fff;
  --r-overlay-element-bg-color: 0, 0, 0;
  --r-overlay-element-fg-color: 240, 240, 240;
	
  --form-control-color: #275A90;
  --form-control-disabled: #959495;
}

.reveal-viewport {
  background: #fff;
  background-color: var(--r-background-color);
}

.reveal {
  font-family: var(--r-main-font);
  font-size: var(--r-main-font-size);
  font-weight: normal;
  color: var(--r-main-color);
}

.reveal ::selection {
  color: var(--r-selection-color);
  background: var(--r-selection-background-color);
  text-shadow: none;
}

.reveal ::-moz-selection {
  color: var(--r-selection-color);
  background: var(--r-selection-background-color);
  text-shadow: none;
}

.reveal .slides section,
.reveal .slides section > section {
  line-height: 1.3;
  font-weight: inherit;
}

/*********************************************
 * HEADERS
 *********************************************/
.reveal h1,
.reveal h2,
.reveal h3,
.reveal h4,
.reveal h5,
.reveal h6 {
  margin: var(--r-heading-margin);
  color: var(--r-heading-color);
  font-family: var(--r-heading-font);
  font-weight: var(--r-heading-font-weight);
  line-height: var(--r-heading-line-height);
  letter-spacing: var(--r-heading-letter-spacing);
  text-transform: var(--r-heading-text-transform);
  text-shadow: var(--r-heading-text-shadow);
  word-wrap: break-word;
}

.reveal h1 {
  font-size: var(--r-heading1-size);
}

.reveal h2 {
  font-size: var(--r-heading2-size);
}

.reveal h3 {
  font-size: var(--r-heading3-size);
}

.reveal h4 {
  font-size: var(--r-heading4-size);
}

.reveal h1 {
  text-shadow: var(--r-heading1-text-shadow);
}

/*********************************************
 * OTHER
 *********************************************/
.reveal p {
	font-size: 14px;
	line-height: 1.3;
  	margin: var(--r-block-margin) 0;
	
}
.reveal .larger-font p{
	font-size: 18px;
}
/* Remove trailing margins after titles */
.reveal h1:last-child,
.reveal h2:last-child,
.reveal h3:last-child,
.reveal h4:last-child,
.reveal h5:last-child,
.reveal h6:last-child {
  margin-bottom: 0;
}

/* Ensure certain elements are never larger than the slide itself */
.reveal img,
.reveal video,
.reveal iframe {
  max-width: 95%;
  max-height: 95%;
}

.reveal strong,
.reveal b {
  font-weight: 500;
}

.reveal em {
  font-style: italic;
}

.reveal ol,
.reveal dl,
.reveal ul {
  display: inline-block;
  text-align: left;
  margin: 0 0 0 1em;
}

.reveal ol {
  list-style-type: decimal;
}

.reveal ul {
  list-style-type: disc;
}

.reveal ul ul {
  list-style-type: square;
}

.reveal ul ul ul {
  list-style-type: circle;
}

.reveal ul ul,
.reveal ul ol,
.reveal ol ol,
.reveal ol ul {
  display: block;
  margin-left: 40px;
}

.reveal dt {
  font-weight: bold;
}

.reveal dd {
  margin-left: 40px;
}

.reveal blockquote {
  display: block;
  position: relative;
  width: 70%;
  margin: var(--r-block-margin) auto;
  padding: 5px;
  font-style: italic;
  background: rgba(255, 255, 255, 0.05);
  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
}

.reveal blockquote p:first-child,
.reveal blockquote p:last-child {
  display: inline-block;
}

.reveal q {
  font-style: italic;
}

.reveal pre {
  display: block;
  position: relative;
  width: 90%;
  margin: var(--r-block-margin) auto;
  text-align: left;
  font-size: 0.55em;
  font-family: var(--r-code-font);
  line-height: 1.2em;
  word-wrap: break-word;
  box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.15);
}

.reveal code {
  font-family: var(--r-code-font);
  text-transform: none;
  tab-size: 2;
}

.reveal pre code {
  display: block;
  padding: 5px;
  overflow: auto;
  max-height: 400px;
  word-wrap: normal;
}

.reveal .code-wrapper {
  white-space: normal;
}

.reveal .code-wrapper code {
  white-space: pre;
}

.reveal table {
  margin: auto;
  border-collapse: collapse;
  border-spacing: 0;
}

.reveal table th {
  font-weight: bold;
}

.reveal table th,
.reveal table td {
  text-align: left;
  padding: 0.2em 0.5em 0.2em 0.5em;
  border-bottom: 1px solid;
}

.reveal table th[align=center],
.reveal table td[align=center] {
  text-align: center;
}

.reveal table th[align=right],
.reveal table td[align=right] {
  text-align: right;
}

.reveal table tbody tr:last-child th,
.reveal table tbody tr:last-child td {
  border-bottom: none;
}

.reveal sup {
  vertical-align: super;
  font-size: smaller;
}

.reveal sub {
  vertical-align: sub;
  font-size: smaller;
}

.reveal small {
  display: inline-block;
  font-size: 0.6em;
  line-height: 1.2em;
  vertical-align: top;
}

.reveal small * {
  vertical-align: top;
}

/*.reveal img {
  margin: var(--r-block-margin) 0;
}*/

/*********************************************
 * LINKS
 *********************************************/
.reveal a, a {
  color: var(--r-link-color);
  text-decoration: none;
  transition: color 0.15s ease;
}
.reveal a, a, .reveal button, button {
	cursor: pointer;
}
button:disabled{
	cursor: auto;
}
.reveal a:hover {
  color: var(--r-link-color-hover);
  text-decoration: underline;
  text-shadow: none;
  border: none;
}

.reveal .roll span:after {
  color: #fff;
  background: var(--r-link-color-dark);
}

/*********************************************
 * Frame helper
 *********************************************/
.reveal .r-frame {
  border: 4px solid var(--r-main-color);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
}

.reveal a .r-frame {
  transition: all 0.15s linear;
}

.reveal a:hover .r-frame {
  border-color: var(--r-link-color);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.55);
}

/*********************************************
 * NAVIGATION CONTROLS
 *********************************************/
.reveal .controls {
  color: var(--r-link-color);
}

/*********************************************
 * PROGRESS BAR
 *********************************************/
.reveal .progress {
  background: rgba(0, 0, 0, 0.2);
  color: var(--r-link-color);
}

/*********************************************
 * PRINT BACKGROUND
 *********************************************/
@media print {
  .backgrounds {
    background-color: var(--r-background-color);
  }
}

/* Vilso komponentit */
body.vilso{
	font-family: 'Raleway',sans-serif;
	height: 100vh;
	width: 100vw;
}


body.vilso .font-basic-sans{
	font-family: sans-serif;
	font-size: 0.9em;
}
body.vilso .slides{
	height: 100vh;
	width: 100vw;
	min-width: 100vw;
	min-height: 100vh !important;
	transform: translate(-50%, -50%) scale(1)!important;
}

.lighter-blue-bg, .lighter-blue-bg.reveal-viewport{
background-color:#f0f9ff;
}

body.vilso .reveal.center, body.vilso .reveal.center .slides, body.vilso .reveal.center .slides section {
width: 100vw!important;
height: 100vh!important;
	min-height: 100vh!important;
}
body.vilso .reveal.center .slides section{
	top: 0!important;
	overflow: scroll;
}



.ylapalkki{
	padding: 17px 16px;
	opacity:0;
}
.floating-bar.ylapalkki{
left: 0;
opacity:1;
/*padding: 16px 16px 16px 10px;*/
padding: 16px 16px 0px 10px;
position: absolute;
top: 0;
width: calc(100vw - 32px);
z-index: 1000;
}
.ylapalkki .org-nimi{
	float: left;
}
.ylapalkki-ohjeet{
	margin-top: 5px;
margin-right: 5px;
float: right;
}

.ylapalkki-maakuntadata{
float: right; margin-left: 5px; margin-right: 5px;
}
.info-btn{width: 25px; height: auto;}
.ylapalkki.darker-blue{
background-color:#275a90;
}
.ylapalkki.lighter-blue{
background-color:#f0f9ff;
}
.ylapalkki.white{
background-color:#ffffff;	
}

.ylapalkki h1{
	font-size: 36px;
	font-weight: 400;
}
.ylapalkki h2{
	font-size: 22px;
	font-weight: 500;
	margin-bottom: 5px;
	padding-left: 20px;
	text-align: left;

}
.ylapalkki h3{
	font-size: 18px;
	font-weight: 400;
	padding-left: 20px;
	text-align: left;

}
.ylapalkki.darker-blue h1, .ylapalkki.darker-blue h2{
	color:#ffffff;
}
.ylapalkki.white h1, .ylapalkki.white h2{
	color: #707070;
	margin-bottom: 0;
}
img.org-nimi-img{
height:auto;
width: 124px;
margin-bottom: 6px;
margin-top: -8px;
}

.content-area{
	max-width: 970px;
	margin-left: auto;
	margin-right: auto;
	/*padding-top: 20px;*/
	padding-top: 68px;
	position: relative;
}
.content-area.with-sidebox{
	max-width: 970px;
	margin-left: auto;
	margin-right: auto;
	/*padding-top: 20px;*/
	/*padding-top: 50px;*/
	padding-top: 68px;
	position: relative;
}
.content-area.with-sidebox .content-box {
/*	
	margin-left: 30px;
	max-width: 680px;*/
	border-radius: 20px;
    margin-left: 0px;
    margin-right: none;
    max-width: 620px;
}
.content-area h2{
	font-size: 30px;
	margin: 15px 30px;
	font-weight: 400;
}
.content-area .narrow-col{
	color: #707070;
	font: normal normal normal 18px/1.3em Raleway;
	letter-spacing: 0px;
	margin-left: auto;
	margin-right: auto;
	max-width: 600px;
	text-align: left;
	width: 100%;

}

.c-dark-blue{
	color: #275A90!important;
}
.ikonirivi{
	text-align: center;
}
.icon-img, .reveal img.icon-img{
	display: inline-block;
	max-width: 95px;
	width: 100%;
}
.ikonirivi .icon-img{
margin: 5px 5px;
}
.text-right{
	text-align: right;
}
.text-center{
	text-align: center;
}
.text-smaller{
	font-size: 90%;
}
label{
	 -webkit-user-select: none;
    user-select: none;
}
.lbl-tocb{
	position: relative;
	padding-left: 0px;
	vertical-align: text-top;
}
.lbl-tocb input[type="checkbox"]{
position: absolute;
left: -10px;
top: 0px;
}
.lbl-tocb span{
padding-left: 20px;
display: inline-block;
}
.maxw500{
	max-width: 500px;
}
.d-none{
	display: none;
}
.d-block{
	display: block;
}
.ml-auto{
	margin-left: auto;
}
.mr-auto{
	margin-right: auto;
}


.select2-container{
	font-size: 14px;
}
.select2.select2-container{
	min-width: 350px;
	max-width: 350px;
	width: 100%;
}
.select2-container .select2-selection--single {
	height: 34px;
	padding-left: 10px;
	padding-right: 10px;
}
.select2-dropdown, .select2-results__options, .select2-results__option  {
	font-size: 14px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
	top: 2px;
	right: 6px;
}
.select2-container--open .select2-dropdown {
left: 0;
max-width: 350px;
min-width: 350px;
}
.select2-container--default.select2-container--disabled .select2-selection--single {
background-color: #b6b6b6;
cursor: default;
opacity: 0.6;
}
.content-box{
	border-radius: 20px;
	box-shadow: 0 0 3px rgba(0,0,0,0.5);
	margin-left: auto;
	margin-right: auto;
	max-width: 680px;
	padding-bottom: 20px;
	width:100%;
}
.content-box.content-box-white-bg{
	background-color: #fff;
}
.content-box.no-brd{
	box-shadow: none;
	border:0;
}
.content-box h2{
	padding-top: 20px;
}
.content-box-header-area{
	border-radius: 20px 20px 0px 0px;
padding-bottom: 5px;
padding-top: 10px;
	text-align: left;
}
.content-box-header-area.text-center{
	text-align: center;
}
.content-box-header-area.darker-blue{
	background-color:#275a90;
}
.content-box-header-area.light-blue, .content-box-header-area.pohjavesi-col{
	background-color:#A3DAFF;
}

/* 
Kuivuus → #F7E2B2
Rankkasateet → #D1B8FF
Lämpötila → #FFD1C6
*/

.content-box-header-area.kuivuus-bg{
}
.content-box-header-area.kuivuus-bg {
/* background-color: #F7E2B2; */
background-color: #275a90;
}
/* tämä vaihdettu nykytilan väriksi 
.content-box-header-area.kuivuus-bg {*/
.content-box-header-area.nykytila-bg {
/*background-color: #F7E2B2;*/
background-color: #275a90;
}
/* tämä vaihdettu nykytilan väriksi 
.content-box-header-area.kuivuus-bg:after{ */
.content-box-header-area.nykytila-bg:after{ 
	background-color: #F7E2B2;
    content: '';
    display:block;
   height: 20px;
    margin-bottom: -5px;
    width: 100%;
   
}

.content-box-header-area.tulvat-bg {
background-color: #275a90;
}
/* .content-box-header-area.tulvat-bg:after{  */
.content-box-header-area.varautuminen-bg:after{ 
	background-color: #D1B8FF;
    content: '';
    display:block;
    height: 20px;
    margin-bottom: -5px;
    width: 100%;
   
}
.content-box-header-area.lampotila-bg {
background-color: #275a90;
}

/* .content-box-header-area.lampotila-bg:after{  */
.content-box-header-area.tulevaisuus-bg:after{ 
	background-color: #FFD1C6;
    content: '';
    display:block;
   height: 20px;
    margin-bottom: -5px;
    width: 100%;
   
}

.content-box-header-area.darker-blue h2{
	color:#ffffff;
	font-weight: 500;
}
.content-box-header-area p{
    margin-bottom: 0;
}
.content-box-header-area .icon-img,  .reveal .content-box-header-area img.icon-img{
	max-width: 65px;
}
.content-box-header-area p+h2{
    padding-top: 0;
    margin-top: 0;
    padding-bottom: 20px;

}
.iconbg-row{
min-height: 74px;
padding-bottom: 5px;
padding-left: 88px;
padding-top: 15px;
margin-top: -10px;
}

.iconbg-row.iconbg-pohjavesi{
	background-image:url("../../img/Vilso_Ikoni_Pohjavesi.svg");
background-position: 18px 7px;
background-repeat: no-repeat;
overflow: visible;
background-size: 58px;
min-height: 74px;
box-sizing: border-box;
	
}
.iconbg-row.iconbg-pintavesi{
	background-image:url("../../img/Vilso_Ikoni_Pintavesi.svg");
background-position: 18px 7px;
background-repeat: no-repeat;
overflow: visible;
background-size: 58px;
min-height: 74px;
box-sizing: border-box;
	
}
.iconbg-row.iconbg-talousvesi{
	background-image:url("../../img/Vilso_Ikoni_Talousvesi.svg");
background-position: 18px 7px;
background-repeat: no-repeat;
overflow: visible;
background-size: 58px;
min-height: 74px;
box-sizing: border-box;
	
}
.iconbg-row.iconbg-jatevesi{
	background-image:url("../../img/Vilso_Ikoni_Jatevesi.svg");
background-position: 18px 7px;
background-repeat: no-repeat;
overflow: visible;
background-size: 58px;
min-height: 74px;
box-sizing: border-box;
	
}

.iconbg-row.iconbg-kuivuus{
	background-image:url("../../img/Vilso_Ikoni_Kuivuus.svg");
background-position: 18px 7px;
background-repeat: no-repeat;
overflow: visible;
background-size: 43px;
	min-height: 54px;
box-sizing: border-box;
	
}
.iconbg-row.iconbg-tulvat{
	background-image:url("../../img/Vilso_Ikoni_Rankkasateet-tulvat.svg");
background-position: 18px 7px;
background-repeat: no-repeat;
overflow: visible;
background-size: 43px;
	min-height: 54px;
box-sizing: border-box;
}
.iconbg-row.iconbg-lampotila{
	background-image:url("../../img/Vilso_Ikoni_Lampotila-myrskyt-ukkoset.svg");
background-position: 18px 7px;
background-repeat: no-repeat;
overflow: visible;
background-size: 43px;
	min-height: 54px;
box-sizing: border-box;
}




.iconbg-row h3{
	color: #ffffff;
font-size: 20px;
font-weight: 600;
	margin-bottom: 0;
}
.iconbg-row p{
	color: #ffffff;
	font-size: 16px;
	margin-top: 0;

}
.content-box-inner-area{
	padding:20px 70px;
	text-align: left;
}
.content-box-inner-area h3, .content-box-inner-area h4{
	line-height: 1.4;
}
.content-box-inner-area h4{
	color:#707070;
}
.content-box-inner-area h4.kysymys {
color: #275A90;
font-weight: 400;
}
.content-box-inner-area ul{
	font-size: 14px;
}
.content-box-inner-area li{
	margin-bottom: 3px;
}


ul.themes-selection{
	list-style: none;
	padding-left: 0;
	width: 370px;
}
.themes-selection li{
	display: block;
	margin-bottom: 10px;
	margin-top: 5px;
}
.themes-selection li img{
	display: inline-block;
	height: auto;
	margin: 0;
	margin-right: 10px;
	vertical-align: middle;
	width: 60px;
}
.themes-selection label{
display: inline-block;
height: 100%;
vertical-align: middle;
width: 295px;
}
.themes-selection li input{
	float: left;
	margin-right: 8px;
	width: 18px;

} 

.btn.btn_aloita, .btn.btn_valintoihin, .btn-blue, .btn-white{
    background-color: #f0f9ff;
   	border: solid 2px #275A90;
	border-radius: 20px;
	color: #ffffff;
	font-size: 16px;
	margin-top: 2px;
	padding: 8px 25px;
}
.btn.btn_aloita{
	color: #275A90;
}
 .btn.btn_valintoihin, .btn.btn-blue{
	  background-color: #275A90;
}
 .btn.btn_valintoihin, .btn.btn-white{
	  color: #275A90;
	  background-color:#ffffff;
}
.btn.btn_aloita:hover,.btn.btn_aloita:active, .btn.btn_valintoihin:hover,.btn.btn_valintoihin:active{
	text-decoration: underline;
}
.btn.btn_aloita:disabled, .btn.btn_valintoihin:disabled{
	opacity: 0.6;
	text-decoration: none!important;
}

.btn.btn_empty{
	background-color: transparent;
   	border: solid 2px transparent;
	border-radius: 20px;
	color: #275A90;
	font-size: 16px;
	margin-top: 2px;
	padding: 8px 25px;
}
.btn.btn_edellinen{
	float: left;
	transform: translateX(-35px);
}
p.ed-sr-p{
	margin-top: 40px;
	margin-bottom: -10px;
	margin-left: -35px;
	margin-right: -35px;
}
.side-box{
box-sizing: border-box;
/*font-size: 0.9em;*/
	font-size: 12px;
padding: 15px 30px;
	padding-bottom: 40px;
/*width: 230px;*/
/*width: 310px;*/
width: 330px;
position: absolute;
/*top: 20px;*/
/*top: 50px;*/
top: 68px;
text-align: left;
right: 0px;
/* transform: translateX(100%); */

}
.side-box.side-box-white-bg{
	background-color: #ffffff;
	border-radius: 20px;
	box-shadow: 0 0 3px rgba(0,0,0,0.5);	
}

.side-box .emp-line{
display: block;
/*min-height: 1rem;*/
min-height: 0.25rem; 
}

/*.side-box p{
margin-bottom: 0.5rem;
}
.side-box p+div.side-content{
margin-top: -0.5rem;
}
*/
/* custom checkbox */
.form-control {
  /*  font-family: system-ui, sans-serif;
    font-size: 1rem;*/
    font-weight: 400;
    line-height: 1.1;
    display: grid;
    grid-template-columns: 1em auto;
    gap: 0.5em;
	
	font-family: Raleway, sans-serif;
	 font-size: 15px;
}

.form-control + .form-control {
  margin-top: 1em;
}

.form-control--disabled {
  color: var(--form-control-disabled);
  cursor: not-allowed;
}

input[type=checkbox] {
  /* Add if not using autoprefixer */
  -webkit-appearance: none;
  /* Remove most all native input styles */
  -moz-appearance: none;
       appearance: none;
  /* For iOS < 15 */
  background-color: #ffffff;
  /* Not removed via appearance */
  margin: 0;
  font: inherit;
  color: #275A90;
  width: 1.15em;
  height: 1.15em;
  border: 0.15em solid currentColor;
  border-radius: 0.15em;
  transform: translateY(-0.075em);
  display: grid;
  place-content: center;
}

input[type=checkbox]::before {
  content: "";
  width: 0.65em;
  height: 0.65em;
  -webkit-clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
          clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
  transform: scale(0);
  transform-origin: bottom left;
  transition: 120ms transform ease-in-out;
  box-shadow: inset 1em 1em var(--form-control-color);
  /* Windows High Contrast Mode */
  background-color: CanvasText;
}

input[type=checkbox]:checked::before {
  transform: scale(1);
}

input[type=checkbox]:focus {
  outline: max(2px, 0.15em) solid currentColor;
  outline-offset: max(2px, 0.15em);
}

input[type=checkbox]:disabled {
  color: var(--form-control-disabled);
  cursor: not-allowed;
}
/* custom checkbox end */
/* custom radio */
input[type="radio"] {
  /* Add if not using autoprefixer */
  -webkit-appearance: none;
  /* Remove most all native input styles */
  appearance: none;
  /* For iOS < 15 */
  background-color: #ffffff;
  /* Not removed via appearance */
  margin: 0;

  font: inherit;
  color: currentColor;
  width: 1.15em;
  height: 1.15em;
  border: 0.15em solid currentColor;
  border-radius: 50%;
  transform: translateY(-0.075em);

  display: grid;
  place-content: center;
}

input[type="radio"]::before {
  content: "";
  width: 0.65em;
  height: 0.65em;
  border-radius: 50%;
  transform: scale(0);
  transition: 120ms transform ease-in-out;
  box-shadow: inset 1em 1em var(--form-control-color);
  /* Windows High Contrast Mode */
  background-color: CanvasText;
}

input[type="radio"]:checked::before {
  transform: scale(1);
}

input[type="radio"]:focus {
  outline: max(2px, 0.15em) solid currentColor;
  outline-offset: max(2px, 0.15em);
}
/* custom radio end */
.vastaukset label{
	margin-left: 30px;	
}
textarea.vapaa_teksti{
	border: solid 1px #000000;
	border-radius: 6px;
	box-sizing: border-box;
	font-size: 14px;
	margin: 20px auto;
	min-height: 100px;
	padding: 10px 15px;
	width: calc(100% - 24px);
}

.approve-lbl{
	padding-left: 30px;
}
.lbl-tocb.approve-lbl input[type="checkbox"]{
	left: 0px;
}
.approve-lbl span.d-inline, .approve-lbl a.d-inline{
	display: inline;
	padding-left: 0;
}
.approve-lbl a{
	
}

.vastaukset.monivalinta label.form-control{
	
	
}
.vastaus{
	 /*font-size: 15px;*/
	margin-top: 5px;
	margin-bottom: 10px;
}
.with-sidebox{
	
}
.vastaukset.monivalinta.add-alphabets{
	
}

.vastaukset.monivalinta.add-alphabets .vastaus{
	
}
.vastaukset.monivalinta.add-alphabets .vastaus label{
	position: relative;
	margin-left: 30px;
}



.vastaus textarea, .vastaus textarea.vapaa_teksti {
	margin-left: 30px;
}
.add-alphabets > .vastaus label.form-control span{
	position: relative;
	padding-left: 20px;
}
.add-alphabets > .vastaus label.form-control span:before{
	display: inline-block;
	font-weight: 500;
	left: 0;
	margin-right: 5px;
	position: absolute;
	top: 0;
}

.add-alphabets > .vastaus:nth-child(1) label.form-control span:before{
	content: 'A:';
}
.add-alphabets > .vastaus:nth-child(2) label.form-control span:before{
	content: 'B:';
}
.add-alphabets > .vastaus:nth-child(3) label.form-control span:before{
	content: 'C:';
}
.add-alphabets > .vastaus:nth-child(4) label.form-control span:before{
	content: 'D:';
}
.add-alphabets > .vastaus:nth-child(5) label.form-control span:before{
	content: 'E:';
}
.add-alphabets > .vastaus:nth-child(6) label.form-control span:before{
	content: 'F:';
}
.add-alphabets > .vastaus:nth-child(7) label.form-control span:before{
	content: 'G:';
}
.add-alphabets > .vastaus:nth-child(8) label.form-control span:before{
	content: 'H:';
}
.add-alphabets > .vastaus:nth-child(9) label.form-control span:before{
	content: 'I:';
}
.add-alphabets > .vastaus:nth-child(10) label.form-control span:before{
	content: 'J:';
}
.add-alphabets > .vastaus:nth-child(11) label.form-control span:before{
	content: 'K:';
}
.add-alphabets > .vastaus:nth-child(12) label.form-control span:before{
	content: 'L:';
}
.add-alphabets > .vastaus:nth-child(13) label.form-control span:before{
	content: 'M:';
}
.add-alphabets > .vastaus:nth-child(14) label.form-control span:before{
	content: 'N:';
}
.add-alphabets > .vastaus:nth-child(15) label.form-control span:before{
	content: 'O:';
}
.add-alphabets > .vastaus label.form-control + div{
	padding-left: 45px;
}
.vastaus .lblohje{
	display: block;
	font-size: 15px;
	margin-bottom: -10px;
	margin-top: 10px;
	padding-left: 30px;
}
.mobiilivaroitus{
	background-color:#ffffff;
	box-sizing: border-box;
	color:#000000;
	z-index:10000;
	padding: 20px;
	position:fixed;
	top:0;
	left:0;
	height:100vh;
	width:100vw;
}
.mobiilivaroitus h2{
color:#275A90;
font-size:2rem;
text-align:center;
}
.reveal .controls {
display: none!important;
}

/* progressbar */

.vilso-progressbar{
	background-color: transparent;
	box-sizing: border-box;
	height: 8px;
	margin-left: auto;
	margin-right: auto;
	max-width: 970px;
	padding-left: 30px;
	position: relative;
	top: 74px;
	width: 96%;
/*	z-index: 2000;*/
	z-index: 1;
}
.indpalkki{
background-color: transparent;
background-color: #A3DAFF;
border-radius:8px;
box-shadow: 0px 0px 2px 2px rgba(240,249,255,1);
box-sizing: border-box;
height: 8px;
/*margin-left: 155px;*/
margin-left: auto;
margin-right: auto;
max-width: 360px;
position: relative;
width: 360px;
}
.indpalkki .edistyminen{
background-color: #275A90;
float: left;
height: 8px;
border-radius: 8px;
position: relative;
min-width: 8px;
}
.indpalkki .edistyminen:after{
/*background-color: #275A906px 0px;
content: '';
height: 16px;
right: 0;
position: absolute;
top: 0px;
width: 8px;*/
}
.indpalkki .edistyminen:before{
/*border-radius: 16px 0px 0px 16px;
content: '';
height: 16px;
left: 0px;
position: absolute;
top: 0px;
width: 8px;*/
}

.indpalkki .jaljella{
background-color: #A3DAFF;
border-radius:10px;
display:none!important;
float: left;
height: 16px;

}
.osioviivat{
	height: 100%;
	left:0;
	position: absolute;
	top:0;
	width: 100%;
	z-index: 3;
}
.osioviiva{
	height: 100%;
	float:left;
}
/*.osioviivat.osionums-3 .osioviiva:nth-child(2){
	height: 100%;
	border-left: solid 2px #f0f9ff;
	border-right: solid 2px #f0f9ff;
}*/
.osioviivat.osionums-4 .osioviiva.prplus:nth-child(1),.osioviivat.osionums-4 .osioviiva.prplus:nth-child(2),.osioviivat.osionums-4 .osioviiva.prplus:nth-child(3){
	height: 100%;
	/*border-left: solid 2px #f0f9ff;*/
	border-right: solid 2px #f0f9ff;
}
.osioviivat.osionums-3 .osioviiva.prplus:nth-child(1),.osioviivat.osionums-3 .osioviiva.prplus:nth-child(2){
	height: 100%;
	/*border-left: solid 2px #f0f9ff;*/
	border-right: solid 2px #f0f9ff;
}
.osioviivat.osionums-2 .osioviiva.prplus:nth-child(1){
	height: 100%;
	/*border-left: solid 2px #f0f9ff;*/
	border-right: solid 2px #f0f9ff;
}
.content-box.more-mt{
margin-top: 30px;
}
h3.off-the-box-otsikko{
margin: 0;
padding-left: ;
padding-top: 20px;
transform: translateY(-100%);
margin-top: -30px;
text-align: center;
}
.off-the-box-otsikko.iconbg-kuivuus{
background-image:url("../../img/Vilso_Ikoni_Kuivuus.svg");
background-position: 18px 15px;
background-repeat: no-repeat;
overflow: visible;
background-size: 40px;
min-height: 30px;
padding: 10px;
padding-top: 20px;
box-sizing: border-box;
}

@media(min-width:768px){
	.mobiilivaroitus{
		display:none;
	}
}
@media (orientation: landscape) and (min-height:500px) {
	.mobiilivaroitus{
		display:none;
	}
}

.btn-group,
.btn-group-vertical {
  position: relative;
  display: -ms-inline-flexbox;
  display: inline-flex;
  vertical-align: middle;
}

.btn-group > .btn,
.btn-group-vertical > .btn {
  position: relative;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
padding: 7px 15px;
margin-left: 5px;
margin-right: 5px;
background-color: #f0f9ff;
border-radius: 10px!important;
border: solid 2px #275A90;
color: #275A90;
}

.btn-group > .btn:hover,
.btn-group-vertical > .btn:hover {
  z-index: 1;
}

.btn-group > .btn:focus, .btn-group > .btn:active, .btn-group > .btn.active,
.btn-group-vertical > .btn:focus,
.btn-group-vertical > .btn:active,
.btn-group-vertical > .btn.active {
  z-index: 1;
  
  background-color: #275A90;
  color:#ffffff;
}

.btn-toolbar {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.btn-toolbar .input-group {
  width: auto;
}

.btn-group > .btn:not(:first-child),
.btn-group > .btn-group:not(:first-child) {
  margin-left: -1px;
}

.btn-group > .btn:not(:last-child):not(.dropdown-toggle),
.btn-group > .btn-group:not(:last-child) > .btn {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.btn-group > .btn:not(:first-child),
.btn-group > .btn-group:not(:first-child) > .btn {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.dropdown-toggle-split {
  padding-right: 0.5625rem;
  padding-left: 0.5625rem;
}

.dropdown-toggle-split::after,
.dropup .dropdown-toggle-split::after,
.dropright .dropdown-toggle-split::after {
  margin-left: 0;
}

.dropleft .dropdown-toggle-split::before {
  margin-right: 0;
}

.btn-sm + .dropdown-toggle-split, .btn-group-sm > .btn + .dropdown-toggle-split {
  padding-right: 0.375rem;
  padding-left: 0.375rem;
}

.btn-lg + .dropdown-toggle-split, .btn-group-lg > .btn + .dropdown-toggle-split {
  padding-right: 0.75rem;
  padding-left: 0.75rem;
}

.btn-group-vertical {
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: start;
  align-items: flex-start;
  -ms-flex-pack: center;
  justify-content: center;
}

.btn-group-vertical > .btn,
.btn-group-vertical > .btn-group {
  width: 100%;
}

.btn-group-vertical > .btn:not(:first-child),
.btn-group-vertical > .btn-group:not(:first-child) {
  margin-top: -1px;
}

.btn-group-vertical > .btn:not(:last-child):not(.dropdown-toggle),
.btn-group-vertical > .btn-group:not(:last-child) > .btn {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.btn-group-vertical > .btn:not(:first-child),
.btn-group-vertical > .btn-group:not(:first-child) > .btn {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.btn-group-toggle > .btn,
.btn-group-toggle > .btn-group > .btn {
  margin-bottom: 0;
}

.btn-group-toggle > .btn input[type="radio"],
.btn-group-toggle > .btn input[type="checkbox"],
.btn-group-toggle > .btn-group > .btn input[type="radio"],
.btn-group-toggle > .btn-group > .btn input[type="checkbox"] {
  position: absolute;
  clip: rect(0, 0, 0, 0);
  pointer-events: none;
}

.input-group {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-align: stretch;
  align-items: stretch;
  width: 100%;
}

.input-group > .form-control,
.input-group > .form-control-plaintext,
.input-group > .custom-select,
.input-group > .custom-file {
  position: relative;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  width: 1%;
  min-width: 0;
  margin-bottom: 0;
}

.input-group > .form-control + .form-control,
.input-group > .form-control + .custom-select,
.input-group > .form-control + .custom-file,
.input-group > .form-control-plaintext + .form-control,
.input-group > .form-control-plaintext + .custom-select,
.input-group > .form-control-plaintext + .custom-file,
.input-group > .custom-select + .form-control,
.input-group > .custom-select + .custom-select,
.input-group > .custom-select + .custom-file,
.input-group > .custom-file + .form-control,
.input-group > .custom-file + .custom-select,
.input-group > .custom-file + .custom-file {
  margin-left: -1px;
}

.input-group > .form-control:focus,
.input-group > .custom-select:focus,
.input-group > .custom-file .custom-file-input:focus ~ .custom-file-label {
  z-index: 3;
}

.input-group > .custom-file .custom-file-input:focus {
  z-index: 4;
}

.input-group > .form-control:not(:first-child),
.input-group > .custom-select:not(:first-child) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.input-group > .custom-file {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.input-group > .custom-file:not(:last-child) .custom-file-label,
.input-group > .custom-file:not(:last-child) .custom-file-label::after {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.input-group > .custom-file:not(:first-child) .custom-file-label {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.input-group:not(.has-validation) > .form-control:not(:last-child),
.input-group:not(.has-validation) > .custom-select:not(:last-child),
.input-group:not(.has-validation) > .custom-file:not(:last-child) .custom-file-label,
.input-group:not(.has-validation) > .custom-file:not(:last-child) .custom-file-label::after {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.input-group.has-validation > .form-control:nth-last-child(n + 3),
.input-group.has-validation > .custom-select:nth-last-child(n + 3),
.input-group.has-validation > .custom-file:nth-last-child(n + 3) .custom-file-label,
.input-group.has-validation > .custom-file:nth-last-child(n + 3) .custom-file-label::after {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.input-group-prepend,
.input-group-append {
  display: -ms-flexbox;
  display: flex;
}

.input-group-prepend .btn,
.input-group-append .btn {
  position: relative;
  z-index: 2;
}

.input-group-prepend .btn:focus,
.input-group-append .btn:focus {
  z-index: 3;
}

.input-group-prepend .btn + .btn,
.input-group-prepend .btn + .input-group-text,
.input-group-prepend .input-group-text + .input-group-text,
.input-group-prepend .input-group-text + .btn,
.input-group-append .btn + .btn,
.input-group-append .btn + .input-group-text,
.input-group-append .input-group-text + .input-group-text,
.input-group-append .input-group-text + .btn {
  margin-left: -1px;
}

.input-group-prepend {
  margin-right: -1px;
}

.input-group-append {
  margin-left: -1px;
}

.input-group-text {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  padding: 0.375rem 0.75rem;
  margin-bottom: 0;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #495057;
  text-align: center;
  white-space: nowrap;
  background-color: #e9ecef;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
}

.input-group-text input[type="radio"],
.input-group-text input[type="checkbox"] {
  margin-top: 0;
}

.input-group-lg > .form-control:not(textarea),
.input-group-lg > .custom-select {
  height: calc(1.5em + 1rem + 2px);
}

.input-group-lg > .form-control,
.input-group-lg > .custom-select,
.input-group-lg > .input-group-prepend > .input-group-text,
.input-group-lg > .input-group-append > .input-group-text,
.input-group-lg > .input-group-prepend > .btn,
.input-group-lg > .input-group-append > .btn {
  padding: 0.5rem 1rem;
  font-size: 1.25rem;
  line-height: 1.5;
  border-radius: 0.3rem;
}

.input-group-sm > .form-control:not(textarea),
.input-group-sm > .custom-select {
  height: calc(1.5em + 0.5rem + 2px);
}

.input-group-sm > .form-control,
.input-group-sm > .custom-select,
.input-group-sm > .input-group-prepend > .input-group-text,
.input-group-sm > .input-group-append > .input-group-text,
.input-group-sm > .input-group-prepend > .btn,
.input-group-sm > .input-group-append > .btn {
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
  line-height: 1.5;
  border-radius: 0.2rem;
}

.input-group-lg > .custom-select,
.input-group-sm > .custom-select {
  padding-right: 1.75rem;
}

.input-group > .input-group-prepend > .btn,
.input-group > .input-group-prepend > .input-group-text,
.input-group:not(.has-validation) > .input-group-append:not(:last-child) > .btn,
.input-group:not(.has-validation) > .input-group-append:not(:last-child) > .input-group-text,
.input-group.has-validation > .input-group-append:nth-last-child(n + 3) > .btn,
.input-group.has-validation > .input-group-append:nth-last-child(n + 3) > .input-group-text,
.input-group > .input-group-append:last-child > .btn:not(:last-child):not(.dropdown-toggle),
.input-group > .input-group-append:last-child > .input-group-text:not(:last-child) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.input-group > .input-group-append > .btn,
.input-group > .input-group-append > .input-group-text,
.input-group > .input-group-prepend:not(:first-child) > .btn,
.input-group > .input-group-prepend:not(:first-child) > .input-group-text,
.input-group > .input-group-prepend:first-child > .btn:not(:first-child),
.input-group > .input-group-prepend:first-child > .input-group-text:not(:first-child) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
#seasonnavi{
margin-top: 20px;
margin-bottom: 20px;
}
#vuosikaaviot h3, #kevatkaaviot h3, #kesakaaviot h3, #syksykaaviot h3, #talvikaaviot h3, #taustadata h3{
margin-top: 20px;
padding-top: 10px;
}
#vuosikaaviot h3, #kevatkaaviot h3, #kesakaaviot h3, #syksykaaviot h3, #talvikaaviot h3, #taustadata h3{
margin-bottom: 0px;
}
.select2-container--default .select2-selection--single {
color: #275A90;
border: 1px solid #aaa;
border-radius: 4px;
border-radius: 10px!important;
border: solid 2px #275A90!important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
color: #275A90;
}

.tiedot{
border-top: solid 1px #c1c1c1;
display: block;

font-size: 1.05rem;
/*font-weight: 600;*/
font-weight: 500;
color: var(--r-heading-color);
max-width: 400px;
margin-bottom: 5px;
margin-left: auto;
margin-right: auto;
margin-top: 40px;
padding-top: 15px;
}
.tiedot label{
display: block;
margin-bottom: 5px;
font-size: 1rem;
font-weight: 600;
color: #275A90;
text-align:left;
/*var(--r-heading-color);*/
}
.tiedot input{
display: block;
width: 100%;
margin-bottom: 15px;
padding: 3px 10px;
font-size: 1rem;
font-weight: 300;
}
.noans{
font-size: 0.75rem; color: #dd0707; margin-bottom: -10px;
}
.noans.d-none{
display:none;
}
.kaavioinfo{
	font-size: 0.8em;
	margin: 20px auto;
}