html {
	font-size: 15px;
}

body {
	font-family: Helvetica, Arial, sans-serif;
	font-weight:normal;
	line-height : 1.5em;
	font-size: 1rem;
	color: #333333;
	text-decoration : none;
	margin-top: 0;
}

/* Text meant only for screen readers. */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
}

.screen-reader-text:focus {
	background-color: #ffffff;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #582d51;
	display: block;
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; 
}

.page {
	max-width: 1024px;
	margin: 0 auto;
}

.content {
	padding: 20px 0;
}


td {
	padding-left: 0px;
	padding-right: 0px;
}

input, select {
	font-size: 15px;	
	font-size: 1rem;
}


p {
	font-weight:normal;
	font-size: 15px;
	font-size: 1rem;
	color: #333333;
	text-decoration : none;
}

p.lala-henkilo-palkinnot {
	margin-top: 0;
	margin-bottom: 0;
}


a {
font-weight: normal;
font-size: 15px; 
font-size: 1rem;
color: #00768B;  
text-decoration : none;   
}

a:hover { 
font-weight: normal;
color: #00768B;  
text-decoration : none;   
}

h1 { 
font-weight: bold; 
font-size: 15px; font-size: 1rem;
color: #000000;  
text-decoration : none;  
}

h2 { 
font-weight: bold; 
font-size: 14px; font-size: 0.9333rem;
color: #582d51;  
text-decoration : none;   
}

h3 {font-weight: bold;font-size: 13px;font-size: 0.9rem;color: #582d51;text-decoration : none;}

.bold {
font-family: Arial, Helvetica, sans-serif; 
font-weight: bold; line-height : 12pt;
font-size: 15px; font-size: 1rem;
color: #000000;  
text-decoration : none;   
}

.abc {
	font-weight: bold;
	font-size: 15px;
	font-size: 1rem;
	color: #993333;
	text-decoration : none;
}

.abc:hover {
	color: #CC6600;
	text-decoration : none;
}

.hakuotsikko {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: end;
	-ms-flex-align: end;
	 align-items: flex-end;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	padding: 4px 0;
}

.hakuotsikko h2 {
	margin: 0;
}

.alanavi {
	font-family: Montserrat, Helvetica, Arial, sans-serif;
	font-weight: bold;
	font-size: 13px;
	font-size: 0.8666rem;
	color: rgb(88,45,81);
	text-decoration : none;
}

.alanavi:hover {
	font-family: Montserrat, Helvetica, Arial, sans-serif;
	color: rgb(88,45,81);
	text-decoration : none;
}

.alanavi_aktiv {
	font-family: Montserrat, Helvetica, Arial, sans-serif;
	font-weight: bold;
	font-size: 13px;
	font-size: 0.8666rem;
	color: #00768b;
	text-decoration: none;
	text-transform: uppercase;
}

.footer-hakunavi .alanavi,
.footer-hakunavi .alanavi_aktiv,
.paging .alanavi_aktiv,
.paging .alanavi {
	font-size: 1rem;
}

div.paging {
	width: 100%;
	margin: 0 auto;	
}

.alanavi2 {
	font-family: Montserrat, Helvetica, Arial, sans-serif;
	font-weight: bold;
	font-size: 13px;
	color: rgb(88,45,81);
	text-decoration : none;
	text-transform: uppercase;
}

.alanavi2:active {
	font-family: Montserrat, Helvetica, Arial, sans-serif;
	font-weight: bold;
	font-size: 13px;
	font-size: 0.8666rem;
	color: rgb(88,45,81);
	text-decoration : none;
}

.alanavi2:hover {
	font-family: Montserrat, Helvetica, Arial, sans-serif;
	font-weight: bold;
	font-size: 13px;
	font-size: 0.8666rem;
	color: rgb(88,45,81);
	text-decoration: none;
}

.alanavi_btw {
	font-weight: bold;
	font-size: 13px;
	color: rgb(88,45,81);
	text-decoration : none;
}

.hakuehdot, .hakutulosjarjestys {
	margin: 1em 0 1em 0;
}

.katko {
	font-weight: normal;
	font-size: 15px;
	font-size: 1rem;
	color: #666666;
	text-decoration : none;
}

.lajittelu_aktiv {
	font-weight: normal;
	font-size: 15px;
	font-size: 1rem;
	color: #000;
	text-decoration : none;
}

.lajittelu_aktiv:hover {
	font-weight: normal;
	font-size: 15px;
	font-size: 1rem;
	color: #000;
	text-decoration : none;
}

.lajittelu_pass {
	font-weight: normal;
	font-size: 15px;
	color: #00768B;
	text-decoration : none;
}

.lajittelu_pass:hover {
	font-weight: normal;
	font-size: 15px;
	color: #00768B;
	text-decoration : none;
}

.filter-help summary,
.nimeke {
	font-weight: normal;
	font-size: 11px;
	font-size: 0.7333rem;
	color: #666666;
	text-decoration : none;
	text-transform: uppercase;
}

.filter-help {
	
}

.filter-help summary {
	cursor: pointer;
	color: #000;
}

.lala-lower-case {
	text-transform: lowercase;
}

.listarivi {
	font-family: Helvetica, Arial, sans-serif;
	font-weight:normal;
	font-size: 14px;
	font-size: 0.9333rem;
	color: #000;
	text-decoration : none;
}

.listarivi:hover {
	font-weight: normal;
	font-size: 14px;
	font-size: 0.9333rem;
	color: #000;
	text-decoration : none;
}

.listarivi.tuet {
	display: flex;
	font-size: 80%;
	gap: 0.5em;
	align-items: center;
}

.listarivi.tuet img {
	width: 14px;
	object-fit: contain;	
}

.listaotsikko {
	font-weight: bold;
	font-size: 10px;
	font-size: 0.666rem;
	color: #333333;
	text-decoration : none;
	text-transform: uppercase;
}

.otsikko12 {
	font-family: Montserrat, Helvetica, Arial, sans-serif;
	font-weight: bold;
	font-size: 14px;
	font-size: 0.9333rem;
	color: rgb(88,45,81);
	text-decoration : none;
}

.otsikko13 {
	font-family: Montserrat, Helvetica, Arial, sans-serif;
	font-weight: bold;
	font-size: 15px;
	color: rgb(88,45,81);
	text-decoration : none;
}

.otsikko14 {
	font-family: Montserrat, Helvetica, Arial, sans-serif;
	font-weight: bold;
	font-size: 16px;
	color: rgb(88,45,81);
	text-decoration : none;
}

.otsikko16 {
	font-family: Montserrat, Helvetica, Arial, sans-serif;
	/*font-family: Georgia, "Times New Roman", Times, serif;*/
	font-weight: bold;
	font-size: 22px;
	font-size: 1.4666rem;
	color: rgb(88,45,81);
	text-decoration : none;
	margin-bottom: 0;
}

.lala-henkilo-palkinnot .listarivi,
.lala-henkilo-palkinnot .listaotsikko {
	color: rgb(88,45,81);
}

body {
background-color: White;
}


/* New search UI */

a img {
	border: none;
}

h1.searchTitle {
	color: #333;	
}

a.removeCondition, a.help {
	position: absolute;
	right: 0;
	top: 18px;
	width: 18px;
	height: 18px;
}

a.removeCondition {
	/*display: none;*/
	right: 0;
}

img.help {
	margin-left: 4px;
	vertical-align:-4px;
}

a.help {
	right: 23px;
}

.condition {
	border-bottom: 3px dotted #D4D4D4;
	padding: 20px 0 15px 0;
	position: relative;
	display: flex;
	gap: 10px;
	align-items: flex-start;
}

.selType {
	margin: 0 0 0 0;
}

a.duplicateCondition {
	display: block;
	position: absolute;
	right: 25px;
	top: 18px;
	width: 18px;
	height: 18px;
}

a.addCondition, a.removeConditions {
	text-transform: uppercase;
	color: #333333;
	display: block;
	margin-top: 15px;
	max-width: 250px;
}

a.removeConditions {
	float: right;
}

a.addCondition {
	float: left;
}


a.addCondition img {
	vertical-align: top;
	margin-right: 5px;
}

a.removeConditions img {
	vertical-align: top;
	margin-left: 10px;
}

.lala-add-condition-help {
	margin-bottom: -5px;
	width: 100%;
	max-width: 512px;
}

.lala-add-condition-help-myydyt {
	display: none;	
}

.lala-form-myydyt .lala-add-condition-help {
	display: none;
}

.lala-form-myydyt .lala-add-condition-help-myydyt {
	display: block;	
}

.specialCondition {
	clear: both;
	margin: 60px 0 5px 0;
	font-size: 11px;
	font-size: 0.7333rem;
	color: #666666;
	text-transform: uppercase;
}

.specialCondition-alert {
	color: #CD453E;
	margin-top: 0.5em;
	display: none;
}

fieldset {
	border: 1px solid #ccc;
	margin-bottom: 0;
}

fieldset + fieldset {
	margin-top:10px;
}

.specialConditionStrong {
	font-weight: bold;
}

/*
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #333;
	border: 1px solid #333;
	border-radius: 0;
	padding: 3px;
	padding: 11px 15px;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #333;
}
*/

input[type=submit] {
	background-color: rgb(88,45,81);
	border: none;
	color: #fff;
	padding: 8px 30px;
	margin-top: 15px;
	cursor: pointer;
	font-size: 15px;
	font-size: 1rem;
}

input[type=submit]:hover {
	background-color: rgb(88,45,81);;
}

input[type=submit]:active {
	outline: 0; position: relative; top: 1px;
}

input[type=button] {
	background-color: #993333;
	border: none;
	color: #fff;
	padding: 8px 30px;
	margin-top: 15px;
	cursor: pointer;
	font-size: 15px;
}

input[type=button]:hover {
	background-color: #333;
}

input[type=button]:active {
	outline: 0; position: relative; top: 1px;
}

/*
select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	
	background-image: url(img/arrow_down.svg);
	background-repeat: no-repeat;
	background-size: 13px;
	background-position: calc(100% - 10px) center;
	background-color: transparent;

	box-sizing: border-box;
	max-width: 300px;
	width: 100%;
	padding-right: 25px;
	margin-right: 0.5em;
	color: black;
	border: 1px solid #001a70;
	background-color: transparent;
	border-radius: 0;
	padding: 11px 15px;
}
*/


.lala-radio-checkbox-big {
	display: flex;
	gap: 1em;
	flex-wrap: wrap;
	text-transform: uppercase;
	border-bottom: 3px dotted #D4D4D4;
	padding: 0.25em 0 1em 0;
	
}

/*
.lala-radio-checkbox-big input[type=radio],
.lala-radio-checkbox-big input[type=checkbox] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

.lala-radio-checkbox-big input[type=radio]+span,
.lala-radio-checkbox-big input[type=checkbox]+span {
	display: flex;
	align-items: center;
	position: relative;
	padding-left: 30px;
	margin-bottom: 12px;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	line-height: 1em;
}

.lala-radio-checkbox-big input[type=radio]+span::before,
.lala-radio-checkbox-big input[type=checkbox]+span::before {
	content: "";
	position: absolute;
	left: 0;
	height: 21px;
	width: 21px;
	background-color: transparent;
	border: solid 2px #333333;;
}

.lala-radio-checkbox-big input[type=radio]+span::before {
	border-radius: 100%;
}

.lala-radio-checkbox-big input[type=radio]+span::after,
.lala-radio-checkbox-big input[type=checkbox]+span::after {
	content: "";
	position: absolute;
	display: none;
	left: 6px;
	width: 13px;
	height: 13px;
	background-color: #333333;;
}

.lala-radio-checkbox-big input[type=radio]+span::after {
	border-radius: 100%;
}

.lala-radio-checkbox-big input[type=radio]:checked+span::after,
.lala-radio-checkbox-big input[type=checkbox]:checked+span::after {
  display: block;
}
*/

.condition label {
	display: inline-block;
	margin-top: -15px;
	line-height: 1.3;
}

div.filter-box {
	display: inline-flex;
	gap: 10px;
	align-items: flex-end;
	flex-wrap: wrap;
}

input.filter-field + select.filter-field,
select.filter-field + input.filter-field,
label.filter-field + label.filter-field {
}

.logo-banner {
	background-color: #582d51;	
	padding: 12px 20px 15px 20px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: end;
	-ms-flex-align: end;
	align-items: flex-end;
}

.logo-banner div {
	/* max-width: 50%; */
}

.mobile {
	display: none;
}


.logo-banner td {
	padding-left: 20px;
	padding-right: 20px;	
}

.logot {
	margin-top: 0px;
	margin-bottom: 0px;	
}

.title-banner  {
	margin-top: 30px;	
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
		-ms-flex-pack: justify;
			justify-content: space-between;
	-webkit-box-align: end;
		-ms-flex-align: end;
			align-items: flex-end;
	-ms-flex-wrap: wrap;
		flex-wrap: wrap;
}

.banner {
	margin-top: 5px;
	margin-bottom: 5px;	
	max-width: 100%;
	height: auto;
}

.hr {
	border-bottom: 2px solid rgb(88,45,81);
	/*
	border-bottom: 3px dotted #D4D4D4;
	border-bottom-width: 3px;
	border-bottom-style: dotted;
	border-bottom-color: rgb(212, 212, 212);
	*/
}

.hr-dot {
	border-bottom: 3px dotted #D4D4D4;
	border-bottom-width: 3px;
	border-bottom-style: dotted;
	border-bottom-color: rgb(212, 212, 212);
	margin: 25px 0;
}

.hr img, .hr-dot img {
	display: none;	
}

table {
	font-size: 15px;
	font-size: 1rem;
	line-height: 1.5;
}

.table-lista-row td, td.listaotsikko {
	padding: 0 4px 0 0;
}

.tekijataulu-details .otsikko12,
caption {
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}

.tekijataulu-details .otsikko12 {
	border-bottom: none;
}

table.tekijataulu {
	margin-top: 20px;
	line-height: 1.25;
}

.tekijataulu-details table.tekijataulu {
	border-top: 1px solid #ccc;
	margin-top: 0.25em;
	padding-top: 0.35em;
	margin-bottom: 0.5em;
}

.tekijataulu-details {
	margin-top: 0.25em;
	margin-bottom: 0.25em;
}

.tekijataulu-details summary.otsikko12 {
	cursor: pointer;
}

table.tekijataulu td {
	padding-bottom: 0.25em;	
}


th, caption {
	text-align: left;
	padding-top: 4px;
	padding-bottom: 4px;
}

th.listaotsikko {
	line-height: 1.1;
	padding: 5px 5px 5px 0;
}

.paging {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}

.sulje-haitarit span:first-child {
	display: none;
}

.avaa-haitarit span:last-child {
	display: none;
}

.footer-hakunavi {
	text-align: right;
	margin-top: 20px;
	display: -webkit-box;
	  display: -ms-flexbox;
	  display: flex;
	-webkit-box-align: end;
	-ms-flex-align: end;
	align-items: flex-end;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	padding: 4px 0;
}

.lala-select-nimeke option {
	display: none;
}
.lala-select-nimeke option[value="nimeke_0"],
.lala-select-nimeke option[value="nimeke_1"],
.lala-select-nimeke option[value="nimeke_2"] {
	display: block;
}

.lala-select-tekija option {
	display: none;
}
.lala-select-tekija option[value^="tekija"] {
	display: block;
}

.lala-select-kaannoskieli option {
	display: none;
}
.lala-select-kaannoskieli option[value="kaannoskieli"] {
	display: block;
}

.lala-select-julkaisuvuosi option {
	display: none;
}
.lala-select-julkaisuvuosi option[value="julkaisuvuosi"] {
	display: block;
}

.lala-select-kohderyhma option {
	display: none;
}
.lala-select-kohderyhma option[value="kohderyhma"] {
	display: block;
}

.lala-select-genre option {
	display: none;
}
.lala-select-genre option[value="genre"] {
	display: block;
}

.lala-select-luokka option {
	display: none;
}
.lala-select-luokka option[value="luokka"] {
	display: block;
}

.lala-select-myyja option {
	display: none;
}
.lala-select-myyja option[value="myyja"] {
	display: block;
}

.lala-select-myyntiajankohta option {
	display: none;
}
.lala-select-myyntiajankohta option[value="myyntiajankohta"] {
	display: block;
}

.lala-form-myydyt option[value="julkaisuvuosi"] {
	display: none;	
}

.lala-select-additional option[value="nimeke_0"],
.lala-select-additional option[value="nimeke_1"],
.lala-select-additional option[value="nimeke_2"],
.lala-select-additional option[value="nimeke_6"],
.lala-select-additional option[value="nimeke_7"],
.lala-select-additional option[value^="tekija"],
.lala-select-additional option[value="kaannoskieli"],
.lala-select-additional option[value="julkaisuvuosi"],
.lala-select-additional option[value="kohderyhma"],
.lala-select-additional option[value="genre"],
.lala-select-additional option[value="luokka"],
.lala-form-myydyt .lala-select-additional option[value="myyntiajankohta"],
.lala-form-myydyt .lala-select-additional option[value="myyja"],
.lala-form-myydyt .lala-select-additional option[value="palkinto"] {
	display: none;
}


details.filter-help {
	width: 100%;
	margin-bottom: -8px;
}

details.filter-help ul {
	margin: 0;
	padding-left: 1em;
}


@media screen and (max-width: 500px) {

	.mobile {
		display: block;
	}
	.desktop {
		display: none;
	}
	.logo-banner img {
		max-width: 70%;
		height: auto;
	}

	.logo-banner .fili-logo .mobile {
		text-align: right;
	}
}	

/*
@media 
only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px)  {
*/

@media screen and (max-width: 1024px) {
	.condition {
		flex-direction: column;		
	}

	input, select {
		max-width: 150px;	
		border: 1px solid #bbb;
	}

	.selType, label, .filter-box > input,  .filter-box > select, label.filter-field + label.filter-field {
		margin: 0 5px;
	}

	select.selType {
		width: 100%;
		max-width: 80%;
	}


	div.filter-box, .specialCondition label {
		display: flex;
	}

	/* Force table to not be like tables anymore */
	table.tekijataulu, .tekijataulu thead,  .tekijataulu tbody,  .tekijataulu th,  .tekijataulu td,  .tekijataulu tr,  .tekijataulu caption { 
		display: block; 
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	 .tekijataulu th { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}

	.table-lista-row {
		margin-top: 15px;
	}
	
	.table-lista-row td, td.listaotsikko { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee; 
		position: relative;
		padding-left: 50%; 
		min-height: 20px;
	}

	.table-lista-row img {
		display: block;
		margin-top: 5px;
	}
	
	 .tekijataulu td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 4px;
		left: 4px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
		font-weight: bold;
		font-size: 10px;
		font-size: 0.666rem;
		color: #333333;
		text-decoration: none;
		text-transform: uppercase;	
	}
	
}