
#smart-bar{
    height: 40px;
    background-color: #535353;
}
.top-header-links{
    
}
#top-links a{
    text-decoration: none;
}
#top-links li:hover a{
    color:#fff;
}
.top-header-links .micon:before, .top-header-links i.micon {
background-image:url(smart-bar-n-latest.png);
}

.pull-left{float: left;}
.pull-right{float: right;}

.clearfix:before, .clearfix:after{
        display: table;
    content: " ";
}
.clearfix:after{
     clear: both;
}
.top-header-links {padding: 5px 23px;background-color: #535353;font-family: 'Lato', Arial,sans-serif;}

.nav-brands-header {margin: 5px 0 0;list-style: none;padding: 0;}

.nav-brands-header li {padding:0 14px;/* float: left; */display: inline-block;}

.nav-brands-header li a {color: #DCDCDC;display:block;position:relative;font-size:14px;line-height: 1.4;font-size: 16px;text-decoration: none;}

.nav-brands-header li a.micon {
padding:0 0 0 38px;
}

.nav-brands-header li a.micon:before {content:'';width: 36px;height: 26px;display:block;position:absolute;left: -1px;opacity: 0.8;top: -1px;}
.nav-brands-header li:hover a.micon:before{
    opacity:1;
}
.nav-brands-header li a.active:after {content:'';width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:6px solid #FFF;position:absolute;left:16px;bottom: -8px;}

.nav-brands-header li:nth-child(1) a.active:after {
    left:10px !important;}
.nav-brands-header li:nth-child(2) a.active:after {
    left:25px !important;}
.nav-brands-header li:nth-child(3) a.active:after {
    left:10px !important;}
.nav-brands-header li:nth-child(4) a.active:after {
    left: 25px !important;}
.nav-brands-header li:nth-child(5) a.active:after {
    left:32px !important;}

.nav-brands-header li a.personal:before {background-position: 8px 1px;}
.nav-brands-header li a.xlr8:before {background-position: 2px -37px;}
.nav-brands-header li a.mobicash:before {background-position: 42px 0px;}

.nav-brands-header li a.jazz:before {background-position: -40px 2px;/* width: 41px; *//* left: -2px; */}

.nav-brands-header li a.businesses:before {background-position: -88px 0px;}

.nav-brands-header li a.foundation:before {background-position: -141px 1px;}

a.boxedbt_ntopheader {border:1px solid #fff;float:left;position:relative;color:#fff;display:none;margin-right:11px;padding:3px 20px 3px 30px;}

.boxedbt_ntopheader:hover {
background:#EE1D23;
text-decoration:none;
color:#fff;
}

.boxedbt_ntopheader:before {
content:'';
width:19px;
height:20px;
display:block;
position:absolute;
left:6px;
top:5px;
background-position:-198px -4px;
}

.socialmicons-header {/* float:left; */margin: 2px 0 0 19px;}

.socialmicons-header a {color: #FFFFFF;position:relative;margin:0 3px;padding:6px 5px;}

.socialmicons-header a span {
position:absolute;
right:-4px;
bottom:13px;
width:16px;
height:16px;
text-align:center;
font-size:11px;
border-radius:50%;
padding:3px 0 0;
}

.notifications {position:absolute;top:38px;right:0;border:1px solid #e3e3e3;width:348px;display:none;background:#fff;z-index: 90000;margin:-2px 0 0;padding:0 15px 15px;}
.notification_area{
    display: inline-block;
}
.notifications-heading {
color:#000;
font-weight:700;
border-bottom:#e3e3e3 solid 1px;
margin:0 -15px;
padding:15px;
}

.announcement-list {
list-style:none;
overflow:auto;
height:327px;
margin:0 -15px;
padding:0;
}

.announcement-list li {
display:block;
border-bottom:solid 1px #e3e3e3;
padding:10px;
}

.announcement-list a {
color:#EE1D23;
text-transform:lowercase;
font-style:italic;
font-weight:600;
padding:0;
}
#top-links .announcement-list li:hover a{
    color: #000;
}
.announcement-list .announcement-image {
width:55px;
height:56px;
border-radius:50%;
border-bottom:solid 3px #e3e3e3;
display:inline-block;
}

.announcement-list .announcement-text {
display:inline-block;
width:240px;
font-size:12px;
color:#3a3a3a;
vertical-align:top;
margin:0;
padding:5px 10px;
}

.announcement-list .announcement-text p {
margin:0 0 4px;
}

.announcement-list .announcement-date {
color:#8c8c8c;
}

.notifications a.btn {
color:#7d7d7d;
display:none;
border-color:#c2c2c2;
margin:16px 0 0;
}




@media (max-width: 867px){
    .top-header-links{
    padding: 5px 14px;
    }
    .nav-brands-header{
    display: block;
    margin: 0 0 0 0;
    }
    .jazz .nav-brands-header{
    display: block;
    margin: -35px 0 0 0;
    }
    .mobicash .nav-brands-header {
    display: block;
    margin: -69px 0 0 0;
}

    .business .nav-brands-header{
    display: block;
    margin: -102px 0 0 0;
    }
    
    .desktop-brands-outer {
        height: 39px;
        overflow: hidden;
        position: relative;
        margin: -5px;
        display: block;
        background: #535353;
        padding: 5px 0;
        z-index: 9;
        border-right: solid 1px #636363;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
}
    .desktop-brands-outer.opened-nav-brands .nav-brands-header{
        margin:0;
    }
    .nav-brands-header:before{
        content:'';
        width:100%;
        height:100%;
        position:absolute;
        z-index:1;
        left:0;
        top:0;
        display:block;
    }

    .opened-nav-brands .nav-brands-header:before{
        display:none
    }
    
    .desktop-brands-outer.opened-nav-brands{
        overflow:visible
    }
    .nav-brands-header.opened-nav-brands:before{
        display:none;

    }
    .nav-brands-header:after{
        content:'';
        width: 0;
        height: 0;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-top: 5px solid #fff;
        position: absolute;
        top: 19px;
        right: 11px;
    }

    .nav-brands-header:hover{}
    .nav-brands-header li{padding: 0;display: block;background: #535353;}
    .nav-brands-header li a{
    height: 24px;
    overflow: hidden;
    }
    .nav-brands-header li{
        padding: 5px  30px 5px 7px;
    }        
    .nav-brands-header li:first-child a{
        /* margin-top: 15px; */
    }
    .socialmicons-header{
        margin: 3px 0 0 19px;
    }
}
