@font-face {
  font-family: Myriad Pro Static;
  src: url(../static/MyriadPro-Regular.woff);
}

@font-face {
  font-family: Myriad Pro Bold Static;
  src: url(../static/MyriadPro-Bold.woff);
}

a { color: inherit; }

body{
    background-color: #f1f1f1;
    font-family: Myriad Pro Static;
    font-size: 100%;
    color: #999999;
    overflow: hidden;
}

button {
    background-color: #8cc63f;
    border-style: solid;
    border-color: #8cc63f;
    color: #ffffff;
}

h1 {
  font-family: Myriad Pro Static;
  font-size: 14pt;
  color: #999999;
  font-weight: bold;
}

#background{
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    z-index: -1;
}

#logintransparency{
    position: absolute;
    width: 40%;
    height: 90%;
    top: 7%;
    left:50%;
    margin-left: -20%;
    z-index: 1;
    background-color: rgba(99, 99, 99, 98);
    opacity: 0.6;
    border-width: 1px;
    border-radius: 3px;
    border-style: solid;
}

#loginlogo{
    position: absolute;
    width: 18%;
    height: auto;
    top: 15%;
    left: 50%;
    margin-left: -9%;
    z-index: 2;
}

#logintitle{
    font-family: Myriad Pro Bold Static;
/*    color: #696969;*/
    color: #ffffff;
    font-size: 110%;
    position: absolute;
    width: 41.4%;
    top: 33%;
    left: 50%;
    margin-left: -9.55%;
    overflow: hidden;
    text-shadow: -1px 0 #999999, 0 1px #999999, 1px 0 #999999, 0 -1px #999999;
    z-index: 2;
}

#loginform{
    position: absolute;
    background-color: #ffffff;
    width: 25%;
    height: 45%;
    top: 40%;
    left: 50%;
    margin-left: -12.5%;
/*    box-shadow: 5px 5px 10px #999999; */
    overflow: hidden;
/*    background-color: #ffffff;*/
    border-color: #999999;
/*    border-color: #000000;*/
    border-width: 1px;
    border-radius: 3px;
    border-style: solid;
    z-index: 2;
}

#loginform input{
background: #c0c1c2; /* Old browsers */
background: -moz-linear-gradient(top, #c0c1c2 0%, #d6d7d8 4%, #e9e9e9 17%, #f5f5f5 29%, #fbfbfb 42%, #fefefe 54%, #ffffff 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#c0c1c2), color-stop(4%,#d6d7d8), color-stop(17%,#e9e9e9), color-stop(29%,#f5f5f5), color-stop(42%,#fbfbfb), color-stop(54%,#fefefe), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #c0c1c2 0%,#d6d7d8 4%,#e9e9e9 17%,#f5f5f5 29%,#fbfbfb 42%,#fefefe 54%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #c0c1c2 0%,#d6d7d8 4%,#e9e9e9 17%,#f5f5f5 29%,#fbfbfb 42%,#fefefe 54%,#ffffff 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #c0c1c2 0%,#d6d7d8 4%,#e9e9e9 17%,#f5f5f5 29%,#fbfbfb 42%,#fefefe 54%,#ffffff 100%); /* IE10+ */
background: linear-gradient(to bottom, #c0c1c2 0%,#d6d7d8 4%,#e9e9e9 17%,#f5f5f5 29%,#fbfbfb 42%,#fefefe 54%,#ffffff 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c0c1c2', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
overflow: hidden;
border-style: solid;
border-color: #aaaaaa;
border-width: 1px;
}

#email{
    position: absolute;
    width: 80%;
    height: 10%;
    left: 50%;
    top: 40%;
    margin-left: -40.0%;
    text-align: center;

}

#forgot_text{
    position: absolute;
    text-align: justify;
    margin-right: 10%;
    margin-left: 10%;
    top: 15%;
}

#requestNewPassword
{
    word-spacing: 0.1em;
    position: absolute;
    width: 45%;
    height: 15%;
    left: 50%;
    top: 70%;
    margin-left: -22.5%;
    border-style: none;
    border-radius: 5px 5px;
    font-family: Myriad Pro Static;
    font-size: 10pt;
    font-weight: bolder;
    color: #ffffff;
    background: linear-gradient(to bottom, #a1d209 0%,#9cd000 2%,#0fa400 98%,#5bbe52 100%); /* W3C */
}


#topbar{
    position: absolute;
    width: 100%;
    height: 7.3%;
    top: 0%;
    left: 0%;
    overflow: hidden;
    background: linear-gradient(to bottom, #a1d209 0%,#9cd000 2%,#0fa400 98%,#5bbe52 100%); /* W3C */
}

#topmenu
{
    position: absolute;
    right: 3%;
    top: 0%;
    display: table;
    width: 70%;
    height: 100%;
}

#top_menurow{
    display: table-row;
    vertical-align: middle;
    height: 100%;
}

.selected_top_menu{
    background-color: #006600;
}

div.topmenuitem{
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    height: 70%;
    width: auto;
    color: #ffffff;
    font-family: Myriad Pro Static;
    font-size: 100%;
}

div.topmenuitem:hover{
    background-color: #006600;
}

#topbar img.logo{
    height: 70%;
    width: auto;
    padding-left: 3.5%;
    padding-top:0.4%
}

#leftbar
{
    position: absolute;
    top: 7.3%;
    left: 0%;
    z-index:2;
    height: 93.1083%;
    width: 12.3066%;
    box-shadow: 5px 5px 10px #999999;
    overflow: hidden;
    background-color: #ffffff;
}

#leftmenu
{
    position: absolute;
    width: 100%;
/*    height: 100%;*/
/*    top: 2%;
    left: 2%; */
    display: table;
/*    border-spacing: 10px;*/
    overflow: auto;
}

#leftmenu div.leftmenurow
{
    display:table-row;
    height: 10%;
}

.selected_left_menu{
    background-color: #cccccc;
}

#leftmenu span{
    display: table-cell;
    vertical-align: middle;
    padding-top:20%;
}

#leftmenu span:hover{
    text-decoration: underline;
    cursor:pointer;
}

#leftmenu .imgcontainer{
    display:table-cell;
    cursor:pointer;
    vertical-align: middle;
    padding-left: 10%;
    padding-top:20%;
}

#leftmenu img{
    height: 60%;
    width: auto;
}

div.appborder{
    position: fixed;
    top: 10%;
    left: 14%;
    z-index:2;
    height: 86%;
    width: 84.5%;
    box-shadow: 5px 5px 10px #999999;
    overflow: hidden;
    background-color: #ffffff;
    border-color: #999999;
    border-width: 1px;
    border-radius: 10px;
    border-style: solid;
    overflow: auto;
}
    border-style: solid;
div.appcontainer {
    margin: 2%;
}

div.table{
    display: table;
    width: 400px;
    height: 100px;
/*    border-style: solid;*/
    border-width: 1px;
    border-color: #999999;
}

div.table div.cell{
    display: table-cell;
}

div.table div.tablefixed{
    width: 100%;
}

div.table div.tableheader{
    width: 100%;
    display: table;
}

div.table div.tableheader div.headerRow{
    display: table-row;
    background-color: #8cc63f;
    color: #ffffff;
}

div.table div.tableheader div.cell
{
    display: table-cell;
    text-align: center;
}

div.table div.tablescroller{
    overflow-y: scroll;
    height:92%;
    width: 100%;
}

div.table div.innertable{
    width: 100%;
    display: table;
}

div.innertable div.row{
    display: table-row;
}

div.innertable div.row div.cell{
    padding: 3px;
    border-left-style: solid;
    border-left-width: 1px;
    border-color: #999999;
}

div.innertable div.row:nth-of-type(odd){
    background-color:#f2f2f2;
}