.top-toolbar-wrapper {
  position: relative;
  .top-toolbar {
    padding: 0;
    right: 0;
    top: 25px;
    position: absolute;
    z-index: 5;
    ul {
      margin: 0 0 0 auto;
      flex-direction: row;

      li {
        list-style: none;
        min-width: 4.0625rem;

        > a {
          text-align: center;
          min-width: 3.9375rem;
          display: inline-block;
          position: relative;
          padding: 0;

          > i {
            font-size: 1.3rem;
            position: relative;
          }

          > i:before {
            vertical-align: middle;
          }

          &.user-avatar {
            margin-top: -3px;
          }
        }
      }
    }
    .navbar-nav .nav-item>a:hover i.icon:after {
      content: "";
      position: absolute;
      height: 40px;
      width: 40px;
      border-radius: 50%;
      left: -9px;
      top: -4px;
      z-index: -1;
    }
    .dropdown-menu {
      box-shadow: 0 0 15px 1px rgba(174,197,231,.3);
      top: 110%!important;
      &.dropdown-menu-right {
        right: -40px!important;
      }
    }

    .card.card-notification .card-body {
      overflow: hidden;
      padding: 13px;

      .card-container-wrapper .card-container {
        width: 300px;
      }
    }

    .actions.top-right {
      right: 0;
      top: 6px;
    }
  }
}
@media(max-width:992px) {
  .top-toolbar-wrapper {
    .top-toolbar {
      position: fixed;
      width: 100%;
      top: 0;
      left: 0;
      right: 0;
      background: #fff;
      height: 65px;
      margin: 0;
      z-index: 0;
      transition: all 300ms ease;
      display: none;

      ul li > a > i {
        font-size: 1.5rem;
        position: relative;
      }
      @include media-breakpoint-down(xs) {
        li.show {
          position: static;

          .dropdown-menu {
            min-width: 320px;
            max-width: 320px;
            left: auto!important;
            right: 20px!important;
            width: 320px;
            top: 65px!important;
          }
        }
      }
    }
  }

  body.mobile-topbar-toggle {
    .top-toolbar {
      top: 65px;
      z-index: 99;
      box-shadow: 0 1px 1px 1px rgba(18,106,211,.08);
      display: flex;
    }

    .content-wrapper {
      .content {
        margin-top: 130px;
      }
    }
  }
}