/********************************************************************
 * File created by Joshua Smith on July 26, 2013.
 *
 * This file styles all brandable areas in the Wexy UI framework
 * as defined in the WEX UI Standards for Web Applications. This 
 * file defaults the colors to the WEX brand, and may be modified
 * for partner brands. If a different brand is used, these styles 
 * should be placed in a new "companyname-brand.css" file and checked
 * in for future web development under this brand.
 ********************************************************************/
/*
 * A partial implementation of the Ruby list functions from Compass:
 * https://github.com/Compass/compass/blob/stable/lib/compass/sass_extensions/functions/lists.rb
 */
/*
 * A partial implementation of the Ruby constants functions from Compass:
 * https://github.com/Compass/compass/blob/stable/lib/compass/sass_extensions/functions/constants.rb
 */
/*
 * A partial implementation of the Ruby display functions from Compass:
 * https://github.com/Compass/compass/blob/stable/core/lib/compass/core/sass_extensions/functions/display.rb
 */
/**-----------------------------------------------------------------
 Colors
-----------------------------------------------------------------**/
/**-----------------------------------------------------------------
 Global Branding
------------------------------------------------------------------**/
.global-font {
  font-family: "Open Sans", Arial, sans-serif;
  color: #333;
  font-size: 13px; }

/**font for h* elements**/
h1, h2, h3, h4, h5, h6 {
  font-family: "Open Sans", Arial, sans-serif;
  font-weight: bold; }

/** default link colors **/
a {
  color: #007cbb; }

a:hover {
  color: #202124; }

a:visited, a.btn.btn-link:visited {
  color: #007cbb; }

/**----------------------------------------------------------------
 Mega-Menu Branding
 ---------------------------------------------------------------**/
/* Color of the branded strip on active tabs and active dropdown menu
  items. Also includes font colors.*/
.mega-menu.navbar-nav > li.active > a:hover,
.mega-menu.navbar-nav > li > a:hover,
.mega-menu.navbar-nav > li.open > a {
  border-top-color: #E51937;
  color: #666; }

/* Font color for inactive hyperlinks */
.mega-menu.navbar-nav > li > a,
.mega-menu.navbar-nav > .active > a {
  color: #fff; }
  @media (min-width: 768px) {
    .mega-menu.navbar-nav > li > a,
    .mega-menu.navbar-nav > .active > a {
      color: #333; } }

/**-----------------------------------------------------------------
 Navigation branding
-----------------------------------------------------------------**/
/* Color of Status Bar at the top of the page */
.navbar-inverse {
  background-color: #333;
  border-color: #333; }

/* Font color for inactive dropdown link */
.dropdown-menu li > a {
  color: #333;
  font-size: 13px; }

/* Font color for active dropdown link */
.dropdown-menu li > a:hover,
.dropdown-menu li > a:focus,
.dropdown-menu .active > a,
.dropdown-menu .active > a:hover,
.dropdown-menu > .active > a:focus,
#status-bar.navbar-inverse .dropdown-menu a:hover {
  background-color: #E51937;
  color: #fff; }

/* Background and font color of active pills */
.nav-pills > li.active > a,
.nav-pills > li.active > a:hover,
.nav-pills > li.active > a:focus,
.navbar-nav > li.active > a,
.navbar-nav > li.active > a:hover,
.navbar-nav > li.active > a:focus {
  background-color: #E51937;
  color: #fff; }

@media (min-width: 768px) {
  .mega-menu.navbar-nav {
    border-bottom: 1px solid #333; } }

/**-----------------------------------------------------------------------------
Branded background gradient
-----------------------------------------------------------------------------**/
.branded-gradient {
  background: #fff;
  background-image: -owg(linear-gradient(#ccc, #fff));
  background-image: -webkit(linear-gradient(#ccc, #fff));
  background-image: -moz(linear-gradient(#ccc, #fff));
  background-image: -o(linear-gradient(#ccc, #fff));
  background-image: linear-gradient(#ccc, #fff); }

/**-----------------------------------------------------------------------
 Footer Branding
 ----------------------------------------------------------------------**/
#footer {
  color: #666;
  font-size: 11px; }

/**----------------------------------------------------------------------
Button and Link branding
----------------------------------------------------------------------**/
/* Font color for primary action button */
.btn-primary,
a.btn-primary:visited {
  background-color: #007cbb;
  border-color: #00689d;
  color: #fff; }

.btn-primary:hover, .btn-primary:focus,
.btn-primary:active, .btn-primary.active,
a.btn-primary:visited:hover {
  background-color: #00689d;
  border-color: #00689d;
  color: #fff; }

.btn-primary[disabled],
a.btn-primary[disabled]:visited {
  color: #a7a9ab;
  background-color: #f2f2f3;
  border-color: #f2f2f3; }

/* Branded "inverse" button for special cases */
.btn-inverse,
.a.btn-inverse:visited {
  background-color: #E51937;
  border-color: #CB1631;
  color: #fff; }

.btn-inverse:hover, .btn-inverse:focus,
.btn-inverse:active, .btn-inverse.active {
  background-color: #CB1631;
  border-color: #CB1631;
  color: #fff; }

/* Secondary form action button */
.btn-secondary, a.btn-secondary:visited {
  background-color: #4c4c4e;
  border-color: #000000;
  color: #fff; }

.btn-secondary:hover, .btn-secondary:focus,
.btn-secondary:active, .btn-secondary.active
a.btn-secondary:visited:hover {
  background-color: #000000;
  border-color: #000000;
  color: #fff; }

/*disabled buttons*/
.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary, .btn-primary.disabled:hover,
.btn-primary[disabled]:hover, fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus, .btn-primary[disabled]:focus, fieldset[disabled]
.btn-primary:focus, .btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active {
  color: #a7a9ab;
  background-color: #f2f2f3;
  border-color: #ccc;
  opacity: 1.0;
  cursor: inherit; }

/*open state of primary dropdown*/
.open .dropdown-toggle.btn-primary {
  background-color: #00689d;
  border-color: #00689d;
  color: #fff; }

/**--------------------------------------------------------------------------------------
Labels
--------------------------------------------------------------------------------------**/
.label-branded {
  background-color: #E51937;
  color: #fff; }

/**--------------------------------------------------------------------------------------
Badges
--------------------------------------------------------------------------------------**/
/*backround and text color of a badge in an active list item or pill*/
a.list-group-item.active > .badge,
.nav-pills > .active > a > .badge {
  color: #333;
  background-color: #ffffff; }

/**--------------------------------------------------------------------------------------
Brandable progress bar
--------------------------------------------------------------------------------------**/
.progressbar-branded {
  background-color: #E51937; }

/**------------------------------------------------------------------------------------
List Groups
------------------------------------------------------------------------------------**/
/*color of active list group item*/
.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
  background-color: #E51937;
  color: #fff;
  border-color: #E51937; }

/**---------------------------------------------------------------------------------
Date Picker - requires Jquery UI Datepicker
---------------------------------------------------------------------------------**/
.ui-datepicker .ui-state-active,
.ui-datepicker .ui-state-default.ui-state-active {
  background-color: #E51937;
  color: #fff;
  border: 2px solid #000; }

.ui-datepicker .ui-state-default:hover {
  background-color: #ffafaf;
  color: #333; }