html,
body {
  padding: 0px;
  margin: 0px;
  height: 97%;
}


.gantt_control {
  background: #ededed;
  text-align: center;
}

.gantt_control input[type=button],
.gantt_control input[type=file],
.gantt_control input[type=checkbox],
.gantt_control button {
  font: 500 14px Roboto;
  border: 1px solid #D9D9D9;
  border-radius: 2px;
  background: #fff;
  padding: 4px 12px;
  margin: 0 5px;
  color: rgba(0, 0, 0, 0.7);
  line-height: 20px;
}

.gantt_control input[type=button]:hover,
.gantt_control button:hover {
  border: 1px solid #B3B3B3;
  color: rgba(0, 0, 0, 0.8);
  cursor: pointer;
}

.gantt_control input[type=button]:active,
.gantt_control button:active {
  background: #F7F7F7;
}

.gantt_control input[type=button]:focus,
.gantt_control button:focus {
  outline: none !important;
}

.gantt_control {
  padding: 10px 0 12px;
}

.gantt_control input[type=radio],
.gantt_control input[type=checkbox] {
  display: none;
}

.gantt_control label {
  padding: 0 6px;
  color: rgba(0, 0, 0, 0.54);
  font: 14px Roboto;
  line-height: 20px;
  letter-spacing: 0.2px;
}

/* gant header cell*/
.gantt_grid_scale .gantt_grid_head_cell,
.gantt_task .gantt_task_scale .gantt_scale_cell {
  /* font-weight: bold; */
  font-size: 10pt;
  color: rgba(0, 0, 0, 0.9);
}

.weekend {
  background: #fdf7d8;
}

.gantt_selected .weekend {
  background: #fdf7d8;
}

.btn-view {
  cursor: pointer;
  border: none;
  color: #fff;
  border-radius: 3px;
  background: #a2a69a;
  font-size: 10px;
  padding: 3px;
}

.btn-view:hover {
  background: #a2a69a;
}

.bg-green {
  background: rgba(82, 214, 139, 0.75);
}

.bg-blue {
  background: rgba(61, 63, 221, 0.75);
}

.bg-orange {
  background: rgba(214, 146, 82, 0.75);
}

.gantt_folder_open,
.gantt_folder_closed,
.gantt_file {
  display: none;
}

.gantt_tree_icon {
  padding-right: 10px;
}

.gantt_task_progress {
  text-align: left;
  padding-left: 10px;
  box-sizing: border-box;
  color: white;
  font-weight: bold;
}

.gantt_grid_data .gantt_cell {
  color: #000;
}

.task-overdue {
  color: #b30810;
}

/* JSON Viewer */


.link {
  text-decoration: underline;
  cursor: pointer;
}

.link:hover {
  opacity: 0.7;
}

.table {
  border-collapse: collapse;

}

.table thead tr th, .table tbody tr td {
  padding: 5px !important;
  font-size: 0.9rem !important;
}

.f10 { font-size: 10px !important; }
.f11 { font-size: 11px !important; }
.f12 { font-size: 12px !important; }

.table-summary {
  font: 500 14px Roboto;
}

.table-summary {
  overflow: auto;
  width: 100%;
}

.table-summary table {
  border: 1px solid #dededf;
  height: 100%;
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 1px;
  text-align: center;
}

.table-summary caption {
  caption-side: top;
  text-align: center;
}

.table-summary th {
  border: 1px solid #dededf;
  background-color: #eceff1;
  color: #000000;
  padding: 5px;
}

.table-summary td {
  border: 1px solid #dededf;
  background-color: #ffffff;
  color: #000000;
  padding: 5px;
  font-size: 18px;
}

.multiline {
  line-height: 17px;
  position: relative;
  top: 15%;
  word-wrap: break-word;
  white-space: normal;
}

.link {
  text-decoration: underline;
  cursor: pointer;
}

.link:hover {
  opacity: 0.7;
}

.table {
  border-collapse: collapse;

}

.table thead tr th, .table tbody tr td {
  padding: 5px !important;
  font-size: 0.9rem !important;
}

.sticky-table {
  /* height or max-height is important */
  height: 410px;
}

.sticky-table .q-table__top,
.sticky-table .q-table__bottom,
.sticky-table thead tr:first-child th {
  /* bg color is important for th; just specify one */
  background-color: #edf0f1;
}

.sticky-table thead tr th {
  position: sticky;
  z-index: 1;
}

/* this will be the loading indicator */
.sticky-table thead tr:last-child th {
  /* height of all previous header rows */
  top: 48px;
}

.sticky-table thead tr:first-child th {
  top: 0;
}

/* prevent scrolling behind sticky top row on focus */
.sticky-table tbody {
  /* height of all previous header rows */
  scroll-margin-top: 48px;
}

.popup-close {
  font-size:38px !important;
}
.popup-title {
  font-size:24px !important;
}
.popup-body {
  font-size: 14px !important;
  text-align: left;
}

.task-description {
  font-size: 12px;
  background: #f0f0f0;
  padding: 1px 10px 1px 10px;
  border-radius: 5px;
}

.header-print {
  width: 100%;
  border-collapse: collapse;
}

.header-print td {
  border: 1px solid;
  padding:5px;
}

.no-border {
  border:none !important;
}

#gantt_area {

  transform: scale(0.98);
  transform-origin: 0 0; 
}

.print-area {
  width: 100%; /* Lebar halaman A3 */
}


.gantt_task_cell {
  border-right: 1px solid #ececec;
}
.gantt_task .gantt_task_scale .gantt_scale_cell {
  border-right: 1px solid #ececec;

}
.gantt_row {
  border-bottom: 1px solid #ececec;
}

@media print  {
  .gantt_control { display: none; }
}