*
{
        /*font-family: "Arial", "Helvetica", sans-serif;*/
    
}
body
{    
    background-color: #fff; /* #F3F0E9;*/
    color: #000000; /*background-image:url(images/bg_image.gif);*/
    text-align: left;
    height: 100%;
    width: 100%;
    margin:0px;
   
    font-size: 15px; /*DefaultFontSize*/
    font-family: 'Open Sans','Calibri','Tahoma', 'Arial', 'sans-serif';
    /*font-size: 105%;*/
	overflow-y: scroll;
    margin-bottom: -2px;
}


textarea { white-space: pre-wrap; }

textarea, select, input[type=text], input[type=password], input[type=file] 
{
    font-size: 15px;
    border: solid 1px #999999;
    border-radius: 7px;
    background-color: #FFFFFF;
    font-family: 'Open Sans','Calibri','Tahoma', 'Arial', 'sans-serif';
    padding: 7px; 
    box-sizing:border-box;
    margin-bottom: 5px;
}

input[type=checkbox] {
    width: 15px;
    height: 15px;
    /*margin-bottom: 12px;*/
}

input[type=radio] {
    width: 15px;
    height: 15px;
    /*margin-bottom: 12px;*/
}


hr
{
    height: 1px;
    background-color: #C0C0C0;
    border: 0px;
}

a {
    /*color: #187CE0; /* /*link-color*/
    color: #115599; /*link-color*/
    border: 0px;
}

a:hover, a:focus {
    color: #0d4477;
}

a:link { text-decoration: none; }
a:visited { text-decoration: none; }
a:active { text-decoration: none; }
a:hover { text-decoration: underline; }



img
{
    border: 0px;
    margin-top: 0px;
    margin-left: 0px;
    margin-right: 0px;
}
img.clickable {
    cursor:pointer;
}

td
{
    vertical-align: top;
    text-align: left;
}

em {font-style: italic;}
strong { font-weight: bold; }

input, select {}
    select[multiple] > option
    {
        padding-right:10px;
    }

input[type=text], input[type=password],select {
    font-size:15px;
}

input[type=button], input[type=submit], button
{
    font-size:100%;
    padding: 5px 15px 5px 15px;

    background-color: #3777A0;  
    background: linear-gradient(to bottom, #3777A0, #013F69); /*maincolor*/
    
    color: #fff;
    border: solid 1px #013F69;
    border-radius:5px;
    cursor:pointer;
}

input[type=button]:hover, input[type=submit]:hover, button:hover
{
    background-color: #fff;
    background: linear-gradient(to bottom, #fff, #ccc);
    color: #013F69;
}

button.icon {
    font-size: inherit;    
    background: transparent;
    color: inherit;
    border: 0px; 
    padding: 0px; 
}

input[type=file] {
    vertical-align: middle;
    padding: 1px 15px 1px 15px;
}

input[type=button].small_button, input[type=submit].small_button
{
    font-size: 12px;
    /*padding: 2px;*/
    min-width: 75px;
    /*margin: 2px;*/
}
a.small_button {
    cursor:pointer;
}
input[readonly]
{
    background-color: Transparent;
    border-style: none;
}

/*input[type=button]:hover, input[type=submit]:hover
{
	color: #000000;
	background-color: #CCCCCC;
	cursor: pointer;
}*/

input[type=button][disabled], input[type=submit][disabled]
{
    color: #666666;
    background-color: #999999;
    background: linear-gradient(to bottom, #fff, #ccc);
    cursor: auto;
}

label {
    margin-left:5px; margin-right:5px; vertical-align:top;
}

tr.nowrap td
{
    white-space: nowrap;
}

/* cellpadding */
th, td { padding: 5px; /*padding-bottom: 5px;*/} /* kenttien väliin tilaa*/

/* cellspacing */
table { border-collapse:separate; border-spacing: 0px; }

ul {
    padding:0px;
    margin: 0px;
    margin-left: 30px;
}
   


.hidden
{
    display: none;
}



/***********************************************
* Otsikkomäärittelyt
************************************************/

h1, h2, h3, h4, h5
{
	padding:0px;	
	margin:0px;
	font-weight: normal;
    letter-spacing: 0.05em;
    margin-bottom: 5px;
}

h1 { /* = järjestelmän otsikko */
   font-size:120%;
}

h1.pdf {
    position:absolute;
    right: 0px;
    top: 0px;
}

h1 a /* used inside div with '.topheader' class */
{
    color:#000000;
	display:inline;	
    background-color:transparent;
} 
h2 /* = pageheader */ 
{
	font-size: 150%;
    text-align: left;
    vertical-align: middle;
    margin: 2px 0px 4px 0px; 
    color: #000000;
}
h3 /* = bigheader */ 
{
	/*display:table;*/ 
	text-align:left;
    font-size: 144%;
}
h3 span {
    text-align:left;
}
h4, h4 span /* = subheader */ 
{
	font-size: 120%;
    text-align: left;
    vertical-align: middle;
   /* padding: 3px 1px 3px 4px;*/
   
  
   padding: 3px 1px 3px 0px;
    color: #000000;
	
	/*background: url(images/fade_white.png);
 	background-repeat: repeat-y;
 	background-color: #E1E7ED;*/

}
h5 {
    display:inline;
    font-size:100%; 
    font-weight:bold;
    letter-spacing: 0px;
}

h1 a, h2 a, h3 a, h4 a, h5 a  
{
	color: Black;
}

tr.header_row 
{
	font-weight: bold;
	vertical-align: top;		
}


th
{
	font-size: 100%;
    vertical-align: top;
    text-align: left;
    font-weight: bold;
    letter-spacing: 0px;
}
th a { color:Black; }
th a.link { color: #115599; /*link-color*/ }


/* use to complement another header element, not to be used as a standalone header style (ie <h3 class='accordion_header> )*/
.accordion_header {
    width:99%;
    background-image: url('../images/fade_white.png');
    background-repeat: repeat-y;
    background-color: #e9c380;
    padding-top:3px;
    padding-bottom:3px;
    cursor:pointer;
}



/* Sovelluksen pääotsikkopalkki*/
div.topheader 
{
    display:table;
    position:relative; 
    /*background: url('../images/header_bg.gif') repeat-x ;*/ 

    background-color: #013F69;
    /*background: linear-gradient(to bottom, #3777A0, #013F69);*/ /*maincolor */
   
    /*height: 117px;*/ 
    width:100%;
    z-index: 100;   
}

div.topheader_inner
{
    max-width: 85%;
    min-width: 1030px;
    position: relative;
    margin-left: auto; margin-right: auto;
}
.topheader_lang /* liput */
{
    margin-right:5px; /* lippujen väliin tilaa*/
}

.topheader_link
{
    width: 10px; /* Estetään linkin leviäminen koko sivun levyiseksi*/
    display:block;
    font-weight: bold;
    padding: 0px;
    text-align: left;
    margin: 0px;
    margin-top:20px;
    margin-bottom: 10px;
    vertical-align: middle;    
}

.topheader_text {
    color: white;
    /*text-shadow: 2px 2px 10px #000000;*/
    font-size: 20px;
}

span.helpheader
{
    /*font-style: italic;*/
    font-weight: normal;
    font-size: 85%; /*smaller-tieto ei toimi IE-selaimella*/
}

/*.topheader_aluslaatikko { /* Taustakuvia varten * -- käytä asiakaskohtaisia säädöksiä.
    background-color: white;
    box-shadow: 0 0 20px 10px white;
    border-radius: 10px;
    opacity: 0.6;
}*/

/************************************************
* Sisältö-blokit
************************************************/
form {
    padding: 0px;
    margin: 0px;
}

.main_master
{
    margin-left: auto;
    margin-right: auto;
    margin-top: 1px;
    max-width: 85%;
    min-width: 1030px;
    /*padding: 0px; padding-top: 6px; padding-bottom: 6px; */
    
    border-width: 0px;
    border-color: transparent;
    border-style: solid; /*border-bottom-width: 6px; 	border-top-width: 6px; 	border-left-width: 15px; 	border-right-width: 15px;*/ /*background-color: #999999;*/
}

/* transparent footer fixed to bottom of browser window, width should be maintained to match .main_master */
div.fixed_footer {
    max-width: 95%;
    min-width: 1030px;
    position:fixed;
    right:50%;
    margin-right:-450px; /* 1/2 of width */
    bottom: 0px;
    height:40px;
    background-color: #e0e0e0;  
    border-top: solid 1px black;    
    padding-top: 8px;
}

div.content_area
{
    padding: 15px;
    padding-bottom: 40px;
    text-align: left;
    margin: 0px;
    vertical-align: top;
    background-color: #ffffff;
    border: solid 0px #D8D8D8;
    border-top: none;
    /*box-shadow: 0 1px 7px rgba(0,0,0,0.4);*/
}

div.footer_area { /*main_masterin alaviite*/
    width: 90%;
    bottom: 0px;
    /*position:absolute;*/
    padding: 5px;
    margin: 0px;
    vertical-align: top;
    background-color: none;
    text-align: center;
    font-size:12px; 
}



.hanke .hanke_content 
{
	border: solid 1px #003366;
    border-top-width: 0px;
    background-color: #fbfbfb; /*background: url(images/paper.jpg); 	background-repeat: repeat;*/
    border-radius: 0px 0px 10px 10px;
    padding:7px;
}

.hanke .hanke_content_inner {
    padding-left: 5px;
}

.hanke .hanke_content_top
{
    border: solid 1px #003366;
    border-bottom-width: 0px;
    background-color: #fbfbfb;
}
.hanke_content .yhteenveto_paneeli {
    width: 95%;
    margin-left: 15px;
}
.hanke_content .yhteenveto_paneeli h3 {
    margin-left: -15px;
}

.lomake_tag {
    border-radius: 5px 5px 5px 5px;
    padding: 3px; 
    border: 1px solid black;
    width: 100px;
    display: inline-block;
    text-align: center;
}

.huomioteksti {
    border-radius: 5px 5px 5px 5px;
    padding: 3px; 
    border: 1px solid black;
    display: inline-block;
    text-align: center;
    font-style: italic;
    font-weight: bold;
    background-color: #faffbd;
}

div.info {
    border-radius: 5px 5px 5px 5px;
    padding: 10px;
    border: 1px solid #cbd3ff;
    /*border: 10px solid #dbf3ff;*/
    display: inline-block;
    text-align: left;
    background-color: #dbf3ff;
}
div.info-huomio {
    border-radius: 5px 5px 5px 5px;
    /*padding: 3px;*/
    /*border: 1px solid #ff8080;*/
    display: inline-block;
    text-align: left;
    font-weight: bold;
    /*background-color: #abb3bf;*/
}
div.info-tarkea {
    border-radius: 5px 5px 5px 5px;
    padding: 5px;
    /*border: 1px solid #ff8080;*/
    /*border: 2px solid #727dfe;*/
    display: inline-block;
    text-align: left;
    font-weight: bold;
    background-color: #A9CCE3;
}

.divTable {
    display: table !important;
    width: 100%;
}
.divTableBody {
    display: table-row-group !important;
}
.divTableRow {
    display: table-row !important;
}
.divTableCell, .divTableHead {
    /*border: 1px solid #999999;*/
    display: table-cell !important;
    /*width: 50%;*/
    vertical-align: top;
    padding-left:10px;
}
.divTableCell40 {
    /*border: 1px solid #999999;*/
    display: table-cell !important;
    width: 40%;
    vertical-align: top;
}

/*.divTableHeading {
    background-color: #EEE;
    display: table-header-group;
}*/
    /*.divTableHeading {
    background-color: #EEE;
    display: table-header-group;
    font-weight: bold;
}
.divTableFoot {
    background-color: #EEE;
    display: table-footer-group;
    font-weight: bold;
}*/



    
/**************************
* Menut                   *
***************************/

/*Perusmenu*/
nav.menubar {    
    background-color: #005284;      
    border-radius: 5px;
    padding: 3px;
    position: relative;
}
nav.menubar a {
    color: #fff;
    display: inline-block;
    font-weight: bold;
    cursor: pointer;
    /*margin: 1px 5px 1px 5px;*/
    margin:0px;
    padding: 2px 5px 2px 5px;
    border-radius: 5px;
    text-decoration: none;
   
}
nav.menubar a.selected, nav.menubar a:hover {
    background-color: #fff;
    color: #005284;
}


/*Päämenu*/
nav.main_menu {
    font-family: Cabin, sans-serif;
    margin-left: 0%;
    margin-right: 0%;
    margin-top: 0px;
    background: linear-gradient(to bottom, #3777A0, #005284); 
    padding: 0px;
    padding-left: 16px;
}
nav.main_menu a {
    font-size:14px;
    text-transform: uppercase;
    margin-top: 7px;
    margin-bottom: 7px;
    padding: 4px 10px 4px 10px;
}



nav ul {
    display:block;
    list-style-type:none;
    padding:0px;
    margin:0px;
}

nav ul li {
    display: inline-block;    
}
nav ul.vertical li {
    display: block;
}


nav.menubar li {
    /*margin: 1px 5px 1px 5px;*/
    margin: 1px; 
}

nav ul.submenu {
    font-family: 'Open Sans','Calibri','Tahoma', 'Arial', 'sans-serif';

    position: absolute;
    border: 1px solid black;
    font-weight: normal;
    text-align: left;
    background-color: #fff;
    border: solid 1px #222;
    margin-left: -5px;
    margin-top: -2px;
    margin-bottom: -2px;
    padding: 1px;
    z-index:999;
}

nav ul.submenu > li {
    display:block;    
}

nav ul.submenu a {
    text-align: left;
    color: #115599;
    font-weight: normal;
    text-transform: none;
    display: block;
    margin: 0px;
    padding: 6px 20px 6px 2px;
    border-radius: 0px;
    text-decoration: none;
}

nav ul.submenu a:hover {
    background-color: #115599;
    color: #fff;
}






/*************************
* Sovelluksen päävalikko *
*************************/
div.menu 
{
    margin-left: 0%;
    margin-right: 0%;
    margin-top: 0px;
    /*background-color: #EDEDED;*/
    padding: 0px;
    padding-left: 16px; /*border: solid 1px #000000; */ /*border-bottom: solid 1px #999999; 	border-top: solid 1px #999999;*/
    /*border: solid 1px #999999;
    border-radius: 5px 5px 5px 5px;*/
}

div.menu ul
{
    display: table;
    list-style-type: none;
    padding: 0px;
    margin: 0px;
    margin-bottom: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
    text-align: left;
    border: 0px;
    width: 100%;
}
div.menu ul li
{
    margin: 0px;
    padding: 0px;
    display: inline;
}

div.menu ul a
{
    font-size:110%;
    display: inline-block;
    margin-top: 7px;
    padding: 4px;
    padding-left:15px;
    padding-right:15px;
    text-decoration: none;
    color: #fff;
    margin-right: 0px;


    /*border: solid 2px #005284;
    border-bottom: none;
    border-top: none;*/
}
div.menu ul a.selected, div.menu ul a:hover
{
    color: #005284;
    background-color: #fff;    
    /*border-bottom: solid 2px #fff;*/
    border-radius: 5px 5px 0px 0px;
}



/*****************************************************************
* Ylälaidan navigointipalkki (viestit, asetukset, ohje, logout)  *
*****************************************************************/

.topnav
{
    /*font-size: 90%;*/ /* Mihin tämä vaikuttaa? */
    color: Black;
}


.topnav > nav {
    float:right;    
}

.topnav a
{
    color: Black;
}

.topnav .topnav_icon
{    
    /*width:37px;
    height:36px;
    float:right;
    padding-left:8px;*/

    vertical-align: top;
    display: inline-block;
    width: 37px;
    height: 36px;
    margin-left:2px;
}
.topnav_icon:hover 
{
    text-decoration: none !important;
}



.topnav .admin_asetukset {
    background: url('../images/admin-asetukset.png') no-repeat;
}

.topnav .admin_asetukset:hover {
    background: url('../images/admin-asetukset-hover.png') no-repeat;
}

.topnav .asetukset {
    background: url('../images/asetukset.png') no-repeat;
}
.topnav .asetukset:hover {
    background: url('../images/asetukset_hover.png') no-repeat;
}

.topnav .ohje {
    background: url('../images/ohje.png') no-repeat;
}
.topnav .ohje:hover {
    background: url('../images/ohje_hover.png') no-repeat;
}

.topnav .viestit {
    background: url('../images/viestit.png') no-repeat;
}
.topnav .viestit:hover {
    background: url('../images/viestit_hover.png') no-repeat;
}

.topnav .hakemus {
    background: url('../images/hakemus.png') no-repeat;
}
.topnav .hakemus:hover {
    background: url('../images/hakemus_hover.png') no-repeat;
}

.topnav .maksusuunnitelma {
    background: url('../images/maksusuunnitelma.png') no-repeat;
}
.topnav .maksusuunnitelma:hover {
    background: url('../images/maksusuunnitelma_hover.png') no-repeat;
}

.topnav .sopimukset {
    background: url('../images/sopimukset.png') no-repeat;
}

    .topnav .sopimukset:hover {
        background: url('../images/sopimukset_hover.png') no-repeat;
    }

.topnav .maksurivit {
    background: url('../images/maksurivit.png') no-repeat;
}
.topnav .maksurivit:hover {
    background: url('../images/maksurivit_hover.png') no-repeat;
}

.topnav .selvitys {
    background: url('../images/selvitys.png') no-repeat;
}
.topnav .selvitys:hover {
    background: url('../images/selvitys_hover.png') no-repeat;
}

.topnav .seuranta {
    background: url('../images/seuranta.png') no-repeat;
}
.topnav .seuranta:hover {
    background: url('../images/seuranta_hover.png') no-repeat;
}

.topnav .kasittely {
    background: url('../images/kasittely.png') no-repeat;
}
.topnav .kasittely:hover {
    background: url('../images/kasittely_hover.png') no-repeat;
}

.topnav .logout {
    background: url('../images/logout.png') no-repeat;
}
.topnav .logout:hover {
    background: url('../images/logout_hover.png') no-repeat;
}

.topnav .esitys {
    background: url('../images/esitys.png') no-repeat;
}

    .topnav .esitys:hover {
        background: url('../images/esitys_hover.png') no-repeat;
    }

.topnav .kaynnissa {
    background: url('../images/kaynnissa.png') no-repeat;
}

.topnav .kaynnissa:hover {
    background: url('../images/kaynnissa_hover.png') no-repeat;
}

.topnav .myonnot {
    background: url('../images/myonnot.png') no-repeat;
}

.topnav .myonnot:hover {
    background: url('../images/myonnot_hover.png') no-repeat;
}

.topnav .ehdolliset {
    background: url('../images/ehdollinen.png') no-repeat;
}

    .topnav .ehdolliset:hover {
        background: url('../images/ehdollinen_hover.png') no-repeat;
    }

.dashboard_icon
{    
    width:80px;
    height:62px;
    float:left;
    padding-left:15px;
}
.dashboard_icon_last
{    
    width:60px;
    height:62px;
    float:left;
}
.dashboard_icon:hover 
{
    text-decoration: none !important;
}
.dashboard_icon_last:hover 
{
    text-decoration: none !important;
}
.new_arrived
{
    font-size: 115%;
    background-color: #ff8800;
    color: #ffffff;
    padding: 5px 6px 5px 6px;
    border-radius: 3px;
    white-space:nowrap;
    position: absolute;
    margin-top: -5px;
}

.new {
    font-size: 115%;
    background-color: #ff8800;
    color: #ffffff;
    padding: 5px 6px 5px 6px;
    border-radius: 3px;
    white-space: nowrap;
    margin-top: -5px;
}
/*********************************************************
* Geneerinen vaakataso-menu joka venyy sisällön mukaan   *
**********************************************************/
ul.horizontal_menu 
{
    display:table; 
    list-style-type: none; 
    background-color: #EDEDED;
    border: solid 1px #333333;
    margin:0px;
    padding:0px;
}

ul.horizontal_menu li 
{
    margin-right:10px;
    margin-left: 10px;
    display:inline-block; 
    font-weight:bold;
    cursor:pointer;
    color: #555555;
    padding:4px;
}
ul.horizontal_menu li a 
{
    color: #555555;
    text-decoration:none;
}
ul.horizontal_menu li:hover 
{
    background-color: #CCDDEE;
}


/******************
* Hankesivun menu *
******************/
/*TODO if extra time: It's semantically more correct to use <ul> to implement menus */

table.hanke_menu
{
    background-color: transparent;
}
table.hanke_menu td
{
    background-color: transparent;
    border-bottom: solid 0px #003366;
}
table.hanke_menu td.hanke_menu_item
{
    border-radius: 10px 10px 0px 0px;
    border-right: solid 1px transparent;
    border-left: solid 1px transparent; /*border-collapse: collapse;*/
    border-top: solid 1px transparent;
    box-shadow: 0 1px 7px rgba(0,0,0,0.7);

    padding: 0px;
    text-decoration: none;   
    font-weight: bold;
    white-space: nowrap;   
    background-color: #005284;   
}
table.hanke_menu td.hanke_menu_item:hover
{
    background-color: #fff;
    color:red;
}
table.hanke_menu td.hanke_menu_item a
{
    display: block;
    color: #fff;
    text-decoration: none;
    padding: 7px 10px 7px 10px;
}
    table.hanke_menu td.hanke_menu_item a:hover
    {
        color: #005284;
    }

table.hanke_menu td.selected
{
    border-bottom-width: 0px;
    background-color: #fff;
}

    table.hanke_menu td.selected a
    {
        color: #005284;
    }

/*********************************
* Hankesivun menu, wizard-näkymä *
*********************************/
table.hanke_menu.wiz td.hanke_menu_item:hover
{
    background-color: #E8E8E8;
}
table.hanke_menu.wiz td.hanke_menu_item.selected:hover
{
    background-color: #fbfbfb;
}
table.hanke_menu.wiz td.hanke_menu_item a
{
    cursor: default;
}



/*********
* Taulut *
*********/

table.fixed { table-layout:fixed; }
table.fixed td { overflow: hidden; }

.tietovarantoliittymaTaulu tbody tr td .no_overflow {
    max-height: 60px !important;
    max-width: 400px;
    overflow: auto;
    /*overflow: scroll;*/
    /*white-space: pre-line;*/
}

.tietovarantoliittymaTaulu tbody tr td.Funding, th.Funding {
    border-left: 3px double black;
}

.rivin_data_on_jo_lahetetty td {
    background-color: lightgreen;
}

span.rivin_data_on_jo_lahetetty {
    border-radius: 10px;
    padding: 5px;
    background-color: lightgreen;
}

table.datatable
{
    border-collapse: separate !important;
}
/*
    table.datatable textarea,
    table.datatable select, 
    table.datatable input[type=text], 
    table.datatable input[type=password],
    table.datatable input[type=file] {
        padding: 1px;
        padding-bottom: 0px;
        padding-top: 0px;
        border-radius: 4px;
    }*/

table.datatable td
{
    padding-top:4px;
    padding-left:4px;
    padding-right: 10px;
}

table.datatable th
{
    border-top: solid 1px #F0F0F0;
    border-bottom: solid 1px #CECECE;
    border-left: solid 1px #DFDFDF;
       
    background-color: #F0F0F0;
    background: linear-gradient(to bottom, #FFFFFF, #F0F0F0 ); 
    padding: 4px;
    padding-right: 10px;

    white-space:nowrap;
    overflow:hidden;
}

    table.datatable th.nohborder {
        border-left: none !important;
        border-right: none !important;
    }
table.datatable tr.header_row 
{
}
table.datatable tr.header_row th
{    
    cursor:pointer;
}

table.datatable tr.header_row th:hover
{       
    background-color: #D0D0D0;
    background: linear-gradient(to bottom, #F0F0F0, #D0D0D0);
    overflow: visible;
}



table.layout td
{
    padding-right: 10px;
}
table.layout th
{
    padding-right: 15px;
}


tr.noborder > td {
    border:none;
}
tr.topborder > td {
    border:none;
    border-top: 1px solid #F0F0F0;
}

.row
{
    color: #000000; 
    background-color: #FFFFFF;
    font-weight: normal;
    text-align: left;
    vertical-align: top;
    
}
    .row > td, .rowalt > td
    {        
        overflow-x:hidden;
    }
    .rowalt > td 
    {
        /*border-top: 1px solid #DEDEDE;
        border-bottom: 1px solid #DEDEDE;*/
    }

.rowalt_top > td {
    border-bottom: none !important;
}

.rowalt_bottom > td {
    border-top: none !important;
}

.rowalt
{
    color: #000000; 
    background-color: #f2f2f2;
    font-weight: normal;
    text-align: left;
    vertical-align: top;
}
    /*.rowalt:hover {
        background-color: lightgoldenrodyellow;
    }
    .row:hover {
        background-color: lightgoldenrodyellow;
    }*/

.altRowColorTemplate {
    color: #000000;
    /*background-color: #FFFFFF;*/
    font-weight: normal;
    text-align: left;
    vertical-align: top;
}
    .altRowColorTemplate:nth-child(odd) {
        background-color: #f2f2f2;
    }
    .altRowColorTemplate:nth-child(even) {
        background-color: #FFFFFF;
    }
    .altRowColorTemplate:hover {
        background-color: lightgoldenrodyellow;
    }


.rowedit td
{
    color: #000000;
    font-weight: normal;
    text-align: left;
    vertical-align: top;
    padding-right: 8px;
}
.rowerror
{
    color: #000000;
    background-color: #FFCCCC;
    font-weight: normal;
    text-align: left;
    vertical-align: top;
}
/*.row:hover, .rowerror:hover, .rowalt:hover, .rowselected { border-collapse:separate; border:1px solid #666666;}*/
.row_footer
{
    color: #000000;
    font-size: 90%;
    font-weight: normal;
    vertical-align: top;
}

table.datatable tr.footer_row td
{
    border-bottom: solid 1px #F0F0F0;
    border-top: solid 1px #CECECE;
   

    background-color: #013F69;  /*maincolor*/
    background: linear-gradient(to bottom,#3777A0, #013F69); /*maincolor*/

    /*opacity: 0.5;*/
    padding-top: 4px;
    padding-bottom: 4px;
    /*padding-right: 10px;*/
    font-weight:bold;
    color:#FFFFFF;
}

.thin_row td {
    padding-bottom: 0px !important;
    padding-top: 0px !important;
}

/****************
* Popup-näkymät *
*****************/

.popup {
    z-index: 200;
    box-shadow: 0 1px 7px rgba(0,0,0,0.4);
    position:absolute !important;
    padding: 10px; 
    border-radius: 5px 5px 5px 5px;
    background-color:white;
    border: 1px solid black;
}

.popup_tooltip
{
    display: table;
    font-family: Verdana,Arial;
    font-size: 12px;
    position: fixed;
    height: auto; /*border-style:solid;  	border-width:2px;	 	border-color: #88AAEE; 	color:Black;  	background-color:White; */
    background-color: #88AAEE;
    color: Black;
    padding: 5px;
    border: solid 2px #003366;
    white-space: pre-line;
}
.popup_tooltip_hidden
{
    display: none;
    position: fixed;
    width: 0px;
    height: 0px;
}
.help_popup {
    display: table;
    position: fixed;
    height: auto;
    white-space: pre-line;
    background-color: #FFFFAA;
    color: #000022;
    padding: 10px;
    border: solid 1px #444444;
    z-index: 9999;
    font-weight: normal;
    font-size: 15px; /*DefaultFontSize*/
}


.acui_cthlp {
    display: block;
    position: fixed;
    height: auto;
    text-align:initial;
    white-space: pre-line;
    background-color: #FFFFAA;
    color: #000022;
    padding: 10px;
    border: solid 1px #444444;
    z-index: 9999;
    font-weight: normal;
    font-size: 15px; /*DefaultFontSize*/
    width: 90vw;
    max-width: 600px;
    /*overflow: auto;*/

}

.acui_cthlp > .acui_cthlp_content {
    width:100%;
    height:auto;
    max-height: 40vw;
    overflow:auto;
}

.acui_cthlp_edit
{
}

.acui_cthlp_edit textarea
{
    height: auto;
    white-space: pre-line;
    width: 90%;
    background-color: #FFFFAA;
    color: #000022;
    padding: 10px;
    border: solid 1px #444444;
}


/*Add invisible bars to prevent dissapearing when moving cursor to popup. See ContextHelp.js code before making changes*/
.acui_cthlp::after, .acui_cthlp::before {
    content: '';
    position: absolute;
    background-color: transparent;
    display:block;
}

.acui_cthlp::before /* ::before used for placing invisible bar on either side of tooltip  */
{        
    width: 11px; /* hspace(js) + 1 extra  */
    height: calc(100% + 50px); /* 100% + vspace(js)*2 + icon_overlap*2   */
    top: -25px;
    bottom: auto;
    display:none;
}
.acui_cthlp.cthlp_left::before {
    left: 100%;
    display:block;
} 
.acui_cthlp.cthlp_right::before {
    right: 100%;
    display:block;
} 

.acui_cthlp::after { /*::after used for placing invisible bar above popup  */
    height: 16px; /* vspace(js) + 1 + 10 extra */
    width: calc(100%  + 62px); /* 100% + (hspace(js)+1)*2 + icon_overlap*2 */
    left: calc(-31px); /* 0 - hspace/2 - icon_overlap */
    right: auto;
}

.acui_cthlp.cthlp_bottom::after {  
    top: -10px;
    bottom: auto;
}
.acui_cthlp.cthlp_top::after {  
    top:auto;
    bottom: -10px;
}



.help_edit_popup
{
}
.help_edit_popup textarea
{
    height: auto;
    white-space: pre-line;
    width: 90%;
    background-color: #FFFFAA;
    color: #000022;
    padding: 10px;
    border: solid 1px #444444;
}

.popup_menu
{
    height: auto;
    padding: 2px;
    text-align: left;
    background-color: #fff;
    border: solid 1px #013F69; /*maincolor*/
    font-size: 100%;
    /*box-shadow: rgba(1,63,105,170) 5px 5px ;*/
    box-shadow: 0 1px 7px rgba(0,0,0,0.4);
    display:none;
}
.popup_menu a
{
    width: 100%;
    padding: 2px;
    text-align: left;
    color: #013F69; /*link-color*/
}

.popup_menu tr:hover
{
    background-color: #013F69; /*maincolor*/
}

    .popup_menu tr:hover a
    {
        text-decoration: none;
        color:#fff;
    }



.language_menu
{
    height: auto;
    padding: 0px;
    text-align: left;   
    font-size: 100%;
    display:none;
    position:absolute;
    top:-5px;
}
.language_menu a
{
    width: 100%;
    padding: 0px;
    text-align: left;
    color: #013F69; /*link-color*/
}

    .language_menu td {
        padding:0px;
        padding-top:1px;
        padding-bottom:2px;
    }
.language_menu tr:hover
{
    background-color: #013F69;
}

    .language_menu tr:hover a
    {
        text-decoration: none;
        color:#fff;
    }
/*
.hover:hover
{
    background-color: #aaaaaa;
}
*/


/***************************
Kokouskäsittelyn vaiheet   *
***************************/

ul.kkvaihe {
    display:table; 
    list-style-type:none;
    margin:0px;
    padding:2px;    
    position:absolute;
    z-index:999;

    border: dotted 1px #666666;
    background-color: #eeeeee;
}
    ul.kkvaihe li {
        display: block;
        width: 36px;
        height: 22px;
        padding: 0px; margin:0px;
        white-space: nowrap;
        background-repeat:no-repeat;
    }

input.kkvaihe, input.kkvaihe:hover {
    color: transparent;
    display: block;
    width: 36px;
    height: 22px;
    padding: 0px; margin:0px;
    white-space: nowrap;    
    border:0px;
    background: none;
    background-repeat:no-repeat;
}
    input.kkvaihe[disabled] {
        color: transparent;
        display: block;
        width: 36px;
        height: 22px;
        padding: 0px;
        margin: 0px;
        white-space: nowrap;
        border: 0px;
        background: none;
        background-repeat: no-repeat;
    }

    input.kkvaihe, .kkvaihe_tyhja {
        background-image: url("../images/kk_tyhja.gif");
    }
input.kkvaihe[value="+"], .kkvaihe_plus {
    background-image:url("../images/kk_plus.gif");      
}
input.kkvaihe[value="+/-"], .kkvaihe_plusminus {
    background-image:url("../images/kk_plus_minus.gif");    
}
input.kkvaihe[value="-"], .kkvaihe_minus {
    background-image:url("../images/kk_minus.gif");
}

input.kkvaihe:hover, .kkvaihe_tyhja:hover {
    background-image:url("../images/kk_tyhja_hover.gif");
}
input.kkvaihe[value="+"]:hover, .kkvaihe_plus:hover {
    background-image:url("../images/kk_plus_hover.gif");      
}
input.kkvaihe[value="+/-"]:hover, .kkvaihe_plusminus:hover {
    background-image:url("../images/kk_plus_minus_hover.gif");    
}
input.kkvaihe[value="-"]:hover, .kkvaihe_minus:hover {
    background-image:url("../images/kk_minus_hover.gif");
}


.kk_popup {
    position:absolute; 
    background-color:White; 
    z-index:100; 
    width:36px;
    border:1px solid #BBBBBB;
    margin-left: -3px;
}

.kk_popup td {
    padding:1px 0px 1px 0px !important;
}


/************
* Viestipuu *
************/

ul.message_tree
{
    padding: 0px;
    margin: 0px;
}
li.message_node .collapse_button
{
    display:none;
}
li.message_node .collapse_button.collapsed {
    background-image: url("../images/expand.gif") !important;
}
li.message_node .collapse_button.collapsed:hover
{
	background-image: url("../images/expand_hover.gif")!important;
}

li.message_node
{
    list-style-type: none;
    margin: 0px;
    margin-left: 18px;

}

ul.message_rootnode
{
    margin-bottom: 15px;
    margin-left: 0px;
    margin-right: 10px;
    position: relative;
}
.message_rootnode.collapsed .message_node {
    position: absolute;
    top: 0px;
}
.message_rootnode.collapsed .message_node .message_content {
    max-height: 90px;
    overflow:hidden;
}
li.message_node:last-child  {
    position:relative !important;
    max-height:none !important;
}
li.message_node:last-child .message_content {
    position:relative !important;
    max-height:none !important;
        max-height: none !important;
}
li.message_node:last-child .collapse_button {
    display: block !important;
}
.message_content
{
    width: 100%;
    vertical-align: top;
    background-color: #f0f0f0;
    padding: 4px;
    margin-bottom: 3px;
    border: 1px solid black;
    border-radius: 5px;
    box-shadow: 0 1px 7px rgba(0,0,0,0.4);
}
.message_bg_office
{
    background-color: #ccddee; /*#bbddff*/
}

.message_bg_applicant
{
    background-color: #fff0b1; /*#ffeace; */
}

.message_content_right /* TODO: 'float:right' not properly cleared after use */
{
    width: 75%;
    vertical-align: top;
    padding: 4px;
    margin-bottom: 3px;
    margin-left: 70px;
    border: 1px solid black;
    border-radius: 5px;
    float: right;
    box-shadow: 0 1px 7px rgba(0,0,0,0.4);
}

.message_content_left /* TODO: 'float:left' not properly cleared after use */
{
    width: 75%;
    vertical-align: top;
    padding: 4px;
    margin-bottom: 3px;
    margin-right: 70px;
    border: 1px solid black;
    border-radius: 5px;
    float: left;
    box-shadow: 0 1px 7px rgba(0,0,0,0.4);
}

.message_new
{
    border: 5px solid #ffaf47;
    background-color: #ffeace; /*#fff0b1; #F5F5D0;*/
    box-shadow: 0 1px 7px rgba(0,0,0,0.4);
}

.message_content *
{
    vertical-align: top;
}

.message_rootnode_content
{
    background-color: #CCDDEE;
}

td.message_img
{
    width: 60px;
}
td.message_text
{
    width: 100%;
    padding-top: 6px;
    margin-right: 10px;
    text-align: left;
}
td.message_info
{
    width: 120px;
    text-align: right;
    font-size: 80%;
}
.add_viesti
{
    color: #1B2EDD;
    text-shadow: #CCC 2px 2px 2px;
}

.add_viesti:hover
{
    color: #FFF;
    text-shadow: #000 2px 2px 2px;
    cursor: pointer;
    text-decoration: none;
}


/************************
/*  TABLE EDITOR (AJAX) *
*************************/

.table_editor {
    clear:both;
}
.table_editor table {
    
    overflow:hidden;
    border-collapse:separate; 
    border-spacing: 0px;
}
.table_editor table td {
    /*white-space:nowrap;*/
    overflow:hidden;
}
.table_editor tbody tr:hover {
    background-color:#eeeeee;
}
.table_editor .data input, .table_editor .data textarea, .table_editor .data select {
    width: 85%;
    width: calc(100% - 20px);
    float: left;
}
.table_editor .data input.none, .table_editor .data textarea.none, .table_editor .data select.none {
    width: 95%;
    width: calc(100% - 8px);
    float: left;
}
.table_editor .boolean {
    width: auto !important;
    float:left;
}
.table_editor .not_valid input, .table_editor .not_valid textarea, .table_editor .not_valid select {
    background-color: #fcdada;
}
.table_editor .data img {
    visibility: hidden;
}
.table_editor .not_valid img {
    visibility: visible !important;
}
.table_editor .multiline_len
{
    visibility:hidden;
	font-size: 11px;
	color: #999999;
    clear:both;
    display:block;
    height:10px;
}
.table_editor .not_valid .maxlen
{    
    color:red;
}

/************************
* Allekirjoitus näkymä  *  
 ***********************/
.allekirjoitus_table tr {
    height: 25px;
}
.allekirjoitus_table td {
    padding: 4px;
}
.allekirjoitus_table tr td:first-child {
    font-weight: bold;
    text-align: right;
}
.ak_tila_allekirjoitettu {
    color: limegreen;
    font-weight: bold;
}
.ak_tila_puuttuu {
    color: red;
    font-weight: bold;
}


/******************
* Tiedotepaneelit *
*******************/
.tiedote
{
    position:relative;
    text-align: left;
    width: 100%;
    overflow:hidden;
    overflow-style:initial;
    margin-bottom:2px;
}
.tiedote_fader {
    /*background-image: url(../images/tiedote_piilota_bg.png);*/
    background-position: bottom;
    background-repeat: repeat-x;
    width: 100%;
    height: 20px;
    position:absolute;
    bottom: 0px;
    left: 0px;
    z-index: 2;
}
.tiedote_piilotus {
    border-top: solid 1px #C0C0C0;
    padding-top: 2px;
    text-align:center;
    margin-left:auto;
    margin-right: auto;
}
/*.tiedote_piilotus.piilota_tiedote .nayta {
    display:none !important;
}
.tiedote_piilotus.piilota_tiedote .piilota {
    display:inline !important;
}
.tiedote_piilotus .nayta {
    display:inline;
}
.tiedote_piilotus .piilota {
    display:none;
}*/

/*.piilotettu_tiedote
{
    max-height: 250px;  
}*/


/*************
* Validointi *
*************/
.error_text {color: #ee0000;}
.error_asterisk {color: #ee0000; font-size: 130%;}
.validation_summary
{
    color:#bb0b0b;
    border:1px solid #bb0b0b;
    background-color:#fcdada;
    padding:8px;
    padding-left:85px;
    text-align:left;
    background-image:url('../images/varoitus.gif');
    background-repeat:no-repeat;
    min-height:45px;    
}
input.validation-error, select.validation-error, textarea.validation-error {
    border: 1px solid #bb0000;
    background-color: #FCDADA;
}
input[type=submit].validation-error {
    /*border: 1px solid #bb0000;*/
}
input[type=file].validation-error {
    border: 1px solid #bb0000;
    background-color: #FCDADA;
    height: 35px;
    vertical-align: bottom;
    padding-top: 5px;
}

input[type=checkbox].validation-error {
    outline: 7px solid #fcdada;
    color: #999999;
}
/*input[type=checkbox].validation-error::after {
    content: " ";
    opacity: 0.5;
    position: relative;
    right: 4px;
    border: 1px solid #bb0000;
    border-radius: 10px;
    background-color: #FCDADA;
    padding: 10px;
}*/

span.validation-error {
    /*border: 1px solid #bb0000;*/
    padding: 5px;
    display: inline-block;
    background-color: #FCDADA;
    border-radius: 10px;
}
span.validation-ok {
    /*border: 1px solid transparent;*/
    padding: 5px;
    border-radius: 10px;
    display: inline-block;
}
div.validation-error:not(.css_novalidationcolor),
div.validation-error:not(.css_novalidationcolor) select,
div.validation-error:not(.css_novalidationcolor) .chosen-choices {
    display: inline-block;
    background-color: #FCDADA;
    border-radius: 10px;
    padding: 5px;
}

div.validation-error:not(.css_novalidationcolor) select {
    border: 1px solid red;
}
/*häx chosenia varten*/
div.validation-error:not(.css_novalidationcolor) .chosen-choices {
    border: 1px solid red;
    background: #FCDADA;
}
/*häx chosenia varten*/
div.validation-error:not(.css_novalidationcolor) .chosen-choices input {
    color: black !important;
    font-size: 15px !important; /*DefaultFontSize*/
}

table.validation-error, td.validation-error {
    /*border: 1px solid #bb0000;*/
    background-color: #FCDADA;
    border-radius: 10px;
}
table.validation-ok, td.validation-ok {
    /*border: 1px solid transparent;*/
    border-radius: 10px;
}

tr.validation-error > td:first-child {
    /*border: 1px solid #bb0000;
    border-right: none;*/
    background-color: #FCDADA;
    border-radius: 10px 0 0 10px;
}
tr.validation-error > td {
    /*border-top: 1px solid #bb0000;
    border-bottom: 1px solid #bb0000;*/
    background-color: #FCDADA;
}
tr.validation-error > td:last-child {
    /*border: 1px solid #bb0000;
    border-left: none;*/
    background-color: #FCDADA;
    border-radius: 0 10px 10px 0;
}



option.option-not-required {
    background-color: white !important;
}
option.option-required {
    background-color: #FCDADA;
}


div.required-color {
    background-color: #FCDADA;
    border-radius: 5px;
}

td.required-color-text {
    /*font-style: italic;*/
    background-color: #FCDADA;
    border-radius: 0px 5px 5px 0px;
}
td.required-text {
    font-style: italic;
}
td.required-color-cb {
    vertical-align: middle;
    align-items: center;
    padding: 5px;
    background-color: #FCDADA;
    border-radius: 5px 0px 0px 5px;
}
td.required-cb {
    vertical-align: middle;
    padding: 5px;
    align-items: center;
}


span.required-color {
    color: RED;
    font-weight: bolder;
}
span.hidden {
    visibility: hidden;
    color: RED;
    font-weight:bolder;
}

img.validator_img {
    margin-left: 2px;
    margin-right: 2px;
}

input.isoNappula {
    float: center;
    padding: 30px 300px;
    text-align: center;
    /*text-decoration: none;
    display: inline-block;*/
    font-size: 20px;
}

/************
* Sekalaista *
*************/

.link {
    cursor: pointer;
    color: #115599; /*link-color*/
}

.small { font-size:90%;}
.xsmall {font-size:80%;}
.large {font-size:120%;}
.xlarge {font-size:130%;}

.close
{
    background: url('../images/close.gif') no-repeat !important;
    float:right; 
    cursor:pointer;
    width:20px !important;
    height:20px !important;
    border:none !important;
    padding:0px !important;
}
.close:hover
{
    background: url('../images/close_hover.gif') no-repeat !important;
}

.help /*sivulle sijoitettu ohjeteksti*/
{
    font-size: 100%;
    color: #333333;
    /*font-style: italic;*/
}
.helpedit_nuoli {
    width:18px !important; 
    height:18px !important;
    padding:2px !important;
    background-color: #3777A0 !important;
}
.help_rounded {
    display: inline-block;
    background-color: #eeeeee;
    border-radius: 7px;
    padding: 10px;
    white-space: pre-line;
}
.extra_info { /*Lisäinfolle joka on jollain tapaa kiinnostavaa mutta ei tärkeä sivun päätoimintojen kannalta (esim aikaleimat) */
    font-size:80%;
    /*font-style:italic;*/
}

/*.pagerold
{
    color: #FFFFFF;
    background-color: #2461BF;
    font-weight: bold;
    text-align: right;
}*/
.pager
{
    background-color: Transparent;
    font-weight: bold;
    text-align: right;
}






.layout_panel
{
    /*background-color: #CCDDEE;
    border: 1px solid #000033;
    padding: 10px;
    margin-bottom: 8px;
    margin-right: 8px;
    border-radius: 8px 8px 8px 8px;*/


    background-color: #F0F0F0;
    background: linear-gradient(to bottom, #FFFFFF, #F0F0F0 );

    border-bottom: 1px solid #CECECE;
    border-left: 1px solid #DFDFDF;
    border-right: 1px solid #DFDFDF;
    border-top: 1px solid #F0F0F0;
    padding: 10px;
    margin-bottom: 8px;
    margin-right: 8px;
}

.layout_panel.small_panel
{
    width: 450px;
    min-height: 40px;
}

.layout_panel.normal /* Keep height of normal at 2*(height padding + border) + margin of 'small' variant to help keep boxes vertically aligned. */
{
    width: 450px;
    min-height: 110px;
}
.layout_panel.big {
    width: 450px;
    min-height: 180px; /*equals 1 normal + 1 small*/
}





.expand_button
{    
    background-image: url("../images/expand.gif") !important;
    background-repeat: no-repeat; background-position: center; background-color: transparent;
    border-width: 0px; border: none !important; 
    height: 24px; width:24px; min-width: 1px !important;
    padding: 0px !important;

}
.expand_button:hover
{
    background-image: url("../images/expand_hover.gif") !important;
    cursor: pointer; 
   
}
.collapse_button
{    
    background-image: url("../images/collapse.gif") !important; 
    background-repeat: no-repeat; background-position: center; background-color: transparent;
    border-width: 0px; border: none !important; 
    height: 24px; width:24px; min-width: 1px !important;
    padding: 0px !important;
}
.collapse_button:hover
{
    background-image: url("../images/collapse_hover.gif") !important;
    cursor: pointer; 
   
}




.multiline_len
{
    font-size: 11px;
    color: #999999;
}
.multiline_len_error
{
    font-size: 11px;
    color: Red;
}

.watermark
{
    color: #999999;
    text-align: center;
}



.avatar
{
    /*background-color: transparent;
    background-image: url("../images/avatar_pohja.png");
    background-repeat: no-repeat;
    height: 38px;*/
    /*border: solid 1px white;*/
    width: 38px; /*padding: 3px;*/
}
    .avatar img {
        /*height: 38px;*/
        width: 38px;
        /*padding: 6px;*/
        border: solid 1px white;
    }

.hanke_editing {
    border: 1px solid red;
    background-color: #ff5555;
    padding: 10px;
    margin-bottom: 5px;
}


.jaavi
{
    color: #AAAAAA;
}
.new_mail {
    background-color: #ff8800;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
    color: #ffffff;
    padding: 2px 3px 2px 3px;
    border-radius: 4px;
    white-space: nowrap;
}

.important
{
    margin-bottom:5px;
    padding:5px;
    background-color: #fcd49f;
    border-radius: 5px;
    display: inline-block;
}


.hakemustila 
{
	font-size:90%; font-weight: bold; 	
	border: 1px;
    border-radius: 5px;
    display:table;
    
    padding: 5px;
    margin-bottom: 5px;
    /*white-space: nowrap;*/
}
.suositustila {
    font-weight: bold;
    padding: 5px;
}

.radiobuttonlist td { padding-right: 10px; padding-bottom: 6px; }
ul.radiobuttonlist { list-style-type: none; }
ul.radiobuttonlist li {padding-bottom: 6px; }

/*Javaskript ShowPopupMessage-funktion luoma popup-paneeli viestien näyttämiseen*/
div.popup_message_panel {
    color:#000000; background-color:#CCDDEE; 
    border: 1px solid #000000;
    width:260px; height:140px;
    position:fixed; 
    left:50%; top:50%; /* topleft at center of screen*/
    margin-left:-130px; /*using negative margins to center exactly (0.5 * width) */ 
    margin-top:-70px; /*(0.5 * height)*/
    padding:10px;
    border-radius:5px;
    opacity:0.9;
    text-align:center; 
    box-shadow: 0 1px 7px rgba(0,0,0,0.4);
    overflow:auto;
    font-weight: bold;
    display:table;
    z-index:999;
}
div.popup_message_panel div {
    display:table-cell;
    vertical-align:middle;
}


.ui-effects-transfer { border: 2px dotted black; opacity: 0.5;}


.focus .multiline_len
{
    visibility:visible;
}

/*table.test  td
{
    border: 1px solid black;
    background-color: white;
    width: 15px;
    white-space: nowrap;
}*/


#fgv_footer_row_float {
    position:fixed;width:100%;display:none; z-index: 10;
}
#fgv_header_row_float {
    position:fixed;width:100%;display:none; z-index: 10;
}
.loki_viesti {
    background-color: #CCDDEE !important;
}
.loki_uusi {
    font-weight: bold;    
}
.loki_vanha {
    font-style: italic;
}


input[type=text][disabled], textarea[disabled] {
    border: none;
    background-color: transparent;
}

.disabled {
    pointer-events: none;
    color: black;
}

.hakemusosio {
    padding:10px;
    border: solid 1px transparent;
    border-radius: 5px;
    margin-bottom: 20px;
    background-color: #fff;
    box-shadow: 0 1px 7px rgba(0,0,0,0.4);
}

.autosaver_prompt {
    position: fixed;
    z-index: 1000;
    bottom: 1px;
    border-radius: 2px;
    background-color: #FCD49F;
    margin-left: -449px;
    left: 50%;
    padding: 5px;
    width: 889px;
    display: none;
    text-align: center;
    color: #000;
    opacity: 0.9;
    border: solid 1px #000;
    box-shadow: 0 1px 7px rgba(0,0,0,0.4);
}

.arviointi_valmis {
    color: green;
}
.arviointi_kesken {
    color:red;
}

.langedit_editable {
    border-bottom: 1px dashed blue;
    cursor: pointer;
}
    .langedit_editable:hover {
        background-color: blue;
        color: white;
    }

.hakemustag {
    display:inline-table !important;
    border:1px solid black;
    padding:4px;
    /*margin-top:5px;
    margin-bottom:5px;*/
    margin-right:2px;
    border-radius:5px;
    font-size:90%;
    min-height:1em;
    min-width:1em;
    max-width: 180px;
    height: 1em;    
    text-align:center;   
   
    /*height:auto;*/
    /*white-space:nowrap;*/
}

/*.leima_editor tr td {
    height:32px;
    padding-left:15px;
    width:550px;
}*/

div.autosavewarning {
    color: #ee0000;
    background-color: #fcdada;
    border: 1px dashed #ee0000;
    padding:5px;
    border-radius: 7px;
}

div.dragbar {
    background: linear-gradient(to right, #DDDDDD, #FFFFFF);
    cursor: move;
}
/********
* Värit *
********/

.red_text { color: #dd0000;}
.white_text { color: #ffffff;}
.gray_text{ color: #727272; }
.dgray_text{ color: #555555; }
.green_text { color: #008500; }
.yellow_text { color: #dd6600; }
.blue_text { color: #0000ff; }
.orange_text { color: #ffaf47; }
.black_text { color: #000000;}
.black_text a { color: #000000;}

.red_bg { background-color: #dd2222 !important;}
.green_bg { background-color: #009900 !important; }
.green_bg2 { background-color: lightgreen }
.yellow_bg { background-color: #ff8800; }
.dgray_bg{ background-color: #555555; }
.black_bg { background-color: #000000;}

.color_box {
    width:30px; 
    height:17px; 
    border: 1px solid black; 
    padding-top: 2px;
}


/**************
* Histogrammi *
**************/
div.histogram
{
    display:table-row;
}
    div.histogram div
    {
       display:table-cell;
       float:left; 
       border:1px solid white; 
       color:white; 
       text-align:center; 
       padding:2px;
    }


.tapahtumat_os
{
    margin-left:-28px; 
    font-size:15px; 
    background-color: rgba(255,255,255,0.8); 
    font-weight:bold
}
.tapahtumat_os[title="Vista"]
{    
    margin-left:-28px; 
    font-size:11px;   
}


.tapahtumat_browser
{
    margin-left:-25px; 
    background-color: rgba(255,255,255,0.8); 
    font-weight:bold;
    font-size:11px !important;
}

.order_button_up
{
    background-position: center;
    background-image:url('../images/ylos.gif') !important; 
    background-repeat: no-repeat !important; 
    background-color: #3777F0 !important;
}

.order_button_down
{
    background-position: center;
    background-image:url('../images/alas.gif') !important; 
    background-repeat: no-repeat !important; 
    background-color: #3777F0 !important;
}

ul.dragsort
{
    padding:0px;
    width:400px;
}
    ul.dragsort li
    {
        list-style: none;        
        margin-top:1px;

        background-color: #F0F0F0;
        background: linear-gradient(to bottom, #FFFFFF, #F0F0F0);

        border-bottom: 1px solid #CECECE;
        border-left: 1px solid #DFDFDF;
        border-right: 1px solid #DFDFDF;
        border-top: 1px solid #F0F0F0;
        padding:3px;
    }
        ul.dragsort li div
        {
            display: table-cell;
            padding:5px;
    
        }

.ratingStar
{
    font-size: 0pt;
    width: 26px;
    height: 24px;
    margin: 0px;
    padding: 0px;
    cursor: pointer;
    display: block;
    background-repeat: no-repeat;
}

.emptyRatingStar
{
    background-image: url('../images/emptystar.png');
}

.filledRatingStar 
{
    background-image: url('../images/filledstar.png');
}

.savedRatingStar 
{
    background-image: url('../images/savedstar.png');
}


.fwdCellActiveHighLight {
    background-color: palegoldenrod !important;
    /*border: 1px solid darkred;*/
}
.fwdCellActive {
    background-color: lightgoldenrodyellow;
    /*border: 1px solid darkkhaki;*/
}
.fwdCellInActive {
    background-color: transparent;
    /*border: 1px solid transparent;*/
}

.fwdCell {
    padding: 5px;
    padding-top: 10px;
    padding-bottom: 10px;
    margin: 1px;
    vertical-align: middle;
}

.fwdCellPos
{
    cursor: pointer;
    content:url("../images/kk_plus.gif");
}
    .fwdCellPos:hover
    {
        content:url("../images/kk_plus_hover.gif");
    }

.fwdCellNeg
{
    cursor: pointer;
    content:url("../images/kk_minus.gif");
}
    .fwdCellNeg:hover
    {
        content:url("../images/kk_minus_hover.gif");
    }

.fwdDisabledCell
{
    background-color: #dddddd;
}

.top-sticky {
    position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 0;
    background-color: white;
    border-bottom: 2px solid lightgrey;
}
.left-sticky {
    position: -webkit-sticky; /* Safari */
    position: sticky;
    left: 0;
    background-color: white;
    border-right: 2px solid lightgrey;
}

.completionlist
{
    padding:5px;    
    background-color:white;
    border:1px solid black;
    list-style:none;
}

.rahasto_otsikko {
    background-color:#BBBDBF;
    padding:4px;
    padding-top:6px;
    cursor:pointer;
    border-bottom:1px solid black;
}

.rahasto_jaettu
{
    border: 1px solid brown !important;
}

.rahasto_yhdistetty
{
    border: 1px solid green !important;
}

.rahasto_yhdistettavat
{
    border: 1px solid orange !important;
}

ul.rahastovuosi_row
{
    padding:0px;
    width:400px;
    margin:0px;
}
    ul.rahastovuosi_row li
    {
        list-style: none;        
        margin-top:1px;

        background-color: #F0F0F0;
        background: linear-gradient(to bottom, #FFFFFF, #F0F0F0);

        border-bottom: 1px solid #CECECE;
        border-left: 1px solid #DFDFDF;
        border-right: 1px solid #DFDFDF;
        border-top: 1px solid #F0F0F0;
        padding:3px;
    }
        ul.rahastovuosi_row li div
        {
            display: table-cell;
            padding:5px;
    
        }

    ul.rahastovuosi_row.locked {
        color:#999999 !important;
    }

.kayttajahallinta_valittu_kayttaja
{
    border:dashed 1px #222222;
    padding:2px;
    margin-left:-3px;
    background-color: #11cc11;   
}
    .kayttajahallinta_valittu_kayttaja a, .kayttajahallinta_valittu_kayttaja span
    {
        color: black !important;
    }


tr.userrow:hover
{
    background-color:#999999;
    cursor:default;
}

tr.mela_tyoryhmarivi td {
    color:#bbbbbb;
}

ul.languageToolbar
{
    margin: 0px;
    padding: 0px;
    padding-left:10px;
    padding-top:8px;
    list-style-type: none;
    text-align: left;
    border: 0px;
    float:left;

}
ul.languageToolbar li
{
    margin: 0px;
    padding: 0px;
    display: inline;
}
ul.languageToolbar a
{
    font-size:110%;
    display: inline-block;
    text-decoration: none;
    color: #fff;
    margin-right: 0px;    
}
table.language_popupmenu {    
    width:100%;
}
    table.language_popupmenu tr:not(:first-child):hover {
        background-color: #CECECE;
        cursor:pointer;
    }

.language_highlight {
    background-color: yellow;
}

.red_checkbox[type="checkbox"]:before{
    position: relative;
    display: block;
    width: 11px;
    height: 11px;
    border: 1px solid red;
    content: "";
    background: #FFF;
}
.red_checkbox[type="checkbox"]:after{
    position: relative;
    display: block;
    left: 3px;
    top:-15px;
    width: 7px;
    height: 7px;
    /*border-width: 1px;
    border-style: solid;
    border-color: #B3B3B3 #dcddde #dcddde #B3B3B3;*/
    content: "";
    /*background-image: linear-gradient(135deg, #B1B6BE 0%,#FFF 100%);
    background-repeat: no-repeat;
    background-position:center;*/
}
.red_checkbox[type="checkbox"]:checked:after{
    content: "x";
    color:red;
    
    /*background-image:  url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAQAAABuW59YAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAAB2SURBVHjaAGkAlv8A3QDyAP0A/QD+Dam3W+kCAAD8APYAAgTVZaZCGwwA5wr0AvcA+Dh+7UX/x24AqK3Wg/8nt6w4/5q71wAAVP9g/7rTXf9n/+9N+AAAtpJa/zf/S//DhP8H/wAA4gzWj2P4lsf0JP0A/wADAHB0Ngka6UmKAAAAAElFTkSuQmCC'), linear-gradient(135deg, #B1B6BE 0%,#FFF 100%);*/
}

li.hakemus_taydennys {
    margin:0px !important;
    list-style-image:none !important;
}
    li.hakemus_taydennys th {
        padding:0px;
        margin:0px;
    }

    li.hakemus_taydennys td {
        text-align:left;
        white-space:nowrap;
        padding-top:0px !important; 
        padding-left:5px;
        margin:0px;
        overflow-x:hidden;
        max-width:300px !important;
        font-size:14px !important;
    }

.cookie_info {
    border: 1px solid black;
    background-color: #ddeeee;
    margin: auto;
    padding: 50px;
    color: black;
    text-align: center;
    font-size: 110%;
    font-style: italic;
}

.cookie_subinfo {
    margin: auto;
    padding: 50px;
    color: black;
    background-color: #ddeeee;
    text-align: left;
    font-style: italic;
    font-weight: normal;
    white-space: pre-wrap;
}

.rounded_border {
    border: 1px solid #999999;
    border-radius: 7px;
}

/*************************
Muokkaa hakemuskenttiä   *
*************************/

.muokkaa_hakemuskenttia_arvot {
    border: 1px dotted black;
    border-radius: 0 10px 10px 10px;
    padding: 10px;
    background-color: #ddeedd;
}


.hoverHighLight{
}
.hoverHighLight:hover {
    background-color: Highlight;
}

div.painopiste {
    color: navy;
    padding: 5px;
    /*border: 2px solid navy;*/
}
ul.painopiste {    
    color: navy;
    background-color: white;
    cursor:pointer;
}
    ul.painopiste > li {
        list-style: none;       
    }

ul.teema > li {
    list-style: none;
    /*border: 1px solid navy;*/
    padding:3px;
    margin-top:2px;
}
    ul.teema > li:hover {
        background-color:darkkhaki;
    }


div.valmis {
    padding:10px;
    background-color: aliceblue;
    font-size: 110%;
    font-weight: bold;
}

table.vertical_align_middle td, table.vertical_align_middle th {
    vertical-align: middle;
}

.cal_day{
    border:1px solid black;
    padding:10px;
    text-align:center;
    font-size:20px;
}
.cal_green {
    background-color: #aaffaa;
}

.cal_red {
    background-color: #ffaaaa;
}

/*********************************************************************
* TODO: Bad css practices, avoid using and try to get rid of these   *
**********************************************************************/
    /* Onko kokouskäsittelylistauksen esityssolu niin erikoinen lumihiutale että sille tarvitaan ihan oma tyylimääritelmä pelkästään 
    kursorin muuttamiseksi pointer tyyliseksi? */
    .esitys {
    cursor:pointer;
}
.esitys:hover {
    font-weight: bold;
}


.smallheader /*pitäisi käyttää <hN> tägejä, h5 vastaa parhaiten smallheaderiä */
{
    font-weight: bold;
}

/* 'jq_' alkuiset tarkoitettu implikoimaan että kyseessä on puhtaasti jquery koodille tarkoitettu flagi johon ***ei ole liitetty tyyliä*** */
/*.jq_delete { 
    cursor:pointer;
}*/

/* Tapauksia jossa luokka nimetty suoraan tyylin mukaan esim. ".bold {font-weight-bold"}. */
 table.cellpadding_1 th, table.cellpadding_1 td
{
        padding: 1px;
}
table.cellpadding_4 th, table.cellpadding_4 td
{
        padding: 4px;
}
.align_right
{
    text-align: right;
    padding-right: 10px;
    white-space: nowrap;
}
.align_right td
{
    text-align: right;
    padding-right: 10px;
    white-space: nowrap;
}
.align_right input[type=text]
{
    text-align: right;
}
.align_center {text-align: center;}
.align_center td {text-align: center; }

/* consider using <em> element when it is semantically appropriate */
/*.italic 
{
    font-style: italic;
}*/

/* consider using <strong> element when it is semantically appropriate */
/*.highlighted, .bold 
{
	font-weight: bold;
}*/


/* v8 - v12: replace with fewer and more descriptive styles (ie small, normal, big...) */
.v8{font-size: 80%;}
/*.v9{ font-size: 80%;}*/
.v10 {font-size: 90%;}
.v11 {font-size: 100%;}
.v12 {font-size: 110%;}

.overflowy_hidden {
    overflow-y: hidden;
}

code::selection
{
    background-color: red;
    color:white;
}

.marker {
    background-color: yellow;
}

.overlay-background {
    position: fixed;
    background: rgba(0,0,0,0.2);
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 1;
}


.acui_hover_popup {
    position: relative;
    display: inline-block;
}

    .acui_hover_popup .acui_hover_sisalto {
        display: none;
        /* Position the tooltip */
        position: absolute;
        z-index: 50;
    }

    /* lapsi hover sisältö näkyviin jos hoverataan containerin päällä */
    .acui_hover_popup:hover .acui_hover_sisalto, .acui_hover_popup:focus .acui_hover_sisalto {
        display: inline-block;
        top: 0px;
        left: 90%;
    }

    /* lapsi hover sisältö piiloon jos input lapsessa on focus ja hover sisältö on sen sisarus */
    .acui_hover_popup input:focus ~ .acui_hover_sisalto, .acui_hover_popup textarea:focus ~ .acui_hover_sisalto {
        display: none !important;
    }

/* lapsi hover sisältö näkyviin jos hoverataan containerin päällä */
.acui_hover_ala_oikea {
    display: inline-block;
    top: 90% !important;
    left: 90% !important;
}

.acui_hover_ala {
    display: inline-block;
    top: 90% !important;
    left: 50%;
    transform: translateX(-50%);
    /*keskelle*/
}

.acui_hover_vasen {
    left: 10% !important;
    transform: translateX(-100%);
    /*oikealle*/
}

/*tyylimäärite hover sisällölle, erotellaan rakenteellisesta css:tä*/
.css_hover_sisalto {
    background-color: white;
    border: 2px solid lightgrey;
    border-radius: 10px;
    padding: 10px;
    text-align: left;
}