How can get full width of a row class for a specific column of that row using bootstrap 3

I used bootstrap 3 -row and column class to separate the buttons. The second button is collapsible which shows the google map. But I want that the collapsible map will take the whole area of the row though it's in a column of that row. Is it possible? Here is my code below:

<div class="row text-center c-green">
        <div class="col-md-6">
        <button class="btn-large btn-form" data-toggle= "modal" data-target=    "#contact-modal">Contact with us</button>
        </div>
    <div class="col-md-6">
        <a href="#map" data-toggle= "collapse" ><button class="btn-large btn-map">Click the button to see our batch location</button></a>
        <div id="map" class= "collapse"></div>
        </div>
        </div>

Here is the output image