Frink
You can select them individually.
That's the structure of the <li class="item-flags"> and <li class="item-notifications"> within the <ul class="Header-controls">:
<ul class="Header-controls">
<li class="item-search">
<div class="Search ">...</div>
</li>
<li class="item-flags">
<div class="ButtonGroup Dropdown dropdown NotificationsDropdown itemCount0">
<button class="Dropdown-toggle Button Button--flat" data-toggle="dropdown" title="Flagged Posts">
<i class="icon fa fa-flag Button-icon"></i>
<span class="Button-label">Flagged Posts</span>
</button>
<div class="Dropdown-menu Dropdown-menu--right"></div>
</div>
</li>
<li class="item-notifications">
<div class="ButtonGroup Dropdown dropdown NotificationsDropdown itemCount0">
<button class="Dropdown-toggle Button Button--flat" data-toggle="dropdown" title="Notifications">
<i class="icon fa fa-bell Button-icon"></i>
<span class="Button-label">Notifications</span>
</button>
<div class="Dropdown-menu Dropdown-menu--right"></div>
</div>
</li>
<li class="item-session">
<div class="ButtonGroup Dropdown dropdown SessionDropdown itemCount4">...</div>
</li>
</ul>
If you want to target one of the two <div class="ButtonGroup Dropdown dropdown NotificationsDropdown itemCount0"> elements within these <li>s (which look identical in both), you can do that by incorporating the parent element:
.item-flags .NotificationsDropdown {...}
.item-notifications .NotificationsDropdown {...}
Hope that helps.
