@font-face {
    font-family: 'Poppins';
    src: url('fonts/Poppins-Regular.ttf') format('truetype');
}

.artikel-container { font-family: "Poppins", serif;
    width: 100vw; /* Gunakan seluruh lebar layar */
    display: flex;
    flex-wrap: wrap; /* Agar tetap responsif */
    justify-content: flex-start; /* Supaya artikel tetap menempel */
    align-items: center;
    padding: 0;
    background: #f9f9f9;
    gap: 0; /* Hilangkan gap bawaan agar tidak menyebabkan turun */
    margin: 0;
    margin-top:20px; 
}

.artikel { font-family: "Poppins", serif;
    display: flex;
    align-items: flex-start; /* Posisikan teks di atas */
    flex-basis: calc(25% - 5px);
    height: 85px;
     padding: 5px;
    box-sizing: border-box;
    border: 1px solid #ddd;
     margin-right: 5px;
}

.artikel img { font-family: "Poppins", serif;
    width: 70px;
    height: 70px;
    object-fit: cover;
    margin-right: 10px;
}

.artikel div {
    display: flex;
    flex-direction: column; /* Menyusun teks secara vertikal */
    justify-content: flex-start; /* Pastikan teks berada di atas */
}

.artikel h3 { 
    font-family: "Poppins", serif !important; 
    font-size: 13px;
    font-weight:600;
    margin: 0;
    color: #333;
}

.artikel a { font-family: "Poppins", serif;
    text-decoration: none; /* Menghilangkan underline */
    color: inherit; /* Menggunakan warna dari elemen induk */
}

.artikel a h3 { 
    font-family: "Poppins", serif !important; 
    font-size: 13px;
    font-weight: 600;
    margin: 0;
    color: inherit; /* Menggunakan warna dari elemen induk */
}

@media (max-width: 768px) {
    .artikel-container { font-family: "Poppins", serif;
        display: none;
    }
}