JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<div class="container">
    <div class="row">
        <div class="col-md-4 col-sm-6 col-xs-12">Emp-01</div>
        <div class="col-md-4 col-sm-6 col-xs-12">Emp-02</div>
        <div class="col-md-4 col-sm-6 col-xs-12">Emp-03</div>
        <div class="col-md-4 col-sm-6 col-xs-12">Emp-04</div>
        <div class="col-md-4 col-sm-6 col-xs-12">Emp-05</div>
        <div class="col-md-4 col-sm-6 col-xs-12">Emp-06</div>
        <div class="col-md-4 col-sm-6 col-xs-12">Emp-07</div>
        <div class="col-md-4 col-sm-6 col-xs-12">Emp-08</div>
        <!-- <div class="col-md-4 col-sm-6 col-xs-12">Emp-09</div> -->
    </div>
</div>

CSS

.row div:nth-child(even){
  background-color: #dcdcdc;
}
.row div:nth-child(odd){
  background-color: #aaaaaa;
}

@media (min-width: 768px) {
    .row div:nth-child(4n), .row div:nth-child(4n-1) {
        background: #dcdcdc;
    }
    .row div:nth-child(4n-2), .row div:nth-child(4n-3) {
        background: #aaaaaa;
    }
}

@media (min-width: 992px) {
    .row div:nth-child(6n), .row div:nth-child(6n-1), .row div:nth-child(6n-2) {
        background: #dcdcdc;
    }
    .row div:nth-child(6n-3), .row div:nth-child(6n-4), .row div:nth-child(6n-5) {
        background: #aaaaaa;
    }
}