#header-wrapper{width:100%;overflow:hidden;}
#header{width:30%;overflow:hidden;float:left;}
#header-ads{width:70%;overflow:hidden;float:right;}
.header .widget{padding:10px;}

@media screen and (max-width:600px) {
#header{width:100%;float: none;}
#header-ads{width:100%;float: none;}
}

<header id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1'>
<b:widget id='Header1' locked='true' title='Cobain Blogger Template (Header)' type='Header'></b:widget>
</b:section>
<b:section class='header' id='header-ads' maxwidgets='1'/>
<div class='clear'/>
</header>