How can i make hovering on one div change the other?

    <div class="button-div">
                    <div class="button">

                </div>
                </div>

        <div class="logo-section"></div>
    </div>
    <div class="header-search-section">
        <input type="text" placeholder="Search" class="header-search-bar">
        <input type="submit" value="Search" class="header-search-button">
    </div>
    <div class="right-side">
        <div class="circle-button">
        </div>
    </div>
</div>

How can I make hovering over .button-div affect .circle-button? Please help I have tried >, ~ and just a space