diff --git a/src/main/javascript/service/main-menu-service.js b/src/main/javascript/service/main-menu-service.js
index e367b4b..23931cd 100644
--- a/src/main/javascript/service/main-menu-service.js
+++ b/src/main/javascript/service/main-menu-service.js
@@ -46,6 +46,10 @@ function MenuGroup(groupId, options, parent) {
     this.isMenu = function () {
         return false;
     };
+
+    this.isSubMenu = function() {
+        return (_options.displayAsSubMenu === true);
+    };
 }
 
 function Menu(menuId, options) {
@@ -87,7 +91,12 @@ function Menu(menuId, options) {
 
     this.getFlattened = function () {
         return _.flatten([_menuEntries, _.map(this.getGroups(), function (group) {
-            return[group, group.getEntries()];
+            if (group.getOptions().displayAsSubMenu === true) {
+                group.subEntries = group.getEntries();
+                return[group];
+            } else {
+                return[group, group.getEntries()];
+            }
         })]);
     };
 
diff --git a/src/main/resources/styles/cat-angular.less b/src/main/resources/styles/cat-angular.less
index 4e9fad1..86a0f08 100644
--- a/src/main/resources/styles/cat-angular.less
+++ b/src/main/resources/styles/cat-angular.less
@@ -69,4 +69,30 @@
 .spinner {
   /* important is needed to override element style attribute set by spin.js */
   position: fixed !important;
-}
\ No newline at end of file
+}
+
+.dropdown-submenu {
+  position:relative;
+  & > a:after {
+    display:block;
+    content:" ";
+    float:right;
+    width:0;
+    height:0;
+    border-color:transparent;
+    border-style:solid;
+    border-width:5px 0 5px 5px;
+    border-left-color:#cccccc;
+    margin-top:5px;
+    margin-right:-10px;
+  }
+  &:hover {
+    & > .dropdown-menu {
+      display: block;
+      top:0;
+      left:100%;
+      margin-top:-6px;
+      margin-left:-1px;
+    }
+  }
+}
diff --git a/src/main/resources/template/cat-main-menu.tpl.html b/src/main/resources/template/cat-main-menu.tpl.html
index d4a7a82..44fced7 100644
--- a/src/main/resources/template/cat-main-menu.tpl.html
+++ b/src/main/resources/template/cat-main-menu.tpl.html
@@ -1,23 +1,32 @@
 <ul class="nav navbar-nav">
     <li class="dropdown" ng-repeat="menu in getMenus()" dropdown="">
         <a href="" class="dropdown-toggle" ng-if="isVisible(menu)" dropdown-toggle="">
-            <span cat-i18n="cc.catalysts.cat-menu.menu.{{menu.completeId}}">{{menu.getOptions().name}}</span> <b
-                class="caret"></b>
+            <span cat-i18n="cc.catalysts.cat-menu.menu.{{menu.completeId}}">{{menu.getOptions().name}}</span>
+            <b class="caret"></b>
         </a>
         <ul class="dropdown-menu" ng-if="isVisible(menu)">
             <li ng-repeat="entry in menu.getFlattened() track by entry.id" ng-if="isVisible(entry)"
-                ng-class="{'dropdown-header': entry.isGroup()}"
-                ng-switch data-on="entry.isGroup()">
-                <a ng-href="#{{entry.getOptions().path}}" ng-switch-when="false">
-                    <span cat-i18n="cc.catalysts.cat-menu.entry.{{entry.completeId}}">
-                        {{entry.getOptions().name}}
-                    </span> <span ng-if="entry.getOptions().keymap"
-                                  class="text-muted">{{entry.getOptions().keymap}}</span>
+                ng-class="{'dropdown-header': entry.isGroup() && !entry.isSubMenu(), 'dropdown dropdown-submenu' : entry.isSubMenu()}">
+                <a ng-if="!entry.isGroup()" ng-href="#{{entry.getOptions().path}}">
+                    <span cat-i18n="cc.catalysts.cat-menu.entry.{{entry.completeId}}">{{entry.getOptions().name}}</span>
+                    <span ng-if="entry.getOptions().keymap" class="text-muted">{{entry.getOptions().keymap}}</span>
                 </a>
-                <span ng-switch-default
+                <span ng-if="entry.isGroup() && !entry.isSubMenu()"
                       cat-i18n="cc.catalysts.cat-menu.group.{{entry.completeId}}">
                     {{entry.getOptions().name}}
                 </span>
+                <a ng-if="isVisible(entry) && entry.isGroup() && entry.isSubMenu()" href="" class="dropdown-toggle" data-toggle="dropdown">
+                    <span cat-i18n="cc.catalysts.cat-menu.group.{{entry.completeId}}">{{entry.getOptions().name}}</span>
+                    <ul ng-if="isVisible(entry) && entry.isGroup() && entry.isSubMenu()" class="dropdown-menu">
+                        <li ng-repeat="entry in entry.subEntries track by entry.id" ng-if="isVisible(entry)">
+                            <a ng-href="#{{entry.getOptions().path}}" ng-if="!entry.isGroup()">
+                                <span cat-i18n="cc.catalysts.cat-menu.entry.{{entry.completeId}}">
+                                    {{entry.getOptions().name}}
+                                </span>
+                            </a>
+                        </li>
+                    </ul>
+                </a>
             </li>
         </ul>
     </li>