.view[name='notifications'] {
    background-color: #1b1b1b;
}
.view[name='notifications'] > .statusBar {
    background-color: #f8f8f8;
}
.view[name='notifications'] > .header {
    border-bottom: 1px solid #272727;
}
.view[name='notifications'] > .header > .center > div,
.view[name='notifications'] > .content > .tableWrapper > .fTable > .content > table > tbody > tr > td {
    color: #ffffff;
}
.view[name='notifications'] > .content > .tableWrapper > .fTable > .content > table > tbody > tr > td:not([colspan]) {
    background-color: #151515;
}
.view[name='notifications'] > .content > .tableWrapper > .fTable > .content > table > tbody > tr > td:not([colspan]):not(.seen) {
    border-left: 3px solid #0373f3;
}
.view[name='notifications'] > .content > .tableWrapper > .fTable > .content > table > tbody > tr > td:not([colspan]):not(.seen) > .dot {
    background-color: #0373f3;
}
.view[name='notifications'] > .content > .tableWrapper > .fTable > .content > table > tbody > tr > td:not([colspan]) > .createdAt {
    color: #aeaeae;
}

@media (min-width: 800px) {
    .view[name='notifications'] {
        box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.2);
    }
}