.user-menu {
  position: absolute;
  left: 0; }
  .user-menu .side-nav {
    max-width: 300px;
    margin: 0;
    left: 0;
    position: relative !important;
    display: inherit !important; }
    .user-menu .side-nav ul {
      padding: 0;
      margin: 0;
      border-radius: 4px;
      overflow: visible;
      list-style: none; }
      .user-menu .side-nav ul > li {
        position: relative;
        margin: 0;
        box-sizing: border-box; }
        .user-menu .side-nav ul > li .nav-link {
          display: block;
          padding: 14px 0px 14px 50px;
          color: #979FA8;
          line-height: 18px;
          text-decoration: none;
          outline: none; }
          .user-menu .side-nav ul > li .nav-link .icon, .user-menu .side-nav ul > li .nav-link i.fa, .user-menu .side-nav ul > li .nav-link i[class^=icon] {
            position: absolute;
            left: 20px; }
          .user-menu .side-nav ul > li .nav-link .words-tip {
            display: none;
            font-size: .8rem;
            position: absolute;
            width: 15em;
            background: #FFF6DE;
            left: 2em;
            padding: .6em;
            top: -.6em;
            color: #F68435;
            font-weight: 200;
            box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
            z-index: 3; }
            .user-menu .side-nav ul > li .nav-link .words-tip:before {
              font-size: .8rem;
              content: ' ';
              position: absolute;
              top: .85em;
              left: -0.34em;
              border: .55em solid;
              border-color: transparent transparent #FFF6DE #FFF6DE;
              box-shadow: 0 1px 0 0 #dfdfdf;
              -webkit-transform: rotate(46deg);
                      transform: rotate(46deg); }
          .user-menu .side-nav ul > li .nav-link svg {
            position: absolute;
            left: 23px;
            width: 16px;
            height: 16px;
            top: 15px; }
          .user-menu .side-nav ul > li .nav-link .new-tip {
            position: absolute;
            top: -6px !important;
            width: 40px !important;
            height: 14px !important;
            left: initial !important; }
      .user-menu .side-nav ul .side-nav-header {
        background-color: #E6EBF0;
        padding: 7px 0px 7px 21px;
        width: 220px;
        box-shadow: 0px 1px 0px 0px #FFF inset, 0 1px 0 0 #E6E6E6, 1px 0 0 0 #E6E6E6, -1px 0 0 0 #E6E6E6; }
        .user-menu .side-nav ul .side-nav-header .subtitle {
          font-size: .8rem; }
      .user-menu .side-nav ul .side-nav-item {
        background-color: #F0F2F5;
        height: 48px;
        width: 220px;
        box-shadow: 0px -1px 0px 0px #E6E6E6, 0px 1px 0px 0px #FFF inset, 0 2px 0 0 #E6E6E6, 1px 0 0 0 #E6E6E6, -1px 0 0 0 #E6E6E6; }
        .user-menu .side-nav ul .side-nav-item .active {
          background-color: #FFF; }
        .user-menu .side-nav ul .side-nav-item:hover .words-tip {
          display: block; }
    .user-menu .side-nav span.page-name {
      display: inline-block;
      margin: 0 10px; }
    .user-menu .side-nav .coder-profit {
      margin-top: 3em; }
    .user-menu .side-nav .full-filled {
      margin-right: 10px;
      float: right;
      font-size: 18px;
      color: #4289DB; }
    .user-menu .side-nav .not-full-filled {
      margin-right: 10px;
      float: right;
      font-size: 18px;
      color: #cdd5de; }
    .user-menu .side-nav .right-icon-wrapper {
      position: relative;
      margin-right: 10px;
      float: right;
      font-size: 18px; }
      .user-menu .side-nav .right-icon-wrapper .icon, .user-menu .side-nav .right-icon-wrapper i.fa, .user-menu .side-nav .right-icon-wrapper i[class^=icon] {
        position: inherit !important;
        left: inherit !important; }
      .user-menu .side-nav .right-icon-wrapper .words-tip {
        display: none;
        font-size: .8rem;
        position: absolute;
        width: 15em;
        background: #FFF6DE;
        left: 2em;
        padding: .6em;
        top: -.6em;
        color: #F68435;
        font-weight: 200;
        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
        z-index: 9999; }
        .user-menu .side-nav .right-icon-wrapper .words-tip:before {
          font-size: .8rem;
          content: ' ';
          position: absolute;
          top: .85em;
          left: -0.34em;
          border: .55em solid;
          border-color: transparent transparent #FFF6DE #FFF6DE;
          box-shadow: 0 1px 0 0 #dfdfdf;
          -webkit-transform: rotate(46deg);
                  transform: rotate(46deg); }
  .user-menu .mpay-menu {
    margin-top: 3em; }
  .user-menu .subtitle {
    font-size: .8rem; }
  .user-menu .border-radius-top {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px; }
  .user-menu .border-radius-middle {
    border-radius: 0; }
  .user-menu .border-radius-bottom {
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px; }

@media only screen and (max-width: 767px) {
  .menu.user-menu {
    position: relative; }
    .menu.user-menu .side-nav {
      max-width: inherit;
      margin-bottom: 1rem; }
      .menu.user-menu .side-nav ul .side-nav-header {
        width: 100%; }
      .menu.user-menu .side-nav ul .side-nav-item {
        width: 48%;
        float: left;
        margin-bottom: 1rem; }
        .menu.user-menu .side-nav ul .side-nav-item:hover .words-tip {
          display: none; }
      .menu.user-menu .side-nav ul .basic-info:nth-child(2n+1) {
        margin-right: 4%; }
      .menu.user-menu .side-nav ul .mart-data:nth-child(2n+1) {
        margin-right: 4%; }
      .menu.user-menu .side-nav:after {
        display: table;
        content: "";
        clear: both; }
    .menu.user-menu .side-nav.mpay-menu {
      margin-top: 1rem; }
      .menu.user-menu .side-nav.mpay-menu .side-nav-item:nth-child(2n+2) {
        margin-right: 4%; }
  .form-container {
    margin-left: 0 !important; } }