#notify-icon { position:relative; }
#notify-counter { line-height:10px; background:#ba2626; color:#fff; position:absolute; top:-0.25em; right:-0.25em; padding:0.25em; border-radius:0.4em; font-weight:bold; white-space:nowrap; }
#notify-counter[data-count="0"] { display: none; }
#notify-list { background:#fff; position:fixed; top:3.5em; right:6em; width:24em; box-shadow:0 0 10px #000; overflow:hidden; z-index:100; display:none; bottom:auto; }
#notify-list.full-height { bottom:16px; overflow:auto; }
#notify-list, #notify-list .notification:last-child { border-radius:0 0 1em 1em; }
#notify-list #notify-loading { position:absolute; z-index:200; background:url('%appswebroot%/notify/img/ajax-loader.gif') no-repeat center center #fff; opacity:0.8; top:0; left:0; right:0; bottom:0; margin:0; padding:0; display:none; }
#notify-list #notify-headline span#notify-title { font-weight:bold; }
#notify-list #notify-headline div.actionicons { float:right; position:relative; height:16px; }
#notify-list #notify-headline div.actionicons * { width:16px; height:16px; background-repeat:no-repeat; text-indent:-9000px; position:relative; float:left; opacity:0.5; margin:0.2em; }
#notify-list #notify-headline div.actionicons *:hover { opacity:1; }
#notify-config { background-image:url('%webroot%/core/img/actions/settings.svg'); }
.notify-autorefresh.start { background-image:url('%webroot%/core/img/actions/play.svg'); }
.notify-autorefresh.stop { display:none; background-image:url('%webroot%/core/img/actions/pause.svg'); }
#notify-list.autorefresh .notify-autorefresh.start { display:none; }
#notify-list.autorefresh .notify-autorefresh.stop { display:inline-block; }
#notify-refresh { background-image:url('%webroot%/core/img/actions/history.svg'); }
#notify-readall { background-image:url('%appswebroot%/notify/img/readicons.svg'); background-position:-16px 0; }
#notify-deleteread { background-image:url('%webroot%/core/img/actions/delete.svg'); }
#notify-list .notification { margin:0.25em; display:block; position:relative; }
#notify-list .notification .content { display:inline-block; width:19em; padding:0.5em; line-height:1.8em; }
#notify-list .notification div.actionicons { width:16px; height:16px; float:right; position:relative; padding:0; visibility:hidden; }
#notify-list .notification:hover div.actionicons { visibility:visible; }
#notify-list .notification div.actionicons span { width:16px; height:16px; background-size:cover; background-repeat:no-repeat; position:absolute; left:0; text-indent:-9000px; }
#notify-list .notification span.deleteicon { top:0; background-image:url('%webroot%/core/img/actions/delete.svg'); }
/*
#notify-list .notification span.readicon { top:0; background-image:url('%appswebroot%/notify/img/readicons.svg'); }
#notify-list .notification span.readicon.unread, #notify-list .notification span.readicon.read:hover { background-position:left 0; }
#notify-list .notification span.readicon.read, #notify-list .notification span.readicon.unread:hover { background-position:right 0; }
*/
/* unread notifications: */
#notify-list .notification[data-read="0"] { background: #7995BD; }
#notify-list .notification[data-read="0"]:hover { background: #95A8C7; }
#notify-list .notification[data-read="0"] .readicon.read { display:none; }
/* read notifications: */
/*#notify-list .notification[data-read="1"] { background: #afa; }*/
#notify-list .notification[data-read="1"]:hover { background: #ddd; }
#notify-list .notification[data-read="1"] .readicon.unread { display:none; }