@import url('https://fonts.googleapis.com/css?family=Open+Sans');

body, input, button, textarea, select, table, label{
    font-family: 'Open Sans', sans-serif;
    font-size: 12px;
}

html,body{
    margin:0;
    padding:0;
    position: relative;
    height:100%;
}

body{
    background: #EEE;
}

.error
{
    background: #FEE;
    width: 100%;
    margin:2px 0;
    text-align: center;
    color:#900;
    border:#FCC;
}


#TOP{
    position: absolute;
    background: #FFF;
    top:5px;
    right:5px;
    bottom:5px;
    left:5px;
    box-sizing: border-box;
    border-left:1px solid #7C7F83;
    border-right:1px solid #7C7F83;
}

#TOP > header
{
    background: #7C7F83;
    padding:10px;
    box-sizing: border-box;
}

#TOP > header:before
{
    content: '';
    background: #E53113;
    margin:-10px -10px 8px -10px;
    padding: 2px;
    display: block;
    border-bottom:1px solid #EEE;
}

#TOP > header,
#TOP > header a
{
    color: #FFF;
    line-height: 1;
}

#TOP > header a
{
    text-decoration: none;
    padding:5px 7px 10px 7px;
    display: inline-block;
    margin:0 0 -10px 0;
    top:0;
    position: relative;
}

#TOP > header a:hover
{
    background-color: rgba(255,255,255,.1);
}

#TOP > header a.active,
#TOP > header a.active:hover
{
    color: #666;
    background: #FFF;
    border-top:2px solid #E53113;
}

#TOP > footer
{
    background: #7C7F83;
    position: absolute;
    bottom:0;
    left:0;
    right:0;
    height:25px;
    overflow: hidden;
    box-sizing: border-box;
}

#TOP > footer,
#TOP > footer a
{
    color: #FFF;
}




#logout
{
    float:right;
}





#login
{
    width:300px;
    padding:20px;
    position: absolute;
    left:50%;
    top:50%;
    box-sizing: border-box;
    margin:-70px 0 0 -150px;
    border:1px solid rgba(128,128,128,.5);
    border-radius: 2px;
    background: rgba(255,255,255,.3);
}

#login input
{
    margin-bottom: .5ex;
    font-size: 13px;
    width:100%;
    display: block;
}




#workspace
{
    position: absolute;
    top:40px;
    bottom:25px;
    left:0;
    right:0;
    overflow: auto;
}


.data table
{
    border-collapse: collapse;
}

.data tbody tr:hover
{
    background-color: azure;
}

.data td,
.data th
{
    border:1px solid #DDD;
    padding:1px 3px;
    white-space: nowrap;
    font-size:11px;
}

.data th
{
    background: #CCC;
}

.data thead th
{
    padding:2px 10px;
    background: linear-gradient(to bottom, #deefff 0%,#98bede 100%);
}

.data thead .aux th
{
background: #98bede;
}

.data td
{
    vertical-align: top;
}

.data.middle td
{
    vertical-align: middle;
}

.data td,
.data td input,
.data td textarea,
.data td select
{
    font-family: Arial, sans-serif;
    font-size:11px;
}

.data td.num
{
    text-align: right;
}

.data .times
{
    color:#BBB;
    font-size: 70%;
}

.data td input,
.data td textarea,
.data td select
{
    box-sizing: border-box;
    width:100%;
}


.data tr.group th,
.data tr.group td
{
    border-top:3px solid #BBB;
}

.data tr.group th
{
    color:#C00;
}


.data td textarea
{
    height:40px;
}

.data tr.affected
{
    opacity: .8;
}


.project-report
{
   margin:20px;
    border:1px solid #DDD;
    padding:20px;
}

.project-report h2
{
   font-size:16px;
    border-bottom:1px solid #900;
    margin:5px 0;
}

.project-report strong
{
color:#900;
}

.project-report table
{
border-collapse: collapse;
    font-size: 11px;
}

.project-report td,
.project-report th
{
    border:1px solid #DDD;
    white-space: nowrap;
}


.cost-type-travel
{
background: #FFE;
}


form.main
{
padding:5px;
}