How do you make the input in a Semantic UI SearchCategoryInput wider?

semantic.html

<div class="ui grid">
  <div class="nine wide column">
    <div width="9" class="ui category search">
      <div width="600px" class="ui right icon input">
        <input placeholder="Enter person or company ..." autocomplete="off" type="text" tabindex="0" class="prompt" value="">
        <i aria-hidden="true" class="search icon"></i>
      </div>
      <div class="results transition">
        <div class="message empty">
          <div class="header">No results found.</div>
        </div>
      </div>
    </div>
  </div>
</div>

semantic.js

    render() {
        const { isLoading, value, results } = this.state

        return (
            <Grid>
                <Grid.Column width={9}>
                    <Search
                        category
                        icon={<Icon name='search' inverted circular link onClick={this.onSubmitSearch} />}
                        loading={isLoading}
                        onResultSelect={this.handleResultSelect}
                        onSearchChange={_.debounce(this.handleSearchChange, 500, {
                            leading: true,
                        })}
                        results={results}
                        value={value}
                        placeholder={"Enter person or company ..."}
                        width={9}
                    />
                </Grid.Column>
            </Grid>
        )
    }