CSS Property Order - Concentric

/**
 * @source brandon-rhodes/Concentric-CSS
 */

/* This ordering of CSS elements is for the traditional setting
   "box-sizing: content-box", which applies the "width:" and "height:"
   only to the innermost content of the box.  If you are using one of
   the other box model settings - Paul Irish recommends "box-model:
   border-box", for example - then simply move the "width:" and
   "height:" up above the "border:" property in the list below. */

#Concentric-CSS-Overview {
  display: ;    /* Directions about where and how the box is placed */
  position: ;
  float: ;
  clear: ;

  visibility: ; /* Next: can the box be seen? */
  opacity: ;
  z-index: ;

  margin: ;     /* Layers of the box model, from outside to inside */
  outline: ;
  border: ;
  background: ; /* (padding and content BOTH get the background color) */
  padding: ;

  width: ;      /* Content dimensions and scrollbars */
  height: ;
  overflow: ;

  color: ;      /* Textual content */
  text: ;
  font: ;
}

#Concentric-CSS-Complete {
  /* All CSS properties, in roughly the order I use when being careful */

  display: ;
  position: ;
  top: ;
  right: ;
  bottom: ;
  left: ;

  float: ;
  clear: ;

  visibility: ;
  opacity: ;
  z-index: ;

  margin: ;
  margin-top: ;
  margin-right: ;
  margin-bottom: ;
  margin-left: ;

  outline: ;

  border: ;
  border-top: ;
  border-right: ;
  border-bottom: ;
  border-left: ;

  border-width: ;
  border-top-width: ;
  border-right-width: ;
  border-bottom-width: ;
  border-left-width: ;

  border-style: ;
  border-top-style: ;
  border-right-style: ;
  border-bottom-style: ;
  border-left-style: ;

  border-color: ;
  border-top-color: ;
  border-right-color: ;
  border-bottom-color: ;
  border-left-color: ;

  background: ;
  background-color: ;
  background-image: ;
  background-repeat: ;
  background-position: ;
  cursor: ;

  padding: ;
  padding-top: ;
  padding-right: ;
  padding-bottom: ;
  padding-left: ;

  width: ;
  min-width: ;
  max-width: ;

  height: ;
  min-height: ;
  max-height: ;

  overflow: ;

  list-style: ;
  caption-side: ;

  table-layout: ;
  border-collapse: ;
  border-spacing: ;
  empty-cells: ;

  vertical-align: ;

  text-align: ;
  text-indent: ;
  text-transform: ;
  text-decoration: ;

  line-height: ;
  word-spacing: ;
  letter-spacing: ;
  white-space: ;
  color: ;

  font: ;
  font-family: ;
  font-size: ;
  font-weight: ;

  content: ;
  quotes: ;
}