How to use the @uifabric/fluent-theme.FontSizes.size16 function in @uifabric/fluent-theme

root: {
    color: active ? '#000' : '#4f4f4f',
    height: '36px',
    width: '220px',
    fontSize: `${FontSizes.size14}`,
    paddingLeft: '0px',
    paddingRight: '0px',
    marginLeft: '0px',
    backgroundColor: 'transparent',
  },
  icon: {
    color: active ? '#000' : '#4f4f4f',
    padding: '0 13px',
    marginLeft: '0px',
    boxSizing: 'border-box',
    fontSize: `${FontSizes.size16}`,
  },
  textContainer: {
    textAlign: 'left',
    zIndex: '1',
    // display: isExpand ? 'inline-block' : 'none',
  },
});

const getStyles: IStyleFunction = props => {
  const { className } = props;
  return {
    root: [
      {
        fontSize: FontSizes.size16,
        fontWeight: 600,
        padding: 0,
        margin: 0,
        marginTop: '32px',
        marginBottom: '12px',

        selectors: {
          '&:first-child': {
            marginTop: 0
          }
        }
      },

      props.as === 'h1' && [
        {
          fontSize: FontSizes.size32,

margin: 0 auto;
`;

export const divider = isExpand => css`
  width: ${isExpand ? '85%' : '40%'};
  border-bottom: 1px solid ${NeutralColors.gray40};
  margin: 0 auto;
`;

export const globalNav = css`
  height: 44px;
  width: 48px;
  text-align: center;
  line-height: 44px;
  cursor: pointer;
  font-size: ${FontSizes.size16};
  color: ${SharedColors.cyanBlue10};
  &:hover {
    background: ${NeutralColors.gray40};
  }
`;

export const content = css`
  outline: none;
  height: 100%;
  flex: 1;
  display: flex;
  flex-direction: column;
`;

export const showDesign = show => css`
  display: ${show ? 'block' : 'none'} !important;