body {
  margin: 0;
  padding: 0;
}

#daymond-john {
  background: #000;
  font: 400 14px/1.4em 'Open Sans', sans-serif;
  margin: 0;
  min-width: 320px;
  padding: 0;
  width: 100%;
}

#daymond-john:after {
  clear: both;
  content: '';
  display: block;
}

#daymond-john * {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

#daymond-john a {
  text-decoration: none;
}

#daymond-john img {
  width: 100%;
}

#daymond-john small {
  font-size: 0.8rem;
  line-height: 100%;
}

#daymond-john .grid {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 0 auto;
  max-width: 960px;
  padding: 0 25px;
}

#daymond-john .section-title {
  color: #fff;
  font-size: 1.25em;
  font-weight: 300;
  margin: 15px 0 25px;
  position: relative;
  text-align: center;
  text-transform: uppercase;
  width: 100%;
  z-index: 99;
}

#daymond-john .section-title:after {
  background: black;
  content: '';
  display: block;
  height: 50px;
  margin: 0 auto;
  position: relative;
  top: -34px;
  width: 200px;
  z-index: -1;
}

#daymond-john .section-title:before {
  border-top: 1px solid #fff;
  content: '';
  display: block;
  margin: 0 auto;
  max-width: 680px;
  position: relative;
  top: 10px;
  width: 90%;
  z-index: -1;
}

#daymond-john .hero {
  display: block;
  margin-bottom: 35px;
}

#daymond-john .hero:after {
  clear: both;
  content: '';
  display: block;
}

#daymond-john .hero__image {
  background: url("http://images.marketamerica.com/creative/2016/shop-usa-43990-daymond-john/images/bg-01.png") 50% 0% no-repeat, -webkit-radial-gradient(circle closest-corner at bottom, #444, #000), #000;
  background: url("http://images.marketamerica.com/creative/2016/shop-usa-43990-daymond-john/images/bg-01.png") 50% 0% no-repeat, radial-gradient(circle closest-corner at bottom, #444, #000), #000;
  display: block;
  height: 246px;
  margin: 0 auto;
  max-width: 960px;
  position: relative;
}

#daymond-john .hero__logo {
  display: block;
  height: auto;
  margin: 15px auto;
  max-height: 450px;
  max-width: 450px;
  position: relative;
  width: 90%;
  -webkit-filter: drop-shadow(0px 0px 5px rgba(0, 0, 0, 0.25));
  filter: drop-shadow(0px 0px 5px rgba(0, 0, 0, 0.25));
  /* Same syntax as box-shadow */
}

#daymond-john .container {
  margin: 0 8px;
  -webkit-box-flex: 0;
      -ms-flex: 0 1 auto;
          flex: 0 1 auto;
}

#daymond-john .container.product {
  margin-bottom: 3em;
  padding: 5px;
  position: relative;
  top: 0;
  -webkit-transition: all .25s ease-in;
  transition: all .25s ease-in;
}

#daymond-john .container.product:hover {
  top: -5px;
}

#daymond-john .container.store {
  margin-bottom: 3em;
  margin-right: 1%;
  padding: 5px;
  position: relative;
  top: 0;
  -webkit-transition: all .25s ease-in;
  transition: all .25s ease-in;
  width: 124px;
}

#daymond-john .container.store:hover {
  top: -5px;
}

#daymond-john .product {
  background: #000;
  box-shadow: 0px 0px 40px -10px rgba(74, 74, 74, 0.6);
  min-height: 200px;
}

#daymond-john .product:hover {
  box-shadow: 0px 5px 60px 0px rgba(74, 74, 74, 0.85);
  z-index: 99;
}

#daymond-john .product-image {
  background: #000;
  border-bottom: 1px solid rgba(135, 107, 36, 0.5);
}

#daymond-john .product-title {
  color: #fff;
  font-size: .85rem;
  font-weight: 300;
  min-height: 60px;
  line-height: 1.25rem;
  padding: 10px;
  text-align: left;
}

#daymond-john .product-title:after {
  background: #876b24;
  border-radius: 50%;
  box-sizing: content-box;
  color: #fff;
  content: 'As Seen On TV';
  display: block;
  font-size: .75em;
  line-height: 1em;
  height: 20px;
  padding: 15px 0;
  position: absolute;
  text-align: center;
  top: 10px;
  left: 10px;
  width: 50px;
}

#daymond-john .product-price {
  color: #fff;
  font-size: .85rem;
  font-weight: 600;
  line-height: 1.25rem;
  padding: 5px 10px;
  text-align: left;
}

#daymond-john .product-cb {
  color: #fff;
  font-size: .7rem;
  font-weight: 300;
  padding: 5px 10px;
  text-align: left;
}

#daymond-john .product-link {
  background: #876b24;
  color: #fff;
  font-size: 0.875rem;
  padding: 12px;
  text-align: center;
  text-decoration: none;
}

#daymond-john .product-link:hover {
  background: #5f4b19;
}

#daymond-john .store {
  background: #000;
  box-shadow: 0px 0px 40px -10px rgba(74, 74, 74, 0.6);
  min-height: 160px;
}

#daymond-john .store:hover {
  box-shadow: 0px 5px 60px 0px rgba(74, 74, 74, 0.85);
  z-index: 99;
}

#daymond-john .store-title {
  color: #fff;
  font-size: .75rem;
  font-weight: 200;
  line-height: 1rem;
  padding: 5px 10px;
  text-align: left;
}

#daymond-john .store-image {
  background: #000;
  border-bottom: 1px solid rgba(135, 107, 36, 0.5);
}

#daymond-john .store-link {
  background: #876b24;
  bottom: 5px;
  color: #fff;
  font-size: 0.75rem;
  padding: 6px;
  position: absolute;
  text-align: center;
  text-decoration: none;
  width: calc(100% - 10px);
}

#daymond-john .store-link:hover {
  background: #5f4b19;
}

#daymond-john .border {
  border-top: 1px solid rgba(135, 107, 36, 0.75);
}

#daymond-john .border:after, #daymond-john .border:before {
  content: "";
  position: absolute;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(135, 107, 36, 0.75)), to(transparent));
  background-image: -webkit-linear-gradient(rgba(135, 107, 36, 0.75), transparent);
  background-image: linear-gradient(rgba(135, 107, 36, 0.75), transparent);
  top: -1px;
  bottom: -1px;
  width: 1px;
}

#daymond-john .border:before {
  left: -1px;
}

#daymond-john .border:after {
  right: -1px;
}

#daymond-john .cashback {
  display: inline-block;
  margin: 0 .25em;
  position: relative;
  top: .1em;
  width: 1.35em;
}

#daymond-john .cashback-lg {
  width: 1.35em;
}

#daymond-john .cashback-sm {
  width: 1.65em;
}

#daymond-john .cashback img {
  vertical-align: middle;
}

#daymond-john .clear:after, #daymond-john .clear:before {
  clear: both;
  content: '';
  display: block;
}

@media all and (min-width: 520px) {

  #daymond-john .container.product {
    min-width: 210px;
    width: 23%;
  }
}