/* General Styling */
body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    background-color: #f4f4f4;
}

/* Header Styling */
.header {
    color: blue; /* Màu chữ đỏ */
    padding: 20px 0;
    text-align: center;
    position: relative; /* Required for positioning the marquee */
    overflow: hidden; /* Hide the overflow text */
}

.marquee {
    position: absolute; /* Position the marquee at the top */
    top: 0;
    left: 0;
    width: 100%;
    white-space: nowrap;
    animation: marquee 30s linear infinite; /* Tăng thời gian từ 10s lên 30s */
}

.marquee p {
    font-size: 1.5em;
    margin: 0;
}

/* Define the animation */
@keyframes marquee {
    0% {
        transform: translateX(100%); /* Start from the right */
    }
    100% {
        transform: translateX(-100%); /* Move to the left */
    }
}