/* ------------------------------------------------
   The Whisky Exchange
   Designed and Built by The Whisky Exchange
   All Rights Reserved

   Navigation CSS file 

   Content:
   Nav Bar
   Nav Bar Colours
   Subnav
   Subnav Colours
   ------------------------------------------------ */

/* ------------------------------------------------
   Nav Bar
   ------------------------------------------------ */
#twenavigation {
   display: none;
   width: 100%;
   height: 100%;
   border-bottom: 5px solid #b8a877;
   background: #b39851;
}
#twenavigation .nav-bar {
   position: relative;
   width: 100%;
   max-width: 980px;
   margin: 0 auto;
   height: 100%;
}
#twenavigation .nav-item {
   display: block;
}
#twenavigation .nav-item-link {
   display: block;
   height: 55px;
   line-height: 55px;
   padding: 0 8px;
   font-family: 'Fjalla One', 'Lato', arial, sans-serif;
   text-transform: uppercase;
   color: #f7f8d9;
}
#twenavigation .nav-item-link:focus {
   outline: none;
}
#twenavigation .nav-link-active {
   background: rgba(0,0,0,0.1);
}
@media (min-width: 660px) {
   #twenavigation {
      border-bottom: 5px solid #b8a676;
      border-right: none;
      overflow: visible;
      height: auto;
   }
   #twenavigation .nav-bar {
      overflow: visible;
   }
   #twenavigation .nav-item {
      float: left;
      width: 20%;
      text-align: center;
   }
   #twenavigation .nav-item-link {
      font-size: 0.9em;
   }
   #twenavigation .nav-item-link:hover,
   #twenavigation .nav-link-active {
      background: #fff;
   }   
}
@media (min-width: 980px) {
   #twenavigation {
      display: block;
      height: 55px;
      background: url(../images/navigation/nav-gold-repeat.png) #b29751; /* Default (no category specified) */
      border: none;
   }
   /* Nav bar items */
   #twenavigation .nav-list-container {
      display: table;
      margin: 0 auto;
      background: url(../images/navigation/nav-gold-bar.png) top center no-repeat;
   }
   #twenavigation .nav-list {
      height: 55px;
   }
   #twenavigation .nav-item {
      width: auto;
   }
}
/* ------------------------------------------------
   Nav Bar Colours
   ------------------------------------------------ */
/* Navigation bar background colour */
.twe-gold-bar #twenavigation {
   border-bottom: 5px solid #b8a877;
   background: #b39851;
}
.twe-silver-bar #twenavigation {
   border-bottom: 5px solid #a4a4a4;
   background: #858585;
}
/* Navigation bar link Colors */
.twe-gold-bar #twenavigation .nav-item-link {
   color: #f7f8d9; 
}
.twe-silver-bar #twenavigation .nav-item-link {
   color: #ececec;
}
@media (min-width: 660px) {
   /* Navigation bar background colour */
   .twe-gold-bar #twenavigation {
      border-bottom: 5px solid #b8a676;
      border-right: none;
   }
   .twe-silver-bar #twenavigation {
      border-bottom: 5px solid #989898;
      border-right: none;
   }
   /* link hover / focus colours */
   #twenavigation .nav-colour-brown .nav-item-link:hover,
   #twenavigation .nav-colour-brown .nav-link-active {
      color: #5f1d07;
   }
   #twenavigation .nav-colour-purple .nav-item-link:hover,
   #twenavigation .nav-colour-purple .nav-link-active {
      color: #62385c;
   }
}
@media (min-width: 980px) {
   /* Navigation bar repeating background gradient */
   .twe-gold-bar #twenavigation {
      background: url(../images/navigation/nav-gold-repeat.png);
      border: none;
   }
   .twe-silver-bar #twenavigation {
      background: url(../images/navigation/nav-silver-repeat.png);
      border: none;
   }
   /* Navigation background image */
   .twe-gold-bar #twenavigation .nav-list-container {
      background: url(../images/navigation/nav-gold-bar.png) top center no-repeat;
   }
   .twe-silver-bar #twenavigation .nav-list-container {
      background: url(../images/navigation/nav-silver-bar.png) top center no-repeat;
   }
}
/* ------------------------------------------------
   Subnav Panels
   ------------------------------------------------ */
#twenavigation .sub-panel {
   display: none;
   background: rgba(0,0,0,0.2);
}
#twenavigation .not-mobile {
   display: none;
}
#twenavigation .feature-item-link {
   display: block;
   margin-left: 10px;
   padding-left: 40px;
   font-family: 'Fjalla One','Lato',arial, sans-serif;
   text-transform: uppercase;
   color: #f7f8d9;
   line-height: 50px;
   font-size: 0.9em;
   background: url(../images/navigation/nav-icons.png) 0 0 no-repeat;
}
#twenavigation .panel-item-link {
   font-family: 'Lato',arial, sans-serif;
   color: #f7f8d9;
   font-size: 0.8em;
   display: block;
   line-height: 30px;
   padding-left: 30px;
}
#twenavigation .panel-item-title {
   display: block;
   font-family: 'Fjalla One','Lato',arial, sans-serif;
   text-transform: uppercase;
   color: #f7f8d9;
   font-size: 0.9em;
   padding: 10px 0 10px 10px;
}
/* Grid Nav Items */
#twenavigation .block-item-list {
   margin-left: 30px;
   float: left;
   clear: both;
}
#twenavigation .block-item {
   display: block;
   float: left;
}
#twenavigation .block-item-link {
   display: block;
   width: 45px;
   height: 45px;
   text-align: center;
   margin: 0 15px 15px 0;
   background: rgba(0,0,0,0.2);
   line-height: 45px;
   color: #f7f8d9;
}
@media (min-width: 660px) {
   #twenavigation .sub-panel {
      display: none;
      position: absolute;
      left: 0;
      width: 100%;
      background-color: #fff;
      z-index: 900;
      text-align: left;
      -webkit-box-shadow: 0px 7px 6px 0px rgba(0, 0, 0, 0.6);
         -moz-box-shadow: 0px 7px 6px 0px rgba(0, 0, 0, 0.6);
              box-shadow: 0px 7px 6px 0px rgba(0, 0, 0, 0.6);
      padding: 20px 0;
   }
   #twenavigation .sub-panel-container {
      display: table;
      width: 100%;
   }
   #twenavigation .panel-col {
      display: table-cell;
      width: 20%;
      padding: 0 10px;
      margin: 20px 0;
      border-right: 1px solid #e5e5e5;   
   }
   #twenavigation .panel-col:last-of-type {
      border-right: none;
   }
   #twenavigation .panel-feature {
      display: table-row;
      width: 100%;
      border-right: none;
      clear: both;
   }
   #twenavigation .panel-double {
      width: 40%;
   }
   #twenavigation .panel-empty {
      display: none;
   }
   /* Feature col */
   #twenavigation .feature-list {
      display: block;
      float: left;
      width: 500%;
      padding: 0 0 25px;
   }
   #twenavigation .feature-item {
      display: block;
      float: left;
      width: 33.3333%;
   }
   #twenavigation .panel-item-link {
      color: #7d7d7d;
      padding-left: 0;
   }
   #twenavigation .panel-item-title {
      display: block;
      color: #622d0e;
      padding: 0;
   }
   #twenavigation .panel-item-separated {
      margin-top: 30px;
   }
   #twenavigation .block-item-list {
      margin: 0;
   }
   #twenavigation .block-item {
      display: block;
      float: left;
   }
   #twenavigation .block-item-link {
      color: #7d7d7d;
      background: rgba(0,0,0,0.1);
   }
}
@media (min-width: 980px) {
   #twenavigation .panel-col {
      float: none;
      width: 16.6666%;
      display: table-cell;
   }
   #twenavigation .panel-feature {
      width: 16.6666%;
      border-right: 1px solid #e5e5e5; 
   }
   #twenavigation .panel-double {
      width: 33.3333%;
   }
   #twenavigation .panel-triple {
      width: 50%;
   }
   #twenavigation .panel-empty {
      display: table-cell;
   }
   /* Feature col */
   #twenavigation .feature-list {
      float: none;
      width: 100%;
      padding: 0;
   }
   #twenavigation .feature-item {
      float: none;
      width: 100%;
   }
   #twenavigation .feature-item-link {
      display: block;
      margin: 0;
      line-height: 1.5;
      margin-bottom: 30px;
      height: 50px;
   }
}
/* ------------------------------------------------
   Subnav Colours
   ------------------------------------------------ */
/* Subnav Link Colours */
.twe-gold-bar #twenavigation .feature-item-link,
.twe-gold-bar #twenavigation .panel-item-title,
.twe-gold-bar #twenavigation .panel-item-link,
.twe-gold-bar #twenavigation .block-item-link {
   color: #f7f8d9; 
}
.twe-silver-bar #twenavigation .feature-item-link,
.twe-silver-bar #twenavigation .panel-item-title,
.twe-silver-bar #twenavigation .panel-item-link,
.twe-silver-bar #twenavigation .block-item-link {
   color: #ececec;
}
@media (min-width: 660px) {
   /* Subnav Link Colours */
   .twe-gold-bar #twenavigation .panel-item-link,
   .twe-gold-bar #twenavigation .block-item-link,
   .twe-silver-bar #twenavigation .panel-item-link,
   .twe-silver-bar #twenavigation .block-item-link {
      color: #7d7d7d; 
   }
   /* Sub nav title colours */
   #twenavigation .nav-colour-brown .feature-item-link,
   #twenavigation .nav-colour-brown .panel-item-title {
      color: #5f1d07;
   }
   #twenavigation .nav-colour-purple .feature-item-link,
   #twenavigation .nav-colour-purple .panel-item-title {
      color: #62385c;
   }
   /* Hover Colour */
   #twenavigation .feature-item-link:hover,
   #twenavigation .panel-item-title:hover,
   #twenavigation .panel-item-link:hover,
   .twe-gold-bar #twenavigation .feature-item-link:hover,
   .twe-gold-bar #twenavigation .panel-item-title:hover,
   .twe-gold-bar #twenavigation .panel-item-link:hover,
   .twe-silver-bar #twenavigation .feature-item-link:hover,
   .twe-silver-bar #twenavigation .panel-item-title:hover,
   .twe-silver-bar #twenavigation .panel-item-link:hover {
      color: #ff7010;
   }
   /* Block link hover states */
   #twenavigation .block-item-link:hover,
   .twe-silver-bar #twenavigation .block-item-link:hover,
   .twe-silver-bar #twenavigation .block-item-link:hover {
      background: rgba(0,0,0,0.3);
      color: #fff;
   }
}
/* Feature Link Icon colours */
#twenavigation .nav-colour-green .feature-link-whatsnew {
   background-position: 0 0;
}
#twenavigation .nav-colour-green .feature-link-specialoffers {
   background-position: 0 -50px;
}
#twenavigation .nav-colour-green .feature-link-birthdays {
   background-position: 0 -100px;
}
#twenavigation .nav-colour-green .feature-link-gifts {
   background-position: 0 -150px;
}
#twenavigation .nav-colour-green .feature-link-oldrare {
   background-position: 0 -200px;
}
#twenavigation .nav-colour-green .feature-link-az {
   background-position: 0 -250px;
}
#twenavigation .nav-colour-purple .feature-link-whatsnew {
   background-position: 0 -300px;
}
#twenavigation .nav-colour-purple .feature-link-specialoffers {
   background-position: 0 -350px;
}
#twenavigation .nav-colour-purple .feature-link-birthdays {
   background-position: 0 -400px;
}
#twenavigation .nav-colour-purple .feature-link-gifts {
   background-position: 0 -450px;
}
#twenavigation .nav-colour-purple .feature-link-oldrare {
   background-position: 0 -500px;
}
#twenavigation .nav-colour-purple .feature-link-az {
   background-position: 0 -550px;
}
#twenavigation .nav-colour-brown .feature-link-whatsnew {
   background-position: 0 -600px;
}
#twenavigation .nav-colour-brown .feature-link-specialoffers {
   background-position: 0 -650px;
}
#twenavigation .nav-colour-brown .feature-link-birthdays {
   background-position: 0 -700px;
}
#twenavigation .nav-colour-brown .feature-link-gifts {
   background-position: 0 -750px;
}
#twenavigation .nav-colour-brown .feature-link-oldrare {
   background-position: 0 -800px;
}
#twenavigation .nav-colour-brown .feature-link-az {
   background-position: 0 -850px;
}
@media (min-width: 980px) {
   #twenavigation .nav-colour-green .feature-link-whatsnew {
      background-position: 0 10px;
   }
   #twenavigation .nav-colour-green .feature-link-specialoffers {
      background-position: 0 -60px;
   }
   #twenavigation .nav-colour-green .feature-link-birthdays {
      background-position: 0 -110px;
   }
   #twenavigation .nav-colour-green .feature-link-gifts {
      background-position: 0 -150px;
   }
   #twenavigation .nav-colour-green .feature-link-oldrare {
      background-position: 0 -200px;
   }
   #twenavigation .nav-colour-green .feature-link-az {
      background-position: 0 -260px;
   }
   #twenavigation .nav-colour-purple .feature-link-whatsnew {
      background-position: 0 -310px;
   }
   #twenavigation .nav-colour-purple .feature-link-specialoffers {
      background-position: 0 -360px;
   }
   #twenavigation .nav-colour-purple .feature-link-birthdays {
      background-position: 0 -410px;
   }
   #twenavigation .nav-colour-purple .feature-link-gifts {
      background-position: 0 -450px;
   }
   #twenavigation .nav-colour-purple .feature-link-oldrare {
      background-position: 0 -500px;
   }
   #twenavigation .nav-colour-purple .feature-link-az {
      background-position: 0 -560px;
   }
   #twenavigation .nav-colour-brown .feature-link-whatsnew {
      background-position: 0 -610px;
   }
   #twenavigation .nav-colour-brown .feature-link-specialoffers {
      background-position: 0 -660px;
   }
   #twenavigation .nav-colour-brown .feature-link-birthdays {
      background-position: 0 -710px;
   }
   #twenavigation .nav-colour-brown .feature-link-gifts {
      background-position: 0 -750px;
   }
   #twenavigation .nav-colour-brown .feature-link-oldrare {
      background-position: 0 -800px;
   }
   #twenavigation .nav-colour-brown .feature-link-az {
      background-position: 0 -860px;
   }
}