JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<div class="container-fluid">
    <div class="row">
        <div class="col-lg-5 col-md-5 col-sm-5 hidden-xs">
            @*Sidebar*@
            <div id="googleResultMap"></div>
        </div>
        <div class="col-lg-7 col-md-7 col-sm-7 col-xs-12">
            @*Body content*@
            <div class="searchFilter col-lg-12 col-md-12 col-sm-12 hidden-xs">
                @Html.TextBoxFor(model => model.ClassDate, "{0:MM/dd/yyyy}", new { @class = "date-field form-control default-cursor", @readonly = "readonly" })
                @Html.Hidden("classTime")
                <br/>
                Time Filter
                <br/>
                Open Classes Only
            </div>
            @*<div class="searchResults col-lg-12 col-xs-12 col-sm-12">*@
                <div class="searchResults col-lg-12 col-xs-12 col-sm-12">
              <div class="thumbnail row equalColumnHeight">
                <div class="col-lg-3 col-xs-3 imageColumn">
                    @*<h3>Thumbnail label</h3>
                        <p>
                            <a class="btn btn-primary" role="button" data-toggle="collapse" href="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
                                Link
                            </a>Test Data
                        </p>*@
                    <img src="http://www.joomlaworks.net/images/demos/galleries/abstract/7.jpg" class="img-responsive center-block" alt="Responsive image" style="width: 100%; border: 1px solid purple;">
                    <img src="http://www.joomlaworks.net/images/demos/galleries/abstract/7.jpg" class="img-responsive center-block" alt="Responsive image" style="width: 100%; border: 1px solid purple;">
                    <img src="http://www.joomlaworks.net/images/demos/galleries/abstract/7.jpg" class="img-responsive center-block" alt="Responsive image" style="width: 100%;...

CSS

html,body,.container-fluid,.row {
    height:100%;
}
.row > div {
    height:100%;
}
.row .col-md-5 {
    background-color:#eee;
    top: 51px;
    /*border: 1px solid black;*/
    height: calc(100% - 51px);
    padding-left: 0;
    padding-right: 0;
}
.row .col-md-7 {
    background-color:#ddd;
    top: 51px;
    /*border: 1px solid black;*/
    height: calc(100% - 51px);
    padding-left: 0;
    padding-right: 0;
}
#googleResultMap {
    width:100%;
    height: 100%;
    /*border: 1px solid black;*/
}
.searchFilter {
    /*width:200px;*/
    height: 15%;
    /*border: 1px solid blue;*/
}
.searchResults {
    height: 85%;
    border: 1px solid green;
    overflow-y: scroll
}
input[readonly].default-cursor {
    cursor: default;
    background-color: white;
}

.date-field {
    width: 120px;

}

@@media only screen and (max-width : 768px) {
    /* only size 'xs' and below */
    .searchResults {
        height: 100%;
    }
}

.thumbnail .col-lg-3 {
        border: 1px solid red;
        
    }
    .searchResults {
            height: 85%;
            border: 1px solid green;
            overflow-y: scroll
        }
    .thumbnail.row {
         height: auto;
    }
    .cborder {
        border: 1px solid pink;
    }
    .imageColumn {
        padding-right: 0;
        padding-left: 0;
    }
    .thumbnail.row.equalColumnHeight {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
    }