update collapse

_includes/block-faq-1.html

@@ -19,14 +19,13 @@
   
   for (i = 0; i < coll.length; i++) {
     coll[i].addEventListener("click", function() {
-      this.classList.toggle("open");
+      this.classList.toggle("active");
       let content = this.nextElementSibling;
-      if (content.style.display === "block") {
-        content.style.display = "none";
+      if (content.style.maxHeight){
+        content.style.maxHeight = null;
       } else {
-        content.style.display = "block";
-      }
+        content.style.maxHeight = content.scrollHeight + "px";
+      } 
     });
   }
-  </script>
-  
+  </script>

css/irma.css

@@ -130,7 +130,8 @@ column.text p {
 /* Style the collapsible content. Note: hidden by default */
 .content {
   padding: 0 18px;
-  display: none;
+  background-color: white;
+  max-height: 0;
   overflow: hidden;
-  background-color: #f1f1f1;
+  transition: max-height 0.2s ease-out;
 }