.class: nth-child (даже) не работает?

У меня проблема с nth-child, любая идея, что не так?

HTML:

    <div class="comment">
        <div class="header">
            <div class="by">Euismod nam.</div>
        </div>
        <div class="content">
...
        </div>
        <div class="date">12-15-23</div>
    </div>
    <div class="comment">
        <div class="header">
            <div class="by">Euismod nam.</div>
        </div>
        <div class="content">
...
        </div>
        <div class="date">12-15-23</div>
    </div>

CSS:

/*--*/
.comment {
    width:600px;
    overflow:auto;
    margin:0;
    margin-top:5px;
    padding:0;
    border:solid 1px #CCC;  
    /*border-top:none;*/
}
.comment .header {
    margin:0;
    padding:1px 2px;
    overflow:auto;
    background:#B2A98A;
    color:#FFF;
}
.comment .header:nth-child(even) {
    background:#62798B;
}
.comment .header .by {
    float:right;
    z-index:90;
}
.comment .content {
    margin:0;
    padding:5px 2px;
    overflow:auto;
    background:#FeFeFe;
    color:#000;
}
.comment .date {
    margin:0;
    padding:1px 2px;
    overflow:auto;
    background:rgba(178,169,138,0.5);
    color:#FFF;
}
.comment .date:nth-child(even) {
    background:rgba(98,121,139,0.5);
}

Я не вижу проблемы в коде, или я чего-то не хватает? [JSFIDDLE]