Использование переменных Sass с медиа-запросами CSS3

Я пытаюсь объединить использование переменной Sass с запросами @media следующим образом:

$base_width:1160px;

@media screen and (max-width: 1170px) {$base_width: 960px;}
@media screen and (min-width: 1171px) {$base_width: 1160px;}

$ base_width затем определяется в различных точках в измерениях ширины таблицы стилей в процентах для создания гибких макетов.

Когда я это делаю, кажется, что переменная распознается правильно, а условия для медиа-запроса - нет. Например, приведенный выше код создает макет размером 1160 пикселей независимо от ширины экрана. Если я переверну операторы @media следующим образом:

@media screen and (min-width: 1171px) {$base_width: 1160px;}
@media screen and (max-width: 1170px) {$base_width: 960px;}

Будет получен макет размером 960 пикселей, опять же независимо от ширины экрана. Также обратите внимание, что если я удалю первую строку $ base_width: 1160px; , она вернет ошибку для неопределенной переменной. Есть идеи, что мне не хватает?