Added animation to navbar buttons and dropdowns

src/css/navbar.css

@@ -34,6 +34,7 @@ ul.nav li > a {
   padding: 14px 16px;
   text-align: center;
   text-decoration: none;
+  transition: background-color .2s ease-in-out;
 }
 
 /* Active navbar button */
@@ -81,12 +82,15 @@ li.nav-dropdown {
 
 /* Dropdown content attributes */
 ul.nav .nav-dropdown-content {
-  display: none;
+  display: block;
+  visibility: hidden;
+  opacity: 0;
   position: absolute;
   min-width: 160px;
   background-color: #111;
   box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
   z-index: 1;
+  transition: visibility .2s, opacity .2s ease-in-out;
 }
 
 /* Each link in dropdown's content */
@@ -110,5 +114,6 @@ ul.nav .nav-dropdown-content {
 
 /* Display the content when the mouse is on dropdown's button */
 .nav-dropdown:hover .nav-dropdown-content {
-    display: block;
+    visibility: visible;
+    opacity: 1;
 }