/* Algemene stijl voor de body */
body {
    font-family: Arial, sans-serif; /* Lettertype */
    color: #ffffff; /* Tekstkleur */
    background-image: url(../img/galaxy.jpg);
    background-size: cover;
    background-attachment: fixed;
    color: rgb(0, 0, 0);
    margin: 0; /* Geen standaard marge */
    padding: 0; /* Geen standaard opvulling */
}

/* Container voor de hoofdinhoud */
.container {
    margin-top: 20px; /* Ruimte bovenaan */
    
}

/* Tabelstijl */
.table {
    margin-bottom: 20px; /* Ruimte onder elke tabel */
    background-color: rgba(255, 255, 255, 0.8);
    border: 1px solid #ced4da; /* Lichte rand */
    border-radius: 10px; /* Afgeronde hoeken */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Schaduw voor diepte */
}

/* Tabelkopstijl */
.table thead th {
    background-color: #007bff; /* Achtergrondkleur voor de kop */
    color: white; /* Witte tekstkleur voor de kop */
}

/* Hoofdlettergrootte voor koppen */
h5 {
    font-size: 1.25rem; /* Grotere tekst voor koppen */
    color: #ffffff; /* Donkere kleur voor koppen */
}

/* Pagina stijlen */
.pagination {
    justify-content: center; /* Centreren van de paginering */
}

.pagination .page-link {
    border: 1px solid #007bff; /* Randkleur van de pagina links */
    color: #007bff; /* Kleur van de pagina links */
}

.pagination .page-link:hover {
    background-color: #007bff; /* Achtergrondkleur bij hover */
    color: white; /* Witte tekstkleur bij hover */
}

.pagination .page-item.active .page-link {
    background-color: #007bff; /* Actieve pagina achtergrondkleur */
    color: white; /* Witte tekstkleur voor actieve pagina */
}

/* Responsieve kolommen */
@media (max-width: 768px) {
    .col-md-6, .col-md-3 {
        width: 100%; /* Volledige breedte voor kleine schermen */
    }
}

/* Styling voor de zoekvelden */
input[type="text"] {
    width: 100%; /* Volledige breedte van de zoekvelden */
    padding: 10px; /* Opvulling binnen de zoekvelden */
    margin-bottom: 10px; /* Ruimte onder de zoekvelden */
    border: 1px solid #ced4da; /* Randkleur voor zoekvelden */
    border-radius: 5px; /* Afgeronde hoeken voor zoekvelden */
}

input[type="text"]:focus {
    border-color: #007bff; /* Randkleur bij focus */
    outline: none; /* Geen standaard focus outline */
}