Change boxed layout to full width on phone size

How do I change from my boxed layout to full width on phone size?

I tried this but it doesn’t work:
@media (max-width: 480px) {
#top .x-boxed-layout-active .site { width: 100% !important; border: 0 !important;}
}

changed to:
.site, .x-navbar.x-navbar-fixed-top.x-container.max.width
and it now works!

Hello There,

We are just glad that you have figured it out a way to correct the said issue.
Thanks for letting us know!

Best Regards.