// jasrekvaalit.css

.ui-page {
	background: #fff;
}



#main-header {
    background: #299FE5 !important;      
    background: #fff !important;
}

div.h1 {
   font-weight:bold;
   font-size:20pt;
   padding-bottom:0.5em;   
}
          
h1 {
   margin:0;
   padding:0;
   padding-bottom:0.5em;
   font-weight:bold;
   font-size:16pt;
}

h2 {
   margin:0;
   padding:0;
   font-weight:bold;
   font-size:12pt;
}

div.h2 {
   font-weight:bold;
}

h1.laatikkootsikko {
   margin:0;
   padding:0;
   font-size:16pt;
   color:#299FE5;
}

span.nobold {
   font-weigth: normal !important;
}

#ajanmittausPalkki
{
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(229,229,229,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(229,229,229,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */
}

.longFlip ui-field-contain div.ui-slider-switch
{
   width:12em;
}

hr
{
   border: 0;
   height: 0;
   border-top: 1px solid rgba(0, 0, 0, 0.1);
   border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

div.virhediv {
   color: red;
   text-align:center;
}

table.luettelo {
   background-color:#ddd;
}

table.luettelo td {
   background-color:#fff;
   padding-right:0.5em;
   font-size:10pt;
}

table.luettelo th {
   background-color:#eee;
   font-weight:normal;
   text-align:left;
   padding-right:1em;
   padding-left:0.5em;
   font-size:10pt;
}

table.luettelo tr.hover td {
 	background:#c5d8f5;
   cursor: pointer;   
}

table.luettelo2 {
   background-color:#fff; /*bbb;*/
}

table.luettelo2 td {
   background-color:#fff;
   font-size:10pt;
}

table.luettelo2 th {
   background-color:#fff;
   font-weight:normal;
   text-align:left;
   padding-right:1em;
   padding-left:0.5em;
   font-size:10pt;
}

table.luettelo2 tr.hover td {
 	background:#c5d8f5;
   cursor: pointer;   
}


div.kirjaustieto {
   color: #808080;
   font-size: 9pt;
   padding-top: 0.5em;
}

jalert-container {
   background-color: #ffe; /*rgba(255,255,0, 0.80) !important;*/
}

li {
   white-space:normal !important;
}

span.hakutausta {
   background-color:#ff0;
}

div.palsta_left {
   width:49%;
   float:left;
}

div.palsta_right {
   width:50%;
   float:right;
}

@media screen and (max-width: 500px) {
   
   div.palsta_left {
        width:100%;
        float:none;
   }
   div.palsta_right {
        width:100%;
        float:none;
   }
   
}

div.ilmoitus2 {
   text-align:center;
}

span.nobold {  
   font-weight: normal !important;
}

div.info {
   padding: 0.5em;
   padding-left: 0;
   padding-top: 0;
   /*vertical-align:top;*/
   /*background-image:url('images/information.png') !important;*/
}   

div.menupalkki {
   background-color:#e0e0e0;
   padding-left:0.5em;
   margin-bottom:1em;
}

div.fbutton {
   float:left;
}

a.fbutton {
   float:left;
}
/*
​.ui-page .ui-content .ui-listview .ui-li-desc {
    white-space : normal;
}​

a {
   white-space : normal;
}
*/

.ui-listview>.ui-li-static, .ui-listview>.ui-li-divider, .ui-listview>li>a.ui-btn {
   white-space: normal;
}

.dropzone {
   border:1px dotted #aaa  ;
   padding:1em;
}



.book-dz-container {
    border: 1px solid rgba(0,0,0, 0.33);
    padding: 5px 10px;
    background: rgb(255,255,255);/*rgb(205,235,139);*/
/*    background: -moz-linear-gradient(top,  rgba(205,235,139,1) 0%, rgba(208,244,141,1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(205,235,139,1)), color-stop(100%,rgba(208,244,141,1)));
    background: -webkit-linear-gradient(top,  rgba(205,235,139,1) 0%,rgba(208,244,141,1) 100%);
    background: -o-linear-gradient(top,  rgba(205,235,139,1) 0%,rgba(208,244,141,1) 100%);
    background: -ms-linear-gradient(top,  rgba(205,235,139,1) 0%,rgba(208,244,141,1) 100%);
    background: linear-gradient(to bottom,  rgba(205,235,139,1) 0%,rgba(208,244,141,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cdeb8b', endColorstr='#d0f48d',GradientType=0 );*/
    color: #000;
    text-shadow: 0px 0px 0px #fff;

    width: 30%;
    /*float: left;*/
    display:block;    
    margin: 5px 0px;
    margin-right: 3%;
}

.book-dz-progressbar > div {
    height: 20px;
    margin: 5px 0px;
    background: rgb(255,255,255); /*rgb(230,240,163);*/
    background: -moz-linear-gradient(top,  rgba(230,240,163,1) 0%, rgba(210,230,56,1) 50%, rgba(195,216,37,1) 51%, rgba(219,240,67,1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(230,240,163,1)), color-stop(50%,rgba(210,230,56,1)), color-stop(51%,rgba(195,216,37,1)), color-stop(100%,rgba(219,240,67,1)));
    background: -webkit-linear-gradient(top,  rgba(230,240,163,1) 0%,rgba(210,230,56,1) 50%,rgba(195,216,37,1) 51%,rgba(219,240,67,1) 100%);
    background: -o-linear-gradient(top,  rgba(230,240,163,1) 0%,rgba(210,230,56,1) 50%,rgba(195,216,37,1) 51%,rgba(219,240,67,1) 100%);
    background: -ms-linear-gradient(top,  rgba(230,240,163,1) 0%,rgba(210,230,56,1) 50%,rgba(195,216,37,1) 51%,rgba(219,240,67,1) 100%);
    background: linear-gradient(to bottom,  rgba(230,240,163,1) 0%,rgba(210,230,56,1) 50%,rgba(195,216,37,1) 51%,rgba(219,240,67,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6f0a3', endColorstr='#dbf043',GradientType=0 );
    border: 1px solid rgba(0,0,0, 0.4);

    width: 0%;

    -webkit-transition: width 200ms ease-in-out;
    -moz-transition: width 200ms ease-in-out;
    -ms-transition: width 200ms ease-in-out;
    -o-transition: width 200ms ease-in-out;
    transition: width 200ms ease-in-out;
}

.book-dz-error-message {
    margin-top: 3px;
    background-color: red;
    color: #fff;
    text-shadow: 1px 1px 1px rgba(0,0,0, 0.75);
}

span.xml {
   color:#fff;
   font-weight:bold;
   //background-color:#338fff;
   background-color:#444444;
   //padding:0 0.5em;
   letter-spacing:0.2em;
}

td.tright {
   padding-left:1em;
   text-align: right;
}
/*
div.palsta_left {
   width:49%;
   float:left;
}

div.palsta_right {
   width:50%;
   float:right;
}

@media screen and (max-width: 666px) {
   
   div.palsta_left {
        width:100%;
        float:none;
   }
   div.palsta_right {
        width:100%;
        float:none;
   }
}

*/

div.palaute_div {
   padding-bottom:0.5em;
}

div.palsta_left {
   width:49%;
   float:left;
}

div.palsta_right {
   width:50%;
   float:right;
}

div.palaute_aika {
   float:right;
}

@media screen and (min-width: 666px) {

   div.palaute_div {
      width:30em;
      padding-bottom:0.5em;
   }
   
}

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

   div.palaute_aika {
      float:none;
   }

   
   div.palsta_left {
        width:100%;
        float:none;
   }
   div.palsta_right {
        width:100%;
        float:none;
   }
}


.alapalkki-banner {
   position:fixed;
   width:100%; 
   height:25px;
   background-color:#668cff;
   bottom:0;
   z-index:100;
   opacity: 0.6;
   filter: alpha(opacity=60); /* For IE8 and earlier */
   -webkit-box-shadow: 0px -3px 10px -2px rgba(0,0,0,0.75);
   -moz-box-shadow: 0px -3px 10px -2px rgba(0,0,0,0.75);
   box-shadow: 0px -3px 10px -2px rgba(0,0,0,0.75);
}
.alapalkki-banner-shadow {
   position:fixed;
   width:100%;
   height:25px;
   bottom:0;
   z-index:100;
   -webkit-box-shadow: 0px -3px 10px -2px rgba(0,0,0,0.75);
   -moz-box-shadow: 0px -3px 10px -2px rgba(0,0,0,0.75);
   box-shadow: 0px -3px 10px -2px rgba(0,0,0,0.75);
}

.alapalkki-banner-text {
   float:right;
   margin-right:40px;
   margin-top:3px;
   font-family:tahoma;
   color:white;
   text-shadow: -2px -1px #000000  ;
}

div.hakotab {
	border-bottom: 1px solid rgba(0,0,0,0.33);
   padding-left: 6px;
}
div.hakotab.relative-bottom {
	position: absolute;
	bottom: 0
}
div.hakotab div.single-tab {
	display: block;
	background-color: #e9e9e9;
	float: left;
	margin-right: 6px;
   /*border-top: 1px solid rgba(0,0,0,0.15);
   border-bottom-width: 0;*/
}

div.hakotab div.single-tab:last-of-type {
	margin-right: 0
}
div.hakotab div.single-tab a {
	display: block;
	color: #000 !important;
	padding: 5px 15px
}
div.hakotab div.single-tab.active-tab {
	background-color: #fff;
	border: 1px solid rgba(0,0,0,0.33);
	border-bottom-width: 0;
	border-top-left-radius: 2px;
	border-top-right-radius: 2px;
	margin-bottom: -1px
}
div.tabs-container {
	position: relative;
	width: 100%
}
div.tabs-container div.tab-content {
	display: none;
	-webkit-transition: all 200ms ease-out;
	-moz-transition: all 200ms ease-out;
	-ms-transition: all 200ms ease-out;
	-o-transition: all 200ms ease-out;
	transition: all 200ms ease-out
}
div.tabs-container div.tab-content.tab-content-visible {
	display: block
}
div.tabs-container div.tab-content.going-right {
	position: absolute;
	width: 100%;
	display: block;
	transform: translateX(25%);
	opacity: 0
}
div.tabs-container div.tab-content.going-left {
	position: absolute;
	width: 100%;
	display: block;
	transform: translateX(-25%);
	opacity: 0
}
div.tabs-container div.tab-loading {
	position: absolute;
	width: 100%;
	height: 100%;
	min-height: 200px;
	top: 0;
	left: 0;
	z-index: 999;
	opacity: 0;
	-webkit-transition: all 600ms ease-out;
	-moz-transition: all 600ms ease-out;
	-ms-transition: all 600ms ease-out;
	-o-transition: all 600ms ease-out;
	transition: all 600ms ease-out
}
div.tabs-container div.tab-loading h1 {
	font-size: 48px;
	text-align: center
}
div.tabs-container div.tab-loading div.dots {
	text-align: center
}
div.tabs-container div.tab-loading div.dots span.dot {
	font-size: 48px;
	line-height: 10px;
	padding: 0 12px
}

div.hakotab a {
   text-decoration: none;
   font-weight: normal;
}

div.tddiv {
   float: left; 
   border: solid 1px #aaa; 
   border-left:none;
   padding: 0.2em; 
}
div.tddiv_last {
   float: left; 
   border: solid 1px #aaa; 
   padding: 0.2em; 
}
div.tddiv_first {
   float: left; 
   border: solid 1px #aaa; 
   padding: 0.2em; 
}

.tdhover {
   background-color: #navy;  
}

a.luettelosarakeotsake {
   background-color: #navy;
   padding-left:0.5em;
   padding-right:1em;
   text-decoration: none;
   border-left:1px solid #fff;  
   border-top:1px solid #fff;
   margin:0 !important;  
}

div.error {
   color: red;
}
div.error input {
   color: red;
} 
div.error input {
   border: solid 1px red;
}

.alert-info {
    color: #0c5460;
    background-color: #d1ecf1;
    border-color: #bee5eb;
}

.alert {
    position: relative;
    padding: .75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: .25rem;
} 
 
/*   #area input { visibility: hidden; height: 0; display:none; }*/
   .area input { visibility: hidden; height: 0;  display:none; }
   #area input { visibility: hidden; height: 0;  } 
   #area u { display: block; padding: 15px; text-align: center; background: #99FF99; border-radius: 6px; width:128px; }
   #card {
   	position: relative;
'    	top: 20px;
   	width: 150px;
   	height: 235px;
   	/* background: url("rfid_kortti.jpg") no-repeat; */
   	background-size: 100% 100%;	
   }
   #profile_pic{
   	width: 120px;
   	height: 150px;
   	overflow:hidden;		
   	margin: 0 auto;
		border: 2px solid rgba(0,0,0, 0.66);
   }
   #korttikuva{
   	background-size: 100% 100%;	
   	overflow: true;
   	position: relative;
   	left: 20px;
   }
   u#tallenna{
   	background: #9999FF;
      font-size:1.2em;
   }
   #cvas{
   	/* width: 300px;	*/
   }
   #coik{
   	width: auto;
		margin-top: 10px;
    	margin-bottom: 10px;
   }
 
table.infotable {
   background-color:#ddd;
}

table.infotable td {
   background-color:#fff;
   padding-right:0.5em;
   font-size:10pt;
}

table.infotable th {
   background-color:#eee;
   font-weight:normal;
   text-align:left;
   padding-right:1em;
   padding-left:0.5em;
   font-size:10pt;
}

table.infotable tr.hover td {
 	background:#c5d8f5;
   cursor: pointer;   
}

table.infotable tr.summarivi td {
   border-top:2px solid #a0a0a0a !important;
}

div.alert-danger {
   color: red;
   font-weight: bold;
}