diff --git a/sapl/static/js/compilacao_edit.js b/sapl/static/js/compilacao_edit.js
index 5b17f425e..975ef264b 100644
--- a/sapl/static/js/compilacao_edit.js
+++ b/sapl/static/js/compilacao_edit.js
@@ -1,317 +1,312 @@
+function DispositivoEdit() {
+    // Função única - Singleton pattern - operador new sempre devolve o mesmo objeto
+    var instance;
 
-var editortype = "textarea";
-var onSubmitEditForm = function(event) {
+    var editortype = "textarea";
 
-    var texto = '';
-    var editorTiny = tinymce.get('editdi_texto');
-
-    if (editorTiny != null)
-        texto = editorTiny.getContent();
-    else
-        texto = $('#editdi_texto').val();
-
-    var formData = {
-        'csrfmiddlewaretoken' : $('input[name=csrfmiddlewaretoken]').val(),
-        'texto'               : texto
+    if (!(this instanceof DispositivoEdit)) {
+        if (!instance) {
+            instance = new DispositivoEdit();
+        }
+        return instance;
+    }
+    instance = this;
+    DispositivoEdit = function() {
+        return instance;
     };
+    instance.clearEditSelected = function() {
+        $('.dpt-selected .dpt-form').html('');
+        $('.dpt-actions, .dpt-actions-bottom').html('');
+        tinymce.remove();
+        $('.dpt-selected').removeClass('dpt-selected');
+    }
 
-    var url = $('.csform form').attr( "action_ajax" );
-    $("#message_block").css("display", "block");
-
-    $.post(url, formData)
-    .done(function(data) {
+    instance.editDispositivo = function(event) {
+        var obj_click = (event.target.classList.contains('dpt-link')
+                            ? event.target
+                            : (event.target.parentElement.classList.contains('dpt-link')
+                                ? event.target.parentElement
+                                : null));
 
-        if (typeof data == "string") {
-            $('.dpt-selected').html(data);
-            clearEditSelected();
-            reloadFunctionClicks();
+        if (obj_click && obj_click.getAttribute('href') && obj_click.getAttribute('href').length > 0)
             return;
-        }
-
-        clearEditSelected();
 
-        if (data.pk != null)
-            refreshScreenFocusPk(data);
-        else {
-            alert('Erro na inserção!');
-            flag_refresh_all = false;
+        var dpt = $(this).closest('.dpt');
+        if (dpt.hasClass('dpt-selected')) {
+            instance.clearEditSelected();
+            return;
         }
-
-    }).always(function() {
-        $("#message_block").css("display", "none");
-    });
-    if (event != null)
-        event.preventDefault();
-}
-
-
-var clickEditDispositivo = function(event) {
-    var _pk = event.currentTarget.getAttribute('pk');
-    if ($('#dpt'+_pk).hasClass("dpt-selected")) {
-        clearEditSelected();
-        return;
+        instance.clearEditSelected();
+
+        dpt.on('get_form_base', function () {
+            var _this = $(this);
+            _this.addClass('dpt-selected');
+            instance.scrollTo(_this);
+            _this.off('get_form_base')
+
+            var btn_fechar = _this.find('.btns-excluir');
+            _this.find('.dpt-actions-bottom').last().append(btn_fechar);
+            btn_fechar.on('click', function() {
+                instance.clearEditSelected();
+            });
+
+            btn_fechar.on('click', function() {
+                var action = this.getAttribute('action');
+                var pk = $(this).closest('.dpt-selected').attr('pk');
+                if (pk !== undefined) {
+                    var url = pk+'/refresh?action='+action;
+                    instance.waitShow();
+                    $.get(url).done(function(data) {
+                        instance.clearEditSelected();
+                        if (data.pk != null) {
+                            if (!instance.modalMessage(data.message.value, 'alert-'+data.message.value, function() {
+                                    instance.waitHide();
+                                }))
+                            instance.refreshScreenFocusPk(data);
+                        }
+                    });
+                }
+            });
+        });
+        instance.loadForm(dpt, 'get_form_base');
     }
-    clearEditSelected();
-    clickUpdateDispositivo(event);
-}
 
-var clickUpdateDispositivo = function(event, __pk_refresh, __pk_edit, __action, flag_actions_vibible, flag_refresh_all) {
-
-    var pk_refresh = __pk_refresh;
-    var pk_edit = __pk_edit;
-    var _action = __action;
-    var _variacao = '';
-    var _tipo_pk = '';
-    var _perfil_pk = '';
-
-    if (event != null) {
-        pk_refresh = event.currentTarget.getAttribute('pk');
-        _action = $(this).attr('action');
-        _variacao = $(this).attr('variacao');
-        _tipo_pk = $(this).attr('tipo_pk');
-        _perfil_pk = $(this).attr('perfil_pk');
+    instance.loadForm = function(dpt, trigger) {
+        if (editortype == "construct")
+            return;
+        var dpt_form = dpt.children().filter('.dpt-form');
+        if (dpt_form.length == 1) {
+            var pk = dpt.attr('pk');
+            var url = pk+'/refresh?action='+trigger;
+            $.get(url).done(function(data) {
+                dpt_form.html(data);
+                dpt_form.find('form').submit(instance.onSubmitEditFormBase);
+                if (editortype == 'tinymce' ) {
+                    initTinymce();
+                }
+                dpt.trigger(trigger);
+            }).always(function() {
+                instance.waitHide();
+            });
+        }
     }
 
-    if (pk_edit == null)
-        pk_edit = pk_refresh;
-
-    var url = '';
-    if (_action == '')
-        return;
-    else if ( _action == null) {
-        url = pk_refresh+'/refresh?edit='+pk_edit;
-    }
-    else if (_action.startsWith('refresh')) {
-        var str = _action.split(':');
-        if (str.length > 1) {
-            if(_action.endsWith('perfil')) {
-                url = '&perfil_pk='+_perfil_pk;
-                $("#message_block").css("display", "block");
-            }
-            else {
-                editortype = str[1];
-                SetCookie("editortype", editortype, 30)
-            }
+    instance.modalMessage = function(message, alert, closeFunction) {
+        if (message != null && message != '') {
+            $('#modal-message #message').html(message);
+            $('#modal-message').modal('show');
+            $('#modal-message, #modal-message .alert button').off();
+            $('#modal-message .alert').removeClass('alert-success alert-info alert-warning alert-danger alert-danger');
+            $('#modal-message .alert').addClass(alert);
+
+            if (closeFunction != null)
+                $('#modal-message').on('hidden.bs.modal', closeFunction);
+
+            $('#modal-message .alert button').on('click', function() {
+                $('#modal-message').modal('hide');
+            });
+            return true;
         }
-        url = pk_refresh+'/refresh?edit='+pk_edit+url;
+        return false;
     }
-    else if (_action.startsWith('add_')) {
-
-        url = pk_refresh+'/actions?action='+_action;
-        url += '&tipo_pk='+_tipo_pk;
-        url += '&variacao='+_variacao;
-
-        $("#message_block").css("display", "block");
 
+    instance.message = function(data) {
+        if (!('message' in data))
+            return;
+        var cp_notify = $(".cp-notify")
+        cp_notify.removeClass('hide')
+        var msg = cp_notify.find('.message');
+        msg.text(data.message.value);
+        msg.removeClass('bg-primary bg-success bg-info bg-warning bg-danger').addClass('bg-'+data.message.type);
+        setTimeout(function() {
+            cp_notify.addClass('hide');
+        }, (data.message.time?data.message.time: 3000));
     }
-    else if (_action.startsWith('set_')) {
-
-        url = pk_refresh+'/actions?action='+_action;
-        $("#message_block").css("display", "block");
-
+    instance.offClicks = function() {
+        $('.btn-dpt-edit').off()
     }
-    else if (_action.startsWith('delete_')) {
-        var r = confirm("Confirma Exclusão deste dispositivo?");
-        if (!r) {
-            return
-        }
-        url = pk_refresh+'/actions?action='+_action;
-        $("#message_block").css("display", "block");
+    instance.onClicks = function(container) {
+        var objects;
+        if (container == null)
+            objects = $('.btn-dpt-edit');
+        else
+            objects = $(container).find('.btn-dpt-edit');
+        objects.on('click', instance.editDispositivo);
     }
-
-    $.get(url).done(function( data ) {
-        if ( _action == null || _action.startsWith('refresh')) {
-
-            if (flag_refresh_all) {
-                if (flag_actions_vibible)
-                    clearEditSelected();
-
-                $( '#dpt' + pk_refresh ).html( data);
-            }
-            else {
-                //console.log(pk_refresh + ' - '+pk_edit)
-                if (flag_actions_vibible == null || flag_actions_vibible)
-                    clearEditSelected();
-
-                //$( '#dpt' + pk_refresh+' > .bloco' ).addClass('displaynone' );
-                $( '#dpt' + pk_refresh ).prepend( data );
+    instance.onSubmitEditFormBase = function(event) {
+
+        var _this = this;
+        var texto = '';
+        var texto_atualizador = '';
+        var visibilidade = '';
+        var editor_tiny_texto = tinymce.get('id_texto');
+        var editor_tiny_texto_atualizador = tinymce.get('id_texto_atualizador');
+
+        if (editor_tiny_texto != null)
+            texto = editor_tiny_texto.getContent();
+        else
+            texto = this['id_texto'].value;
+
+        if (editor_tiny_texto_atualizador != null)
+            texto_atualizador = editor_tiny_texto_atualizador.getContent();
+        else if ('id_texto_atualizador' in this)
+            texto_atualizador = this['id_texto_atualizador'].value;
+
+        if ('visibilidade' in this)
+            visibilidade = this['visibilidade'].value;
+
+        var form_data = {
+            'csrfmiddlewaretoken' : this['csrfmiddlewaretoken'].value,
+            'texto'               : texto,
+            'texto_atualizador'   : texto_atualizador,
+            'visibilidade'        : visibilidade
+        };
+
+        var url = $(this).closest('.dpt').attr( "pk" )+'/refresh';
+
+        instance.waitShow();
+
+        $.post(url, form_data)
+        .done(function(data) {
+            if (typeof data == "string") { /* if obsoleto */
+                var dpt = $(_this).closest('.dpt');
+                dpt = $('#'+dpt.replaceWith(data).attr('id'));
+                instance.onClicks(dpt);
+                instance.waitHide();
+                return;
             }
+            instance.clearEditSelected();
 
-            reloadFunctionClicks();
-
-            var _editortype = editortype;
-            if ( $('.edt-'+_editortype).length == 0) {
-                _editortype = 'construct';
-            }
-
-            if ( _editortype == 'tinymce' ) {
-                initTinymce();
-            }
-            else if (_editortype == 'textarea') {
-                $('.csform form').submit(onSubmitEditForm);
-            }
-            else if (_editortype == 'construct') {
-                $('.csform .btn-salvar').parent().addClass("displaynone");
-                $('.csform .btn-salvar, .csform .fields').addClass("displaynone");
-                $('#dpt'+pk_refresh).css('min-height', $('.actions_right').height()*2);
-                $('.actions_inserts').removeClass('menu_flutuante');
-            }
-            else if (_editortype == 'detail') { //TODO: código obsoleto - confirmar retirada desta condição
-                $('.csform .btn-salvar').parent().removeClass("displaynone");
-                $('.csform .btn-salvar,  .csform .fields').removeClass("displaynone");
-                $('#dpt'+pk_refresh).css('min-height', $('.actions_right').height()*2);
-                $('.actions_inserts').addClass('menu_flutuante');
-            }
-
-            $(".edt-"+_editortype).addClass('selected');
-
-            if (flag_actions_vibible == null || flag_actions_vibible) {
-                $('#dpt'+pk_edit).addClass('dpt-selected');
-                try {
-                    $('html, body').animate({
-                        scrollTop: $('#dpt' + pk_edit ).offset().top - window.innerHeight / 9
-                    }, 100);
-                }
-                catch(err) {
-                }
-            }
-        }
-
-        else if (_action == 'add_next' || _action == 'add_in') {
-            clearEditSelected();
             if (data.pk != null) {
-                refreshScreenFocusPk(data);
+                instance.refreshScreenFocusPk(data);
+                instance.message(data);
             }
             else {
-                alert('Erro na inserção!');
+                alert('Erro na resposta!');
             }
-        }
-        else if (_action.startsWith('delete_')) {
-            $("#message_block").css("display", "block");
-            clearEditSelected();
-            if (data.pk != null) {
-                if (!modalMessage(data.message, 'alert-danger', function() {
-                        //refreshScreenFocusPk(data);
-                    }))
-                    refreshScreenFocusPk(data);
+
+        }).always(function() {
+            instance.waitHide();
+        });
+        if (event != null)
+            event.preventDefault();
+    }
+    instance.refreshContent = function(pk, trigger_edit_pk) {
+        var url = pk+'/refresh';
+        $.get(url).done(function(data) {
+            var dpt = $('#id'+pk).closest('.dpt');
+            dpt = $('#'+dpt.replaceWith(data).attr('id'));
+            instance.onClicks(dpt);
+
+            if (trigger_edit_pk != null && trigger_edit_pk != 0) {
+                instance.triggerBtnDptEdit(trigger_edit_pk)
             }
             else {
-                alert('Erro exclusão de Dispositivo!');
+                instance.waitHide();
+            }
+        });
+    }
+    instance.refreshScreenFocusPk = function (data) {
+        if (data.pai[0] == -1) {
+            instance.waitShow()
+            href = location.href.split('#')[0]
+            location.href = href+'#'+data.pk;
+            location.reload(true)
             }
-        }
         else {
-            clearEditSelected();
-            reloadFunctionClicks();
-            modalMessage(data.message, 'alert-success', null);
+            instance.refreshContent(data.pai[0], data.pk);
+            setTimeout(function() {
+                for (var pai = 1; pai < data.pai.length; pai++)
+                    instance.refreshContent(data.pai[pai]);
+            }, 1000);
         }
+    }
 
-    }).always(function() {
-        $("#message_block").css("display", "none");
-    });
-}
-
-function modalMessage(message, alert, closeFunction) {
-    if (message != null && message != '') {
-        $('#modal-message #message').html(message);
-        $('#modal-message').modal('show');
-        $('#modal-message, #modal-message .alert button').off();
-        $('#modal-message .alert').removeClass('alert-success alert-info alert-warning alert-danger alert-danger');
-        $('#modal-message .alert').addClass(alert);
-
-        if (closeFunction != null)
-            $('#modal-message').on('hidden.bs.modal', closeFunction);
-
-        $('#modal-message .alert button').on('click', function() {
-            $('#modal-message').modal('hide');
+    instance.reloadFunctionsDraggables = function() {
+        $( ".dpt-alts" ).sortable({
+          revert: true,
+          distance: 15,
+          start: function( event, ui ) {
+          }
+          ,
+          stop: function( event, ui ) {
+              var pk = ui.item.attr('pk');
+              var bloco_pk = ui.item.closest('.dpt-alts').closest('.dpt').attr('pk');
+
+              var url = pk+'/refresh?action=json_drag_move_dpt_alterado&index='+ui.item.index()+'&bloco_pk='+bloco_pk;
+              $.get(url).done(function( data ) {
+                  console.log(pk+ ' - '+ bloco_pk);
+                  //reloadFunctionsForObjectsOfCompilacao();
+              });
+          }
         });
-        return true;
-    }
-    return false;
-}
 
-function refreshScreenFocusPk(data) {
+        $( ".dpt-alts .dpt" ).draggable({
+          connectToSortable: ".dpt-alts",
+          revert: 'invalid',
+          zIndex: 1,
+          distance: 15,
+          drag: function( event, ui ) {
+              //$('.dpt-comp-selected').removeClass('dpt-comp-selected');
+              $(".dpt-alts").addClass('drag');
+          },
+          stop: function( event, ui ) {
+              $(".dpt-alts").removeClass('drag');
+          },
+        });
 
-    if (data.pai[0] == -1) {
-        $("#message_block").css("display", "block");
-        href = location.href.split('#')[0]
-        location.href = href+'#'+data.pk;
-        location.reload(true)
+        $(".dpt-alts").disableSelection();
+    }
+    instance.scrollTo = function(dpt) {
+        try {
+            $('html, body').animate({
+                scrollTop: dpt.offset().top - window.innerHeight / 9
+            }, 100);
+        }
+        catch(err) {
         }
-    else {
-        clickUpdateDispositivo(null, data.pai[0], data.pk, 'refresh', true, true);
-        setTimeout(function() {
-            for (var pai = 1; pai < data.pai.length; pai++)
-                clickUpdateDispositivo(null, data.pai[pai], data.pk, 'refresh', false, true);
-        }, 1000);
     }
-}
+    instance.triggerBtnDptEdit =function(pk)  {
+        var btn_dpt_edit = $('#id'+pk + ' > .dpt-text.btn-dpt-edit');
+        if (btn_dpt_edit.length == 0)
+            btn_dpt_edit = $('#id'+pk + ' > .dpt-actions-fixed > .btn-dpt-edit');
+        btn_dpt_edit.trigger( "click" );
+    }
+    instance.waitHide = function() {
+         $("#wait_message").addClass("displaynone");
+    }
+    instance.waitShow = function() {
+         $("#wait_message").removeClass("displaynone");
+    }
 
-function clearEditSelected() {
-    $('.bloco' ).removeClass('displaynone' );
 
-    $(".container").removeClass('class_color_container');
-    tinymce.remove();
-    $('.dpt-selected').removeClass('dpt-selected');
-    $('.dpt').css('min-height', '');
-    $('.csform').remove();
+    instance.init = function() {
+        editortype = ReadCookie("editortype");
+        if (editortype == null || editortype == '') {
+            editortype = "textarea"
+            SetCookie("editortype", editortype, 30)
+        }
+        editortype = "textarea";
+        instance.offClicks();
+        instance.onClicks();
+        instance.reloadFunctionsDraggables();
+
+        href = location.href.split('#')
+        if (href.length == 2 && href[1] != '') {
+            instance.triggerBtnDptEdit(href[1])
+        }
+        $('main').click(function(event) {
+            if (event.target == this || event.target == this.firstElementChild)
+                instance.clearEditSelected();
+        });
+        instance.waitHide();
+    }
+    instance.init();
 }
 
-function reloadFunctionClicks() {
-    $('.dpt .de, .btn-action, .btn-edit').off();
-
-    $('.dpt .de, .btn-edit').on('click', clickEditDispositivo);
-
-    $('.btn-action').on('click', clickUpdateDispositivo);
-
-    $('#editdi_texto').focus();
-    $( ".bloco_alteracao" ).sortable({
-      revert: true,
-      stop: function( event, ui ) {
-          var pk = ui.item.attr('pk');
-          var bloco_pk = ui.item.closest('.bloco').closest('.dpt').attr('pk');
-
-          url = pk+'/actions?action=move_dpt_alterado&index='+ui.item.index()+'&bloco_pk='+bloco_pk;
-          $.get(url).done(function( data ) {
-              console.log(pk+ ' - '+ bloco_pk);
-          });
-      }
-    });
-
-    $( ".bloco_alteracao .dpt" ).draggable({
-      connectToSortable: ".bloco_alteracao",
-      revert: 'invalid',
-      zIndex: 1,
-      drag: function( event, ui ) {
-          $( ".bloco_alteracao" ).addClass('drag');
-      },
-      stop: function( event, ui ) {
-          $( ".bloco_alteracao" ).removeClass('drag');
-      },
-    });
-
-    $( ".bloco_alteracao" ).disableSelection();
-}
 
 $(document).ready(function() {
 
-    editortype = ReadCookie("editortype")
-
-    if (editortype == null || editortype == "") {
-        editortype = "textarea"
-        SetCookie("editortype", editortype, 30)
-    }
-
-    reloadFunctionClicks();
-    $("#message_block").css("display", "none");
-
-    href = location.href.split('#')
-    if (href.length == 2 && href[1] != '') {
-        clickUpdateDispositivo(null, href[1], href[1], 'refresh', true);
-    }
-
-    $('main').click(function(event) {
-        if (event.target == this || event.target == this.firstElementChild)
-            clearEditSelected();
-    });
+    DispositivoEdit();
 
 });
diff --git a/sapl/static/js/compilacao_view.js b/sapl/static/js/compilacao_view.js
index 0c15435dd..b5f70b89c 100644
--- a/sapl/static/js/compilacao_view.js
+++ b/sapl/static/js/compilacao_view.js
@@ -95,9 +95,14 @@ function textoMultiVigente(item, diff) {
     }
 
     if (elv) {
-        $('html, body').animate({
-            scrollTop: $(elv).parent().offset().top - 60
-        }, 0);
+        try {
+            $('html, body').animate({
+                scrollTop: $(elv).parent().offset().top - 60
+            }, 0);
+        }
+        catch(err) {
+        }
+
     }
 }
 
@@ -126,9 +131,13 @@ function textoVigente(item, link) {
             $(".link_alterador").addClass("displaynone");
 
     if (elv) {
-        $('html, body').animate({
-            scrollTop: $(elv).parent().offset().top - 60
-        }, 0);
+        try {
+            $('html, body').animate({
+                scrollTop: $(elv).parent().offset().top - 60
+            }, 0);
+        }
+        catch(err) {
+        }
     }
 }
 
diff --git a/sapl/static/styles/app.scss b/sapl/static/styles/app.scss
index 1b2571e6f..88cb0cebf 100644
--- a/sapl/static/styles/app.scss
+++ b/sapl/static/styles/app.scss
@@ -8,6 +8,12 @@
   float: none;
 }
 
+nav {
+  &.navbar {
+    border-radius: 0;
+  }
+}
+
 .masthead {
   padding: 10px;
   .nav {
@@ -139,7 +145,6 @@ fieldset {
     }
   }
 }
-
 .btn-primary, .btn-danger{
   font-size: 16px;
   height: 40px !important;
diff --git a/sapl/static/styles/compilacao.scss b/sapl/static/styles/compilacao.scss
index a35b694b8..66eb83e55 100644
--- a/sapl/static/styles/compilacao.scss
+++ b/sapl/static/styles/compilacao.scss
@@ -61,6 +61,7 @@ a:link:after, a:visited:after {
 
     -webkit-transition-delay: 0.4s; /* Safari */
     transition-delay: 0.4s;
+
     li {
       a {
         border-right: 0px !important;
@@ -84,7 +85,6 @@ a:link:after, a:visited:after {
         }
       }
     }
-    // This bridges the gap between the top bar and a dropdown.
     &::after {
       content: "";
       position: absolute;
@@ -93,27 +93,23 @@ a:link:after, a:visited:after {
       top: rem-calc(-25px);
       height: rem-calc(25px);
       width: 100%;
-      // This transition is for hover-on.
       transition: all 0.3s cubic-bezier(0.55,0,0.1,1);
     }
   }
   &:hover > ul {
-
     transform: translateY(7px);
-    // This transition is actually for when we hover-out of the dropdown.
     transition: transform 0.4s linear,
     opacity 0.4s linear,
     clip 0s 0.2s;
     opacity: 1;
     clip: rect(-100px, 2000px, 2000px, -100px);
-
   }
 
 }
 .test_import:nth-child(even) {
   background-color: #ccc;
 }
-#message_block {
+#wait_message {
   display: block;
   position: fixed;
   top: 0;
@@ -137,7 +133,35 @@ a:link:after, a:visited:after {
     box-shadow: 0 1px 2px #999;
   }
 }
-
+.text-center {
+  text-align: center;
+}
+.cp-notify {
+  z-index: 9999;
+  position:fixed;
+  top: 2em;
+  left: 50%;
+  min-width: 600px;
+  transform: translate(-50%, 0);
+  transition: all 0.4s ease;
+  opacity: 0.97;
+  &.hide {
+    opacity: 0;
+    top: -1000px;
+    display: block !important;
+    transition: all 0.4s ease;
+  }
+  .message {
+    padding: 1em;
+    border: 2px solid rgba(0, 0, 0, 0.1);
+    border-radius: 4px;
+    color:  rgba(0, 0, 0, 0.6);
+    line-height: 1em;
+    font-size: 1.3em;
+    text-align: center;
+    box-shadow: 0 0 100px rgba(0, 0, 0, 0.2);
+  }
+}
 
 .cp {
   .desativado {
@@ -372,7 +396,7 @@ a:link:after, a:visited:after {
 
       & > a {
         color: #444444;
-        &.link_alterador {
+        &.nota-alteracao {
           color: #2980B9;
           font-size: 0.75em;
           &:hover {
@@ -491,6 +515,198 @@ a:link:after, a:visited:after {
 } /* end cp */
 
 .cp.cpe {
+  .desativado {
+    text-decoration: line-through;
+    color: #999 !important;
+    table, table td {
+      border: 1px dotted #ccc;
+    }
+  }
+  .dpt {
+    display: block;
+    & > .dpt-actions-fixed {
+      position: absolute;
+      right: 0px;
+      z-index: 2;
+      opacity: 0;
+    }
+    & > .dpt-actions, & > .dpt-actions-bottom {
+      display: none;
+    }
+    & > .dpt-text {
+      cursor: pointer;
+      &:hover {
+        color: $color_buttons;
+        transition: color 0.3s ease;
+      }
+      &.artigo {
+        float: none;
+      }
+      a {
+        &.link-rotulo {
+          color: #000;
+        }
+      }
+    }
+
+    &:hover {
+      & > .dpt-actions-fixed {
+        opacity: 1;
+      }
+    }
+
+    .semtexto {
+      font-weight: bold;
+      color: #9aaed6;
+      &:hover {
+        color: #5f76a4;
+      }
+    }
+  } /* fim .dpt */
+  .dpt-alts {
+    margin: 0;
+    margin-bottom: 1em;
+    padding: 0;
+    background-color: transparent;
+    min-height: 100px;
+    border: 2px dashed #fff;
+    &:hover {
+      border-color: #d9ddde;
+    }
+    &:empty {
+      border-color: #ddd;
+    }
+    &.drag {
+      width: 100% !important;
+      border-color: #d9ddde;
+      .dpt {
+        transition-duration: 0s !important;
+      }
+    }
+    .dpt {
+      width: 100% !important;
+      box-shadow: 0 -1px 0 #e5e5e5, 0 0 2px rgba(0,0,0,.12),0 2px 4px rgba(0,0,0,.24);
+      padding: 0;
+      margin: 0;
+      background-color: #edf0f1;
+      height: auto !important;
+      min-height: 2em;
+
+      z-index: 1;
+      &:not(:first-child) {
+        border-top: 1px solid white;
+      }
+      & > .dpt-text {
+        padding: 0.3em 1em;
+        margin-top: 0;
+        margin-bottom: 0;
+
+        a {
+          &.link-rotulo {
+            text-decoration: underline;
+          }
+        }
+      }
+    }
+    .dpt-selected {
+      &.dpt {
+        margin: -0.2em -0.5em;
+      }
+    }
+  } /* fim dpt-alts */
+  .dpt-selected {
+    &.dpt {
+      width: auto !important;
+      margin: 1em -0.5em;
+      border: 1px solid #ddd !important;
+      padding: 0;
+      background-color: #fafafa;
+      border-radius: 3px;
+      z-index: 2;
+      & > .dpt-text {
+        opacity: 1;
+        border: 1px solid #e0e0e0 !important;
+        margin: 1em;
+        padding: 0.3em;
+        position: relative;
+        background-color: white;
+        min-height: 2em;
+
+        &:before {
+          border-width: 1rem;
+          border-style: solid;
+          border-color: #e0e0e0 #e0e0e0 transparent transparent;
+          content: "";
+          display: block;
+          height: 0px;
+          width: 0px;
+          position: absolute;
+          top: 0rem;
+          right: 0rem;
+        }
+      }
+      & > .dpt-form {
+        margin-bottom: 1em;
+      }
+      & > .dpt-actions, & > .dpt-actions-bottom {
+        display: table;
+        background-color: #e5e5e5;
+        padding: 1em;
+        margin-bottom: 1em;
+        width: 100%;
+        & > .btn-action {
+          display: table-cell;
+          float: none;
+        }
+        .btn-excluir {
+          display: inline-block;
+          opacity: 0.3;
+          &:hover {
+            opacity: 1;
+          }
+        }
+      }
+      & > .dpt-actions-bottom {
+        margin:0;
+      }
+    }
+    .dpt-block {
+      border-top: 1px solid #e5e5e5 !important;
+    }
+    .dpt {
+      &:only-child {
+        border-bottom: 1px solid #e5e5e5 !important;
+      }
+      &:not(:last-child) {
+        border-bottom: 1px solid #e5e5e5 !important;
+      }
+    }
+    .dpt-text {
+      opacity: 0.7;
+      margin: 0;
+      padding: 0.7em;
+      &:hover {
+        opacity: 1;
+        background-color: #f5f5f5;
+      }
+    }
+    & > .dpt-alts {
+      margin: 0;
+      border: 0px;
+      .dpt {
+        box-shadow: 0 0 0;
+      }
+
+
+    }
+    & > .dpt-actions-fixed {
+      display: none;
+    }
+  }
+
+}
+
+.cp.cpe1 {
 
 
   margin-bottom: 15em;
@@ -530,14 +746,19 @@ a:link:after, a:visited:after {
       position: absolute;
       opacity: 0;
       transition: all 0.4s ease-in-out;
-      z-index: 2000;
+      z-index: 1000;
       a {
-        &.btn-edit {
+        &.btn-bloco {
           background-color: #3498db;
           color: #ffffff !important;
           padding: 8px 18px 6px;
           display: inline-block;
           line-height: 1;
+          float: right;
+          &:hover{
+            opacity: 1;
+            @include background-top-down(#1c81c4, #0b6dad);
+          }
         }
       }
     }
@@ -570,13 +791,17 @@ a:link:after, a:visited:after {
         border-color: #d9ddde;
       }
       &.drag {
+        width: 100% !important;
         border-color: #d9ddde;
+        .dpt {
+          transition-duration: 0s !important;
+        }
       }
       .dpt {
         width: 100% !important;
         box-shadow: 0 -1px 0 #e5e5e5, 0 0 2px rgba(0,0,0,.12),0 2px 4px rgba(0,0,0,.24);
         padding: 0.3em 1em;
-        margin: 1px 0;
+        margin: 0;
         background-color: #edf0f1;
         z-index: 1;
         &:not(:first-child) {
@@ -585,6 +810,12 @@ a:link:after, a:visited:after {
         &.ui-draggable div {
           cursor: pointer;
         }
+        &.dpt-comp-selected {
+          transition: all 0.3s ease;
+          width: auto !important;
+          margin: 2em -3.7em;
+          box-shadow: 0 0 6px rgba(0,0,0,.16),0 6px 12px rgba(0,0,0,.32);
+        }
       }
     }
   } /* fim dpt */
@@ -592,7 +823,7 @@ a:link:after, a:visited:after {
   .dpt-selected {
     font-size: 1em;
     border: 0px solid $color_actions_border;
-    margin: 1em -2em 1em -2.8em;
+    margin: 1em -1.8em 1em -1.8em;
     padding: 2.2em 2.2em 1.6em 2.2em;
     box-shadow: -4px 15px 15px rgba(0, 0, 0, 0.1), 0px 6px 6px rgba(0, 0, 0, 0.23);
 
@@ -626,12 +857,26 @@ a:link:after, a:visited:after {
     .bloco_alteracao {
       margin: 0;
       padding: 1em;
+      border: 0 transparent;
       @include background-top-down(#eaeaee, #ddd);
-      &:not(:first-child) {
-        border-top: 0px solid white;
+
+      &:hover {
+        border-color: transparent;
+      }
+      &.drag {
+        width: 100% !important;
+        .dpt {
+          transition-duration: 0s !important;
+        }
       }
       .dpt {
+        width: auto !important;
+        transition: all 0.3s ease;
         background-color: white;
+        &:not(:first-child) {
+          border-top: 0px solid white;
+        }
+
       }
     }
 
@@ -643,7 +888,11 @@ a:link:after, a:visited:after {
     }
 
     & > .actions_right {
-      display: none;
+      a {
+        &.btn-bloco {
+          display: none;
+        }
+      }
     }
 
     .csform {  /* compilacao simple form */
@@ -910,6 +1159,7 @@ a:link:after, a:visited:after {
 
 
       .menu_flutuante, .menu_flutuante_fixo  {
+        z-index: 2000;
         & > li {
           @include li_flutuante();
 
@@ -956,7 +1206,8 @@ a:link:after, a:visited:after {
         }
       }
     } /* fim csform*/
-  }
+  } /* fim dpt-selected */
+
 
   .selected {
     background-color: rgba(255, 255, 255, 0.5);
@@ -1108,16 +1359,16 @@ a:link:after, a:visited:after {
   display: none !important;
 }
 
-@media only screen and (max-width: 40.0625em) {
+@media only screen and (max-width: 800px) {
 
   .cp .fixed{
     z-index:98;
     position: relative;
   }
 
-  .cpe {
+  .cp.cpe1 {
     .dpt-selected {
-      margin:1em -1em 1em -1.8em;
+      margin: 1em 0;
 
       .csform {
         .actions_parents, .label_status {
@@ -1126,6 +1377,9 @@ a:link:after, a:visited:after {
           display: block !important;
           padding: 0em;
           height: auto !important;
+          left: 0;
+          right: auto;
+          text-align: left;
           div, li {
             display: inline-block !important;
           }
@@ -1179,7 +1433,7 @@ a:link:after, a:visited:after {
               margin-left: 0;
               margin-right: 0.5em;
               li:first-child::before {
-                right: 27%;
+                right: 0;
                 left: auto;
               }
             }