﻿@charset "utf-8";
/* CSS Document */
/* VK Colors

    Tumma turkoosi 100%:    00605c
    Tumma turkoosi 80%:     007675
    Tumma turkoosi 60%:     3e9191
    Tumma turkoosi 40%:     79afb0
    Vaalea turkoosi 100%:   69c8c7
    Vaalea trukoosi 60%:    a8dcdb
    Vaalea trukoosi 40%:    c4e7e6
    Lime 100%:              d0df4f
    Lime  60%:              e1e998
    Keltainen:              fff45f
    Harmaa:                 aebcbc
                            003d3a
    
    */

body{
	
	background:#EBEBEB;  /*f5faf9*/
    margin: 0px; display:table; width:100%; height:100%; position:relative;
	
}
body * {
	box-sizing:border-box;
	-moz-box-sizing:border-box; /* Firefox */
	-webkit-box-sizing:border-box; /* Safari */
	font-family:"Segoe WP","Segoe UI", Segoe, "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif; 
}
 @font-face
{
font-family: iconFont;
src: url(iconFont.woff);
}

  @font-face
{
font-family: font3087;
src: url(font308.woff);
}

.loadingWrapper{display:table; width:100%; padding:0 50px; position:relative; top:200px}
.loadingWrapper{text-align:center; width:100px; margin:0 auto}

.floatL{float:left}
.floatR{float:right !important}

h1, h2, h3{margin:0; font-weight:100}

br{border:none}

button{border:none; padding:10px 15px; font-size:12pt; background:transparent; color:#00605c; cursor:pointer;}
button:hover{border:none;  background:#007675; color:#FFF;}
button span{font-family: iconFont; font-size:40pt;}
button[disabled] { cursor:hand; color:#408088;}
button[disabled]:hover { background:transparent; color:#408088;}
.unactive, .unactive:hover{background:transparent !important; color:inherit !important; cursor:default !important; border-color:transparent !important}

input[type=text]:focus, textarea:focus{border-color:#00605c}
input:disabled{cursor:default}

.link{cursor:pointer}
.content .link:hover{background:#e1e998 !important}

.notification{display:block; background:#ccc; position:fixed; z-index:1000; bottom:0}
.notification.hide{opacity:0}
.notification.visible{opacity:1}

label{display:block}
input[type=text], textarea{border:2px solid #E1E1E1; padding:5px 10px; font-size:12pt}


header{position:fixed; top:0; height:68px; z-index:9999; width:100%; padding-left:220px; color:#FFF !important;  background:#3e9191;} /**/
header .logo{}
header .logoWrapper{display:block; text-align:center;  background:#00605c; float:left; width:220px }
header .logoWrapper:hover{background:#007675; cursor:pointer}
header .logoWrapper:focus{background:#003d3a;}
header .userInfo{padding:5px 20px; height:67px; font-size:18pt; float:left; position:relative; border-left:8px solid transparent;}
header .userInfo span{font-size:12pt; position:relative; top:-10px}
header .user, header .user_main {float:right;}
header .user_main {height:67px; padding:10px 0; margin-right: 12px;}
header .user a.logout {display:inline-block; margin:0; text-align:center; width:68px; height:67px; padding:10px 0;  border-left:8px solid transparent; }
header .user a.logout {font-family: iconFont; font-size:40pt; line-height:38px; text-decoration: none; }
    header a.logout {
        display: inline-block;
        margin: 0;
        text-align: center;
        width: 68px;
        height: 67px;
        padding: 10px 0;
        border-left: 8px solid transparent;
    }

    header a.logout {
        font-family: iconFont;
        font-size: 40pt;
        line-height: 38px;
        text-decoration: none;
    }
.user span:hover,
.userInfo:hover{background:#007675; color:#FFF; border-color:#fff45f; cursor:pointer}

header .searchElement{display:inline-block; margin-left:200px; padding:12px 0 0}
header .searchElement input[type=text]{border:2px solid #007675;  padding:6px;  background:#EBEBEB; }
header .searchElement button{color:#FFF; padding:8px 15px}

header .userInfo.active,
header .user span.acitve{background:#003d3a;} 

header .userInfo div{display:inline-block}
header span.tool{font-family: iconFont; margin-right:10px; margin-left:-7px;  font-size:40pt;}
header span.tool:hover{cursor:pointer; }

header span.tool.eka{display:inline-block}
header span.tool.toka{display:none}

header .userInfo:hover .tool.eka{display:none}
header .userInfo:hover .tool.toka{display:inline-block}

.navFont{font-family: iconFont; font-size:40pt; line-height:30pt; float:left; color:#00605c}
.navFont:hover{color:#69c8c7; cursor:pointer}

.navBar{position:fixed; overflow:auto;  height:100%; min-height:500px; top:0; display:table; width:200px; background:#00605c; z-index:10000;margin-right:50px;}/*4957be*/
.navBar li span{font-family: iconFont; font-size:40pt; line-height:0; margin-right:5px; position:relative; top:15px}
.navBar ul{ position:relative; } /*border-top:5px solid #69c8c7;*/
.navBar ul{list-style:none; color:#FFF; margin:0; padding:0; border-top:5px solid #d0df4f; }
.navBar li{ width:240px; padding:15px 0 25px 5px; font-weight:normal; border-left:8px solid transparent; cursor:pointer}
.navBar li:hover{background:#007675; width:100%; color:#FFF; border-left-color:#fff45f}
.navBar li.active{background:#003d3a;}/*003d3a*/
.navBar li.active:hover{}
.navBar li:hover span{display:inline;}
.navBar li img{width:35px; vertical-align:middle; margin-right:10px}
.navBar .logoWrapper{display:block; text-align:center;  background:#00605c;  width:240px;  border-left:8px solid #00605c;  }
.navBar .logoWrapper:hover{border-left-color:#fff45f; cursor:pointer}
.navBar .logoWrapper img{margin-left:-8px;}
.navBar li.space,
.navBar li.space.active,
.navBar li.space:hover{background:transparent !important; border-color:transparent !important; cursor:default}
.navBar li.hide{opacity:0}

.navBar .versio{position:absolute; bottom:0; padding:10px; font-size:10pt; color:#ccc}
.navBar .logoWrapper.disabled,
.navBar .logoWrapper.disabled:hover{cursor:default; border-color:#00605c}

.demoButton{border:none;  font-size:10pt}
.row.hide{display:none}
.hide{display:none}

.content{ position:relative; margin:0 0 50px; padding-left:220px; padding-top:66px; min-width:1300px; color:#003d3a }/*003d3a*/

.row{width:100%; display:table; background:#FFF;  border-bottom:1px solid #e0e0e2;} /* padding-left:8px */
.innerRow{width:100%; display:table; clear:both}

.contentBg{background:#F9F9F9; }/*d1f5f4*/

.late{border-top:3px solid #EF292A; border-bottom-width:3px; border-color:#EF292A}
/*
.late{border-left:8px solid #EF292A;  border-left-color:#EF292A}
*/



.rowContent{display:table; width:100%;} /* #e0e0e2*/
.rowContent.bg{background:#c4e7e6}

.headline{font-size:20pt;  font-weight:100; padding:25px 35px; }
.btn {
    padding: 25px 35px;
    text-decoration-line: none;
    text-decoration: none;
}
.subHeadline {
    font-size: 18pt;
    font-weight: 100;
    padding: 10px 35px;
}
.formContent .subHeadline{padding:0 0 10px}
.rowContent p{padding: 10px 35px}

.regContent{
    padding: 10px 35px
}

/*
.loanSummary .rowContent{padding:0 !important}

*/
.loanHeader {max-width:1000px}

.rowCell {display:table-cell; vertical-align:middle; padding:20px; padding-right:0}
.rowCell:first-child{width:36px !important}

.innerWrapper{display:table; min-width:300px}
.rowContent.nav{padding:15px 35px 0 35px; }
.rowNav{padding:0; padding-top:5px; margin:0 35px}
.rowNav ul{list-style:none; width:100%; padding:0; margin:0;}
.rowNav li{padding:20px 0;  display:inline-block; margin-right:30px; text-align:left; line-height:13pt; border-bottom:5px solid transparent; cursor:pointer}
.rowNav li:hover{border-color:#fff45f}
.rowNav li.active{border-color:#6096F9; font-weight:bold}
.rowNav li.scroll.active,
.rowNav li.scroll.active:hover,
.rowNav li.scroll:hover{border:none !important}
.rowNav li img{position:relative; top:5px}
.rowNav.sub li img{top:4px; margin-left:15px; opacity:0.7}
.rowNav.sub li:hover img{opacity:1}


.rowNavContent{display:table; width:100%; border-top:1px solid #e0e0e2;}
.rowNavContent .rowHeader{background:#d0df4f; padding:20px 30px;  font-weight:bold;  }
.rowNavContent .dataWrapper{border:1px solid #e0e0e2; border-top:none}
.rowNavContent .dataRow {margin:0 30px; padding:20px 0; border-bottom:1px dotted #aebcbc}
.rowNavContent .dataRow span{float:right}
.rowNavContent .dataRow.sum{border:none; border-top:2px solid #aebcbc}



.innerRow.cells div{font-size:14pt; padding:35px; font-weight:100; display:inline-block; margin:0; vertical-align:top}
.innerRow.cells .amount{font-size:32pt; display:block; line-height:36pt; font-weight:100; }

.innerRow.cells.loanDetails div{padding:15px 35px; font-size:12pt !important;  min-width:350px;}
.innerRow.cells.loanDetails table{margin-top:35px}
.innerRow.cells.loanDetails .amount{font-size:22pt !important}
/*.innerRow.nav{border-top:1px solid #e0e0e2}
.buttonRow{text-align:right; width:1000px}*/
.buttonRowInner{text-align:right; padding:15px; 35px; width:1000px}
.formContent div.info {
    display: block;
    margin: 3px 5px 3px 5px;
    padding: 0;
}
.formContent div.warning {
    display: block;
    margin: 3px 5px 3px 5px;
    color: #f44;
    padding: 0;
}

.loanSummary{}
.loanSummaryBg{background:#d0df4f !important;}
.loanSummarySelected div{padding:20px 35px !important}
.loanSummarySelected h2 {padding:20px 35px 0; font-size:20pt; font-weight:600 }
.loanSummarySelected h2 span{margin-left:50px; font-weight:100}
.loanSummarySelected h2 span.tool{font-family: iconFont; font-size:24pt; opacity:0.7}
.loanSummarySelected h2 span.tool:hover{cursor:pointer; opacity:1}

.grantedLoan .amount:hover,
.allLoans .amount:hover,
.nextRepayment .amount:hover,
.interestRate .amount:hover{}/*border-color:#fff45f; cursor:pointer*/

.dataTable{padding:0 35px 35px}
#printMenu.buttonRow.hide{display:none}

/*msgwrapper*/
.msgWrapperTable.header * {
    color: #00605c !important;
    text-align: left !important;
    font-size: inherit !important;
    font-weight: bold !important;
    border-right: 2px solid #FFF;
    border-bottom: 2px solid #FFF
}
/*padding-left:0 !important; background:transparent !important; border-bottom:6px solid #d0df4f*/
.msgWrapperTable.header * {
    color: #9faa3c !important;
    background: #FFF !important;
    font-weight: bold;
    padding: 10px 15px;
    border-bottom: 1px solid #e0e0e2;
}

.msgWrapperTable.header img {
    border: none;
    float: right;
    position: relative;
    top: 8px;
    padding: 0;
    margin: 0;
    cursor: pointer
}


.msgWrapperTable {
    border-collapse: collapse;
    background: #FFF;
    margin: 0 35px 35px;
    width: 1000px;
    max-width: 1000px;
    position: relative
}

.msgWrapperTable tr th, .msgWrapperTable tr td {
    padding: 15px;
    text-align: right;
    border-bottom: 1px solid #e0e0e2
}

.msgWrapperTable tr {
}

.msgWrapperTable .active td {
    background: #007675 !important;
}

.msgWrapperTable tr:nth-child(odd) {
    background: #EBEBEB
}

.msgWrapperTable th {
    font-weight: bold;
    line-height: 13pt;
    vertical-align: top;
    padding: 15px;
    text-align: right !important;
    vertical-align: top;
    font-size: inherit !important;
    background: #FFF !important;
    color: #9faa3c !important;
    border-bottom: 1px solid #e0e0e2;
}

.msgWrapperTable img {
    border: none;
    cursor: pointer
}

.msgWrapperTable td {
    color: #080808;
    border-bottom: 1px solid #e0e0e2;
    vertical-align: top;
    line-height: 13pt
}

.msgWrapperTable.allLoans td {
    width: 180px;
}
.loanWrapper.header *{color:#00605c !important;text-align:left !important; font-size:inherit !important; font-weight:bold !important; border-right:2px solid #FFF; border-bottom:2px solid #FFF } /*padding-left:0 !important; background:transparent !important; border-bottom:6px solid #d0df4f*/
.loanWrapper.header *{color:#9faa3c !important; background:#FFF !important; font-weight:bold; padding: 10px 15px; border-bottom:1px solid #e0e0e2;}
.loanWrapper.header img{border:none; float:right; position:relative; top:8px; padding:0; margin:0; cursor:pointer}


.loanWrapperTable {border-collapse:collapse; background:#FFF; margin:0 35px 35px; width:1000px; max-width:1000px; position:relative }
.loanWrapperTable tr th, .loanWrapperTable tr td{padding:15px; text-align:right; border-bottom:1px solid #e0e0e2}
.loanWrapperTable tr{}
.loanWrapperTable .active td{background:#007675 !important;}
.loanWrapperTable tr:nth-child(odd){background:#EBEBEB}
.loanWrapperTable th{font-weight:bold; line-height:13pt; vertical-align:top; padding:15px; text-align:right!important; vertical-align:top; font-size:inherit !important; background:#FFF !important; color:#9faa3c !important; border-bottom:1px solid #e0e0e2;  }
.loanWrapperTable img{border:none; cursor:pointer}
 
.loanWrapperTable td{color:#080808; border-bottom:1px solid #e0e0e2; vertical-align:top; line-height:13pt}
.loanWrapperTable.allLoans td{ width:180px; }
.loanWrapperTable .huomio{width:35px !important; border:none !important; background:#FFF !important }

.loanWrapperTable .huomio span{font-family:iconFont; font-weight:bold; font-size:20pt; color:#EF292A}


.loanWrapperTable .name .loanType{display:none}
.loanWrapperTable .name .customName{display:block;}
.loanWrapperTable .name:hover .loanType{display:block}
.loanWrapperTable .name:hover .customName{display:none} 


/*
.loanWrapperTable .huomio span{font-weight:bold;display:block; width:35px; height:35px; padding:3px; margin:-10px -10px -10px 0;  background:#FFF; color:#EF292A; text-align:center; border:4px solid #F00 !important; border-radius:50%}
.loanWrapperTable .huomio:hover span{background:#EF292A !important; color:#FFF !important}
*/
.loanWrapperTable .info, .loanWrapperTable.allLoans .name {text-align:left !important}
.loanWrapperTable .name {width:180px !important; overflow:hidden}
.loanWrapperTable .number {width:150px !important; text-align:left}
.loanWrapperTable .date {}
.loanWrapperTable .amount {}
.loanWrapperTable .space{text-align:center; padding:10px 0 !important;  width:20px !important}
.loanWrapperTable .select{width:50px !important; text-align:center !important}
.loanWrapperTable.allLoans td{ width:200px}
.loanWrapperTable.allLoans th{padding: 10px 15px;}
.loanWrapperTable.allLoans th img{float:right; position:relative; top:6px}

.loanWrapperTable .percent,
.loanWrapperTable.allLoans .percent,
.loanWrapperTable .dueDate,
.loanWrapperTable.allLoans .dueDate{width:120px !important}
.loanWrapperTable .reportname {width:80% !important; text-align:left !important}


.loanWrapperTable .year td{border-color: #00605c !important; border-width:2px}
.loanWrapperTable .current, .loanWrapperTable .past, .loanWrapperTable .upcoming{width:50px !important; border-bottom-color:#00605c}
.current{background:#d0df4f !important; }/*62C367*/
.past {background:#c4e7e6 !important;}/*D36361*/
.upcoming{background:#e1e998 !important;}/*B6D38A*/

.selectedLoan td:last-child{font-size:8pt !important}

.loanWrapperTable .rollUp{text-align:center !important; vertical-align:bottom !important; cursor:pointer}
.loanWrapperTable .rollDown{ text-align:center !important; vertical-align:top !important; cursor:pointer}
.contentBg .loanWrapperTable th{background:#F9F9F9 !important;}
.contentBg .loanWrapperTable .huomio,
.contentBg .loanWrapperTable .footer{background:#F9F9F9 !important; border:none !important}
.contentBg .loanWrapperTable .footer{border-bottom:none !important}
.contentBg .loanWrapperTable .footer td{border:none !important;}
/*.contentBg .loanWrapperTable .footer:hover{cursor:default; background:inherit !important}*/

.loanWrapperTable .rollUp img, .loanWrapperTable .rollDown img{opacity:0.5}
.loanWrapperTable .rollUp:hover img, .loanWrapperTable .rollDown:hover img{opacity:1;}
.loanWrapperTable.allLoans tr:hover{background:#e1e998 !important; cursor:pointer}
.loanWrapperTable.allContracts tr:hover{background:#e1e998 !important; cursor:pointer}
.loanWrapperTable input[type=checkbox]{position:relative; z-index:100}

.messageTable{display:table; width:1000px;  width:100%; padding:0;  border-collapse:collapse; background:#FFF}
.messageTable td{border:1px solid #e0e0e2;}
.messageTable span.from {}
.messageTable h3{font-weight:100; font-size:12pt}
.messageTable h3 span.date {float:right; color:#999}
.messageTable h4{font-size:12pt}
.messageTable span.messageName {}
.messageTable span.messageHeadline{font-weight:bold}
.messageTable tr td:first-child{width:500px; border-left-width:8px; cursor:pointer}
.messageTable td{padding:3px 3px; vertical-align: top; }
.messageTable td.tools{text-align:right}
.messageTable .messageList .active{background:#007675; border-color:#007675; border-left-color:#e0e0e2; color:#FFF !important}
.messageTable .messageList .active:hover{background:#007675 !important}
.messageTable .messageList .active .date{color:#FFF}

.messageTable p{}

.messageTable .messageList td:first-child:hover{background:#e1e998;}
.messageTable .messageList td.new{border-left-color:#d0df4f}
.messageTable td.reply{border-left-color:#3e9191}

.messageTable .messagePreview {vertical-align:top; padding: 15px 15px 40px 15px; min-height:350px; overflow:auto; background-color: #ebebeb; position: relative }
.messageTable .messagePreview .messageItems { background-color: #888; border-top: 1px solid #888; }
.messageTable .messagePreview h4 { background-color: #fff; }
.messageTable .messagePreview .mailContent { background-color: #fff; padding:20px; border-bottom: 1px solid #888; margin-right: 30px; border-right: 2px solid #d0df4f;}
.messageTable .messagePreview .mailContent.newReply { padding: 0px;}
.messageTable .messagePreview .mailReply { margin-left: 30px; border-left: 2px solid #d0df4f; margin-right: 0px; border-right-width: 0px; }
.messageTable .messagePreview .toolBar { position: absolute; height: 40px; bottom: 0px; left: 0px; right: 0px; }
.messageWrapper .toolBar {display:table; width:100%; background:#EBEBEB !important;}
.messageWrapper .toolBar ul,
.messageTable .messagePreview .toolBar ul{list-style:none; float:right; padding:0; margin:0; text-align:right;}
.messageWrapper .toolBar li,
.messageTable .messagePreview .toolBar li {display:block; float:left; padding:10px 15px; margin:0; }
.messageWrapper .toolBar li:hover,
.messageTable .messagePreview .toolBar li:hover{cursor:pointer; background:#007675; color:#FFF }
.messageTable .messagePreview .mailContent textarea { width: 100%; }

.messageWrapper{display:block; width:500px}
.messageWrapper input{margin-bottom:10px}
.messageWrapper textarea{width:500px; height:200px; display:block}

.mail .rowNav li span{margin-left:10px;}
.mail{padding:35px}
h2.paymentInfo{display:table; color:#FFF; background:#EF292A; font-size:16pt; padding:2px 10px; margin:32px 32px -10px 32px}

.loanWrapper:hover .huomio{background:#F00 !important; color:#FFF; border-color:#F00 !important}

.lateBg{background:#EF292A !important; color:#FFF !important}

.formContent{ margin:0 35px 35px; max-width:1000px; position:relative}
.formContent label {margin:10px 0 0; display:block;}
.formContent input[type=text]{margin:5px 0 10px; width:250px}

.wrap{margin:0 !important; padding:0 !important}


 /*TOOLTIP*/

 span.info{position: relative;}
 div.tooltip {
  background-color: #EF292A;
  color: White;
  position: absolute;
  left: -65px;
  top: -35px;
  z-index: 1000000;
}

div.tooltip p {
    padding:0;
  margin: 10px;
  color: White;
  font-size:10pt !important;
}
/*POPUP TOOLBAR*/
/*.buttonRow{position:fixed;text-align:center; width:100%; background:#e1e998; border-top:2px solid #69c8c7; bottom:0; z-index:1000}*/
.buttonRow{position:fixed; text-align:center; width:100%; background:#d0df4f; padding:15px; 35px; padding-left:200px; border-top:2px solid #69c8c7; left:0; bottom:0; z-index:1000}
.buttonRow button{}

.printRow{position:fixed; text-align:center; background:#003d3a; color:#FFF; padding:50px 35px; padding-left:200px; top:208px; left:0; width:100%; z-index:1000}
.printRow button{margin:5px; min-width:100px; background:#00605c; color:#FFF}
.printRow button:hover{background:#EBEBEB; color:#003d3a}

.printRow button:disabled,
.printRow button:disabled:hover{color:#999; background:#333; cursor:default}

.notificationRow{position:fixed; text-align:center; background:#d0df4f; color:; padding:50px 35px; padding-left:200px; top:208px; left:0; width:100%; z-index:1000}
.notificationWrapper{display:table; margin:0 auto; width:500px;  min-height:150px}
.notificationRowContent{display:table-cell; width:100%; vertical-align:middle;}
.notificationRow button{margin:5px; min-width:100px; background:;}
.notificationRow button:hover{background:#00605c; color:#FFF}

/* POPUP lightbox */
.bgWrapper{display:table; position:fixed; top:0; left:0; width:100%; height:100%; }   /**/
.floatWrapper{display:table-cell; width:100%; vertical-align:middle; height:100%; position:relative;}
.floatContainer{display:table; width:100%; height:50px;}
.floatContent{display:table; min-width:500px; max-width:1200px; margin:0 auto; padding:20px;}

.popUpBg * { position:relative;}
.popUpBg{background:rgba(255,255,255,0.7); z-index:100000; padding:0 5%}
.popUpWrapper{display:block; min-width:500px; max-width:900px;  margin:0 auto; background:#FFF;}
.popUpWrapper{ box-shadow:0 0 30px rgba(0,0,0,0.5);  -webkit-box-shadow:0 0 30px rgba(0,0,0,0.5); -o-box-shadow:0 0 30px rgba(0,0,0,0.5)}
.popUpHeader{font-size:20pt; padding:15px 35px; border-bottom:1px solid #00605c;  background:#d0df4f; color:#00605c}
.popUpContent{  padding:15px 35px}
.popUpContent label{font-size:16pt}
.popUpContent h1,
.popUpContent h2,
.popUpContent h3{color:#FF6D0D}
.popUpButtonRow{display:table; width:100%; text-align:right; background:#00605c;}
.popUpButtonRow button{padding:15px 20px; color:#FFF; border-left:5px solid transparent}
.popUpButtonRow button:hover{border-left-color:#fff45f}
/*
.popUpContent button:focus,
.popUpContent button:active{background:#FFF !important; color:#6e6f73}

.popUpButtonRow button{border:none; border-radius:5px; display:inline; font-size:14pt; background:#FF6D0D; border:1px solid #FF6D0D; color:#FFF; padding:8px 15px; margin-left:10px; cursor:pointer}
.popUpButtonRow button:hover{background:#E1E1E1 !important; color:#333; border:1px solid #6e6f73}
.popUpButtonRow button:first-child{margin-left:0}
.popUpButtonRow button:last-child{margin-right:0}
 
    */
.popUpContent p{font-size:12pt}

.popUpContent label{margin-top:10px}
.popUpContent input[type=text], .popUpContent textarea{width:100%;}
.popUpContent textarea{height:100px}

.rowContent .hasError {
    margin: 5px 10px 0px 30px;
    padding: 5px 5px 5px 5px;
    border-radius: 3px;
    border: 1px solid #c00;
    color: #f44;
}
/*Animation*/

button, .navBar li, .loanWrapper *, header *, .loanSummary div, .loanWrapper div, .loanWrapperTable tr{transition:all .2s ease; -webkit-transition:all .2s ease}
header, header *, .navBar, .navFont, .rowNav li, div.tooltip, #lateRow{transition:all .2s ease; -webkit-transition:all .2s ease}


.FadeIn .fade{-moz-animation: FadeIn  0.15s linear; -moz-animation-fill-mode:both; 
 			 -webkit-animation: FadeIn  0.15s linear; -webkit-animation-fill-mode:both; position:relative	
 }
 .FadeIn .fade:nth-child(1){ animation-delay: 250ms; -webkit-animation-delay: 250ms }
 .FadeIn .fade:nth-child(2){ animation-delay: 300ms; -webkit-animation-delay: 300ms }
 .FadeIn .fade:nth-child(3){ animation-delay: 350ms; -webkit-animation-delay: 350ms }
 .FadeIn .fade:nth-child(4){ animation-delay: 400ms; -webkit-animation-delay: 400ms }
 .FadeIn .fade:nth-child(5){ animation-delay: 450ms; -webkit-animation-delay: 450ms }
 .FadeIn .fade:nth-child(6){ animation-delay: 500ms; -webkit-animation-delay: 500ms }
 .FadeIn .fade:nth-child(7){ animation-delay: 550ms; -webkit-animation-delay: 550ms }
 .FadeIn .fade:nth-child(8){ animation-delay: 600ms; -webkit-animation-delay: 600ms }
 .FadeIn .fade:nth-child(9){ animation-delay: 650ms; -webkit-animation-delay: 650ms }
 .FadeIn .fade:nth-child(10){ animation-delay: 700ms; -webkit-animation-delay: 700ms }
 .FadeIn .fade:nth-child(11){ animation-delay: 750ms; -webkit-animation-delay: 750ms }
 .FadeIn .fade:nth-child(12){ animation-delay: 800ms; -webkit-animation-delay: 800ms }
 .FadeIn .fade:nth-child(13){ animation-delay: 850ms; -webkit-animation-delay: 850ms }

 
 @-moz-keyframes FadeIn { 
  0% { opacity:0; left:10px;}

  100% {opacity:1; left:0 }
}

 @-webkit-keyframes FadeIn { 
  0% { opacity:0; left:50px;}

  100% {opacity:1; left:0 }
}

  .ZoomIn{-moz-animation: ZoomIn  0.25s linear; -moz-animation-fill-mode:both; 
 			 -webkit-animation: ZoomIn  0.25s linear; -webkit-animation-fill-mode:both;	
 }

 
 @-moz-keyframes ZoomIn { 0% {opacity:0; -moz-transform: scale(0.5)} 90% { -moz-transform: scale(1.05)} 100% {opacity:1; -moz-transform: scale(1, 1) }}
 
 @-webkit-keyframes ZoomIn {  0% {opacity:0; -webkit-transform: scale(0.5)}  90% { -webkit-transform: scale(1.05)} 100% {opacity: 1; -webkit-transform: scale(1)}}

