Twitter Bootstrap Responsive Background-Image inside Div

Twitter Bootstrap Responsive Background-Image inside Div

i have an problem, i can't find solution..
i have a standart page:
<div class="container">
<div class="row">
<div class="col-md-2"></div>
<div class="col-md-8 col-sm-6 col-xs-12 well" id="bg">
</div>
<div class="col-md-2"></div>
</div>
</div>
css:
@import url('bootstrap.min.css');
body{
background: url('../img/bg.jpg') no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
margin-top: 12%;
}
#bg{
background:url('../img/con_bg4.png') no-repeat center center;
height: 500px;
}
How i can modify #bg image so it would be Responsive ? resizable and
proportional in all browser.
Thanks