.ergotable .datatable {
    border-collapse: collapse;
    background-color: #ffffff;
}

.ergotable .datatable a {
    color: #000000;
}

.ergotable .datatable th {
    border-bottom: 1px solid rgb(224, 224, 224);
    padding: 4px 6px;
    border-collapse: collapse;
}

.ergotable .datatable th {
    padding: 4px 6px;
    border-collapse: collapse;
}

/*border μεταξύ των στηλών στο header του πίνακα*/
.ergotable .datatable th:not(:last-child):not(.hidden) {
  /* border-left:1px solid black;
   border-top: 1px solid black;*/
}

/*remove left border for first column*/
.ergotable .datatable th:not(:first-child):not(.hidden) {
     border: none; 
}


.ergotable .datatable thead tr:first-child {
    border-bottom: 1px solid rgb(224, 224, 224);
}

.ergotable .datatable tbody {
}

.ergotable .hidden {
    display:none;
}

.ergotable .sort_icon {
    width: 16px;
    height: 16px;
    float: right;
    margin-top: 10px;
	font-size: 10px;
    text-align: center;
    padding-top: 15px;
}
.ergotable .sort_icon.multiple {
    margin-top: 5px;
}

.ergotable th[sord="0"] .title{
	width:calc(100% - 7px) !important;
}

.ergotable th[sord="0"] .sort_icon{
	display:none;
}

.ergotable th[sort="asc"] .sort_icon {
    background:url(images/sort-ascending.png);
    background-repeat: no-repeat;
    background-size: cover;
}

.ergotable th[sort="desc"] .sort_icon {
    background:url(images/sort-down.png);
    background-repeat: no-repeat;
    background-size: cover;
}

.ergotable .grouped_column[sort="asc"] .sort_icon {
    background:url(images//sort-ascending.png);
    background-repeat: no-repeat;
    background-size: cover;
}

.ergotable .grouped_column[sort="desc"] .sort_icon {
    background:url(images/sort-down.png);
    background-repeat: no-repeat;
    background-size: cover;
}

.ergotable th.sortable_s, .ergotable th.sortable_m {
    cursor:pointer;
}

.ergotable thead{
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                       supported by Chrome and Opera */
    /*background-color: rgba(208,213,217,1);*/
    background-color: #E6E0ED;
    color: rgb(0,0,0);
}


.ergotable .datatable_container {
    overflow-x: auto;
}
.ergotable .datatable {
    width:100%;
}

.ergotable input, .ergotable select {
    outline: unset;
}

.ergotable .datatable td.left {
    text-align:left;
}

.ergotable .datatable td.center {
    text-align:center;
}

.ergotable .datatable td.right {
    text-align:right;
}

.ergotable .datatable .title.left {
    text-align:left;
}

.ergotable .datatable .title.center {
    text-align:center;
}

.ergotable .datatable .title.right {
    text-align:right;
}

.ergotable .datatable td {
    padding-left:7px;
    padding-right:7px;
    /*padding-top:0px;*/
    /*padding-bottom:0px;*/
    font-size: 13px;
}

.ergotable .datatable > tbody > tr {
    border-bottom: 1px solid rgb(172, 185, 217);
}

.ergotable .datatable .select_col {
    cursor:pointer;
    text-align:center;
    min-width: 30px;
    width: 30px;
}

.ergotable .datatable thead .select_col .select_all {
    cursor:pointer;
}

.ergotable .datatable tbody .select_col .select_row {
    margin:0px;
    cursor:pointer;
}

.ergotable .datatable tbody tr.selected {
   background-color: rgb(224, 224, 224);

}

.ergotable .datatable tfoot {
    border-bottom: 1px solid rgb(224, 224, 224);
    background: #ffe3b0;
    font-weight: bold;
}

.ergotable .datatable tbody tr.group_row {
    background: gainsboro;
    font-weight: bold;
}

/*το border του πίνακα*/
.ergotable .datatable_container {
    border: 1px solid rgb(224, 224, 224);
}

.ergotable .datatable tr:first-child th {
    padding:0px;
}

.ergotable .datatable tr:first-child th .title {
    width: calc(100% - 26px);
    min-height: 37px;
    float: left;
    padding-top: 12px;
    padding-left: 6px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 12px;
    line-height: normal;
    box-sizing: border-box;
}

.ergotable .datatable tr.group_aggregate_row {
    background: #fff8ec;
}

.ergotable .grouped_columns {
    width: 100%;
    height: 30px;
    line-height: 30px;
    padding-left: 5px;
    font-size: 11px;
    color: black;
    margin-top:-30px;
    overflow-y:auto;
    overflow-x:hidden;
    box-sizing: border-box;
}
.ergotable .grouped_columns_ph_div {
    width: 100%;
    height: 30px;
    background: lightgray;
    border-top: 1px solid rgb(224, 224, 224);
    border-left: 1px solid rgb(224, 224, 224);
    border-right: 1px solid rgb(224, 224, 224);
    line-height: 30px;
    padding-left: 5px;
    font-size: 11px;
    color: #737373;
    box-sizing: border-box;
}

.ergotable .grouped_columns .grouped_column,
.grouped_column {
    float:left;
    background:white;
    border:1px dotted rgb(224, 224, 224);
    font-size: 11px;
    line-height:28px;
    min-width:120px;
    height: 29px;
    margin-top: 1px;
    cursor:pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    box-sizing: border-box;
}

.ergotable .grouped_columns_placeholder {
    box-sizing: border-box;
    height: 29px;
    left: 0px;
    top: 0px;
}
.ergotable .grouped_columns .grouped_column .title,
.grouped_column .title {
    float: left;
    margin-left: 3px;
    width: calc(100% - 45px);
}

.ergotable .grouped_column .remove_group {
    background: url(images/remove_group.png);
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
    width: 20px;
    height: 28px;
    float: right;
}

/*********************************************************************************************/
/* Filters *************************************************************************************/
/*********************************************************************************************/

.ergotable .filter_icon{
    cursor: pointer;
    width: 20px;
    height: 25px;
    float: left;
}

.ergotable .filter_icon_popup{
	position: fixed;
    background: #f5f5f5;
    border: 1px solid gray;
    margin-top: 25px;
	padding:0px;
	z-index:5;
}
.ergotable .filter_icon_popup li{
	padding:3px;
	list-style:none;
	cursor:pointer;
}
.ergotable .filter_icon_popup li:hover{
	background-color:lightgray;
}

.ergotable .filter_icon[type='eq']{
	background: url(images/ergotable_filters/eq.png);
	background-repeat: no-repeat;
    background-size: contain;
	background-position: center;
}
.ergotable .filter_icon[type='neq']{
	background: url(images/ergotable_filters/neq.png);
	background-repeat: no-repeat;
    background-size: contain;
	background-position: center;
}
.ergotable .filter_icon[type='cnt']{
	background: url(images/ergotable_filters/cnt.png);
	background-repeat: no-repeat;
    background-size: contain;
	background-position: center;
}
.ergotable .filter_icon[type='ncnt']{
	background: url(images/ergotable_filters/ncnt.png);
	background-repeat: no-repeat;
    background-size: contain;
	background-position: center;
}
.ergotable .filter_icon[type='bw']{
	background: url(images/ergotable_filters/bw.png);
	background-repeat: no-repeat;
    background-size: contain;
	background-position: center;
}
.ergotable .filter_icon[type='ew']{
	background: url(images/ergotable_filters/ew.png);
	background-repeat: no-repeat;
    background-size: contain;
	background-position: center;
}
.ergotable .filter_icon[type='gt']{
	background: url(images/ergotable_filters/gt.png);
	background-repeat: no-repeat;
    background-size: contain;
	background-position: center;
}
.ergotable .filter_icon[type='lt']{
	background: url(images/ergotable_filters/lt.png);
	background-repeat: no-repeat;
    background-size: contain;
	background-position: center;
}
.ergotable .filter_icon[type='gte']{
	background: url(images/ergotable_filters/gte.png);
	background-repeat: no-repeat;
    background-size: contain;
	background-position: center;
}
.ergotable .filter_icon[type='lte']{
	background: url(images/ergotable_filters/lte.png);
	background-repeat: no-repeat;
    background-size: contain;
	background-position: center;
}

.ergotable .filter_row {
    width: 100%;
    text-align: right;
    padding-bottom: 6px;
}

.ergotable .filter_row .filter_simple {
    border: 1px solid rgb(224, 224, 224);
    padding: 5px;
    outline: unset;
    width: 200px;
    max-width: 100%;
}

.ergotable .filter_simple_clear {
    width: 27px;
    height: 27px;
    float: right;
    background: url(images/clear.png);
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
}

.ergotable .datatable tr.filter_row {
    border-bottom: 2px solid rgb(224, 224, 224);
}

.ergotable .datatable tr.filter_row th {
    padding:0px;
    text-align:left;
	background: #f7f7f7;
}

.ergotable .datatable tr.filter_row th .filter {
    height:25px;
    width:calc(100% - 25px);
    border:0px;
    padding-left:5px;
    padding-right:5px;
}

.ergotable .datatable tr.filter_row.column_types th .filter {
    height:25px;
    width: calc(100% - 41px);
    border:0px;
    padding-left:5px;
    padding-right:5px;
    font-size: 12px;
    font-weight: normal;
    padding-top: 0px;
    padding-bottom: 0px;
    border-radius: 0px;
    box-sizing: border-box;
    color: black;
    background-color: #f5f5f5;
}

.ergotable .datatable tr.filter_row th .filter_clear {
    width: 12px;
    height: 12px;
    float: right;
    background: url(images/clearFilter.png);
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
    margin: 7px 5px 0 0;
}

.ergotable .datatable tr.filter_row th .filter_type {
    width: 70px;
    height: 25px;
    float: left;
    border: none;
    border-right: 1px solid rgb(224, 224, 224);
    cursor: pointer;
    box-sizing: border-box;
    font-size: 12px;
    border-radius: 0px;
    background-color: rgb(232, 234, 246);
    color: black;
	display:none;
}

/*********************************************************************************************/
/* Pager *************************************************************************************/
/*********************************************************************************************/

.ergotable .tblpager .first {
    width: 17px;
    height: 17px;
    margin: 5px;
    background: url(images/first.png);
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
}
.ergotable .tblpager .previous {
    width: 17px;
    height: 17px;
    margin: 5px;
    background: url(images/previous.png);
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
}

.ergotable .tblpager .next {
    width: 17px;
    height: 17px;
    margin: 5px;
    background: url(images/next.png);
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
}

.ergotable .tblpager .last {
    width: 17px;
    height: 17px;
    margin: 5px;
    background: url(images/last.png);
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
}

.ergotable .tblpager .first.disabled {
    width: 17px;
    height: 17px;
    margin: 5px;
    background: url(images/first_disabled.png);
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
}

.ergotable .tblpager .previous.disabled {
    width: 17px;
    height: 17px;
    margin: 5px;
    background: url(images/previous_disabled.png);
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
}

.ergotable .tblpager .next.disabled {
    width: 17px;
    height: 17px;
    margin: 5px;
    background: url(images/next_disabled.png);
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
}

.ergotable .tblpager .last.disabled {
    width: 17px;
    height: 17px;
    margin: 5px;
    background: url(images/last_disabled.png);
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
}

.ergotable .tblpager {
    text-align: center;
    padding: 5px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    /*background-color: rgba(208,213,217,1);*/
    background-color: #E6E0ED;
    border: 1px solid rgb(224, 224, 224);
}

.ergotable .tblpager > div{
    display: inline-block;
}

.ergotable .tblpager .total_txt {
    float: right;
    line-height: 26px;
}

.ergotable .tblpager .rows {
    float: left;
}

.ergotable .tblpager .pagernav {
}

.ergotable .pagernav > div {
    float:left;
}

.ergotable .pagernav .current input {
    border: 1px solid rgb(224, 224, 224);
    padding: 5px;
    width:40px;
    text-align:center;
    height:27px;
    box-sizing:border-box;
}

.ergotable .tblpager .rows select {
    border: 1px solid rgb(224, 224, 224);
    padding: 4px 0px;
    width: 50px;
    height:27px;
    cursor:pointer;
}

/*********************************************************************************************/
/* Buttons ***********************************************************************************/
/*********************************************************************************************/
.ergotable .buttons_row {
    width: 100%;
    text-align: right;
    height: 37px;
    background-color: #ffffff;
}

.ergotable .buttons_row .button {
    width: 20px;
    height: 20px;
    float: right;
    border-radius: 3px;
    margin-right:5px;
    margin-top: 10px;
}

.ergotable .buttons_row .reload {
    background: url(images/ergorefresh.png);
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
}

.ergotable .buttons_row .filtering {
    background: url(images/ergosearch2.png);
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
}

.ergotable .buttons_row .clear_filters {
    background: url(images/clean.png);
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
}

.ergotable .buttons_row .change_columns {
    background: url(images/cross.png);
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
}

#change_columns .sortable {
    list-style-type: none;
    margin: 0;
    float: left;
    margin-right: 10px;
    background: #eee;
    padding: 5px;
    box-sizing: border-box;
}

#change_columns .sortable li {
    margin: 0px;
    padding: 5px;
    font-size: 14px;
    width: 100%;
    box-sizing: border-box;
}

#change_columns {
    width:100% !important;
    max-width: 550px;
    overflow-x: hidden;
    text-align:center;
    box-sizing: border-box;
}

div.hidden_columns {
    width: calc(50% - 10px);
    float: left;
    margin-right: 20px;
}

div.shown_columns {
    width: calc(50% - 10px);
    float: left;
}

.hidden_columns.sortable {
    min-height: 100%;
    width: 100%;
}

.shown_columns.sortable {
    min-height: 100%;
    width: 100%;
}

.sortable li {
    cursor: pointer;
}

#accept_column_change {
    margin-top:15px;
}

.ergotable .resizable {
    width: 6px;
    cursor: col-resize;
    position: relative;
    height: 28px;
    margin: 0px;
    float: right;
        /*border-right: 1px solid lightgrey;*/
}
/*grey color per even line*/
.ergotable tr:nth-child(even) {
    /*background-color: #f5f5f5*/
}

.ergotable tbody tr:hover {
   background-color:  rgba(220,220,220,0.71);

}

.ergotable .button.form_grid_add{
    width: auto;
    cursor: pointer;
}

.ergotable .button.form_grid_add:hover{
    text-decoration: underline;
}

.ergotable .button.form_grid_add tr:hover{
    background-color: initial;
}
.ergotable .button.form_grid_add .img{
	background-image: url(images/appIcons/buttons/add.png);
    background-repeat: no-repeat;
    margin: 0;
    padding: 0;
    width: 20px;
    height: 20px;
    background-size: contain;
}

.ergotable .button.form_grid_add .text{
	margin: 0px;
    line-height: 21px;
}

/* ------------------------------------------------------- */
/* ----------- Ergotable Actions Formatter styles -------- */
/* ------------------------------------------------------- */
.ergoActions {
    position: relative;
}

.ergoBtnsMenu {
    position: absolute;
    top: 0px;
    left: 64px;
    width: auto;
    z-index: 1;
    margin: 0;
    padding: 4px;
    background-color: #fff;
    border-radius: 5px;
    background-color: #EEF6FC;
}

.ergoBtns {
    margin: 0;
    padding: 0;
    min-width: 180px;
    word-wrap: break-word;
    list-style: none;
}

.ergoBtns span {
    padding-right: 6px;
}

.ergoBtns li {
    padding: 4px;
    border-bottom: 1px dotted rgba(0,0,0,0.1);
}

.ergoBtns li:hover {
    background-color: rgba(255,228,225,0.31);
    -webkit-box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.2);
    box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.2);
}

.ergoBtnsHidden {
    display: none;
}

.ergoTitle{
    padding-left:5px;
}

.ergoTitleButton{
    width: 100%; 
    /*justify-content: space-between;*/
    position: relative;
    top: 38px;
    margin-top: 10px;
    display: flex;
    flex-direction: row;
}

.ergoTitleFilterButtons{
    width: 92%;
    position: relative;
    top: 38px;
    margin-top: 8px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

    


/* .ergoBtns span {
    width: 25%;
    padding: 4px;
} */

/* .ergoBtns span:hover {
    color: rgba(238,130,238,1);
} */

/*********************************************************************************************/
/* Scrollbar ***********************************************************************************/
/*********************************************************************************************/
::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
	background: #808080;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}

.ergotable .hidden_scrt{
	display:none;
}
/* ----------- */

.buttons_row .ms-ctn {
    height: 98%;
    max-height: 30px;
}

.buttons_row .form-control {
    background-color: transparent;
    border: none;
    border-bottom: 1px dotted rgba(0,0,0,0.2);
    background-color: snow;
}

.buttons_row .ms-ctn input {
    background-color: transparent;
    height: auto;
    border: none;
}

.buttons_row .ms-ctn input:focus {
    box-shadow: none; 
}

.buttons_row .ms-ctn-focus {
    border: 1px solid rgb(139,0,139);
    box-shadow: 0px 0px 4px 2px rgba(174,188,245,0.2);
}

.buttons_row .ms-trigger {
    border: none;
    width: 24px;
}

.buttons_row .ms-trigger:hover {
    border: none;
    width: 24px;
    right: 0;
    border: none;
    background-color: transparent;
}

.buttons_row .ms-res-ctn.dropdown-menu {
    background-color: snow;
}

.buttons_row .table_title{
	float: left;
    line-height: 37px;
    font-weight: bold;
    font-size: 14px;
    padding-left: 14px;
}

/* Appendend row styles in buttons_row */
.inlineBtnsContainer {
    display: flex; 
    flex-direction: row; 
    align-items: flex-end;
}

.inlineBtnCheckbox {
    width: 12%; 
    text-align: center;
}

.inlineBtnMs {
    width: 70%; 
    height: 30px; 
    margin-left: 5px;
}

.inlineTitleBtnContainer {
    display: flex; 
    flex-direction: row; 
    justify-content: space-between;
	height: 37px;
    padding-top: 4px;
}

.inlineTitle {
    padding: 5px 10px;
    line-height: 26px;
    font-weight: 700;
    font-size: 1.1em;
    letter-spacing: 1px;
}

/*********************************************************************************************/
/* plugins ***********************************************************************************/
/*********************************************************************************************/
.datatable .uploadsBtn{
	background:url(images/appIcons/paperclip.png);
    background-repeat: no-repeat;
    background-size: contain;
	width: 25px;
    height: 25px;
    float: right;
    cursor: pointer;
}

.datatable .notesBtn{
	background:url(images/appIcons/buttons/note.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 25px;
    height: 25px;
    float: right;
    cursor: pointer;
}
.datatable .notesValue, .datatable .uploadsValue{
	width: 100%;
}
.datatable .notesValue p{
    margin: auto;
}