.data-area {
    padding: 1rem;
}

.datatable-buttons{
	display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
  justify-content: flex-end;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.button-area{
	display: inline-block;
	margin-left: 3px;
} 


.showing .webix_view {
	border: none;
} 

.showing .webix_template {
	padding: 2px 0 0;
}

/*Datatable*/


.datatable-area {
	position: relative;
}
.table-header {
	background: #3d5263;
	margin: 10px 0 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.datatable-area h2 {
    padding: 10px;
    color: #fff;
    margin: 0;
	font-size: 1.25em;
	font-weight: 400;
} 


.table-buttons {
	display: flex;
	justify-content: flex-end;
}
.column-menu,
.column-menu:hover {
	background-color: transparent;
	color: #fff;
	border: none;
	padding: 12px 15px;
	cursor: pointer;
}
.data-table {
	position: relative;
	width: 100%;
}

.webix_dd_drag_column, 
.webix_hcolumn, 
.webix_hs_center, 
.webix_hs_left, 
.webix_hs_right, 
.webix_ss_header, 
.webix_ss_vscroll_header {
	/* font-size: 14px; */
	color: #666;
	background: #ededed;
	text-transform: uppercase;
}
.webix_hcell {
	font-weight: 700;
}
.webix_dtable .webix_ss_footer .webix_hcell, 
.webix_dtable .webix_ss_header .webix_hcell {
	border-color: #dedede;
	border-bottom-color: transparent;

}
.webix_dtable .webix_ss_header .webix_hcolumn div.webix_last_row, 
.webix_dtable .webix_ss_header .webix_span.webix_last_row {
    border-bottom: 0px solid #3d5262;
}

.webix_column>div, 
.webix_table_cell, 
.webix_dtable .webix_ss_body .webix_column > div, 
.webix_dtable .webix_ss_body .webix_table_cell {
    border-right: 1px solid #eee;
    border-bottom: 1px solid #eee;
}

.webix_view .webix_cell a {
    font-weight: 700;
}
.webix_view span.copyspan {
    font-weight: 700;
	color: #618eb5;
	cursor: pointer;
}
.webix_view span.tooltiptext {
    margin-right: 30rem;
}
.webix_view span.copyspan:hover {
	color: #3d5263;
}
/* 
.webix_view {
	font-size: 13px;
}



.webix_ss_header .webix_hcell:not(.webix_ss_filter){
	padding-top: 2px;
}
.webix_hcell input[type="checkbox"],
.webix_table_checkbox {
 	 width: 16px;
  	height: 16px;
	vertical-align: text-bottom;
}

.webix_column>div.webix_cell_select,
.webix_column>div.webix_column_select,
.webix_column>div.webix_row_select,
.webix_column>div.rowSelection {
  	color: #fff;
	background: #9ac3e8;
}

.webix_ss_sort_asc, .webix_ss_sort_desc {
  right: 6px;
}
.webix_dtable .webix_ss_vscroll_header {
	border-left: 0px solid #ededed;
	border-bottom: 0px solid #ededed;
} 
*/


/* Filter */
/* 
.webix_dtable .webix_ss_filter input,
.webix_dtable .webix_ss_filter select {
	height: 26px;
	vertical-align: middle;
	border-radius: 0px;
}
.webix_el_colorpicker .webix_inp_static,
.webix_el_datepicker .webix_inp_static,
.webix_el_dbldatepicker .webix_inp_static,
.webix_el_richselect .webix_inp_static {
	border-radius: 0;
	height: 26px;
}
.webix_dtable .webix_hcell.webix_ss_filter,
.webix_dtable .webix_hcell.webix_div_filter {
	padding: 0 8px;
}
.webix_dtable .webix_ss_header td.webix_last_row {
	border-bottom: 1px solid #ededed;
}
.webix_input_icon.fa-angle-down {
	padding-top: 0;
}
.webix_el_colorpicker span.webix_input_icon,
.webix_el_combo span.webix_input_icon,
.webix_el_datepicker span.webix_input_icon,
.webix_el_dbldatepicker span.webix_input_icon,
.webix_el_richselect span.webix_input_icon {
	background-color: #fff;
	color: #666;
	border-radius: 0;
}
.webix_el_combo span.webix_input_icon,
.webix_el_richselect span.webix_input_icon {
	padding: 3px 0px !important;
	height: 16px !important;
	margin: 2px;
	width: 14px;
}
.dropdown .webix_el_box {
	padding: 0;
}
.webix_el_box {
	padding: 3px 1px;
}
.webix_list_item,
.webix_list .webix_list_item.webix_selected {
	padding: 2px 0;
	padding: 2px 5px;
	line-height: 30px;
}
.webix_icon, .webix_input_icon {
	font-size: 16px;
	display: inline-block;
	width: 18px;
}
.webix_multilist .fa-check-square {
	color: #618eb5;
} 
*/

/*Pager and datatable navigation*/

.datatable-navigation {
	margin: 3px 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack:justify;
	-ms-flex-pack:justify;
	justify-content:space-between;
}

#pager {
	margin-top: 5px;
}
#pager > div{
	width: 100% !important;
}
.row-options {
	position: relative;
	width: 60px;
	display: inline-block;
	vertical-align: middle;
}
/* 
.webix_el_select select,
.webix_el_textarea textarea {
	border-radius: 0;
	font-size: 14px;
}
 */



.webix_view .webix_pager_item,
.webix_view .webix_pager_item_selected {
	border-radius: 0px;
}
.webix_view .webix_pager_item {
	background-color: transparent;
	border: 1px solid #3d5262;
	color: #3d5262;
	padding: 3px 6px;
	line-height: 0;
}
.webix_view .webix_pager_item:hover,
.webix_view .webix_pager_item:focus {
	background-color: #3d5262;
	color: #fff;
}
.webix_view .webix_pager_item_selected,
.webix_view .webix_pager_item_selected:hover {

	background-color: #3d5262;
	border: 1px solid #3d5262;
}
.webix_view .webix_pager_item,
.webix_view .webix_pager_item_selected {
	width: auto;
	min-width: 30px;
} 

span.custompager {
	margin: 0 10px;
}

span.custompager input {
	border: 1px solid #ccc;
 	padding: 0 2px;
	text-align: right;
	color: #3d5262;
}

/* Progress Bar */
.webix_progress_top .webix_progress_state,
.webix_progress_bottom .webix_progress_state {
  background: #3d5262;
  /* background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.1) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.1) 75%, transparent 75%, transparent); */
}