body {
   width: 100%;
   height: 100%;
   font-family: Roboto;
   font-size: 13px;
   background-color: white;
}

@font-face {
   font-family: 'FontAwesome';
   src: url('gui/font_awesome/fontawesome-webfont.eot?v=4.6.3');
   src: url('gui/font_awesome/fontawesome-webfont.eot?#iefix&v=4.6.3')
        format('embedded-opentype'), url('gui/font_awesome/fontawesome-webfont.woff2?v=4.6.3')
        format('woff2'), url('gui/font_awesome/fontawesome-webfont.woff?v=4.6.3') format('woff'), url('gui/font_awesome/fontawesome-webfont.ttf?v=4.6.3')
        format('truetype'), url('gui/font_awesome/fontawesome-webfont.svg?v=4.6.3#fontawesomeregular')
        format('svg');
   font-weight: normal;
   font-style: normal;
}

* { -webkit-box-sizing: border-box; box-sizing: border-box; }

a { text-decoration: none; outline: none; color: black; }
a:focus { outline: none; }

.fa { font-family: 'FontAwesome'; }

table { border-collapse: collapse; }

#foldersContainer {
   position: fixed;
   top: 0;
   left: 0;
   bottom: 0;
   width: 400px;
}

#foldersToolbar {
   position: absolute;
   top: 1px;
   left: 1px;
   right: 1px;
   height: 40px;
   border: solid 1px gray;
   background: rgb(254,255,232);
   background: -moz-linear-gradient(top,  rgba(254,255,232,1) 0%, rgba(214,219,191,1) 100%);
   background: -webkit-linear-gradient(top,  rgba(254,255,232,1) 0%,rgba(214,219,191,1) 100%);
   background: linear-gradient(to bottom,  rgba(254,255,232,1) 0%,rgba(214,219,191,1) 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feffe8', endColorstr='#d6dbbf',GradientType=0 );
}

#foldersTree {
   position: absolute;
   top: 42px;
   left: 1px;
   right: 1px;
   bottom: 0;
   border: solid 1px gray;
   padding: 10px 10px 10px 0px;
   overflow: auto;
   background-color: white;
}

.treeSpinner {
   padding: 5px 11px;
}

#editToolbar {
   position: fixed;
   top: 1px;
   right: 1px;
   left: 401px;
   height: 40px;
   border: solid 1px gray;
   background: rgb(254,255,232);
   background: -moz-linear-gradient(top,  rgba(254,255,232,1) 0%, rgba(214,219,191,1) 100%);
   background: -webkit-linear-gradient(top,  rgba(254,255,232,1) 0%,rgba(214,219,191,1) 100%);
   background: linear-gradient(to bottom,  rgba(254,255,232,1) 0%,rgba(214,219,191,1) 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feffe8', endColorstr='#d6dbbf',GradientType=0 );
}

#tabulatorContainer {
   position: fixed;
   top: 41px;
   left: 401px;
   right: 1px;
   height: 40px;
   z-index: 100;
   background-color: gainsboro;
   border-right: solid 1px gray;
}

#tabulatorTabs { display: inline-block; }

.tabulatorTab {
   display: inline-block;
   border-top: solid 5px #ffa500;
   border-left: solid 1px gray;
   border-right: solid 1px gray;
   border-bottom: solid 1px gray;
   height: 35px;
   background-color: gainsboro;
   padding: 8px 10px;
   margin: 0;
   margin-top: 6px;
   margin-left: -1px;
   min-width: 80px;
   text-align: center;
}

.tabulatorTab > .fa {
   display: inline-block;
   font-size: 16px;
   padding: 0;
   margin: -4px -3px 0 10px;
   color: red;
}

.tabulatorTab.active {
   border-top: solid 5px #ffa500;
   background-color: white;
   border-bottom: solid 1px white;
}

#frames {
   position: fixed;
   top: 80px;
   left: 401px;
   right: 1px;
   bottom: 0;
   border-left: solid 1px gray;
   border-right: solid 1px gray;
   border-bottom: solid 1px gray;
   background-color: white;
}

#fileList, .editor, #pdfs {
   position: absolute;
   left: 10px;
   top: 10px;
   right: 10px;
   bottom: 10px;
   background-color: white;
}

#pdfs {
   border: solid 1px gray;
}

.editor {
   display: none;
   border: solid 1px green;
   margin: 0;
   padding: 0;
}

.hidden { display: none; }

#filesHeader { width: calc(100% - 16px); }

#filesList { width: 100%; }

#filesHeader {
   position: absolute;
   left: 0;
   top: 0;
   height: 40px;
   background-color: #f1f1f1;
}

#filesHeader th {
   border: solid 1px #b0b0b0;
   padding: 0 10px 0 10px;
   font-weight: normal;
   cursor: pointer;
}

#filesHeader th span {
   display: inline-block;
   margin-left: 10px;
   font-family: 'FontAwesome';
   font-size: 16px;
}

#filesHeader th[data-sort-col=x] {
   cursor: no-drop;
}

#fileScroll {
   position: absolute;
   left: 0;
   top: 40px;
   right: 0;
   bottom: 0;
   overflow-y: scroll;
   overflow-x: hidden;
}

#filesList tr th, #filesList tr td {
   padding: 5px 10px;
   border-bottom: solid 1px gainsboro;
}

.tdbl { border-left: solid 1px gainsboro; }

#filesList tr:nth-child(even) {
   background-color: #e6e9cf;
}

#filesList tr:nth-child(odd) {
   background-color: white;
}

#filesList tr {
   cursor: pointer;
   color: black;
}

.red { color: red; }

.green { color: green; }

#filesList tr:hover, #filesList tr:hover td {
   color: white;
   background-color: orangered;
}

#filesList tr.active, #filesList tr.active td {
   background-color: steelblue;
   color: white;
}

/* #filesList tr { display: none; } */

.tdw50 { width: 50px; }
.tdw60 { width: 60px; }
.tdw70 { width: 70px; }
.tdw80 { width: 80px; }
.tdw90 { width: 90px; }
.tdw100 { width: 100px; }
.tdw110 { width: 110px; }
.tdw120 { width: 120px; }
.tdw130 { width: 130px; }
.tdw150 { width: 150px; }
.tdw180 { width: 180px; }
.tdw190 { width: 190px; }

.tar { text-align: right; }
.tal { text-align: left; }

.tac { text-align: center; }

#pdfs iframe {
   width: 100%;
   height: 100%;
   border: none;  
}

#messenger {
   position: fixed;
   left: 0;
   right: 0;
   bottom: 0;
   height: 200px;
   border-top: solid 1px red;
   margin: 0;
   overflow: scroll;
   background-color: gainsboro;
   border: solid 1px red;
   z-index: 1000;
}

/* FOLDER TREE ----------------------------------------------------------------------------------------------------------- */

ul {
   list-style-type: none;
}


#foldersTree a {
   text-decoration: none;
   color: gray;
   background-color: white;
   padding: 3px 6px;
   margin-left: 3px;
   background-color: white;
}

#foldersTree a:hover {
   color: white;
   background-color: orangered;
}

#foldersTree a.active {
   color: white;
   background-color: steelblue;
}

.folderMinus {
   background-image: url("gui/folderMinus.gif");
}

/* .folder { display: none; } */

.level_0, .level_1 { display: block; }

li span {
   display: inline-block;
   width: 28px;
   height: 20px;
   background-image: url("gui/folderPlus.gif");
   background-repeat: no-repeat;
   background-color: white;
   background-position: 0 center;
}

.folderMinus { background-image: url("gui/folderMinus.gif"); }

.noSubfolders { background-image: url("gui/noSubfolders.gif"); } 

ul.level_0 {
   list-style-type: none;
   margin: 0;
   padding-left: 0px;
   margin-left: 10px;
}

ul.level_1, ul.level_1 ul {
   list-style-type: none;
   background: url("gui/vline.gif") repeat-y;
   margin: 0;
   padding: 0;
}

ul.level_1 {
   margin-left: 4px;
}

ul.level_1 ul {
   margin-left: 4px;
}

ul.level_1 li {
   margin: 0;
   padding: 1px 12px;
   line-height: 20px;
   background: url("gui/node.gif") no-repeat;
   background-position: 0 1px;
}

ul.level_1 li.last {
   background: white url("gui/lastnode.gif") no-repeat;
   background-position: 0 -1px;
}

#files span {
   padding: 3px 10px;
}

#foldersTree span { cursor: pointer; }