Beginning comment view, fixes to message colors

11 years ago · 58981ff28d
28 changed files with 486 additions and 292 deletions
--- a/build/minified/collections/grid.min.css
+++ b/build/minified/collections/grid.min.css
@ -1 +1 @@
-.ui.grid{width:100%;display:block;text-align:center;font-size:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box}.ui.grid:after,.ui.row:after{content:".";display:block;height:0;clear:both;visibility:hidden}.ui.grid>.column,.ui.grid>.row>.column{display:inline-block;text-align:left;font-size:1rem;padding-left:1.33%;padding-right:1.33%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box;vertical-align:top}.ui.grid>.row{display:block;width:100%}.ui.grid>.row{margin-top:2%;padding-top:2%}.ui.grid>.row:first-child{padding-top:0rem;margin-top:0rem}.ui.grid>.row>img,.ui.grid>.row>.column>img{max-width:100%}.ui.grid .column>.ui.segment:only-child{margin:0}.ui.grid .column>.grid{margin-left:-1.333%;margin-right:-1.333%}.ui.page.grid{padding:0 5%}@media only screen and (max-width:1000px){.ui.responsive.grid{padding:0 5.55%}}@media only screen and (min-width:1000px){.ui.responsive.grid{padding:0 8%}}@media only screen and (min-width:1500px){.ui.responsive.grid{padding:0 13%}}@media only screen and (min-width:1750px){.ui.responsive.grid{padding:0 18%}}@media only screen and (min-width:2000px){.ui.responsive.grid{padding:0 20%}}.ui.grid .one.wide.column{width:8.3333%}.ui.grid .two.wide.column{width:16.66667%}.ui.grid .three.wide.column{width:25%}.ui.grid .four.wide.column{width:33.3333%}.ui.grid .five.wide.column{width:41.6666%}.ui.grid .six.wide.column{width:50%}.ui.grid .seven.wide.column{width:58.3333%}.ui.grid .eight.wide.column{width:66.6666%}.ui.grid .nine.wide.column{width:75%}.ui.grid .ten.wide.column{width:83.3333%}.ui.grid .eleven.wide.column{width:91.666%}.ui.grid .twelve.wide.column{width:100%}.ui.grid>.column,.ui.grid>.row>.column{width:8.3333%}.ui.grid>.column:only-child,.ui.grid>.row>.column:only-child{width:100%}.ui.two.column.grid .column{width:50%}.ui.three.column.grid .column{width:33.3333%}.ui.four.column.grid .column{width:25%}.ui.five.column.grid .column{width:20%}.ui.six.column.grid .column{width:16.66667%}.ui.seven.column.grid .column{width:14.2857%}.ui.eight.column.grid .column{width:12.5%}.ui.nine.column.grid .column{width:11.1111%}.ui.ten.column.grid .column{width:10%}.ui.eleven.column.grid .column{width:9.0909%}.ui.fitted.grid{padding:0}.ui.fitted.row{padding-top:0}.ui.fitted.grid .column,.ui.grid .fitted.column{padding-left:0;padding-right:0}.ui.grid .left.floated.column{float:left}.ui.grid .right.floated.column{float:right}.ui.divided.grid>.row{display:table}.ui.divided.grid>.column,.ui.divided.grid>.row>.column{display:table-cell;-webkit-box-shadow:-1px 0 0 0 rgba(0,0,0,.1),-2px 0 0 0 rgba(255,255,255,.9);-moz-box-shadow:-1px 0 0 0 rgba(0,0,0,.1),-2px 0 0 0 rgba(255,255,255,.9);box-shadow:-1px 0 0 0 rgba(0,0,0,.1),-2px 0 0 0 rgba(255,255,255,.9)}.ui.divided.grid>.column:first-child,.ui.divided.grid>.row>.column:first-child{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.ui.celled.grid{-webkit-box-shadow:0 0 0 1px #DFDFDF;-moz-box-shadow:0 0 0 1px #DFDFDF;box-shadow:0 0 0 1px #DFDFDF}.ui.celled.grid>.row{display:table;margin-top:0;padding-top:0;-webkit-box-shadow:0 -1px 0 0 #dfdfdf;-moz-box-shadow:0 -1px 0 0 #dfdfdf;box-shadow:0 -1px 0 0 #dfdfdf}.ui.celled.grid>.column,.ui.celled.grid>.row>.column{display:table-cell;-webkit-box-shadow:-1px 0 0 0 #dfdfdf;-moz-box-shadow:-1px 0 0 0 #dfdfdf;box-shadow:-1px 0 0 0 #dfdfdf}.ui.celled.grid>.column:first-child,.ui.celled.grid>.row>.column:first-child{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.ui.left.aligned.grid .column,.ui.grid .left.aligned.column,.ui.grid>.left.aligned.row .column{text-align:left}.ui.center.aligned.grid .column,.ui.grid .center.aligned.column,.ui.grid>.center.aligned.row .column{text-align:center}.ui.right.aligned.grid .column,.ui.grid .right.aligned.column,.ui.grid>.right.aligned.row .column{text-align:right}.ui.top.aligned.grid .column,.ui.grid .top.aligned.column,.ui.grid>.top.aligned.row .column{vertical-align:top}.ui.middle.aligned.grid .column,.ui.grid .middle.aligned.column,.ui.grid>.middle.aligned.row .column{vertical-align:middle}.ui.bottom.aligned.grid .column,.ui.grid .bottom.aligned.column,.ui.grid>.bottom.aligned.row .column{vertical-align:bottom}.ui.grid .equal.row .column{display:table-cell}.ui.fitted.grid{margin-left:-1.333%;margin-right:-1.333%}@media only screen and (max-width:1000px){.ui.folding.grid{display:block!important}.ui.folding.grid .column{display:block!important;width:100%!important;padding:0!important}}
+.ui.grid{width:100%;display:block;text-align:center;font-size:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box}.ui.grid:after,.ui.row:after{content:".";display:block;height:0;clear:both;visibility:hidden}.ui.grid>.column,.ui.grid>.row>.column{display:inline-block;text-align:left;font-size:1rem;padding-left:2%;padding-right:2%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box;vertical-align:top}.ui.grid>.row{display:block;width:100%}.ui.grid>.row{margin-top:2%;padding-top:2%}.ui.grid>.row:first-child{padding-top:0rem;margin-top:0rem}.ui.grid>.row>img,.ui.grid>.row>.column>img{max-width:100%}.ui.grid .column>.ui.segment:only-child{margin:0}.ui.grid .column>.grid{margin-left:-1.333%;margin-right:-1.333%}.ui.page.grid{padding:0 5%}@media only screen and (max-width:1000px){.ui.responsive.grid{padding:0 5.55%}}@media only screen and (min-width:1000px){.ui.responsive.grid{padding:0 8%}}@media only screen and (min-width:1500px){.ui.responsive.grid{padding:0 13%}}@media only screen and (min-width:1750px){.ui.responsive.grid{padding:0 18%}}@media only screen and (min-width:2000px){.ui.responsive.grid{padding:0 20%}}.ui.grid .one.wide.column{width:8.3333%}.ui.grid .two.wide.column{width:16.66667%}.ui.grid .three.wide.column{width:25%}.ui.grid .four.wide.column{width:33.3333%}.ui.grid .five.wide.column{width:41.6666%}.ui.grid .six.wide.column{width:50%}.ui.grid .seven.wide.column{width:58.3333%}.ui.grid .eight.wide.column{width:66.6666%}.ui.grid .nine.wide.column{width:75%}.ui.grid .ten.wide.column{width:83.3333%}.ui.grid .eleven.wide.column{width:91.666%}.ui.grid .twelve.wide.column{width:100%}.ui.grid>.column,.ui.grid>.row>.column{width:8.3333%}.ui.grid>.column:only-child,.ui.grid>.row>.column:only-child{width:100%}.ui.two.column.grid .column{width:50%}.ui.three.column.grid .column{width:33.3333%}.ui.four.column.grid .column{width:25%}.ui.five.column.grid .column{width:20%}.ui.six.column.grid .column{width:16.66667%}.ui.seven.column.grid .column{width:14.2857%}.ui.eight.column.grid .column{width:12.5%}.ui.nine.column.grid .column{width:11.1111%}.ui.ten.column.grid .column{width:10%}.ui.eleven.column.grid .column{width:9.0909%}.ui.fitted.grid{padding:0}.ui.fitted.row{padding-top:0}.ui.fitted.grid .column,.ui.grid .fitted.column{padding-left:0;padding-right:0}.ui.grid .left.floated.column{float:left}.ui.grid .right.floated.column{float:right}.ui.divided.grid>.row{display:table}.ui.divided.grid>.column,.ui.divided.grid>.row>.column{display:table-cell;-webkit-box-shadow:-1px 0 0 0 rgba(0,0,0,.1),-2px 0 0 0 rgba(255,255,255,.9);-moz-box-shadow:-1px 0 0 0 rgba(0,0,0,.1),-2px 0 0 0 rgba(255,255,255,.9);box-shadow:-1px 0 0 0 rgba(0,0,0,.1),-2px 0 0 0 rgba(255,255,255,.9)}.ui.divided.grid>.column:first-child,.ui.divided.grid>.row>.column:first-child{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.ui.celled.grid{-webkit-box-shadow:0 0 0 1px #DFDFDF;-moz-box-shadow:0 0 0 1px #DFDFDF;box-shadow:0 0 0 1px #DFDFDF}.ui.celled.grid>.row{display:table;margin-top:0;padding-top:0;-webkit-box-shadow:0 -1px 0 0 #dfdfdf;-moz-box-shadow:0 -1px 0 0 #dfdfdf;box-shadow:0 -1px 0 0 #dfdfdf}.ui.celled.grid>.column,.ui.celled.grid>.row>.column{display:table-cell;padding:2%;-webkit-box-shadow:-1px 0 0 0 #dfdfdf;-moz-box-shadow:-1px 0 0 0 #dfdfdf;box-shadow:-1px 0 0 0 #dfdfdf}.ui.celled.grid>.column:first-child,.ui.celled.grid>.row>.column:first-child{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.ui.left.aligned.grid .column,.ui.grid .left.aligned.column,.ui.grid>.left.aligned.row .column{text-align:left}.ui.center.aligned.grid .column,.ui.grid .center.aligned.column,.ui.grid>.center.aligned.row .column{text-align:center}.ui.right.aligned.grid .column,.ui.grid .right.aligned.column,.ui.grid>.right.aligned.row .column{text-align:right}.ui.top.aligned.grid .column,.ui.grid .top.aligned.column,.ui.grid>.top.aligned.row .column{vertical-align:top}.ui.middle.aligned.grid .column,.ui.grid .middle.aligned.column,.ui.grid>.middle.aligned.row .column{vertical-align:middle}.ui.bottom.aligned.grid .column,.ui.grid .bottom.aligned.column,.ui.grid>.bottom.aligned.row .column{vertical-align:bottom}.ui.grid .equal.row .column{display:table-cell}.ui.fitted.grid{margin-left:-1.333%;margin-right:-1.333%}@media only screen and (max-width:1000px){.ui.folding.grid{display:block!important}.ui.folding.grid .column{display:block!important;width:100%!important;padding:0!important}}
--- a/build/minified/collections/menu.min.css
+++ b/build/minified/collections/menu.min.css
--- a/build/minified/collections/message.min.css
+++ b/build/minified/collections/message.min.css
@ -1 +1 @@
-.ui.message{position:relative;min-height:18px;margin:1em 0;height:auto;background-color:rgba(0,0,0,.04);padding:1em;line-height:1.33;color:rgba(0,0,0,.6);-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px}.ui.message .header{font-size:1.33em;font-weight:700}.ui.message .header+p{margin-top:0}.ui.message p{opacity:.85;margin:1em 0}.ui.message>:first-child{margin-top:0}.ui.message>:last-child{margin-bottom:0}.ui.message ul.list{opacity:.85;list-style-position:inside;margin:.2em 0;padding:0}.ui.message ul.list li{position:relative;list-style-type:none;font-style:italic;margin:0 0 0 1em;padding:0}.ui.message ul.list li:before{position:absolute;content:'\2022';top:-.05em;left:-.8em;height:100%;vertical-align:baseline;opacity:.5}.ui.message ul.list li:first-child{margin-top:0}.ui.message>.icon.close{cursor:pointer;position:absolute;top:1em;right:.5em;opacity:.7;-webkit-transition:opacity .1s linear;-moz-transition:opacity .1s linear;-o-transition:opacity .1s linear;-ms-transition:opacity .1s linear;transition:opacity .1s linear}.ui.message>.icon.close:hover{opacity:1}.ui.message.visible,.ui.header.visible{display:block!important}.ui.message.hidden,.ui.header.hidden{display:none}.ui.compact.message{display:inline-block}.ui.attached.message{margin-bottom:0;-webkit-border-radius:4px 4px 0 0;-moz-border-radius:4px 4px 0 0;border-radius:4px 4px 0 0;-webkit-box-shadow:0 0 0 1px #DDD;-moz-box-shadow:0 0 0 1px #DDD;box-shadow:0 0 0 1px #DDD}.ui.bottom.attached.message{margin-top:0;-webkit-border-radius:0 0 4px 4px;-moz-border-radius:0 0 4px 4px;border-radius:0 0 4px 4px;-webkit-box-shadow:0 0 0 1px #DDD;-moz-box-shadow:0 0 0 1px #DDD;box-shadow:0 0 0 1px #DDD}.ui.icon.message>.icon{display:table-cell;vertical-align:middle;font-size:3.8em;padding-right:.4em;opacity:.2}.ui.icon.message>.content{display:table-cell;vertical-align:middle}.ui.inverted.message{background-color:rgba(255,255,255,.05);color:rgba(255,255,255,.95)}.ui.black.message{background-color:#333;color:rgba(255,255,255,.95)}.ui.blue.message,.ui.info.message{border-color:#75C9E9;background-color:#E9F9FF;color:#1D6582}.ui.green.message,.ui.success.message,.ui.positive.message{background-color:#EEFFE9;color:#119000;border-color:#2FCB05}.ui.yellow.message,.ui.warning.message{background-color:#F6F3D5;border-color:#CBB105;color:#AF9801}.ui.red.message,.ui.error.message,.ui.negative.message{background-color:#F1D7D7;color:#AD0000;border-color:#B06C6C}.ui.small.message{font-size:.875em}.ui.message{font-size:1em}.ui.large.message{font-size:1.125em}.ui.huge.message{font-size:1.5em}.ui.massive.message{font-size:2em}
+.ui.message{position:relative;min-height:18px;margin:1em 0;height:auto;background-color:rgba(0,0,0,.04);padding:1em;line-height:1.33;color:rgba(0,0,0,.6);-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px}.ui.message .header{font-size:1.33em;font-weight:700}.ui.message .header+p{margin-top:0}.ui.message p{opacity:.85;margin:1em 0}.ui.message>:first-child{margin-top:0}.ui.message>:last-child{margin-bottom:0}.ui.message ul.list{opacity:.85;list-style-position:inside;margin:.2em 0;padding:0}.ui.message ul.list li{position:relative;list-style-type:none;font-style:italic;margin:0 0 0 1em;padding:0}.ui.message ul.list li:before{position:absolute;content:'\2022';top:-.05em;left:-.8em;height:100%;vertical-align:baseline;opacity:.5}.ui.message ul.list li:first-child{margin-top:0}.ui.message>.icon.close{cursor:pointer;position:absolute;top:1em;right:.5em;opacity:.7;-webkit-transition:opacity .1s linear;-moz-transition:opacity .1s linear;-o-transition:opacity .1s linear;-ms-transition:opacity .1s linear;transition:opacity .1s linear}.ui.message>.icon.close:hover{opacity:1}.ui.message.visible,.ui.header.visible{display:block!important}.ui.message.hidden,.ui.header.hidden{display:none}.ui.compact.message{display:inline-block}.ui.attached.message{margin-bottom:0;-webkit-border-radius:4px 4px 0 0;-moz-border-radius:4px 4px 0 0;border-radius:4px 4px 0 0;-webkit-box-shadow:0 0 0 1px #DDD;-moz-box-shadow:0 0 0 1px #DDD;box-shadow:0 0 0 1px #DDD}.ui.bottom.attached.message{margin-top:0;-webkit-border-radius:0 0 4px 4px;-moz-border-radius:0 0 4px 4px;border-radius:0 0 4px 4px;-webkit-box-shadow:0 0 0 1px #DDD;-moz-box-shadow:0 0 0 1px #DDD;box-shadow:0 0 0 1px #DDD}.ui.icon.message>.icon{display:table-cell;vertical-align:middle;font-size:3.8em;padding-right:.4em;opacity:.2}.ui.icon.message>.content{display:table-cell;vertical-align:middle}.ui.inverted.message{background-color:rgba(255,255,255,.05);color:rgba(255,255,255,.95)}.ui.black.message{background-color:#333;color:rgba(255,255,255,.95)}.ui.blue.message,.ui.info.message{border-color:#E4F5FB;background-color:#E9F9FF;color:#4D8796}.ui.green.message,.ui.success.message,.ui.positive.message{background-color:#DEFCD5;color:#119000;border-color:#4D965B}.ui.yellow.message,.ui.warning.message{background-color:#F6F3D5;border-color:#CBB105;color:#96904D}.ui.red.message,.ui.error.message,.ui.negative.message{background-color:#F1D7D7;color:#AD0000;border-color:#964D4D}.ui.small.message{font-size:.875em}.ui.message{font-size:1em}.ui.large.message{font-size:1.125em}.ui.huge.message{font-size:1.5em}.ui.massive.message{font-size:2em}
--- a/build/minified/elements/segment.min.css
+++ b/build/minified/elements/segment.min.css
@ -1 +1 @@
-.ui.segment{position:relative;background-color:#FFF;-webkit-box-shadow:0 0 0 1px rgba(0,0,0,.1);-moz-box-shadow:0 0 0 1px rgba(0,0,0,.1);box-shadow:0 0 0 1px rgba(0,0,0,.1);margin:1em 0;padding:1.3em 1em;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box;overflow:hidden}.ui.vertical.segment{margin:0;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;-webkit-box-shadow:0 1px 0 rgba(0,0,0,.1),0 -1px 0 rgba(0,0,0,.1);-moz-box-shadow:0 1px 0 rgba(0,0,0,.1),0 -1px 0 rgba(0,0,0,.1);box-shadow:0 1px 0 rgba(0,0,0,.1),0 -1px 0 rgba(0,0,0,.1)}.ui.horizontal.segment{margin:0;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;-webkit-box-shadow:1px 0 0 rgba(0,0,0,.1),-1px 0 0 rgba(0,0,0,.1);-moz-box-shadow:1px 0 0 rgba(0,0,0,.1),-1px 0 0 rgba(0,0,0,.1);box-shadow:1px 0 0 rgba(0,0,0,.1),-1px 0 0 rgba(0,0,0,.1)}.ui.segment>:first-child{margin-top:0}.ui.segment>:last-child{margin-bottom:0}.ui.segment>:only-child{margin:0}.ui.segment>.attached.label:first-child+*{margin-top:2em}.ui.segment>.bottom.attached.label:first-child+*{margin-top:0}.ui.disabled.segment{opacity:.8;color:#DDD}.ui.basic.segment{position:relative;background-color:transparent;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.ui.basic.segment:before{position:absolute;top:0;width:100%;content:'';height:1px;background-color:rgba(0,0,0,.05);border-top:1px solid rgba(255,255,255,.8)}.ui.blue.segment{border-top:.2em solid #6ECFF5}.ui.green.segment{border-top:.2em solid #A1CF64}.ui.red.segment{border-top:.2em solid #EF4D6D}.ui.purple.segment{border-top:.2em solid #564F8A}.ui.teal.segment{border-top:.2em solid #00B5AD}.ui.inverted.black.segment{background-color:#5C6166!important;color:#FFF!important}.ui.inverted.blue.segment{background-color:#6ECFF5!important;color:#FFF!important}.ui.inverted.green.segment{background-color:#A1CF64!important;color:#FFF!important}.ui.inverted.red.segment{background-color:#EF4D6D!important;color:#FFF!important}.ui.inverted.purple.segment{background-color:#564F8A!important;color:#FFF!important}.ui.inverted.teal.segment{background-color:#00B5AD!important;color:#FFF!important}.ui.left.aligned.segment{text-align:left}.ui.right.aligned.segment{text-align:right}.ui.center.aligned.segment{text-align:center}.ui.floated.segment,.ui.left.floated.segment{float:left}.ui.right.floated.segment{float:right}.ui.stacked.segment{padding-bottom:1.2em}.ui.stacked.segment:after,.ui.stacked.segment:before{content:'';position:absolute;bottom:-3px;left:0;border-top:1px solid rgba(0,0,0,.1);background-color:#F8F8F8;width:100%;height:5px}.ui.stacked.segment:before{bottom:0}.ui.raised.segment{-webkit-box-shadow:0 1px 2px 1px rgba(0,0,0,.1);-moz-box-shadow:0 1px 2px 1px rgba(0,0,0,.1);box-shadow:0 1px 2px 1px rgba(0,0,0,.1)}.ui.inverted.segment{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.ui.inverted.segment,.ui.primary.inverted.segment{background-color:#555;color:#FFF}.ui.secondary.inverted.segment{background-color:#777;color:#E2E2E2}.ui.tertiary.inverted.segment{background-color:#B0B0B0;color:#EBEBEB}.ui.primary.segment{background-color:#FFF;color:#555}.ui.secondary.segment{background-color:#F5F5F5;color:#777}.ui.tertiary.segment{background-color:#EBEBEB;color:#B0B0B0}.ui.segment.attached{top:-1px;bottom:-1px;-moz-border-radius:0;-webkit-border-radius:0;border-radius:0;margin:0;-moz-box-shadow:0 0 0 1px #DDD;-webkit-box-shadow:0 0 0 1px #DDD;box-shadow:0 0 0 1px #DDD}.ui.top.attached.segment{top:0;bottom:-1px;margin-top:0;-moz-border-radius:5px 5px 0 0;-webkit-border-radius:5px 5px 0 0;border-radius:5px 5px 0 0}.ui.segment.bottom.attached{top:-1px;bottom:0;margin-bottom:0;-moz-border-radius:0 0 5px 5px;-webkit-border-radius:0 0 5px 5px;border-radius:0 0 5px 5px}
+.ui.segment{position:relative;background-color:#FFF;-webkit-box-shadow:0 0 0 1px rgba(0,0,0,.1);-moz-box-shadow:0 0 0 1px rgba(0,0,0,.1);box-shadow:0 0 0 1px rgba(0,0,0,.1);margin:1em 0;padding:1.3em 1em;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box;overflow:hidden}.ui.vertical.segment{margin:0;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;-webkit-box-shadow:0 1px 0 rgba(0,0,0,.1),0 -1px 0 rgba(0,0,0,.1);-moz-box-shadow:0 1px 0 rgba(0,0,0,.1),0 -1px 0 rgba(0,0,0,.1);box-shadow:0 1px 0 rgba(0,0,0,.1),0 -1px 0 rgba(0,0,0,.1)}.ui.horizontal.segment{margin:0;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;-webkit-box-shadow:1px 0 0 rgba(0,0,0,.1),-1px 0 0 rgba(0,0,0,.1);-moz-box-shadow:1px 0 0 rgba(0,0,0,.1),-1px 0 0 rgba(0,0,0,.1);box-shadow:1px 0 0 rgba(0,0,0,.1),-1px 0 0 rgba(0,0,0,.1)}.ui.segment>:first-child{margin-top:0}.ui.segment>:last-child{margin-bottom:0}.ui.segment>:only-child{margin:0}.ui.segment>.attached.label:first-child+*{margin-top:2em}.ui.segment>.bottom.attached.label:first-child+*{margin-top:0}.ui.disabled.segment{opacity:.8;color:#DDD}.ui.basic.segment{position:relative;background-color:transparent;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.ui.basic.segment:before{position:absolute;top:0;width:100%;content:'';height:1px;background-color:rgba(0,0,0,.05);border-top:1px solid rgba(255,255,255,.8)}.ui.blue.segment{border-top:.2em solid #6ECFF5}.ui.green.segment{border-top:.2em solid #A1CF64}.ui.red.segment{border-top:.2em solid #EF4D6D}.ui.purple.segment{border-top:.2em solid #564F8A}.ui.teal.segment{border-top:.2em solid #00B5AD}.ui.inverted.black.segment{background-color:#5C6166!important;color:#FFF!important}.ui.inverted.blue.segment{background-color:#6ECFF5!important;color:#FFF!important}.ui.inverted.green.segment{background-color:#A1CF64!important;color:#FFF!important}.ui.inverted.red.segment{background-color:#EF4D6D!important;color:#FFF!important}.ui.inverted.purple.segment{background-color:#564F8A!important;color:#FFF!important}.ui.inverted.teal.segment{background-color:#00B5AD!important;color:#FFF!important}.ui.left.aligned.segment{text-align:left}.ui.right.aligned.segment{text-align:right}.ui.center.aligned.segment{text-align:center}.ui.floated.segment,.ui.left.floated.segment{float:left}.ui.right.floated.segment{float:right}.ui.stacked.segment{padding-bottom:1.7em}.ui.stacked.segment:after,.ui.stacked.segment:before{content:'';position:absolute;bottom:-3px;left:0;border-top:1px solid rgba(0,0,0,.1);background-color:#F8F8F8;width:100%;height:5px}.ui.stacked.segment:before{bottom:0}.ui.raised.segment{-webkit-box-shadow:0 1px 2px 1px rgba(0,0,0,.1);-moz-box-shadow:0 1px 2px 1px rgba(0,0,0,.1);box-shadow:0 1px 2px 1px rgba(0,0,0,.1)}.ui.inverted.segment{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.ui.inverted.segment,.ui.primary.inverted.segment{background-color:#555;color:#FFF}.ui.secondary.inverted.segment{background-color:#777;color:#E2E2E2}.ui.tertiary.inverted.segment{background-color:#B0B0B0;color:#EBEBEB}.ui.primary.segment{background-color:#FFF;color:#555}.ui.secondary.segment{background-color:#F5F5F5;color:#777}.ui.tertiary.segment{background-color:#EBEBEB;color:#B0B0B0}.ui.segment.attached{top:-1px;bottom:-1px;-moz-border-radius:0;-webkit-border-radius:0;border-radius:0;margin:0;-moz-box-shadow:0 0 0 1px #DDD;-webkit-box-shadow:0 0 0 1px #DDD;box-shadow:0 0 0 1px #DDD}.ui.top.attached.segment{top:0;bottom:-1px;margin-top:0;-moz-border-radius:5px 5px 0 0;-webkit-border-radius:5px 5px 0 0;border-radius:5px 5px 0 0}.ui.segment.bottom.attached{top:-1px;bottom:0;margin-bottom:0;-moz-border-radius:0 0 5px 5px;-webkit-border-radius:0 0 5px 5px;border-radius:0 0 5px 5px}
--- a/build/minified/elements/step.min.css
+++ b/build/minified/elements/step.min.css
@ -1 +1 @@
-.ui.steps{display:inline-block;font-size:0;-moz-box-shadow:0 0 0 1px rgba(0,0,0,.1);-webkit-box-shadow:0 0 0 1px rgba(0,0,0,.1);box-shadow:0 0 0 1px rgba(0,0,0,.1);-moz-border-radius:.3125em;-webkit-border-radius:.3125em;border-radius:.3125em}.ui.steps .step{display:inline-block;position:relative;padding:.82em 1.5em .82em 2.5em;background-color:#FFF;color:#888}.ui.steps .step:after{position:absolute;content:'';z-index:2;top:.45em;right:-1em;width:2em;height:2em;border-top:1px solid rgba(0,0,0,.1);border-right:1px solid rgba(0,0,0,.1);background-color:#FFF;-moz-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg)}.ui.steps .step:first-child{padding-left:20.3125em;-webkit-border-radius:.3125em 0 0 .3125em;-moz-border-radius:.3125em 0 0 .3125em;border-radius:.3125em 0 0 .3125em}.ui.steps .step:last-child{-webkit-border-radius:0 .3125em .3125em 0;-moz-border-radius:0 .3125em .3125em 0;border-radius:0 .3125em .3125em 0}.ui.steps .step:last-child{margin-right:0}.ui.steps .step:last-child:after{width:0!important;height:0!important}.attached.ui.steps{margin:0;-webkit-border-radius:.3125em .3125em 0 0;-moz-border-radius:.3125em .3125em 0 0;border-radius:.3125em .3125em 0 0}.attached.ui.steps .step:first-child{-webkit-border-radius:.3125em 0 0;-moz-border-radius:.3125em 0 0;border-radius:.3125em 0 0}.attached.ui.steps .step:last-child{-webkit-border-radius:0 .3125em 0 0;-moz-border-radius:0 .3125em 0 0;border-radius:0 .3125em 0 0}.bottom.attached.ui.steps{margin-top:-1px;-webkit-border-radius:0 0 .3125em .3125em;-moz-border-radius:0 0 .3125em .3125em;border-radius:0 0 .3125em .3125em}.bottom.attached.ui.steps .step:first-child{-webkit-border-radius:0 0 0 .3125em;-moz-border-radius:0 0 0 .3125em;border-radius:0 0 0 .3125em}.bottom.attached.ui.steps .step:last-child{-webkit-border-radius:0 0 .3125em;-moz-border-radius:0 0 .3125em;border-radius:0 0 .3125em}.ui.steps.fluid,.ui.steps.fluid>.step{width:100%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box}.ui.steps.two.fluid>.step{width:50%}.ui.steps.three.fluid>.step{width:33.333%}.ui.steps.four.fluid>.step{width:25%}.ui.steps.five.fluid>.step{width:20%}.ui.steps.six.fluid>.step{width:16.666%}.ui.steps.seven.fluid>.step{width:14.285%}.ui.steps.eight.fluid>.step{width:12.5%}.ui.steps .step{font-size:1rem}.ui.steps .hover.step{cursor:pointer;background:-webkit-linear-gradient(top,#fff 0,#f0f0f0 100%);background:-moz-linear-gradient(top,#fff 0,#f0f0f0 100%);background:-o-linear-gradient(top,#fff 0,#f0f0f0 100%);background:-ms-linear-gradient(top,#fff 0,#f0f0f0 100%);background:linear-gradient(top,#fff 0,#f0f0f0 100%);-moz-box-shadow:0 0 2px rgba(0,0,0,.2);-webkit-box-shadow:0 0 2px rgba(0,0,0,.2);box-shadow:0 0 2px rgba(0,0,0,.2)}.ui.steps .hover.step:after{cursor:pointer;background:-webkit-linear-gradient(top left,#fff 0,#f0f0f0 100%);background:-moz-linear-gradient(top left,#fff 0,#f0f0f0 100%);background:-o-linear-gradient(top left,#fff 0,#f0f0f0 100%);background:-ms-linear-gradient(top left,#fff 0,#f0f0f0 100%);background:linear-gradient(top left,#fff 0,#f0f0f0 100%);-moz-box-shadow:2px -2px 1px rgba(0,0,0,.2);-webkit-box-shadow:2px -2px 1px rgba(0,0,0,.2);box-shadow:2px -2px 1px rgba(0,0,0,.2)}.ui.steps .hover.step:before{position:absolute;top:7px;left:-10.3125em;width:32px;height:31px;content:'';background-color:transparent;background-image:none;-moz-box-shadow:-1px 1px 1px 0 rgba(0,0,0,.1) inset;-webkit-box-shadow:-1px 1px 1px 0 rgba(0,0,0,.1) inset;box-shadow:-1px 1px 1px 0 rgba(0,0,0,.1) inset;-moz-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg);z-index:2}.ui.steps .hover:first-child:before{width:0;height:0}.ui.steps .down.step{background:-webkit-linear-gradient(top,#f0f0f0 0,#fff 100%);background:-moz-linear-gradient(top,#f0f0f0 0,#fff 100%);background:-o-linear-gradient(top,#f0f0f0 0,#fff 100%);background:-ms-linear-gradient(top,#f0f0f0 0,#fff 100%);background:linear-gradient(top,#f0f0f0 0,#fff 100%)}.ui.steps .down.step:after{background:-webkit-linear-gradient(top left,#f0f0f0 0,#fff 100%);background:-moz-linear-gradient(top left,#f0f0f0 0,#fff 100%);background:-o-linear-gradient(top left,#f0f0f0 0,#fff 100%);background:-ms-linear-gradient(top left,#f0f0f0 0,#fff 100%);background:linear-gradient(top left,#f0f0f0 0,#fff 100%)}.ui.steps .active.step{cursor:auto;background-color:#555;color:#FFF;font-weight:700}.ui.steps .active.step:first-child:before{width:0;height:0}.ui.steps .active.step:after{background-color:#555;border-color:#555;-moz-box-shadow:-2px 2px 2px rgba(0,0,0,.15) inset;-webkit-box-shadow:-2px 2px 2px rgba(0,0,0,.15) inset;box-shadow:-2px 2px 2px rgba(0,0,0,.15) inset}.ui.steps .disabled.step{color:#BFBFBF}
+.ui.steps{display:inline-block;font-size:0;-moz-box-shadow:0 0 0 1px rgba(0,0,0,.1);-webkit-box-shadow:0 0 0 1px rgba(0,0,0,.1);box-shadow:0 0 0 1px rgba(0,0,0,.1);-moz-border-radius:.3125rem;-webkit-border-radius:.3125rem;border-radius:.3125rem}.ui.steps .step{display:inline-block;position:relative;padding:.82em 2em .82em 3em;background-color:#FFF;color:#888}.ui.steps .step:after{position:absolute;content:'';z-index:2;top:.45em;right:-1em;width:2em;height:2em;border-top:1px solid rgba(0,0,0,.1);border-right:1px solid rgba(0,0,0,.1);background-color:#FFF;-moz-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg)}.ui.steps .step:first-child{padding-left:1.35em;-webkit-border-radius:.3125em 0 0 .3125em;-moz-border-radius:.3125em 0 0 .3125em;border-radius:.3125em 0 0 .3125em}.ui.steps .step:last-child{-webkit-border-radius:0 .3125em .3125em 0;-moz-border-radius:0 .3125em .3125em 0;border-radius:0 .3125em .3125em 0}.ui.steps .step:last-child{margin-right:0}.ui.steps .step:last-child:after{width:0!important;height:0!important}.attached.ui.steps{margin:0;-webkit-border-radius:.3125em .3125em 0 0;-moz-border-radius:.3125em .3125em 0 0;border-radius:.3125em .3125em 0 0}.attached.ui.steps .step:first-child{-webkit-border-radius:.3125em 0 0;-moz-border-radius:.3125em 0 0;border-radius:.3125em 0 0}.attached.ui.steps .step:last-child{-webkit-border-radius:0 .3125em 0 0;-moz-border-radius:0 .3125em 0 0;border-radius:0 .3125em 0 0}.bottom.attached.ui.steps{margin-top:-1px;-webkit-border-radius:0 0 .3125em .3125em;-moz-border-radius:0 0 .3125em .3125em;border-radius:0 0 .3125em .3125em}.bottom.attached.ui.steps .step:first-child{-webkit-border-radius:0 0 0 .3125em;-moz-border-radius:0 0 0 .3125em;border-radius:0 0 0 .3125em}.bottom.attached.ui.steps .step:last-child{-webkit-border-radius:0 0 .3125em;-moz-border-radius:0 0 .3125em;border-radius:0 0 .3125em}.ui.steps.fluid,.ui.steps.fluid>.step{width:100%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box}.ui.steps.two.fluid>.step{width:50%}.ui.steps.three.fluid>.step{width:33.333%}.ui.steps.four.fluid>.step{width:25%}.ui.steps.five.fluid>.step{width:20%}.ui.steps.six.fluid>.step{width:16.666%}.ui.steps.seven.fluid>.step{width:14.285%}.ui.steps.eight.fluid>.step{width:12.5%}.ui.steps .step{font-size:1rem}.ui.steps .hover.step{cursor:pointer;background:-webkit-linear-gradient(top,#fff 0,#f0f0f0 100%);background:-moz-linear-gradient(top,#fff 0,#f0f0f0 100%);background:-o-linear-gradient(top,#fff 0,#f0f0f0 100%);background:-ms-linear-gradient(top,#fff 0,#f0f0f0 100%);background:linear-gradient(top,#fff 0,#f0f0f0 100%);-moz-box-shadow:0 0 2px rgba(0,0,0,.2);-webkit-box-shadow:0 0 2px rgba(0,0,0,.2);box-shadow:0 0 2px rgba(0,0,0,.2)}.ui.steps .hover.step:after{cursor:pointer;background:-webkit-linear-gradient(top left,#fff 0,#f0f0f0 100%);background:-moz-linear-gradient(top left,#fff 0,#f0f0f0 100%);background:-o-linear-gradient(top left,#fff 0,#f0f0f0 100%);background:-ms-linear-gradient(top left,#fff 0,#f0f0f0 100%);background:linear-gradient(top left,#fff 0,#f0f0f0 100%);-moz-box-shadow:2px -2px 1px rgba(0,0,0,.2);-webkit-box-shadow:2px -2px 1px rgba(0,0,0,.2);box-shadow:2px -2px 1px rgba(0,0,0,.2)}.ui.steps .hover.step:before{position:absolute;top:7px;left:-10.3125em;width:32px;height:31px;content:'';background-color:transparent;background-image:none;-moz-box-shadow:-1px 1px 1px 0 rgba(0,0,0,.1) inset;-webkit-box-shadow:-1px 1px 1px 0 rgba(0,0,0,.1) inset;box-shadow:-1px 1px 1px 0 rgba(0,0,0,.1) inset;-moz-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg);z-index:2}.ui.steps .hover:first-child:before{width:0;height:0}.ui.steps .down.step{background:-webkit-linear-gradient(top,#f0f0f0 0,#fff 100%);background:-moz-linear-gradient(top,#f0f0f0 0,#fff 100%);background:-o-linear-gradient(top,#f0f0f0 0,#fff 100%);background:-ms-linear-gradient(top,#f0f0f0 0,#fff 100%);background:linear-gradient(top,#f0f0f0 0,#fff 100%)}.ui.steps .down.step:after{background:-webkit-linear-gradient(top left,#f0f0f0 0,#fff 100%);background:-moz-linear-gradient(top left,#f0f0f0 0,#fff 100%);background:-o-linear-gradient(top left,#f0f0f0 0,#fff 100%);background:-ms-linear-gradient(top left,#f0f0f0 0,#fff 100%);background:linear-gradient(top left,#f0f0f0 0,#fff 100%)}.ui.steps .active.step{cursor:auto;background-color:#555;color:#FFF;font-weight:700}.ui.steps .active.step:first-child:before{width:0;height:0}.ui.steps .active.step:after{background-color:#555;border-color:#555;-moz-box-shadow:-2px 2px 2px rgba(0,0,0,.15) inset;-webkit-box-shadow:-2px 2px 2px rgba(0,0,0,.15) inset;box-shadow:-2px 2px 2px rgba(0,0,0,.15) inset}.ui.steps .disabled.step{color:#BFBFBF}
--- a/build/packaged/semantic.min.css
+++ b/build/packaged/semantic.min.css
--- a/build/uncompressed/collections/grid.css
+++ b/build/uncompressed/collections/grid.css
@ -38,8 +38,8 @@
  display: inline-block;
  text-align: left;
  font-size: 1rem;
-  padding-left: 1.33%;
-  padding-right: 1.33%;
+  padding-left: 2%;
+  padding-right: 2%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
@ -259,6 +259,7 @@
 .ui.celled.grid > .column,
 .ui.celled.grid > .row > .column {
  display: table-cell;
+  padding: 2%;
  -webkit-box-shadow: -1px 0px 0px 0px #dfdfdf;
  -moz-box-shadow: -1px 0px 0px 0px #dfdfdf;
  box-shadow: -1px 0px 0px 0px #dfdfdf;
--- a/build/uncompressed/collections/menu.css
+++ b/build/uncompressed/collections/menu.css
@ -315,6 +315,9 @@
  border-left: 0.2em solid rgba(50, 50, 50, 0.8);
  padding-top: 0.75em;
  padding-left: 0.75em;
+  -webkit-border-radius: 0px 5px 5px 0px;
+  -moz-border-radius: 0px 5px 5px 0px;
+  border-radius: 0px 5px 5px 0px;
 }
 .ui.vertical.menu .active.item .menu .active.item {
  border-left: none;
@ -334,8 +337,107 @@
  background-color: transparent;
 }
 /*******************************
-            Variations
+          Variations
+*******************************/
+/*******************************
+            Types
 *******************************/
+/*--------------
+    Vertical
+---------------*/
+.ui.vertical.menu .item {
+  display: block;
+  border-left: none;
+  border-right: none;
+}
+.ui.vertical.menu > .item:first-child {
+  border-radius: 0.325em 0.325em 0px 0px;
+}
+.ui.vertical.menu > .item:last-child {
+  border-radius: 0px 0px 0.325em 0.325em;
+}
+/*--- Border ---*/
+.ui.vertical.menu .item:before {
+  position: absolute;
+  content: '';
+  top: 0%;
+  left: 0px;
+  width: 100%;
+  height: 1px;
+  background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%);
+  background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%);
+  background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%);
+  background-image: -ms-linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%);
+  background-image: linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%);
+}
+.ui.vertical.menu .item:first-child:before {
+  background-image: none;
+}
+/*--- Dropdown ---*/
+.ui.vertical.menu .dropdown.item > i {
+  float: right;
+}
+.ui.vertical.menu .dropdown.item .menu {
+  width: auto;
+  top: 0%;
+  left: 100%;
+  margin: 0px 0px 0px 1px;
+  -moz-border-radius: 0px 5px 5px 0px;
+  -webkit-border-radius: 0px 5px 5px 0px;
+  border-radius: 0px 5px 5px 0px;
+  border-left: 0.2em solid rgba(50, 50, 50, 0.8);
+  border: 1px solid rgba(0, 0, 0, 0.1);
+  font-size: 1em;
+}
+.ui.vertical.menu .dropdown.item .menu .item {
+  font-size: 1em;
+}
+/*--- Sub Menu ---*/
+.ui.vertical.menu .item > .menu {
+  margin: 0.5em -1em 0em;
+}
+.ui.vertical.menu .item > .menu > .item > .icon {
+  margin-right: 0.7em;
+}
+.ui.vertical.menu .item > .menu > .item {
+  padding: 0.5rem 1.5rem;
+  font-size: 0.85em;
+}
+.ui.vertical.menu .item > .menu > .item:before {
+  display: none;
+}
+.ui.vertical.menu .item > .menu > .item > a {
+  margin: -0.5rem -1.5rem;
+  padding: 0.5rem 1.5rem;
+}
+/*--------------
+     Tiered
+---------------*/
+.ui.tiered.menu .item.active {
+  box-shadow: 0 1px 0 0 #FBFBFB;
+}
+.ui.tiered.menu {
+  border-radius: 0px;
+}
+.ui.tiered.menu .secondary.menu {
+  background-color: rgba(0, 0, 0, 0.01);
+  border-radius: 0em;
+  border-top: 1px solid rgba(0, 0, 0, 0.1);
+  box-shadow: none;
+  color: #FFFFFF;
+}
+.ui.tiered.menu .secondary.menu .item {
+  font-size: 0.9rem;
+}
+.ui.tiered.menu .secondary.menu .item:after {
+  background-image: none;
+}
+.ui.tiered.menu .secondary.menu .active.item {
+  background-color: transparent;
+  border-radius: 0 0 0 0;
+  border-top: medium none;
+  box-shadow: none;
+}
 /*--------------
    Inverted
 ---------------*/
@ -656,74 +758,6 @@
  font-size: 1.5em;
  margin: 0em auto 0.3em;
 }
-/*--------------
-    Vertical
---------------*/
-.ui.vertical.menu .item {
-  display: block;
-  border-left: none;
-  border-right: none;
-}
-.ui.vertical.menu > .item:first-child {
-  border-radius: 0.325em 0.325em 0px 0px;
-}
-.ui.vertical.menu > .item:last-child {
-  border-radius: 0px 0px 0.325em 0.325em;
-}
-/*--- Border ---*/
-.ui.vertical.menu .item:before {
-  position: absolute;
-  content: '';
-  top: 0%;
-  left: 0px;
-  width: 100%;
-  height: 1px;
-  background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%);
-  background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%);
-  background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%);
-  background-image: -ms-linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%);
-  background-image: linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%);
-}
-.ui.vertical.menu .item:first-child:before {
-  background-image: none;
-}
-/*--- Dropdown ---*/
-.ui.vertical.menu .dropdown.item > i {
-  float: right;
-}
-.ui.vertical.menu .dropdown.item .menu {
-  width: auto;
-  top: 0%;
-  left: 100%;
-  margin: 0px 0px 0px 1px;
-  -moz-border-radius: 0px 5px 5px 0px;
-  -webkit-border-radius: 0px 5px 5px 0px;
-  border-radius: 0px 5px 5px 0px;
-  border-left: 0.2em solid rgba(50, 50, 50, 0.8);
-  border: 1px solid rgba(0, 0, 0, 0.1);
-  font-size: 1em;
-}
-.ui.vertical.menu .dropdown.item .menu .item {
-  font-size: 1em;
-}
-/*--- Sub Menu ---*/
-.ui.vertical.menu .item > .menu {
-  margin: 0.5em -1em 0em;
-}
-.ui.vertical.menu .item > .menu > .item > .icon {
-  margin-right: 0.7em;
-}
-.ui.vertical.menu .item > .menu > .item {
-  padding: 0.5rem 1.5rem;
-  font-size: 0.85em;
-}
-.ui.vertical.menu .item > .menu > .item:before {
-  display: none;
-}
-.ui.vertical.menu .item > .menu > .item > a {
-  margin: -0.5rem -1.5rem;
-  padding: 0.5rem 1.5rem;
-}
 /*--------------
     Fitted
 ---------------*/
--- a/build/uncompressed/collections/message.css
+++ b/build/uncompressed/collections/message.css
@ -174,24 +174,24 @@
 ---------------*/
 .ui.blue.message,
 .ui.info.message {
-  border-color: #75C9E9;
+  border-color: #E4F5FB;
  background-color: #E9F9FF;
-  color: #1D6582;
+  color: #4D8796;
 }
 /* Success Text Block */
 .ui.green.message,
 .ui.success.message,
 .ui.positive.message {
-  background-color: #EEFFE9;
+  background-color: #DEFCD5;
  color: #119000;
-  border-color: #2FCB05;
+  border-color: #4D965B;
 }
 /* Warning Text Block */
 .ui.yellow.message,
 .ui.warning.message {
  background-color: #F6F3D5;
  border-color: #CBB105;
-  color: #AF9801;
+  color: #96904D;
 }
 /* Error Text Block */
 .ui.red.message,
@ -199,7 +199,7 @@
 .ui.negative.message {
  background-color: #F1D7D7;
  color: #AD0000;
-  border-color: #B06C6C;
+  border-color: #964D4D;
 }
 /*--------------
     Sizes 
--- a/build/uncompressed/elements/segment.css
+++ b/build/uncompressed/elements/segment.css
@ -167,7 +167,7 @@
       Stacked
 --------------------*/
 .ui.stacked.segment {
-  padding-bottom: 1.2em;
+  padding-bottom: 1.7em;
 }
 .ui.stacked.segment:after,
 .ui.stacked.segment:before {
--- a/build/uncompressed/elements/step.css
+++ b/build/uncompressed/elements/step.css
@ -4,14 +4,14 @@
  -moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
-  -moz-border-radius: 0.3125em;
-  -webkit-border-radius: 0.3125em;
-  border-radius: 0.3125em;
+  -moz-border-radius: 0.3125rem;
+  -webkit-border-radius: 0.3125rem;
+  border-radius: 0.3125rem;
 }
 .ui.steps .step {
  display: inline-block;
  position: relative;
-  padding: 0.82em 1.5em 0.82em 2.5em;
+  padding: 0.82em 2em 0.82em 3em;
  background-color: #FFFFFF;
  color: #888888;
 }
@ -31,7 +31,7 @@
  transform: rotate(45deg);
 }
 .ui.steps .step:first-child {
-  padding-left: 20.3125em;
+  padding-left: 1.35em;
  -webkit-border-radius: 0.3125em 0em 0em 0.3125em;
  -moz-border-radius: 0.3125em 0em 0em 0.3125em;
  border-radius: 0.3125em 0em 0em 0.3125em;
--- a/build/uncompressed/views/comment.css
+++ b/build/uncompressed/views/comment.css
--- a/node/src/documents/collections/menu.html
+++ b/node/src/documents/collections/menu.html
@ -51,6 +51,7 @@ type   : 'UI Collection'
      </div>
    </div>
  </div>
+  

  <div class="example">
    <h4>Vertical Menu</h4>
@ -92,6 +93,42 @@ type   : 'UI Collection'
      </div>
    </div>
  </div>
+  
+  <div class="example">
+    <h4>Tiered Menu</h4>
+
+    <p>This example uses several menu elements to display the versatility of a menu collection.</p>
+    <div class="ui tiered menu">
+      <div class="menu">
+        <a class="active item">
+          <i class="icon users"></i>
+          Friends
+        </a>
+        <a class="item">
+          <i class="icon mail"></i> Messages
+          <div class="left ui label">22</div>
+        </a>
+        <div class="right menu">
+          <div class="fitted borderless item">
+              <input class="ui input" type="text" placeholder="Search...">
+          </div>
+          <div class="dropdown item">
+            <i class="icon layout list"></i>
+            <div class="menu">
+              <div class="item">Invite Friends</div>
+              <div class="item">Contact Us</div>
+              <div class="item">About</div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="ui secondary menu">
+        <div class="active item">Search</div>
+        <div class="item">Add</div>
+        <div class="item">Remove</div>
+      </div>
+    </div>
+  </div>

  <h2>Elements</h2>

@ -164,7 +201,7 @@ type   : 'UI Collection'
    </div>
    <div class="ui vertical menu">
      <div class="dropdown item">
-        Categories <i class="icon right-dir"></i>
+        Categories <i class="icon right triangle"></i>
        <div class="menu">
          <a class="item">Electronics</a>
          <a class="item">Automotive</a>
@ -634,7 +671,7 @@ type   : 'UI Collection'
        </div>
      </div>
      <div class="dropdown item">
-        Dropdown <i class="icon right-dir"></i>
+        Dropdown <i class="icon right triangle"></i>
        <div class="menu">
          <div class="item">Choice 1</div>
          <div class="item">Choice 2</div>
@ -722,7 +759,7 @@ type   : 'UI Collection'
        </div>
      </div>
      <div class="dropdown item">
-        Dropdown <i class="icon right-dir"></i>
+        Dropdown <i class="icon right triangle"></i>
        <div class="menu">
          <div class="item">Choice 1</div>
          <div class="item">Choice 2</div>
@ -747,7 +784,7 @@ type   : 'UI Collection'
        </div>
      </div>
      <div class="dropdown item">
-        Dropdown <i class="icon right-dir"></i>
+        Dropdown <i class="icon right triangle"></i>
        <div class="menu">
          <div class="item">Choice 1</div>
          <div class="item">Choice 2</div>
--- a/node/src/documents/index.html
+++ b/node/src/documents/index.html
@ -8,7 +8,7 @@ type   : 'Semantic'
 <div class="masthead segment">
  <div class="container">
    <h1><i class="icon globe"></i>Semantic UI</h1>
-    <h2><strike>HTML</strike> User interfaces are the DNA of the web.</h2>
+    <h2><strike>HTML</strike> UI is the DNA of the web.</h2>
    <p>Semantic empowers designers and developers by creating a shared vocabulary for user interfaces.</p>
    
    <div class="ui large black compact menu">
@ -38,9 +38,9 @@ type   : 'Semantic'
    <div class="column">
      <h1 class="ui icon header">
        <i class="icon terminal"></i> 
-        Tools for Developers
+        Pro Tools
      </h1>
-      <p>Semantic UI Modules all come with debugging and performance tools to help make sure they perform lightning fast.</p>
+      <p>UI Modules all come with debugging and performance tools to help make sure they perform lightning fast.</p>
    </div>
  </div>
 </div>
--- a/node/src/documents/views/comment.html
+++ b/node/src/documents/views/comment.html
@ -0,0 +1,36 @@
+---
+layout : 'default'
+css    : 'progress'
+
+title  : 'Comments'
+type   : 'UI View'
+---
+<div class="segment">
+  <div class="container">
+  <h1>Comments</h1>
+  <p>A comment view is used to display lists of user feedback to site content.</p>
+  </div>
+</div>
+<div class="main container">
+
+  <div class="peek">
+    <div class="ui vertical pointing menu">
+      <a class="active item">Standard</a>
+      <a class="item">Content</a>
+    </div>
+  </div>
+  <h2>Standard</h2>
+  
+  <div class="example">
+    <h4>Comments:</h4>
+    <p>All comment</p>
+    <div class="ui comments">
+      <div class="comment">
+            
+      </div>
+    </div>
+    
+  </div>
+
+  
+</div>
--- a/node/src/files/components/semantic/collections/grid.css
+++ b/node/src/files/components/semantic/collections/grid.css
@ -38,8 +38,8 @@
  display: inline-block;
  text-align: left;
  font-size: 1rem;
-  padding-left: 1.33%;
-  padding-right: 1.33%;
+  padding-left: 2%;
+  padding-right: 2%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
@ -259,6 +259,7 @@
 .ui.celled.grid > .column,
 .ui.celled.grid > .row > .column {
  display: table-cell;
+  padding: 2%;
  -webkit-box-shadow: -1px 0px 0px 0px #dfdfdf;
  -moz-box-shadow: -1px 0px 0px 0px #dfdfdf;
  box-shadow: -1px 0px 0px 0px #dfdfdf;
--- a/node/src/files/components/semantic/collections/menu.css
+++ b/node/src/files/components/semantic/collections/menu.css
@ -315,6 +315,9 @@
  border-left: 0.2em solid rgba(50, 50, 50, 0.8);
  padding-top: 0.75em;
  padding-left: 0.75em;
+  -webkit-border-radius: 0px 5px 5px 0px;
+  -moz-border-radius: 0px 5px 5px 0px;
+  border-radius: 0px 5px 5px 0px;
 }
 .ui.vertical.menu .active.item .menu .active.item {
  border-left: none;
@ -334,8 +337,107 @@
  background-color: transparent;
 }
 /*******************************
-            Variations
+          Variations
+*******************************/
+/*******************************
+            Types
 *******************************/
+/*--------------
+    Vertical
+---------------*/
+.ui.vertical.menu .item {
+  display: block;
+  border-left: none;
+  border-right: none;
+}
+.ui.vertical.menu > .item:first-child {
+  border-radius: 0.325em 0.325em 0px 0px;
+}
+.ui.vertical.menu > .item:last-child {
+  border-radius: 0px 0px 0.325em 0.325em;
+}
+/*--- Border ---*/
+.ui.vertical.menu .item:before {
+  position: absolute;
+  content: '';
+  top: 0%;
+  left: 0px;
+  width: 100%;
+  height: 1px;
+  background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%);
+  background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%);
+  background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%);
+  background-image: -ms-linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%);
+  background-image: linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%);
+}
+.ui.vertical.menu .item:first-child:before {
+  background-image: none;
+}
+/*--- Dropdown ---*/
+.ui.vertical.menu .dropdown.item > i {
+  float: right;
+}
+.ui.vertical.menu .dropdown.item .menu {
+  width: auto;
+  top: 0%;
+  left: 100%;
+  margin: 0px 0px 0px 1px;
+  -moz-border-radius: 0px 5px 5px 0px;
+  -webkit-border-radius: 0px 5px 5px 0px;
+  border-radius: 0px 5px 5px 0px;
+  border-left: 0.2em solid rgba(50, 50, 50, 0.8);
+  border: 1px solid rgba(0, 0, 0, 0.1);
+  font-size: 1em;
+}
+.ui.vertical.menu .dropdown.item .menu .item {
+  font-size: 1em;
+}
+/*--- Sub Menu ---*/
+.ui.vertical.menu .item > .menu {
+  margin: 0.5em -1em 0em;
+}
+.ui.vertical.menu .item > .menu > .item > .icon {
+  margin-right: 0.7em;
+}
+.ui.vertical.menu .item > .menu > .item {
+  padding: 0.5rem 1.5rem;
+  font-size: 0.85em;
+}
+.ui.vertical.menu .item > .menu > .item:before {
+  display: none;
+}
+.ui.vertical.menu .item > .menu > .item > a {
+  margin: -0.5rem -1.5rem;
+  padding: 0.5rem 1.5rem;
+}
+/*--------------
+     Tiered
+---------------*/
+.ui.tiered.menu .item.active {
+  box-shadow: 0 1px 0 0 #FBFBFB;
+}
+.ui.tiered.menu {
+  border-radius: 0px;
+}
+.ui.tiered.menu .secondary.menu {
+  background-color: rgba(0, 0, 0, 0.01);
+  border-radius: 0em;
+  border-top: 1px solid rgba(0, 0, 0, 0.1);
+  box-shadow: none;
+  color: #FFFFFF;
+}
+.ui.tiered.menu .secondary.menu .item {
+  font-size: 0.9rem;
+}
+.ui.tiered.menu .secondary.menu .item:after {
+  background-image: none;
+}
+.ui.tiered.menu .secondary.menu .active.item {
+  background-color: transparent;
+  border-radius: 0 0 0 0;
+  border-top: medium none;
+  box-shadow: none;
+}
 /*--------------
    Inverted
 ---------------*/
@ -656,74 +758,6 @@
  font-size: 1.5em;
  margin: 0em auto 0.3em;
 }
-/*--------------
-    Vertical
---------------*/
-.ui.vertical.menu .item {
-  display: block;
-  border-left: none;
-  border-right: none;
-}
-.ui.vertical.menu > .item:first-child {
-  border-radius: 0.325em 0.325em 0px 0px;
-}
-.ui.vertical.menu > .item:last-child {
-  border-radius: 0px 0px 0.325em 0.325em;
-}
-/*--- Border ---*/
-.ui.vertical.menu .item:before {
-  position: absolute;
-  content: '';
-  top: 0%;
-  left: 0px;
-  width: 100%;
-  height: 1px;
-  background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%);
-  background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%);
-  background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%);
-  background-image: -ms-linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%);
-  background-image: linear-gradient(left, rgba(0, 0, 0, 0.03) 0%, rgba(0, 0, 0, 0.1) 1.5em, rgba(0, 0, 0, 0.03) 100%);
-}
-.ui.vertical.menu .item:first-child:before {
-  background-image: none;
-}
-/*--- Dropdown ---*/
-.ui.vertical.menu .dropdown.item > i {
-  float: right;
-}
-.ui.vertical.menu .dropdown.item .menu {
-  width: auto;
-  top: 0%;
-  left: 100%;
-  margin: 0px 0px 0px 1px;
-  -moz-border-radius: 0px 5px 5px 0px;
-  -webkit-border-radius: 0px 5px 5px 0px;
-  border-radius: 0px 5px 5px 0px;
-  border-left: 0.2em solid rgba(50, 50, 50, 0.8);
-  border: 1px solid rgba(0, 0, 0, 0.1);
-  font-size: 1em;
-}
-.ui.vertical.menu .dropdown.item .menu .item {
-  font-size: 1em;
-}
-/*--- Sub Menu ---*/
-.ui.vertical.menu .item > .menu {
-  margin: 0.5em -1em 0em;
-}
-.ui.vertical.menu .item > .menu > .item > .icon {
-  margin-right: 0.7em;
-}
-.ui.vertical.menu .item > .menu > .item {
-  padding: 0.5rem 1.5rem;
-  font-size: 0.85em;
-}
-.ui.vertical.menu .item > .menu > .item:before {
-  display: none;
-}
-.ui.vertical.menu .item > .menu > .item > a {
-  margin: -0.5rem -1.5rem;
-  padding: 0.5rem 1.5rem;
-}
 /*--------------
     Fitted
 ---------------*/
--- a/node/src/files/components/semantic/collections/message.css
+++ b/node/src/files/components/semantic/collections/message.css
@ -174,24 +174,24 @@
 ---------------*/
 .ui.blue.message,
 .ui.info.message {
-  border-color: #75C9E9;
+  border-color: #E4F5FB;
  background-color: #E9F9FF;
-  color: #1D6582;
+  color: #4D8796;
 }
 /* Success Text Block */
 .ui.green.message,
 .ui.success.message,
 .ui.positive.message {
-  background-color: #EEFFE9;
+  background-color: #DEFCD5;
  color: #119000;
-  border-color: #2FCB05;
+  border-color: #4D965B;
 }
 /* Warning Text Block */
 .ui.yellow.message,
 .ui.warning.message {
  background-color: #F6F3D5;
  border-color: #CBB105;
-  color: #AF9801;
+  color: #96904D;
 }
 /* Error Text Block */
 .ui.red.message,
@ -199,7 +199,7 @@
 .ui.negative.message {
  background-color: #F1D7D7;
  color: #AD0000;
-  border-color: #B06C6C;
+  border-color: #964D4D;
 }
 /*--------------
     Sizes 
--- a/node/src/files/components/semantic/elements/segment.css
+++ b/node/src/files/components/semantic/elements/segment.css
@ -167,7 +167,7 @@
       Stacked
 --------------------*/
 .ui.stacked.segment {
-  padding-bottom: 1.2em;
+  padding-bottom: 1.7em;
 }
 .ui.stacked.segment:after,
 .ui.stacked.segment:before {
--- a/node/src/files/components/semantic/elements/step.css
+++ b/node/src/files/components/semantic/elements/step.css
@ -4,14 +4,14 @@
  -moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
-  -moz-border-radius: 0.3125em;
-  -webkit-border-radius: 0.3125em;
-  border-radius: 0.3125em;
+  -moz-border-radius: 0.3125rem;
+  -webkit-border-radius: 0.3125rem;
+  border-radius: 0.3125rem;
 }
 .ui.steps .step {
  display: inline-block;
  position: relative;
-  padding: 0.82em 1.5em 0.82em 2.5em;
+  padding: 0.82em 2em 0.82em 3em;
  background-color: #FFFFFF;
  color: #888888;
 }
@ -31,7 +31,7 @@
  transform: rotate(45deg);
 }
 .ui.steps .step:first-child {
-  padding-left: 20.3125em;
+  padding-left: 1.35em;
  -webkit-border-radius: 0.3125em 0em 0em 0.3125em;
  -moz-border-radius: 0.3125em 0em 0em 0.3125em;
  border-radius: 0.3125em 0em 0em 0.3125em;
--- a/node/src/files/components/semantic/views/comment.css
+++ b/node/src/files/components/semantic/views/comment.css
--- a/node/src/layouts/default.html.eco
+++ b/node/src/layouts/default.html.eco
@ -2,6 +2,7 @@

 <% uiElements        = @getCollection("documents").findAllLive({type: $in: ['UI Element']},[{title: 1}]).toJSON() %>
 <% uiCollections     = @getCollection("documents").findAllLive({type: $in: ['UI Collection']},[{title: 1}]).toJSON() %>
+<% uiViews           = @getCollection("documents").findAllLive({type: $in: ['UI View']},[{title: 1}]).toJSON() %>
 <% uiModules         = @getCollection("documents").findAllLive({type: $in: ['UI Module']},[{title: 1}]).toJSON() %>
 <% uiSpecification   = @getCollection("documents").findAllLive({type: $in: ['UI Specification']},[{title: 1}]).toJSON() %>
 <% currentCollection = @getCollection("documents").findAllLive({type: $in: [@document.type]},[{title: 1}]).toJSON() %>
@ -39,6 +40,8 @@
  <link rel="stylesheet" type="text/css" class="ui" href="/components/semantic/collections/form.css">
  <link rel="stylesheet" type="text/css" class="ui" href="/components/semantic/collections/menu.css">
    
+  <link rel="stylesheet" type="text/css" class="ui" href="/components/semantic/collections/comment.css">
+    
  <link rel="stylesheet" type="text/css" class="ui" href="/components/semantic/modules/shape.css">
  <link rel="stylesheet" type="text/css" class="ui" href="/components/semantic/modules/popup.css">
  <link rel="stylesheet" type="text/css" class="ui" href="/components/semantic/modules/checkbox.css">
@ -92,6 +95,14 @@
        <% end %>
      </div>
    </div>
+    <div class="item">
+      <a href="/view.html"><b>UI Views</b></a>
+      <div class="menu">
+        <% for element in uiViews: %>
+          <a class="<%= if element.id is @document.id then 'active ' %>item" href="<%= element.url %>"><%= element.title %></a>
+        <% end %>
+      </div>
+    </div>
    <div class="item">
      <a href="/specification.html"><b>Specification</b></a>
      <div class="menu">
--- a/src/collections/grid.less
+++ b/src/collections/grid.less
@ -46,8 +46,8 @@
  text-align: left;
  font-size: 1rem;

-  padding-left: 1.33%;
-  padding-right: 1.33%;
+  padding-left: 2%;
+  padding-right: 2%;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
@ -341,6 +341,7 @@
 .ui.celled.grid > .column,
 .ui.celled.grid > .row > .column {
  display: table-cell;
+  padding: 2%;
  -webkit-box-shadow: -1px 0px 0px 0px #DFDFDF;
  -moz-box-shadow: -1px 0px 0px 0px #DFDFDF;
  box-shadow: -1px 0px 0px 0px #DFDFDF;
--- a/src/collections/menu.less
+++ b/src/collections/menu.less
@ -416,6 +416,10 @@
  border-left: 0.2em solid rgba(50, 50, 50, 0.8);
  padding-top: 0.75em;
  padding-left: 0.75em;
+
+  -webkit-border-radius: 0px 5px 5px 0px;
+  -moz-border-radius: 0px 5px 5px 0px;
+  border-radius: 0px 5px 5px 0px;
 }
 .ui.vertical.menu .active.item .menu .active.item {
  border-left: none;
@ -438,11 +442,144 @@
 }


+/*******************************
+          Variations
+*******************************/
+

 /*******************************
-            Variations
+            Types
 *******************************/

+/*--------------
+    Vertical
+---------------*/
+
+.ui.vertical.menu .item {
+  display: block;
+  border-left: none;
+  border-right: none;
+}
+.ui.vertical.menu > .item:first-child {
+  border-radius: 0.325em 0.325em 0px 0px;
+}
+.ui.vertical.menu > .item:last-child {
+  border-radius: 0px 0px 0.325em 0.325em;
+}
+
+/*--- Border ---*/
+.ui.vertical.menu .item:before {
+  position: absolute;
+  content: '';
+  top: 0%;
+  left: 0px;
+  width: 100%;
+  height: 1px;
+  background-image: -webkit-linear-gradient(left,
+    rgba(0, 0, 0, 0.03) 0%,
+    rgba(0, 0, 0, 0.1) 1.5em,
+    rgba(0, 0, 0, 0.03) 100%)
+  ;
+  background-image: -moz-linear-gradient(left,
+    rgba(0, 0, 0, 0.03) 0%,
+    rgba(0, 0, 0, 0.1) 1.5em,
+    rgba(0, 0, 0, 0.03) 100%)
+  ;
+  background-image: -o-linear-gradient(left,
+    rgba(0, 0, 0, 0.03) 0%,
+    rgba(0, 0, 0, 0.1) 1.5em,
+    rgba(0, 0, 0, 0.03) 100%)
+  ;
+  background-image: -ms-linear-gradient(left,
+    rgba(0, 0, 0, 0.03) 0%,
+    rgba(0, 0, 0, 0.1) 1.5em,
+    rgba(0, 0, 0, 0.03) 100%)
+  ;
+  background-image: linear-gradient(left,
+    rgba(0, 0, 0, 0.03) 0%,
+    rgba(0, 0, 0, 0.1) 1.5em,
+    rgba(0, 0, 0, 0.03) 100%)
+  ;
+}
+
+.ui.vertical.menu .item:first-child:before {
+  background-image: none;
+}
+
+/*--- Dropdown ---*/
+.ui.vertical.menu .dropdown.item > i {
+  float: right;
+}
+.ui.vertical.menu .dropdown.item .menu {
+  width: auto;
+  top: 0%;
+  left: 100%;
+  margin: 0px 0px 0px 1px;
+
+
+  -moz-border-radius: 0px 5px 5px 0px;
+  -webkit-border-radius: 0px 5px 5px 0px;
+  border-radius: 0px 5px 5px 0px;
+
+  border-left: 0.2em solid rgba(50, 50, 50, 0.8);
+  border: 1px solid rgba(0, 0, 0, 0.1);
+
+  font-size: 1em;
+}
+.ui.vertical.menu .dropdown.item .menu .item {
+  font-size: 1em;
+}
+
+/*--- Sub Menu ---*/
+.ui.vertical.menu .item > .menu {
+  margin: 0.5em -1em 0em;
+}
+.ui.vertical.menu .item > .menu > .item > .icon {
+  margin-right: 0.7em;
+}
+.ui.vertical.menu .item > .menu > .item {
+  padding: 0.5rem 1.5rem;
+  font-size: 0.85em;
+}
+.ui.vertical.menu .item > .menu > .item:before {
+  display: none;
+}
+.ui.vertical.menu .item > .menu > .item > a {
+  margin: -0.5rem -1.5rem;
+  padding: 0.5rem 1.5rem;
+}
+
+
+/*--------------
+     Tiered
+---------------*/
+
+.ui.tiered.menu .item.active {
+  box-shadow: 0 1px 0 0 #FBFBFB;
+}
+
+.ui.tiered.menu {
+  border-radius: 0px;
+}
+.ui.tiered.menu .secondary.menu {
+  background-color: rgba(0, 0, 0, 0.01);
+  border-radius: 0em;
+  border-top: 1px solid rgba(0, 0, 0, 0.1);
+  box-shadow: none;
+  color: #FFFFFF;
+}
+.ui.tiered.menu .secondary.menu .item {
+  font-size: 0.9rem;
+}
+.ui.tiered.menu .secondary.menu .item:after {
+  background-image: none;
+}
+.ui.tiered.menu .secondary.menu .active.item {
+  background-color: transparent;
+  border-radius: 0 0 0 0;
+  border-top: medium none;
+  box-shadow: none;
+}

 /*--------------
    Inverted
@ -857,104 +994,6 @@
  margin: 0em auto 0.3em;
 }

-/*--------------
-    Vertical
---------------*/
-
-.ui.vertical.menu .item {
-  display: block;
-  border-left: none;
-  border-right: none;
-}
-.ui.vertical.menu > .item:first-child {
-  border-radius: 0.325em 0.325em 0px 0px;
-}
-.ui.vertical.menu > .item:last-child {
-  border-radius: 0px 0px 0.325em 0.325em;
-}
-
-/*--- Border ---*/
-.ui.vertical.menu .item:before {
-  position: absolute;
-  content: '';
-  top: 0%;
-  left: 0px;
-  width: 100%;
-  height: 1px;
-  background-image: -webkit-linear-gradient(left,
-    rgba(0, 0, 0, 0.03) 0%,
-    rgba(0, 0, 0, 0.1) 1.5em,
-    rgba(0, 0, 0, 0.03) 100%)
-  ;
-  background-image: -moz-linear-gradient(left,
-    rgba(0, 0, 0, 0.03) 0%,
-    rgba(0, 0, 0, 0.1) 1.5em,
-    rgba(0, 0, 0, 0.03) 100%)
-  ;
-  background-image: -o-linear-gradient(left,
-    rgba(0, 0, 0, 0.03) 0%,
-    rgba(0, 0, 0, 0.1) 1.5em,
-    rgba(0, 0, 0, 0.03) 100%)
-  ;
-  background-image: -ms-linear-gradient(left,
-    rgba(0, 0, 0, 0.03) 0%,
-    rgba(0, 0, 0, 0.1) 1.5em,
-    rgba(0, 0, 0, 0.03) 100%)
-  ;
-  background-image: linear-gradient(left,
-    rgba(0, 0, 0, 0.03) 0%,
-    rgba(0, 0, 0, 0.1) 1.5em,
-    rgba(0, 0, 0, 0.03) 100%)
-  ;
-}
-
-.ui.vertical.menu .item:first-child:before {
-  background-image: none;
-}
-
-/*--- Dropdown ---*/
-.ui.vertical.menu .dropdown.item > i {
-  float: right;
-}
-.ui.vertical.menu .dropdown.item .menu {
-  width: auto;
-  top: 0%;
-  left: 100%;
-  margin: 0px 0px 0px 1px;
-
-
-  -moz-border-radius: 0px 5px 5px 0px;
-  -webkit-border-radius: 0px 5px 5px 0px;
-  border-radius: 0px 5px 5px 0px;
-
-  border-left: 0.2em solid rgba(50, 50, 50, 0.8);
-  border: 1px solid rgba(0, 0, 0, 0.1);
-
-  font-size: 1em;
-}
-.ui.vertical.menu .dropdown.item .menu .item {
-  font-size: 1em;
-}
-
-
-/*--- Sub Menu ---*/
-.ui.vertical.menu .item > .menu {
-  margin: 0.5em -1em 0em;
-}
-.ui.vertical.menu .item > .menu > .item > .icon {
-  margin-right: 0.7em;
-}
-.ui.vertical.menu .item > .menu > .item {
-  padding: 0.5rem 1.5rem;
-  font-size: 0.85em;
-}
-.ui.vertical.menu .item > .menu > .item:before {
-  display: none;
-}
-.ui.vertical.menu .item > .menu > .item > a {
-  margin: -0.5rem -1.5rem;
-  padding: 0.5rem 1.5rem;
-}

 /*--------------
     Fitted
--- a/src/collections/message.less
+++ b/src/collections/message.less
@ -224,18 +224,18 @@
 ---------------*/
 .ui.blue.message,
 .ui.info.message {
-  border-color: #75C9E9;
+  border-color: #E4F5FB;
  background-color: #E9F9FF;
-  color: #1D6582;
+  color: #4D8796;
 }

 /* Success Text Block */
 .ui.green.message,
 .ui.success.message,
 .ui.positive.message {
-  background-color: #EEFFE9;
+  background-color: #DEFCD5;
  color: #119000;
-  border-color: #2FCB05;
+  border-color: #4D965B;
 }

 /* Warning Text Block */
@ -243,7 +243,7 @@
 .ui.warning.message {
  background-color: #F6F3D5;
  border-color: #CBB105;
-  color: #AF9801;
+  color: #96904D;
 }
 /* Error Text Block */
 .ui.red.message,
@ -252,7 +252,7 @@
  background-color: #F1D7D7;

  color: #AD0000;
-  border-color: #B06C6C;
+  border-color: #964D4D;
 }


--- a/src/elements/segment.less
+++ b/src/elements/segment.less
@ -223,7 +223,7 @@
 --------------------*/

 .ui.stacked.segment {
-  padding-bottom: 1.2em;
+  padding-bottom: 1.7em;
 }
 .ui.stacked.segment:after,
 .ui.stacked.segment:before {
--- a/src/elements/step.less
+++ b/src/elements/step.less
@ -6,15 +6,15 @@
  -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);

-  -moz-border-radius: 0.3125em;
-  -webkit-border-radius: 0.3125em;
-  border-radius: 0.3125em;
+  -moz-border-radius: 0.3125rem;
+  -webkit-border-radius: 0.3125rem;
+  border-radius: 0.3125rem;
 }

 .ui.steps .step {
  display: inline-block;
  position: relative;
-  padding: 0.82em 1.5em 0.82em 2.5em;
+  padding: 0.82em 2em 0.82em 3em;

  background-color: #FFFFFF;

@ -41,7 +41,7 @@
 }

 .ui.steps .step:first-child {
-  padding-left: 20.3125em;
+  padding-left: 1.35em;
  -webkit-border-radius: 0.3125em 0em 0em 0.3125em;
  -moz-border-radius: 0.3125em 0em 0em 0.3125em;
  border-radius: 0.3125em 0em 0em 0.3125em;
--- a/src/views/comment.less
+++ b/src/views/comment.less