/* Article Page */

.am-shop {
  margin: 0 auto;
  max-width: 960px;
  overflow-x: hidden;
  width: 100%;
}

.am-shop a {
  text-decoration: none;
}

.am-shop img {
  border: none;
  max-width: 100%;
}

.am-shop > [class^="am-shop__row"] {
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-top: .75%;
}

[class^="am-shop__row"] img {
  display: inline-block;
}

.am-shop__row1 > a {
  max-width: 49.25%;
}

.am-shop__row2 > a {
  max-width: 32.5%;
}

.am-shop__row3 > a {
  max-width: 24%;
}

@media (max-width: 480px) {
  .am-shop > .am-shop__row2 {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
  .am-shop__row1 > a {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    max-width: 100%;
  }
  .am-shop__row2 > a {
    max-width: 100%;
  }
}

@media (max-width: 640px) {
  .am-shop > [class^="am-shop__row"] {
    max-resolution: 0;
  }
  [class^="am-shop__row"] > a {
    margin-top: 5px;
  }
  .am-shop__row3 > a {
    max-width: 49%;
  }
}


/* Category Page */

.am-shop-cat {
  margin: 0 auto;
  max-width: 960px;
  overflow: hidden;
  width: 100%;
}

.am-shop-cat .main {
  float: left;
  max-width: 444px;
  width: 100%;
}

.am-shop-cat .cats {
  float: left;
  max-width: 516px;
}

.am-shop-cat .cats a {
  background-image: url("http://i.allheart.com/images/articles/antimicrobial-shop/antimicrobial-shop-mobile-cat-page-sprite.gif");
  float: left;
  font-family: "Source Sans Pro", sans-serif;
  height: 88px;
  margin: 0 0 6px 6px;
  text-decoration: none;
  text-indent: -200%;
  width: 166px;
}


/* hover/active states */

.am-shop-cat .cats a:nth-of-type(1) {
  background-color: #29879d;
}

.am-shop-cat .cats a:nth-of-type(1):hover, .am-shop-cat .cats a:nth-of-type(1).active {
  background-position: -166px 0;
}

.am-shop-cat .cats a:nth-of-type(2) {
  background-color: #29879d;
  background-position: -332px 0;
}

.am-shop-cat .cats a:nth-of-type(2):hover, .am-shop-cat .cats a:nth-of-type(2).active {
  background-position: -498px 0;
}

.am-shop-cat .cats a:nth-of-type(3) {
  background-color: #428b7b;
  background-position: -664px 0;
}

.am-shop-cat .cats a:nth-of-type(3):hover, .am-shop-cat .cats a:nth-of-type(3).active {
  background-position: -830px 0;
}

.am-shop-cat .cats a:nth-of-type(4) {
  background-color: #428b7b;
  background-position: -996px 0;
}

.am-shop-cat .cats a:nth-of-type(4):hover, .am-shop-cat .cats a:nth-of-type(4).active {
  background-position: -1162px 0;
}

.am-shop-cat .cats a:nth-of-type(5) {
  background-color: #428b7b;
  background-position: -1328px 0;
}

.am-shop-cat .cats a:nth-of-type(5):hover, .am-shop-cat .cats a:nth-of-type(5).active {
  background-position: -1494px 0;
}

.am-shop-cat .cats a:nth-of-type(6) {
  background-color: #6a9964;
  background-position: -1660px 0;
}

.am-shop-cat .cats a:nth-of-type(6):hover, .am-shop-cat .cats a:nth-of-type(6).active {
  background-position: -1826px 0;
}

.am-shop-cat .cats a:nth-of-type(7) {
  background-color: #6a9964;
  background-position: -1992px 0;
}

.am-shop-cat .cats a:nth-of-type(7):hover, .am-shop-cat .cats a:nth-of-type(7).active {
  background-position: -2158px 0;
}

.am-shop-cat .cats a:nth-of-type(8) {
  background-color: #6a9964;
  background-position: -2324px 0;
}

.am-shop-cat .cats a:nth-of-type(8):hover, .am-shop-cat .cats a:nth-of-type(8).active {
  background-position: -2490px 0;
}

.am-shop-cat .cats a:nth-of-type(9) {
  background-color: #6a9964;
  background-position: -2656px 0;
}

.am-shop-cat .cats a:nth-of-type(9):hover, .am-shop-cat .cats a:nth-of-type(9).active {
  background-position: -2822px 0;
}

@media (max-width:960px) {
  .am-shop-cat .cats {
    clear: both;
    max-width: 444px;
  }
  .am-shop-cat .cats a {
    background-image: none;
    box-sizing: border-box;
    color: #fff;
    font-size: 120%;
    font-weight: bold;
    height: auto;
    margin: 1px 0 0;
    padding: 5px;
    text-indent: 20px;
    width: 100%;
  }
}