JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container-fluid">
<div class="header row">
    <div class="col-sm-1"></div>
	<div class="col-sm-3 logo">
        <a href="#"><img src="http://lorempixel.com/output/abstract-q-c-300-63-7.jpg"></a>
    </div>

	<div class="col-sm-8 header-menu">
		<div class="menu-menu-1-container">
            <ul id="menu-menu-1" class="menu">
                <li id="menu-item-28" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-28"><a href="#">Services</a></li>

                <li id="menu-item-26" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-26"><a href="#">How We Work</a></li>

                <li id="menu-item-24" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-24"><a href="#">About Us</a></li>

                <li id="menu-item-25" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-25"><a href="#">Blog</a></li>

            </ul>
        </div>	
    </div>
        
</div><!-- end header row -->
</div><!-- end container-fluid -->

CSS

.header {
    background-color: #f9f9f9;
    height: 110px;
}

.header ul {
    padding: 0px;
    margin: 0px;
    list-style-type: none;
    font-size: 0;
}

.header li, .header-menu a {
    display: inline-block;
    height: 100%;
}

.header-menu a {
    font-size: 14px;
    font-family: Open Sans;
    text-transform: uppercase;
    padding: 45px;
    color: #7f7f7f;
}

/* Bootstrap rows and columns --------------------------------------- */

.row {
    margin-right: -15px;
    margin-left: -15px;
}

.col-sm-1 { 
    width: 8.33333333%; 
}

.col-sm-3 {
    width: 25%;
}

.col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9 { 
     float: left;
}

.col-sm-8 {
    width: 66.66666667%;
}

.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}