@media screen and (min-width: 960px){
    .imgDivAr{
        width: 30%;
    }
    .DescriptAr{
        width: 70%;
    }
    article{
        width: 48%;
    }
}
@media screen and (min-width: 760px) and (max-width: 959px){
    .imgDivAr{
        width: 35%;
    }
    .DescriptAr{
        width: 65%;
    }
    article{
        width: 48%;
    }
} 
@media screen and (max-width: 759px){
    .imgDivAr{
        width: 100%;
    }
    .DescriptAr{
        width: 100%;
    }
    article{
        width: 98%;
    }
}
article{
    display: flex;
    flex-direction: column;
    margin-left: auto;
    margin-right: auto;
}
.xuatbanar{
    font-weight: bold; 
}
.timespanar{
    font-size: 13px;
    font-style: italic;
}

.containAr{
    width: 100%;
    display: flex;
    flex-direction: column;
}

.imgDivAr img{
    width: 98%;
    margin-left: auto;
    margin-right: auto;
    aspect-ratio: 5/3;
}

h3 a{
    color: black;
}

/* Cấu hình cho khung chứa chính */
.image-container {
    /* QUAN TRỌNG: Thiết lập vị trí tương đối để làm mốc cho các phần tử con tuyệt đối */
    position: relative;
    /* Đặt chiều rộng tùy ý hoặc để auto */
    width: 100%;
    max-width: 600px; /* Ví dụ giới hạn chiều rộng tối đa */
    margin: 20px auto; /* Căn giữa trang */
}

/* Cấu hình cho hình ảnh chính */
.main-image {
    width: 100%; /* Ảnh luôn chiếm 100% chiều rộng khung chứa */
    aspect-ratio: 6/4; /* Chiều cao tự động theo tỉ lệ */
    display: block; /* Loại bỏ khoảng trống nhỏ bên dưới ảnh */
}

/* Cấu hình cho hộp ngày tháng */
.date-box {
    /* QUAN TRỌNG: Thiết lập vị trí tuyệt đối để đặt nó đè lên ảnh */
    position: absolute;
    /* Định vị trí: cách đỉnh 20px, cách bên trái 20px */
    top: 20px;
    left: 20px;
    
    /* Màu nền trắng và viền xanh lá giống trong ảnh */
    background-color: #fff;
    border: 2px solid #6a8d3b; /* Mã màu xanh lá cây */
    
    /* Khoảng cách bên trong hộp */
    padding: 5px 15px;
    
    /* Căn giữa nội dung văn bản */
    text-align: center;
    
    /* Màu chữ xanh lá */
    color: #6a8d3b;
    font-family: Arial, sans-serif; /* Font chữ đơn giản */
    box-shadow: 0 2px 5px rgba(0,0,0,0.2); /* Thêm bóng nhẹ cho đẹp (tùy chọn) */
}

/* CSS cho phần Ngày (số 11) */
.date-box .day {
    display: block; /* Để nó nằm trên một dòng riêng */
    font-size: 28px; /* Kích thước chữ lớn */
    font-weight: bold; /* In đậm */
    line-height: 1; /* Giảm khoảng cách dòng */
}

/* CSS cho phần Tháng (Th9) */
.date-box .month {
    display: block; /* Để nó nằm trên một dòng riêng bên dưới ngày */
    font-size: 16px; /* Kích thước chữ nhỏ hơn */
    margin-top: 2px; /* Khoảng cách nhỏ giữa ngày và tháng */
}