CSS two grids need some white space in between to sepearte them can't figure out how to do this.

I have two grids that take up the space side by side.  Here is my code for each grid and css.  I need to put some white space between them as I want to use background color on both.  I tried resizing grids did not work unless doing something wrong.  see css and grid size below.

<div class="grid_8a ltyellow_box ">
      <h2 class="oswald">MISSION</h2>
      <p class="roboto">
This is a statment that talks about the departments misson.
<div class="grid_8b">
        <h2 class="oswald">VISION</h2>
        This is a statment that talks about the departments vison.p>
</div>

.grid_8a { width: 60%;}
.grid_8b { width: 40%;}

.ltyellow_box {
      background-color: #CCCCCC;/*d3d8c0 */
      overflow:auto;
      margin-top: 0px;
      padding-bottom: 15px;
      -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
      border-radius: 25px;
}