diff --git a/css/custom2_4.3.css b/css/custom2_4.3.css
index 0b58703..64733d5 100644
--- a/css/custom2_4.3.css
+++ b/css/custom2_4.3.css
@@ -282,7 +282,15 @@ li::marker {
    font-family: 'Humanist-777', 'Roboto';
    white-space: nowrap;
  }
- 
+
+.btn-outline-warning-mod {
+	border-color: rgba(0,0,0,.125)!important;
+}
+
+.btn-outline-warning-mod:hover {
+	background-color: #dae0e5!important;
+}
+
 /* ------- customize colors -------- */   
 
 /* LINK utili:
diff --git a/index_4.4.html b/index_4.4.html
index 32fe3e3..5d9eb73 100644
--- a/index_4.4.html
+++ b/index_4.4.html
@@ -81,21 +81,16 @@
 				<div class="collapse navbar-collapse"
 					id="bs-example-navbar-collapse-1">
 					<ul class="navbar-nav">
-						<li class="nav-item active pt-1"><a class="nav-link" href="#">Canti
-								<span class="sr-only">(current)</span>
-						</a></li>
-						<li class="nav-item pt-1"><a class="nav-link" href="#">Metafore
-								<span class="sr-only">(current)</span>
-						</a></li>
 						<li class="nav-item dropdown pt-1">
 							<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-									Altro
+									Info
 							</a>
 							<div class="dropdown-menu" aria-labelledby="navbarDropdown">
 								<a class="dropdown-item stileLink" id="style1" href="#">Stile 1</a>
 								<a class="dropdown-item stileLink" id="style2" href="#">Stile 2</a>
 								<div class="dropdown-divider"></div>
-								<a class="dropdown-item" href="#">Altro ancora</a>
+								<a class="dropdown-item" href="#">Aiuto</a>
+								<a class="dropdown-item" href="#">Crediti</a>
 							</div>			
 						</li>
 					</ul>
@@ -489,7 +484,7 @@
 										</div>
 									</div>
   									<div class="tab-pane fade p-0 bg-lida-vis" id="vis1" role="tabpanel" aria-labelledby="vis1-tab">
-										<div id='displayinfo' class="p-0">
+										<div id='displayinfo' class="p-0 pl-3">
 											<div class="card card-body well well-sm m-1 mt-2 p-0" id="infoCard0">
 												<span class="p-3 text-muted bg-lida-vis small" style="opacity: 0.6;">Nessuna struttura visualizzata</span>
 											</div>
diff --git a/js/cesareBrowse.js b/js/cesareBrowse.js
index beac507..3b5b050 100644
--- a/js/cesareBrowse.js
+++ b/js/cesareBrowse.js
@@ -816,14 +816,14 @@ function resetFrasi(){
 		allGrouplKeys.sort().some(function(k){ 
 			if (k==id || ~k.indexOf(id+'-')){
 				//console.log('gruppo commenti '+k)
-				//console.log (commentsJson[k])
+				console.log (commentsJson[k].length)
 				gruppoVersi = k.split("_").slice(-1)[0]
 				if (gruppoVersi.includes("-")) {
 					versText = ", Versi " + gruppoVersi;
 				} else {
 					versText = ", Verso " + gruppoVersi;
 				}
-				currentGroup = createNoteGroup(cantica, getRoman(parcid[2]), versText, k)
+				currentGroup = createNoteGroup(cantica, getRoman(parcid[2]), versText, k, commentsJson[k].length)
 				commentsJson[k].forEach(function (value, i) {
 					currentGroup.append(createNoteEntry(value,k,i))
 				});
@@ -834,9 +834,27 @@ function resetFrasi(){
 
 	})
 
-	function createNoteGroup(cantica, canto, versi, id) {
-		var noteGroupCard = $('<div class="card card-body well well-sm mx-1 my-2 p-0" id="noteGroupCard' + id + '" style="background-color: #cfdeec">');
-		noteGroupCard.append('<h6 class="card-title m-2 text-warning">' + cantica + ", Canto " + canto + versi + "</h6>");
+	function createNoteGroup(cantica, canto, versi, id, len) {
+		var noteGroupCard = $('<div class="card card-body cardGroup well well-sm mx-1 my-2 p-0" id="noteGroupCard' + id + '" style="background-color: #cfdeec">');
+
+		var commentHeader = $('<div class="d-flex align-content-start flex-nowrap text-muted" id="commentoGruppoVersi' + id + '">')
+		var rigaNota = $('<div class="p-0 m-0">');
+		var buttons = $('<div class="d-flex flex-wrap-reverse ml-auto align-items-center justify-content-end px-1 pt-1 pb-0">')
+		var closeButton = $('<button id="closeNote'+id+'"'+
+				'class="btn btn-sm btn-outline-warning btn-outline-warning-mod closeNote rounded text-warning align-self-end px-1 pb-0 ml-1 mb-1">'+
+				'<ion-icon name="close-circle"></ion-icon>');
+		if (len > 1) {
+			closeButton.appendTo(buttons);
+			var commentiSP = " commenti su "
+		} else {
+			var commentiSP = " commento su "
+		}
+		//noteGroupCard.append('<h6 class="card-title m-2 text-warning">' + cantica + ", Canto " + canto + versi + "</h6>");
+		rigaNota.append('<h6 class="card-title m-2 text-warning"><span class="badge badge-warning badge-pill mx-1">' + len + "</span>" + commentiSP + cantica + ", Canto " + canto + versi + "</h6>");
+		rigaNota.appendTo(commentHeader);
+		buttons.appendTo(commentHeader);
+		commentHeader.appendTo(noteGroupCard);
+
 		return noteGroupCard;
 	}
 	
diff --git a/js/script_4.4.js b/js/script_4.4.js
index da12f58..59c94ef 100644
--- a/js/script_4.4.js
+++ b/js/script_4.4.js
@@ -431,7 +431,7 @@ $(document).ready(function() {
 	// Evento: click sull'icona rimuovi nota
     $('#displaynote').on('click', '.closeNote', function() {
 		var noteListItemId = $(this).closest('.card');
-		if ($(noteListItemId).siblings(".card-body").length == 0) {
+		if (($(noteListItemId).siblings(".card-body").length == 0) && !($(noteListItemId).hasClass("cardGroup")) ) {
 			$(noteListItemId).parent().remove()
 		} else {
 			$(noteListItemId).remove();