/**
 * Music Navigation component 
 * 
 * Music Navigation Sorts.
 */
/**
 * _components
 *
 * All of the components common to music nav sorts
 */
/*
 * Lib
 */
/*
 * Local
 */
/**
 * _colours 
 *
 * Colour scheme for the main nav items/links
 */
/* Two blues */
/* MusicNav Sections */
/* Drawer/Panel Content */
/* Mobile Menu Button */
/* Tier 1 Items */
/* Tier 2 Items */
/* Footer */
/* Outline Colours for Focus States (links that are active because of tab press) */
/**
 * Global
 *
 * Included at all viewport sizes. This file imports all our common libraries
 * and any module and page specific styling.
 */
/*
 * Break points
 */
/*
------------------------------
    MUSIC NAVIGATION SORT
------------------------------
*/
.mn-sort-wrapper .mn-sm .mn-sm-ul {
  list-style: none;
  padding: 0;
  margin: 0; }
  .mn-sort-wrapper .mn-sm .mn-sm-ul .mn-si {
    display: inline-block;
    font-size: 14px;
    line-height: 18px;
    padding: 8px;
    color: #fff; }
    .mn-sort-wrapper .mn-sm .mn-sm-ul .mn-si a {
      color: #fff;
      text-decoration: none;
      -moz-osx-font-smoothing: grayscale;
      display: inline-flex; }
      .mn-sort-wrapper .mn-sm .mn-sm-ul .mn-si a:hover, .mn-sort-wrapper .mn-sm .mn-sm-ul .mn-si a:active, .mn-sort-wrapper .mn-sm .mn-sm-ul .mn-si a:focus, .mn-sort-wrapper .mn-sm .mn-sm-ul .mn-si a.current {
        color: #CAF9FF; }
        .mn-sort-wrapper .mn-sm .mn-sm-ul .mn-si a:hover .gelicon, .mn-sort-wrapper .mn-sm .mn-sm-ul .mn-si a:active .gelicon, .mn-sort-wrapper .mn-sm .mn-sm-ul .mn-si a:focus .gelicon, .mn-sort-wrapper .mn-sm .mn-sm-ul .mn-si a.current .gelicon {
          color: #a0e3f6; }
      .mn-sort-wrapper .mn-sm .mn-sm-ul .mn-si a .gelicon {
        margin-right: 6px;
        font-size: 16px; }

/*
 * Importing CSS for breakpoints
 */
/**
 * _600
 *
 * Styles for smaller devices like tablets
 */
@media (min-width: 37.5em) {
  .mn-sort-wrapper .mn-sm .mn-sm-ul .mn-si {
    line-height: 20px; } }

/**
 * _800
 *
 * Styles for screens greater than 800px wide
 */
@media (min-width: 50em) {
  .mn-sort-wrapper .mn-sm .mn-sm-ul .mn-si:last-child {
    padding-right: 0; } }

/**
 * _1008
 *
 * Styles for screens greater than 1008px wide
 */
@media (min-width: 63em) {
  .mn-sort-wrapper .mn-sm .mn-sm-ul .mn-si {
    font-size: 14px;
    line-height: 18px; } }

/*
@import "400";
*/