Media query for fullscreen
Use new css features display-mode
@media all and (display-mode: fullscreen) { .content { padding: 0px; }}Also avoid using !important as it's a bad practice
You can negate @media rules with not. Details on this can be found here.
It might be less elegant, but more robust, to listen to the full screen event, then perhaps add an is-fullscreen class to the body so you can write your rule like this:
body.is-fullscreen .content { padding...For example:
document.addEventListener('fullscreenchange', function() { document.body.classList.toggle('is-fullscreen', document.fullscreenEnabled);});This event has vendor-prefixed versions, so make sure you're using the one(s) you need.