.popover {
	background: #313131;
    width: 320px;
    position: absolute;
    display: none;
    opacity: 0;
    cursor: auto;
    color: black;
    -o-border-radius: 4px;
    -ms-border-radius: 4px;
    -moz-border-radius: 4px;
    -khtml-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    -o-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    -ms-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    -khtml-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    -o-transition-property: opacity;
    -ms-transition-property: opacity;
    -moz-transition-property: opacity;
    -khtml-transition-property: opacity;
    -webkit-transition-property: opacity;
    transition-property: opacity;
    -o-transition-duration: 0.25s;
    -ms-transition-duration: 0.25s;
    -moz-transition-duration: 0.25s;
    -khtml-transition-duration: 0.25s;
    -webkit-transition-duration: 0.25s;
    transition-duration: 0.25s;
    -o-transition-timing-function: linear;
    -ms-transition-timing-function: linear;
    -moz-transition-timing-function: linear;
    -khtml-transition-timing-function: linear;
    -webkit-transition-timing-function: linear;
    transition-timing-function: linear;
    z-index: 99999;
    }
.popover.active {
    opacity: 1;
    }
    .popover > .triangle {
        position: absolute;
        width: 0px;
        border-bottom: 20px solid transparent;
        border-left: 20px solid transparent;
        border-right: 20px solid transparent;
        border-top: 20px solid transparent;
        }
    .popover > .triangle.top,
    .popover > .triangle.bottom {
        background: none;
        padding: 0;
        }
    .popover > .triangle.top {
        bottom: -40px;
        border-top: 20px solid #313131;
        }
    .popover > .triangle.bottom {
        top: -38px;
        border-bottom: 20px solid #555;
        }
    .popover > .triangle.left,
    .popover > .triangle.right {
        top: 2px;
        }
    .popover > .triangle.left {
        right: -40px;
        border-left: 20px solid #313131;
        }
    .popover > .triangle.right {
        left: -40px;
        border-right: 20px solid #313131;
        }
     .popover > header,
     .popover > section {
        -o-border-radius: 4px;
        -ms-border-radius: 4px;
        -moz-border-radius: 4px;
        -khtml-border-radius: 4px;
        -webkit-border-radius: 4px;
        border-radius: 4px;
        }
    .popover > header {
        border: 1px solid #313131;
        font-size: 14px;
        font-weight: bold;
        line-height: 30px;
        margin: 0;
        padding: 3px;
        color: white;
        background-color: black;
        background: url('svg.php?stops=%23555555 0%,%23313131 100%');
        background: -o-linear-gradient(top,#555,#313131);
        background: -ms-linear-gradient(top,#555,#313131);
        background: -moz-linear-gradient(top,#555,#313131);
        background: -webkit-gradient(linear,0% 0%,0% 100%,from(#555),to(#313131));
        background: -webkit-linear-gradient(top,#555,#313131);
        background: linear-gradient(top,#555,#313131);
        -pie-background: linear-gradient(top,#555,#313131);
        -o-box-shadow: inset 0 1px 0 rgba(255,255,255,0.3);
        -ms-box-shadow: inset 0 1px 0 rgba(255,255,255,0.3);
        -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.3);
        -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.3);
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.3);
        text-align: center;
        }
    .popover > section {
        padding: 3px;
        min-width: 15em;
        overflow-x: hidden;
        overflow-y: auto;
        }
        .popover > section > .content {
            background: #FFF;
            border-radius: 3px;
            overflow: hidden;
            }
        .popover > section > .content > nav > ul {
            list-style: none;
            margin: 0;
            padding: 0;
            }
            .popover > section > .content > nav > ul > li {
                border-top: 1px solid #DDD;
                line-height: 50px;
                }
            .popover > section > .content > nav > ul > li.read {
                background: #FAFAFA;
                }
            .popover > section > .content > nav > ul > li.new {
                background: #FFFFC0;
                }
                .popover > section > .content > nav > ul > li a {
                    cursor: pointer;
                    color: #333;
                    display: block;
                    overflow: hidden;
                    padding: 0 10px;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    }
                    .popover > section > .content > nav > ul > li a span.avatar {
                        background: #CCC url(../images/navicons/111.png) center center no-repeat;
                        box-shadow: 0px 0px 3px #111;
                        display: block;
                        float: left;
                        height: 30px;
                        width: 30px;
                        margin: 10px 10px 10px 0px;
                        }
                        
.popover > section > .content > p {
	padding: 0 5px;
}