Unable to overwrite overflow-y to visible

I have an overflow-y set to scroll in one css master file, which i partially overwrite with another css for mobile version.

The first master css file has:

div.container {
  max-height: 100%;
  overflow-y: scroll;
}

Then in the second css file that partially overwrites a few properties i have

div.container {
  max-height: none;
  overflow-y: visible !important
}

Imports are as follows:

<link type="text/css" rel="stylesheet" href="<?php echo $href_root; ?>css/main-styles.css">
<link type="text/css" rel="stylesheet" href="<?php echo ($ismobile ? $href_root . 'css/main-styles-mobile.css' : '') ?>">

But it doesn't work. It is still showing a scroll bar, even when i overwrite it with overflow-y: hidden !important. What am i doing wrong??