.wdes-layout-full {
  --sidebar-w: 280px;

  display: flex;
  min-height: 100%;
  @media screen and (max-width: 991px) {
    flex-flow: column;
  }
  #header {
    background-color: var(--main-clr);
    width: var(--sidebar-w);
    height: 100vh;
    position: fixed;
    left: 0;
    top: 0;
    border: 0;
    z-index: 99;
    padding: 0;
    @media screen and (max-width: 991px) {
      position: static;
      width: 100%;
      height: auto;
      background-color: transparent;
      border-bottom: 1px solid #e7e7e7;
    }

    .container {
      width: 100%;
    }
    .wdes-header {
      flex-flow: column;
      justify-content: center;
      align-items: center;
      @media screen and (max-width: 991px) {
        align-items: flex-start;
        padding: 13.4px 0;
      }
      .logo {
        width: 100%;
        text-align: center;
        @media screen and (max-width: 991px) {
          text-align: left;
          width: auto;
        }
      }
      @media screen and (max-width: 991px) {
        .phox-logo--dark {
          display: flex;
        }
      }
      @media screen and (min-width: 992px) {
        .phox-logo--light {
          display: flex;
          margin: 20px auto 30px 0;
        }
      }
      section#main-menu {
        width: 100%;
        height: calc(100vh - 90px);
        overflow-y: auto;
        justify-content: flex-start;
        align-items: flex-start;
        padding-bottom: 30px;
        @media screen and (max-width: 991px) {
          height: auto;
          padding: 0;
          overflow: initial;
        }
        .navbar-main .navbar-nav {
          flex-flow: column;
        }
      }
    }
  }
  .wdes-wrap-content {
    width: calc(100% - var(--sidebar-w));
    margin-left: auto;
    @media screen and (max-width: 991px) {
      width: 100%;
      margin-left: 0;
    }
  }
  section#header .wdes-header section#main-menu .navbar-main .navbar-nav > li {
    width: 100%;
  }
  section#header
    .wdes-header
    section#main-menu
    .navbar-main
    .navbar-nav
    > li
    > a,
  section#header
    .wdes-header
    section#main-menu
    .navbar-main
    .navbar-nav
    > li
    .dropdown
    > button {
    display: flex;
    flex-flow: row;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 16px;
    line-height: 25px;
    width: 100%;
    gap: 0 10px;
    transition: all 0.3s ease-in-out;
    background-color: transparent;
    border: 0;
    padding: 0;
    justify-content: flex-start;
    @media screen and (max-width: 991px) {
      color: #666;
      margin: 10px auto 0;
      border-bottom: 1px solid #eee;
      width: 100%;
      padding: 10px 15px;
      align-items: center;
      justify-content: flex-start;
      gap: 0;
    }
    i {
      font-size: 22px;
      width: 30px;
      font-weight: 100;
      margin: 0;
      transition: all 0.3s ease-in-out;
    }
    .wdes-menu-item_content {
      word-break: break-word;
    }
    &:hover,
    &:focus {
      opacity: 0.8;
      color: white;
      @media screen and (max-width: 991px) {
        opacity: 1;
        color: #666;
      }
    }
  }
  section#header .wdes-header section#main-menu .navbar-main .navbar-nav {
    gap: 30px 0;
    text-align: left;
    align-items: flex-start;
    justify-content: center;
    &::before,
    &::after {
      display: none;
    }
  }
  .wdes-nav-menu-item_icon.fa-chevron-down {
    transform: rotate(-90deg);
    font-size: 15px !important;
    margin-left: auto !important;
    width: auto !important;
  }
  section#header
    .wdes-header
    section#main-menu
    .navbar-main
    .navbar-nav
    ul.dropdown-menu {
    width: 100%;
    @media screen and (min-width: 991px) {
      left: var(--sidebar-w);
      top: 0;
      border-radius: 0;
      position: fixed;
      height: 100%;
      max-height: 100%;
      width: 250px;
    }
    @media screen and (max-width: 991px) {
      top: 100%;
    }
  }
  section#header
    .wdes-header
    section#main-menu
    .navbar-main
    .navbar-nav
    li.wdes-menu-item-position-—right {
    margin-left: 0;
    margin-right: auto;
  }
  @media screen and (min-width: 768px) and (max-width: 1449px) {
    .wdes-wrap-content .container {
      width: 100%;
    }
  }
  // Enable Light Logo on Accounts Page
  .wdes-wrap-account {
    .logo .phox-logo.phox-logo--light {
      display: inline-block;
    }
  }
}