/* ===================
  Index:
    1. Colors
    2. Backgrounds
    3. Borders
 ===================*/

/*------------------- Colors -------------------*/
.highlight  {
  color: #000;    /* Black */
}
body, input, select, textarea, .optionsRibbon ul li a, footer a.language, .facebox-content, form,
.homeLinks li:nth-child(2n) > a:hover p, .bjqs-caption a, .bjqs-caption a:hover, .homeLinks li h2, .clientsHome li h2, a.tourBtn, a.tourBtn:hover, #socialBlocks a,
header .customLogo a:not(:hover), body.portal #leftColumn h2, body.loginPage h1 span, .materialStyle h2, body.portal #contentBody .rightColumn h2, body.portal #centreColumn .rightColumn h2, .contentBlock .sideText, header.transparentNav nav.mainNav ol > li > a, table.plansComparisonHeader th h3, .newSite nav.footerNav div ol a
{
  color: #222; /* Dark gray */
}
input.placeholder, textarea.placeholder {
  color: #989898; /* Mid gray */
}
#contentHeader h1, h2, input[type="submit"], input[type="button"], button, button.button-spinner:not(.inverted) span, nav.footerNav div ol a, nav.footerNav div h2 a,
#socialBlocks li a:hover, .homeLinks li > a p, .bjqs-caption p
{
  color: #fff;    /* White */
}

/*------------------- Backgrounds -------------------*/
.portal #wrapper, footer, #socialBlocks li a:hover, header .mobileBar, .navButtons a.button.mid {
  background: #5e5f5f;  /* Dark gray */
}
.homeLinks li:nth-child(2n) > a {
  background: #5e5f5f;  /* Dark gray - separate nth-child to prevent occasional delay in IE8 */
}
.newSite #socialBlocks li a:not(:hover)
{
  background: #e8e8e8;  /* Mid gray */
}
a.contentBlock:hover, .grey_background #contentWrap {
  background: #f5f5f5;  /* Light gray */
}
#contentWrap, .newSite footer,
#socialBlocks li a, .homeLinks li > a:hover, .tourBtn, .bjqs-caption a:hover
{
  background: #fff;     /* White */
}
input[type="submit"]:hover, input[type="button"]:hover, button:hover, nav.footerNav div ol a:hover, nav.footerNav div h2 a:hover, nav.footerNav div.footerBase a:hover,
.tourBtn:hover, .optionsRibbon ul.inverted li a:hover, .colorBtn:hover
{
  opacity: .7
}

/*------------------- Borders -------------------*/
.dropDownHolder .dropDown, a.contentBlock, .infographics #contentBody > img, #wrapper.contact div.contentBlock {
  border: 1px solid #c8c8c8;     /* Dark gray */
}
table.mobilePlansLegend td, table.plansComparisonHeader td, table.plansComparisonBody td {
  border: 1px solid #efefef;     /* Lighter mid gray */
}