Switching to mobile menu

I would like to activate the header mobile menue as soon as the browser width is below 1250px it this possible ?

I tried to add the following code to the theme options under General Styling tab

@media only screen and (max-width: 1250px) {
.av-main-nav > li > a { padding: 0 7px; }
}

But that wasn’t the solution :-(