diff --git a/css/navigation.css b/css/navigation.css
index 595f8cc4..f5283b6d 100644
--- a/css/navigation.css
+++ b/css/navigation.css
@@ -4,22 +4,22 @@
 	padding: 20px;
 }
 
-#app-navigation .navigation-element, #app-navigation .navigation-element option {
+#circle-navigation .navigation-element, #circle-navigation .navigation-element option {
 	padding: 3px 12px;
 }
 
-#app-navigation input#circles_search, #app-navigation select#circles_filters {
-	margin: 15px;
-	width: 285px;
+#circle-navigation input#circles_search, #circle-navigation select#circles_filters {
+	margin: 10px;
+	width: 225px;
 }
 
-#app-navigation select#circles_filters {
+#circle-navigation select#circles_filters {
 	margin-top: 0;
 	font-style: italic;
 	color: #777777;
 }
 
-#app-navigation input, #app-navigation select, #app-navigation option {
+#circle-navigation input, #circle-navigation select, #circle-navigation option {
 	width: 100%;
 	box-sizing: border-box;
 	background: #ffffffaa !important;
@@ -29,7 +29,7 @@
 	overflow-x: hidden;
 }
 
-#app-navigation .header {
+#circle-navigation .header {
 	padding: 0 12px;
 	line-height: 44px;
 	min-height: 44px;
@@ -39,7 +39,7 @@
 #circles_new_type_definition div {
 	margin-top: 20px;
 	position: absolute;
-	width: 255px;
+	width: 190px;
 	color: #474747b0;
 	word-wrap: break-word;
 }
@@ -51,7 +51,7 @@ SELECT.select_none {
 #circles_list, #circles_list .lightenbg {
 	position: absolute;
 	width: 100%;
-	top: 300px;
+	top: 350px;
 }
 
 #circles_list div {
@@ -75,26 +75,28 @@ SELECT.select_none {
 	font-weight: bold !important;
 }
 
-#app-navigation {
+#circle-navigation {
 	width: 300px;
 	border-right: 1px solid #ddd;
 }
 
-#app-navigation.circles {
+#circle-navigation.circles {
 	overflow-y: auto;
-	width: 320px;
+	width: 350px;
+	overflow-x: hidden;
+	z-index: 1002;
 }
 
-#app-navigation.circles, #app-navigation.circles .circle, #app-navigation.circles .selected {
+#circle-navigation.circles, #circle-navigation.circles .circle, #circle-navigation.circles .selected {
 	-webkit-transition: background-color 0.3s ease-in;
 	transition: background-color 0.3s ease-in;
 }
 
-#app-navigation.selected {
+#circle-navigation.selected {
 	background: #ededed !important;
 }
 
-#app-navigation.circles .selected {
+#circle-navigation.circles .selected {
 	background: #e5e5e5;
 }
 
@@ -214,8 +216,8 @@ div.circle .owner, div.circle .type, div.circle .resume {
 
 #emptycontent {
 	position: absolute;
-	z-index: -99;
-	left: 200px;
+	z-index: 1001;
+	left: 0px;
 }
 
 #circle-actions {
diff --git a/css/notyf.css b/css/notyf.css
index 68d2e8a6..3f9beefe 100644
--- a/css/notyf.css
+++ b/css/notyf.css
@@ -1 +1,4 @@
-@-webkit-keyframes a{0%{opacity:0;bottom:-15px;max-height:0;max-width:0;margin-top:0}30%{opacity:.8;bottom:-3px}to{opacity:1;bottom:0;max-height:200px;margin-top:12px;max-width:400px}}@keyframes a{0%{opacity:0;bottom:-15px;max-height:0;max-width:0;margin-top:0}30%{opacity:.8;bottom:-3px}to{opacity:1;bottom:0;max-height:200px;margin-top:12px;max-width:400px}}@-webkit-keyframes b{0%{opacity:1;bottom:0}30%{opacity:.2;bottom:-3px}to{opacity:0;bottom:-15px}}@keyframes b{0%{opacity:1;bottom:0}30%{opacity:.2;bottom:-3px}to{opacity:0;bottom:-15px}}@-webkit-keyframes c{0%{opacity:0}30%{opacity:.5}to{opacity:.6}}@keyframes c{0%{opacity:0}30%{opacity:.5}to{opacity:.6}}@-webkit-keyframes d{0%{opacity:.6}30%{opacity:.1}to{opacity:0}}@keyframes d{0%{opacity:.6}30%{opacity:.1}to{opacity:0}}.notyf__icon--alert,.notyf__icon--confirm{height:21px;width:21px;background:#fff;border-radius:50%;display:block;margin:0 auto;position:relative}.notyf__icon--alert:after,.notyf__icon--alert:before{content:"";background:#ed3d3d;display:block;position:absolute;width:3px;border-radius:3px;left:9px}.notyf__icon--alert:after{height:3px;top:14px}.notyf__icon--alert:before{height:8px;top:4px}.notyf__icon--confirm:after,.notyf__icon--confirm:before{content:"";background:#3dc763;display:block;position:absolute;width:3px;border-radius:3px}.notyf__icon--confirm:after{height:6px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);top:9px;left:6px}.notyf__icon--confirm:before{height:11px;-webkit-transform:rotate(45deg);transform:rotate(45deg);top:5px;left:10px}.notyf__toast{display:block;overflow:hidden;-webkit-animation:a .3s forwards;animation:a .3s forwards;box-shadow:0 1px 3px 0 rgba(0,0,0,.45);position:relative;padding-right:13px}.notyf__toast.notyf--alert{background:#ed3d3d}.notyf__toast.notyf--confirm{background:#3dc763}.notyf__toast.notyf--disappear{-webkit-animation:b .3s 1 forwards;animation:b .3s 1 forwards;-webkit-animation-delay:.25s;animation-delay:.25s}.notyf__toast.notyf--disappear .notyf__message{opacity:1;-webkit-animation:b .3s 1 forwards;animation:b .3s 1 forwards;-webkit-animation-delay:.1s;animation-delay:.1s}.notyf__toast.notyf--disappear .notyf__icon{opacity:1;-webkit-animation:d .3s 1 forwards;animation:d .3s 1 forwards}.notyf__wrapper{display:table;width:100%;padding-top:20px;padding-bottom:20px;padding-right:15px;border-radius:3px}.notyf__icon{width:20%;text-align:center;font-size:1.3em;-webkit-animation:c .5s forwards;animation:c .5s forwards;-webkit-animation-delay:.25s;animation-delay:.25s}.notyf__icon,.notyf__message{display:table-cell;vertical-align:middle;opacity:0}.notyf__message{width:80%;position:relative;-webkit-animation:a .3s forwards;animation:a .3s forwards;-webkit-animation-delay:.15s;animation-delay:.15s}.notyf{position:fixed;bottom:20px;right:30px;width:20%;color:#fff;z-index:1}@media only screen and (max-width:736px){.notyf__container{width:90%;margin:0 auto;display:block;right:0;left:0}}
\ No newline at end of file
+@-webkit-keyframes a{0%{opacity:0;bottom:-15px;max-height:0;max-width:0;margin-top:0}30%{opacity:.8;bottom:-3px}to{opacity:1;bottom:0;max-height:200px;margin-top:12px;max-width:400px}}@keyframes a{0%{opacity:0;bottom:-15px;max-height:0;max-width:0;margin-top:0}30%{opacity:.8;bottom:-3px}to{opacity:1;bottom:0;max-height:200px;margin-top:12px;max-width:400px}}@-webkit-keyframes b{0%{opacity:1;bottom:0}30%{opacity:.2;bottom:-3px}to{opacity:0;bottom:-15px}}@keyframes b{0%{opacity:1;bottom:0}30%{opacity:.2;bottom:-3px}to{opacity:0;bottom:-15px}}@-webkit-keyframes c{0%{opacity:0}30%{opacity:.5}to{opacity:.6}}@keyframes c{0%{opacity:0}30%{opacity:.5}to{opacity:.6}}@-webkit-keyframes d{0%{opacity:.6}30%{opacity:.1}to{opacity:0}}@keyframes d{0%{opacity:.6}30%{opacity:.1}to{opacity:0}}.notyf__icon--alert,.notyf__icon--confirm{height:21px;width:21px;background:#fff;border-radius:50%;display:block;margin:0 auto;position:relative}.notyf__icon--alert:after,.notyf__icon--alert:before{content:"";background:#ed3d3d;display:block;position:absolute;width:3px;border-radius:3px;left:9px}.notyf__icon--alert:after{height:3px;top:14px}.notyf__icon--alert:before{height:8px;top:4px}.notyf__icon--confirm:after,.notyf__icon--confirm:before{content:"";background:#3dc763;display:block;position:absolute;width:3px;border-radius:3px}.notyf__icon--confirm:after{height:6px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);top:9px;left:6px}.notyf__icon--confirm:before{height:11px;-webkit-transform:rotate(45deg);transform:rotate(45deg);top:5px;left:10px}.notyf__toast{display:block;overflow:hidden;-webkit-animation:a .3s forwards;animation:a .3s forwards;box-shadow:0 1px 3px 0 rgba(0,0,0,.45);position:relative;padding-right:13px}.notyf__toast.notyf--alert{background:#ed3d3d}.notyf__toast.notyf--confirm{background:#3dc763}.notyf__toast.notyf--disappear{-webkit-animation:b .3s 1 forwards;animation:b .3s 1 forwards;-webkit-animation-delay:.25s;animation-delay:.25s}.notyf__toast.notyf--disappear .notyf__message{opacity:1;-webkit-animation:b .3s 1 forwards;animation:b .3s 1 forwards;-webkit-animation-delay:.1s;animation-delay:.1s}.notyf__toast.notyf--disappear .notyf__icon{opacity:1;-webkit-animation:d .3s 1 forwards;animation:d .3s 1 forwards}.notyf__wrapper{display:table;width:100%;padding-top:20px;padding-bottom:20px;padding-right:15px;border-radius:3px}.notyf__icon{width:20%;text-align:center;font-size:1.3em;-webkit-animation:c .5s forwards;animation:c .5s forwards;-webkit-animation-delay:.25s;animation-delay:.25s}.notyf__icon,.notyf__message{display:table-cell;vertical-align:middle;opacity:0}.notyf__message{width:80%;position:relative;-webkit-animation:a .3s forwards;animation:a .3s forwards;-webkit-animation-delay:.15s;animation-delay:.15s}.notyf{position:fixed;bottom:20px;right:30px;width:20%;color:#fff;z-index:1}@media only screen and (max-width:736px){.notyf__container{width:90%;margin:0 auto;display:block;right:0;left:0}}
+.notyf {
+	z-index: 1001;
+}
\ No newline at end of file
diff --git a/templates/navigate.php b/templates/navigate.php
index 78472417..8eea3478 100644
--- a/templates/navigate.php
+++ b/templates/navigate.php
@@ -44,7 +44,7 @@ style(Application::APP_NAME, 'navigation');
 ?>
 
 
-<div id="app-navigation" class="noborder" style="position: relative">
+<div id="circle-navigation" class="noborder" style="position: relative">
 	<div class="navigation-element" style="height: 100%; padding-top: 15px">
 		<input id="circles_new_name" type="text"
 			   placeholder="<?php p($l->t('Create a new circle')); ?>"/>
@@ -193,7 +193,7 @@ style(Application::APP_NAME, 'navigation');
 
 </div>
 
-<div id="app-navigation" class="circles" style="display: none;">
+<div id="circle-navigation" class="circles" style="display: none;">
 	<input id="circles_search" type="text"
 		   placeholder="<?php p($l->t('Search circles')); ?>"/>
 	<select id="circles_filters">