cosmos-explorer/src/Explorer/Menus/NavBar/MeControlComponent.less

.meControl {
  .mecontrolHeaderButton {
    height          : auto;
    border          : 0;
    margin          : 0;
    padding         : 0 10px;
    background-color: black;

    :hover,
    :active {
      background-color: #393939
    }

    .mecontrolHeaderPersona {
      height: 40px;
      margin: 0;

      .ms-Persona-details {
        order        : -1;
        text-align   : right;
        padding-left : 0;
        padding-right: 10;

        .ms-Persona-primaryText {
          line-height: 18px;
          color      : white;
        }

        .ms-Persona-secondaryText {
          color      : white;
          font-size  : 10px;
          font-family: "Segoe UI Semibold", "Segoe UI", "Segoe WP", Tahoma, Arial, sans-serif;
        }
      }

      :hover .ms-Persona-details .ms-Persona-primaryText {
        color: white;
      }
    }
  }

  .mecontrolSigninButton {
    height          : 40px;
    border          : 0;
    background-color: black;
    color           : white;
  }
}

.mecontrolContextualMenu {
  .mecontrolContextualMenuPersona {
    margin       : 16px;
    margin-bottom: 0;

    .ms-Persona-details {
      padding: 0;
      margin : -32px 0 0 16;

      .ms-Persona-primaryText {
        color      : black;
        font-size  : 18px;
        height     : 20px;
        font-family: "Segoe UI Semibold", "Segoe UI", "Segoe WP", Tahoma, Arial, sans-serif;
      }

      .ms-Persona-secondaryText {
        color    : black;
        font-size: 14px;
      }
    }
  }

  .switchDirectoryLink,
  .signOutLink {
    color      : #0078d6;
    margin-left: 104px;
    font-size  : 14px;
    cursor     : pointer;

    :hover,
    :focus {
      text-decoration: underline;
    }
  }

  .switchDirectoryLink {
    margin-top: -32px;
  }

  .signOutLink {
    margin-bottom: 16px;
  }
}