I'd like to override the "width" element from my #box-right

I'd like to override the "width" element from my #box-right div.

I have a child theme, and in that theme I wrote:

media="all"
@media only screen and (max-width: 770px) and (min-width: 490px)
#box-right {
width: 30% !important;
}

however, that did not work and what it uses is the following from base.css:

media="all"
@media only screen and (max-width: 770px) and (min-width: 490px)
#content, #container, #home-left, #container #box-right, #right-sidebar, #post-entry {
width: 100% !important;
float: left;
margin: 0px !important;
padding: 1em 0 !important;
border: 0 none !important;
}

Any guidance please?