.table {
    margin: auto;
    font-family: "Arial";
    font-size: 12px;
 
}
.table {
    border-collapse: collapse;
    font-size: 13px;
}
.table th, 
.table td {
    border-bottom: 1px solid #cccccc;
    border-left: 1px solid #cccccc;
    padding: 9px 21px;
}
.table th, 
.table td:last-child {
    border-right: 1px solid #cccccc;
}
.table td:first-child {
    border-top: 1px solid #cccccc;
}
caption {
    caption-side: top;
    margin-bottom: 10px;
    font-size: 16px;
}
 
/* Table Header */
.table thead th {
    background-color: #2ECD71;
    color: #FFFFFF;
}
 
/* Table Body */
.table tbody td {
    color: #353535;
}
.table tbody tr:nth-child(odd) td {
    background-color: #f5fff9;
}
.table tbody tr:hover th,
.table tbody tr:hover td {
    background-color: #f0f0f0;
    transition: all .2s;
}
 
/*Tabel Responsive 1*/
.table-container {
    overflow: auto;
}

		.judul {
			position: absolute;
			right: 20px;
			top: 20px;
			z-index: 2;
			color: #000f;
		}

		.logo {
			position: absolute;
			left: 20px;
			top: 20px;
			z-index: 2;
			color: #000;
			-webkit-filter: drop-shadow(5px 5px 5px #222);
			filter: drop-shadow(5px 5px 5px #222);
		}

		.candy {
			position: absolute;
			left: 10px;
			top: 90%;
			z-index: 3;
			color: #000;
			-webkit-filter: drop-shadow(5px 5px 5px #222);
			filter: drop-shadow(5px 5px 5px #222);
			opacity: 0.4;
			filter: alpha(opacity=40);
		}

		.candy:hover {
			opacity: 1.0;
			filter: alpha(opacity=100);
		}

		.wrap-login100-form-btn {
			display: block;
			position: relative;
			z-index: 1;
			border-radius: 1px;
			overflow: hidden;
		}