body { font-family: Arial, sans-serif; background: #f4f4f4; padding: 20px; }
        table { border-collapse: collapse; width: 100%; background: #fff; box-shadow: 0 0 10px rgba(0,0,0,0.1);}
        th, td { border: 1px solid #ddd; padding: 8px; text-align: center;}
        th { background-color: #007acc; color: white; }
        tr:nth-child(even){background-color: #f2f2f2;}
		
		.sr-only {position: absolute;}
		table.sortable th {
		  font-weight: bold;
		  border-bottom: thin solid #888;
		  position: relative;
		}
		table.sortable th button {
		  font-size: 100%;
		  font-weight: bold;
		  background: transparent;
		  border: none;
		  display: inline;
		  right: 0;
		  left: 0;
		  top: 0;
		  bottom: 0;
		  width: 100%;
		  outline: none;
		  cursor: pointer;
		  color: inherit;
		}
		table.sortable th button span {
		  position: absolute;
		  right: 4px;
		}
		table.sortable th[aria-sort="descending"] span::after {
		  content: "";
		  color: currentcolor;
		  font-size: 100%;
		  top: 0;
		}
		table.sortable th[aria-sort="ascending"] span::after {
		  content: "";
		  color: currentcolor;
		  font-size: 100%;
		  top: 0;
		}
		table.show-unsorted-icon th:not([aria-sort]) button span::after {
		  content: "";
		  color: currentcolor;
		  font-size: 100%;
		  position: relative;
		}
		table.sortable tbody tr:nth-child(odd) {
		  background-color: #ddd;
		}
		/* Focus and hover styling */
		table.sortable th:not([aria-sort]) button:focus span::after,
		table.sortable th:not([aria-sort]) button:hover span::after {
		  content: "";
		  color: currentcolor;
		  font-size: 100%;
		}
		/* Penomoran otomatis pada baris */
		.css-serial {
		  counter-reset: serial-number;  /* Atur penomoran ke 0 */
		}
		.css-serial td:first-child:before {
		  counter-increment: serial-number;  /* Kenaikan penomoran */
		  content: counter(serial-number);  /* Tampilan counter */
}