html - メディアクエリを変更する方法

Question

コードをいくつか見つけましたが、ページ全体で一度に 2 つのボックスのみを表示するように CSS を変更したいと考えています。

画面サイズを変更したときに、メディア クエリ css を変更して 2 つのボックスのみを表示する方法を教えてください。

私は私の仕事を示すためにフィドルを作りました。

http://jsfiddle.net/pbVLe/

#upload-container-two {
  width: 100%;
  max-width: 970px;
  margin: 0 auto;
  margin-top: 20px;

}
#upload-container-two ul {
  width: 100%;
  *zoom: 1;
}
#upload-container-two ul li {
  float: left;
  margin-right: -100%;
  width: 93%;
}

#upload-container-two ul li a:hover {
  text-decoration: none;
}

#upload-container-two ul li span {
  font-size: 16px;
  line-height: 22px;
  display: block;
  position: absolute;
  bottom: 13px;
  display: none;
}
#upload-container-two ul li img {
  width: 100%;
}
#upload-container-two ul li:nth-child(2n+0) {
  margin-left: 0%;
  margin-bottom: 5.85%;
  clear: both;
  overflow: hidden;
  *zoom: 1;
}

@media screen and (min-width: 460px) {
  #upload-container-two ul li {
    float: left;
    margin-right: -100%;
    width: 42.08%;
  }
  #upload-container-two ul li span {
    padding-bottom: 10px;
  }
  #upload-container-two ul li:nth-child(1n+1) {
    margin-left: 0%;
    margin-bottom: 3.85%;
    clear: both;
    overflow: hidden;
    *zoom: 1;
  }
  #upload-container-two ul li:nth-child(2n+2) {
    margin-left: 51.93%;
    margin-bottom: 3.85%;
    clear: none;
  }
}
@media screen and (min-width: 750px) {
  #upload-container-two ul li {
    float: left;
    margin-right: -100%;
    width: 27.73%;
  }
  #upload-container-two ul li span {
    padding-bottom: 10px;
  }
  #upload-container-two ul li:nth-child(2n+1) {
    margin-left: 0%;
    margin-bottom: 3.85%;
    clear: both;
    overflow: hidden;
    *zoom: 1;
  }
  #upload-container-two ul li:nth-child(2n+2) {
    margin-left: 34.29%;
    margin-bottom: 3.85%;
    clear: none;
  }
  #upload-container-two ul li:nth-child(2n+3) {
    margin-left: 68.59%;
    margin-bottom: 3.85%;
    clear: none;
  }
}

@media screen and (min-width: 900px) {
  #upload-container-two ul li {
    float: left;
    margin-right: -100%;
    width: 20.8%;
  }
  #upload-container-two ul li span {
    padding-bottom: 0px;
  }
  #upload-container-two ul li:nth-child(2n+1) {
    margin-left: 0%;
    margin-bottom: 3.85%;
    clear: both;
    overflow: hidden;
    *zoom: 1;
  }
  #upload-container-two ul li:nth-child(2n+2) {
    margin-left: 25.96%;
    margin-bottom: 3.85%;
    clear: none;
  }
  #upload-container-two ul li:nth-child(2n+3) {
    margin-left: 51.93%;
    margin-bottom: 3.85%;
    clear: none;
  }
  #upload-container-two ul li:nth-child(2n+4) {
    margin-left: 77.89%;
    margin-bottom: 3.85%;
    clear: none;
  }
}