/* COMMON */
@font-face {
    font-family: 'New Hero';
    font-style: normal;
    font-weight: 600;
    src: url('../fonts/HeroNew-Regular.ttf');
}

@font-face {
    font-family: 'New Hero';
    font-style: normal;
    font-weight: 600;
    src: url('../fonts/HeroNew-Bold.ttf');
    font-weight: bold;
}
/* suneditor */
.sun-editor-editable p {
    padding: 0 !important;
}

.html_elem p {
    padding: 0 !important;
}

.sun-editor-editable {
	padding: 0 16px !important;
}

.sun-editor .se-list-layer {
	height: 212px !important;
}

/* jquery ui */
.ui-dialog {
	z-index: 50;
}

.ui-accordion .ui-accordion-header .ui-icon {
    position: absolute;
    left: .5em;
    top: 50%;
    margin-top: -8px;
}

.ui-dialog-titlebar-close {
	visibility: hidden;
}
/* eof jquery ui */
#spinner-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: rgba(0,0,0,.51);
    z-index: 999;
    opacity: 1;
    transition: all 0.5s;
    display: none;
}

.align-center {
	position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.width1dot5p {
	width: 1.5%;
}

#okmHeader {
	background-color:#5A8D84;
	height: 104px;
}

#okmHeaderImg {
	height: 94px;
    width: auto;
}

#okmHeaderText {
	color: white;
    font-size: 25px;
    letter-spacing: 0.06em;
}

.piped span {
  border-left: 1px solid #ccc;
  padding: 0 10px;
}
.piped span:first-child {
  border-left: none;
  padding-left: 0;
}

#okmHeaderTextFormer {
	font-weight: normal;
	font-family: Serif;
}

#okmHeaderTextLater {
	font-weight: normal;
	font-family: system-ui;
    padding-left: 18px;
}

.flexCent {
	display: flex;
	align-items: center;
}

.pr1p {
	padding-right: 1px;
}

.pl4p {
    padding-left: 4px;
}

.pl8p {
	padding-left: 8px;
}

.pl18p {
	padding-left: 18px;
}

.pb1em {
	padding-bottom: 1em;
}

.pb2em {
	padding-bottom: 2em;
}

.pb10p {
	padding-bottom: 10px;
}

.pb20p {
	padding-bottom: 20px;
}

.mt01em {
	margin-top: 0.1em;
}

.mt1em {
	margin-top: 1em;
}

.mt2p {
	margin-top: 2px;
}

.mt4p {
	margin-top: 4px;
}

.mt5p {
	margin-top: 5px;
}

.mt40p {
	margin-top: 40px;
}

.mtn20p {
	margin-top: -20px;
}

.mb1p {
	margin-bottom: 1px;
}

.mb2p {
	margin-bottom: 2px;
}

.mb4p {
	margin-bottom: 4px;
}

.mb6p {
	margin-bottom: 6px;
}

.mb06em {
	margin-bottom: 0.6em;
}

.mb1em {
	margin-bottom: 1em;
}

.my4p {
	margin: 4px 0px;
}

.my05em {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

.no_border {
    border: 0;
}

.no_padding {
	padding: 0;
}

.no_border_pad {
	border: 0;
	padding: 0;
}

.no_space {
	border: 0;
	padding: 0;
	margin: 0;
}

.w68per {
	width: 68%;
}

.posAbs {
	position: absolute;	
}

.posRel {
	position: relative;	
}

#tktHeaderText {
    position: absolute;
    top: 105px;
    left: 20px;
    z-index: 500;
    font-size: 25px;
    color: #3d3d3d;
    font-family: 'Open Sans';
    margin: 0;
    font-weight: normal;
}

.inactive a{
	color: #aaaaaa !important;
}

#virka {
	background: #330033;
}

/* testiymparistossa */
/*#virka {
	background: #E4A7AE;
}*/

body {
    font-family: "Open Sans", sans-serif;
   	font-size: 14px;
   	font-weight: lighter;
   	color: #191919;
   	margin-top: 0px;
	margin-left: 0px;
    margin-right: 0px;
}

table caption {
    font-weight: lighter;
    font-size: 18px;
}

.header h1 {
	margin-block-start: 0.22em;
    margin-block-end: 0.22em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}

.grid-tblel {
	display: grid;
	display:-ms-grid;
	grid-template-columns: 3.8fr 26.5fr 22.6fr 17.4fr 29.7fr;
	-ms-grid-columns: 3.8fr 26.5fr 22.6fr 17.4fr 29.7fr;
    grid-template-rows: auto;
    -ms-grid-rows: auto;
	grid-gap: 2px;
}

/* MV Header grid*/
.grid-2cols113887 {
	display: grid;
	display:-ms-grid;
	grid-template-columns: 1.13fr 8.87fr;
	-ms-grid-columns: 1.13fr 8.87fr;
    grid-template-rows: auto;
    -ms-grid-rows: auto;
	grid-gap: 2px;
}


.grid-2cols5050 {
	display: grid;
	display:-ms-grid;
	grid-template-columns: 5fr 5fr;
	-ms-grid-columns: 5fr 5fr;
    grid-template-rows: auto;
    -ms-grid-rows: auto;
	grid-gap: 2px;
}

.grid-2cols50 {
	display: grid;
	display:-ms-grid;
	grid-template-columns: 50fr 50fr;
	-ms-grid-columns:50fr 50fr;
    grid-template-rows: auto;
    -ms-grid-rows: auto;
	grid-gap: 2px;
}

.grid-2cols37 {
	display: grid;
	display:-ms-grid;
	grid-template-columns: 3fr 7fr;
	-ms-grid-columns: 3fr 7fr;
    grid-template-rows: auto;
    -ms-grid-rows: auto;
	grid-gap: 2px;
}

.grid-2cols1090 {
	display: grid;
	display:-ms-grid;
	grid-template-columns: 1fr 9fr;
	-ms-grid-columns: 1fr 9fr;
    grid-template-rows: auto;
    -ms-grid-rows: auto;
	grid-gap: 2px;
}

.grid-2cols1387 {
	display: grid;
	display:-ms-grid;
	grid-template-columns: 1.3fr 8.7fr;
	-ms-grid-columns: 1.3fr 8.7fr;
    grid-template-rows: auto;
    -ms-grid-rows: auto;
	grid-gap: 2px;
}


.grid-2cols1585 {
	display: grid;
	display:-ms-grid;
	grid-template-columns: 1.5fr 8.5fr;
	-ms-grid-columns: 1.5fr 8.5fr;
    grid-template-rows: auto;
    -ms-grid-rows: auto;
	grid-gap: 2px;
}

.grid-2cols2080 {
	display: grid;
	display:-ms-grid;
	grid-template-columns: 2fr 8fr;
	-ms-grid-columns: 2fr 8fr;
    grid-template-rows: auto;
    -ms-grid-rows: auto;
	grid-gap: 2px;
}

.grid-2cols3862 {
	display: grid;
	display:-ms-grid;
	grid-template-columns: 38fr 62fr;
	-ms-grid-columns:38fr 62fr;
    grid-template-rows: auto;
    -ms-grid-rows: auto;
	grid-gap: 2px;
}

.grid-2cols8020 {
	display: grid;
	display:-ms-grid;
	grid-template-columns: 8fr 2fr;
	-ms-grid-columns: 8fr 2fr;
    grid-template-rows: auto;
    -ms-grid-rows: auto;
	grid-gap: 2px;
}

.grid-3colseven {
	display: grid;
	display:-ms-grid;
	grid-template-columns: 3.33fr 3.33fr 3.34fr;
	-ms-grid-columns: 3.33fr 3.33fr 3.34fr;
    grid-template-rows: auto;
    -ms-grid-rows: auto;
	grid-gap: 2px;
}

.grid-3cols205030 {
	display: grid;
	display:-ms-grid;
	grid-template-columns: 2fr 5fr 3fr;
	-ms-grid-columns: 2fr 5fr 3fr;
    grid-template-rows: auto;
    -ms-grid-rows: auto;
	grid-gap: 2px;
}

.grid-3cols404020 {
	display: grid;
	display:-ms-grid;
	grid-template-columns: 4fr 4fr 2fr;
	-ms-grid-columns: 4fr 4fr 2fr;
    grid-template-rows: auto;
    -ms-grid-rows: auto;
	grid-gap: 2px;
}

.grid-3cols602020 {
	display: grid;
	display:-ms-grid;
	grid-template-columns: 6fr 2fr 2fr;
	-ms-grid-columns: 6fr 2fr 2fr;
    grid-template-rows: auto;
    -ms-grid-rows: auto;
	grid-gap: 2px;
}

.grid-4cols25 {
	display: grid;
	display:-ms-grid;
	grid-template-columns: 25fr 25fr 25fr 25fr;
	-ms-grid-columns:25fr 25fr 25fr 25fr;
    grid-template-rows: auto;
    -ms-grid-rows: auto;
	grid-gap: 2px;
}

.grid-4cols30303010 {
	display: grid;
	display:-ms-grid;
	grid-template-columns: 30fr 30fr 30fr 10fr;
	-ms-grid-columns: 30fr 30fr 30fr 10fr;
    grid-template-rows: auto;
    -ms-grid-rows: auto;
	grid-gap: 2px;
}

.grid-5cols3515152015 {
	display: grid;
	display:-ms-grid;
	grid-template-columns: 35fr 15fr 15fr 20fr 15fr;
	-ms-grid-columns: 35fr 15fr 15fr 20fr 15fr;
    grid-template-rows: auto;
    -ms-grid-rows: auto;
	grid-gap: 2px;
}

.grid-5cols20 {
	display: grid;
	display:-ms-grid;
	grid-template-columns: 20fr 20fr 20fr 20fr 20fr;
	-ms-grid-columns: 20fr 20fr 20fr 20fr 20fr;
    grid-template-rows: auto;
    -ms-grid-rows: auto;
	grid-gap: 2px;
}

.grid-6cols {
	display: grid;
	display:-ms-grid;
	grid-template-columns: 35fr 15fr 15fr 20fr 15fr;
	-ms-grid-columns: 35fr 15fr 15fr 20fr 15fr;
    grid-template-rows: auto;
    -ms-grid-rows: auto;
	grid-gap: 2px;
}

.vertcent {
	display: flex;
	align-items: center;
}

.col1to2 {
	grid-column: 1 / 2;
	-ms-grid-column: 1; 
    -ms-grid-column-span: 1;
}

.col1to3 {
	grid-column: 1 / 3;
	-ms-grid-column: 1; 
    -ms-grid-column-span: 2;
}

.col1to4 {
	grid-column: 1 / 4;
	-ms-grid-column: 1; 
    -ms-grid-column-span: 3;
}

.col1to5 {
	grid-column: 1 / 5;
	-ms-grid-column: 1; 
    -ms-grid-column-span: 4;
}

.col2to4 {
	grid-column: 2 / 4;
	-ms-grid-column: 2; 
    -ms-grid-column-span: 3;
}

.col2to5 {
	grid-column: 2 / 5;
	-ms-grid-column: 2; 
    -ms-grid-column-span: 4;
}

.col3to5 {
	grid-column: 3 / 5;
	-ms-grid-column: 3; 
    -ms-grid-column-span: 3;
}

.col4to5 {
	grid-column: 4 / 5;
	-ms-grid-column: 4; 
    -ms-grid-column-span: 2;
}

.col4to6 {
	grid-column: 4 / 6;
	-ms-grid-column: 4; 
    -ms-grid-column-span: 2;
}

.col5to6 {
	grid-column: 5 / 6;
	-ms-grid-column: 5; 
    -ms-grid-column-span: 2;
}

.col1to6 {
	grid-column: 1 / 6;
	-ms-grid-column: 1; 
    -ms-grid-column-span: 5;
}

.iec1r1 {
	-ms-grid-column: 1;
    -ms-grid-row: 1;
}

.iec2r1 {
	-ms-grid-column: 2;
    -ms-grid-row: 1;
}

.iec3r1 {
	-ms-grid-column: 3;
    -ms-grid-row: 1;
}

.iec4r1 {
	-ms-grid-column: 4;
    -ms-grid-row: 1;
}

.iec1 {
	-ms-grid-column: 1;
}

.iec2 {
	-ms-grid-column: 2;
}

.iec3 {
	-ms-grid-column: 3;
}

.iec4 {
	-ms-grid-column: 4;
}

.iec5 {
	-ms-grid-column: 5;
}

.iec6 {
	-ms-grid-column: 6;
}

.ier1 {
	-ms-grid-row: 1;
}

.ier2 {
	-ms-grid-row: 2;
}

.ier3 {
	-ms-grid-row: 3;
}

.ier4 {
	-ms-grid-row: 4;
}

.ier5 {
	-ms-grid-row: 5;
}

.ier6 {
	-ms-grid-row: 6;
}

.ier7 {
	-ms-grid-row: 7;
}

.ier8 {
	-ms-grid-row: 8;
}

.iec5r1 {
	-ms-grid-column: 5;
    -ms-grid-row: 1;
}

.iec6r1 {
	-ms-grid-column: 6;
    -ms-grid-row: 1;
}

.iec1r2 {
	-ms-grid-column: 1;
    -ms-grid-row: 2;
}

.iec2r2 {
	-ms-grid-column: 2;
    -ms-grid-row: 2;
}

.iec3r2 {
	-ms-grid-column: 3;
    -ms-grid-row: 2;
}

.iec4r2 {
	-ms-grid-column: 4;
    -ms-grid-row: 2;
}

.iec5r2 {
	-ms-grid-column: 5;
    -ms-grid-row: 2;
}

.iec6r2 {
	-ms-grid-column: 6;
    -ms-grid-row: 2;
}

.iec1r3 {
	-ms-grid-column: 1;
    -ms-grid-row: 3;
}
.iec2r3 {
	-ms-grid-column: 2;
    -ms-grid-row: 3;
}
.iec3r3 {
	-ms-grid-column: 3;
    -ms-grid-row: 3;
}

.iec4r3 {
	-ms-grid-column: 4;
    -ms-grid-row: 3;
}
.iec5r3 {
	-ms-grid-column: 5;
    -ms-grid-row: 3;
}

.iec6r3 {
	-ms-grid-column: 6;
    -ms-grid-row: 3;
}

.iec1r4 {
	-ms-grid-column: 1;
    -ms-grid-row: 4;
}

.iec2r4 {
	-ms-grid-column: 2;
    -ms-grid-row: 4;
}
.iec3r4 {
	-ms-grid-column: 3;
    -ms-grid-row: 4;
}
.iec4r4 {
	-ms-grid-column: 4;
    -ms-grid-row: 4;
}
.iec5r4 {
	-ms-grid-column: 5;
    -ms-grid-row: 4;
}

.iec6r4 {
	-ms-grid-column: 6;
    -ms-grid-row: 4;
}

.iec1r5 {
	-ms-grid-column: 1;
    -ms-grid-row: 5;
}

.iec2r5 {
	-ms-grid-column: 2;
    -ms-grid-row: 5;
}

.iec3r5 {
	-ms-grid-column: 3;
    -ms-grid-row: 5;
}

.iec4r5 {
	-ms-grid-column: 4;
    -ms-grid-row: 5;
}

.iec5r5 {
	-ms-grid-column: 5;
    -ms-grid-row: 5;
}

.iec6r5 {
	-ms-grid-column: 6;
    -ms-grid-row: 5;
}

.iec1r6 {
	-ms-grid-column: 1;
    -ms-grid-row: 6;
}

.iec2r6 {
	-ms-grid-column: 2;
    -ms-grid-row: 6;
}

.iec3r6 {
	-ms-grid-column: 3;
    -ms-grid-row: 6;
}

.iec4r6 {
	-ms-grid-column: 4;
    -ms-grid-row: 6;
}

.iec5r6 {
	-ms-grid-column: 5;
    -ms-grid-row: 6;
}

.iec6r6 {
	-ms-grid-column: 6;
    -ms-grid-row: 6;
}

.iec1r7 {
	-ms-grid-column: 1;
    -ms-grid-row: 7;
}

.iec2r7 {
	-ms-grid-column: 2;
    -ms-grid-row: 7;
}

.iec3r7 {
	-ms-grid-column: 3;
    -ms-grid-row: 7;
}

.iec4r7 {
	-ms-grid-column: 4;
    -ms-grid-row: 7;
}

.iec5r7 {
	-ms-grid-column: 5;
    -ms-grid-row: 7;
}

.iec6r7 {
	-ms-grid-column: 6;
    -ms-grid-row: 7;
}

.iec1r8 {
	-ms-grid-column: 1;
    -ms-grid-row: 8;
}

.iec2r8 {
	-ms-grid-column: 2;
    -ms-grid-row: 8;
}

.iec3r8 {
	-ms-grid-column: 3;
    -ms-grid-row: 8;
}

.iec4r8 {
	-ms-grid-column: 4;
    -ms-grid-row: 8;
}

.iec5r8 {
	-ms-grid-column: 5;
    -ms-grid-row: 8;
}

.iec6r8 {
	-ms-grid-column: 6;
    -ms-grid-row: 8;
}

.iec1r9 {
	-ms-grid-column: 1;
    -ms-grid-row: 9;
}

.iec2r9 {
	-ms-grid-column: 2;
    -ms-grid-row: 9;
}

.iec3r9 {
	-ms-grid-column: 3;
    -ms-grid-row: 9;
}

.iec4r9 {
	-ms-grid-column: 4;
    -ms-grid-row: 9;
}

.iec5r9 {
	-ms-grid-column: 5;
    -ms-grid-row: 9;
}

.iec6r9 {
	-ms-grid-column: 6;
    -ms-grid-row: 9;
}


.iec1r10 {
	-ms-grid-column: 1;
    -ms-grid-row: 10;
}

.iec2r10 {
	-ms-grid-column: 2;
    -ms-grid-row: 10;
}

.iec1r11 {
	-ms-grid-column: 1;
    -ms-grid-row: 11;
}

.iec2r11 {
	-ms-grid-column: 2;
    -ms-grid-row: 11;
}

.iec1r12 {
	-ms-grid-column: 1;
    -ms-grid-row: 12;
}

.iec2r12 {
	-ms-grid-column: 2;
    -ms-grid-row: 12;
}

.iec1r13 {
	-ms-grid-column: 1;
    -ms-grid-row: 13;
}

.iec2r13 {
	-ms-grid-column: 2;
    -ms-grid-row: 13;
}

.iec1r14 {
	-ms-grid-column: 1;
    -ms-grid-row: 14;
}

.iec2r14 {
	-ms-grid-column: 2;
    -ms-grid-row: 14;
}

.iec1r15 {
	-ms-grid-column: 1;
    -ms-grid-row: 15;
}

.iec2r15 {
	-ms-grid-column: 2;
    -ms-grid-row: 15;
}

.rowheight {
	height: 1.8em;
}

#hakugroup {
	grid-gap: 6px;
}

.tabsform {
	width: 770px;
    left: 72px;
    display: inline;
    float: left;
    position: relative;
    margin-left: 5px;
    margin-right: 5px;

}

.tabsform2 {
	display: inline;
    float: left;
    position: relative;
    margin-left: 5px;
    margin-right: 5px;
    width: 700px;
    left: 216px;
}

.vertical-block-center {
    margin: auto 0;
}

.horizontal-block-center {
    margin: 0 auto;
}

.block-center {
	margin: auto auto;
}

#ulkomaa {
	margin-top: 2px;
}

#asuinmaa {
	font-size: 12px;
}

#submit-button {
	grid-column: 2;
}

h1 {
	font-weight: light;
	font-size: 32px;
}

#Taike {
     background: #7f7f7f url(images/taike_strip.png) repeat-y top left;
}

#OKM {
	background: url(images/OKM-tausta-vihrea.png);
}

#MV {
    background: #597B51;
}

#mvHeaderText {
	font-family: 'New Hero';
	color: black;
}

#mvHeader {
	height: 100px;	
}

#mvHeaderLogo {
    padding: 7px 0 0 22px;
}

.ui-state-error {
	font-size:11px;
}

#toplevel_container {
    box-shadow: 0px 0px 40px rgba(0,0,0, 0.2);
}

textarea, input, select {
   font-family: inherit;
   font-size: 12px;
   border-width: thin;
}

input:focus {
	border-color: #555555;
	border-width: 2px;
	border-style: solid;
}

.focusStyle {
	border-color: #555555 !important;
	border-width: 2px !important;
	border-style: solid !important;
}

input[type="file"]:focus {
    border-color: #555555;
	border-width: 2px;
	border-style: solid;
}

img {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	border: 0px;
}

a {
	text-decoration: none;
	color: #333;
}

a:hover {
    color: #000;
}

.formHelptextp{
    padding-left: 0px;
    padding-top: 0px;
    text-align: left
}

.formIcon {
	color: #555555; 
	margin-bottom: 10px; 
	font-size:32px;
}

p {
	margin: 0px;
	padding: 10px;
	word-wrap: break-word;
}

h4 {
	font-size: 11px;
}

div .customertypeselect {
	margin: 0px 1px;
}

div .customertypeselrow {
	display : flex;
	align-items : center;
	height: 52px;
    margin-bottom: 12px;
    padding: 0 0 0 1px;
}

div .customertypeselbutton {
    margin: 0;
	display : flex;
	align-items: center;
    justify-content: center;
	height: 48px;
}

.customertypeselrow .grid_3 {
	width: 180px !important;
}

.loginButton {
	padding: 0 5px;
	display: block;
	width: 100%;
	height: 100%;
}

div .customertypeselhelp {
	padding-left: 5px;
}

span.field-caption-small {
	font-size: 11px;
}
.fa-exclamation-triangle {
	color: #a71616;
}

.fa-warn-el:before {
    padding: 0.2em;
}

.vasub, fa-warn-el:before {
	vertical-align: sub;
	 padding: 0.2em;
}

.form_nav {
   /*margin-bottom: 2em 0;
    padding: 5px;*/
    margin:0px;
    height:40px;
    width: 700px;
    color: #333333;
    font-size: 12px
}

.selectelement {
	width:400px;
}

.form_helplinks {
    padding: 10px;
    background: #DFDFDF;
    width: 200px;
}

.validation_error{
	background-color: red;
}

.hidden {
	display: none !important;
}

input[readonly="readonly"] {
	background-color: rgba(239, 239, 239, 0.3);
	color: rgb(170, 170, 170);
    border-color: rgba(118, 118, 118, 0.3);
}

.right {
	float: right !important;
}

.left {
	float:left;
}

.center {
	display: block;
	margin-left: 45%;
	margin-right: auto;
}

.error-in-tab {
	font-weight: bold;
	color: red;
}

.form_nav hr {
	color: #ccc;
	border: 0;
	background-color: #999999;
	height: 1px;
}

table.condenced  {
	font-size:12px;
}

.applicationFormHeader {
	color: #555555;
	font-weight: normal;
	font-size: smaller;
	margin: 0px;
	padding: 10px 0px 0px 0px;
}
/* ROOT CONTAINERS */

#virka_header_container{
	background: #FFFFFF;
	width: 960px;
	margin-left: auto;
	margin-right: auto;
}

#header_container {
	margin: 10px;
	width: 940px;
	margin-top: 0px;
    margin-bottom: 0px;
}

#content_container {
	background: #FFFFFF;
	/*padding-top: 10px;*/
	padding-bottom: 10px;
}

#footer_container {
	background-color: #FFF;
    padding: 10px 0;
}

#Taike_footer_container {
    background-image: url(images/taike_tunnus_footer.png);
    background-position: 50% 10px;
    background-repeat: no-repeat;
	margin: 50px 10px 0px 10px;
	width: 940px;
    background-color: #666666;
}


#OKM_footer_container {
	margin: 50px 10px 0px 10px;
	width: 940px;
	background-color: #666666;
}


#MV_footer_container {
    margin: 50px 10px 0px 10px;
	width: 940px;
	background-color: #666666;
}


#virka_footer_container {
    background: #CCC;
	margin: 50px 10px 10px 10px;
	width: 940px;
}

#organisation {
	width: 220px;
	font-size: 12px;
	font-weight: light;
	color: #FFF;
    overflow-y: hidden
}

#address_info {
   padding: 10px;
   background-color: #000;
   opacity: 0.4;
}

#address_info emph{
       font-weight: 900;
}

#organisation thead {
       margin: 10px 0 0 10px;
    	font-weight: bold;
}

#organisation td {
       margin: 0 0 0 10px;
}

.footerLink {
    bottom: 0;
    color: #fff;
    float: right;
    font-size: 12px;
    margin: 15px 10px 10px 10px;
    position: absolute;
    right: 0;
    padding: 0 10px;
    text-align: right;
}

.footerLink a, .footerLink a:link, .footerLink a:visited {
    font-size: 12px;
    font-weight: light;
    color: #FFF;
}

#versioinfo {
    top: 0;
    color: #fff;
    float: right;
    font-size: 12px;
    margin: 5px 10px 10px 10px;
    position: absolute;
    right: 0;
    padding: 0 10px;
}

#main_container {
    background: #FFF;
	padding: 1px 0px;
}

#toplevel_container {
	background: #FFF;
}

/* HEADER */
.main_header_table {
	width: 100%;
}

.main_header_border {
	width: 20%;
	text-align: left;
	font-size: large;
}

.main_header_center {
	width: 60%;
	text-align: center;
	font-size: large;
}

#main_menu {
	background: #CCC;
	font-size: 16px;
	font-weight: light;
	color: #333;
	height:40px;
	width:960px;
}

#main_menu .fa-user{
	font-size: 18px;
}

#main_menu .fa {
    margin-right: 6px;
 }

#main_menu .fa-folder-open {
    font-size: 16px;
}

#main_menu .fa-paper-plane {
    font-size: 16px;
}

#main_menu .fa-power-off {
  margin-right: 6px;
  font-size: 12px;
}

.mmDiv {
	float: left;
	height: 20px;
	padding: 10px 10px 10px 10px;
}

.mmDivLang {
	float: left;
	height: 20px;
	padding: 10px 1px;
	margin: 0 2px;
	text-align: center;
	width: 18px;
}

#mmDivLogoff {
	float: left;
	height: 20px;
	padding: 10px 10px 10px 8px;
}

#main_menu .logoff {
    float:right;
    font-size: 14px;
}

.roleInfo {
    float: right;
    font-size: 11px;
    padding-right: 10px;
    text-align: right;
    font-weight: bold;
}


.kielivalikko {
	font-size: 14px;
}
/* LOGIN */


#main_content h1 {
       font-weight: lighter;
       font-size: 32px;
}

.linklist ul{
    list-style-type: none;
    padding: 0px, 0, 0, 0;
    margin: 0px, 10px, 0, 0;
}

/* SIDE MENU */

#side_menu {
	margin-top: 20px;
}

#side_menu .side_help {
	margin-top: 30px;

/*	background: #ECF3FD;  */
}

/* CONTENT */

#main_content {
	margin-top: 20px;
/* 	margin-bottom: 50px; */
	/*padding: 0 0px 0 10px;*/
}

#main_footer {
	margin: 0px;
	position:relative;
}

#main_content .separatorLine {
	border-bottom: 1px dashed #666;
	margin-top: 0.3em;
	margin-bottom: 0.6em;
}

#main_content a:hover {
    color: #000;
    text-decoration: underline !important;
}

.charcounter {
    font-size: 11px;
}

.tabsNav {
	margin-top: 10px;
    margin-bottom: 18px;
}

/* MAIN FOOTER*/

/* TABLES */

.thead div {
	background: #ccc;
    padding: 0.1em 0;
}

.compact thead {
	background: #ccc;
}

.compact tbody {
	background: #FFFFFF;
}
.tbody {
	background: #FFFFFF;
}

 .jsontable .rahoituslist,.list,.titlerow,.totalrow {
	width: 100%;
	background: #EFEFEF;
	border-collapse: collapse;
	margin-bottom: 3px;
}

.seepra {
	width: 100%;
	background: #DFDFDF;
	border-collapse: collapse;
/*	border: 1px solid #E0E0E0;*/
	margin-bottom: 10px;
	margin-top: 10px;
}

.seepra thead {
	font-weight: bold;
	background: #FFFFFF;
/*	border-bottom: 1px solid #E0E0E0;*/
}

.seepra tbody {
	font-weight: light;
	border-right: 2px solid #FFFFFF;

}

#main_content .sort_header a:link, #main_content .sort_header a:visited {
	color: #000000;
}

.seepra td {
	padding: 7px 10px;
	vertical-align: top;
}

.seepra .odd td {
	background: #FFFFFF;
}

.seepra .even td {
    border-right: 2px solid #FFFFFF;
}

.seepra .extra td {
	background: #333333;
}

/* FORMS */

#main_content form, #main_content table {
	width: 100%;
}

#main_content table.view td.name, #main_content label {
	/*font-weight: bold;*/
	vertical-align: top;
	word-wrap: break-word;
}

#main_content label b {
	font-weight: bold;
}

.bold {
	font-weight: bold;
}

#main_content tr.header {
	font-weight: light;
	font-size: 32px;
}

.content .header {
	font-weight: light;
	font-size: 32px;
}


#main_content tr.header td {

	padding: 20px, 0;
}

#main_content .formCaption {
	float: left;
/*	width: 30%;*/
}

#main_content .formValue {
	float: rigt;
}

.longerInput {
	padding: 2px 2px;
	width: 350px;
}

.longInput {
	padding: 2px 2px;
	width: 200px;
}

.longestInput {
	width: 32em;
}

/*
input.text {
	padding: 2px;
	width: 200px;
}
*/
/*
.hakuryhmaTitle {
	font-size: 13px;
	background-color: #CCCCCC;
	text-align: center;
	padding:5px;
}
*/

/* hakuryhmaDetail th ja td 
.taulukko-otsikko {
	font-weight: bold;
	text-align: left;
	padding-top:10px;
	padding-bottom:6px;
} */

.hakuryhmaTitle td {
	font-size: 13px;
	background-color: #CCCCCC;
	text-align: center;
	padding: 5px;
	grid-column: 1 / 6;
}

.hakuryhmaDetail th {
	font-weight: bold;
	text-align: left;
	padding-top: 10px;
	padding-bottom: 6px;
}

a.downloadlink {
	text-decoration: underline;
}

.nappula .fa {
    font-size: 16px;
	color: #919191;
}

.nappula2 .fa {
    font-size: 16px;
	color: #919191;
}

.nappula:hover  {
	background-color: #ddd;
	box-shadow:0 0 7px #eee;
}

input.decimal {
	text-align:right;
}

input.number {
	text-align:right;
}

.botmarg {
	margin-bottom: 1em;
}

.botmarg-small {
	margin-bottom: 0.4em;
}

.tyhja-button {
	border:none;
    background: none;
    cursor:pointer;
}

.body-font {
	font-family: "Open Sans", sans-serif;
    font-size: 14px;
    font-weight: lighter;
    color: #191919;
}

.body-but-col {
	color: rgb(170, 170, 170);
}

.but-colfont {
    color: #333;;
}

.tyhja-button:hover {
    color: #000;
}

/* TODO: Ei tarvita tulevat font-awesome.css kautta 
.nuoli-alas-button:before {
	content: "\f138";
}

.nuoli-oikealle-button:before {
    content:"\f13a";
}

.plus-button:before {
    content:"\f0fe";
} */

.ibpad {
	display: inline-block; 
	padding: 2px; 
	padding-left: 4px; 
	padding-right: 4px;
}

.curp {
 	cursor: pointer;
 }
 
.toggletip-container {
  	position: relative;
  	display: inline-block;
}

.toggletip-container button {
    padding: 0;
    margin: 0.2em;
    width: 0.9em;
    height: 0.9em;
    border-radius: 50%;
    border: 0;
} 

.toggletip-container button:focus {
    outline: none;
    box-shadow: 0 0 0 0.1rem #7ca0c0;
    color: #000;
}

.toggletip-bubble {
    display: inline-block;
    position: absolute;
  	left: 100%;
  	top: 0;
  	width: 300px;
  	padding: 0.5rem;
  	background: #DFDFDF;
  	color: #000;
  	z-index: 100;
  	border-style: solid;
  	border-width: 2px;
} 

.werrors {
	display: inline-block;
	padding: 2px;
	padding-left: 4px;
	padding-right: 4px;
}

.error-span {
	display: inline-block;
	padding: 2px;
	padding-left: 4px;
	padding-right: 4px;
}

.visually-hidden {
	display: none;
    visibility: hidden;
}

input[type="checkbox"]:focus {
    outline: dashed 2px grey;
    outline-offset: 2px;
}

.cboxlabel {
	position: absolute;
    left: -5000px;
}

.inline {
	display: inline;
}

#modalOverlay {
    width: 100%;
    height: 100%;
    z-index: 2;
    background-color: #000;
    opacity: 0.5;
    position: fixed;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
}

.popupDialog {
    width: 32%;
    margin-left: auto;
    margin-right: auto;
    border: thin #000 solid;
    z-index: 10;
    position: fixed;
    top: 34%;
    left: 34%;
    background: #FFFFFF;
    overflow: auto;
    zoom: 1;
}

#alertHeading {
    position: relative;
    background: #eeeeee;
    margin: 0;
    padding: 5px;
    font-weight: lighter;
}

#alertText {
	padding: .5em 1em;
}

#popupButtonsDiv {
	padding-left: 1em;
	padding-bottom: 0.5em;
}

#callListTitleEl {
    font-size: 12px;
    font-weight: light;
    background: none repeat scroll 0 0 #555;
    color: #fff;
    height: 16px;
    padding: 6px;
}

.leftButton {
	float: left; 
	margin-top: 10px;
}

.submitButton {
	float: right; 
	margin-top: 10px;
}

.loaderImage {
	display: none;
}

.rightneg6px {
	margin: 0 -6px 0 0;
}

.rightplus6px {
	margin: 0 6px 0 0;
}

.fullWidth {
	width: 100%;
}

/* Chromella selaimen defaultit= background: #f8f8f8 Border: #d1d1d1*/
/* Jos 3:1 suhde backround ja border, niin pitää olla bg: #f8f8f8 ja Border: #8f8f8f */
/* Jos 3:1 suhde sivun valkoiseen taustaan ja border, niin pitää olla Border: #949494 */
input[type='checkbox']:disabled {
    border:initial;
  	width: 13px !important;
  	height: 13px !important;
  	margin: 3px 3px 0px 4px;
  	-webkit-appearance: none;
  	-moz-appearance: none;
 	-o-appearance: none;
  	display:inline-block;
  	appearance:none;
  	border-radius: 3px;
  	border: 1px solid #949494;
  	box-shadow: none;
  	font-size: 2em;
  	background: #f8f8f8;
}

input[type='checkbox']:disabled:checked {
    appearance: auto !important;
    /*accent-color: red;*/
} 

.fa-lgs {
    font-size: 1.33333333em;
	line-height: .75em;
	vertical-align: -5%;
}

.floatl {
	float: left;
}

address { 
	font-style: normal;
}

header {
	position: relative;
	z-index: 10;
}

#toplevel_header_container {
	background: #FFF;
    padding: 10px 0 10px 0;
    box-shadow: 0px 0px 40px rgb(0 0 0 / 20%);
}

.spanWidth90 {
    display: inline-block;
    width: 90%;
}

.preview_mandatory {
	color: red;
    font-size: 11px;
}

/* JQuery UI Korjauksia */
.ui-resizable-handle { 
	position: absolute;
	font-size: 0.1px;
	z-index: 99999; 
	display: block;
	/* http://bugs.jqueryui.com/ticket/7233
	 - Resizable: resizable handles fail to work in IE if transparent and content overlaps
	 Tämä ei toiminut vaan hajoitti koko dialogi-ikkunan
	*/
	background-image: none !important;
}

.ui-widget-header .ui-icon {
    background-image: none;
}

.ui-widget-overlay {
	position: absolute;
    background: #aaaaaa !important;
    opacity: .60 !important;
    filter: Alpha(Opacity=30) !important;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

.ui-dialog .ui-dialog-buttonpane {
    margin: 0;
    background: #ffffff;
} 

.error-border {
	border: 1px solid #ff0000
}

.error-border:focus  {
	border: 2px solid #ff0000
}

.btn-left {
	float: left;
	margin-top: 10px;
}

.btn-right {
	float: right;
	margin-top: 10px;
}

#poistetutForm {
	position: absolute;
	float: right;
	margin-top: -12px;
}

.mr10p {
	margin-right: 10px;
}

.mt17p {
	margin-top: 17px;
}

.mt14p {
	margin-top: 14px;
}