Added collapsable entries for projects

assets/css/main.css

@@ -2818,6 +2818,61 @@ input, select, textarea {
 				border-top: 0;
 			}
 
+/* Accordion */ 
+
+	.accordion {
+		/*border: solid 1px rgba(255, 255, 255, 0.3);
+		border-left: 0;
+		border-right: 0;*/
+
+		/*background-color: rgba(255, 255, 255, 0.075);*/
+		background-color: transparent;
+		color: #ffffff;
+		cursor: pointer;
+		
+		padding: 18px;
+		width: 100%;
+		border: none;
+		text-align: left;
+		outline: none;
+		/*font-size: 15px;*/
+
+		font-size: 0.9em;
+		font-weight: 300;
+		transition: 0.4s;/*
+		border-top: solid 1px rgba(255, 255, 255, 0.3);
+		border-bottom: solid 1px rgba(255, 255, 255, 0.3);*/
+		border-collapse: separate;
+	}
+	
+	.active, .accordion:hover {
+		border: solid 1px rgba(255, 255, 255, 0.3);
+		border-left: 0;
+		border-right: 0;
+		background-color: rgba(255, 255, 255, 0.15);
+	}
+	
+	.accordion:after {
+		content: '\002B';
+		color: #777;
+		font-weight: bold;
+		float: left;
+		margin-right: 15px;
+	}
+	
+	.active:after {
+		content: "\2212";
+	}
+	
+	.panel {
+		padding: 0 18px;
+		font-size: 0.9em;
+		font-weight: 300;
+		max-height: 0;
+		overflow: hidden;
+		transition: max-height 0.2s ease-out;
+	}
+
 /* Button */
 
 	input[type="submit"],

assets/js/accordion.js

@@ -0,0 +1,18 @@
+var acc = document.getElementsByClassName("accordion");
+var i;
+
+for (i = 0; i < acc.length; i++) {
+  acc[i].addEventListener("click", function() {
+    /* Toggle between adding and removing the "active" class,
+    to highlight the button that controls the panel */
+    this.classList.toggle("active");
+
+    /* Toggle between hiding and showing the active panel */
+    var panel = this.nextElementSibling;
+    if (panel.style.maxHeight) {
+      panel.style.maxHeight = null;
+    } else {
+      panel.style.maxHeight = panel.scrollHeight + "px";
+    } 
+  });
+}