table.awesomeTable {
    width: 100%;
    text-align: right;
    border-collapse: collapse;
}

table.awesomeTable thead {
    margin: 0px;
    box-shadow: 1px 1px black;
}

table.awesomeTable thead tr th {
    color: #fafafa;
    padding: 10px 5px 5px 5px;
    background-color: #3a69db;
    cursor: pointer;
    outline: 0;
    user-select: none;
    /*border-right: 1px solid rgb(250,250,250) !important;
    text-align: center;*/
}


table.awesomeTable .serial {
    color: #fafafa;
    padding: 10px 5px 5px 5px;
    background-color: #3a69db;
    cursor: pointer;
    outline: 0;
    user-select: none;
    text-align: center;
}

table.awesomeTable tbody tr td {
    color: #353535;
    padding: 5px 5px 5px 5px;
}

table.awesomeTable tbody tr {
    box-shadow: inset 0px -5px 4px -6px #9E9E9E;
}

table.awesomeTable tbody tr:nth-child(even) {
    background-color: #3f51b533;
}

table.awesomeTable tbody tr:hover {
    /*background-color: #dbe836;*/
    animation: colorchange 10s; /* animation-name followed by duration in seconds*/
    /* you could also use milliseconds (ms) or something like 2.5s */
    -webkit-animation: colorchange 10s; /* Chrome and Safari */
}

.pagination {
    text-align: center;
}

 .pagination li {
    display: inline-block;
    color: black;
    /* float: left; */
    padding: 8px 16px;
    text-decoration: none;
    transition: background-color .3s;
    border: 1px solid #ddd;
}

 .pagination li a {
     text-decoration: none;
 }

 .pagination li.active a {
     color: white;
     text-decoration: none;
 }

 .pagination li.active {
     background-color: #0e47a1;
     color: white;
     border: 1px solid #0e47a1;
 }


 .pagination li:hover:not(.active) {
     background-color: #ddd;
 }

pagination li.disabled {
    background-color: #FF5722;
    color: white;
}

.pagination input {
    border: none;
    width:50px;
}

.pagination input:focus {
    outline: none;
}

.table th, .table td {
    border: 1px solid lightgray;
}

 

    @keyframes colorchange
    {
      0%   {background-color: yellow;}
      25%  {background-color: lime;}
      50%  {background-color: greenyellow;}
      75%  {background-color: lawngreen;}
      100% {background-color: yellow;}
    }

    @-webkit-keyframes colorchange /* Safari and Chrome - necessary duplicate */
    {
      0%   {background-color: yellow;}
      25%  {background-color: lime;}
      50%  {background-color: greenyellow;}
      75%  {background-color: lawngreen;}
      100% {background-color: yellow;}
    }