diff --git a/src/Umbraco.Web.UI.Client/gulp/config.js b/src/Umbraco.Web.UI.Client/gulp/config.js
index 705074a18f..af6973ddcb 100755
--- a/src/Umbraco.Web.UI.Client/gulp/config.js
+++ b/src/Umbraco.Web.UI.Client/gulp/config.js
@@ -9,14 +9,15 @@ module.exports = {
             installer: { files: ["./src/less/installer.less"], out: "installer.css" },
             nonodes: { files: ["./src/less/pages/nonodes.less"], out: "nonodes.style.min.css"},
             preview: { files: ["./src/less/canvas-designer.less"], out: "canvasdesigner.css" },
-            umbraco: { files: ["./src/less/belle.less"], out: "umbraco.css" }
+            umbraco: { files: ["./src/less/belle.less"], out: "umbraco.css" },
+            rteContent: { files: ["./src/less/rte-content.less"], out: "rte-content.css" }
         },
 
         //js files for backoffie
         //processed in the js task
         js: {
             preview: { files: ["./src/preview/**/*.js"], out: "umbraco.preview.js" },
-            installer: { files: ["./src/installer/**/*.js"], out: "umbraco.installer.js" },            
+            installer: { files: ["./src/installer/**/*.js"], out: "umbraco.installer.js" },
             filters: { files: ["./src/common/filters/**/*.js"], out: "umbraco.filters.js" },
             resources: { files: ["./src/common/resources/**/*.js"], out: "umbraco.resources.js" },
             services: { files: ["./src/common/services/**/*.js"], out: "umbraco.services.js" },
@@ -24,13 +25,13 @@ module.exports = {
 
             //the controllers for views
             controllers: {
-                files: [                    
+                files: [
                     "./src/views/**/*.controller.js",
                     "./src/*.controller.js"
                 ], out: "umbraco.controllers.js"
             },
 
-            //directives/components 
+            //directives/components
             // - any JS file found in common / directives or common/ components
             // - any JS file found inside views that has the suffix .directive.js or .component.js
             directives: {
diff --git a/src/Umbraco.Web.UI.Client/src/common/services/tinymce.service.js b/src/Umbraco.Web.UI.Client/src/common/services/tinymce.service.js
index ef7461d699..12c7ea8254 100644
--- a/src/Umbraco.Web.UI.Client/src/common/services/tinymce.service.js
+++ b/src/Umbraco.Web.UI.Client/src/common/services/tinymce.service.js
@@ -94,6 +94,10 @@ function tinyMceService($rootScope, $q, imageHelper, $locale, $http, $timeout, s
         }
 
         return $q.all(promises).then(function() {
+            // Always push our Umbraco RTE stylesheet
+            // So we can style macros, embed items etc...
+            stylesheets.push(`${Umbraco.Sys.ServerVariables.umbracoSettings.umbracoPath}/assets/css/rte-content.css`);
+
             return $q.when({ stylesheets: stylesheets, styleFormats: styleFormats});
         });
     }
@@ -320,10 +324,6 @@ function tinyMceService($rootScope, $q, imageHelper, $locale, $http, $timeout, s
                     //see http://archive.tinymce.com/wiki.php/Configuration:cache_suffix
                     cache_suffix: "?umb__rnd=" + Umbraco.Sys.ServerVariables.application.cacheBuster,
 
-                    //this is used to style the inline macro bits, sorry hard coding this form now since we don't have a standalone
-                    //stylesheet to load in for this with only these styles (the color is @pinkLight)
-                    content_style: ".mce-content-body .umb-macro-holder { border: 3px dotted #f5c1bc; padding: 7px; display: block; margin: 3px; } .umb-rte .mce-content-body .umb-macro-holder.loading {background: url(assets/img/loader.gif) right no-repeat; background-size: 18px; background-position-x: 99%;}",
-
                     // This allows images to be pasted in & stored as Base64 until they get uploaded to server
                     paste_data_images: true,
 
diff --git a/src/Umbraco.Web.UI.Client/src/less/rte-content.less b/src/Umbraco.Web.UI.Client/src/less/rte-content.less
new file mode 100644
index 0000000000..f133ac8535
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/less/rte-content.less
@@ -0,0 +1,32 @@
+@import "variables.less";
+
+.mce-content-body .umb-macro-holder {
+    border: 3px dotted @pinkLight;
+    padding: 7px;
+    display: block;
+    margin: 3px;
+}
+
+
+.umb-rte .mce-content-body .umb-macro-holder.loading {
+    background: url(assets/img/loader.gif) right no-repeat;
+    background-size: 18px; background-position-x: 99%;
+}
+
+
+.umb-rte .mceNonEditable.embeditem {
+    position:relative;
+}
+
+.umb-rte .mceNonEditable.embeditem::before {
+    z-index:1000;
+    width:100%;
+    height:100%;
+    position:absolute;
+    content:' ';
+    background:rgba(0,0,0,0.1);
+}
+
+.umb-rte .mceNonEditable.embeditem[data-mce-selected] {
+    outline: 2px solid @pinkLight;
+}
\ No newline at end of file