.product-feature {
  float:left;
  width:50%; /* The width is 50%, by default */
}

.product-image {
  float:left;
  width:50%; /* The width is 50%, by default */
}


/* Use a media query to add a break point at 800px: */
@media screen and (max-width:800px) {
 .product-feature  {
    width:100%; /* The width is 100%, when the viewport is 800px or smaller */
  }

 .product-image  {
    width:100%; /* The width is 100%, when the viewport is 800px or smaller */
  }
}

.product-feature-25 {
  float:left;
  width:25%; /* The width is 25%, by default */
}

.product-image-25 {
  float:left;
  width:25%; /* The width is 25%, by default */
}


/* Use a media query to add a break point at 800px: */
@media screen and (max-width:800px) {
 .product-feature-25  {
    width:100%; /* The width is 100%, when the viewport is 800px or smaller */
  }

 .product-image-25  {
    width:100%; /* The width is 100%, when the viewport is 800px or smaller */
  }
}