diff --git a/dev/scss/header/vc.scss b/dev/scss/header/vc.scss
index 992fac0..c5d7e7e 100644
--- a/dev/scss/header/vc.scss
+++ b/dev/scss/header/vc.scss
@@ -1,99 +1,104 @@
 @charset "utf-8";
 @import "../util";
 
-$left-padding: 28pt; // 2.8em;
+$left-padding: 4em; // 32pt; // 2.8em;
 $border-size: 2px;
+$bracket-size: .4em; // 4pt;
 
+/**
+ * Virtual Collection Builder
+ */
 .vc {
-  background-color: $light-green;
-  margin-top: 10px;
+  margin-top: 4pt;
+
+  /**
+   * Rules for all docGroups
+   */
   .docGroup {
     position: relative;
     display: inline-block;
+    margin-left: $left-padding; // 28pt
+
+    .docGroup { display: block; }
+
     color: $nearly-white;
-
-    margin-left: $left-padding; // 2.8em
-
-    // .6em .5em
-    border-width: 0 (2 * $border-size);
-
-    padding: {
-      top: 10pt;
-      bottom: 2pt;
-      left: 0pt;
-      right: 6pt;
-    }
-
+    padding: 4pt 2pt 4pt 0pt;
     border: {
       radius: $standard-border-radius * 2;
       style: solid;
+      width: 0 $bracket-size; // .6em .5em
     }
 
-    .docGroup {
-      display: block;
+    // Whiten on hover 
+    &:hover {
+      background-color: rgba(255,255,255,.06);
     }
 
+    &[data-operation] {
+      > .doc:first-child::before,
+      > .docGroup:first-child::before {
+	content: none;
+      }
+      > .doc::before,
+      > .docGroup::before {
+	display: inline-block;
+	position: absolute;
+	text-align: right;
+	width: $left-padding;
+	margin-left: -1 * ($left-padding + .5em); // -28pt
+	color: $dark-green;
+      }
+      > .docGroup::before {
+	margin-left: -1 * ($left-padding + .5em) + (-1 * $bracket-size);
+      }
+    }
+
+    // Or operation
+    &[data-operation=or] {
+      border-color: $dark-orange;
+      > .doc::before,
+      > .docGroup::before {
+	// This will be overruled by JS!
+	content: "or";
+      }
+    }
+
+    // And operation
+    &[data-operation=and] {
+      > .doc::before,
+      > .docGroup::before {
+	// This will be overruled by JS!
+	content: "and";
+      }
+    }
+
+
+    /**
+     * All operators on groups
+     */
     > .operators {
       position: absolute;
       display: block;
       top: 10px;
       vertical-align: middle;
       left: 3px;
-      border-width: 2px 2px 2px 0;
-      border-top-right-radius: 7px;
-      border-bottom-right-radius: 7px;
+      > span:first-child {
+	border: {
+	  top-left-radius: 0;
+	  bottom-left-radius: 0;
+	}
+      }
       margin-left: 100%;
       padding: 0;
     }
-
-    &:hover {
-      background-color: rgba(255,255,255,.05);
-    }
-
-    &[data-operation=or] {
-      border-color: $dark-orange;
-      > .doc::before,
-      > .docGroup::before {
-	content: "or";
-      }
-      > .operators {
-	border-color: $dark-orange;
-	background-color: $dark-orange;
-	color: $nearly-white;
-      }
-    }
-
-    &[data-operation=and] {
-      > .doc::before,
-      > .docGroup::before {
-	content: "and";
-      }
-    }
-
-    &[data-operation] {
-      > .doc:first-child::before,
-      > .docGroup:first-child::before {
-	content: '';
-      }
-      > .doc::before,
-      > .docGroup::before {
-	display: inline-block;
-	text-align: right;
-//	width: 2.2em;
-	width: $left-padding;
-	color: $dark-green;
-      }
-      > .doc::before {
-	padding-right: 1.2em;
-	margin-right: .1em;
-      }
-      > .docGroup::before {
-	position: absolute;
-      }
-    }
   }
 
+
+  /**
+   * All document rules
+   */
   .doc {
+    padding-left: $left-padding;
     > span + span {
       margin-left: 5pt;
     }
@@ -101,28 +106,13 @@
     > span.value {
       font-weight: bold;
     }
+
+    /**
+     * All operators on docs
+     */
     > .operators {
       display: inline-block;
-      border-color: $dark-orange;
-      border-width: 2px 2px 2px 2px;
-      border-radius: 7px;
-
       margin-left: 10px;
-      > span {
-	&.and {
-	  border: {
-	    radius: inherit;
-	    top-right-radius: 0;
-	    bottom-right-radius: 0;
-	  }
-	  &.delete {
-	    border: {
-	      top-left-radius: 0;
-	      bottom-left-radius: 0;
-	    }
-	  }
-	}
-      }
     }
     > span.key {
       position: relative;
@@ -139,9 +129,11 @@
       display: inline-block;
       color: $dark-orange;
       &::after {
-	font-family: FontAwesome;
-	font-style: normal;
-	font-weight: normal;
+	font: {
+	  family: FontAwesome;
+	  style: normal;
+	  weight: normal;
+	}
 	content: $fa-rewrite;
 	text-decoration: underline;
       }
@@ -151,36 +143,43 @@
     }
   }
 
+  /**
+   * All operators
+   */
   .operators {
     opacity: 0;
     white-space: nowrap;
     padding: 0;
     font-size: 0;
     line-height: 0;
-    color: $light-green;
-    border-color: $nearly-white;
     text-align: center;
-    font-weight: bold;
-    border-style: solid;
 
     > span {
+      box-shadow: $choose-box-shadow;
       cursor: pointer;
       font-size: 9pt;
-      line-height: 1.3em;
+      line-height: 1.5em;
       padding: 0 4px;
       display: inline-block;
-      &.and {
-	background-color: $nearly-white;
-	color: $light-green;
+      @include choose-item;
+      border-style: solid;
+      border-width: $border-size 0;
+      &:hover {
+	@include choose-hover;
       }
-      &.or {
-	background-color: $dark-orange;
-	color: $nearly-white;
+      &:first-child {
+	border: {
+	  left-width: $border-size;
+	  top-left-radius: $standard-border-radius;
+	  bottom-left-radius: $standard-border-radius;
+	}
       }
-      &.delete {
-	background-color: red;
-	border-radius: inherit;
-	color: $nearly-white;
+      &:last-child {
+	border: {
+	  right-width: $border-size;
+	  top-right-radius: $standard-border-radius;
+	  bottom-right-radius: $standard-border-radius;
+	}
       }
     }
   }
@@ -189,12 +188,6 @@
     margin-left: 0;
   }
 
-
-  .docGroup > .docGroup::before {
-    background-color: red;
-    margin-left: -1 * $left-padding; // -3.4em;
-  }
-
   .doc, .docGroup {
     &:hover > .operators {
       opacity: 1;
@@ -204,15 +197,10 @@
 }
 
 
-/*
-.vc .docGroup[data-operation=and]::before,
-.vc .docGroup[data-operation=and] .operators {
-  background-color: white;
-}
-*/
-
+/**
+ * The z-index cascade for groups.
+ */
 $dg-index : 30;
-
 .docGroup {
   > .operators {
     z-index: $dg-index;