@font-face {
  font-family : "Roboto";
  src : url("fonts/Roboto-Regular.ttf") format('ttf');
  font-style : normal;
  font-weight : normal;
}
@font-face {
  font-family : "Roboto";
  src : url("fonts/Roboto-Bold.ttf") format('ttf');
  font-style : normal;
  font-weight : bold;
}
@font-face {
  font-family : "Roboto";
  src : url("fonts/Roboto-Medium.ttf") format('ttf');
  font-style : normal;
  font-weight : 500;
}


*, *:after, *:before {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}
ul { list-style: none; }
a { text-decoration: none; outline: none; }
input {outline: none !important;}
select {outline: none !important;}
button:hover {cursor: pointer;}

html {height: 100%;}

body {
    height: 100%;
    font-family: "Roboto", sans-serif;
    font-size: 16px;
    color: #000;
    text-align: left;
    background-color: #f9f9fc;
}

div.titleSite {width:100%; font-size: 24px; background-color:#1c76c1; padding:20px; color:#f3f3f3; height: 72px;}

input.textLogin {width:100%; font-size:20px; color:#345; padding:5px; border:1px solid #cde;}
input.textLogin:hover, input.textLogin:focus {border:1px solid #1c76c1;}

.btnSubmit {background-color:#d9ffd9; border: 1px solid #acefac; width:50%; padding:10px; font-size:20px; color:#060; cursor: pointer; border-radius:5px;}
.btnSubmit:hover {background-color:#acefac; color: #030;}

.btnRecovery {background-color:#d0f8ff; border: 1px solid #c0ecf4; width:50%; padding:10px; font-size:20px; color:#069; cursor: pointer; border-radius:5px;}
.btnRecovery:hover {background-color:#c0ecf4; color: #036;}

table.mainWrapper {border-collapse: collapse; min-width: 100%; min-height: 100%;}
table.logoSite {height: 100px; width: 100%; background-color: #eee;}

div.mainMenu {display: flex; flex-direction: row;}
div.mainItem {display: inline-block; padding: 10px 15px 10px 15px; color: #111; font-size: 16px; text-align: center;}
div.mainItem:hover {background-color: #aaa; color: #fff;}

td.leftMenu {width: 100px; height: 100%; vertical-align: top; text-align: center;}

div.itemLeft {padding: 15px 5px 15px 5px; color: #333; font-size: 16px;}
div.itemLeft:hover {background-color: #888; color: #ddd;}

td.mainContent {vertical-align: top;}

div.pageContent {padding: 20px;}

div.titlePage {font-size: 24px; color: #333; padding-bottom: 10px;}

div.titleCrumbs {font-size: 16px; color: #888; padding-bottom: 15px;}

div.menuPage {width: 100%; padding: 10px 0;}

.btnMenuPage {font-size: 14px; font-weight: bold; padding: 7px 10px; border-radius:5px; display: inline-block;}

.btnFolder {background-color: #e0f0ff; color: #049; border: 1px solid #d0e0f8;}
.btnFolder:hover {background-color: #d0e0f8; color: #036;}

.btnDocum {background-color: #f8ecce; color: #640; border: 1px solid #e8dcbe;}
.btnDocum:hover {background-color: #e8dcbe; color: #530;}

.btnSuccess {background-color: #d9ffd9; color: #060; border: 1px solid #acefac;}
.btnSuccess:hover {background-color: #acefac; color: #030;}

.btnInfo {background-color: #d0f8ff; color: #069; border: 1px solid  #c0ecf4;}
.btnInfo:hover {background-color: #c0ecf4; color: #036;}

.btnSave {background-color: #d0f8ff; color: #069; border: 1px solid  #c0ecf4;}
.btnSave:hover {background-color: #c0ecf4; color: #036;}

.btnMake {background-color: #f0dcf6; color: #607; border: 1px solid #e6c0ee;}
.btnMake:hover {background-color: #e6c0ee; color: #304}

.btnScan {background-color: #f0dcf6; color: #607; border: 1px solid #e6c0ee;}
.btnScan:hover {background-color: #e6c0ee; color: #304}

.btnRefresh {background-color: #d9ffd9; color: #060; border: 1px solid #acefac;}
.btnRefresh:hover {background-color: #acefac; color: #030;}

.btnExit {background-color: #e8e8e8; color: #333; border: 1px solid #d8d8d8;}
.btnExit:hover {background-color: #e0e0e0; color: #111;}

.btnBack {background-color: #e8e8e8; color: #333; border: 1px solid #d8d8d8;}
.btnBack:hover {background-color: #e0e0e0; color: #111;}

.spanMenuPage {font-size: 16px; padding: 7px 5px;}

.posRight {float: right;}
.fontBold {font-weight: bold;}

input[type="text"] {padding: 5px;}
input[type="submit"] {cursor: pointer;}

div.tableList {padding: 20px 0 0 0;}
table.tableList {border-collapse: collapse; width: 100%;}
th.tableList {font-size: 14px; padding: 10px; background-color: #eee; color: #555; border: 0;}
th.tableList:hover {background-color: #e6e6e6;}
input.tableList {font-size: 14px; font-weight: bold; background-color: #eee; color: #555; border: 0;}
input.tableList:hover {background-color: #e6e6e6; color: #039;}
td.tableList {font-size: 16px; padding: 10px; border-bottom: 1px solid #e6e6e6;}

.linkFolder {color: #049; font-weight: 500;}
.linkFolder:hover {color: #014;}
.linkFolderG {color: #061; font-weight: 500;}
.linkFolderG:hover {color: #040;}
.linkFolderR {color: #822; font-weight: 500;}
.linkFolderR:hover {color: #600;}

select.selBlue {background-color: #e0f0ff; color: #036; padding: 5px; border-radius:5px; width: 200px; font-weight: bold;}
select.selGreen {background-color: #c0fbc0; color: #061; padding: 5px; border-radius:5px; width: 200px; font-weight: bold;}
select.selRed {background-color: #fbc9c9; color:#822; padding: 5px; border-radius:5px; width: 200px; font-weight: bold;}
option.optBlue {background-color: #e0f0ff; color: #036; font-weight: bold;}
option.optGreen {background-color: #c0fbc0; color: #061; font-weight: bold;}
option.optRed {background-color: #fbc9c9; color:#822; font-weight: bold;}

select.selOwner {font-size: 16px; padding: 5px; border-radius:5px; width: 200px;}

.linkDocum {color: #af9148; font-weight: 500;}
.linkDocum:hover {color: #9f8138;}

.linkScan {color: #708; font-weight: 500;}
.linkScan:hover {color: #607;}

div.titleSection {font-size: 20px; padding: 20px 0px 0px 0px;}

div.tableProps {padding: 20px 0 0 0;}
td.tableProps {font-size: 16px; padding: 10px; border-bottom: 1px solid #e6e6e6; color: #555;}

input.textProp {font-size:16px; color:#000; padding:5px; border:1px solid #cde;  width: 700px;}
input.textProp:hover, input.textLogin:focus {border:1px solid #2c86d1;}

select.listProp {font-size:16px; color:#000; padding:5px; border:1px solid #cde;  width: 700px;}
select.listProp:hover, select.listProp:focus {border:1px solid #2c86d1;}

select.listLanguage {font-size:18px; color:#333; background-color:#eee; padding:3px; border: 0;  width: 120px; font-weight: 500;}
select.listLanguage:hover, select.listLanguage:focus {color: #000;}

.btnTblDel {background-color: #eee; border: 1px solid #999; border-radius:5px; color:#766; font-size: 12px; padding: 2px 7px; font-weight: bold;}
.btnTblDel:hover {background-color: #ffe0e0; color:#933;}

.btnTblDown {background-color: #eee; border: 1px solid #999; border-radius:5px; color:#668; font-size: 12px; padding: 2px 7px; font-weight: bold;}
.btnTblDown:hover {background-color: #90c0ff; color:#339;}

.btnTblLoad {background-color: #e0f0ff; color: #049; border: 1px solid #d0e0f8; border-radius:5px; font-size: 12px; padding: 5px 10px; font-weight: bold;}
.btnTblLoad:hover {background-color: #d0e0f8; color: #036;}

.btnTblTemp {background-color: #d9ffd9; color: #060; border: 1px solid #acefac; border-radius:5px; font-size: 12px; padding: 5px 10px; font-weight: bold;}
.btnTblTemp:hover {background-color: #acefac; color: #030;}

.btnTblDele {background-color: #ffdbdb; border: 1px solid #efcbcb; border-radius:5px; color:#600; font-size: 12px; padding: 5px 10px; font-weight: bold;}
.btnTblDele:hover {background-color: #efcbcb; color:#300;}

.btnTblCanc {background-color: #e8e8e8; color: #666; border: 1px solid #d8d8d8; border-radius:5px; font-size: 12px; padding: 5px 10px; font-weight: bold;}
.btnTblCanc:hover {background-color: #e0e0e0;}

.linkCrumbs {font-size: 16px; color: #1c76c1;}
.linkCrumbs:hover {color: #047;}

td.tdFields {padding: 10px;}
input.fieldName {font-size: 16px; width: 100%; padding: 5px; border:1px solid #cde;}
input.fieldName:hover, input.fieldName:focus {border:1px solid #2c86d1;}

textarea {font-size: 16px; font-family: sans-serif; padding: 5px; border:1px solid #cde;}
textarea:hover, textarea:focus, textarea:active {border:1px solid #2c86d1; outline: none;}
textarea.w100 {width: 100%;}

input.fileGraph {width: 25%;}
input.fieldGraph {font-size: 16px; width: 70%;}

input.pageNumber {font-size: 16px; padding: 5px; background-color: #eee; border: 1px solid #ccc;}
input.pageNumberActive {font-size: 16px; padding: 5px; background-color: #ccc; border: 1px solid #bbb;}

input.linkClone {font-size: 18px; color: #1c76c1; background: none; border: none;}
input.linkClone:hover {color: #0c66b1;}

ul, #listUserFolders {list-style-type: none; padding-inline-start: 40px;}
li {padding: 5px;}


#listUserFolders {margin: 0; padding: 20px 0 0 0;}

.caret {
  cursor: pointer;
  -webkit-user-select: none; /* Safari 3.1+ */
  -moz-user-select: none; /* Firefox 2+ */
  -ms-user-select: none; /* IE 10+ */
  user-select: none;
}

.caret::before {
  content: "\25BA";
  color: #666;
  display: inline-block;
  margin-right: 6px;
  font-size: 14px;
}

.nocaret::before {
  content: "\25BA";
  color: #fff;
  display: inline-block;
  margin-right: 6px;
  font-size: 14px;
}

.caret-down::before {
  -ms-transform: rotate(90deg); /* IE 9 */
  -webkit-transform: rotate(90deg); /* Safari */
  transform: rotate(90deg);  
}

.nested {display: none;}

.active {display: block;}

.emailVerify {color: #080;}
.emailNoVerify {color: #800;}
