/**
 * Custom CSS
 * Use this file to override styles if you feel uncomfortable editing
 * component stylesheets.
 ============================================================================ */


.page-wrapper { 
	background-repeat: no-repeat;
	background-position: top center;
	background-size: 100% auto;
	overflow-x: clip;
}
.path-frontpage .page-wrapper { background: #fff!important; }
.page-wrapper > div {
	background: -moz-linear-gradient(top, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(to bottom,rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
    background-repeat: repeat;
    background-size: auto;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 );
	background-size: 100% 280px;
	background-repeat: no-repeat;
}
.page { background: transparent; min-height: 100vh; }
.page .regions, .page .node { background: transparent; box-shadow: none!important; padding: 0; }
.l-main { background: #fff; }
main.block { margin-top: 0; }
.l-rw { max-width: 1000px; }
/*.path-frontpage*/ .l-rw, .path-frontpage #rid-content { max-width: 100%;  } 
/*.path-frontpage*/ #rid-content > .block, #rid-content-prefix > .block, #rid-content-suffix > .block, #rid-features-top > .block { max-width: 1300px; margin-left: auto; margin-right: auto; } 


.l-highlighted .l-rw { max-width: 1300px; }
.pr-features { background-color: #eee; }
.pr-features .l-rw { background-color: #eee; }
#content-prefix .l-rw, #content-suffix .l-rw {
	width: 100%;
    max-width: 100% !important;
    margin-left: auto;
    margin-right: auto;
    background-color: #95c9e1;
    padding: 30px;
}
#content-prefix .l-rw > div, #content-suffix .l-rw > div { max-width: 100%; margin: auto; }
#content-prefix h2.block__title, #content-suffix h2.block__title { text-align: center; }
.field-node--body h2, .field-node--body h3, .field-node--body h4 { max-width: 750px; margin: 1.6rem auto 0.6rem auto; text-transform: uppercase; font-weight: 500; }
ul:not(.toolbar-menu), ol, dd, dl, p, pre, table, hr, form, fieldset { max-width: 750px; margin-left: auto; margin-right: auto; }
.kapea { max-width: 750px; margin-left: auto; margin-right: auto; }
span.kapea{
	display: block;
}
.field-node--body ul { padding-left: 15px; }
.path-frontpage .l-highlighted { margin: 0; padding: 0; height: 30vh; position: relative; }
.path-frontpage .l-highlighted .l-rw { max-width: 100%; }
.path-frontpage .l-highlighted .l-r, .path-frontpage .l-highlighted .block { padding: 0; margin: 0; }
.path-frontage p { max-width: 100%; }

.l-highlighted {
	background: -moz-linear-gradient(bottom, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(bottom, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(to top,rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
    background-repeat: repeat;
    background-size: auto;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 );
	background-size: 100% 140px;
	background-repeat: no-repeat;
	padding-left: 5%;
	margin-bottom: -10px;
}
.l-highlighted .views-field-field-tags { display: inline-block; color: #000; font-weight: 700; text-transform: uppercase; background: #95C9E1; padding: 5px 20px; }
.l-highlighted .views-field-title { color: #FFF; text-transform: uppercase; font-weight: 500; font-family: "Poppins", Helvetica, sans-serif; font-size: 1.8em; margin: 20px 0 40px 0; }

.l-leaderboard { position: relative; margin-top: -40px; z-index: 2; }
.l-leaderboard .regions { text-align: right; max-width: 1320px; }
#block-kielenvaihtaja {
	width: fit-content;
	float: right;
}
#rid-leaderboard { min-height: 26px; }
html[lang="fi"] #block-visitii-uusi-googlekaantaja {
	display: none;
}
html[lang="fi"] .l-navbar{
	top: 40px;
}
#block-visitii-uusi-googlekaantaja .field {
	margin-bottom: 20px;
}
#block-visitii-uusi-googlekaantaja .field__item {
	text-align: center;
	max-width: 100%;
	margin: 0px;
	background-color: #95C9E1;
	color: #000;
}
#block-visitii-uusi-googlekaantaja .field__item * {
	font-weight: bold;
	margin: 0px;
	max-width: 100%;
}
#block-visitii-uusi-gtranslate {
	width: fit-content;
	float: right;
	height: 100%;
	justify-content: center;
	align-items: center;
	display: flex;
}
#block-kielenvaihtaja ul { max-width: 100%; }
#block-kielenvaihtaja li { display: inline-block; }
#block-kielenvaihtaja li a, #block-visitii-uusi-gtranslate .block__content a { color: #fff; text-decoration: none; text-transform: uppercase; font-family: "Poppins", Helvetica, sans-serif; padding: 0px 5px; }
#block-kielenvaihtaja li a::before, #block-visitii-uusi-gtranslate .block__content a[data-gt-lang="fi"]::before { 
	content: "  ";
	height: 20px; width: 20px; 
	vertical-align: middle;
	display: inline-block;
	padding-right: 10px;
	background: transparent url(images/maapallo_ikoni.png) no-repeat;
	background-size: auto 100%;
}
#block-kielenvaihtaja li.is-active { display: none; }
#block-visitii-uusi-gtranslate .gtranslate_wrapper { display: flex; }
#block-visitii-uusi-gtranslate .block__content a[data-gt-lang="fi"] { order: 0; padding-left: 0px; }
#block-visitii-uusi-gtranslate .block__content a[data-gt-lang="en"] { order: 1; }
#block-visitii-uusi-gtranslate .block__content a[data-gt-lang="de"] { order: 2; padding-right: 0px; }

#block-youtubeupotus { margin-top: -60px; }
.views_slideshow_cycle_teaser_section { position: unset!important; }
.views_slideshow_cycle_slide { }
.views_slideshow_slide { min-width: 100%; top: auto !important; bottom: 0;}
.views_slideshow_slide .views-field-body { 
	position: absolute;
    bottom: 0px;
    width: 100%;
    text-align: center;
}
thead, tbody, tr, th, td { border: 0; }
.node--type-page.node--view-mode-full .field-type-image__figure { text-align: left; }
.dia .views-field-field-taustakuva img { width: 100%; position: fixed; top: 0; object-fit: cover; min-height: 100vh;}
.dia .views-field-field-taustakuva .field-content::after {
	content: " ";
	height: 280px; width: 100%;
	background: -moz-linear-gradient(top, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(to bottom,rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
    background-repeat: repeat;
    background-size: auto;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 );
	background-size: 100% 280px;
	background-repeat: no-repeat;
	position: fixed;
	top: 0;
}
.diakehys { 
	z-index: 9;
	position: relative;
	color: #fff; 
	width: 100%;
	height: auto;
	background: -moz-linear-gradient(bottom, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(bottom, rgba(0,0,0,0.95) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(to top,rgba(0,0,0,0.95) 0%,rgba(0,0,0,0) 100%);
    background-repeat: repeat;
    background-size: auto;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 );
	background-size: 100% 100%;
	background-repeat: no-repeat;
	padding: 30px;
	margin: 0 auto;
	text-align: center;
	color: #fff;
	font-size: 1.3em;
	font-family: 'Roboto', Arial, sans-serif;	
	font-weight: 500;
	line-height: 1.2em;
}
.diakehys h1 { 
	color: #fff; 
	padding-bottom: 0;
	margin-bottom: 5px;
	font-family: "Poppins", Helvetica, sans-serif;
	color: #fff;
	font-size: 1.8em;
	font-style: normal;
	text-transform: none;
}
.diakehys a { color: #fff; }
.views-slideshow-controls-bottom a { color: transparent; font-size: 0px; }
.views-slideshow-controls-bottom a:focus { font-size: 13px; color: #fff!important; text-shadow: 2px 2px #333; }
.views-slideshow-controls-bottom a:hover,
.views-slideshow-controls-bottom span:hover, .views-slideshow-controls-bottom span:focus { color: #f2a02e!important; text-decoration: none!important; }
.views-slideshow-controls-bottom { 
	display: none;
	position: absolute;
    width: 100%;
    margin: auto;
    text-align: center;
    top: 550px;
    z-index: 9;
    color: #fff;
}
.views_slideshow_controls_text_previous::before { font-family: FontAwesome; content: "\f053"; font-size: 40px; text-shadow: 2px 2px #333;  }
.views_slideshow_controls_text_next::after { font-family: FontAwesome; content: "\f054"; font-size: 40px; text-shadow: 2px 2px #333;  }
.views_slideshow_controls_text_pause::after { font-family: FontAwesome; content: "\f04c"; font-size: 30px; text-shadow: 2px 2px #333; padding-left: 50px; padding-right: 50px; }
ul.widget_pager_bottom { }
.views-slideshow-controls-bottom .views-slideshow-pager-bullets li { padding: 5px 12px!important; border-radius: 14px!important; background-color: transparent; border: 3px solid #fff; }
.views-slideshow-controls-bottom .views-slideshow-pager-bullets li.active { background-color: #fff; }

/* nostot */
.nosto {  }
.nosto a { color: #fff!important; text-decoration: none!important; }
.nosto img { min-height: 250px; }
.kuvatop { 
	position: absolute; 
	background: -moz-linear-gradient(bottom, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(bottom, rgba(0,0,0,0.95) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(to top,rgba(0,0,0,0.95) 0%,rgba(0,0,0,0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 );
	background-size: 100% 100%;
	background-repeat: no-repeat;
	width: 100%; height: 40%;
	bottom: 0;
}
.nostokat { position: absolute; top: 20px; left: 20px; color: #000!important; background: #95c9e1; padding: 3px 12px; text-transform: uppercase; font-weight: 600; font-family: "Poppins", Helvetica, sans-serif; }
.nostotitle { position: absolute; bottom: 20px; left: 20px; right: 20px; color: #fff!important; line-height: 1.2em; text-transform: uppercase; font-weight: 600; font-family: "Poppins", Helvetica, sans-serif; }
.view-nostot .view-rows { 
	padding: 0;
	margin: 0;
	display: -ms-flexbox;
	-ms-flex-flow: row wrap;
	display: grid;
	-ms-grid-columns: 20% 20% 20% 20% 20%;
	grid-template-columns: repeat(auto-fill, minmax(20%, 20%));
	grid-gap: 5px;
	grid-auto-rows: minmax(240px, auto);
	grid-auto-flow: dense;
	height: auto !important;
	justify-content: center;
}
.view-nostot .view-rows .views-row { 
	min-height: auto;
	-ms-flex: 1 auto;
	-ms-flex-preferred-size: 20%;
	height: 250px;
	min-height: auto;
	padding: 0; margin: 0;
	position: relative;
	overflow: hidden;
}
.view-nostot .view-rows .views-row:nth-of-type(6n+1) { 
	grid-column-start: 1;
	grid-column-end: span 2;
	grid-row: 1;
	-ms-grid-row: 1;
}
.view-nostot .view-rows .views-row:nth-of-type(6n+2) { 
	grid-row: 1;
	grid-column: 3;
	-ms-grid-row: 1;
	-ms-grid-column: 3;
}
.view-nostot .view-rows .views-row:nth-of-type(6n+3) { 
	grid-row: 2;
	grid-column: 1;
	-ms-grid-row: 2;
	-ms-grid-column: 1;
}
.view-nostot .view-rows .views-row:nth-of-type(6n+4) { 
	grid-row: 2;
	grid-column: 2;
	-ms-grid-row: 2;
	-ms-grid-column: 2;
}
.view-nostot .view-rows .views-row:nth-of-type(6n+5) { 
	grid-row: 2;
	grid-column: 3;
	-ms-grid-row: 2;
	-ms-grid-column: 3;
}
.view-nostot .view-rows .views-row:nth-of-type(6n+6) { 
	grid-row-start: 1;
	grid-column-start: 4;
	-ms-grid-row-start: 1;
	-ms-grid-column-start: 4;
	grid-column-end: span 2;
	grid-row-end: span 2;
	height: 505px;
}
.view-nostot .view-rows .views-row:nth-of-type(6n+6) img { height: 505px; width: auto; }

/*.view-nostot .view-rows:lang(en) { display: block;  max-width: 1185px; margin: auto;}
.view-nostot .view-rows .views-row:lang(en) { display: inline-block; width: 33%;}
.view-nostot:lang(en) .view-rows .views-row:nth-of-type(6n+4) { width: 100%; padding-right: 5px; }
.view-nostot:lang(en) .view-rows .views-row:nth-of-type(6n+4) img { width: 100%; }*/
	
.view-kohdekorttinostot .view-filters .form-item { text-align: center; float: none; margin: auto; max-width: 400px; }	
.view-kohdekorttinostot .view-filters .form-item select { border-radius: 5px; font-size: 1.1em; }
.view-kohdekorttinostot .view-filters .form-item select:hover,
.view-kohdekorttinostot .view-filters .form-item select:focus { cursor:pointer; background: #eee; }
.form-type-select__select-wrapper:not(.is-multiple)::after { color: #000!important; }
	
/*ul.menu:lang(en) #menu-name--main__nhtvyydet-ja-aktiviteetit { display: none!important; }*/
ul.menu:lang(fi) #menu-name--main__historical-buildings,
ul.menu:lang(fi) #menu-name--main__purusaari-island-and-jakkukyl-suspesion-bridge,
ul.menu:lang(fi) #menu-name--main__wanha-hamina-historic-district { display: none!important; }
.l-header {
	background: transparent;
	height: calc(40vh - 40px);
	z-index: 4;
	width: fit-content;
}
.path-frontpage .l-header { height: calc(70vh - 40px); }
.pr-header { background-color: transparent;  }
.pr-header__rw { /*max-width: 1200px;*/ max-width: 100%; }
.pr-navbar { 
	background-color: transparent; 
	color: #fff; 
	/*max-width: 1050px;*/
	margin: auto;
	/*float: right;*/
}
.l-navbar { 
	width: 100%;
	max-width: 1350px;
	background-color: transparent;	
	text-align: right;
	margin: 0 auto;
	position: relative;
	z-index: 2;
}
.l-navbar ul.menu {
	list-style-type: none;
	text-align: left;
	margin: 0px;
	padding: 0px;
	float: right;
	max-width: 100%;
}	

.l-navbar ul.revealed { 
	display: block!important; 
	position: absolute;
	width: 100%;
	min-width: 400px;
	list-style: none;
	margin: 0;
	padding: 20px;
	line-height: 1.2em;
	top: 60px;
	left: 0px !important;
	z-index: 108;
	color: #fff;
	background: #000!important;
}

.ms-horizontal .rm-block__content .menu-level-2 .menu__link.is-active { font-weight: 700; }
.ms-horizontal .rm-block__content .menu-level-2 a.menu__link {
    color: #fff !important;
    font-family: "Poppins", Helvetica, sans-serif;
    line-height: 1.2em; 
    text-transform: none;
    font-weight: normal;
    font-size: 1em;
    float: none;
    display: block;
    padding: 4px 0px 4px 0px;
    position: relative;
	word-wrap: break-word;
  	hyphens: auto;
}
.ms-dropmenu .rm-block__content .menu-level-2 .menu__link, .ms-horizontal .rm-block__content .menu-level-2 .menu__link { background-color: transparent!important; }
.ms-horizontal .rm-block__content .menu-level-2 a::before {

}   
 
.ms-horizontal .rm-block__content .menu-level-2 a:focus { color: #fff!important;  }
.ms-horizontal .rm-block__content .menu-level-2 li { margin-left: 10px!important; } 
.l-navbar ul.menu-level-1 > li { padding: 10px 15px; }
.l-navbar ul.menu-level-1 > li > span > a.menu__link { text-transform: uppercase!important; font-weight: 600; letter-spacing: -0.5px; font-family: "Poppins", Helvetica, sans-serif; padding: 0px; line-height: 1.1em; }
.l-navbar ul.menu-level-1 > li > span > a.is-active, .l-navbar ul.menu-level-1 > li.menu__item--active-trail > span > a { border-bottom: 3px solid #fff; color: #fff!important; background-color: transparent!important; }
.ms-horizontal .rm-block__content .menu-level-1 > li > span > .menu__link:hover { color: #fff!important; background: transparent!important;  }
.ms-horizontal .rm-block__content .menu-level-1 > li > span > .menu__link:focus { color: #fff!important; background: transparent!important; outline: 2px solid #fff; }

.l-navbar ul.menu-level-1 > li.is-parent { padding-right: 20px; }
.l-navbar ul.menu-level-1 > li > span.is-parent__wrapper { display: inline-block; text-align: center; }
.l-navbar ul.menu-level-1 > li.is-parent > span.is-parent__wrapper::after {
	content: "\f105";
	font-family: FontAwesome;
	display: inline-block;
	position: absolute;
	top: 13px; right: 5px;
}
.l-navbar ul.menu-level-1 > li.menu__item--active-trail > span.is-parent__wrapper::after { content: ""; }
.l-content-prefix { margin-top: 0; background: #f3f7fa; }
.breadcrumb__link, .breadcrumb a { color: #000; }
.breadcrumb { margin: 15px 0; }
.breadcrumb li::before { color: #000; }
.node__header { text-align: center; max-width: 700px; margin: 25px auto auto auto; }
h1 {
	font-weight: 600;	
}
h1.node__title {  font-weight: 600; margin-top: 70px;  }
h2 {

}
h3 {

}
.path-frontpage h1.node__title, .page-node-type--slideshow h1.node__title { display: none; }
button, .button { background-color: #333; border-radius: 5px; }
#block-visitiiinstagramupotus button.bubster-more {
	width: auto;
	position: relative;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 5px;
	border-width: 1px;
	border-style: solid;
	-webkit-transition: background-color, .15s, ease-in-out;
	-o-transition: background-color, .15s, ease-in-out;
	transition: background-color, .15s, ease-in-out;
	cursor: pointer;
	text-decoration: none;
	text-align: center;
	font-weight: 400;
	white-space: nowrap;
	height: 2rem;
	padding: 0 0.625rem;
	color: #fcfcfc;
	background-color: #333;
	border-color: #828282;
	opacity: 0.9;
	-webkit-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.5);
	box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.5);
	font-family: "Roboto", sans-serif;
	font-size: 100%;
	text-decoration: underline;
	text-transform: none;
	margin-left: auto;
	margin-right: auto;
}
#block-visitiiinstagramupotus button.bubster-more:hover, 
#block-visitiiinstagramupotus button.bubster-more:focus {
  opacity: 1;
  color: #fcfcfc;
  background-color: #828282;
}
.l-main a:focus { font-weight: bold; color:#4c7000; }
#rid-content a { text-decoration: underline; }
#rid-header-first { width: 280px; margin-top: -46px; }
#rid-header-second { width: 70%; text-align: right; font-size: 85%; padding-top: 25px; }
#rid-header-second a { color: #333;  }
#rid-header-second div { display: inline; }
.linkit a { padding-right: 7px; padding-left: 7px; }
#rid-header-second p { margin: 0; padding: 0; display: inline; }
.yla_visitii {
    font-size: 22px;
    float: right;
    font-family: "Open sans", Arial;
    padding-left: 30px;
    color: #333;
}

.field-node--field-ingressi {
	max-width: 700px;
	margin: 25px auto 45px auto;
    font-size: 1.2em;
	color: #363636;
	line-height: 1.2em;
	font-weight: 400;
	font-weight: 600;
	font-family: 'Roboto', Arial, sans-serif;
	padding-top: 8px;
	text-align: center;
}

#rid-content {
	float: left;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	max-width: 1080px;
	
}
#rid-sidebar-second {
	float: right;
	margin-bottom: 20px;
	margin-left: 0;
	margin-right: 0px;
	margin-top: 0px;
	min-height: 230px;
	padding: 0;
	text-align: left;
	width: 235px;	
}
#rid-sidebar-second nav {
	background-color: #fff;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	padding: 15px;
}
#rid-sidebar-second ul li { position: relative; margin-left: 5px!important; }
#rid-sidebar-second ul li a::before {
    content: " - ";
    padding-right: 5px;
    position: absolute;
    top: 3px;
    left: -15px;
}
#rid-sidebar-second ul li a { font-family: "Poppins", Helvetica, sans-serif; color: #000; font-size: 1rem; line-height: 1.2em; }

.path-frontpage .l-main { min-height: 200px; z-index: 5; }
.path-frontpage .l-features { width: 100%; position: absolute; top: 650px; z-index: 9; }
.path-frontpage .pr-features { background-color: transparent!important; position: relative; }
.path-frontpage .pr-features .regions { 
	position: absolute; 
	background-color: rgba(255, 255, 255, 0.8);
	overflow: auto;
	width: 1000px;
	margin: auto;
	padding: 30px;
}
.l-features p { margin: 0; padding: 0; }
.path-frontpage .pr-features .regions a { color: #4c7000; font-size: 90%; text-decoration: underline; }
.path-frontpage .pr-features .regions > .region { float: left; width: 33.33%; padding: 0; }
.path-frontpage .pr-features .regions > .region img { margin-bottom: 5px; }
.path-frontpage .l-subfeatures { z-index: 5; background: #fff; }

#rid-features-top { width: 100%; padding-left: 10px; }
.path-frontpage #rid-content h2 {     
	text-align: center;
    font-weight: 400 !important;
    font-size: 2.25rem !important;
    letter-spacing: 8px; 
    margin: 40px 0 40px 0;
    max-width: 100%;
	word-break: break-word;
	hyphens: auto;
 } 
.sourceInstagram { background: #fff url(images/instagram_icon.png) no-repeat; backround-size: cover; height: 35px; width: 35px; float: left; }
.aika {  font-size: 14px; padding-left: 10px;  padding-top: 7px; text-align: center; }


.views-field-timestamp { font-weight: 600; margin: 0; padding: 0 15px 4px 15px!important; font-size: 11px!important; }
.field-name-created { font-weight: 600; }
.views-row { margin-bottom: 15px; }

#block-visitiiinstagramupotus p { max-width: 1000px!important; }

#rid-features-first > .block { padding: 0 10px 0 10px; }
#rid-features-second > .block { padding: 0 10px 0 10px; }
#rid-features-third > .block { padding: 0 0px 0 10px; }
.l-features iframe { width: 100%!important; }
iframe { max-width: 100%!important; }
#rid-features-second iframe { height: 336px!important; }
#rid-features-first > .block p img {  }
html:lang(en) #rid-features-first {  } 
html:lang(en) #rid-features-first iframe { height: 640px;}
html:lang(en) #rid-features-second {  } 
html:lang(en) #rid-features-third {  } 
html:lang(en) .path-frontpage .l-main { min-height: 500px; }
html:lang(en) #menu-name--main__meri-ja-joet { display: none; }
html:lang(en) .l-navbar ul.menu-level-1 > li > span > a.menu__link { font-size: 18px; }
.greentitle {
    background: #74AA00;
    padding: 5px 15px;
}
.tapahtumat {
    background: #45acef;
    padding: 5px 15px;
    margin-top: 0px;
}
.ajankohtaista h2, .tapahtumat h2, .greentitle h2 {
    text-align: left;
    color: #fff;
    font-weight: normal;
}

.field-node--field-artikkelikuva { max-width: 48%; margin: 0 30px 10px 0; float: left; }

.l-attribution { display: none; }
.path-frontpage .l-footer { z-index: 5; }
.pr-footer, .pr-subfeatures { background-color: #f3f7fa !important; color: #000;  }
.pr-subfeatures { padding-top: 40px; }
.pr-subfeatures .container > div { display: inline-block;}
#rid-subfeatures-first { width: 25%; }
#rid-subfeatures-second { width: 50%; }
#rid-subfeatures-third { width: 25%; }
#rid-subfeatures-fourth { width: 25%; }
.pr-subfeatures .regions, #rid-footer { max-width: 1300px; margin: auto; }
.pr-footer a, .pr-subfeatures a { text-decoration: underline; }
.pr-footer a:focus, .pr-subfeatures a:focus { font-weight: bold; }
.contextual-links a { color: #000!important; }

.site-branding__text { background: #95C9E1; padding: 4px 10px; color: #000; }
.site-branding__name-link  { font-family: "Roboto", Arial, sans-serif !important; font-weight: 900!important; color: #fff!important; margin-left: 15px; }
.site-branding img { max-height: 100px; }
.block-plugin-id--system-branding-block  {margin-top: 10px; }



/* eu cookie compliance */
body .eu-cookie-compliance-secondary-button { font-weight: 700; background-color: #515151!important; }
body .eu-cookie-compliance-default-button { background-color: #f9b900!important; color: #000!important; background-image: none!important; text-shadow: none!important; font-weight: bold; }
body .eu-cookie-compliance-save-preferences-button,
body .eu-cookie-withdraw-button { background: #f9b900!important; color: #000!important; text-shadow: none!important; font-weight: bold;}
.eu-cookie-compliance-buttons { float: left; }
body .eu-cookie-compliance-message p strong { font-weight: normal!important; }
body .eu-cookie-compliance-message h2 { font-family: "Roboto", Arial, sans-serif; }
body .eu-cookie-compliance-message .eu-cookie-compliance-more-button { background-color: transparent!important; border: 0!important; min-height: auto!important; padding: 0; box-shadow: none!important;}
/* end cookie */


/*tuotekuvat datahub*/
#views-blocktuotekuvat-block-3{
	display: block;
}
#views-blocktuotekuvat-block-3 .element-container-wrapper{
	position: relative;
}
.view-id-tuotekuvat.view-display-id-block_3 .views-row img{
	max-height: 180px;
	width: auto;
	position: relative;
	z-index: 1;
}
.view-id-tuotekuvat.view-display-id-block_3 .views-row img:hover, .view-id-tuotekuvat.view-display-id-block_3 .views-row img:focus{
	cursor: pointer;
	opacity: 0.3;
}
.view-id-tuotekuvat.view-display-id-block_3 .views-row figure, .view-id-tuotekuvat.view-display-id-block_3 .views-row span{
	margin: 0px;
}
.view-id-tuotekuvat.view-display-id-block_3 .views-row figure:hover, .view-id-tuotekuvat.view-display-id-block_3 .views-row figure:focus{
	background-color: #000;
}
.view-id-tuotekuvat.view-display-id-block_3 .views-row::after{
	content: "Show";
	display: none;
	position: relative;
	color: #fff;
	margin: -180px auto 0px auto;
	width: 100%;
	height: 180px;
	text-align: center;
	font-size: 0px;
	background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="white" class="bi bi-arrows-angle-expand" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M5.828 10.172a.5.5 0 0 0-.707 0l-4.096 4.096V11.5a.5.5 0 0 0-1 0v3.975a.5.5 0 0 0 .5.5H4.5a.5.5 0 0 0 0-1H1.732l4.096-4.096a.5.5 0 0 0 0-.707zm4.344-4.344a.5.5 0 0 0 .707 0l4.096-4.096V4.5a.5.5 0 1 0 1 0V.525a.5.5 0 0 0-.5-.5H11.5a.5.5 0 0 0 0 1h2.768l-4.096 4.096a.5.5 0 0 0 0 .707z"/></svg>');
	background-size: 30px;
	background-position: center;
	background-repeat: no-repeat;
}
.view-id-tuotekuvat.view-display-id-block_3 .views-row:hover::after, .view-id-tuotekuvat.view-display-id-block_3 .views-row figure:focus::after{
	display: block;
}
.view-id-tuotekuvat.view-display-id-block_3 .views-row{
	display: block;
	width: max-content;
	margin: 2px;
}
.view-id-tuotekuvat.view-display-id-block_3 .views-row:first-child{
	margin-left: 0px;
}
.view-id-tuotekuvat.view-display-id-block_3 .views-row:last-child{
	margin-right: 0px;
}
.view-id-tuotekuvat.view-display-id-block_3 .views-row .views-field-nothing,
.view-id-tuotekuvat.view-display-id-block_3 figure{
	width: max-content;
}
.view-id-tuotekuvat.view-display-id-block_3 .view-content{
	display: flex;
	overflow-x: hidden;
	width: 600px;
	scroll-behavior: smooth;
}
.view-id-tuotekuvat.view-display-id-block_3 .viewed-picture{
	padding: 5px 0px;
}
.view-id-tuotekuvat.view-display-id-block_3 .viewed{
	max-height: 100%;
	height: auto;
	width: 100%;
}
.view-id-tuotekuvat.view-display-id-block_3 .previous-flexscroll{
	position: absolute;
	left: 20px;
	display: block;
	z-index: 9;
	margin-top: 85px;
	font-size: 0px;
	width: 35px;
	height: 35px;
	background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="white" class="bi bi-chevron-left" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z"/></svg>');
	background-size: 30px;
	background-position: center;
	background-repeat: no-repeat;
	background-color: #2f2f2f;
	border: 0px solid #000;
	border-radius: 50%;
	opacity: 0.7;
	transition: background-color 0.3s;
}
.view-id-tuotekuvat.view-display-id-block_3 .next-flexscroll{
	position: absolute;
	right: 20px;
	display: block;
	z-index: 9;
	margin-top: 85px;
	font-size: 0px;
	width: 35px;
	height: 35px;
	background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="white" class="bi bi-chevron-right" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z"/></svg>');
	background-size: 30px;
	background-position: center;
	background-repeat: no-repeat;
	background-color: #2f2f2f;
	border: 0px solid #000;
	border-radius: 50%;
	opacity: 0.7;
	transition: background-color 0.3s;
}
.view-id-tuotekuvat.view-display-id-block_3 .next-flexscroll:hover, .view-id-tuotekuvat.view-display-id-block_3 .previous-flexscroll:hover, .view-id-tuotekuvat.view-display-id-block_3 .open-viewed-dialog:hover{
	background-color: #000;
}
.view-id-tuotekuvat.view-display-id-block_3 .open-viewed-dialog{
	position: absolute;
	display: block;
	z-index: 9;
	font-size: 0px;
	width: 35px;
	height: 35px;
	background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="white" class="bi bi-zoom-in" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zM13 6.5a6.5 6.5 0 1 1-13 0 6.5 6.5 0 0 1 13 0z"/><path d="M10.344 11.742c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1 6.538 6.538 0 0 1-1.398 1.4z"/><path fill-rule="evenodd" d="M6.5 3a.5.5 0 0 1 .5.5V6h2.5a.5.5 0 0 1 0 1H7v2.5a.5.5 0 0 1-1 0V7H3.5a.5.5 0 0 1 0-1H6V3.5a.5.5 0 0 1 .5-.5z"/></svg>');
	background-size: 20px;
	background-position: center;
	background-repeat: no-repeat;
	background-color: #2f2f2f;
	border: 0px solid #000;
	border-radius: 10px;
	opacity: 0.7;
	transition: background-color 0.3s;
	top: 20px;
	left: 20px;
}

/*flexslider*/
#views-blocktuotekuvat-block-1{
	display: none;
}
.flex-prev::before{
	font-size: 0px !important;
	width: 35px;
	height: 35px;
	background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="white" class="bi bi-chevron-left" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z"/></svg>');
	background-size: 30px;
	background-position: center;
	background-repeat: no-repeat;
	background-color: #2f2f2f;
	border: 0px solid #000;
	border-radius: 50%;
	opacity: 0.7;
	
}
.flex-next::before{
	font-size: 0px !important;
	width: 35px;
	height: 35px;
	background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="white" class="bi bi-chevron-right" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z"/></svg>');
	background-size: 30px;
	background-position: center;
	background-repeat: no-repeat;
	background-color: #2f2f2f;
	border: 0px solid #000;
	border-radius: 50%;
	opacity: 0.7;
}


@media screen and (min-width:60em) {
	img.align-left, figure.align-left, .field-type-image__figure.align-left {
	    margin: 0 2rem 2rem -2rem!important; 
	}
	.l-header { }
}
@media screen and (max-width: 1250px) {
	.l-navbar ul.menu-level-1 > li.is-parent { width: min-content; }
	.l-leaderboard { margin-top: 0; font-size: 80%; position: absolute; right: 10px; z-index: 9;}
	#rid-header-first { width: 200px; margin-top: 0; }
	.block-plugin-id--system-branding-block { margin-top: 10px; }
	.site-branding__name-link { margin-left: 0; font-size: 1rem; }
	.l-navbar { width: 70%; position: absolute; right: 15px; top: 30px; }
	.l-navbar ul.menu-level-1 > li { padding: 10px 10px; }
	.l-navbar ul.menu-level-1 > li > span > a.menu__link { line-height: 1em; }
	.menu a { font-size: 1rem; }
}
@media screen and (max-width: 1200px) {
	.nostokat { left: 10px; top: 10px;  }
	.nostotitle { left: 10px; bottom: 10px; right: 10px; }
	.nosto img { object-fit: cover; }
	.l-header {  }
	.l-navbar ul.menu-level-1 > li.is-parent > span.is-parent__wrapper::after { top: 10px; }
}	
@media screen and (max-width:1024px) {
	.path-frontpage .pr-features .regions { width: 100%; }
	.nostokat { left: 5px; top: 5px; line-height: 1.1em; font-size: 90%; padding-top: 5px; padding-bottom: 5px; }
	.nostotitle { left: 5px; bottom: 5px; right: 5px; line-height: 1.1em; font-size: 90%; }
}	

@media screen and (max-width:60em) {
	
	.path-frontpage .pr-features .regions > .region { width: 50%; }
	.ms-overlay .rm-toggle { top: 90px; }
	.ms-overlay.rm-is-open .rm-block__content { background-color: #fff; color: #000; width: 100%; }
	.ms-overlay.rm-is-open .rm-block__content .menu { width: 100%; background-color: #fff!important; }
	.ms-overlay .rm-block__content .menu .menu__link.is-active[href="/"], .ms-overlay .rm-block__content .menu .menu__link.is-active,
	.ms-overlay .rm-block__content .menu .menu__link { background-color: #fff!important; color: #000!important; }
	#rid-header-second { position: absolute; top: 0; width: 100%; }
	
}

@media screen and (max-width: 769px) {
	html[lang="fi"] .l-navbar { top: 0px }
	.rm-is-open .pr-navbar .regions { padding-bottom: 70vh; }
	.l-leaderboard { margin-top: -5px; }
	#block-kielenvaihtaja li a, #block-visitii-uusi-gtranslate .block__content a { color: #000; }
	.site-branding__logo-link{ padding-right: 0px; margin-right: 1rem; background: #95c9e1; }
	.site-branding img { max-height: 65px; padding: 4px 8px; filter: invert(1); }
	.path-frontpage .l-highlighted { height: 50vh; }
	.l-highlighted { min-height: 200px; 
	    background: -moz-linear-gradient(top, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 40%);
    	background: -webkit-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 40%);
    	background: linear-gradient(to bottom,rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 40%);
	}
	.views-field-field-taustakuva, .dia, .views-field-field-taustakuva .field-content { height: 100%; }
	.dia .views-field-field-taustakuva img { min-height: auto; }
	.page-wrapper { background-position: center 70px; background-size: auto 230px; }
	
	.nostokat { left: 15px; top: 15px;  }
	.nostotitle { left: 15px; bottom: 15px; right: 15px; }
	.view-nostot .view-rows { height: auto; -ms-grid-columns: 50% 50%; grid-template-columns: repeat(auto-fill, minmax(50%, 50%)); grid-auto-rows: auto; }
	.view-nostot .view-rows .views-row { height: auto; }
	.view-nostot .view-rows .views-row:nth-of-type(6n+1) { 
		grid-column-start: 1;
		grid-column-end: 1;
		grid-row: 1;
		-ms-grid-row: 1; 
	}
	.view-nostot .view-rows .views-row:nth-of-type(6n+2) { 
		grid-column-start: 2;
		grid-column-end: 2;
		grid-row: 1;
		-ms-grid-row: 1; 
	}
	.view-nostot .view-rows .views-row:nth-of-type(6n+3) { 
		grid-column-start: 1;
		grid-column-end: 1;
		grid-row: 2;
		-ms-grid-row: 2; 
	}
	.view-nostot .view-rows .views-row:nth-of-type(6n+4) { 
		grid-column-start: 2;
		grid-column-end: 2;
		grid-row: 2;
		-ms-grid-row: 2; 
	}
	.view-nostot .view-rows .views-row:nth-of-type(6n+5) { 
		grid-column-start: 1;
		grid-column-end: 1;
		grid-row: 3;
		-ms-grid-row: 3; 
	}
	.view-nostot .view-rows .views-row:nth-of-type(6n+6) { 
		grid-column-start: 2;
		grid-column-end: 2;
		grid-row: 3;
		-ms-grid-row: 3; 
		height: 250px;
	}

	.l-header { height: 75px; background: #fff; }
	.path-frontpage .l-header { height: 80px; background: #fff; }
	#rid-header-second { 
		padding-top: 0;
		background: #eee;
		border-top: 1px solid #ddd;
		border-bottom: 1px solid #ddd;
		padding: 5px 10px 2px 10px; 
	}
	.site-branding__name-link { color: #000!important; margin-left: 0; }
	.site-branding__text { background: transparent; }
	.site-branding__logo-img {  }
	.l-navbar { top: 2px;  }
	.pr-navbar .regions { background-color: #000!important; }
	.ms-horizontal .rm-block__content .menu { 
		width: 100%; 
		-webkit-box-orient: vertical;
	    -webkit-box-direction: normal;
	    -ms-flex-direction: column;
	    flex-direction: column;
	    display: none;
	}
	
	.pr-navbar { width: 100%; max-width: 100vw; }
	.l-navbar { position: relative; width: 100%; right: 0; }
	.l-navbar .rm-toggle { top: -60px; right: 10px; display: block; position: absolute;}
	.rm-block__content .menu > .menu__item { text-align: center; }
	.rm-block__content .menu > .menu__item ul li { text-align: left; }
	.l-navbar ul.menu-level-1 > li > span > a.is-active, .l-navbar nav ul.menu-level-1 > li.menu__item--active-trail > span > a { display: inline-block;  }
	.ms-horizontal .rm-block__content .menu-level-1 > li > span > .menu__link { display: inline-block; }
	.ms-horizontal .rm-block__content .menu-level-1 > li > span > .menu__link:focus { outline: 0; color: #95C9E1; color: #000; }
	.rm-is-open .rm-block__content .menu-level-1 { display: block!important; }
	.ms-horizontal .rm-block__content .menu .menu__item { }
	.l-navbar ul.menu { float: none; }
	.l-navbar ul.revealed { position: relative; top: 0; min-width: auto; }
	.l-navbar ul.menu-level-2.revealed { padding-bottom: 0;  }
	.l-navbar nav ul.menu-level-1 > li.is-parent a::after, .l-navbar ul.menu-level-1 > li > span.is-parent__wrapper::after {
	 	font-family: FontAwesome;
	    content: "\f061"!important;
	    padding-left: 5px;
	    float: right;
	    margin-top: 5px;
	}
	.l-navbar ul.menu-level-1 > li.is-parent > span.is-parent__wrapper::after {
		top: 0px;
	}
	 .l-navbar nav ul.menu-level-1 > li.is-parent.menu__item--expanded > span > a { }
	.l-navbar ul.menu-level-1 > li > span.is-parent__wrapper { height: 0; }
	.ms-horizontal .rm-block__content .menu-level-2 a.menu__link { padding: 6px 0 6px 0; }
	.ms-horizontal .rm-block__content .menu-level-2 a::before { top: 4px; }
	#rid-content, #rid-sidebar-second { width: 100%; }
	.diakehys { font-size: 14px; height: auto; padding: 30px 15px; line-height: 1.2em; }
	.diakehys p { line-height: 1.2em; }
	.diakehys h1 { font-size: 20px; line-height: 24px; padding-bottom: 5px; }
	.dia .views-field-field-taustakuva img { position: relative; }
	.views-slideshow-controls-bottom { display: none; }
	.path-frontpage .l-features { position: relative; top: 0; }
	.path-frontpage .pr-features .regions { padding: 0; position: relative; text-align: center; }
	.path-frontpage .pr-features .regions > .region { width: 100%; }
	.path-frontpage .l-main { min-height: auto!important; }
	#rid-features-second iframe { width: 300px!important; max-width: 100%!important; }
	.tapahtumat { max-width: 300px; margin: auto; }
	.views_slideshow_slide .views-field-body { bottom: 0; top: auto; }
	.views_slideshow_slide, .views_slideshow_cycle_teaser_section { height: 350px; overflow: hidden; }
	.l-highlighted .views-field-title { font-size: 1.2em; }
	h1 { font-size: 1.5em; }
	.field-node--body h2, .field-node--body h3, .field-node--body h4 { font-size: 1.2em; }
	h1.node__title { margin-top: 20px; }
	.l-highlighted .views-field-field-tags { font-size: 90%; }
	.breadcrumb { font-size: 90%; }
	.breadcrumb__title, .breadcrumb__list, .breadcrumb__list-item { display: inline-block; font-size: 11px; }
	.l-navbar ul.menu-level-1 > li.is-parent { width: auto; }
	#content-prefix .l-rw, #content-suffix .l-rw { padding: 30px 0px; }
	.path-frontpage #block-views-block-kohdekorttinostot-block-1 { padding: 30px 10px; }
	
		/* eu cookie compliance */
	.eu-cookie-compliance-default-button { margin-top: 0; }
	.eu-cookie-compliance-message h2 { font-size: 18px!important; }
	body .eu-cookie-withdraw-button { position: absolute; right: 0; top: 40%; font-size: 13px; }
	.eu-cookie-compliance-message, body .eu-cookie-compliance-message .eu-cookie-compliance-more-button { font-size: 14px; line-height: 1.1em; }
	/* end cookie compliance */
	
	/*slider flexslider*/
	#views-blocktuotekuvat-block-3{
		display: none;
	}
	#views-blocktuotekuvat-block-1{
		display: block;
	}
	.path-frontpage #rid-content h2 {
		font-size: 1.4rem !important;
	}
	.l-header{ width: 100%; }
	.l-navbar{ z-index: 9; }
}

@media screen and (max-width: 480px) {
	.block-plugin-id--system-branding-block { margin-top: 3px; margin-left: 3px; }
	.l-highlighted { background-size: 100% 100%; }
	.site-branding__logo-img { margin-left: 0px; }
	.path-frontpage .l-highlighted { height: auto; }
	.view-nostot .view-rows { display: block; }
	.view-nostot .view-rows .views-row { display: block!important; width: 100%; }
	.view-nostot .view-rows .views-row:lang(en) { display: inline-block; width: 100%;}
	.yla_visitii { font-size: 18px; padding-left: 10px; }
	.linkit a { padding-right: 5px; padding-left: 5px; font-size: 12px; }
	.views_slideshow_slide, .views_slideshow_cycle_teaser_section { height: 280px; overflow: hidden; }
	.diakehys { padding: 15px 15px; }
	.dia .views-field-field-taustakuva img { min-height: 100%; }
	.pr-subfeatures .container > div { width: 100%!Important; }
	.pr-subfeatures, #footer { padding-left: 15px; padding-right: 15px; text-align: center; }
	.view-kohdekorttinostot .views-row { width: 100%; padding: 10px 0; }
	ul.pager { margin-left: 0; padding-left: 0; margin-right: 0; padding-right: 0; }
	
}
@media screen and (max-width: 335px) {
	
}