Change column size on different media query (bootstrap)

Hello,
I do have this code

								<div  class="col-xs-8 column SHeadD" >
								</div>
								<div class="col-xs-2 column SHeadL">
								</div>
								<div class="col-xs-2 column SHeadL">
								</div>

Select allOpen in new window

I do need to change column size on 767PX media i do need it to show like this

								<div  class="col-xs-6 column SHeadD" >
								</div>
								<div class="col-xs-3 column SHeadL">
								</div>
								<div class="col-xs-3 column SHeadL">
								</div>

Select allOpen in new window

Can anyone help me practically how to do that ?