CSS - Медиа запросы. Некоректная последовательность активации медиазапросов

Некорректная последовательность активации медиазапросов. Предположим, что я имею блок div с классом container и следующий css файлик:

  @media screen and (min-width: 320px) {
       .container {
           width: 200px
       }
  }

  @media screen and (min-width: 700px) {
       .container {
           width: 500px
       }
  }

Почему сайт отображает стили в min-width: 700px, хотя ширина экрана меньше ?