/** found navbar stuff on http://bootstrapdesigntools.com/tools/bootstrap-menu-builder/ **/
/* WARNING: Check the icon-bar colours are visible */
#nav1.navbar-default .navbar-brand {color: #777777;}  /* Grey */
#nav1.navbar-default {font-size: 12pt; background-color: black; border-width: 0px;} 
#nav1.navbar-default .navbar-nav>li>a {color: white; background-color: black;}
#nav1.navbar-default .navbar-nav>li>a:hover,
#nav1.navbar-default .navbar-nav>li>a:focus {color: white; background-color: black;}
#nav1.navbar-default .navbar-nav>.active>a,
#nav1.navbar-default .navbar-nav>.active>a:hover,
#nav1.navbar-default .navbar-nav>.active>a:focus {color: white; background-color: black;}
#nav1.navbar-default .navbar-toggle {border-color: black;}
#nav1.navbar-default .navbar-toggle:hover,
#nav1.navbar-default .navbar-toggle:focus {background-color: black;}
#nav1.navbar-default .navbar-toggle .icon-bar {background-color: white;}
#nav1.navbar-default .navbar-toggle:hover .icon-bar,
#nav1.navbar-default .navbar-toggle:focus .icon-bar {background-color: white;}
#nav1.navbar {margin: 0;}

/* https://stackoverflow.com/questions/16625972/change-color-of-bootstrap-navbar-on-hover-link */
ul.nav a:hover { color:yellow !important; }

.navbar-xs {min-height:38px; height: 38px;}
.navbar-xs .navbar-brand {padding: 0px 12px;font-size: 16px;line-height: 38px;}
.navbar-xs .navbar-nav > li > a {padding-top: 0px; padding-bottom: 0px; line-height: 38px;}

/** Hide images on mobiles (dtonly) or not (mbonly)**/
/* medium+ screen sizes */
@media (min-width:992px) {.dtonly {display:block !important;}}

/* small screen sizes */
@media (max-width: 991px)
{ .mbonly {display:block !important;}
  .dtonly {display:none !important;}
}

/** Collapse NavBar on Tablets **/
@media (max-width: 960px)
{ .navbar-header { float: none;}
   .navbar-left,.navbar-right {float: none !important;}
   .navbar-toggle {display: block;}
   .navbar-collapse {border-top: 1px solid transparent; box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);}
   .navbar-fixed-top {top: 0; border-width: 0 0 1px;}
   .navbar-collapse.collapse {display: none !important;}
   .navbar-nav {float: none !important; margin-top: 7.5px;}
   .navbar-nav>li {float: none;}
   .navbar-nav>li>a {padding-top: 10px; padding-bottom: 10px;}
   .collapse.in{display:block !important;}
}