Styles not coming up perfectly on dependent picklists used as input-fields

Question

I am creating a visualforce page using lightning design system style classes.The issue which I am facing is that I am using styleClass attribute in my two picklists shown using

These picklists are using dependencies. The Master picklist is appearing fine but the dependent picklist is not working fine with styles.

    <div class="slds-col slds-size--1-of-1 slds-medium-size--1-of-4 slds-small-size--1-of-2 slds-col--padded">
    <div class="slds-form-element">
        <label class="slds-form-element__label">Category</label>
        <div class="slds-form-element__control">
            <!-- <input class="slds-input" type="text" id="Part_Category"/> -->
            <apex:inputField value="{!objPart.Category1__c}" id="Part_Category" styleClass="picklist_style slds-input"/>
        </div>
    </div>
</div>

<div class="slds-col slds-size--1-of-1 slds-medium-size--1-of-4 slds-small-size--1-of-2 slds-col--padded">
    <div class="slds-form-element">
        <label class="slds-form-element__label">Family</label>
        <div class="slds-form-element__control">
            <!-- <input class="slds-input" type="text" id="Part_Family"/> -->
            <apex:inputField value="{!objPart.Family__c}" id="Part_Family" styleClass="picklist_style slds-input"/>
        </div>
    </div>
</div>





.picklist_style{
                width : 210px;
                height : 30px;

           }