/*----------DOCUMENT RESET----------*/
* {
  margin: 0;
  padding: 0;
  text-decoration: none;
  box-sizing: border-box;
  list-style-type: none;
  font-family: 'Roboto';
}
html,
body {
  height: 100%;
  overflow: hidden;
  background: rgba(86, 195, 245, 0.2);
}
/*------------------------------*/
/*----------VARIABLES----------*/
/*------------------------------*/
/*----------IMPORTS----------*/
/*----------LOGIN----------*/
section.login {
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 0;
  background-image: url('../file/background/1.png');
  background-position: center;
  background-size: cover;
}
section.login .overlay1 {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  background-color: #000;
  opacity: .4;
}
section.login .single {
  width: calc(100% - 10px);
  max-width: 500px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: rgba(34, 67, 123, 0.9);
  z-index: 2;
  padding: 2%;
}
section.login .single h1 {
  text-align: center;
  color: white;
  font-size: 22px;
  font-weight: 400;
  margin-bottom: 15px;
}
section.login .single form p.login-error {
  font-size: 18px;
  text-align: center;
  color: #f5594e;
  margin-bottom: 10px;
}
section.login .single form label {
  color: white;
  font-size: 16px;
  font-weight: 300;
}
section.login .single form label.checkbox {
  cursor: pointer;
}
section.login .single form input {
  width: 100%;
  height: 30px;
  margin-top: 5px;
  margin-bottom: 10px;
  font-size: 16px;
  line-height: 30px;
  outline: none;
  border: none;
  padding: 0 5px;
}
section.login .single form input[type=checkbox] {
  width: 14px;
  height: 14px;
  vertical-align: middle;
  cursor: pointer;
}
section.login .single form input[type=submit] {
  width: auto;
  background: none;
  padding: 1% 2%;
  border: 1px solid #56c3f5;
  color: #56c3f5;
  font-size: 20px;
  line-height: 22px;
  height: auto;
  margin-top: 20px;
  text-transform: uppercase;
  font-weight: 400;
}
section.login .single form input[type=submit]:hover {
  background: #56c3f5;
  color: rgba(34, 67, 123, 0.9);
  cursor: pointer;
}
section.login .single form .center {
  text-align: center;
}
/*------------------------------*/
/*----------HEADER----------*/
header {
  width: 100%;
  height: 40px;
  background: rgba(34, 67, 123, 0.9);
  display: flex;
  justify-content: space-between;
  padding: 5px 2%;
}
header i {
  font-size: 26px;
  color: white;
  cursor: pointer;
  margin-top: 2px;
  position: relative;
  z-index: 0;
}
header i span.notification {
  background: red;
  width: 8px;
  height: 8px;
  border-radius: 4px;
  position: absolute;
  left: -4px;
  top: -2px;
}
header i:hover {
  color: #56c3f5;
}
header a {
  color: white;
}
header a span {
  font-size: 20px;
  line-height: 30px;
  display: inline-block;
  vertical-align: top;
}
header a:hover {
  color: #56c3f5;
}
header a:hover i {
  color: #56c3f5;
}
header .logo {
  width: 86px;
  height: 30px;
  background-image: url('../file/logo2.png');
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}
/*------------------------------*/
/*----------MENU----------*/
nav {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  width: 250px;
  height: 100%;
  background: #22437b;
  color: white;
  text-align: center;
  display: none;
  overflow-y: auto;
}
nav::-webkit-scrollbar-track {
  background-color: rgba(86, 195, 245, 0.3);
}
nav::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
nav::-webkit-scrollbar-thumb {
  background: #224364;
  cursor: pointer;
  border-radius: 3px;
}
nav .user {
  padding: 5% 2%;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  position: relative;
}
nav .user i {
  position: absolute;
  top: 5px;
  right: 5px;
  cursor: pointer;
  font-size: 12px;
}
nav .user i:hover {
  color: #56c3f5;
}
nav .user h2 {
  font-size: 24px;
  font-weight: 400;
}
nav .user h3 {
  font-size: 16px;
  font-weight: 300;
}
nav > ul {
  padding: 0 2%;
  padding-top: 30px;
  display: inline-block;
  text-align: left;
}
nav > ul > li {
  padding: 15px 0;
}
nav > ul > li a,
nav > ul > li p {
  color: #b29dbf;
  font-size: 20px;
  font-weight: 400;
  cursor: pointer;
}
nav > ul > li a i,
nav > ul > li p i {
  font-size: 16px;
  transition: transform .4s;
  position: relative;
  z-index: 0;
}
nav > ul > li a i span.notification,
nav > ul > li p i span.notification {
  background: red;
  width: 8px;
  height: 8px;
  border-radius: 4px;
  position: absolute;
  left: -3px;
  top: -5px;
}
nav > ul > li a:hover,
nav > ul > li p:hover {
  color: white;
}
nav > ul > li a:hover i,
nav > ul > li p:hover i {
  color: #56c3f5;
}
nav > ul > li.this-page a,
nav > ul > li.opened p {
  color: white;
}
nav > ul > li.this-page a i,
nav > ul > li.opened p i {
  color: #56c3f5;
}
nav > ul > li.this-page a i.fa-chevron-down,
nav > ul > li.opened p i.fa-chevron-down {
  transform: rotate(-180deg);
}
nav > ul > li.open ul.suboption {
  display: inline-block;
}
nav > ul > li ul.suboption {
  display: none;
  padding-top: 5px;
  padding-left: 5px;
}
nav > ul > li ul.suboption li a,
nav > ul > li ul.suboption li p {
  font-size: 18px;
}
nav > ul > li ul.suboption li a i,
nav > ul > li ul.suboption li p i {
  font-size: 14px;
}
nav > ul > li ul.suboption li.this-page a,
nav > ul > li ul.suboption li.opened p {
  color: white;
}
nav > ul > li ul.suboption li.this-page a i,
nav > ul > li ul.suboption li.opened p i {
  color: #56c3f5;
}
/*------------------------------*/
/*----------MAIN----------*/
main {
  width: 100%;
  height: calc(100% - 40px);
  overflow-x: hidden;
  overflow-y: hidden;
}
main .main {
  width: 100%;
  max-height: 100%;
  overflow-x: hidden;
  overflow-y: scroll;
  padding: 1%;
  display: flex;
  flex-wrap: wrap;
}
main .main::-webkit-scrollbar-track {
  background-color: rgba(34, 67, 123, 0.5);
}
main .main::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
main .main::-webkit-scrollbar-thumb {
  background: rgba(34, 67, 123, 0.9);
  cursor: pointer;
  border-radius: 3px;
}
/*------------------------------*/
/*----------SECTION.OUTSIDE----------*/
section.outside {
  padding: 1%;
  display: flex;
  overflow: hidden;
}
section.outside .inside {
  width: 100%;
  padding: 2%;
  background: white;
  overflow: hidden;
}
section.outside .inside h1 {
  font-size: 26px;
  font-weight: 400;
  margin-bottom: 15px;
}
section.outside .inside h1 i {
  font-size: 24px;
}
section.outside .inside button.open-form,
section.outside .inside button.link,
section.outside .inside button.first,
section.outside .inside button.middle,
section.outside .inside button.last,
section.outside .inside ul.button > li {
  background: none;
  border: 1px solid rgba(34, 67, 123, 0.9);
  border-radius: 16px;
  color: rgba(34, 67, 123, 0.9);
  padding: 0 10px;
  font-size: 16px;
  line-height: 32px;
  height: 32px;
  margin-bottom: 15px;
  text-transform: uppercase;
  cursor: pointer;
  outline: none;
}
section.outside .inside button.open-form:hover,
section.outside .inside button.link:hover,
section.outside .inside button.first:hover,
section.outside .inside button.middle:hover,
section.outside .inside button.last:hover,
section.outside .inside ul.button > li:hover {
  background: rgba(34, 67, 123, 0.9);
  color: white;
}
section.outside .inside button.open-form.hidden,
section.outside .inside button.link.hidden,
section.outside .inside button.first.hidden,
section.outside .inside button.middle.hidden,
section.outside .inside button.last.hidden,
section.outside .inside ul.button > li.hidden {
  white-space: nowrap;
  overflow: hidden;
  transition: width .2s;
}
section.outside .inside button.open-form.hidden i,
section.outside .inside button.link.hidden i,
section.outside .inside button.first.hidden i,
section.outside .inside button.middle.hidden i,
section.outside .inside button.last.hidden i,
section.outside .inside ul.button > li.hidden i {
  margin-right: 5px;
}
section.outside .inside button.open-form.hidden:hover i,
section.outside .inside button.link.hidden:hover i,
section.outside .inside button.first.hidden:hover i,
section.outside .inside button.middle.hidden:hover i,
section.outside .inside button.last.hidden:hover i,
section.outside .inside ul.button > li.hidden:hover i {
  margin-right: 0;
}
section.outside .inside button.open-form.hidden.hidden-label,
section.outside .inside button.link.hidden.hidden-label,
section.outside .inside button.first.hidden.hidden-label,
section.outside .inside button.middle.hidden.hidden-label,
section.outside .inside button.last.hidden.hidden-label,
section.outside .inside ul.button > li.hidden.hidden-label {
  width: 37px;
}
section.outside .inside button.open-form.hidden.hidden-label:hover,
section.outside .inside button.link.hidden.hidden-label:hover,
section.outside .inside button.first.hidden.hidden-label:hover,
section.outside .inside button.middle.hidden.hidden-label:hover,
section.outside .inside button.last.hidden.hidden-label:hover,
section.outside .inside ul.button > li.hidden.hidden-label:hover {
  width: 138px;
}
section.outside .inside button.open-form.hidden.hidden-search,
section.outside .inside button.link.hidden.hidden-search,
section.outside .inside button.first.hidden.hidden-search,
section.outside .inside button.middle.hidden.hidden-search,
section.outside .inside button.last.hidden.hidden-search,
section.outside .inside ul.button > li.hidden.hidden-search {
  width: 34px;
}
section.outside .inside button.open-form.hidden.hidden-search:hover,
section.outside .inside button.link.hidden.hidden-search:hover,
section.outside .inside button.first.hidden.hidden-search:hover,
section.outside .inside button.middle.hidden.hidden-search:hover,
section.outside .inside button.last.hidden.hidden-search:hover,
section.outside .inside ul.button > li.hidden.hidden-search:hover {
  width: 122px;
}
section.outside .inside button.open-form a,
section.outside .inside button.link a,
section.outside .inside button.first a,
section.outside .inside button.middle a,
section.outside .inside button.last a,
section.outside .inside ul.button > li a {
  display: inline-block;
  color: inherit;
  font-size: inherit;
  line-height: inherit;
  height: 30px;
  outline: none;
}
section.outside .inside button.open-form a:hover,
section.outside .inside button.link a:hover,
section.outside .inside button.first a:hover,
section.outside .inside button.middle a:hover,
section.outside .inside button.last a:hover,
section.outside .inside ul.button > li a:hover {
  color: white;
}
section.outside .inside button.open-form i,
section.outside .inside button.link i,
section.outside .inside button.first i,
section.outside .inside button.middle i,
section.outside .inside button.last i,
section.outside .inside ul.button > li i {
  display: inline-block;
  font-size: 14px;
}
section.outside .inside button.link {
  padding: 0;
}
section.outside .inside button.link a {
  padding: 0 10px;
}
section.outside .inside button.first {
  border-radius: 16px 0 0 16px;
  border-right: 0px;
}
section.outside .inside button.middle {
  border-radius: 0;
  border-right: 0px;
}
section.outside .inside button.last {
  border-radius: 0 16px 16px 0;
}
section.outside .inside ul.button {
  border: 1px solid rgba(34, 67, 123, 0.9);
  border-radius: 16px;
  display: inline-block;
  text-align: center;
  position: relative;
  width: auto;
  min-width: 90px;
  height: 32px;
}
section.outside .inside ul.button:hover {
  border-radius: 16px 16px 0 0;
}
section.outside .inside ul.button:hover > li {
  color: rgba(34, 67, 123, 0.9);
}
section.outside .inside ul.button:hover > li i.fa-chevron-down {
  transform: rotate(-180deg);
}
section.outside .inside ul.button:hover ul {
  display: inline-block;
}
section.outside .inside ul.button > li {
  border: none;
  margin-bottom: 0;
}
section.outside .inside ul.button > li i {
  font-size: 12px;
  transition: transform .4s;
}
section.outside .inside ul.button > li:hover {
  background: initial;
}
section.outside .inside ul.button ul {
  display: none;
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translateX(-50%);
  background: white;
  border: 1px solid rgba(34, 67, 123, 0.9);
  border-radius: 0 0 16px 16px;
  min-width: calc(100% + 2px);
  z-index: 1;
}
section.outside .inside ul.button ul li {
  font-size: 14px;
  cursor: pointer;
}
section.outside .inside ul.button ul li button {
  border: none;
  border-radius: 0;
  padding: 0;
  width: 100%;
  font-size: inherit;
  line-height: 24px;
  height: 24px;
  margin-bottom: 0;
  text-transform: none;
}
section.outside .inside ul.button ul li a {
  display: block;
  line-height: 24px;
  color: rgba(34, 67, 123, 0.9);
}
section.outside .inside ul.button ul li:hover a {
  background: rgba(34, 67, 123, 0.9);
  color: white;
}
section.outside .inside ul.button ul li:last-child a,
section.outside .inside ul.button ul li:last-child button {
  border-radius: 0 0 12px 12px;
}
section.outside .inside ul.first {
  border-radius: 16px 0 0 16px;
  border-right: 0px;
}
section.outside .inside ul.first:hover {
  border-radius: 16px 0 0 0;
}
section.outside .inside ul.first ul {
  min-width: calc(100% + 1px);
}
section.outside .inside ul.middle {
  border-radius: 0;
  border-right: 0px;
}
section.outside .inside ul.middle:hover {
  border-radius: 0;
}
section.outside .inside ul.last {
  border-radius: 0 16px 16px 0;
}
section.outside .inside ul.last:hover {
  border-radius: 0 16px 0 0;
}
section.outside .inside .overflow {
  overflow-x: auto;
  overflow-y: hidden;
}
section.outside .inside .overflow::-webkit-scrollbar-track {
  background-color: rgba(34, 67, 123, 0.5);
}
section.outside .inside .overflow::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
section.outside .inside .overflow::-webkit-scrollbar-thumb {
  background: rgba(34, 67, 123, 0.9);
  cursor: pointer;
  border-radius: 3px;
}
section.outside .inside .single {
  border: 2px solid rgba(34, 67, 123, 0.9);
  padding: 2%;
}
section.outside .inside .single h2 {
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 5px;
}
section.outside .inside .single p {
  font-size: 18px;
  font-weight: 400;
}
section.outside .inside table {
  width: 100%;
  display: flex;
  flex-direction: column;
}
section.outside .inside table.contacts {
  min-width: 1300px;
}
section.outside .inside table.operational,
section.outside .inside table.cash_flow {
  min-width: 1200px;
}
section.outside .inside table.tools,
section.outside .inside table.procedures,
section.outside .inside table.surgeries,
section.outside .inside table.users,
section.outside .inside table.clients {
  min-width: 900px;
}
section.outside .inside table.home {
  min-width: 700px;
}
section.outside .inside table thead,
section.outside .inside table tbody {
  display: flex;
  flex-direction: column;
}
section.outside .inside table tbody tr:nth-child(even) {
  background: rgba(0, 131, 191, 0.2);
}
section.outside .inside table tbody tr:hover {
  background: rgba(0, 131, 191, 0.9);
  color: white;
}
section.outside .inside table tr {
  width: 100%;
  max-width: 100%;
  display: flex;
}
section.outside .inside table tr th,
section.outside .inside table tr td {
  height: 30px;
  font-size: 16px;
  font-weight: 300;
  line-height: 30px;
  text-align: center;
  border: 1px solid white;
  padding: 0 5px;
  white-space: nowrap;
  overflow: hidden;
}
section.outside .inside table tr th.delete,
section.outside .inside table tr td.delete {
  width: 30px;
  padding: 0;
}
section.outside .inside table tr th.delete a,
section.outside .inside table tr td.delete a {
  color: black;
}
section.outside .inside table tr th {
  background: rgba(34, 67, 123, 0.9);
  font-size: 18px;
  font-weight: 500;
  color: white;
}
section.outside .inside table tr td {
  cursor: pointer;
  position: relative;
  z-index: 0;
}
section.outside .inside table tr td span.notification {
  background: red;
  width: 10px;
  height: 10px;
  transform: rotate(45deg);
  position: absolute;
  left: -5px;
  top: -5px;
}
section.outside .inside table tr.modified {
  background: #fae098 !important;
}
section.outside .inside table tr.modified:hover {
  background: rgba(0, 131, 191, 0.9) !important;
}
section.outside .inside table tr.modified-checked {
  background: #88f28b !important;
}
section.outside .inside table tr.modified-checked:hover {
  background: rgba(0, 131, 191, 0.9) !important;
}
/*------------------------------*/
/*----------ASIDE FORM----------*/
aside.container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3);
  padding: 1%;
  overflow: auto;
  z-index: 999;
}
aside.container::-webkit-scrollbar-track {
  background-color: rgba(34, 67, 123, 0.5);
}
aside.container::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
aside.container::-webkit-scrollbar-thumb {
  background: rgba(34, 67, 123, 0.9);
  cursor: pointer;
  border-radius: 3px;
}
aside.container.alone {
  position: relative;
  height: 100%;
  background: white;
  padding: 0;
}
aside.container.alone .box,
aside.container.alone form {
  width: 800px;
  margin-top: 0;
}
aside.container.new-operational form,
aside.container.edit-operational form,
aside.container.new-operational_med form,
aside.container.edit-operational_med form {
  width: 900px;
  margin-top: 0;
}
aside.container .box,
aside.container form {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  margin-top: 40px;
  background: white;
  width: 600px;
  max-width: 100%;
  padding: 2%;
  position: relative;
}
aside.container .box button.close-form,
aside.container form button.close-form {
  background: none;
  border: 1px solid rgba(34, 67, 123, 0.9);
  border-radius: 1018px;
  color: rgba(34, 67, 123, 0.9);
  font-size: 10px;
  height: 20px;
  width: 20px;
  cursor: pointer;
  outline: none;
  position: absolute;
  top: 10px;
  right: 10px;
}
aside.container .box button.close-form i,
aside.container form button.close-form i {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
aside.container .box button.close-form:hover,
aside.container form button.close-form:hover {
  background: rgba(34, 67, 123, 0.9);
  color: white;
}
aside.container .box label.button,
aside.container form label.button {
  width: auto;
  height: 32px;
  padding: 0 10px;
  margin-top: 20px;
  margin-bottom: 15px;
  position: relative;
  z-index: 100;
  border: 1px solid rgba(34, 67, 123, 0.9);
  border-radius: 16px;
  outline: none;
  text-transform: uppercase;
  font-size: 16px;
  line-height: 30px;
  color: rgba(34, 67, 123, 0.9);
  background: none;
  cursor: pointer;
}
aside.container .box label.button:hover,
aside.container form label.button:hover,
aside.container .box label.button:focus,
aside.container form label.button:focus {
  color: white;
  background: rgba(34, 67, 123, 0.9);
}
aside.container .box h2,
aside.container form h2 {
  font-size: 26px;
  font-weight: 400;
  text-align: center;
  margin-bottom: 15px;
}
aside.container .box hr,
aside.container form hr {
  margin-top: 5px;
  margin-bottom: 15px;
}
aside.container .box hr.special,
aside.container form hr.special {
  margin-top: 20px;
}
aside.container .box .auto-message p span,
aside.container form .auto-message p span {
  font-weight: 500;
}
aside.container .box {
  text-align: center;
}
aside.container .box .content {
  display: inline-block;
  text-align: justify;
}
aside.container .box .content p {
  font-size: 18px;
  font-weight: 300;
  text-align: justify;
  margin-bottom: 15px;
  white-space: pre-wrap;
}
aside.container .box .content p b {
  font-weight: 500;
}
aside.container .box .content p a {
  font-style: italic;
  color: #0000ee;
}
aside.container .box .content .group p {
  margin-top: 0;
}
aside.container .box .content button.open-form {
  margin-top: 20px;
}
aside.container .box .content img.logo,
aside.container .box .content img.signature {
  max-width: 100%;
  width: auto;
}
aside.container .box .content a.doc {
  background: none;
  border: 1px solid rgba(34, 67, 123, 0.9);
  border-radius: 15px;
  color: rgba(34, 67, 123, 0.9);
  padding: 0 8px;
  font-size: 12px;
  line-height: 22px;
  height: 22px;
  margin-top: 5px;
  margin-bottom: 15px;
  cursor: pointer;
  outline: none;
  display: inline-block;
  text-align: center;
}
aside.container .box .content a.doc:hover {
  background: rgba(34, 67, 123, 0.9);
  color: white;
}
aside.container form p.error {
  font-size: 16px;
  font-weight: 500;
  text-align: center;
  color: #f5594e;
  margin-bottom: 15px;
}
aside.container form label {
  font-size: 16px;
  font-weight: 400;
  width: 100%;
  display: inline-block;
}
aside.container form label b.required {
  color: red;
  font-size: 14px;
}
aside.container form input,
aside.container form select,
aside.container form textarea {
  font-size: 16px;
  width: 100%;
  height: 30px;
  border: 1px solid black;
  border-radius: 0;
  margin-top: 5px;
  margin-bottom: 15px;
  outline: none;
  line-height: 30px;
  padding: 0 5px;
}
aside.container form textarea {
  padding: 5px;
  height: 90px;
  resize: vertical;
  line-height: 20px;
}
aside.container form textarea::-webkit-scrollbar-track {
  background-color: #e0deda;
}
aside.container form textarea::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
aside.container form textarea::-webkit-scrollbar-thumb {
  background: #8f8e8c;
  cursor: pointer;
  border-radius: 3px;
}
aside.container form .authorization,
aside.container form .authorization2 {
  margin-bottom: 10px;
}
aside.container form .tox-tinymce {
  height: 300px !important;
  margin-top: 5px;
  margin-bottom: 15px;
}
aside.container form input[type=number] {
  padding-right: 0;
}
aside.container form input[type=checkbox] {
  width: 13px;
  height: 15px;
  margin-top: 0;
  margin-bottom: 0;
  padding: 0;
  vertical-align: middle;
}
aside.container form .group {
  margin: 5px 0;
  display: flex;
  align-items: center;
}
aside.container form .group label,
aside.container form .group input[type=checkbox] {
  cursor: pointer;
  width: auto;
}
aside.container form .group label {
  margin-left: 5px;
}
aside.container form .category .group {
  display: inline-block;
}
aside.container form input[type=file] {
  display: none;
}
aside.container form input[type=submit] {
  background: none;
  border: 1px solid rgba(34, 67, 123, 0.9);
  border-radius: 16px;
  color: rgba(34, 67, 123, 0.9);
  padding: 0 10px;
  font-size: 16px;
  line-height: 32px;
  width: auto;
  height: 32px;
  margin-bottom: 15px;
  text-transform: uppercase;
  cursor: pointer;
  outline: none;
}
aside.container form input[type=submit]:hover {
  background: rgba(34, 67, 123, 0.9);
  color: white;
}
aside.container form .search {
  margin-bottom: 15px;
  position: relative;
}
aside.container form .search input {
  margin-bottom: 0;
  position: relative;
  z-index: 1;
}
aside.container form .search input:focus ~ ul {
  display: block;
}
aside.container form .search ul {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  max-height: 200px;
  overflow: auto;
  background: white;
  border: 1px solid black;
  border-width: 0 1px 1px 1px;
  display: none;
  z-index: 100;
}
aside.container form .search ul::-webkit-scrollbar-track {
  background-color: rgba(180, 180, 180, 0.5);
}
aside.container form .search ul::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
aside.container form .search ul::-webkit-scrollbar-thumb {
  background: #b4b4b4;
  cursor: pointer;
  border-radius: 3px;
}
aside.container form .search ul:hover {
  display: block;
}
aside.container form .search ul li {
  padding: 2px 5px;
  cursor: pointer;
}
aside.container form .search ul li:hover {
  background: #1e90ff;
  color: white;
}
aside.container form .search ul li.last {
  display: none;
  cursor: default;
}
aside.container form .search ul li.last:hover {
  background: white;
  color: black;
}
aside.container form .file-content ul.file-list {
  width: 100%;
  padding: 0 10px;
  margin-top: 5px;
  margin-bottom: 15px;
}
aside.container form .file-content ul.file-list li {
  width: 100%;
  padding-left: 5px;
  padding-bottom: 3px;
  margin-bottom: 5px;
  display: flex;
  align-items: center;
  position: relative;
  border-left: 2px solid rgba(34, 67, 123, 0.9);
  font-size: 16px;
  line-height: 18px;
  cursor: default;
}
aside.container form .file-content ul.file-list li.alone {
  font-style: italic;
}
aside.container form .file-content ul.file-list li.hidden {
  display: none;
}
aside.container form .file-content ul.file-list li span,
aside.container form .file-content ul.file-list li a {
  padding-left: 5px;
}
aside.container form .file-content ul.file-list li a {
  color: black;
}
aside.container form .file-content ul.file-list li a:hover {
  text-decoration: underline;
}
aside.container form .file-content ul.file-list li button.remove-item,
aside.container form .file-content ul.file-list li button.transfer-item {
  width: 16px;
  border: none;
  outline: none;
  text-align: center;
  font-size: 14px;
  background: none;
  color: rgba(34, 67, 123, 0.9);
  cursor: pointer;
}
aside.container form .file-content ul.file-list li button.remove-item:hover,
aside.container form .file-content ul.file-list li button.transfer-item:hover {
  font-size: 16px;
}
aside.container form .file-content ul.file-list li span.line {
  width: 2px;
  height: 2px;
  padding: 0;
  position: absolute;
  top: calc(100% - 2px);
  left: -2px;
  background: rgba(34, 67, 123, 0.9);
  transition: 0.3s;
}
aside.container form .file-content ul.file-list li:hover span.line {
  width: 100%;
}
aside.container form button.add-item,
aside.container form button.add-item2,
aside.container form button.remove-item,
aside.container form button.delete-item,
aside.container form button.item-up,
aside.container form button.item-down,
aside.container form label.add-img,
aside.container form label.button {
  background: none;
  border: 1px solid rgba(34, 67, 123, 0.9);
  border-radius: 11px;
  color: rgba(34, 67, 123, 0.9);
  padding: 0 5px;
  font-size: 12px;
  line-height: 22px;
  height: 22px;
  margin-top: 5px;
  margin-bottom: 15px;
  cursor: pointer;
  outline: none;
  text-align: center;
}
aside.container form button.add-item:hover,
aside.container form button.add-item2:hover,
aside.container form button.remove-item:hover,
aside.container form button.delete-item:hover,
aside.container form button.item-up:hover,
aside.container form button.item-down:hover,
aside.container form label.add-img:hover,
aside.container form label.button:hover {
  background: rgba(34, 67, 123, 0.9);
  color: white;
}
aside.container form label.add-img {
  width: auto;
}
aside.container form button.remove-item,
aside.container form button.delete-item,
aside.container form button.item-up,
aside.container form button.item-down {
  padding: 0;
  min-width: 16px;
  height: 16px;
  line-height: 14px;
  border-radius: 8px;
  font-size: 8px;
  margin-top: 0;
  margin-bottom: 0;
  margin-right: 5px;
}
aside.container form button.delete-item {
  position: absolute;
  top: 0;
  right: 0;
  min-width: 18px;
  height: 18px;
  border-radius: 9px;
}
aside.container form button.delete-item i {
  line-height: 16px;
}
aside.container form button.item-up,
aside.container form button.item-down {
  position: absolute;
  top: 0;
  min-width: 18px;
  height: 18px;
  border-radius: 9px;
}
aside.container form button.item-up i,
aside.container form button.item-down i {
  line-height: 16px;
}
aside.container form button.item-up {
  right: 40px;
}
aside.container form button.item-down {
  right: 20px;
}
aside.container form ul.list {
  margin-bottom: 15px;
  padding-left: 15px;
}
aside.container form ul.list li {
  min-height: 20px;
  line-height: 20px;
  margin-top: 5px;
  position: relative;
  padding-left: 20px;
}
aside.container form ul.list li input.input_inline {
  display: inline;
  margin: 0;
  height: 20px;
  line-height: 20px;
  width: 80px;
  margin-left: 10px;
  border-width: 0 0 1px 0;
  text-align: center;
}
aside.container form ul.list li.first {
  padding-left: 0;
}
aside.container form ul.list li button {
  position: absolute;
  top: calc(50% - 1px);
  left: 0;
  transform: translateY(-50%);
}
/*------------------------------*/
/*----------WIDTH TEMPLATE----------*/
.w100 {
  width: 100%;
}
.n100 {
  width: calc(100% - 30px);
}
.w75 {
  width: 75%;
}
.n75 {
  width: calc(75% - 30px);
}
.w66 {
  width: calc((100% / 3) * 2);
}
.n66 {
  width: calc(((100% / 3) * 2) - 30px);
}
.w60 {
  width: 60%;
}
.n60 {
  width: calc(60% - 30px);
}
.w50 {
  width: 50%;
}
.n50 {
  width: calc(50% - 30px);
}
.w40 {
  width: 40%;
}
.n40 {
  width: calc(40% - 30px);
}
.w35 {
  width: 35%;
}
.n35 {
  width: calc(35% - 30px);
}
.w33 {
  width: calc(100% / 3);
}
.n33 {
  width: calc((100% / 3) - 30px);
}
.w30 {
  width: 30%;
}
.n30 {
  width: calc(30% - 30px);
}
.w25 {
  width: 25%;
}
.n25 {
  width: calc(25% - 30px);
}
.w20 {
  width: 20%;
}
.n20 {
  width: calc(20% - 30px);
}
.w15 {
  width: 15%;
}
.n15 {
  width: calc(15% - 30px);
}
.w10 {
  width: 10%;
}
.n10 {
  width: calc(10% - 30px);
}
/*------------------------------*/
/*----------OTHER----------*/
.center {
  text-align: center;
}
.flex {
  display: flex;
  flex-wrap: wrap;
}
.order {
  display: flex;
  flex-direction: column;
}
.padding {
  padding: 0 1%;
}
.pages {
  text-align: center;
}
.pages a {
  font-size: 12px;
  display: inline-block;
  width: 24px;
  height: 24px;
  border-radius: 12px;
  border: 1px solid rgba(34, 67, 123, 0.9);
  color: rgba(34, 67, 123, 0.9);
  line-height: 23px;
  vertical-align: middle;
  margin: 0 5px;
  margin-top: 20px;
}
.pages a:hover,
.pages a.page-selected {
  background: rgba(34, 67, 123, 0.9);
  color: white;
}
/*------------------------------*/
/*----------MESSAGES----------*/
article.message-success {
  width: 96%;
  position: fixed;
  top: 50px;
  left: 50%;
  transform: translateX(-50%);
  padding: 1%;
  background: #58d656;
  border-radius: 20px;
  display: none;
  z-index: 999;
}
article.message-success p {
  font-size: 18px;
  color: white;
  text-align: center;
  text-transform: uppercase;
}
/*------------------------------*/
/*----------CASH FLOW----------*/
.category {
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 2%;
  margin-top: 5px;
  margin-bottom: 20px;
  text-align: center;
}
.category .group {
  display: inline-block;
}
.category .group input[type=checkbox],
.category .group input[type=radio] {
  display: none;
}
.category .group label,
.category .group p {
  border: 1px solid;
  border-radius: 13px;
  width: auto;
  font-size: 14px !important;
  height: 26px;
  line-height: 24px;
  display: inline-block;
  padding: 0 10px;
}
.category .group label.checked,
.category .group p.checked {
  border-width: 2px;
  line-height: 22px;
  padding: 0 8px;
  font-weight: 600 !important;
}
.category .group p {
  margin: 3px 0 !important;
}
/*------------------------------*/
/*----------GENERAL REPORT----------*/
.container-report {
  width: 100%;
  min-height: 100%;
  background: white;
  text-align: center;
  padding: 2% 0;
}
.container-report .general-report {
  display: inline-block;
  width: 800px;
  max-width: 100%;
  border: 1px solid black;
  padding: 2%;
  font-weight: 300;
  text-align: center;
}
.container-report .general-report h1 {
  font-size: 20px;
  font-weight: 500;
}
.container-report .general-report h2 {
  font-size: 16px;
  font-weight: 400;
}
.container-report .general-report .data {
  padding: 2% 0;
}
.container-report .general-report .data p {
  font-size: 14px;
}
.container-report .general-report table {
  padding: 2% 0;
  width: 100%;
}
.container-report .general-report table tr {
  border: 1px solid black;
  font-size: 12px;
  text-align: center;
}
.container-report .general-report table tr th {
  font-size: 14px;
  font-weight: 500;
}
.container-report .general-report table thead tr {
  background: #878686;
  color: white;
}
.container-report .general-report table tbody tr:nth-child(even) {
  background: #e3e3e3;
}
/*------------------------------*/
/*----------LOGIN----------*/
@media screen and (max-width: 1500px) {
  section.outside.home50 {
    width: 100%;
  }
}
@media screen and (max-width: 1200px) {
  section.outside .inside h1 {
    font-size: 24px;
  }
  section.outside .inside h1 i {
    font-size: 22px;
  }
  section.outside.home100 .inside .single h2 {
    font-size: 18px;
  }
  section.outside.home100 .inside .single p {
    font-size: 16px;
  }
}
@media screen and (max-width: 1100px) {
  section.outside.home100 .inside .w25.padding {
    width: 50%;
    margin-bottom: 5px;
  }
}
@media screen and (max-width: 640px) {
  header {
    height: 32px;
  }
  header i {
    font-size: 18px;
  }
  header i span.notification {
    width: 6px;
    height: 6px;
    border-radius: 3px;
    position: absolute;
    left: -3px;
    top: -1px;
  }
  header a span {
    font-size: 16px;
    line-height: 22px;
  }
  header .logo {
    width: 60px;
    height: 22px;
  }
  nav {
    width: 200px;
  }
  nav .user i {
    font-size: 10px;
  }
  nav .user h2 {
    font-size: 20px;
  }
  nav .user h3 {
    font-size: 14px;
  }
  nav > ul {
    padding-top: 20px;
  }
  nav > ul > li {
    padding: 10px 0;
  }
  nav > ul > li a,
  nav > ul > li p {
    font-size: 16px;
  }
  nav > ul > li a i,
  nav > ul > li p i {
    font-size: 14px;
  }
  nav > ul > li a i span.notification,
  nav > ul > li p i span.notification {
    width: 6px;
    height: 6px;
    border-radius: 3px;
    left: -2px;
    top: -3px;
  }
  nav > ul > li ul.suboption li a,
  nav > ul > li ul.suboption li p {
    font-size: 14px;
  }
  nav > ul > li ul.suboption li a i,
  nav > ul > li ul.suboption li p i {
    font-size: 12px;
  }
  main {
    height: calc(100% - 30px);
  }
  section.outside .inside h1 {
    font-size: 22px;
    margin-bottom: 10px;
  }
  section.outside .inside h1 i {
    font-size: 20px;
  }
  section.outside .inside button.open-form,
  section.outside .inside button.link,
  section.outside .inside button.first,
  section.outside .inside button.middle,
  section.outside .inside button.last,
  section.outside .inside ul.button > li {
    border-radius: 14px;
    padding: 0 8px;
    font-size: 14px;
    line-height: 28px;
    height: 28px;
    margin-bottom: 10px;
  }
  section.outside .inside button.open-form a,
  section.outside .inside button.link a,
  section.outside .inside button.first a,
  section.outside .inside button.middle a,
  section.outside .inside button.last a,
  section.outside .inside ul.button > li a {
    height: 26px;
  }
  section.outside .inside button.open-form i,
  section.outside .inside button.link i,
  section.outside .inside button.first i,
  section.outside .inside button.middle i,
  section.outside .inside button.last i,
  section.outside .inside ul.button > li i {
    font-size: 12px;
  }
  section.outside .inside button.link a {
    padding: 0 2px;
  }
  section.outside .inside button.first {
    border-radius: 14px 0 0 14px;
  }
  section.outside .inside button.last {
    border-radius: 0 14px 14px 0;
  }
  section.outside .inside ul.button {
    border-radius: 14px;
    min-width: 80px;
    height: 28px;
  }
  section.outside .inside ul.button:hover {
    border-radius: 14px 14px 0 0;
  }
  section.outside .inside ul.button > li i {
    font-size: 10px;
  }
  section.outside .inside ul.button ul {
    border-radius: 0 0 14px 14px;
  }
  section.outside .inside ul.button ul li {
    font-size: 13px;
  }
  section.outside .inside ul.button ul li button {
    line-height: 20px;
    height: 20px;
  }
  section.outside .inside ul.button ul li a {
    line-height: 20px;
  }
  section.outside .inside ul.button ul li:last-child a,
  section.outside .inside ul.button ul li:last-child button {
    border-radius: 0 0 10px 10px;
  }
  section.outside .inside ul.first {
    border-radius: 14px 0 0 14px;
  }
  section.outside .inside ul.first:hover {
    border-radius: 14px 0 0 0;
  }
  section.outside .inside ul.middle {
    border-radius: 0;
    border-right: 0px;
  }
  section.outside .inside ul.middle:hover {
    border-radius: 0;
  }
  section.outside .inside ul.last {
    border-radius: 0 14px 14px 0;
  }
  section.outside .inside ul.last:hover {
    border-radius: 0 14px 0 0;
  }
  section.outside .inside table.contacts {
    min-width: 1000px;
  }
  section.outside .inside table.operational,
  section.outside .inside table.cash_flow {
    min-width: 1000px;
  }
  section.outside .inside table tr th,
  section.outside .inside table tr td {
    height: 24px;
    font-size: 14px;
    line-height: 24px;
  }
  section.outside .inside table tr th.delete,
  section.outside .inside table tr td.delete {
    width: 24px;
  }
  section.outside .inside table tr th {
    font-size: 16px;
  }
  section.outside .inside table tr td span.notification {
    width: 8px;
    height: 8px;
    left: -4px;
    top: -4px;
  }
  section.outside.home100 .inside .single h2 {
    font-size: 16px;
  }
  section.outside.home100 .inside .single p {
    font-size: 14px;
  }
  aside.container.new-operational form .w50,
  aside.container.edit-operational form .w50,
  aside.container.new-operational_med form .w50,
  aside.container.edit-operational_med form .w50 {
    width: 100%;
  }
  aside.container.new-operational form .w33,
  aside.container.edit-operational form .w33,
  aside.container.new-operational_med form .w33,
  aside.container.edit-operational_med form .w33 {
    width: 50%;
  }
  aside.container .box,
  aside.container form {
    margin-top: 32px;
  }
  aside.container .box button.close-form,
  aside.container form button.close-form {
    border-radius: 9px;
    font-size: 8px;
    height: 18px;
    width: 18px;
  }
  aside.container .box h2,
  aside.container form h2 {
    font-size: 22px;
    margin-bottom: 8px;
  }
  aside.container .box hr,
  aside.container form hr {
    margin-top: 3px;
    margin-bottom: 8px;
  }
  aside.container .box hr.special,
  aside.container form hr.special {
    margin-top: 15px;
  }
  aside.container .box .content p {
    font-size: 16px;
    margin-bottom: 8px;
  }
  aside.container .box .content button.open-form {
    margin-top: 15px;
  }
  aside.container form p.error {
    font-size: 14px;
    margin-bottom: 8px;
  }
  aside.container form label {
    font-size: 14px;
  }
  aside.container form label b.required {
    font-size: 12px;
  }
  aside.container form input,
  aside.container form select,
  aside.container form textarea {
    font-size: 14px;
    height: 24px;
    margin-top: 3px;
    margin-bottom: 8px;
    line-height: 24px;
  }
  aside.container form textarea {
    height: 60px;
    line-height: 18px;
  }
  aside.container form input[type=submit] {
    border-radius: 14px;
    padding: 0 8px;
    font-size: 14px;
    line-height: 28px;
    height: 28px;
    margin-bottom: 8px;
  }
  aside.container form .search {
    margin-bottom: 8px;
  }
  aside.container form .search ul {
    max-height: 80px;
  }
  aside.container form button.add-item,
  aside.container form button.add-item2,
  aside.container form button.remove-item,
  aside.container form button.delete-item,
  aside.container form button.item-up,
  aside.container form button.item-down {
    border-radius: 10px;
    font-size: 10px;
    line-height: 20px;
    height: 20px;
    margin-top: 3px;
    margin-bottom: 8px;
  }
  aside.container form button.remove-item,
  aside.container form button.delete-item,
  aside.container form button.item-up,
  aside.container form button.item-down {
    min-width: 14px;
    height: 14px;
    line-height: 12px;
    border-radius: 7px;
    font-size: 7px;
    margin-right: 5px;
  }
  aside.container form button.delete-item {
    min-width: 16px;
    height: 16px;
    border-radius: 8px;
  }
  aside.container form button.delete-item i {
    line-height: 14px;
  }
  aside.container form button.item-up,
  aside.container form button.item-down {
    min-width: 16px;
    height: 16px;
    border-radius: 8px;
  }
  aside.container form button.item-up i,
  aside.container form button.item-down i {
    line-height: 14px;
  }
  aside.container form ul.list {
    margin-bottom: 10px;
    padding-left: 10px;
  }
  aside.container form ul.list li {
    min-height: 18px;
    line-height: 18px;
    margin-top: 3px;
    padding-left: 18px;
  }
  aside.container form ul.list li button {
    top: calc(50% - 0px);
  }
  .n100 {
    width: calc(100% - 24px);
  }
  .n75 {
    width: calc(75% - 24px);
  }
  .n66 {
    width: calc(((100% / 3) * 2) - 24px);
  }
  .n60 {
    width: calc(60% - 24px);
  }
  .n50 {
    width: calc(50% - 24px);
  }
  .n40 {
    width: calc(40% - 24px);
  }
  .n35 {
    width: calc(35% - 24px);
  }
  .n33 {
    width: calc((100% / 3) - 24px);
  }
  .n30 {
    width: calc(30% - 24px);
  }
  .n25 {
    width: calc(25% - 24px);
  }
  .n20 {
    width: calc(20% - 24px);
  }
  .n15 {
    width: calc(15% - 24px);
  }
  .n10 {
    width: calc(10% - 24px);
  }
}
@media screen and (max-width: 520px) {
  aside.container.new-operational form .w33,
  aside.container.edit-operational form .w33,
  aside.container.new-operational_med form .w33,
  aside.container.edit-operational_med form .w33 {
    width: 100%;
  }
}
@media screen and (max-width: 460px) {
  section.outside.home100 .inside .w25.padding {
    width: 100%;
  }
}
/*------------------------------*/
/*------------------------------*/