zurb-foundation 3.2.5 → 4.0.0.rc1

data/scss/foundation/components/modules/_navbar.scss

@@ -1,74 +0,0 @@
-  .nav-bar { height: $navBarHeight; background: lighten($black, 30%); margin-left: 0; margin-top: $navBarHeight / 2; padding: 0;
-
-    &>li { float: $defaultFloat; display: block; position: relative; padding: 0; margin: 0; border: 1px solid lighten($black, 20%); border-#{$defaultOpposite}: none; line-height: $navBarHeight - 2; @include box-shadow(1px 0 0 fade-out($shinyEdge, .3) inset);
-
-      &:first-child { @include box-shadow(0 0 0); }
-      &:last-child { border-#{$defaultOpposite}: solid 1px lighten($black, 20%); @include box-shadow(1px 0 0 fade-out($shinyEdge, .3) inset, 1px 0 0 fade-out($shinyEdge, .3)); }
-
-      &.active { background: $mainColor; border-color: darken($mainColor, 10%);
-        &>a { color: $white; cursor: default; }
-        &:hover { background: $mainColor; cursor: default; }
-      }
-      &:hover { background: lighten($black, 20%); }
-
-      &>a { color: darken($white, 10%); }
-      ul { margin-bottom: 0; }
-      .flyout { display: none; }
-
-      &.has-flyout {
-        &>a:first-child { padding-#{$defaultOpposite}: $navBarHeight; position: relative;
-          &:after { @include cssTriangle(4px, darken($white, 10%), top); position: absolute; #{$defaultOpposite}: $navBarHeight / 2; top: ($navBarHeight / 2) - 3; }
-        }
-        &>a.flyout-toggle { border-#{$defaultFloat}: 0 !important; position: absolute; #{$defaultOpposite}: 0; top: 0; padding: ($navBarHeight / 2); z-index: 2; display: block; }
-        &.is-touch {
-          &>a:first-child { padding-#{$defaultOpposite}: 55px;}
-          &>a.flyout-toggle { border-#{$defaultFloat}: 1px dashed #666; }
-        }
-      }
-    }
-
-    &>li>a:first-child { position: relative; padding: 0 ($navBarHeight / 2); display: block; text-decoration: none; font-size: ms(0); }
-    &>li>input { margin: 0 10px; }
-
-    &.vertical { height: auto; margin-top: 0;
-
-      &>li { float: none; border-bottom: none; border-#{$defaultOpposite}: solid 1px lighten($black, 20%); @include box-shadow(none);
-
-        &.has-flyout>a:first-child:after { @include cssTriangle(4px, darken($white, 10%), $defaultFloat); }
-        .flyout { #{$defaultFloat}: 100%; top: -1px;
-          &.right { #{$defaultFloat}: auto; #{$defaultOpposite}: 100%; }
-        }
-        &.active { border-#{$defaultOpposite}: solid 1px darken($mainColor, 10%); }
-        &:last-child { border-bottom: solid 1px lighten($black, 20%);}
-      }
-    }
-
-  }
-
-  .flyout { background: darken($white, 5%); padding: $navBarHeight / 2; margin: 0; border: 1px solid darken($white, 15%); position: absolute; top: $navBarHeight - 1; #{$defaultFloat}: -1px; width: $navFlyoutBaseWidth; z-index: 40; @include box-shadow(0 1px 5px rgba(#000, .1));
-
-    p { line-height: 1.2; font-size: ms(0) - 1; }
-    *:first-child { margin-top: 0; } /* remove margin on any first-child element */
-    *:last-child { margin-bottom: 0; } /* remove margin on last element */
-
-    &.small { width: $navFlyoutBaseWidth / 1.5; }
-    &.large { width: $navFlyoutBaseWidth * 1.75; }
-
-    &.right { left: auto; right: -2px; }
-    &.left { right: auto; left: -2px; }
-    &.up { top: auto; bottom: $navBarHeight - 1; }
-
-  }
-
-  ul.flyout, .nav-bar li ul { padding: 0; list-style: none;
-
-    li { border-#{$defaultFloat}: solid 3px #CCC;
-      a { background: darken($white, 5%); border: 1px solid darken($white, 10%); border-width: 1px 1px 0 0; color: #555; display: block; font-size: ms(0); height: auto; line-height: 1; padding: (($navBarHeight / 2) - 5) ($navBarHeight / 2); @include box-shadow(0 1px 0 $shinyEdge inset);
-        &:hover, &:focus { background: darken($white, 8%); color: #333; }
-      }
-      &.active { margin-top: 0; border-top: 1px solid lighten($black, 30%); border-#{$defaultFloat}: 4px solid lighten($black, 10%);
-        a { background: lighten($black, 30%); border: none; color: #fff; height: auto; margin: 0; position: static; top: 0; @include box-shadow(0 0 0); }
-      }
-    }
-
-  }

data/scss/foundation/components/modules/_offcanvas.scss

@@ -1,55 +0,0 @@
-/* Off canvas layout CSS/JS provided by or adapted from work by Jason Weaver and Luke Wroblewski
-   Requires
-   globals.css
-   grid.css */
-
-  body.off-canvas { padding: 0; margin: 0; }
-
-  .container { width: 100%; }
-  .row { overflow: hidden; }
-  .row .row { overflow: visible; }
-
-  .paneled .container { overflow: hidden; }
-  .paneled .row { width: 100%; }
-
-  [role="main"]:before { content: " "; position: absolute; z-index: -1; top: 0; left: -100%; width: 100%; height: 100%; }
-
-  [role="complementary"],
-  [role="main"] { width: 100%; padding: 0 15px; display: block;	position: relative; z-index: 1; @include transition(.25s all ease-in); }
-
-  .paneled [role="main"] { padding: 0; }
-  .page-panel { width: 100%; padding: 0 15px; @include transition(.3s margin ease-in-out); background: #fff; }
-  #switchPanels { margin: 0 -15px; }
-
-  .hide-extras [role="complementary"] { display: block; }
-
-  [role="navigation"]#topMenu { @include transition(.25s all ease-in); }
-  [role="navigation"]#topMenu ul { margin-top: 0; }
-
-  [role="complementary"] { margin-left: -100%; width: 80%; float: left; z-index: 2; }
-  [role="main"] { margin-left: 0; float: right; z-index: 1; position: relative; }
-
-  .paneled [role="main"] { background: #fff; width: 500%; overflow: hidden; float: none; position: relative; left: 0; @include transition(.15s all ease-in); }
-  .page-panel { min-height: 400px; float: left; margin: 0; width: 20%; }
-
-
-  .active [role="complementary"] { margin-left: 0; }
-  .active [role="main"] { margin-right: -80%; }
-
-  .active-menu [role="navigation"]#topMenu { margin-top: 0 !important; }
-
-  @media all and (min-width: 768px) {
-
-    menu-button, .sidebar-button { display: none; }
-    [role="complementary"] { width: $complementaryWidth; margin-left: 0; float: left; padding: 0 15px; }
-    [role="main"] { width: $mainWidth; padding: 0 15px; }
-
-    .paneled [role="main"] { width: 100%; padding: 0; background: #f4f4f4; left: 0 !important; }
-    .page-panel { display: block; min-height: 800px; float: none; margin: 0; width: 100%; background: #f4f4f4; }
-
-    .hide-extras [role="main"] { width: 100%; }
-    .hide-extras [role="complementary"] { display: none; }
-
-    [role="navigation"]#topMenu {	display: none; }
-
-  }

data/scss/foundation/components/modules/_orbit.scss

@@ -1,90 +0,0 @@
-/* CSS for jQuery Orbit Plugin 1.4.0
- * Maintained for Foundation. foundation.zurb.com
- * Free to use under the MIT license.
- * http://www.opensource.org/licenses/mit-license.php
-*/
-
-  /* Container ---------------------- */
-
-  .orbit-wrapper { width: 1px; height: 1px; position: relative; }
-
-  .orbit { width: 1px; height: 1px; position: relative; overflow: hidden; margin-bottom: ms(1);
-
-    &.with-bullets { margin-bottom: 40px; }
-
-    .orbit-slide { max-width: 100%; position: absolute; top: 0; #{$defaultFloat}: 0; }
-    a.orbit-slide { border: none; line-height: 0; display: none; }
-    div.orbit-slide { width: 100%; height: 100%; @include opacity(0); }
-  }
-
-  /* Note: If your slider only uses content or anchors, you're going to want to put the width and height declarations on the ".orbit>div" and "div.orbit>a" tags in addition to just the .orbit-wrapper */
-
-  /* Timer ---------------------- */
-
-  .orbit-wrapper  {
-    .timer { width: 40px; height: 40px; overflow: hidden; position: absolute; top: 10px; #{$defaultOpposite}: 10px; opacity: .6; cursor: pointer; z-index: 31; }
-    span.rotator { display: block; width: 40px; height: 40px; position: absolute; top: 0; #{$defaultFloat}: -20px; background: image-url("foundation/orbit/rotator-black.png") no-repeat; z-index: 3;
-      &.move { #{$defaultFloat}: 0 }
-    }
-    span.mask { display: block; width: 20px; height: 40px; position: absolute; top: 0; #{$defaultOpposite}: 0; z-index: 2; overflow: hidden;
-      &.move { width: 40px; #{$defaultFloat}: 0; background: image-url("foundation/orbit/timer-black.png") repeat 0 0; }
-    }
-    span.pause { display: block; width: 40px; height: 40px; position: absolute; top: 0; #{$defaultFloat}: 0; background: image-url("foundation/orbit/pause-black.png") no-repeat; z-index: 4; opacity: 0;
-      &.active { background: image-url("foundation/orbit/pause-black.png") no-repeat 0 -40px; }
-    }
-    .timer:hover span.pause, .timer:focus span.pause, span.pause.active { opacity: 1 }
-  }
-
-  /* Captions ---------------------- */
-
-  .orbit-caption { display: none; font-family: inherit; }
-  .orbit-wrapper .orbit-caption { background: $orbitCaptionBgColorOldBrowser; background: $orbitCaptionBgColor; z-index: 30; color: $orbitCaptionFontColor; text-align: center; padding: 7px 0; font-size: ms(0) - 1; position: absolute; #{$defaultOpposite}: 0; bottom: 0; width: 100%; }
-
-  /* Directional Nav ---------------------- */
-
-  .orbit-wrapper {
-    .slider-nav { display: block; }
-    .slider-nav span { width: 39px; height: 50px; text-indent: -9999px; position: absolute; z-index: 30; top: 50%; margin-top: -25px; cursor: pointer; }
-    .slider-nav span.#{$defaultOpposite} { background: image-url("foundation/orbit/#{$defaultOpposite}-arrow.png"); background-size: 100%; #{$defaultOpposite}: 0; }
-    .slider-nav span.#{$defaultFloat} { background: image-url("foundation/orbit/#{$defaultFloat}-arrow.png"); background-size: 100%; #{$defaultFloat}: 0; }
-  }
-
-  .lt-ie9 {
-    .orbit-wrapper {
-      .slider-nav span.#{$defaultOpposite} { background: image-url("foundation/orbit/#{$defaultOpposite}-arrow-small.png"); }
-      .slider-nav span.#{$defaultFloat} { background: image-url("foundation/orbit/#{$defaultFloat}-arrow-small.png"); }
-    }
-  }
-
-  /* Bullet Nav ---------------------- */
-
-  ul.orbit-bullets { position: absolute; z-index: 30; list-style: none; bottom: -40px; #{$defaultFloat}: 50%; margin-#{$defaultFloat}: -50px; padding: 0;
-    li { float: $defaultFloat; margin-#{$defaultFloat}: 5px; cursor: pointer; color: $orbitBulletNavColor; text-indent: -9999px; background: image-url("foundation/orbit/bullets.jpg") no-repeat 4px 0; width: 13px; height: 12px; overflow: hidden;
-      &.active { color: $orbitBulletNavColorActive; background-position: -8px 0; }
-      &.has-thumb { background: none; width: 100px; height: 75px; }
-      &.active.has-thumb { background-position: 0 0; border-top: $orbitHasThumbBorderWidth $orbitHasThumbBorderStyle $orbitHasThumbBorderColor; }
-    }
-  }
-
-  /* Orbit Slide Counter */
-  .orbit-slide-counter { position: absolute; bottom: 0; z-index: 99; background: $orbitSlideNumBgColor; color: $orbitSlideNumFontColor; padding: $orbitSlideNumPadding; }
-
-  /* Fluid Layout ---------------------- */
-
-  .orbit img.fluid-placeholder { visibility: hidden; position: static; display: block; width: 100%; }
-  .orbit, .orbit-wrapper { width: 100% !important; }
-
-  /* Correct timer in IE */
-  .lt-ie9 .timer { display: none !important; }
-  .lt-ie9 .orbit-caption { background: $orbitCaptionBgColorOldBrowser; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000,endColorstr=#99000000);zoom: 1; }
-
-// Allow slides to be stacked on mobile devices
-@media only screen and (max-width: $screenSmall - 1) {
-  .orbit.orbit-stack-on-small img.fluid-placeholder {
-    visibility:visible;
-  }
-  .orbit.orbit-stack-on-small .orbit-slide {
-    position:static;
-    margin-bottom:10px;
-  }
-}

data/scss/foundation/components/modules/_reveal.scss

@@ -1,34 +0,0 @@
-/* CSS for jQuery Reveal Plugin
- * Maintained for Foundation. foundation.zurb.com
- * Free to use under the MIT license.
- * http://www.opensource.org/licenses/mit-license.php
- */
-
-/* Reveal Modals ---------------------- */
-
-  .reveal-modal-bg { position: fixed; height: 100%; width: 100%; background: #000; background: rgba(#000, .45); z-index: 40; display: none; top: 0; #{$defaultFloat}: 0; }
-
-  .reveal-modal { background: #fff; visibility: hidden; display: none; top: 100px; #{$defaultFloat}: 50%; margin-#{$defaultFloat}: -260px; width: 520px; position: absolute; z-index: 41; padding: 30px; @include box-shadow(0 0 10px rgba(#000,.4));
-    .close-reveal-modal:not(.button) {
-      @include font-size(22);
-      line-height: .5;
-      position: absolute;
-      top: 8px;
-      #{$defaultOpposite}: 11px;
-      color: #aaa;
-      text-shadow: 0 -1px 1px rgba(0,0,0,.6);
-      font-weight: bold;
-      cursor: pointer;
-    }
-    &.small   { width: 30%; margin-#{$defaultFloat}: -15%; }
-    &.medium  { width: 40%; margin-#{$defaultFloat}: -20%; }
-    &.large   { width: 60%; margin-#{$defaultFloat}: -30%; }
-    &.xlarge  { width: 70%; margin-#{$defaultFloat}: -35%; }
-    &.expand  { width: 90%; margin-#{$defaultFloat}: -45%; }
-    .row { min-width: 0; margin-bottom: 10px; }
-    > :first-child { margin-top: 0; }
-    > :last-child { margin-bottom: 0; }
-  }
-  @media print {
-    .reveal-modal { border: solid 1px #000; background: #fff; }
-  }

data/scss/foundation/components/modules/_tabs.scss

@@ -1,67 +0,0 @@
-/* Tabs ---------------------- */
-
-  .tabs { list-style: none; border-bottom: solid 1px darken($white, 10%); display: block; height: $tabHeight; padding: 0; margin-bottom: 20px;
-    &.contained { margin-bottom: 0; margin-left: 0; }
-
-    dt, li.section-title { color: darken($white, 30%); cursor: default; display: block; float: $defaultFloat; font-size: $tabTermFontSize; height: $tabHeight; line-height: $tabHeight; padding: 0; padding-#{$defaultOpposite}: 9px; padding-#{$defaultFloat}: 20px; font-weight: normal; width: auto; text-transform: uppercase;
-      &:first-child { padding: 0; padding-#{$defaultOpposite}: 9px; }
-    }
-
-    dd, li { display: block; float: $defaultFloat; padding: 0; margin: 0;
-      a { color: lighten($txtColor, 30%); display: block; font-size: ms(0); height: $tabHeight; line-height: $tabHeight; padding: 0px ms(1) * 1.4;
-        &:focus { font-weight: bold; color: $mainColor; }
-      }
-      &.active { border-top: 3px solid $mainColor; margin-top: -3px;
-        a { cursor: default; color: lighten($txtColor, 10%); background: #fff; border-#{$defaultFloat}: 1px solid darken($white, 10%); border-#{$defaultOpposite}: 1px solid darken($white, 10%); font-weight: bold; }
-      }
-      &:first-child { margin-#{$defaultFloat}: 0; }
-    }
-
-    &.vertical { height: auto; border-bottom: 1px solid darken($white, 10%);
-      dt, dd, li { float: none; height: auto; }
-
-      dd, li { border-#{$defaultFloat}: 3px solid darken($white, 20%);
-        a { background: darken($white, 5%); border: none; border: 1px solid darken($white, 10%); border-width: 1px 1px 0 0; color: #555; display: block; font-size: ms(0); height: auto; line-height: 1; padding: 15px 20px; @include box-shadow(0 1px 0 $shinyEdge inset);
-        }
-        &.active { margin-top: 0; border-top: 1px solid lighten($black, 30%); border-#{$defaultFloat}: 4px solid lighten($black, 10%);
-          a { background: lighten($black, 30%); border: none; color: #fff; height: auto; margin: 0; position: static; top: 0; @include box-shadow(0 0 0); }
-        }
-        &:first-child a.active { margin: 0; }
-      }
-    }
-
-    &.pill { border-bottom: none; margin-bottom: 10px;
-      dd, li { margin-#{$defaultOpposite}: 10px;
-        &:last-child { margin-#{$defaultOpposite}: 0; }
-        a { @include border-radius(1000px); background: darken($white, 10%); height: $tabHeight - 14; line-height: $tabHeight - 14; color: #666; }
-
-        &.active { border: none; margin-top: 0;
-          a { background-color: $mainColor; border: none; color: #fff; }
-        }
-      }
-      &.contained { border-bottom: solid 1px #eee; margin-bottom: 0; }
-      &.two-up, &.three-up, &.four-up, &.five-up {
-        dd, li { margin-#{$defaultOpposite}: 0; }
-      }
-    }
-
-    &.two-up, &.three-up, &.four-up, &.five-up {
-      dt a, dd a, li a { padding: 0 ms(1); text-align: center; overflow: hidden; }
-    }
-    &.two-up dt, &.two-up dd, &.two-up li      { width: 50%; }
-    &.three-up dt, &.three-up dd, &.three-up li  { width: 33.33%; }
-    &.four-up dt, &.four-up dd, &.four-up li    { width: 25%; }
-    &.five-up dt, &.five-up dd, &.five-up li    { width: 20%; }
-  }
-
-  ul.tabs-content { display: block; margin: 0 0 20px; padding: 0;
-    &>li { display: none;
-      &.active { display: block; }
-    }
-    &.contained { padding: 0;
-      &>li { border: solid 0 darken($white, 10%); border-width: 0 1px 1px 1px; padding: 20px; }
-      &.vertical>li { border-width: 1px 1px 1px 1px; }
-    }
-  }
-
-  .no-js ul.tabs-content>li { display: block; }

data/scss/foundation/components/modules/_topbar.scss

@@ -1,167 +0,0 @@
-/*
-  Foundation Top Bar
-
-  Requires:
-    -jquery.foundation.topbar.js
-
-  Notes:
-    - <nav class="top-bar"> can have .fixed added to make it stick to the top of viewport. Can add .contain-to-grid to top-bar to make it full width but content on grid.
-    - <li class="name"> creates a branding area that can be linked to homepage
-      - Can include text, image or both inside this <li>.
-    - <li class="divider"> creates a divider between nav items, add margins for space
-    - <li class="search"> Needs to hold a <form> which can use .row.collapse and pre/postfix buttons or default type="search"
-*/
-
-  /* Element that controls breakpoint, no need to change this ever */
-  .top-bar-js-breakpoint { width: $topBarBreakPoint !important; visibility: hidden; }
-
-  /* Wrapped around .top-bar to contain to grid width */
-  .contain-to-grid { width: 100%; background: $topBarBgColor; }
-
-  /* Wrapped around .top-bar to make it fixed at the top */
-  .fixed { width: 100%; left: 0; position: fixed; top: 0; z-index: 99; }
-
-  /* Add .sticky class for using top bar as a sticky navigation when scrolling passed it. Add the class .sticky to a top bar using .contain-to-grid but leave off .fixed, javascript will take care of that */
-  .sticky { float: left; overflow: hidden;
-    &.fixed { float: none; }
-  }
-
-  /* <nav> */
-  .top-bar { background: $topBarBgColor; min-height: $topBarHeight; line-height: $topBarHeight; margin: 0 0 $topBarBtmMargin 0; padding: 0; width: 100%; position: relative;
-
-    /* Contain width to .row width */
-    .contain-to-grid & { max-width: $rowWidth; margin: 0 auto; }
-
-    /* First <ul> for branding, title, name, etc */
-    &>ul {
-      .name {
-        h1 { line-height: $topBarHeight; margin: 0;
-          a { font-weight: $topBarTitleWeight; padding: 0 $topBarHeight / 2; font-size: $topBarTitleSize !important; }
-        }
-        img { margin-top: -5px; vertical-align: middle; }
-      }
-    }
-    &.expanded { height: inherit; }
-
-    /* topbar global <ul> styles */
-    ul { margin-left: 0; display: inline; height: $topBarHeight; line-height: $topBarHeight; list-style: none;
-
-      /* Main Navigation links style */
-      &>li { float: left;
-        a:not(.button) { color: $topBarLinkColor; display: block; font-size: $topBarLinkSize; font-weight: $topBarLinkWeight; height: $topBarHeight; line-height: $topBarHeight; padding: 0 $topBarHeight / 3; }
-        &:not(.name) {
-          &:hover, &.active, &:focus { background: darken($topBarBgColor, 15%);
-            a { color: darken($topBarLinkColor, 15%); }
-          }
-        }
-
-        /* Dividers between navigation */
-        &.divider { background: darken($topBarBgColor, 15%); @include box-shadow(1px 0 0 rgba(255,255,255,0.10)); height: 100%; margin-right: 1px; width: 1px; }
-
-        /* Put a button in an <li> but give is a class */
-        &.has-button {
-          a.button { margin: 0 $topBarHeight / 4; }
-          &:hover, &:focus { background: $topBarBgColor;
-            a { color: #fff; }
-          }
-        }
-
-        /* Put a search bar or text input in the bar */
-        &.search { padding: 0 $topBarHeight / 3;
-          form { display: inline-block; margin-bottom: 0; vertical-align: middle; width: $topBarSearchWidth;
-            input[type=text] { @include border-right-radius(0); float: left; font-size: ms(0) - 1; margin-top: -1px; height: $topBarHeight / 2; //28px
-                              margin-bottom: 0; width: $topBarSearchWidth - 70px;
-              &+.button { border-left: none; @include border-left-radius(0); float: left; font-size: ms(0) - 2; margin-top: -1px; padding: 5px 12px 4px; }
-            }
-            input[type=search] { font-size: 16px; margin-bottom: 0; }
-          }
-          &:hover, &:focus { background: $topBarBgColor; }
-        }
-
-        /* Put login bar in the top bar */
-        &.login {padding: 0 $topBarHeight / 3;
-          form {display: inline-block; margin-bottom: 0; vertical-align: middle; width: $topBarLoginWidth;
-            input{float: left; width: auto; font-size: ms(0) - 1; margin-top: -1px; height: $topBarHeight / 2; margin-bottom: 0; }
-            input[type=text]{ @include border-right-radius(0); width: $topBarLoginInputWidth;}
-            input[type=password] { margin-bottom: 0; @include border-left-radius(0); width: $topBarLoginInputWidth;
-              &+.button {border-left: none; @include border-left-radius(0); @include border-right-radius(2px); float: left; font-size: ms(0) - 2; margin-top: -1px; padding: 5px 12px 4px; width: $topBarLoginButtonWidth;}
-            }
-          }
-          &:hover, &:focus { background: $topBarBgColor; }
-        }
-
-        /* Hide the triangle for breakpoint menu */
-        &.toggle-topbar { display: none; }
-
-        /* li.has-dropdown */
-        &.has-dropdown { position: relative;
-          &:hover, &:focus { &>.dropdown { display: block; visibility: visible; } }
-          a { padding-right: $topBarHeight * .75;
-            &:after { @include cssTriangle($topBarDropToggleSize, $topBarDropToggleColor, top); margin-right: $topBarHeight / 3; margin-top: -$topBarDropToggleSize / 2; position: absolute; right: 0; top: 50%; }
-          }
-          .dropdown { background: $topBarDropBgColor; left: 0; margin: 0; padding: $topBarHeight / 5 0 0 0; position: absolute; visibility: hidden; z-index: 99;
-            li { background: $topBarDropBgColor; line-height: 1; min-width: 100%; padding-bottom: 5px;
-              a { color: $topBarDropLinkColor; font-weight: normal; height: 100%; line-height: 1; padding: 5px $topBarHeight / 3 + 2 5px $topBarHeight / 3; white-space: nowrap;
-                &:after { border: none; }
-                &:hover, &:focus { background: lighten($topBarDropBgColor, 10%); }
-              }
-              label { color: lighten($topBarDropBgColor, 30%); font-size: ms(0) - 4; font-weight: $topBarLinkWeight; margin: 0; padding-left: $topBarHeight / 3; text-transform: uppercase; }
-              &.divider { border-top: solid 1px darken($topBarDropBgColor, 20%); @include box-shadow(0 1px 0 rgba(255,255,255,.10) inset); height: 10px; padding: 0; width: 100%; }
-              &:last-child { padding-bottom: 10px; }
-              &.active a { background: darken($topBarBgColor, 15%); }
-            }
-          }
-
-          /* Dropdown Level 2+ */
-          .dropdown li.has-dropdown {
-            &>a { padding-right: $navBarHeight * .75;
-              &:after { border: none; content:"\00bb"; right: 5px; top: 6px; }
-            }
-            .dropdown { position: absolute; left: 100%; top: 0; }
-            &:hover, &:focus {
-              &>.dropdown { display: block; }
-            }
-          }
-        }
-      }
-
-      /* Left Side <ul> */
-      &.left { float: left; width: auto; margin-bottom: 0; }
-
-      /* Right Side <ul> */
-      &.right { float: right; width: auto; margin-bottom: 0;
-        /* Dropdown Right Side Alignment */
-        .has-dropdown .dropdown { left: auto; right: 0px;
-          li.has-dropdown > .dropdown { right: 100%; left: auto; width: 100%; }
-        }
-      }
-    }
-
-    .js-generated { display: none; }
-  }
-
-  /* Firefox Fixes */
-  @-moz-document url-prefix() {
-    .top-bar ul li .button.small { padding-bottom: 6px; }
-    .top-bar ul li.search form input[type=search] { font-size: 14px; height: 22px; padding: 3px; }
-  }
-
-  /* IE8 Fixes */
-  .lt-ie9 .top-bar ul li a { color: $topBarLinkColor; display: block; font-weight: $topBarLinkWeight; font-size: $topBarLinkSize; height: $topBarHeight; line-height: $topBarHeight; padding: 0 $topBarHeight / 3;
-    &.button { height: auto; line-height: 30px; margin-top: 7px; }
-    img { margin-top: -5px; vertical-align: middle; }
-  }
-  .lt-ie9 .top-bar section > ul > li
-  {
-   a
-    {
-  &:hover, &:focus {color: darken($topBarLinkColor, 20%); }
-	}
-    &:hover, &:focus { background: darken($topBarBgColor, 15%) }
-	&.search:hover,&.search:focus,&.has-button:hover,&.has-button:focus { background: none }
-    &.active { background: darken($topBarBgColor, 15%); color: darken($topBarLinkColor, 15%); }
-  }
-  .lt-ie9 .top-bar ul li.has-dropdown {
-    padding-right: $topBarHeight * .75;
-    &>ul li { padding-right: 0; }
-  }