diff --git a/apps/common/main/lib/component/Button.js b/apps/common/main/lib/component/Button.js
index 7ee79dc93..466baed30 100644
--- a/apps/common/main/lib/component/Button.js
+++ b/apps/common/main/lib/component/Button.js
@@ -469,7 +469,7 @@ define([
                                     tip.hide();
                                 }
                             }
-                            var isOpen = el.hasClass('open');
+                            var isOpen = el.hasClass('show');
                             doSplitSelect(!isOpen, 'arrow', e);
                         }
                     }
diff --git a/apps/common/main/lib/component/ColorButton.js b/apps/common/main/lib/component/ColorButton.js
index e6fff957b..ceabbeea1 100644
--- a/apps/common/main/lib/component/ColorButton.js
+++ b/apps/common/main/lib/component/ColorButton.js
@@ -110,8 +110,8 @@ define([
                     cls: 'shifted-left',
                     additionalAlign: options.additionalAlign,
                     items: (options.additionalItems ? options.additionalItems : []).concat([
-                        { template: _.template('<div id="' + id + '-color-menu" style="width: 169px; height: 220px; margin: 10px;"></div>'), clsDropdownItem: false },
-                        { template: _.template('<a id="' + id + '-color-new" style="">' + this.textNewColor + '</a>') }
+                        { template: _.template('<div id="' + id + '-color-menu" style="width: 169px; height: 220px; margin: 10px;"></div>') },
+                        { template: _.template('<a id="' + id + '-color-new" class="dropdown-item" style="">' + this.textNewColor + '</a>') }
                     ])
                 });
                 return menu;
diff --git a/apps/common/main/lib/component/ComboBox.js b/apps/common/main/lib/component/ComboBox.js
index 383324cad..085ee504b 100644
--- a/apps/common/main/lib/component/ComboBox.js
+++ b/apps/common/main/lib/component/ComboBox.js
@@ -95,7 +95,7 @@ define([
                     '<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" data-reference="parent"><span class="caret img-commonctrl"></span></button>',
                     '<ul class="dropdown-menu <%= menuCls %>" style="<%= menuStyle %>" role="menu">',
                         '<% _.each(items, function(item) { %>',
-                            '<li id="<%= item.id %>" class="dropdown-item" data-value="<%= item.value %>"><a tabindex="-1" type="menuitem"><%= scope.getDisplayValue(item) %></a></li>',
+                            '<li id="<%= item.id %>" data-value="<%= item.value %>"><a class="dropdown-item" tabindex="-1" type="menuitem"><%= scope.getDisplayValue(item) %></a></li>',
                         '<% }); %>',
                     '</ul>',
                 '</span>'
@@ -147,7 +147,7 @@ define([
                         scope       : me
                     }));
                     if (this.itemsTemplate)
-                        this.cmpEl.find('ul').html(
+                        this.cmpEl.find('.dropdown-menu').html(
                             $(this.itemsTemplate({
                                 items       : items,
                                 scope       : me
@@ -264,16 +264,17 @@ define([
                 }
 
                 _.delay(function(){
-                    me.cmpEl.addClass('open');
+                    me.cmpEl.addClass('show');
                 }, delay || 0);
             },
 
             closeMenu: function() {
-                this.cmpEl.removeClass('open');
+                this.cmpEl.removeClass('show');
+                this.cmpEl.find('.dropdown-menu').removeClass('show');
             },
 
             isMenuOpen: function() {
-                return this.cmpEl.hasClass('open');
+                return this.cmpEl.hasClass('show');
             },
 
             onBeforeShowMenu: function(e) {
@@ -298,7 +299,7 @@ define([
                     }
                 }
 
-                var $list = this.cmpEl.find('ul');
+                var $list = this.cmpEl.find('.dropdown-menu');
                 if ($list.hasClass('menu-absolute')) {
                     var offset = this.cmpEl.offset();
                     $list.css({left: offset.left, top: offset.top + this.cmpEl.outerHeight() + 2});
@@ -306,7 +307,7 @@ define([
             },
 
             onAfterShowMenu: function(e) {
-                var $list = $(this.el).find('ul'),
+                var $list = $(this.el).find('.dropdown-menu'),
                     $selected = $list.find('> li.selected');
 
                 if ($selected.length) {
@@ -319,7 +320,7 @@ define([
                         height = (Math.floor(height/itemHeight) * itemHeight);
                         $list.scrollTop(height);
                     }
-                    setTimeout(function(){$selected.find('a').focus();}, 1);
+                    setTimeout(function(){$selected.find('.dropdown-item').focus();}, 1);
                 }
 
                 if (this.scroller)
@@ -371,7 +372,7 @@ define([
                     (this._search.char !== e.key) && (this._search.full = true);
                     this._search.text += e.key;
                     if (this._search.index===undefined) {
-                        var $items = this.cmpEl.find('ul > li').find('> a');
+                        var $items = this.cmpEl.find('.dropdown-menu > li').find('> .dropdown-item');
                         this._search.index = $items.index($items.filter(':focus'));
                     }
                     this.selectCandidate();
@@ -403,7 +404,7 @@ define([
                     var item = $('#' + itemCandidate.get('id') + ' a', $(this.el));
                     if (this.scroller) {
                         this.scroller.update({alwaysVisibleY: this.scrollAlwaysVisible});
-                        var $list = $(this.el).find('ul');
+                        var $list = $(this.el).find('.dropdown-menu');
                         var itemTop = item.position().top,
                             itemHeight = item.outerHeight(),
                             listHeight = $list.outerHeight();
@@ -430,7 +431,8 @@ define([
 
                     _.delay(function() {
                         me._skipInputChange = true;
-                        me.cmpEl.find('ul li:first a').focus();
+                        var item = me.cmpEl.find('.dropdown-menu li:first .dropdown-item');
+                            item.focus();
                     }, 10);
                 } else if (e.keyCode == Common.UI.Keys.RETURN && $(e.target).val() === me.lastValue){
                     this._input.trigger('change', { reapply: true });
@@ -637,14 +639,14 @@ define([
 
             onResetItems: function() {
                 if (this.itemsTemplate) {
-                    $(this.el).find('ul').html( $(this.itemsTemplate({
+                    $(this.el).find('.dropdown-menu').html( $(this.itemsTemplate({
                         items: this.store.toJSON(),
                         scope: this
                     })));
                 } else {
-                    $(this.el).find('ul').html(_.template([
+                    $(this.el).find('.dropdown-menu').html(_.template([
                         '<% _.each(items, function(item) { %>',
-                           '<li id="<%= item.id %>" class="dropdown-item" data-value="<%- item.value %>"><a tabindex="-1" type="menuitem"><%= scope.getDisplayValue(item) %></a></li>',
+                           '<li id="<%= item.id %>" data-value="<%- item.value %>"><a class="dropdown-item" tabindex="-1" type="menuitem"><%= scope.getDisplayValue(item) %></a></li>',
                         '<% }); %>'
                     ].join(''))({
                         items: this.store.toJSON(),
diff --git a/apps/common/main/lib/component/ComboBoxFonts.js b/apps/common/main/lib/component/ComboBoxFonts.js
index 875863f3e..1e6990760 100644
--- a/apps/common/main/lib/component/ComboBoxFonts.js
+++ b/apps/common/main/lib/component/ComboBoxFonts.js
@@ -76,8 +76,8 @@ define([
                     '<ul class="dropdown-menu <%= menuCls %>" style="<%= menuStyle %>" role="menu">',
                         '<li class="dropdown-divider">',
                     '<% _.each(items, function(item) { %>',
-                        '<li id="<%= item.id %>" class="dropdown-item">',
-                            '<a class="font-item" tabindex="-1" type="menuitem" style="height:<%=scope.getListItemHeight()%>px;"></a>',
+                        '<li id="<%= item.id %>">',
+                            '<a class="font-item dropdown-item" tabindex="-1" type="menuitem" style="height:<%=scope.getListItemHeight()%>px;"></a>',
                         '</li>',
                     '<% }); %>',
                     '</ul>',
diff --git a/apps/common/main/lib/component/ComboDataView.js b/apps/common/main/lib/component/ComboDataView.js
index ebca3003e..3580ac124 100644
--- a/apps/common/main/lib/component/ComboDataView.js
+++ b/apps/common/main/lib/component/ComboDataView.js
@@ -108,7 +108,7 @@ define([
                     menuAlign: 'tl-tl',
                     offset: [0, 3],
                     items: [
-                        {template: _.template('<div class="menu-picker-container"></div>'), clsDropdownItem: false}
+                        {template: _.template('<div class="menu-picker-container"></div>')}
                     ]
                 })
             });
diff --git a/apps/common/main/lib/component/Menu.js b/apps/common/main/lib/component/Menu.js
index ad516a4c7..5c7aeeb8a 100644
--- a/apps/common/main/lib/component/Menu.js
+++ b/apps/common/main/lib/component/Menu.js
@@ -44,10 +44,10 @@
  *  Default template
  *
  *  <ul class="dropdown-menu" role="menu">
- *      <li class="dropdown-item"><a href="#">item 1</a></li>-->
- *      <li class="dropdown-item"><a href="#">item 2</a></li>-->
+ *      <li><a href="#" class="dropdown-item">item 1</a></li>-->
+ *      <li><a href="#" class="dropdown-item">item 2</a></li>-->
  *      <li class="dropdown-divider"></li>-->
- *      <li class="dropdown-item"><a href="#">item 3</a></li>
+ *      <li><a href="#" class="dropdown-item">item 3</a></li>
  *  </ul>
  *
  *  A useful classes of menu position
@@ -186,8 +186,7 @@ define([
                         me.items.push(
                             new Common.UI.MenuItem(_.extend({
                                 tagName : 'li',
-                                template: me.itemTemplate,
-                                clsDropdownItem: item.clsDropdownItem
+                                template: me.itemTemplate
                             }, item))
                         );
                     }
@@ -280,14 +279,14 @@ define([
             },
 
             show: function() {
-                if (this.rendered && this.parentEl && !this.parentEl.hasClass('open')) {
+                if (this.rendered && this.parentEl && !this.parentEl.hasClass('show')) {
                     this.cmpEl.dropdown('toggle');
                 }
             },
 
             hide: function() {
                 if (this.rendered && this.parentEl) {
-                    if ( this.parentEl.hasClass('open') )
+                    if ( this.parentEl.hasClass('show') )
                         this.cmpEl.dropdown('toggle');
                     else if (this.parentEl.hasClass('over'))
                         this.parentEl.removeClass('over');
@@ -760,14 +759,14 @@ define([
         },
 
         show: function() {
-            if (this.rendered && this.parentEl && !this.parentEl.hasClass('open')) {
+            if (this.rendered && this.parentEl && !this.parentEl.hasClass('show')) {
                 this.cmpEl.dropdown('toggle');
             }
         },
 
         hide: function() {
             if (this.rendered && this.parentEl) {
-                if ( this.parentEl.hasClass('open') )
+                if ( this.parentEl.hasClass('show') )
                     this.cmpEl.dropdown('toggle');
                 else if (this.parentEl.hasClass('over'))
                     this.parentEl.removeClass('over');
diff --git a/apps/common/main/lib/component/MenuItem.js b/apps/common/main/lib/component/MenuItem.js
index 5f860dc17..cd208acdb 100644
--- a/apps/common/main/lib/component/MenuItem.js
+++ b/apps/common/main/lib/component/MenuItem.js
@@ -45,14 +45,14 @@
  *  Default template
  *
  *  Simple menu item:
- *  <li><a href="#">Caption</a></li>
+ *  <li><a href="#" class="dropdown-item">Caption</a></li>
  *
  *  Separator:
  *  <li class="dropdown-divider"></li>
  *
  *  Menu item with sub-menu:
  *  <li class="dropdown-submenu">
- *      <a href="#">Sub-menu item</a>
+ *      <a href="#" class="dropdown-item">Sub-menu item</a>
  *      <ul class="dropdown-menu"></ul>
  *  </li>
  *
@@ -108,7 +108,7 @@ define([
         tagName : 'li',
 
         template: _.template([
-            '<a id="<%= id %>" style="<%= style %>" <% if(menu) { %> data-toggle="dropdown" class="dropdown-toggle" <% } %> <% if(options.canFocused) { %> tabindex="-1" type="menuitem" <% }; if(!_.isUndefined(options.stopPropagation)) { %> data-stopPropagation="true" <% }; %> >',
+            '<a id="<%= id %>" class="dropdown-item" style="<%= style %>" <% if(menu) { %> data-toggle="dropdown" class="dropdown-toggle" <% } %> <% if(options.canFocused) { %> tabindex="-1" type="menuitem" <% }; if(!_.isUndefined(options.stopPropagation)) { %> data-stopPropagation="true" <% }; %> >',
                 '<% if (!_.isEmpty(iconCls)) { %>',
                     '<span class="menu-item-icon <%= iconCls %>"></span>',
                 '<% } %>',
@@ -136,7 +136,6 @@ define([
             this.iconCls        = me.options.iconCls;
             this.hint           = me.options.hint;
             this.rendered       = false;
-            this.clsDropdownItem   = (!_.isUndefined(me.options.clsDropdownItem)) ? me.options.clsDropdownItem : true; // false for complex elements (forms, group buttons)
 
             if (this.menu !== null && !(this.menu instanceof Common.UI.Menu) && !(this.menu instanceof Common.UI.MenuSimple)) {
                 this.menu = new Common.UI.Menu(_.extend({}, me.options.menu));
@@ -181,8 +180,6 @@ define([
                         );
                     }
 
-                    this.clsDropdownItem && el.addClass('dropdown-item');
-
                     var firstChild = el.children(':first');
 
                     if (this.checkable && firstChild) {
diff --git a/apps/common/main/lib/extend/Bootstrap.js b/apps/common/main/lib/extend/Bootstrap.js
index 9c529a3d0..268a0e788 100755
--- a/apps/common/main/lib/extend/Bootstrap.js
+++ b/apps/common/main/lib/extend/Bootstrap.js
@@ -76,7 +76,7 @@ function patchDropDownKeyDown(e) {
     if ($this.is('.disabled, :disabled')) return;
 
     var $parent  = getParent($this);
-    var isActive = $parent.hasClass('open') || $parent.hasClass('over');
+    var isActive = $parent.hasClass('show') || $parent.hasClass('over');
 
     if (!isActive || (isActive && e.keyCode == 27)) {
         if (e.which == 27) {
@@ -145,7 +145,7 @@ function patchDropDownKeyDownAdditional(e) { // only for formula menu when typin
     if ($this.is('.disabled, :disabled')) return;
 
     var $parent  = getParent($this);
-    var isActive = $parent.hasClass('open') || $parent.hasClass('over');
+    var isActive = $parent.hasClass('show') || $parent.hasClass('over');
 
     if (!isActive || (isActive && (e.keyCode == 27 || e.keyCode == 37 || e.keyCode == 39))) {
 //        if (e.which == 27)
@@ -194,14 +194,16 @@ function getParent($this) {
 function clearMenus(isFromInputControl) {
     $('.dropdown-toggle').each(function (e) {
         var $parent = ($(this)).parent();
-        if (!$parent.hasClass('open')) return;
+        if (!$parent.hasClass('show')) return;
         if ($parent.attr('data-value') == 'prevent-canvas-click') {
             $parent.attr('data-value','');
             return;
         }
         $parent.trigger(e = $.Event('hide.bs.dropdown'));
         if (e.isDefaultPrevented()) return;
-        $parent.removeClass('open').trigger('hidden.bs.dropdown', isFromInputControl);
+        $parent.removeClass('show');
+        $parent.find('.dropdown-menu').removeClass('show');
+        $parent.trigger('hidden.bs.dropdown', isFromInputControl);
     })
 }
 
diff --git a/apps/common/main/resources/less/combobox.less b/apps/common/main/resources/less/combobox.less
index 4bc2140bd..9abca2d74 100644
--- a/apps/common/main/resources/less/combobox.less
+++ b/apps/common/main/resources/less/combobox.less
@@ -51,6 +51,7 @@
     .btn,
     .btn:hover,
     .btn:focus {
+        box-shadow: none;
         border-left: 0;
         border-color: @input-border;
         background-color: transparent;
@@ -61,12 +62,12 @@
     }
 
     .btn-default:not(.disabled),
-    &.open .dropdown-toggle.btn-default {
+    &.show .dropdown-toggle.btn-default {
         background-color: @input-bg;
         border-color: @input-border;
     }
 
-    &.input-group-nr.open:not(.no-highlighted) {
+    &.input-group-nr.show:not(.no-highlighted) {
         & > .form-control,
         & > .btn {
             border-color: @gray-darker;
@@ -132,7 +133,7 @@
     }
 }
 
-.open > .combobox.combo-dataview-menu {
+.show > .combobox.combo-dataview-menu {
     &.input-group-nr:not(.no-highlighted) {
         & > .form-control,
         & > .btn {
diff --git a/apps/common/main/resources/less/dropdown-menu.less b/apps/common/main/resources/less/dropdown-menu.less
index 1bfa1faa0..92f102047 100644
--- a/apps/common/main/resources/less/dropdown-menu.less
+++ b/apps/common/main/resources/less/dropdown-menu.less
@@ -29,9 +29,6 @@
     }
 
     li {
-        &.dropdown-item {
-            padding: 0;
-        }
         & > a {
             display: block;
             padding: 5px 20px;
@@ -70,6 +67,11 @@
         }
 
         &.disabled {
+            .dropdown-item {
+                pointer-events: none;
+                background-color: transparent;
+                color: @gray;
+            }
             .menu-item-icon {
                 opacity: .4;
             }
@@ -107,7 +109,7 @@
     }
     &.shifted-left {
         li {
-            & > a {
+            & > a:not(.checkable) {
                 padding-left: 12px;
                 padding-right: 12px;
             }
diff --git a/apps/documenteditor/main/app/controller/Toolbar.js b/apps/documenteditor/main/app/controller/Toolbar.js
index acf072b77..5880f473f 100644
--- a/apps/documenteditor/main/app/controller/Toolbar.js
+++ b/apps/documenteditor/main/app/controller/Toolbar.js
@@ -2509,7 +2509,7 @@ define([
                     menu: new Common.UI.Menu({
                         menuAlign: 'tl-tr',
                         items: [
-                            { template: _.template('<div id="id-toolbar-menu-shapegroup' + i + '" class="menu-shape" style="width: ' + (shapeGroup.get('groupWidth') - 8) + 'px; margin-left: 5px;"></div>'), clsDropdownItem: false }
+                            { template: _.template('<div id="id-toolbar-menu-shapegroup' + i + '" class="menu-shape" style="width: ' + (shapeGroup.get('groupWidth') - 8) + 'px; margin-left: 5px;"></div>') }
                         ]
                     })
                 });
@@ -2568,8 +2568,7 @@ define([
                             {
                                 template: _.template('<div id="id-toolbar-menu-equationgroup' + i +
                                 '" class="menu-shape" style="width:' + (equationGroup.get('groupWidth') + 8) + 'px; ' +
-                                equationGroup.get('groupHeight') + 'margin-left:5px;"></div>'),
-                                clsDropdownItem: false
+                                equationGroup.get('groupHeight') + 'margin-left:5px;"></div>')
                             }
                         ]
                     })
diff --git a/apps/documenteditor/main/app/controller/Viewport.js b/apps/documenteditor/main/app/controller/Viewport.js
index 3bff9087f..5780631da 100644
--- a/apps/documenteditor/main/app/controller/Viewport.js
+++ b/apps/documenteditor/main/app/controller/Viewport.js
@@ -275,8 +275,7 @@ define([
                         '</div>'
                     ].join('')),
                     stopPropagation: true,
-                    value: me.header.mnuZoom.options.value,
-                    clsDropdownItem: false
+                    value: me.header.mnuZoom.options.value
                 });
 
                 me.header.btnOptions.setMenu(new Common.UI.Menu({
diff --git a/apps/documenteditor/main/app/view/Links.js b/apps/documenteditor/main/app/view/Links.js
index 7409a9804..f3fcf5c7f 100644
--- a/apps/documenteditor/main/app/view/Links.js
+++ b/apps/documenteditor/main/app/view/Links.js
@@ -197,8 +197,8 @@ define([
                         var _menu = new Common.UI.Menu({
                             cls: 'toc-menu shifted-left',
                             items: [
-                                {template: contentsTemplate, offsety: 0, value: 0, clsDropdownItem: false},
-                                {template: contentsTemplate, offsety: 72, value: 1, clsDropdownItem: false},
+                                {template: contentsTemplate, offsety: 0, value: 0},
+                                {template: contentsTemplate, offsety: 72, value: 1},
                                 {caption: me.textContentsSettings, value: 'settings'},
                                 {caption: me.textContentsRemove, value: 'remove'}
                             ]
@@ -251,8 +251,7 @@ define([
                                         '<button id="id-menu-goto-footnote-prev-' + index + '" type="button" style="float:right; margin-top: 2px;" class="btn small btn-toolbar"><i class="icon menu__icon btn-previtem">&nbsp;</i></button>',
                                         '</div>'
                                     ].join('')),
-                                    stopPropagation: true,
-                                    clsDropdownItem: false
+                                    stopPropagation: true
                                 }),
                                 new Common.UI.MenuItem({
                                     template: _.template([
diff --git a/apps/documenteditor/main/app/view/ListSettingsDialog.js b/apps/documenteditor/main/app/view/ListSettingsDialog.js
index 726f1efe0..e2540bc45 100644
--- a/apps/documenteditor/main/app/view/ListSettingsDialog.js
+++ b/apps/documenteditor/main/app/view/ListSettingsDialog.js
@@ -184,7 +184,7 @@ define([
             var itemsTemplate =
                 [
                     '<% _.each(items, function(item) { %>',
-                    '<li id="<%= item.id %>" class="dropdown-item" data-value="<%= item.value %>"><a tabindex="-1" type="menuitem">',
+                    '<li id="<%= item.id %>" data-value="<%= item.value %>"><a class="dropdown-item" tabindex="-1" type="menuitem">',
                     '<%= item.displayValue %><% if (item.value === Asc.c_oAscNumberingFormat.Bullet) { %><span style="font-family:<%=item.font%>;"><%=item.symbol%></span><% } %>',
                     '</a></li>',
                     '<% }); %>'
diff --git a/apps/documenteditor/main/app/view/TableSettings.js b/apps/documenteditor/main/app/view/TableSettings.js
index cad5861dc..fa909dacd 100644
--- a/apps/documenteditor/main/app/view/TableSettings.js
+++ b/apps/documenteditor/main/app/view/TableSettings.js
@@ -670,7 +670,7 @@ define([
                     menu        : new Common.UI.Menu({
                         style: 'width: 575px;',
                         items: [
-                            { template: _.template('<div id="id-table-menu-template" class="menu-table-template"  style="margin: 5px 5px 5px 10px;"></div>'), clsDropdownItem: false }
+                            { template: _.template('<div id="id-table-menu-template" class="menu-table-template"  style="margin: 5px 5px 5px 10px;"></div>') }
                         ]
                     })
                 });
diff --git a/apps/documenteditor/main/app/view/Toolbar.js b/apps/documenteditor/main/app/view/Toolbar.js
index f76533c04..1e9d8af16 100644
--- a/apps/documenteditor/main/app/view/Toolbar.js
+++ b/apps/documenteditor/main/app/view/Toolbar.js
@@ -242,7 +242,7 @@ define([
                         menu: new Common.UI.Menu({
                             style: 'min-width: 100px;',
                             items: [
-                                {template: _.template('<div id="id-toolbar-menu-highlight" style="width: 120px; height: 120px; margin: 10px;"></div>'), clsDropdownItem: false},
+                                {template: _.template('<div id="id-toolbar-menu-highlight" style="width: 120px; height: 120px; margin: 10px;"></div>')},
                                 {caption: '--'},
                                 this.mnuHighlightTransparent = new Common.UI.MenuItem({
                                     caption: this.strMenuNoFill,
@@ -265,11 +265,11 @@ define([
                                 {
                                     id: 'id-toolbar-menu-auto-fontcolor',
                                     caption: this.textAutoColor,
-                                    template: _.template('<a tabindex="-1" type="menuitem"><span class="menu-item-icon" style="background-image: none; width: 12px; height: 12px; margin: 1px 7px 0 1px; background-color: #000;"></span><%= caption %></a>')
+                                    template: _.template('<a class="dropdown-item" tabindex="-1" type="menuitem"><span class="menu-item-icon" style="background-image: none; width: 12px; height: 12px; margin: 1px 7px 0 1px; background-color: #000;"></span><%= caption %></a>')
                                 },
                                 {caption: '--'},
-                                {template: _.template('<div id="id-toolbar-menu-fontcolor" style="width: 169px; height: 220px; margin: 10px;"></div>'), clsDropdownItem: false},
-                                {template: _.template('<a id="id-toolbar-menu-new-fontcolor" style="padding-left:12px;">' + this.textNewColor + '</a>')}
+                                {template: _.template('<div id="id-toolbar-menu-fontcolor" style="width: 169px; height: 220px; margin: 10px;"></div>')},
+                                {template: _.template('<a id="id-toolbar-menu-new-fontcolor" class="dropdown-item" style="padding-left:12px;">' + this.textNewColor + '</a>')}
                             ]
                         })
                     });
@@ -282,8 +282,8 @@ define([
                         split: true,
                         menu: new Common.UI.Menu({
                             items: [
-                                {template: _.template('<div id="id-toolbar-menu-paracolor" style="width: 169px; height: 220px; margin: 10px;"></div>'), clsDropdownItem: false},
-                                {template: _.template('<a id="id-toolbar-menu-new-paracolor" style="padding-left:12px;">' + this.textNewColor + '</a>')}
+                                {template: _.template('<div id="id-toolbar-menu-paracolor" style="width: 169px; height: 220px; margin: 10px;"></div>')},
+                                {template: _.template('<a id="id-toolbar-menu-new-paracolor" class="dropdown-item" style="padding-left:12px;">' + this.textNewColor + '</a>')}
                             ]
                         })
                     });
@@ -439,7 +439,7 @@ define([
                         menu: new Common.UI.Menu({
                             cls: 'shifted-left',
                             items: [
-                                {template: _.template('<div id="id-toolbar-menu-tablepicker" class="dimension-picker" style="margin: 5px 10px;"></div>'), clsDropdownItem: false},
+                                {template: _.template('<div id="id-toolbar-menu-tablepicker" class="dimension-picker" style="margin: 5px 10px;"></div>')},
                                 {caption: this.mniCustomTable, value: 'custom'},
                                 {caption: this.mniDrawTable, value: 'draw', checkable: true},
                                 {caption: this.mniEraseTable, value: 'erase', checkable: true}
@@ -488,7 +488,7 @@ define([
                         menu: new Common.UI.Menu({
                             cls: 'menu-shapes',
                             items: [
-                                {template: _.template('<div id="id-toolbar-menu-insart" style="width: 239px; margin-left: 5px;"></div>'), clsDropdownItem: false}
+                                {template: _.template('<div id="id-toolbar-menu-insart" style="width: 239px; margin-left: 5px;"></div>')}
                             ]
                         })
                     });
@@ -787,7 +787,7 @@ define([
                     this.toolbarControls.push(this.btnPageOrient);
 
 
-                    var pageMarginsTemplate = _.template('<a id="<%= id %>" tabindex="-1" type="menuitem"><div><b><%= caption %></b></div>' +
+                    var pageMarginsTemplate = _.template('<a id="<%= id %>" class="dropdown-item" tabindex="-1" type="menuitem"><div><b><%= caption %></b></div>' +
                         '<% if (options.value !== null) { %><div style="display: inline-block;margin-right: 20px;min-width: 80px;">' +
                         '<label style="display: block;">' + this.textTop + '<%= parseFloat(Common.Utils.Metric.fnRecalcFromMM(options.value[0]).toFixed(2)) %> <%= Common.Utils.Metric.getCurrentMetricName() %></label>' +
                         '<label style="display: block;">' + this.textLeft + '<%= parseFloat(Common.Utils.Metric.fnRecalcFromMM(options.value[1]).toFixed(2)) %> <%= Common.Utils.Metric.getCurrentMetricName() %></label></div><div style="display: inline-block;">' +
@@ -850,7 +850,7 @@ define([
                     });
                     this.toolbarControls.push(this.btnPageMargins);
 
-                    var pageSizeTemplate = _.template('<a id="<%= id %>" tabindex="-1" type="menuitem"><div><b><%= caption %></b></div>' +
+                    var pageSizeTemplate = _.template('<a id="<%= id %>" class="dropdown-item" tabindex="-1" type="menuitem"><div><b><%= caption %></b></div>' +
                         '<div><%= parseFloat(Common.Utils.Metric.fnRecalcFromMM(options.value[0]).toFixed(2)) %> <%= Common.Utils.Metric.getCurrentMetricName() %> x ' +
                         '<%= parseFloat(Common.Utils.Metric.fnRecalcFromMM(options.value[1]).toFixed(2)) %> <%= Common.Utils.Metric.getCurrentMetricName() %></div></a>');
 
@@ -1114,8 +1114,7 @@ define([
                             '<div id="id-save-style-container" class = "save-style-container">' +
                             '<span id="id-save-style-plus" class="plus img-commonctrl"  ></span>' +
                             '<label id="id-save-style-link" class="save-style-link" >' + me.textStyleMenuNew + '</label>' +
-                            '</div>'),
-                        clsDropdownItem: false
+                            '</div>')
                     });
 
                     this.listStyles = new Common.UI.ComboDataView({
@@ -1653,7 +1652,7 @@ define([
                         cls: 'shifted-left',
                         style: 'min-width: 139px',
                         items: [
-                            {template: _.template('<div id="id-toolbar-menu-markers" class="menu-markers" style="width: 139px; margin: 0 9px;"></div>'), clsDropdownItem: false},
+                            {template: _.template('<div id="id-toolbar-menu-markers" class="menu-markers" style="width: 139px; margin: 0 9px;"></div>')},
                             this.mnuMarkerSettings = new Common.UI.MenuItem({
                                 caption: this.textListSettings,
                                 disabled: (this.mnuMarkersPicker.conf.index || 0)==0,
@@ -1667,7 +1666,7 @@ define([
                     new Common.UI.Menu({
                         cls: 'shifted-left',
                         items: [
-                            {template: _.template('<div id="id-toolbar-menu-numbering" class="menu-markers" style="width: 185px; margin: 0 9px;"></div>'), clsDropdownItem: false},
+                            {template: _.template('<div id="id-toolbar-menu-numbering" class="menu-markers" style="width: 185px; margin: 0 9px;"></div>')},
                             this.mnuNumberSettings = new Common.UI.MenuItem({
                                 caption: this.textListSettings,
                                 disabled: (this.mnuNumbersPicker.conf.index || 0)==0,
@@ -1682,7 +1681,7 @@ define([
                         cls: 'shifted-left',
                         style: 'min-width: 90px',
                         items: [
-                            {template: _.template('<div id="id-toolbar-menu-multilevels" class="menu-markers" style="width: 93px; margin: 0 9px;"></div>'), clsDropdownItem: false},
+                            {template: _.template('<div id="id-toolbar-menu-multilevels" class="menu-markers" style="width: 93px; margin: 0 9px;"></div>')},
                             this.mnuMultilevelSettings = new Common.UI.MenuItem({
                                 caption: this.textListSettings,
                                 disabled: (this.mnuMultilevelPicker.conf.index || 0)==0,
@@ -1706,7 +1705,7 @@ define([
                                     menuAlign: 'tl-tr',
                                     style: 'min-width: 90px;',
                                     items: [
-                                        {template: _.template('<div id="id-toolbar-menu-pageposition" class="menu-pageposition"></div>'), clsDropdownItem: false},
+                                        {template: _.template('<div id="id-toolbar-menu-pageposition" class="menu-pageposition"></div>')},
                                         this.mnuPageNumCurrentPos = new Common.UI.MenuItem({
                                             caption: this.textToCurrent,
                                             disabled: this.mnuPageNumCurrentPos.isDisabled(),
@@ -1728,7 +1727,7 @@ define([
                 this.btnInsertChart.setMenu( new Common.UI.Menu({
                     style: 'width: 364px;',
                     items: [
-                        {template: _.template('<div id="id-toolbar-menu-insertchart" class="menu-insertchart" style="margin: 5px 5px 5px 10px;"></div>'), clsDropdownItem: false}
+                        {template: _.template('<div id="id-toolbar-menu-insertchart" class="menu-insertchart" style="margin: 5px 5px 5px 10px;"></div>')}
                     ]
                 }));
 
@@ -2014,7 +2013,7 @@ define([
                 this.mnuColorSchema.items = [];
 
                 var itemTemplate = _.template([
-                    '<a id="<%= id %>"  tabindex="-1" type="menuitem" class="<%= options.cls %>">',
+                    '<a id="<%= id %>"  tabindex="-1" type="menuitem" class="dropdown-item <%= options.cls %>">',
                     '<span class="colors">',
                     '<% _.each(options.colors, function(color) { %>',
                     '<span class="color" style="background: <%= color %>;"></span>',
diff --git a/apps/documenteditor/main/app/view/WatermarkSettingsDialog.js b/apps/documenteditor/main/app/view/WatermarkSettingsDialog.js
index a1a3ef401..c2c0f339a 100644
--- a/apps/documenteditor/main/app/view/WatermarkSettingsDialog.js
+++ b/apps/documenteditor/main/app/view/WatermarkSettingsDialog.js
@@ -338,7 +338,7 @@ define(['text!documenteditor/main/app/template/WatermarkSettings.template',
                     },
                     {caption: '--'},
                         { template: _.template('<div id="watermark-menu-textcolor" style="width: 169px; height: 220px; margin: 10px;"></div>') },
-                        { template: _.template('<a id="watermark-menu-textcolor-new">' + this.textNewColor + '</a>') }
+                        { template: _.template('<a id="watermark-menu-textcolor-new" class="dropdown-item">' + this.textNewColor + '</a>') }
                     ]
                 })
             });
diff --git a/apps/presentationeditor/main/app/view/Toolbar.js b/apps/presentationeditor/main/app/view/Toolbar.js
index 4c40fe6af..16dbb2791 100644
--- a/apps/presentationeditor/main/app/view/Toolbar.js
+++ b/apps/presentationeditor/main/app/view/Toolbar.js
@@ -1309,7 +1309,7 @@ define([
                     mnuColorSchema.items = [];
 
                     var itemTemplate = _.template([
-                        '<a id="<%= id %>" class="<%= options.cls %>" tabindex="-1" type="menuitem">',
+                        '<a id="<%= id %>" class="dropdown-item <%= options.cls %>" tabindex="-1" type="menuitem">',
                         '<span class="colors">',
                         '<% _.each(options.colors, function(color) { %>',
                         '<span class="color" style="background: <%= color %>;"></span>',
diff --git a/apps/spreadsheeteditor/main/app/view/HeaderFooterDialog.js b/apps/spreadsheeteditor/main/app/view/HeaderFooterDialog.js
index caf4d33f6..3e0616169 100644
--- a/apps/spreadsheeteditor/main/app/view/HeaderFooterDialog.js
+++ b/apps/spreadsheeteditor/main/app/view/HeaderFooterDialog.js
@@ -562,7 +562,7 @@ define([
                     additionalAlign: this.menuAddAlign,
                     items: [
                         { template: _.template('<div id="id-dlg-h-menu-fontcolor" style="width: 169px; height: 220px; margin: 10px;"></div>') },
-                        { template: _.template('<a id="id-dlg-h-menu-fontcolor-new" style="padding-left:12px;">' + this.textNewColor + '</a>') }
+                        { template: _.template('<a id="id-dlg-h-menu-fontcolor-new" class="dropdown-item" style="padding-left:12px;">' + this.textNewColor + '</a>') }
                     ]
                 })
             }));
@@ -581,7 +581,7 @@ define([
                     additionalAlign: this.menuAddAlign,
                     items: [
                         { template: _.template('<div id="id-dlg-f-menu-fontcolor" style="width: 169px; height: 220px; margin: 10px;"></div>') },
-                        { template: _.template('<a id="id-dlg-f-menu-fontcolor-new" style="padding-left:12px;">' + this.textNewColor + '</a>') }
+                        { template: _.template('<a id="id-dlg-f-menu-fontcolor-new" class="dropdown-item" style="padding-left:12px;">' + this.textNewColor + '</a>') }
                     ]
                 })
             }));
diff --git a/apps/spreadsheeteditor/main/app/view/Toolbar.js b/apps/spreadsheeteditor/main/app/view/Toolbar.js
index b953c4158..35fb8bea8 100644
--- a/apps/spreadsheeteditor/main/app/view/Toolbar.js
+++ b/apps/spreadsheeteditor/main/app/view/Toolbar.js
@@ -1087,7 +1087,7 @@ define([
                     })
                 });
 
-                var pageMarginsTemplate = _.template('<a id="<%= id %>" tabindex="-1" type="menuitem"><div><b><%= caption %></b></div>' +
+                var pageMarginsTemplate = _.template('<a id="<%= id %>" class="dropdown-item" tabindex="-1" type="menuitem"><div><b><%= caption %></b></div>' +
                     '<% if (options.value !== null) { %><div style="display: inline-block;margin-right: 20px;min-width: 80px;">' +
                     '<label style="display: block;">' + this.textTop + '<%= parseFloat(Common.Utils.Metric.fnRecalcFromMM(options.value[0]).toFixed(2)) %> <%= Common.Utils.Metric.getCurrentMetricName() %></label>' +
                     '<label style="display: block;">' + this.textLeft + '<%= parseFloat(Common.Utils.Metric.fnRecalcFromMM(options.value[1]).toFixed(2)) %> <%= Common.Utils.Metric.getCurrentMetricName() %></label></div><div style="display: inline-block;">' +
@@ -1136,7 +1136,7 @@ define([
                     })
                 });
 
-                var pageSizeTemplate = _.template('<a id="<%= id %>" tabindex="-1" type="menuitem"><div><b><%= caption %></b></div>' +
+                var pageSizeTemplate = _.template('<a id="<%= id %>" class="dropdown-item" tabindex="-1" type="menuitem"><div><b><%= caption %></b></div>' +
                     '<div><%= parseFloat(Common.Utils.Metric.fnRecalcFromMM(options.value[0]).toFixed(2)) %> <%= Common.Utils.Metric.getCurrentMetricName() %> x ' +
                     '<%= parseFloat(Common.Utils.Metric.fnRecalcFromMM(options.value[1]).toFixed(2)) %> <%= Common.Utils.Metric.getCurrentMetricName() %></div></a>');
 
@@ -2003,7 +2003,7 @@ define([
             this.mnuColorSchema.items = [];
 
             var itemTemplate = _.template([
-                '<a id="<%= id %>" class="<%= options.cls %>" tabindex="-1" type="menuitem">',
+                '<a id="<%= id %>" class="dropdown-item <%= options.cls %>" tabindex="-1" type="menuitem">',
                     '<span class="colors">',
                         '<% _.each(options.colors, function(color) { %>',
                             '<span class="color" style="background: <%= color %>;"></span>',