.birthday-post {
    max-width: 900px;
    margin: 20px auto;
    background-color: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    overflow: hidden;
    display: flex; /* Use flexbox for layout */
}

.post-content {
    flex: 1; /* Take up remaining space */
    padding: 20px;
}

.post-content h1 {
    font-size: 30px;
    color: #791804;
    margin-bottom: 10px;
}

.post-content p {
    font-size: 16px;
    color: #666;
}

.post-image {
    position: relative; /* Positioning context for absolute positioning */
    flex: 0 0 400px; /* Fixed width for the image */
}

.post-image img {
    position: absolute; /* Position the image absolutely */
    top: 0;
    right: -100px; /* Adjust as needed for overlap */
    max-width: calc(100% + 100px); /* Ensure image overlaps correctly */
    height: auto;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
}

/* Media query for smaller screens */
@media (max-width: 768px) {
    .birthday-post {
        flex-direction: column; /* Stack items vertically */
    }

    .post-content, .post-image {
        flex: 1 1 100%; /* Full width on smaller screens */
    }

    .post-image img {
        position: relative; /* Return image to normal flow */
        right: auto; /* Reset right position */
        width: 100%; /* Full width of container */
        border-radius: 8px; /* Adjust border radius */
    }
}