﻿/* =========================
   Base typography (toive)
   - Body: Arial (regular/italic/bold/bold italic)
   - Headings: Georgia (regular/italic/bold/bold italic)
========================= */

body {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: 400;
	font-style: normal;
	text-align: center;
	margin: 15px 0;
	padding: 0;
	background: #fdf9db;
	background-repeat: repeat-x;
	color: #757575;
	font-size: 16px;
}

h1, h2, h3, h4, h5, h6 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: 400;
	font-style: normal;
	text-transform: none;
	color: #000;
	margin-top: 0;
}

strong, b {
	font-weight: 700;
}

em, i {
	font-style: italic;
}

a {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: 400;
	color: #753736;
	text-decoration: none;
}

	a:visited {
		color: #753736;
	}

	a:hover {
		text-decoration: underline;
	}

	a:active {
		outline: none;
	}

hr {
	border-color: #E7E1DB !important;
}

/* =========================
   Media
========================= */
img {
	vertical-align: top;
	margin: 0;
	padding: 0;
}

/* =========================
   Layout
========================= */
div#pagewrapper {
	margin: 0 auto;
	text-align: left;
	width: 850px;
}

div#container {
	text-align: left;
	margin: 0;
	padding: 0;
}

div#containerright {
	float: left;
	width: 780px; /* jos haluat 850 kaikkialle, muuta myös tämä */
	margin: 0;
	padding: 0;
}

/* Header */
div#header {
	clear: both;
	text-align: left;
	height: 120px;
	width: 850px;
	color: #fff;
	background: #fff url(logo2026.svg) no-repeat;
	background-position: 11% 100%;
	background-size: 200px auto;
}

/* Main block */
div#mainblock {
	text-align: left;
	width: 850px;
	margin: 0;
	padding: 0;
	background: #fff;
}

/* Nollataan vanhat taustagifit (kolumnitaustat) */
div#maintopbg,
div#background1,
div#background2,
div#background3,
div#footer,
div#footerleft {
	background: transparent;
}

div#footermiddle,
div#footerright {
	background: none;
}

div#maintopbg,
div#background1,
div#background2,
div#background3 {
	width: 100%;
}

div#leftcolumn {
	width: 61px;
	float: left;
	margin: 0;
	padding: 0;
}

div#content {
	display: inline-block;
	float: none;
	width: auto;
	margin: 0 70px 5px 70px;
	padding: 0;
}

div#main {
	padding: 10px 3px 5px 0;
	margin: 0;
}

div#clearer {
	clear: both;
	display: block;
	height: 1px;
	overflow: hidden;
	margin: 0;
	padding: 0;
}

/* Footer bar (yläpalkki masterissa) */
div#footer {
	clear: both;
	text-align: left;
	height: 27px;
	width: 850px;
	margin: 0 0 10px 0;
	padding: 0;
}

div#footerleft {
	height: 27px;
	width: 26px;
	float: left;
	margin: 0;
	padding: 0;
}

div#footermiddle {
	height: 27px;
	float: right;
	margin: 0;
	padding: 4px 0 0 0;
}

div#footerright {
	height: 27px;
	float: left;
	width: 18px; /* FIX */
	margin: 0;
	padding: 0;
}

/* Footer3 (alalinki) */
div#footer3 {
	width: 850px !important; /* FIX */
	clear: both;
	text-align: left;
	height: 27px;
	margin: 10px 0;
	padding: 0;
}

div#footerleft3 {
	height: 27px;
	float: left;
	margin: 0 0 0 70px;
	padding: 0;
}

div#footerright3 {
	height: 27px;
	float: right;
	margin: 0;
	padding: 4px 0 0 0;
}

/* =========================
   Forms
========================= */
input, textarea {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding-left: 2px;
}

	input[type="text"],
	input[type="password"],
	textarea {
		width: 100%;
		box-sizing: border-box;
		background: #fff;
		border: 2px solid #E7E1DB;
		padding: 0.5em 1em;
		margin: 5px 0;
	}

select {
	-moz-appearance: none;
	-webkit-appearance: button;
	background-color: #fff;
	background-repeat: no-repeat;
	background-position: 100% 50%;
	border: 2px solid #E7E1DB;
	border-radius: 0;
	box-shadow: none;
	color: #3d3d3d;
	font-size: 14px;
	padding: 0.5em 60px 0.5em 1em;
	font-family: Arial, Helvetica, sans-serif;
	font-style: normal;
	-webkit-padding-end: 20px;
	-webkit-padding-start: 2px;
	-webkit-user-select: none;
}

input[type="submit"],
#ctl00_ContentPlaceHolder1_usercontrol_link_edellinen,
#ctl00_ContentPlaceHolder1_usercontrol_link_seuraava {
	background: #fff;
	border: 2px solid #E7E1DB !important;
	padding: 0.5em 1.5em;
	margin-top: 0.5em;
	text-transform: uppercase;
	font-family: Arial, Helvetica, sans-serif !important;
	font-size: 12px !important;
	color: #3d3d3d !important;
	font-weight: 700;
	width: auto !important;
}

input[type="checkbox"] {
	background: #fff;
	width: 15px;
	height: 15px;
	border: 2px solid #E7E1DB;
	padding: 0 !important;
	margin-right: 10px;
}

#ctl00_ContentPlaceHolder1_txtDLHiddenLomake {
	display: none;
}

/* =========================
   Tables
========================= */
table tbody tr {
	border-top: 1px solid #F1EDE9;
}

	table tbody tr td {
		background: #fff !important;
		padding: 5px 0;
	}

		table tbody tr td b {
			font-weight: 400;
			color: #753736;
			text-transform: initial;
		}

/* Yleiset label/span-tekstit (aiemmin Montserrat) */
table tr td span[id^="ctl00_ContentPlaceHolder1_usercontrol_lbl"],
#main table td span,
#ctl00_ContentPlaceHolder1_Login1 tbody table tbody tr:first-child td,
label[for="ctl00_ContentPlaceHolder1_Login1_UserName"],
label[for="ctl00_ContentPlaceHolder1_Login1_Password"] {
	font-family: Arial, Helvetica, sans-serif;
}

/* Otsikkosäännöt jotka näkyi gridissä */
#main table td h2 span {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: 400;
	text-transform: none;
	color: #753736;
	font-size: 18px;
}

/* =========================
   Login
========================= */
#ctl00_ContentPlaceHolder1_Login1 {
	background: #fff !important;
	border: none !important;
}

	#ctl00_ContentPlaceHolder1_Login1 table {
		width: 400px;
	}

		#ctl00_ContentPlaceHolder1_Login1 table td {
			text-align: left;
		}

		#ctl00_ContentPlaceHolder1_Login1 table input[type="text"],
		#ctl00_ContentPlaceHolder1_Login1 table input[type="password"] {
			width: 215px !important;
		}

		#ctl00_ContentPlaceHolder1_Login1 table tbody tr:first-child td:first-child {
			background: #fff !important;
			color: #753736 !important;
			text-transform: uppercase;
			padding-bottom: 10px;
		}

label[for="ctl00_ContentPlaceHolder1_Login1_UserName"],
label[for="ctl00_ContentPlaceHolder1_Login1_Password"] {
	font-weight: 700;
	font-size: 14px;
	text-transform: uppercase;
	color: #3d3d3d;
}

/* =========================
   Hakemukset / lomakkeet
========================= */
#ctl00_ContentPlaceHolder1_gridviewHakemukset {
	margin-top: 10px;
}

	#ctl00_ContentPlaceHolder1_gridviewHakemukset tbody:first-child tr:first-child,
	#ctl00_ContentPlaceHolder1_ctl00_gridLomakkeet tbody:first-child tr:first-child {
		font-family: Arial, Helvetica, sans-serif;
		font-weight: 400;
		background: transparent !important;
		color: #3d3d3d !important;
		text-transform: uppercase;
		border-top: none;
		font-size: 14px;
	}

#ctl00_ContentPlaceHolder1_gridviewHakemukset_ctl01_lblOtsakeHakemus,
#ctl00_ContentPlaceHolder1_gridviewHakemukset_ctl01_lblOtsakeTila {
	font-size: 14px;
}

#ctl00_ContentPlaceHolder1_dropAvoimetHaut {
	width: 350px !important;
}

#ctl00_ContentPlaceHolder1_ctl00_gridLomakkeet {
	width: 100%;
}

	#ctl00_ContentPlaceHolder1_ctl00_gridLomakkeet tr td:first-child {
		width: 90% !important;
		padding: 15px 0;
	}

		#ctl00_ContentPlaceHolder1_ctl00_gridLomakkeet tr td:first-child span {
			color: #753736 !important;
			font-style: oblique !important;
			font-family: Arial, Helvetica, sans-serif;
			font-weight: 400;
			font-size: 16px;
		}

label[for="ctl00_ContentPlaceHolder1_usercontrol_cbTiedeKokovuosi"] {
	font-family: Arial, Helvetica, sans-serif;
	color: #757575;
	font-size: 16px;
	text-transform: initial;
}

/* =========================
   Kysymysmerkki (tooltip)
========================= */
.kysymysmerkki,
.kysymysmerkkityhja {
	position: relative;
	height: 17px;
	width: 17px;
	background-position: top left;
	background-repeat: no-repeat;
}

.kysymysmerkki {
	background-image: url(kysymys.svg);
}

.kysymysmerkkityhja {
	background-image: url(kysymystyhja.gif);
}

.kysymysmerkkiToolTip,
.kysymysmerkkiToolTipRight {
	position: absolute;
	top: 0;
	display: none;
	width: 400px;
	padding: 5px;
	border: 1px solid #ffffff;
	background-color: #eeeeee;
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
}

.kysymysmerkkiToolTip {
	left: 26px;
}

.kysymysmerkkiToolTipRight {
	right: 26px;
}

.kysymysmerkkiToolTip span {
	font-size: 12px !important;
	font-family: Arial, Helvetica, sans-serif !important;
}

/* =========================
   Ylänavigaatio
========================= */
#ctl00_ContentPlaceHolder1_ctl00_panelYlaNavigaatio td a,
#ctl00_ContentPlaceHolder1_usercontrol_panelYlaNavigaatio td a {
	font-size: 0.85em;
	border-right: none;
	padding-right: 0;
	padding-left: 2px;
	text-transform: uppercase;
}

#ctl00_ContentPlaceHolder1_ctl00_panelYlaNavigaatio td:first-child a,
#ctl00_ContentPlaceHolder1_usercontrol_panelYlaNavigaatio td:first-child a {
	font-size: 0.85em;
	border-right: 1px solid #F1EDE9;
	padding-right: 5px;
	text-transform: capitalize;
}

#ctl00_ContentPlaceHolder1_ctl00_panelYlaNavigaatio td b a,
#ctl00_ContentPlaceHolder1_usercontrol_panelYlaNavigaatio td b a {
	text-decoration: underline !important;
}

/* =========================
   Popup
========================= */
.datalink_popup {
	z-index: 1001;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	position: fixed;
}

.datalink_popup_overlay {
	z-index: 1002;
	position: fixed;
	top: 0%;
	left: 0%;
	width: 100%;
	height: 100%;
	background-color: black;
	text-align: center;
	-moz-opacity: 0.8;
	opacity: .80;
	filter: alpha(opacity=80);
}

.datalink_popup_content {
	z-index: 1003;
	width: 640px;
	height: 400px;
	top: 50%;
	left: 50%;
	margin: -200px 0 0 -320px;
	position: fixed;
	padding: 16px;
	border: 16px solid #37648c;
	background-color: white;
	overflow: auto;
}

.datalink_popup_contentv {
	z-index: 1003;
	top: 25%;
	left: 25%;
	width: 50%;
	height: 50%;
	position: fixed;
	padding: 16px;
	border: 16px solid #37648c;
	background-color: white;
	overflow: auto;
}
