表格样式未应用

Question

我正在创建一个表，并在CSS上相应地设置了样式。代码有效（https://jsfiddle.net/he16Lxz9/）但是当它嵌套在手风琴中时，样式会消失（http://firebird.sheridanc.on.ca/~ixd487/hire%20brighter/co-op.html）

HTML

 <table>
                    <tr>
                        <td>Length of Internship</td>
                        <td>4, 8, 12, 16 Months</td>
                    </tr>
                    <tr>
                        <td>Paid or Unpaid</td>
                        <td>Paid</td>
                    </tr>
                    <tr>
                        <td>Weekly Commitment</td>
                        <td>Minimum 35hrs/week</td>
                    </tr>
                    <tr>
                        <td>Start Date</td>
                        <td>September, January, or May</td>
                    </tr>
                    <tr>
                        <td>Contact</td>
                        <td>Email: <a href="mailto: engcoop@mcmaster.ca"> engcoop@mcmaster.ca</a> <br> Phone: (905)-525-9140 ext. 24674</td>
                    </tr>
                </table>

CSS

table {
width: 100%;
border-collapse: collapse;
font-family: 'Barlow Semi Condensed', sans-serif;}

/* Zebra striping */

tr:nth-of-type(odd) {
background: #eee;}

th {
background: #333;
color: white;
font-weight: bold;}

td,
th {
padding: 6px;
border: 1px solid #ccc;
text-align: left;
}