#notificationCollapse > .tooltip.top {
    left: 20px!important;
}

.notificationPanel {
    position: fixed;
    top: 0px;
    right: 0px;
    width: 470px;
    z-index: 190;
    box-shadow: 0 5px 15px rgba(0,0,0,.5);
}

    .notificationPanel.notificationPanelClosed {
        right: -475px;
    }


    .notificationPanel li {
        display: block;
        width: 100%;
        height: 75px;
        padding: 10px 20px;
        position: relative;
        background-color: #fff;
        border-left: none;
        border-bottom: none;
        z-index: 100;
    }

    .notificationPanel ul li i.fa.fileType {
        float: left;
        font-size: 29px;
        margin-top: 4px;
        margin-right: 15px;
    }

li.fileNotReady {
    background: #fad4d8;
    left: 0px;
}

li.fileError {
    background: #f4cf9b;
    left: 0px;
}

.notificationHeader {
    height: 102px!important;
    background-image: linear-gradient(to bottom, #000 0px, #000 100%) !important;
}

.notificationTitle {
    font-family: Franklin Gothic Book, Arial, sans-serif;
    font-size: 16px;
    color: #7b7b7b;
    margin-left: 43px;
    line-height: 18px;
}


.notificationPanel ul li button.btn.btn-xs {
    float: right;
    margin-top: -65px;
    font-size: 15px;
    margin-right: 35px;
}

    .notificationPanel ul li button.btn.btn-xs.trash {
        float: right;
        margin-top: -65px;
        font-size: 15px;
        margin-right: -10px;
        width: 30px;
    }

    .notificationPanel ul li button.btn.btn-xs.btn-primary i.fa {
        color: #fff;
    }

.truncate {
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
    width: 255px;
}

.notificationPanel > .panel {
    border: 0;
}



.notificationPanelHeaderText > a {
    color: #fff;
    text-decoration: none;
    font-family: Franklin Gothic Book, Arial, sans-serif;
    font-size: 31px;
    line-height: 32px;
    letter-spacing: -0.46px;
    margin-left: 0;
    margin-top: 12px;
}

.panel-title.notificationPanelHeaderText {
    font-family: Franklin Gothic Book, Arial, sans-serif;
    font-size: 23px;
    text-align: center;
    line-height: 22px;
    letter-spacing: -0.46px;
    margin-left: 0;
    margin-top: 12px;
    padding-right: 45px;
}


.notificationPanel .panel-group .panel-heading + .panel-collapse > .panel-body, .panel-group .panel-heading + .panel-collapse > .list-group {
    border: 0;
}

.list-group i.fa.fa-files-o,
.list-group i.fa.fa-file-pdf-o,
.list-group i.fa.fa-file-word-o,
.list-group i.fa.fa-file-excel-o,
.list-group i.fa.fa-file-image-o,
.list-group i.fa.fa-file-video-o {
    color: #8F7237;
    cursor: pointer;
}


li.adminScrollBar {
    height: 60px;
    padding: 2px;
    background-color: #103184;
    text-align: center;
    color: #103184;
}

.scrollBarIcon {
    margin-top: 0;
}

.notificationHeader > .btn.btn-primary {
    float: right;
    margin-top: -75px;
}

button.panelClose {
    -webkit-appearance: none;
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: 0;
}

.panelClose {
    float: left;
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-shadow: 0 1px 0 #fff;
    filter: alpha(opacity=20);
    opacity: 1;
}

.notificationAlert {
    cursor: pointer;
}

@-webkit-keyframes badge {
    0% {
        background-color: #000;
    }

    50% {
        background-color: #8F7237;
    }

    100% {
        background-color: #000;
    }
}

@keyframes badge {
    0% {
        background-color: #000;
    }

    50% {
        background-color: #8F7237;
    }

    100% {
        background-color: #000;
    }
}

.notificationBadge {
    position: relative;
    width: 60px;
    height: 60px;
    position: fixed;
    right: -2px;
    top: 243px;
    background-color: #000;
    border-left: 2px solid #8F7237;
    border-right: 2px solid #8F7237;
    border-top: 2px solid #8F7237;
    z-index: 255;
    box-shadow: 0 5px 15px rgba(0,0,0,.5);
    -o-box-shadow: 0 5px 15px rgba(0,0,0,.5);
    -webkit-box-shadow: 0 5px 15px rgba(0,0,0,.5);
    -moz-box-shadow: 0 5px 15px rgba(0,0,0,.5);
}

.notificationBadge-animate {
    -webkit-animation: badge 4s infinite;
    -moz-animation: badge 4s infinite;
    -ms-animation: badge 4s infinite;
    -o-animation: badge 4s infinite;
}

    .notificationBadge:before {
        position: absolute;
        font-family: FontAwesome;
        top: -5px;
        left: 9px;
        content: "\f0f6";
        color: #fff;
        font-size: 44px;
        opacity: 0.4;
        -webkit-transform: rotate(-10deg);
        /* Firefox */
        -moz-transform: rotate(-10deg);
        /* IE */
        -ms-transform: rotate(-10deg);
        /* Opera */
        -o-transform: rotate(-10deg);
    }

.notificationUnread {
    height: 47px;
    background: #fff;
    width: 60px;
    right: -2px;
    top: 57px;
    position: absolute;
    border-bottom: 2px #8F7237 solid;
    border-left: 2px #8F7237 solid;
    border-right: 2px #8F7237 solid;
    box-shadow: 0 5px 15px rgba(0,0,0,.2);
    -webkit-box-shadow: 0 5px 15px rgba(0,0,0,.2);
    -moz-box-shadow: 0 5px 15px rgba(0,0,0,.2);
    -o-box-shadow: 0 5px 15px rgba(0,0,0,.2);
}

    .notificationUnread p {
        font-family: Franklin Gothic;
        color: #7b7b7b;
        font-size: 12px;
        letter-spacing: -1px;
        text-align: center;
        margin-top: -23px;
        line-height: 9px;
    }

    .notificationUnread h3 {
        text-align: center;
        font-family: Franklin Gothic Demi Cond;
        color: #7b7b7b;
    }

    li.adminScrollBar {
    height: 60px;
    width: 100%;
    padding: 2px;
    background-color: #000;
    text-align: center;
    color: #000;
}

#notificationCollapse .adminScrollBar nav {
    margin-top: 9px;
}

#notificationCollapse .adminScrollBar nav ul {
    display: table;
    margin: 0 auto;
}

#notificationCollapse .adminScrollBar nav ul li {
    display: inline;
    background-color: #000;
    padding: 0;
}