


ul.primary,
ul.secondary {
  border-bottom: 1px solid #bbb;
  list-style: none;
  margin: 1em 0 1.5em;
  padding: 0 2px;
  white-space: nowrap; }
  
  ul.primary:after,
  ul.secondary:after {
    content: '';
    display: table;
    clear: both; }
  
  ul.primary li,
  ul.secondary li {
    float: left;
    
    margin: 0.5em 3px 0; }
  
  ul.primary a,
  ul.secondary a {
    border: 1px solid #e9e9e9;
    border-right: 0;
    border-bottom: 0;
    display: block;
    line-height: 1.5em;
    text-decoration: none; }



ul.primary {
  position: absolute;
  right: 0;
  z-index: 10; }
  
  ul.primary li {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    text-shadow: 1px 1px 0px #fff;
    border: 1px solid #bbb;
    border-bottom: 0;
    margin: 0.5em 0 0 3px;
     }
  
  ul.primary li.active {
    border-bottom: 1px solid #fff;
    margin-bottom: -1px;
     }
  
  ul.primary a:link,
  ul.primary a:visited {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    -webkit-transition: background-color 0.3s;
    transition: background-color 0.3s;
    color: #333;
    background-color: #dedede;
    letter-spacing: 1px;
    padding: 0 1em;
    text-align: center; }
  
  ul.primary a:hover,
  ul.primary a:focus {
    background-color: #e9e9e9;
    border-color: #f2f2f2; }
  
  ul.primary a.active {
    background-color: transparent;
    filter-gradient: #e9e9e9, rgba(233, 233, 233, 0);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#e9e9e9), to(rgba(233, 233, 233, 0)));
    background-image: linear-gradient(#e9e9e9, rgba(233, 233, 233, 0));
    border-color: #fff; }



ul.secondary {
  position: absolute;
  right: 0;
  z-index: 10;
  font-size: .9em;
  margin-top: -1.5em;
  
  padding-bottom: .5em; }
  
  ul.secondary a:link,
  ul.secondary a:visited {
    border-radius: .75em;
    -webkit-transition: background-color 0.3s;
    transition: background-color 0.3s;
    text-shadow: 1px 1px 0 #fff;
    background-color: #f2f2f2;
    color: #666;
    padding: 0 .5em; }
  
  ul.secondary a:hover,
  ul.secondary a:focus {
    background-color: #dedede;
    border-color: #999;
    color: #333; }
  
  ul.secondary a.active,
  ul.secondary a:active {
    text-shadow: 1px 1px 0 #333;
    background-color: #666;
    border-color: #000;
    color: #fff; }
