JSFiddle - React, Tailwind, and code Playground

HTML

Resize this window for mobile version
<h2>This is DESKTOP</h2>
<h2>This is MOBILE</h2>

<ul class="subcategories clearfix">
  <li class="ty-subcategories__item">
    <a href="http://2015.ambientlounge.com/interior/gold-class-bean-bags/butterfly-sofa-bean-bags/">
      <img class="ty-pict  ty-subcategories-img  " src="http://2015.ambientlounge.com/images/detailed/3/category-panel-butterfly.jpg?t=1437997789" alt="" title="">
    </a>
  </li><li class="ty-subcategories__item">
    <a href="http://2015.ambientlounge.com/interior/gold-class-bean-bags/avatar-lounger-bean-bags/">
      <img class="ty-pict  ty-subcategories-img  " src="http://2015.ambientlounge.com/images/detailed/3/category-panel-avatar.jpg?t=1437997872" alt="" title="">
    </a>
  </li><li class="ty-subcategories__item">
    <a href="http://2015.ambientlounge.com/interior/gold-class-bean-bags/twin-couch-bean-bags/">
      <img class="ty-pict  ty-subcategories-img  " src="http://2015.ambientlounge.com/images/detailed/3/category-panel-twin.jpg?t=1437998079" alt="" title="">
    </a>
  </li><li class="ty-subcategories__item">
    <a href="http://2015.ambientlounge.com/interior/gold-class-bean-bags/versa-table-bean-bags/">
      <img class="ty-pict  ty-subcategories-img  " src="http://2015.ambientlounge.com/images/detailed/3/category-panel-versa.jpg?t=1437998061" alt="" title="">
    </a>
  </li><li class="ty-subcategories__item">
    <a href="http://2015.ambientlounge.com/interior/gold-class-bean-bags/acoustic-sofa-bean-bags/">
      <img class="ty-pict  ty-subcategories-img  " src="http://2015.ambientlounge.com/images/detailed/3/category-panel-acoustic.jpg?t=1437998265" alt="" title="">
    </a>
  </li><li class="ty-subcategories__item">
    <a href="http://2015.ambientlounge.com/interior/gold-class-bean-bags/pet-lounger-bean-bags/">
      <img class="ty-pict  ty-subcategories-img  " src="http://2015.ambientlounge.com/images/detailed/3/category-panel-pet.jpg?t=1437996755" alt="" title="">
    </a>
 ...

CSS

body {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-size: 2vw;
}

h2 + h2 { display: none; }

img {
    width: 100%;
    vertical-align: bottom;
}

ul {
    padding: 0;
    list-style: none;
    vertical-align: bottom;
}

ul li {
    display: inline-block;
    width: 50%;
}


@media all and (max-width: 600px) {
    h2 { display: none; }
    h2 + h2 { display: block; }    
    
    ul li {
        width: 100%;
    }
    
    ul li:nth-child(4n - 2) {
        -webkit-transform: translateY(100%);
        -moz-transform: translateY(100%);
        transform: translateY(100%);
    }
    
    ul li:nth-child(4n - 1) {
        -webkit-transform: translateY(-100%);
        -moz-transform: translateY(-100%);
        transform: translateY(-100%);
    } 
}