/*
We don't want to reproduce every style that we use in the site. We just want to give the
user some options without ceding control.
*/
.red_text { color: red; }
table.quadrant {
  border-collapse: collapse;
}
table.quadrant td {
  margin: 0px;
  width: 211px;
  font: normal 12px/14px Arial,sans-serif;
  vertical-align: top;
}
table.quadrant tr.top td.left {
  background: url(/images/pro_services_shaded.jpg) bottom right no-repeat;
  border-right: 10px solid #f2f2f2;
  border-bottom: 10px solid #f2f2f2;
}
table.quadrant tr.top td.right {
  background: url(/images/managed_services_shaded.jpg) bottom left no-repeat;
  border-left: 10px solid #f2f2f2;
  border-bottom: 10px solid #f2f2f2;
}
table.quadrant tr.bottom td {
  padding-top: 10px;
}
table.quadrant tr.bottom td.left {
  background: url(/images/procurement_shaded.jpg) top right no-repeat;
  border-right: 10px solid #f2f2f2;
  border-top: 10px solid #f2f2f2;
}
table.quadrant tr.bottom td.right {
  background: url(/images/it_staffing_shaded.jpg) top left no-repeat;
  border-left: 10px solid #f2f2f2;
  border-top: 10px solid #f2f2f2;
}
table.quadrant td.right {
  text-align: right;
}
table.quadrant td.right p {
  margin: 0px;
  padding: 0px 0px 0px 20px;
}
table.quadrant td.right span.floater {
  float:left;
  width: 114px;
  height: 56px;
  position: relative;
}
table.quadrant td.left p {
  margin: 0px;
  padding: 0px 20px 0px 0px;
}
table.quadrant td.left span.floater {
  float:right;
  width: 114px;
  height: 49px;
  position: relative;
}
a.quadrantheader {
  display: block;
  font-size: 12px;
}