Added responsive images utility CSS class for custom image elements.

This enables custom elements that render an image to be responsive within the layout editor by applying the "img-responsive" class to either the image itself or any of its parent HTML elements.

src/Orchard.Web/Modules/Orchard.Layouts/Styles/LayoutEditor.css

@@ -676,6 +676,13 @@ table[rules=all i] > tfoot > tr > td, table[rules=all i] > tfoot > tr > th {
   max-width: 100%;
   height: auto;
 }
+.layout-editor .img-responsive,
+.layout-editor .img-responsive img {
+  display: block;
+  width: 100%;
+  max-width: 100%;
+  height: auto;
+}
 
 .layout-editor > .layout-toolbox {
   margin-left: 12px;

src/Orchard.Web/Modules/Orchard.Layouts/Styles/LayoutEditor/Content.css

@@ -469,3 +469,10 @@ table[rules=all i] > tfoot > tr > td, table[rules=all i] > tfoot > tr > th {
   max-width: 100%;
   height: auto;
 }
+.layout-editor .img-responsive,
+.layout-editor .img-responsive img {
+  display: block;
+  width: 100%;
+  max-width: 100%;
+  height: auto;
+}

src/Orchard.Web/Modules/Orchard.Layouts/Styles/LayoutEditor/Content.less

@@ -33,4 +33,11 @@
             }
         }
     }
+
+    .img-responsive, .img-responsive img {
+        display: block;
+        width: 100%;
+        max-width: 100%;
+        height: auto;
+    }
 }