/* palette 

#50a0do: light blue
#003466: dark blue



*/

.top-bar { 
  background: #003466 !important;
}
.contain-to-grid { background: #003466; }
.top-bar ul li a { color: #fff; background: #003466 !important; }

ul.title-area li.name {
  background: #003566;
}

.top-bar-section ul li.active > a { background: #50A0D0 !important; }
.top-bar-section ul li.active > a:hover { color: #fff !important; background:#50A0D0 !important; }
.top-bar-section li a:not(.button):hover { color: white; background:#50A0D0 !important; }

.top-bar-section ul li.selected > a { background: #50A0D0 !important; }


/* sub menu */
/* .top-bar ul li a ul li a{ color: #fff; background: rgba (0, 52, 102, 0.4) !important; } */
ul.dropdown li { color: #fff; background: rgba (0, 52, 102, 0.4) !important; }
ul.dropdown li { color: #fff; background: #777 !important; }
.top-bar ul li ul li { color: #fff; background: #777 !important; }

@media only screen and (min-width:44.063em) {
  .top-bar ul li a { 
    font-size: 0.7em !important;
  }

}


@media only screen and (min-width:48.063em) {
  .top-bar { background: transparent !important; }
  .contain-to-grid { background: transparent; }
  .top-bar ul li a { 
    color: #fff; 
    background: rgba (0, 52, 102, 0.3) !important; 
    font-size: 0.7em !important;
  }

  .top-bar-section ul.left { margin-left: 200px;  }

  /* sub menu */
  /* .top-bar ul li a ul li a{ color: #fff; background: rgba (0, 52, 102, 0.4) !important; } */
  ul.dropdown li { color: #fff; background: rgba (0, 52, 102, 0.4) !important; }
  ul.dropdown li { color: #fff; background: #777 !important; }
  .top-bar ul li ul li { color: #fff; background: #777 !important; }

}

@media only screen and (min-width:52.063em) {
  .top-bar ul li a { 
    font-size: 0.8em !important;
  }

}