Bootstrap3/BC Menu dropdown conflict with module_photogallery

Question

I'm building a site using Bootstrap3 framework, with BC Dynamic Menu (with jQuery courtesy Joe Watkins) for main navigation.  Dropdowns (click or hover) working beautifully until I add a photogallery module, then the dropdown links disappear on click, which is a major problem on touchscreens.  I've removed all things piece-by-piece to determine the dropdown links disappear 100% of the time when a photogallery module is on the page, and work appropriately 100% of the time without a photogallery present (well, 1 exception - i'm seeing same issue on Layouts/OnlineShop/large_product.html).
Does anyone have any recommendations to fix this conflict with my Menu Nav dropdown links and the photogallery module?  Really, really appreciate any suggestions.  Unfortunately, the site nav is rendered non-functional on touchscreens due to these disappearing dropdown link conflicts (only Home and Smile Gallery links are not dropdowns).
EXAMPLES
Here are 3 examples of pages with a photogallery/dropdown conflict on click.  To test issue, click the main nav dropdown links (e.g. "Locations, Treatment, etc":
Smile Gallery
Rapid City, SD
Spearfish, SD
I'm right in the middle of transitioning this site to the responsive framework, so not all links will work. Here are 3 examples of Nav links working properly on click (no photogallery module):
Results - Before & After
Evaluation
Smile For A Lifetime
REFERENCE
I do not understand jQuery very well, I've pieced together what I could to make it all work.  Here are the 2 scripts I use to get the BC Menu to work: 
// - - - - -  Dropdown Menu v2 - JOE WATKINS.IO Dropdown Menu Toggle - - - - - - - - - - -
dropdownNavTweak : function(){
var $navContainer = $(".nav"),
  $dropdownItems = $navContainer.find("li.dropdown");
  $dropdownItems.each(function(){
  var $parentItem = $(this).find("a:first");
  $parentItem.addClass("dropdown-toggle").attr("data-toggle","dropdown").append(" <em class='icon-caret-down'></em>");
  $(this).children("ul").removeClass().addClass("dropdown-menu");
  $dropdownItems.show();  // shows dropdown images to prevent flicker - use CSS to hide " .nav li.dropdown {display:none;}" or ".navbar-nav li.dropdown {display:none;}" or  ".navbarMinor-nav li.dropdown {display:none;}"
},  // end dropdownNavTweak  (Comma needed if others follow}
... and ...
//////- -MENU- //////// 
jQuery(document).ready(function ($) {
    jQuery('.navbar .dropdown').hover(function() {
        jQuery(this).addClass('extra-nav-class').find('.dropdown-menu').first().stop(true, true).delay(200).slideDown();
    }, function() {
        var na = $(this);
        if (jQuery('.spanFloatLeftIfMobile').css('float') == "none") {
            na.find('.dropdown-menu').first().stop(true, true).delay(500).slideUp('fast', function(){ na.removeClass('extra-nav-class') })

Answer 1

Hi Matthew,
Having a super quick look at the code I'd say it's because of:
ul.dropdown li.selected a {
    color: #ff871f;
This affects all the child elements.
To override this down the line you could do something like:
ul.dropdown li.selected ul li a {
    color: #fff;
This would override the parent link color when selected.
You could probably then also add:
ul.dropdown li.selected ul li.selected a {
    color: #ff871f;
For the dropdown selected states.
That's a quick look though so don't quote me too much