/* Mengatur margin dan padding bawaan pada elemen */
body {
    margin: 0;
    padding: 0;
    background-color: #ffffff;

}

table {
    width: 100%;
    text-align: center;
    background-image: url('../../../assets/../Gambar/bgcarta.png');
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
}

td {
    padding: 10px;
    border: none; /* Menghapuskan garis sempadan pada td */
}

.person img {
    width: 230px;
    height: 230px;
    border-radius: 50%;
    margin-bottom: 5px;
}

.position {
    font-weight: bold;
    color: white;
    font-size: 12px;
}

.name {
    color: white;
    font-size: 11.2px;
}

/* Memberikan jarak antara baris */
tr:not(:last-child) {
    margin-bottom: 20px;
}

/* Menambahkan ruang atas dan bawah pada elemen h2 dalam class "pengenalan" */
.carta h2 {
    margin-top: 10px; /* Menambahkan 10px margin atas */
    margin-bottom: 5px; /* Menambahkan 20px margin bawah */
    background-color: #676363;
    color: white;
    padding: 10px 20px;
    border-radius: 5px;
    text-align: center;
}

/* Menambahkan ruang atas pada elemen p (paragraf) dalam class "pengenalan" */
.carta p {
    margin-top: 15px; /* Menambahkan 15px margin atas */
    text-align: justify;
}

/* Menambahkan ruang kiri dan kanan pada elemen dengan class "pengenalan" */
.carta {
    margin-left: 10px; /* Menambahkan 10px margin kiri */
    margin-right: 10px; /* Menambahkan 10px margin kanan */
}

/* Gaya untuk daftar dalam class "pengenalan" */
.carta ul {
    list-style-type: disc; /* Jenis marker daftar */
    margin-left: 20px; /* Ruang kiri */
}

/* Gaya untuk elemen daftar dalam daftar tak teratur dalam class "pengenalan" */
.carta ul ul {
    list-style-type: circle; /* Jenis marker daftar dalam daftar */
    margin-left: 200px; /* Ruang kiri */
}

/* Gaya untuk angka dalam daftar teratur dalam class "pengenalan" */
.carta ol {
    list-style-type: decimal; /* Jenis marker daftar teratur */
    margin-left: 20px; /* Ruang kiri */
}

    /* Responsif CSS untuk layar berukuran lebih kecil (misalnya, tablet dan ponsel) dalam class "pengenalan" */
    @media (max-width: 768px) {
        .carta h2 {
            font-size: 18px; /* Mengurangi ukuran font untuk layar kecil */
        }

        .carta p {
            font-size: 10px; /* Mengurangi ukuran font untuk layar kecil */
        }

        .carta ul, .carta ol {
            margin-left: 10px; /* Mengurangi margin kiri untuk layar kecil */
        }
        table {
            text-align: center;
            background-image: url('../../../assets/../Gambar/bgcarta.png');
            box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
        }
        .person img {
            width: 80px;
            height:80px;
            border-radius: 50%;
            margin-bottom: 5px;
        }
        .position {
            font-weight: bold;
            color: white;
            font-size: 6px;
        }

        .name {
            color: white;
            font-size: 6px;
        }
    }