.navbar {
  z-index: 1; // required to make the shadow overlap the below content (need is visible in mobile drawer overlay)
  border: 0;
  border-radius: 0;
  @include box-shadow($bmd-shadow-2dp);

  // give correct size to ripple container
  .navbar-brand {
    position: relative;
  }

  // #853 start - https://github.com/twbs/bootstrap/pull/18976/files
  @if $enable-flex {
    display: flex;
    flex-flow: row nowrap;
    flex-shrink: 0;
    align-items: center;
    align-self: stretch;

    > * {
      flex-shrink: 0;
    }
  } @else {
    @include clearfix;
  }
  // #853 end - https://github.com/twbs/bootstrap/pull/18976/files

  > .container {
    flex: 1;
  }
}