@charset 'UTF-8';

html > * {
    font-family: 'PingFang TC', 'Heiti TC', 'LantingHei TC', 'LiHei Pro', '微軟正黑體', 'Noto Sans TC', 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

body {
    background-color: #f8f9fa;
    color: #333;
    padding: 20px;
}

.table-responsive {
    margin-top: 20px;
}

th {
    background-color: #0d6efd;
    color: white;
    white-space: pre-wrap;
}

.table td {
    vertical-align: middle;
}
td .event-date, td .event-time {
    display: block;
}

@media (max-width: 1000px) {
    body {
        padding: 10px;
    }

    h1 {
        font-size: 1.5rem;
    }
    .table {
        border: 1px solid #a3a3a3;
    }
    table.table-rwd, .table-rwd thead, .table-rwd tbody, .table-rwd th, .table-rwd td, .table-rwd tr {
        display: block;
    }

        .table-rwd thead tr {
            display: none;
        }

    .table-rwd td {
        padding-top: 0;
        padding-bottom: 0;
        display: block;
        text-align: left !important;
    }
    .table-rwd td:not(:last-of-type) {
        border-bottom: 1px solid #a3a3a3;
    }
        .table-rwd td::before {
            content: attr(data-label)'';
            display: inline-block;
            padding: .5rem .5rem .5rem 0;
            white-space: pre-wrap;
            text-align: right;
            font-weight: bold;
            width: 30%;
        }
        .table-rwd td .event-date, .table-rwd td .event-time {
            display: inline;
        }
}