/* DataTable CSS */

/* DataTable styling header */
#table_id thead tr th {
    background-color: #DCDCDC;
    padding: 8px;
    padding-left: 12px;
    border: 0px !important;
}

/* DataTable change color of row on hover */
#table_id tbody tr:not(.child-table-row):hover {
    background-color: #f1f1f1;
}

/* DataTable styling cells in row */
#table_id tbody tr td {
    border-bottom: 1px solid #dddddd !important;
    padding: 5.5px;
    padding-left: 12px;
    padding-right: 12px;
    font-size: 15px;
}

/* DataTable styling of url link: no underline */
#table_id a {
    text-decoration: none;
}

/* DataTable pagination is by default Bootstrap 5 styling */
/* Center it like: 
<ul class="pagination justify-content-center">  
*/


/* Pagination button */
.page-link {
    color: black;
}

/* Pagination button on hover */
.page-link:hover {
    color: black;
    background-color: #DCDCDC !important;
    border: 1px solid #DCDCDC;
}

/* Pagination button when active */
.page-item.active .page-link {
    color: white;
    background-color: black !important;
    border: 1px solid black;
}


/* Mytable CSS */

.myTable {
    border-collapse: collapse;
    width: 100%;
    table-layout: auto;
}

.myTable th {
    padding: 8px;
    padding-left: 12px;
}

.myTable td {
    border-bottom: 1px solid #dddddd;
    padding: 4.75px;
    padding-left: 12px;
    padding-right: 12px;
    font-size: 15px;
}

.myTable tbody:hover {
    background-color: #f1f1f1;
}

#myTableHeader {
    background-color: #DCDCDC;
}

table th:first-child {
    border-radius: 5px 0 0 5px;
}

table th:last-child {
    border-radius: 0 5px 5px 0;
}

.MyTable {
    animation: fadeInAnimation ease 1.5s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}