/**
 * tophat.css
 * 
 * The tophat navigation menu is at the very top of each page and invites the user to select other website environments, e.g. Cloud Services, Licensing, etc.
 * 
 * Index
 * 
 * - Tophat navigation styling
 * - Tophat Home icon styling
 * 
 */

/*-----------------------------------------------------------------------
# Tophat navigation styling
------------------------------------------------------------------------*/

.tophat-nav { 
  background: #EEEEEE; 
  max-height: 40px; }

.tophat-nav li {
  max-height: 40px;
  float: left;
}

/* Sets correct distance between each list element, except the last one so it aligns with the right of the screen */
.tophat-nav ul:not(.nav-right) li:not(:last-child) a { padding: 0 20px; } 

.tophat-nav ul:not(.nav-right) li:first-child a { padding: 0 16px 0 0; }

.tophat-nav a {
  font: 0.75em "HelveticaNeue-Medium", "Helvetica Neue Medium", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}

/* Default state of tophat nav links */
.tophat-nav a:link,
.tophat-nav a:visited {
  color: #999999;
  text-transform: uppercase;
  line-height: 40px; 
}

/* Hover state of tophat nav links */
.tophat-nav a:hover,
.tophat-nav a:active { color: #808080; }

/* Active state of tophat nav links: Shows which environment is currently selected, in this instance "Ingram Micro USA" */
.tophat-nav .active a {
  background: #2375BB;
  color: #fff;
}

.country-icon { margin: 0 4px 0 8px; }

/*-----------------------------------------------------------------------
# Tophat Home icon styling
------------------------------------------------------------------------*/

.tophat-nav .home-icon {
  background: url(../../../../img/nav/tophat/home.png) left center no-repeat;
  height: 40px;
  width: 40px;
}

.tophat-nav .home-icon:hover, .tophat-nav .home-icon:active { background: url(../../../../img/nav/tophat/home-hover.png) left center no-repeat; }