/*
To make it easier to use all variables and mixins in any Sass file in this
theme, each .scss file has a @import "base" declaration. And this _base.scss
file is in charge of importing all the other partials needed for the theme.
*/
/* COLORS
=========================== */
/* dark grey menu blocks */
/* Green */
/* Purple */
/* Light green */
/* Magenta */
/* Cyan */
/* Red */
/* Yellow */
/* Slighty darker */
/* Slighty darker */
/* Messages colors */
/* SIZES & UNITS
=========================== */
/* MIXINS
=========================== */
/* FONTS
=========================== */
/* MARGINS & SPACING
=========================== */
/* BREAKPOINTS
=========================== */
/*  Use as following:
    @include mq($narrow,$wide) {
      font-size: xx;
    }
*/
/* IE SUPPORT
=========================== */
/*
These variables are used by many mixins to add additional CSS to support
specific versions of IE or specific vendor prefixes.

To turn on support for IE6 or IE7, set those variables to true.

Zen does not require special handling for IE8 or later. But Compass uses that
variable for a couple edge cases. We include it for completeness sake. See
the documentation at http://compass-style.org/reference/compass/support/
*/
/* IMPORTS
=========================== */
/*@import "zen";              // Add the Zen Grids responsive layout mixins.*/
/*@import "compass/utilities/general/clearfix"; // Better than Drupal's clearfix.*/
/*@import "compass/utilities/sprites"; // See http://compass-style.org/help/tutorials/spriting/ */
/*@import "compass/typography/vertical_rhythm"; // Helps set up a vertical rhythm. */
/*@import "toolkit/pe"; */
/*@import "custom";           // Import our custom mixins last. */
/* SUPERFISH MENU
=========================== */
/* Essential styles */
.sf-menu li, .menu-block-4 > ul.menu li {
  position: relative;
}
.sf-menu ul, .menu-block-4 > ul.menu ul {
  position: absolute;
  display: none;
  top: 100%;
  left: 0;
  z-index: 99;
}
.sf-menu > li, .menu-block-4 > ul.menu > li {
  float: left;
}
.sf-menu li:hover > ul,
.sf-menu li.sfHover > ul, .menu-block-4 > ul.menu li:hover > ul,
.menu-block-4 > ul.menu li.sfHover > ul {
  /*display: block;*/
}
.sf-menu a, .menu-block-4 > ul.menu a {
  display: block;
  position: relative;
}
.sf-menu ul ul, .menu-block-4 > ul.menu ul ul {
  top: 0;
  left: 100%;
}

.sf-menu, .sf-menu *,
.menu-block-4 > ul.menu, .menu-block-4 > ul.menu * {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Skin */
.sf-menu li a, #navigation .menu-block-4 > ul.menu li a {
  display: block;
}
.sf-menu li.expanded:hover, #navigation .menu-block-4 > ul.menu li.expanded:hover {
  background: #e0dcd7;
}
.sf-menu li.expanded:hover li:hover > a, #navigation .menu-block-4 > ul.menu li.expanded:hover li:hover > a {
  background: #e0dcd7;
}
.sf-menu ul, #navigation .menu-block-4 > ul.menu ul {
  background: #efedeb;
  min-width: 200px;
}
.sf-menu ul li, #navigation .menu-block-4 > ul.menu ul li {
  float: none;
}
.sf-menu ul li a, #navigation .menu-block-4 > ul.menu ul li a {
  border-top: 1px solid #fff;
  white-space: nowrap;
}
.sf-menu li a.sf-with-ul, #navigation .menu-block-4 > ul.menu li a.sf-with-ul {
  padding-right: 25px;
}
.sf-menu li a.sf-with-ul:after, #navigation .menu-block-4 > ul.menu li a.sf-with-ul:after {
  right: 10px;
}

/*** DEMO SKIN ***/
.sf-menu {
  float: left;
  margin-bottom: 1em;
}

.sf-menu ul {
  box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2);
  min-width: 12em;
  /* allow long menu items to determine submenu width */
  *width: 12em;
  /* no auto sub width for IE7, see white-space comment below */
}

.sf-menu a {
  border-left: 1px solid #fff;
  border-top: 1px solid #dFeEFF;
  /* fallback colour must use full shorthand */
  border-top: 1px solid rgba(255, 255, 255, 0.5);
  padding: .75em 1em;
  text-decoration: none;
  zoom: 1;
  /* IE7 */
}

.sf-menu a {
  color: #13a;
}

.sf-menu li {
  background: #BDD2FF;
  white-space: nowrap;
  /* no need for Supersubs plugin */
  *white-space: normal;
  /* ...unless you support IE7 (let it wrap) */
  -webkit-transition: background .2s;
  transition: background .2s;
}

.sf-menu ul li {
  background: #AABDE6;
}

.sf-menu ul ul li {
  background: #9AAEDB;
}

.sf-menu li:hover,
.sf-menu li.sfHover {
  background: #CFDEFF;
  /* only transition out, not in */
  -webkit-transition: none;
  transition: none;
}

/*** arrows (for all except IE7) **/
.menu-block-4 > ul.menu
.sf-arrows .sf-with-ul {
  padding-right: 2.5em;
  *padding-right: 1em;
  /* no CSS arrows for IE7 (lack pseudo-elements) */
}

/* styling for both css and generated arrows */
.sf-arrows .sf-with-ul:after {
  content: '';
  position: absolute;
  top: 50%;
  right: 1em;
  margin-top: -3px;
  height: 0;
  width: 0;
  /* order of following 3 rules important for fallbacks to work */
  border: 5px solid transparent;
  border-top-color: #000;
  /* edit this to suit design (no rgba in IE8) */
}

.sf-arrows > li > .sf-with-ul:focus:after,
.sf-arrows > li:hover > .sf-with-ul:after,
.sf-arrows > .sfHover > .sf-with-ul:after {
  border-top-color: #000;
  /* IE8 fallback colour */
}

/* styling for right-facing arrows */
.sf-arrows ul .sf-with-ul:after {
  margin-top: -5px;
  margin-right: -3px;
  border-color: transparent;
  border-left-color: #000;
  /* edit this to suit design (no rgba in IE8) */
}

.sf-arrows ul li > .sf-with-ul:focus:after,
.sf-arrows ul li:hover > .sf-with-ul:after,
.sf-arrows ul .sfHover > .sf-with-ul:after {
  border-left-color: #000;
}
