Bootstrap grid problems (overlapping divs)

You are wrapping a row directly under another row. Always try to keep a row under a container or a column div.

You can either change the top parent row to container like this:

<div class="container">
  <div class="row">
    <div class="left_content col-lg-8 col-sm-12">
        <div class="row">
            <div class="news_report col-lg-6 col-sm-6">

            </div>

            <div class="news_report col-lg-6 col-sm-6">

            </div>
        </div>

OR you can add a col div under the parent row like this:

<div class="row">
  <div class="col-xs-12">
    <div class="row">
      <div class="left_content col-lg-8 col-sm-12">
        <div class="row">
            <div class="news_report col-lg-6 col-sm-6">

            </div>

            <div class="news_report col-lg-6 col-sm-6">

            </div>
        </div>