diff --git a/src/Umbraco.Web.UI.Client/src/views/mediatypes/views/permissions/permissions.controller.js b/src/Umbraco.Web.UI.Client/src/views/mediatypes/views/permissions/permissions.controller.js
index e424d58929..1d865f2fa0 100644
--- a/src/Umbraco.Web.UI.Client/src/views/mediatypes/views/permissions/permissions.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/mediatypes/views/permissions/permissions.controller.js
@@ -1,7 +1,7 @@
 (function() {
     'use strict';
 
-    function PermissionsController($scope, mediaTypeResource, iconHelper, contentTypeHelper, localizationService) {
+    function PermissionsController($scope, mediaTypeResource, iconHelper, contentTypeHelper, localizationService, overlayService) {
 
         /* ----------- SCOPE VARIABLES ----------- */
 
@@ -43,20 +43,23 @@
         }
 
         function addChild($event) {
-            vm.childNodeSelectorOverlay = {
+            var childNodeSelectorOverlay = {
                 view: "itempicker",
                 title: childNodeSelectorOverlayTitle,
                 availableItems: vm.mediaTypes,
                 selectedItems: vm.selectedChildren,
+                position: "target",
                 event: $event,
-                show: true,
                 submit: function(model) {
                     vm.selectedChildren.push(model.selectedItem);
                     $scope.model.allowedContentTypes.push(model.selectedItem.id);
-                    vm.childNodeSelectorOverlay.show = false;
-                    vm.childNodeSelectorOverlay = null;
+                    overlayService.close();
+                },
+                close: function() {
+                    overlayService.close();
                 }
             };
+            overlayService.open(childNodeSelectorOverlay);
         }
 
         function removeChild(selectedChild, index) {
diff --git a/src/Umbraco.Web.UI.Client/src/views/mediatypes/views/permissions/permissions.html b/src/Umbraco.Web.UI.Client/src/views/mediatypes/views/permissions/permissions.html
index 9fa2efe9fc..caa4c4dc11 100644
--- a/src/Umbraco.Web.UI.Client/src/views/mediatypes/views/permissions/permissions.html
+++ b/src/Umbraco.Web.UI.Client/src/views/mediatypes/views/permissions/permissions.html
@@ -2,51 +2,34 @@
     <umb-box>
         <umb-box-content>
             <div class="sub-view-columns">
-
                 <div class="sub-view-column-left">
                     <h5><localize key="contentTypeEditor_allowAsRootHeading" /></h5>
                     <small><localize key="contentTypeEditor_allowAsRootDescription" /></small>
                 </div>
                 <div class="sub-view-column-right">
-            <umb-toggle
-                checked="model.allowAsRoot"
-                on-click="vm.toggle()"
-                hotkey="alt+shift+r"
-                >
-            </umb-toggle>
+                    <umb-toggle
+                        checked="model.allowAsRoot"
+                        on-click="vm.toggle()"
+                        hotkey="alt+shift+r">
+                    </umb-toggle>
                 </div>
-        
             </div>
-        
             <div class="sub-view-columns">
-        
                 <div class="sub-view-column-left">
                     <h5><localize key="contentTypeEditor_childNodesHeading" /></h5>
                     <small><localize key="contentTypeEditor_childNodesDescription" /></small>
                 </div>
-        
                 <div class="sub-view-column-right">
-        
                     <umb-child-selector
-                            selected-children="vm.selectedChildren"
-                            available-children="vm.mediaTypes"
-                            parent-name="model.name"
-                            parent-icon="model.icon"
-                            parent-id="model.id"
-                            on-add="vm.addChild"
-                            on-remove="vm.removeChild">
-                    </umb-child-selector>
-        
-                    <umb-overlay
-                        ng-if="vm.childNodeSelectorOverlay.show"
-                        model="vm.childNodeSelectorOverlay"
-                        position="target"
-                        view="vm.childNodeSelectorOverlay.view">
-                    </umb-overlay>
-        
-        
+                        selected-children="vm.selectedChildren"
+                        available-children="vm.mediaTypes"
+                        parent-name="model.name"
+                        parent-icon="model.icon"
+                        parent-id="model.id"
+                        on-add="vm.addChild"
+                        on-remove="vm.removeChild">
+                    </umb-child-selector>        
                 </div>
-        
             </div>
         </umb-box-content>
     </umb-box>