diff --git a/components/renderers/controls/array/array-renderer.ts b/components/renderers/controls/array/array-renderer.ts
index 752d2c478..59c404542 100644
--- a/components/renderers/controls/array/array-renderer.ts
+++ b/components/renderers/controls/array/array-renderer.ts
@@ -2,7 +2,7 @@
 
 class ArrayRenderer implements JSONForms.IRenderer {
 
-    protected maxSize = 99;
+    protected maxSize = 100;
     priority = 99;
 
     constructor(private renderService: JSONForms.IRenderService, private pathResolver: JSONForms.IPathResolver) { }
@@ -96,7 +96,7 @@ class ArrayRenderer implements JSONForms.IRenderer {
             return controlDescription;
         } else {
             let submitElement = {};
-            let supportsSubmit = element.options != undefined && element.options['submit'];
+            let supportsSubmit = !(element.options != undefined && element.options['submit'] == false);
             let generatedGroups = this.createControlGroupPerItem(schemaPath, items, data == undefined ? 0 : data.length);
             let buttonText = JSONForms.PathUtil.beautifiedLastFragment(schemaPath);
 
@@ -111,7 +111,8 @@ class ArrayRenderer implements JSONForms.IRenderer {
                   <jsonforms-dynamic-widget ng-repeat="submitRenderDescription in element.submitControls" element="submitRenderDescription">
                   </jsonforms-dynamic-widget>
                </fieldset>
-               <input ng-show="${supportsSubmit}" type="button" value="Add to ${buttonText}" ng-click="element.submitCallback()" ng-model="element.submitElement">
+               <input class="btn btn-primary"
+                      ng-show="${supportsSubmit}" type="button" value="Add to ${buttonText}" ng-click="element.submitCallback()" ng-model="element.submitElement">
                </input>
              </jsonforms-layout>`;
 
@@ -122,7 +123,7 @@ class ArrayRenderer implements JSONForms.IRenderer {
                 containerDescription['submitControls'] = this.createControlsForSubmit(items, schemaPath, submitElement, services);
                 if (data == undefined) {
                     containerDescription["instance"][containerDescription['path']] = [];
-                    data = [];
+                    data = containerDescription["instance"][containerDescription['path']];
                 }
                 containerDescription['submitCallback'] = () => data.push(_.clone(submitElement));
             }
diff --git a/components/renderers/controls/boolean/boolean-renderer.spec.ts b/components/renderers/controls/boolean/boolean-renderer.spec.ts
index e91a4d8b7..1dfd3e540 100644
--- a/components/renderers/controls/boolean/boolean-renderer.spec.ts
+++ b/components/renderers/controls/boolean/boolean-renderer.spec.ts
@@ -22,7 +22,7 @@ describe('Boolean renderer', () => {
         scope.data = { "vegetarian": true };
         let el = $compile('<jsonforms schema="schema" ui-schema="uiSchema" data="data"/>')(scope);
         scope.$digest();
-        let input = angular.element(el[0].getElementsByClassName('jsf-control'));
+        let input = angular.element(el[0].getElementsByClassName('jsf-control-boolean'));
         expect(input.attr("disabled")).toBeDefined();
     }));
 });
\ No newline at end of file
diff --git a/components/renderers/controls/boolean/boolean-renderer.ts b/components/renderers/controls/boolean/boolean-renderer.ts
index 51c518cd5..3e65345ae 100644
--- a/components/renderers/controls/boolean/boolean-renderer.ts
+++ b/components/renderers/controls/boolean/boolean-renderer.ts
@@ -7,7 +7,7 @@ class BooleanRenderer implements JSONForms.IRenderer {
     render(element: IControlObject, subSchema: SchemaElement, schemaPath: string, services: JSONForms.Services) {
         var control = JSONForms.RenderDescriptionFactory.createControlDescription(schemaPath,  services, element);
         control['template'] = `<jsonforms-control>
-          <input type="checkbox" id="${schemaPath}" class="jsf-control jsf-control-boolean" ${element.readOnly ? 'disabled="disabled"' : ''} data-jsonforms-validation data-jsonforms-model/>
+          <input type="checkbox" id="${schemaPath}" class="jsf-control-boolean" ${element.readOnly ? 'disabled="disabled"' : ''} data-jsonforms-validation data-jsonforms-model/>
         </jsonforms-control>`;
         return control;
     }
diff --git a/components/renderers/controls/control.html b/components/renderers/controls/control.html
index f00df447e..95c193bc0 100644
--- a/components/renderers/controls/control.html
+++ b/components/renderers/controls/control.html
@@ -1,10 +1,10 @@
-<div class="col-sm-{{element.size}} form-group top-buffer" ng-hide="element.hide">
+<div class="col-sm-{{element.size}} jsf-control form-group top-buffer" ng-hide="element.hide">
     <div class="row">
-        <label ng-if="element.label" for="element.id">{{element.label}}</label>
+        <label ng-if="element.label" for="{{element.id}}">{{element.label}}</label>
     </div>
-    <div class="row" style="padding-right: 1em" ng-transclude>
+    <div class="row" ng-transclude>
     </div>
-    <div class="row" style="padding-right: 1em">
-        <alert ng-repeat="alert in element.alerts" type="{{alert.type}}" class="top-buffer-s jsf-alert">{{alert.msg}}</alert>
+    <div class="row">
+        <alert ng-repeat="alert in element.alerts" type="{{alert.type}}" >{{alert.msg}}</alert>
     </div>
 </div>
diff --git a/components/renderers/controls/datetime/datetime-renderer.spec.ts b/components/renderers/controls/datetime/datetime-renderer.spec.ts
index a61ec5991..6687252f7 100644
--- a/components/renderers/controls/datetime/datetime-renderer.spec.ts
+++ b/components/renderers/controls/datetime/datetime-renderer.spec.ts
@@ -37,7 +37,7 @@ describe('DateTimeTest', () => {
         scope.data = { "birthDate": "1985-06-02 20:15:36" };
         let el = $compile('<jsonforms schema="schema" ui-schema="uiSchema" data="data"/>')(scope);
         scope.$digest();
-        let input = angular.element(el[0].getElementsByClassName('jsf-control'));
+        let input = angular.element(el[0].getElementsByClassName('jsf-control-datetime'));
         expect(input.attr("readonly")).toBeDefined();
     }));
     // TODO: add test cases to check whether validation works
diff --git a/components/renderers/controls/datetime/datetime-renderer.ts b/components/renderers/controls/datetime/datetime-renderer.ts
index 00e05b362..a331ffc84 100644
--- a/components/renderers/controls/datetime/datetime-renderer.ts
+++ b/components/renderers/controls/datetime/datetime-renderer.ts
@@ -13,7 +13,7 @@ class DatetimeRenderer implements JSONForms.IRenderer {
         control['template'] =
             `<jsonforms-control>
             <div class="input-group">
-              <input type="text" ${element.readOnly ? 'readonly' : ''} datepicker-popup="dd.MM.yyyy" close-text="Close" is-open="element.isOpen" id="${schemaPath}" class="form-control jsf-control jsf-control-datetime" data-jsonforms-model  data-jsonforms-validation/>
+              <input type="text" ${element.readOnly ? 'readonly' : ''} datepicker-popup="dd.MM.yyyy" close-text="Close" is-open="element.isOpen" id="${schemaPath}" class="form-control jsf-control-datetime" data-jsonforms-model  data-jsonforms-validation/>
                  <span class="input-group-btn">
                    <button type="button" class="btn btn-default" ng-click="element.openDate($event)">
                      <i class="glyphicon glyphicon-calendar"></i>
diff --git a/components/renderers/controls/integer/integer-renderer.spec.ts b/components/renderers/controls/integer/integer-renderer.spec.ts
index 579df1849..a20c593a0 100644
--- a/components/renderers/controls/integer/integer-renderer.spec.ts
+++ b/components/renderers/controls/integer/integer-renderer.spec.ts
@@ -22,7 +22,7 @@ describe('Integer renderer', () => {
         scope.data = { "age": 30 };
         let el = $compile('<jsonforms schema="schema" ui-schema="uiSchema" data="data"/>')(scope);
         scope.$digest();
-        let input = angular.element(el[0].getElementsByClassName('jsf-control'));
+        let input = angular.element(el[0].getElementsByClassName('jsf-control-integer'));
         expect(input.attr("readonly")).toBeDefined();
     }));
 });
\ No newline at end of file
diff --git a/components/renderers/controls/integer/integer-renderer.ts b/components/renderers/controls/integer/integer-renderer.ts
index b274dd7e6..723900260 100644
--- a/components/renderers/controls/integer/integer-renderer.ts
+++ b/components/renderers/controls/integer/integer-renderer.ts
@@ -7,7 +7,7 @@ class IntegerRenderer implements JSONForms.IRenderer {
     render(element: IControlObject, subSchema: SchemaElement, schemaPath: string, services: JSONForms.Services): JSONForms.IRenderDescription {
         var control = JSONForms.RenderDescriptionFactory.createControlDescription(schemaPath, services, element);
         control['template'] = `<jsonforms-control>
-          <input type="number" step="1" id="${schemaPath}" class="form-control jsf-control jsf-control-integer" ${element.readOnly ? 'readonly' : ''} data-jsonforms-validation data-jsonforms-model/>
+          <input type="number" step="1" id="${schemaPath}" class="form-control jsf-control-integer" ${element.readOnly ? 'readonly' : ''} data-jsonforms-validation data-jsonforms-model/>
         </jsonforms-control>`;
         return control;
     }
diff --git a/components/renderers/controls/number/number-renderer.spec.ts b/components/renderers/controls/number/number-renderer.spec.ts
index e7d2763db..aa03573bc 100644
--- a/components/renderers/controls/number/number-renderer.spec.ts
+++ b/components/renderers/controls/number/number-renderer.spec.ts
@@ -22,7 +22,7 @@ describe('Number renderer', () => {
         scope.data = { "height": 1.76 };
         let el = $compile('<jsonforms schema="schema" ui-schema="uiSchema" data="data"/>')(scope);
         scope.$digest();
-        let input = angular.element(el[0].getElementsByClassName('jsf-control'));
+        let input = angular.element(el[0].getElementsByClassName('jsf-control-number'));
         expect(input.attr("readonly")).toBeDefined();
     }));
 });
\ No newline at end of file
diff --git a/components/renderers/controls/number/number-renderer.ts b/components/renderers/controls/number/number-renderer.ts
index a67c2a0ee..d281a4e3c 100644
--- a/components/renderers/controls/number/number-renderer.ts
+++ b/components/renderers/controls/number/number-renderer.ts
@@ -7,7 +7,7 @@ class NumberRenderer implements JSONForms.IRenderer {
     render(element: IControlObject, subSchema: SchemaElement, schemaPath: string, services: JSONForms.Services) {
         var control = JSONForms.RenderDescriptionFactory.createControlDescription(schemaPath, services, element);
         control['template'] = `<jsonforms-control>
-          <input type="number" step="0.01" id="${schemaPath}" class="form-control jsf-control jsf-control-number" ${element.readOnly ? 'readonly' : ''} data-jsonforms-validation data-jsonforms-model/>
+          <input type="number" step="0.01" id="${schemaPath}" class="form-control jsf-control-number" ${element.readOnly ? 'readonly' : ''} data-jsonforms-validation data-jsonforms-model/>
         </jsonforms-control>`;
         return control;
     }
diff --git a/components/renderers/controls/string/string-renderer.spec.ts b/components/renderers/controls/string/string-renderer.spec.ts
index 8086dcfa9..8871d3070 100644
--- a/components/renderers/controls/string/string-renderer.spec.ts
+++ b/components/renderers/controls/string/string-renderer.spec.ts
@@ -22,7 +22,7 @@ describe('String renderer', () => {
         scope.data = { "vegetarian": true };
         let el = $compile('<jsonforms schema="schema" ui-schema="uiSchema" data="data"/>')(scope);
         scope.$digest();
-        let input = angular.element(el[0].getElementsByClassName('jsf-control'));
+        let input = angular.element(el[0].getElementsByClassName('jsf-control-string'));
         expect(input.attr("readonly")).toBeDefined();
     }));
 });
\ No newline at end of file
diff --git a/components/renderers/controls/string/string-renderer.ts b/components/renderers/controls/string/string-renderer.ts
index 29b0ec03e..67e489c15 100644
--- a/components/renderers/controls/string/string-renderer.ts
+++ b/components/renderers/controls/string/string-renderer.ts
@@ -9,7 +9,7 @@ class StringRenderer implements JSONForms.IRenderer {
     render(element: IControlObject, subSchema: SchemaElement, schemaPath: string, services: JSONForms.Services): JSONForms.IRenderDescription {
         var control = JSONForms.RenderDescriptionFactory.createControlDescription(schemaPath, services, element);
         control['template'] = `<jsonforms-control>
-          <input type="text" id="${schemaPath}" class="form-control jsf-control jsf-control-string" ${element.readOnly ? 'readonly' : ''} data-jsonforms-model data-jsonforms-validation/>
+          <input type="text" id="${schemaPath}" class="form-control jsf-control-string" ${element.readOnly ? 'readonly' : ''} data-jsonforms-model data-jsonforms-validation/>
         </jsonforms-control>`;
         return control;
     }
@@ -17,7 +17,6 @@ class StringRenderer implements JSONForms.IRenderer {
     isApplicable(uiElement: IUISchemaElement, subSchema: SchemaElement, schemaPath: string):boolean {
         return uiElement.type == 'Control' && subSchema !== undefined && subSchema.type == 'string';
     }
-
 }
 
 angular.module('jsonforms.renderers.controls.string').run(['RenderService', (RenderService) => {
diff --git a/components/renderers/extras/label/label-renderer.ts b/components/renderers/extras/label/label-renderer.ts
index d2f79cfae..47bf70644 100644
--- a/components/renderers/extras/label/label-renderer.ts
+++ b/components/renderers/extras/label/label-renderer.ts
@@ -6,12 +6,12 @@ class LabelRenderer implements JSONForms.IRenderer {
 
     render(element:IUISchemaElement, schema: SchemaElement, schemaPath: string, services: JSONForms.Services): JSONForms.IRenderDescription {
         var text = element['text'];
-        var size = 99;
+        var size = 100;
 
         return {
             "type": "Widget",
             "size": size,
-            "template": ` <jsonforms-widget><div class="jsf-label">${text}</div></jsonforms-widget>`
+            "template": ` <jsonforms-widget class="jsf-label">${text}<hr></jsonforms-widget>`
         };
     }
 
diff --git a/components/renderers/jsonforms-renderers.ts b/components/renderers/jsonforms-renderers.ts
index 71b2d45db..020a181db 100644
--- a/components/renderers/jsonforms-renderers.ts
+++ b/components/renderers/jsonforms-renderers.ts
@@ -91,7 +91,7 @@ module JSONForms {
     export class ControlRenderDescription implements IControlRenderDescription {
 
         public type = "Control";
-        public size = 99;
+        public size = 100;
         public alerts: any[] = []; // TODO IAlert type missing
         public label: string;
         public rule: IRule;
diff --git a/components/renderers/layouts/group/group-renderer.ts b/components/renderers/layouts/group/group-renderer.ts
index 831c22907..458390edf 100644
--- a/components/renderers/layouts/group/group-renderer.ts
+++ b/components/renderers/layouts/group/group-renderer.ts
@@ -18,7 +18,7 @@ class GroupRenderer implements JSONForms.IRenderer {
                </fieldset>
              </jsonforms-layout>`;
 
-        return JSONForms.RenderDescriptionFactory.createContainerDescription(99, renderedElements, template, services, element);
+        return JSONForms.RenderDescriptionFactory.createContainerDescription(100, renderedElements, template, services, element);
     }
 
     isApplicable(uiElement: IUISchemaElement, subSchema: SchemaElement, schemaPath): boolean {
diff --git a/components/renderers/layouts/horizontal/horizontal-renderer.ts b/components/renderers/layouts/horizontal/horizontal-renderer.ts
index 9397e4570..680719b80 100644
--- a/components/renderers/layouts/horizontal/horizontal-renderer.ts
+++ b/components/renderers/layouts/horizontal/horizontal-renderer.ts
@@ -8,7 +8,7 @@ class HorizontalRenderer implements JSONForms.IRenderer {
 
     render(element: ILayout, subSchema: SchemaElement, schemaPath:String, services: JSONForms.Services): JSONForms.IContainerRenderDescription {
 
-        var maxSize = 99;
+        var maxSize = 100;
 
         var renderedElements = JSONForms.RenderDescriptionFactory.renderElements(
             element.elements, this.renderService, services);
@@ -18,11 +18,12 @@ class HorizontalRenderer implements JSONForms.IRenderer {
             renderedElements[j].size = individualSize;
         }
 
-        var template =`<jsonforms-layout><fieldset>
-                   <div class="row">
-                     <jsonforms-dynamic-widget ng-repeat="child in element.elements" element="child"></jsonforms-dynamic-widget>
-                   </div>
-                 </fieldset></jsonforms-layout>`;
+        var template =`<jsonforms-layout class="jsf-horizontal-layout">
+          <fieldset>
+            <div class="row">
+              <jsonforms-dynamic-widget ng-repeat="child in element.elements" element="child"></jsonforms-dynamic-widget>
+            </div>
+          </fieldset></jsonforms-layout>`;
 
         return JSONForms.RenderDescriptionFactory.createContainerDescription(maxSize, renderedElements, template, services, element);
     };
diff --git a/components/renderers/layouts/vertical/vertial.spec.ts b/components/renderers/layouts/vertical/vertial.spec.ts
index a380b3071..b9a563d84 100644
--- a/components/renderers/layouts/vertical/vertial.spec.ts
+++ b/components/renderers/layouts/vertical/vertial.spec.ts
@@ -12,7 +12,7 @@ describe('VerticalLayout', () => {
     beforeEach(module('components/renderers/controls/control.html'));
 
     it("should not support labels", inject(($rootScope, $compile) => {
-        var scope = $rootScope.$new();
+        let scope = $rootScope.$new();
         scope.schema = {
             "properties": {
                 "foo": { "type": "string" }
@@ -30,9 +30,11 @@ describe('VerticalLayout', () => {
             ]
         };
         scope.data = { "name": "John Doe "};
-        var el = $compile('<jsonforms schema="schema" ui-schema="uiSchema" data="data"/>')(scope);
+        let el = $compile('<jsonforms schema="schema" ui-schema="uiSchema" data="data"/>')(scope);
         scope.$digest();
-        var div = el.find('div');
-        expect(div.hasClass('jsf-vertical-layout')).toBeTruthy();
+        let div = el.find('div');
+        console.log(div.children());
+        let layout = angular.element(div.children()[0]);
+        expect(layout.hasClass('jsf-vertical-layout')).toBeTruthy();
     }));
 });
\ No newline at end of file
diff --git a/components/renderers/layouts/vertical/vertical-renderer.ts b/components/renderers/layouts/vertical/vertical-renderer.ts
index 642d38fc6..64015afe1 100644
--- a/components/renderers/layouts/vertical/vertical-renderer.ts
+++ b/components/renderers/layouts/vertical/vertical-renderer.ts
@@ -9,14 +9,14 @@ class VerticalRenderer implements JSONForms.IRenderer {
     render(element: ILayout, subSchema: SchemaElement, schemaPath: string, services: JSONForms.Services): JSONForms.IContainerRenderDescription {
         var renderedElements = JSONForms.RenderDescriptionFactory.renderElements(
             element.elements, this.renderService, services);
-        var template = `<jsonforms-layout class="jsf-vertical-layout">
-              <fieldset>
+        var template = `<div ng-show='element.elements.length'>
+          <jsonforms-layout class="jsf-vertical-layout">
                 <jsonforms-dynamic-widget ng-repeat="child in element.elements" element="child">
                 </jsonforms-dynamic-widget>
-             </fieldset>
-            </jsonforms-layout>`;
+          </jsonforms-layout>
+        </div>`;
 
-        return JSONForms.RenderDescriptionFactory.createContainerDescription(99, renderedElements, template, services, element);
+        return JSONForms.RenderDescriptionFactory.createContainerDescription(100, renderedElements, template, services, element);
     }
 
     isApplicable(uiElement: IUISchemaElement, jsonSchema: SchemaElement, schemaPath) :boolean {
diff --git a/components/services/services.ts b/components/services/services.ts
index c9df695bf..acf0d9021 100644
--- a/components/services/services.ts
+++ b/components/services/services.ts
@@ -108,7 +108,7 @@ module JSONForms{
             results['errors'].forEach((error) => {
                 if (error['schemaPath'].indexOf("required") != -1) {
                     var propName = error['dataPath'] + "/" + error['params']['key'];
-                    this.validationResults.get(instance)[propName] = "Missing property";
+                    this.validationResults.get(instance)[propName] = "Required";
                 } else {
                     this.validationResults.get(instance)[error['dataPath']] = error['message'];
                 }
diff --git a/examples/app/arrays/arrays.html b/examples/app/arrays/arrays.html
index fe24e26ab..ec87b8c6a 100644
--- a/examples/app/arrays/arrays.html
+++ b/examples/app/arrays/arrays.html
@@ -1,4 +1,4 @@
-<div class="panel panel-default">
+<div class="panel">
     <div class="panel-heading">
         <h3>Bound data</h3>
     </div>
@@ -7,8 +7,7 @@ <h3>Bound data</h3>
     </div>
 </div>
 
-<div class="panel panel-default">
-
+<div class="panel">
     <div class="panel-heading">
         <h3>JSONForms generated Forms</h3>
     </div>
diff --git a/examples/app/custom/custom.html b/examples/app/custom/custom.html
index f63a90a93..acc725ea5 100644
--- a/examples/app/custom/custom.html
+++ b/examples/app/custom/custom.html
@@ -1,19 +1,18 @@
-
-<div class="panel panel-default">
+<div class="panel">
     <div class="panel-heading">
-        <h3>Bound data</h3>
+        <h3>JSONForms generated Forms</h3>
     </div>
     <div class="panel-body">
-        {{vm.formattedData()}}
+        <jsonforms schema="vm.schema" ui-schema="vm.uiSchema" data="vm.data"></jsonforms>
     </div>
 </div>
 
-<div class="panel panel-default">
+<div class="panel">
     <div class="panel-heading">
-        <h3>JSONForms generated Forms</h3>
+        <h3>Bound data</h3>
     </div>
     <div class="panel-body">
-        <jsonforms schema="vm.schema" ui-schema="vm.uiSchema" data="vm.data"></jsonforms>
+        <pre>{{vm.formattedData()}}</pre>
     </div>
 </div>
 
diff --git a/examples/app/default-ui/defaultui.html b/examples/app/default-ui/defaultui.html
index 3b623b1ed..a68e2e14c 100644
--- a/examples/app/default-ui/defaultui.html
+++ b/examples/app/default-ui/defaultui.html
@@ -1,18 +1,17 @@
-<div class="panel panel-default">
+<div class="panel">
     <div class="panel-heading">
-        <h3>Bound data</h3>
+        <h3>JSONForms generated default Forms</h3>
     </div>
     <div class="panel-body">
-        {{vm.formattedData()}}
+        <jsonforms schema="vm.schema" ui-schema="vm.uiSchema" data="vm.data"></jsonforms>
     </div>
 </div>
-
-<div class="panel panel-default">
+<div class="panel">
     <div class="panel-heading">
-        <h3>JSONForms generated default Forms</h3>
+        <h3>Bound data</h3>
     </div>
     <div class="panel-body">
-        <jsonforms schema="vm.schema" ui-schema="vm.uiSchema" data="vm.data"></jsonforms>
+        <pre>{{vm.formattedData()}}</pre>
     </div>
 </div>
 
diff --git a/examples/app/default/default-schema.html b/examples/app/default/default-schema.html
index c223cac20..37ac09239 100644
--- a/examples/app/default/default-schema.html
+++ b/examples/app/default/default-schema.html
@@ -1,18 +1,18 @@
-<div class="panel panel-default">
+<div class="panel">
     <div class="panel-heading">
-        <h3>Bound data</h3>
+        <h3>JSONForms generated default schema and default forms</h3>
     </div>
     <div class="panel-body">
-        {{vm.formattedData()}}
+        <jsonforms schema="vm.schema" ui-schema="vm.uiSchema" data="vm.data"></jsonforms>
     </div>
 </div>
 
-<div class="panel panel-default">
+<div class="panel">
     <div class="panel-heading">
-        <h3>JSONForms generated default schema and default forms</h3>
+        <h3>Bound data</h3>
     </div>
     <div class="panel-body">
-        <jsonforms schema="vm.schema" ui-schema="vm.uiSchema" data="vm.data"></jsonforms>
+        <pre>{{vm.formattedData()}}</pre>
     </div>
 </div>
 
diff --git a/examples/app/local/local.controller.js b/examples/app/local/local.controller.js
index 76e287f0e..b702a2e00 100644
--- a/examples/app/local/local.controller.js
+++ b/examples/app/local/local.controller.js
@@ -36,11 +36,12 @@ angular.module('makeithappen').controller('LocalController', function() {
             "occupation": {
                 "type": "string"
             },
-            "test_wrong": {
+            /* FIXME: disabling arrays for primitive types */
+            /*"test_wrong": {
                 "type": "array",
                 "items": {"type":"string"}
-            },
-            "test_correct": {
+            },*/
+            "hobbies": {
                 "type": "array",
                 "items": {"type":"object","properties": {"name": {"type": "string"}}}
             }
@@ -48,8 +49,7 @@ angular.module('makeithappen').controller('LocalController', function() {
         "required": ["occupation", "nationality"]
     };
     vm.uiSchema = {
-        "type": "Group",
-        "label": "This is a fancy label",
+        "type": "VerticalLayout",
         "elements": [
             {
                 "type": "VerticalLayout",
@@ -225,38 +225,6 @@ angular.module('makeithappen').controller('LocalController', function() {
             {
                 name: 'Jimmy',
                 personalData:{age: 32}
-            },
-            {
-                name: 'Max',
-                personalData:{age: 35}
-            },
-            {
-                name: 'Jonas',
-                personalData:{age: 34}
-            },
-            {
-                name: 'Edgar',
-                personalData:{age: 30}
-            },
-            {
-                name: 'Eugen',
-                personalData:{age: 29}
-            },
-            {
-                name: 'Johannes',
-                personalData:{age: 26}
-            },
-            {
-                name: 'Alex',
-                personalData:{age: 25}
-            },
-            {
-                name: 'Stefan',
-                personalData:{age: 27}
-            },
-            {
-                name: 'Eva',
-                personalData:{age: 30}
             }
         ]
     };
diff --git a/examples/app/local/local.html b/examples/app/local/local.html
index 6331b17ef..69317f208 100644
--- a/examples/app/local/local.html
+++ b/examples/app/local/local.html
@@ -1,22 +1,27 @@
-<div class="panel panel-default">
+<div class="panel">
     <div class="panel-heading">
-        <h3>Bound data</h3>
+        <h3>Basic controls</h3>
     </div>
     <div class="panel-body">
-        <pre>{{vm.formattedData()}}</pre>
+        <jsonforms schema="vm.schema" ui-schema="vm.uiSchema" data="vm.data"></jsonforms>
     </div>
 </div>
 
-<div class="panel panel-default">
+<div class="panel">
     <div class="panel-heading">
-        <h3>JSONForms generated Forms</h3>
-    </div>
-    <div class="panel-body">
-        <jsonforms schema="vm.schema" ui-schema="vm.uiSchema" data="vm.data"></jsonforms>
+        <h3>Master/Detail control</h3>
     </div>
     <div class="panel-body">
         <jsonforms schema="vm.usersSchema" ui-schema="vm.usersUiSchema" data="vm.users"></jsonforms>
     </div>
 </div>
 
+<div class="panel">
+    <div class="panel-heading">
+        <h3>Bound data</h3>
+    </div>
+    <div class="panel-body">
+        <pre>{{vm.formattedData()}}</pre>
+    </div>
+</div>
 
diff --git a/examples/app/placeholder/placeholder-posts.html b/examples/app/placeholder/placeholder-posts.html
index 259fb50b7..ea21d84c1 100644
--- a/examples/app/placeholder/placeholder-posts.html
+++ b/examples/app/placeholder/placeholder-posts.html
@@ -1,9 +1,9 @@
-<h1>Posts</h1>
-    <div ng-if="vm.id">
+<h2>Posts</h2>
+<div ng-if="vm.id">
     <jsonforms schema="vm.postSchema" data="vm.PostsDataProvider"></jsonforms>
-    </div>
-    <div ng-if="!vm.id">
+</div>
+<div ng-if="!vm.id">
     <jsonforms schema="vm.postsSchema" ui-schema="vm.postsUiSchema" data="vm.PostsDataProvider"></jsonforms>
-    </div>
+</div>
 
 
diff --git a/examples/app/polymer/polymer.html b/examples/app/polymer/polymer.html
index d54faca4a..ff4a47186 100644
--- a/examples/app/polymer/polymer.html
+++ b/examples/app/polymer/polymer.html
@@ -1,4 +1,5 @@
-<div class="panel panel-default">
+<jsonforms data="vm.data" ui-schema="vm.uiSchema" schema="vm.schema"></jsonforms>
+<div class="panel">
     <div class="panel-heading">
         <h3>Bound data</h3>
     </div>
@@ -7,6 +8,3 @@ <h3>Bound data</h3>
     </div>
 </div>
 
-<jsonforms data="vm.data" ui-schema="vm.uiSchema" schema="vm.schema"></jsonforms>
-
-
diff --git a/examples/assets/images/bg.jpg b/examples/assets/images/bg.jpg
new file mode 100644
index 000000000..8bb9d5b73
Binary files /dev/null and b/examples/assets/images/bg.jpg differ
diff --git a/examples/css/main.css b/examples/css/main.css
new file mode 100644
index 000000000..fdb56f021
--- /dev/null
+++ b/examples/css/main.css
@@ -0,0 +1,144 @@
+h1 {
+    color: white;
+}
+
+.jsf h2 {
+    color: white;
+}
+
+.jsf label {
+    color: white;
+}
+
+body {
+    background-image: url('../assets/images/bg.jpg');
+    font-family: 'Open Sans', sans-serif;
+}
+
+.panel > .panel-heading {
+    background: #CEDB50 none;
+    color: black;
+}
+
+
+.jsf .panel-default > .panel-heading {
+    background: #337AB7 none;
+    color: white;
+}
+
+.panel > .panel-body {
+    background: #0C2339 none;
+}
+
+* {
+    border-radius: 0 !important;
+}
+
+.jsf-vertical-layout > [class*="col-"] {
+    padding-left: 0px !important;
+    padding-right: 0px !important;
+}
+
+.jsf-group > [class*="col-"] {
+    padding-left: 0px !important;
+    padding-right: 0px !important;
+}
+
+
+.jsf-group {
+    /*background-color: #161716;*/
+    color: white;
+    border: 0 solid #337AB7;
+    padding: 0;
+    background-color: #0C2339;
+}
+
+.jsf .row  {
+    margin-right: 0;
+    margin-left: 0;
+}
+
+.jsf-control {
+}
+
+.jsf .alert {
+    padding: 5px;
+    margin-top: 0.5em;
+    margin-bottom: 0.5em;
+    color: white;
+    background-color: #FF263F;
+}
+
+
+.jsf .panel {
+    border: 1px solid #337AB7;
+}
+
+.jsf-vertical-layout {
+    background-color: #0C2339;
+    color: white;
+    border: 1px solid #337AB7;
+    padding-top: 5px;
+}
+
+.jsf-label {
+    font-size: 1.25em;
+    /*background-color: #6AAED8;*/
+}
+
+.accordion-group {
+    background: #99B2B7 none;
+    color: white;
+}
+
+.accordion-heading {
+    background: #99B2B7 none;
+    color: white;
+}
+
+.accordion {
+    background: #99B2B7 none;
+    color: white;
+}
+
+.jsf legend {
+    color: white;
+}
+
+.footer {
+    color: white;
+}
+
+.jsf-masterdetail{
+
+}
+
+.jsf .jsf-masterdetail .panel-body {
+    padding-bottom: 0;
+}
+.jsf .jsf-masterdetail .panel-group {
+    margin-bottom: 5px;
+}
+
+.jsf .jsf-masterdetail .jsf-masterdetail-empty .panel-body {
+    padding-bottom: 0;
+    padding-top: 0;
+}
+.jsf .jsf-masterdetail .jsf-masterdetail-empty .panel-heading + .panel-collapse .panel-body {
+    border-width: 0;
+}
+.jsf .jsf-masterdetail .jsf-masterdetail-empty .panel-group {
+    margin-bottom: 0;
+    border-width: 0;
+}
+.jsf-masterdetail-selected {
+    font-weight: bold;
+    color: #CEDB50;
+}
+.jsf-masterdetail-property {
+    font-style: italic;
+    color: white;
+}
+.jsf-masterdetail-header {
+    text-decoration: none;
+}
diff --git a/examples/embed-index.html b/examples/embed-index.html
index e161b6198..254310160 100644
--- a/examples/embed-index.html
+++ b/examples/embed-index.html
@@ -19,6 +19,7 @@
     <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css"/>
     <link rel="stylesheet" href="css/jsonforms.css"/>
     <link rel="stylesheet" href="css/main.css"/>
+    <link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
 
     <script src="bower_components/tv4/tv4.js"></script>
     <script src="bower_components/ace-builds/src-min-noconflict/ace.js"
@@ -68,22 +69,18 @@
 <body>
 <div class="container">
     <div class="row" id="demo">
-        <div class="col-sm-12">
-            <div class="panel-primary panel-default">
-                <div class="panel-heading">
-                    <h3 class="panel-title"><strong>Demo</strong></h3>
-                </div>
-                <div class="panel-body" style="line-height: 2.0">
-                    <div id="demo-body" ng-view class="jsf"></div>
-                </div>
-            </div>
+        <div class="col-md-12">
+            <h1 style="margin-bottom: 1em"><strong>JSON Forms Demo</strong></h1>
+            <div id="demo-body" ng-view class="jsf"></div>
         </div>
     </div>
 
     <div class ="row">
         <br>
         <footer class="footer col-sm-12">
-            <p>&copy; EclipseSource 2015</p>
+            <p>&copy; EclipseSource 2015<br>
+            Background image by <a href="http://dakoder.deviantart.com/art/MinFlat-Android-L-Wallpaper-Moonshine-4K-475314187">dakoder</a>
+            </p>
         </footer>
     </div>