#comparison_matrix {
  margin-right: 50px;
}


table.comparison-matrix {
  border-collapse: collapse;
  padding:0;
  margin:0;
  position: relative;
  background-color: #FFF;
}

table.comparison-matrix th {
  vertical-align:bottom;
  text-align:center;
}

table.comparison-matrix th a {
  position: relative;
  display:block;
  margin-left:auto;
  margin-right:auto;
  width: 1px;
}
table.comparison-matrix th a:hover {
  background-color: white;
}

table.comparison-matrix th a img {
  position: absolute;
  bottom: 0px;
  left: -12px;
  z-index: 1000;
}

table.comparison-matrix td {
  border: 1px solid #888;
}

table.comparison-matrix td.attribute-name,
table.comparison-matrix td.category {
  padding:8px;
}

table.comparison-matrix td ul {
  padding:0;
  margin:0;
  list-style-type:none;
}

table.comparison-matrix td .reorder li {
  padding: 0 0 2px 28px;
  background: url(/images/drag.gif) no-repeat top left;
  background-position: 0 1px;
  cursor: move;
}

table.comparison-matrix tr.category {
  background-color: #E7E7E7;
}

table.comparison-matrix tr.category span.editable {
  font-weight:bold;
}

table.comparison-matrix td span.action-links {
  padding-left:4px;
  visibility: hidden;
}

table.comparison-matrix td span.action-links.always-show {
  visibility: visible;
}

table.comparison-matrix td.hover span.action-links {
  visibility: visible;
}

table.comparison-matrix td.category span.editable.hover {
  background-color: #CCC;
}

table.comparison-matrix td.attribute-name span.editable.hover {
  background-color: #DEDEDE;
}

table.comparison-matrix td.attribute-value {
  text-align:center;
  vertical-align:top;
}
table.comparison-matrix td.attribute-value.odd {
  background-color: #F8F8F8;
}
table.comparison-matrix td.attribute-value.hover {
  background-color: #EAEAEA;
}

table.comparison-matrix td.attribute-value.saving {
  /*background-color: #E6FBE3;*/
}

table.comparison-matrix td.attribute-value span.value {
  display: block;
  margin-top: -4px;
  position: relative;
  padding: 0 4px 0 4px;
  font-size: 11px;
}

span.score-wrapper {
  padding:4px 4px 4px 4px; 
  display:block;
  text-align:center;
}

span.score-unset {
  color: #C5C5C5;
  display:block;
  width: 23px;
  height:20px;
  padding-top: 3px;
  text-align: center;
  vertical-align: middle;
  margin: 0 auto;
}

span.score-0,
span.score-1,
span.score-2,
span.score-3,
span.score-4,
span.score-5 {
  display: block;
  margin: 0 auto;
  width: 23px;
  height: 23px;
  background: url(/images/harvey_balls.gif) no-repeat top left;
}

div.edit-cell-form input.text {
  width: 165px;
  margin-top:10px;
}

div.score-selector {
  float: left;
  margin: 5px 6px 0 0px;
  padding:4px;
  border: 1px solid #DEDEDE;
  width: 23px;
  height: 23px;
}

div.score-selector.hover {
  border: 1px solid #000;
}

span.score-1 {
  background-position: -27px 0px;
}
span.score-2 {
  background-position: -54px 0px;
}
span.score-3 {
  background-position: -81px 0px;
}
span.score-4 {
  background-position: -108px 0px;
}
span.score-5 {
  background-position: -135px 0px;
}

/* reordering */

table.comparison-matrix div.reorder-offerings {
}

table.comparison-matrix div.reorder-offerings div.offering {
  padding-top: 12px;
  background: url(/images/drag.gif) no-repeat top left;
  background-position: 50% 4px;
  cursor: move;
  float: left;
  border: 1px dotted #CDCDCD;
  margin-left:2px;
}

/* if using ul for offerings

table.comparison-matrix ul.reorder-offerings {
  padding:0;
  margin: 0;
  list-style-type: none;
}

table.comparison-matrix ul.reorder-offerings li {
  float:left;
  display: block;
  border: 1px dotted gray;
}*/

table.comparison-matrix td.reorder-categories-attributes {
  padding: 0;
}

table.comparison-matrix ul.reorder-attributes {
  padding-bottom: 32px;
  border-bottom: 1px solid #888;
  background-color: #FFF;
}

table.comparison-matrix ul.reorder-category li.category{
  padding: 0;
  background-image: none;
  background-color: #E7E7E7;
}

table.comparison-matrix ul.reorder-category li.category span {
  display:block;
  padding: 8px 8px 8px 38px;
  background: url(/images/drag.gif) no-repeat top left;
  background-position: 8px 10px;
  border-bottom: 1px solid #888;
}

table.comparison-matrix ul.reorder-attributes li.attribute {
  padding: 8px 8px 8px 40px;
  background: #FFF url(/images/drag.gif) no-repeat top left;
  background-position: 10px 10px;
  border-bottom: 1px solid #888;
}

table.comparison-matrix td.dummy-cell {
  text-align:center;
}

table.comparison-matrix div.inline-form button {
  margin-right: 4px;
}

table.comparison-matrix a.delete-link {
  padding-left: 20px;
}