Adjust spaces and sizes on sidebar

Addressing the changes discussed over skype to fix #6564, and an incoming issue with #6584 in which the absence of the button will create awkward empty spaces.
Took that chance to improve the spacing even further —vertical real state.

----

bonus: changed the colour for the navbar hover status (brown -> darkgreen)

client/less/lib/bootstrap/variables.less

@@ -360,7 +360,7 @@
 
 // Navbar links
 @navbar-default-link-color:                @gray-lighter;
-@navbar-default-link-hover-color:          #4a2b0f;
+@navbar-default-link-hover-color:          darkgreen;
 @navbar-default-link-hover-bg:             @gray-lighter;
 @navbar-default-link-active-color:         @gray-lighter;
 @navbar-default-link-active-bg:            darken(@navbar-default-bg, 6.5%);

client/less/map.less

@@ -3,11 +3,11 @@
  * license: MIT
  */
 .map-aside {
+    width:500px;
 
     z-index: 20000;
     position: fixed;
     top: 0;
-    left: 60%;
     bottom: 0;
     right: 0;
 
@@ -39,20 +39,6 @@
       background-color: @body-bg;
     }
 
-    @media (max-width: 1150px) {
-      left: 45%;
-    }
-    @media (max-width: 944px) {
-      left: 30%;
-    }
-    @media (max-width: 600px) {
-      left: 15%;
-    }
-    @media (max-width: 500px) {
-      left: 0;
-      border-left: none;
-    }
-
     & > iframe {
       flex: 1;
       width: 100%;
@@ -87,24 +73,33 @@
 .map-fixed-header {
   position: fixed;
   background: white;
-  padding-top: 15px;
+  padding-top: 20px;
   width: 100%;
   z-index: 1;
   left: 0;
   top: 0;
+  @media (max-width: 720px) {
+    padding-top:35px;
+  }
 }
 .map-fixed-header p {
   margin: 10px 0 20px;
+  @media (max-width: 720px) {
+    margin-bottom:15px;
+  }
 }
 .map-fixed-header hr {
-  margin:30px 0;
+  margin:35px 0;
+  @media (max-width: 720px) {
+    margin:25px 0;
+  }
 }
 .map-buttons button {
   width:300px;
 }
 
 .map-accordion {
-  margin: 155px auto 0;
+  margin: 140px auto 0;
   width:700px;
   overflow-y: auto;
   position:relative;
@@ -157,11 +152,16 @@
   }
 }
 .challengeBlockTime {
-  margin-right: 20px;
-  margin-top:5px;
-  float:right;
   font-size: 18px;
   color: #BBBBBB;
+  display:block;
+  margin-left: 40px;
+  margin-bottom: 20px;
+  @media (min-width: 721px) {
+    margin-right: 20px;
+    margin-top:-30px;
+    float:right;
+  }
 }
 
 @media (max-width: 720px) {
@@ -169,7 +169,7 @@
     left:0;
     right:0;
     width:100%;
-    margin-top:194px;
+    margin-top:165px;
     h2 {
       margin:15px 0;
       padding:0;
@@ -189,10 +189,6 @@
       }
     }
   }    
-  .challengeBlockTime {
-    float:none;
-    display:block;
-  }
 }
 
 .map-aside-action-item {

server/views/map/show.jade

@@ -20,7 +20,7 @@ block content
                               span.no-link-underline
                                 i.fa.fa-caret-down   
                               | #{challengeBlock.name}
-                              span.challengeBlockTime (#{challengeBlock.time})
+                            span.challengeBlockTime (#{challengeBlock.time})
                           div.margin-left-10(id = "nested-collapse"+challengeBlock.name.replace(/\W/gi, '').split(' ').join('-') class = "collapse in map-collapse no-transition")
                               for challenge in challengeBlock.challenges
                                   if challenge.completed
@@ -68,7 +68,7 @@ block content
                     span.no-link-underline
                       i.fa.fa-caret-down  
                     | Nonprofit Projects 
-                    span.challengeBlockTime (800 hours)
+                  span.challengeBlockTime (800 hours)
                 div.margin-left-10(id = "nested-collapse-nonprofit-projects" class = "collapse in map-collapse no-transition")
                       p.challengeBlockDescription To qualify for these nonprofit projects, you must first earn all three foundational certifications: Front End, Data Visualization, and Back End
                       p.disabled.text-primary.ion-locked.padded-ionic-icon.negative-15(name="Greenfield Nonprofit Project #1") Greenfield Nonprofit Project #1
@@ -96,7 +96,7 @@ block content
                     span.no-link-underline
                       i.fa.fa-caret-down  
                     | Coding Interview Training 
-                    span.challengeBlockTime (70 hours)
+                  span.challengeBlockTime (70 hours)
                 div.margin-left-10(id = "nested-collapse-coding-interview-training" class = "collapse in map-collapse no-transition")
                       p.challengeBlockDescription To qualify for this coding interview training, you must first earn all four certifications: Front End, Data Visualization, Back End, and Full Stack
                       p.disabled.text-primary.ion-locked.padded-ionic-icon.negative-15(name="Soft Skill Training") Soft Skill Training
@@ -107,7 +107,7 @@ block content
                       span.no-link-underline
                         i.fa.fa-caret-down  
                       | Mock Interviews 
-                      span.challengeBlockTime (10 hours)
+                    span.challengeBlockTime (10 hours)
                   div.margin-left-10(id = "nested-collapse-mock-interviews" class = "collapse in map-collapse no-transition")
                         p.challengeBlockDescription To qualify for these mock interviews, you must first earn all four certifications: Front End, Data Visualization, Back End, and Full Stack
                         p.disabled.text-primary.ion-locked.padded-ionic-icon.negative-15(name="Mock Interview #1") Mock Interview #1