.nav-container {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: space-between;
  margin-top: 10px;
}

 a {
  flex: 1 1 calc(25% - 6px); /* 4 tombol per baris, dikurangi gap */
  text-align: center;
  background-color: #f06292; /* default pink */
  color: white;
  font-weight: bold;
  padding: 6px 4px;
  border-radius: 6px;
  font-size: 13px;
  text-decoration: none;
  transition: background-color 0.2s;
  border: 2px solid black; /* ✅ border added */
}

.nav-container a:nth-child(2) {
  background-color: #e53935; /* red */
}

.nav-container a:nth-child(3) {
  background-color: #1e88e5; /* blue */
}

.nav-container a:nth-child(4) {
  background-color: #8e24aa; /* purple */
}

.nav-container a:hover {
  opacity: 0.9;
}




.bold-text{
	font-weight: bold;
}

.card-image img {
      height: 200px; 
      object-fit: cover;
    }
    .bold-text {
      font-weight: bold;
    }
    
.titlebar{
	margin-top:0px;
	padding: 3px;
	text-align: center;
	font-weight: bold;
	background-color: #ff80ab;
	color: black;
}
.row .col{
	margin:0px;
	padding: 0px;
}



.source_server{
	padding:2px;
	font-size:10px;
	background-color: black;
	color: white;
}