ul.nav-fixed {position:fixed;top:0;width:100%;background-color:black;z-index:1000;}
.btn-dark:hover {background-color:blue;}
.btn > .bi {position: relative;width: 36px;font-size: 24px;}
.btn > .bi > .badge {font-size: 0.75rem;position: absolute;right: 0;font-family: sans-serif;}
.btn > .bi {top: 3px;line-height: 12px;}
.btn > .bi > .badge {top: -10px;}
ul.nav-fixed .dropdown-menu ul {background-color:cyan;width:400px;}
ul.nav-fixed .dropdown-menu ul li {list-style-type:none;}
@media (min-width: 576px) {
.btn-navbar {text-align: center;display: table-cell;height: 70px;vertical-align: middle;padding-top: 0;padding-bottom: 0;}
.btn > .bi {display: block;width: 48px;margin: 2px auto 4px auto;top: 0;line-height: 24px;}
.btn > .bi > .badge {top: -7px;}
}

@media (min-width: 768px) {
  .navbar-icon-top.navbar-expand-md .navbar-nav .btn-navbar {
text-align: center;display: table-cell;height: 70px;vertical-align: middle;padding-top: 0;padding-bottom: 0;}
  .navbar-icon-top.navbar-expand-md .navbar-nav .btn > .bi {display: block;width: 48px;margin: 2px auto 4px auto;top: 0;line-height: 24px;}
  .navbar-icon-top.navbar-expand-md .navbar-nav .btn > .bi > .badge {top: -7px;}
}

@media (min-width: 992px) {
  .navbar-icon-top.navbar-expand-lg .navbar-nav .btn-navbar {text-align: center;display: table-cell;height: 70px;vertical-align: middle;padding-top: 0;padding-bottom: 0;}
  .navbar-icon-top.navbar-expand-lg .navbar-nav .btn > .bi {display: block;width: 48px;margin: 2px auto 4px auto;top: 0;line-height: 24px;}
  .navbar-icon-top.navbar-expand-lg .navbar-nav .btn > .bi > .badge {top: -7px;}
}

@media (min-width: 1200px) {
  .navbar-icon-top.navbar-expand-xl .navbar-nav .btn-navbar {text-align: center;display: table-cell;height: 70px;vertical-align: middle;padding-top: 0;padding-bottom: 0;}
  .navbar-icon-top.navbar-expand-xl .navbar-nav .btn > .bi {display: block;width: 48px;margin: 2px auto 4px auto;top: 0;line-height: 24px;}
  .navbar-icon-top.navbar-expand-xl .navbar-nav .btn > .bi > .badge {top	: -7px;}
}