/******************************************************************

Stylesheet: IE Stylesheet

******************************************************************/
/*
Remember, all the BASE styles are called already since IE can
read those. Below, we need to import only the stuff IE can't 
understand (what's inside the media queries). We also need to
import the mixins file so LESS can understand the variables.
*/
/* import mixins */
/******************************************************************

Stylesheet: Mixins & Constants Stylesheet

******************************************************************/
/*********************
CLEARFIXIN'
*********************/
.clearfix,
.cf {
  zoom: 1;
}
.clearfix:before,
.cf:before,
.clearfix:after,
.cf:after {
  content: "";
  display: table;
}
.clearfix:after,
.cf:after {
  clear: both;
}
.respImage {
  height: auto;
  width: 100%;
}
/*********************
TOOLS
*********************/
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.image-replacement {
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
.max-width {
  max-width: 960px;
}
/*********************
COLORS
*********************/
/*********************
HOVER STATES
*********************/
header a,
header a:visited,
footer a,
footer a:visited {
  color: #ffffff;
  text-decoration: none;
  /* on hover */
  /* mobile tap color */
}
header a:link,
header a:visited:link,
footer a:link,
footer a:visited:link {
  /*
		this highlights links on iPhones/iPads.
		so it basically works like the :hover selector
		for mobile devices.
		*/
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0.3);
}
/*********************
TYPOGRAPHY
*********************/
@font-face {
  font-family: 'fontello';
  src: url('../fonts/fontello.eot?48958282');
  src: url('../fonts/fontello.eot?48958282#iefix') format('embedded-opentype'), url('../fonts/fontello.woff?48958282') format('woff'), url('../fonts/fontello.ttf?48958282') format('truetype'), url('../fonts/fontello.svg?48958282#fontello') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* 
use the best ampersand 
http://simplebits.com/notebook/2008/08/14/ampersands-2/
*/
span.amp {
  font-family: Baskerville, 'Goudy Old Style', Palatino, 'Book Antiqua', serif;
  font-style: italic;
}
/* text alignment */
.text-left {
  text-align: left;
}
.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}
/*********************
BORDER RADIUS
*********************/
/* 
NOTE: For older browser support (and some mobile), 
don't use the shorthand to define *different* corners. 

USAGE: .border-radius(4px); 

*/
/*********************
TRANISTION
*********************/
/* .transition(all,2s); */
/*********************
CSS3 GRADIENTS
Be careful with these since they can 
really slow down your CSS. Don't overdo it.
*********************/
/* .css-gradient(left,#dfdfdf,#f8f8f8); */
/* .radial-gradient(center, top, circle, top, @red, @orange); */
/*********************
BOX SHADOW
*********************/
/* .boxShadow(0,0,4px,0,#444); */
/* .boxShadow(none); */
/*********************
BOX SHADOW
*********************/
/* .columns(3, 10px); */
/*********************
BUTTONS
*********************/
.button,
.button:visited {
  border: 0 none;
  background: #a6a6a6;
  color: #ffffff;
  font-size: 1.5em;
  font-weight: bold;
  display: block;
  cursor: pointer;
  margin-bottom: 20px;
  line-height: 1em;
  text-decoration: none;
  padding: .5em 1em;
}
.button:hover,
.button:visited:hover,
.button:focus,
.button:visited:focus {
  background: #00a7ce;
}
/******************************************************************

Stylesheet: 581px and Up Stylesheet

******************************************************************/
.mobileOff {
  display: block;
}
.mobileOn {
  display: none;
}
/*********************
HEADER/NAV SYTLES
*********************/
#utility-header-inner {
  display: block;
}
#utility-header-inner .utility-menu li:last-child {
  padding: 3px 0;
}
#utility-header-inner .utility-menu li:last-child a {
  padding: 0 1em;
}
header a {
  color: #ffffff;
}
header a:hover,
header a:focus {
  color: #e0c298;
}
header #navShowHide {
  right: 2%;
}
header #inner-header {
  padding: 5px 5% 0;
  position: relative;
}
header #searchbar {
  position: relative;
}
header #navWrap {
  float: left;
  width: 100%;
}
header #navWrap nav {
  background: none;
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  display: block;
  margin: 0 auto;
  max-width: 988px;
  padding: 0;
  position: relative;
  z-index: auto;
}
header #navWrap nav ul#primary {
  float: none;
  margin: 0;
  padding: 0 1%;
  text-align: center;
  width: 98%;
}
header #navWrap nav ul#primary li {
  background: url(../img/primePipe.png) left center no-repeat transparent;
  display: inline;
}
header #navWrap nav ul#primary li a {
  color: #ffffff;
  display: inline-block;
  float: none;
  font-weight: normal;
  margin: 0;
  padding: 7px 1.25%;
  width: auto;
}
header #navWrap nav ul#primary li a:hover,
header #navWrap nav ul#primary li a:focus {
  color: #e0c298;
  text-decoration: none;
}
header #navWrap nav ul#primary li:first-child a {
  padding: 7px 1.25% 7px 0;
}
header #navWrap nav ul#primary li:last-child a {
  padding: 7px 0 7px 1.25%;
}
header #navWrap nav ul#primary li:first-child {
  background: none;
}
header #navWrap nav ul#primary li .currentPage {
  font-weight: bold;
}
#mycmsv .featureLinks li {
  width: 25%;
}
/*********************
ALIGNMENT STYLES
*********************/
/* at this larger size, we can start to align images */
.alignleft,
img.alignleft {
  margin-right: 1.5em;
  display: inline;
  float: left;
}
.alignright,
img.alignright {
  margin-left: 1.5em;
  display: inline;
  float: right;
}
.aligncenter,
img.aligncenter {
  margin-right: auto;
  margin-left: auto;
  display: block;
  clear: both;
}
/*********************
HERO STYLES
*********************/
#main-slider {
  float: none;
  margin: 0 auto;
}
#main-slider li .slideDesc-wrap {
  width: 99.999999993%;
  position: relative;
  float: left;
  margin-right: 2.762430939%;
  margin-right: 0;
}
#main-slider li .slideDesc h2 {
  font-size: 3.867em;
  line-height: 1em;
}
#main-slider li .slideDesc .wrap-container {
  margin: 0 auto;
  max-width: 960px;
}
#main-slider li .black {
  background: #000000;
  background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 50%, rgba(0, 0, 0, 0.75) 100%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(50%, rgba(0, 0, 0, 0.75)), color-stop(100%, rgba(0, 0, 0, 0.75)));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 50%, rgba(0, 0, 0, 0.75) 100%);
  /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 50%, rgba(0, 0, 0, 0.75) 100%);
  /* Opera 11.10+ */
  background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 50%, rgba(0, 0, 0, 0.75) 100%);
  /* IE10+ */
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 50%, rgba(0, 0, 0, 0.75) 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00838485', endColorstr='#bf838485', GradientType=0);
  /* IE6-9 */
  color: #ffffff;
  padding: 5px 7% 0;
}
#main-slider li .white {
  background: #ffffff;
  color: #77787b;
  padding: 10px 7%;
}
#main-slider .slideDesc-block {
  position: absolute;
  display: block;
  float: left;
  bottom: 0;
  width: 100%;
  z-index: 500;
}
#main-slider .flex-direction-nav {
  margin-top: -3.5em;
}
#main-slider .flex-direction-nav .flex-prev,
#main-slider .flex-direction-nav .flex-next {
  font-size: 2.25em;
}
/*********************
HOME CONTENT STYLES
*********************/
/*********************
CONTENT STYLES
*********************/
#content {
  clear: both;
  float: none;
  margin: 0 auto 5em auto;
}
#content .socialCallOut {
  border-top: 1px dotted #000000;
  margin-top: 48px;
}
#content .socialCallOut .twelvecol {
  margin-top: 30px;
}
#content .departmentSideNav {
  padding: 0;
}
#content .departmentSideNav ul li a i {
  color: #00a7ce;
  float: none;
  position: absolute;
  right: 0;
}
#content.topSpace {
  margin-top: 50px;
}
#content.homeContent {
  padding: 0 7%;
}
#content.homeContent > div {
  padding: 0;
}
#content.homeContent > div:nth-child(even) {
  background: #ffffff;
}
#content .moreNews .newsItem {
  width: 99.999999993%;
  position: relative;
  float: left;
  margin-right: 2.762430939%;
  margin-right: 0;
}
#breadcrumbs {
  margin: 25px 0 4em;
}
.homeContent {
  float: none;
  margin: 0 auto;
}
#contentHeaderWrap .departmentHeader h1 {
  padding: 1em .5em;
}
#secondaryNavWrap .secondaryNav {
  z-index: 99;
}
#secondaryNavWrap .secondaryNav ul li {
  padding: 3% 0;
}
/*** Sidebars ***/
/*********************
FOOTER STYLES
*********************/
.footer {
  background-size: cover;
}
#inner-footer {
  padding: 30px 12% 150px 5%;
}
#inner-footer .logo-footer {
  margin-top: 0;
}
#inner-footer nav a {
  display: inline-block;
  margin: 0 1% 10px;
  padding: 0;
}
#inner-footer .social {
  bottom: auto;
  top: 30px;
  right: 2%;
}
#inner-footer .copyright {
  float: left;
}
#inner-footer .copyright span {
  display: inline;
}
/* import grid */
/******************************************************************

Stylesheet: Grid Stylesheet

http://gridsetapp.com - Love this site. Responsive Grids made easy.
http://gridpak.com/ - Create your own responsive grid.

******************************************************************/
.onecol {
  width: 5.801104972%;
}
.twocol {
  width: 14.364640883%;
}
.threecol {
  width: 22.928176794%;
}
.fourcol {
  width: 31.491712705%;
}
.fivecol {
  width: 40.055248616%;
}
.sixcol {
  width: 48.618784527%;
}
.sevencol {
  width: 57.182320438000005%;
}
.eightcol {
  width: 65.74585634900001%;
}
.ninecol {
  width: 74.30939226%;
}
.tencol {
  width: 82.87292817100001%;
}
.elevencol {
  width: 91.436464082%;
}
.twelvecol {
  width: 99.999999993%;
}
.onecol,
.twocol,
.threecol,
.fourcol,
.fivecol,
.sixcol,
.sevencol,
.eightcol,
.ninecol,
.tencol,
.elevencol,
.twelvecol {
  position: relative;
  float: left;
  margin-right: 2.762430939%;
}
.twelvecol {
  margin-right: 0;
}
.last {
  float: right;
  margin-right: 0;
}
/******************************************************************

Stylesheet: Tablet & Small Desktop Stylesheet

******************************************************************/
/*********************
GENERAL STYLES
*********************/
/*********************
LAYOUT & GRID STYLES
*********************/
/*********************
HEADER SYTLES
*********************/
header #navShowHide {
  display: none;
}
header .mobile-utility {
  display: none !important;
}
header .mobile-drop-menu {
  display: block;
  float: right;
  position: absolute;
  left: auto;
  right: 0%;
  top: 0;
  width: 57.182320438000005%;
  background: transparent;
  box-shadow: none;
  height: 100%;
}
header #searchform {
  display: none;
  margin: 0;
  position: absolute;
  padding: 10px 0;
  right: 0px;
  width: 390px;
  z-index: 1000;
}
header #navWrap nav ul#primary {
  padding: 0;
  width: 100%;
}
header #navWrap nav ul#primary li a {
  font-size: 1em;
  padding: 11px 1%;
}
header #navWrap nav ul#primary li:first-child a {
  padding: 11px 1% 11px 0;
}
header #navWrap nav ul#primary li:last-child a {
  border-right: none;
  padding: 11px 0 11px 1%;
}
#searchform #searchsubmit {
  margin-right: 1%;
}
/*********************
NAVIGATION STYLES
*********************/
ul.sub-menu,
ul.children {
  margin-top: 0;
  border: 1px solid #ccc;
  border-top: 0;
  position: absolute;
  display: none;
  z-index: 8999;
  /* highlight sub-menu current page */
}
ul.sub-menu li a,
ul.children li a {
  padding-left: 10px;
  border-right: 0;
  display: block;
  width: 180px;
  border-bottom: 1px solid #ccc;
}
ul.sub-menu li:last-child a,
ul.children li:last-child a {
  border-bottom: 0;
}
/* showing sub-menus */
:hover ul {
  top: auto;
  display: block;
}
/* *** MEGA MENU *** */
#megaMenu {
  padding: 0;
}
#megaMenu .wpmega-link-title {
  font-size: 1.1em;
  font-weight: 600;
}
#megaMenu #megaMenu ul.megaMenu > li:hover > a,
#megaMenu #megaMenu ul.megaMenu > li:active > a {
  background: #ffffff;
  color: #ce9f2b;
}
#megaMenu ul.megaMenu > li.menu-item > a,
#megaMenu ul.megaMenu > li.menu-item > span.um-anchoremulator {
  border: none;
  padding: 7px 0px;
}
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg ul.sub-menu li.menu-item.megaReg-with-sub > a,
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg ul.sub-menu li.menu-item.megaReg-with-sub > span.um-anchoremulator,
#megaMenu ul.megaMenu li.menu-item.mega-with-sub > a,
#megaMenu ul.megaMenu li.menu-item.mega-with-sub > span.um-anchoremulator,
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega > a,
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega > span.um-anchoremulator {
  padding: 21px 13px;
}
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg ul.sub-menu li.menu-item.megaReg-with-sub > a:hover,
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg ul.sub-menu li.menu-item.megaReg-with-sub > span.um-anchoremulator:hover,
#megaMenu ul.megaMenu li.menu-item.mega-with-sub > a:hover,
#megaMenu ul.megaMenu li.menu-item.mega-with-sub > span.um-anchoremulator:hover,
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega > a:hover,
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega > span.um-anchoremulator:hover {
  background: #ffffff;
}
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg ul.sub-menu li.menu-item.megaReg-with-sub > a:hover span,
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg ul.sub-menu li.menu-item.megaReg-with-sub > span.um-anchoremulator:hover span,
#megaMenu ul.megaMenu li.menu-item.mega-with-sub > a:hover span,
#megaMenu ul.megaMenu li.menu-item.mega-with-sub > span.um-anchoremulator:hover span,
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega > a:hover span,
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega > span.um-anchoremulator:hover span {
  color: #ce9f2b;
}
#megaMenu ul.megaMenu > li > a span.wpmega-link-title,
#megaMenu ul.megaMenu > li > span.um-anchoremulator span.wpmega-link-title {
  text-shadow: none;
  color: #ffffff;
  font-size: 1.1em;
}
#megaMenu ul.megaMenu li.ss-nav-menu-reg ul.sub-menu {
  background: none;
  border: none;
  -webkit-box-shadow: 0 0 0 transparent;
  -moz-box-shadow: 0 0 0 transparent;
  box-shadow: 0 0 0 transparent;
  color: #58595b;
  /* display: none; */
  /* MIGHT BE TEMPORARY */
  text-shadow: 0 0 0 transparent;
}
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg li.menu-item.megaReg-with-sub > a:after,
#megaMenu ul.megaMenu li.menu-item.mega-with-sub > a:after,
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega > a:after,
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg li.menu-item.megaReg-with-sub > span.um-anchoremulator:after,
#megaMenu ul.megaMenu li.menu-item.mega-with-sub > span.um-anchoremulator:after,
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega > span.um-anchoremulator:after {
  content: "";
  display: none;
}
#megaMenu ul.megaMenu li.lastItem ul.sub-menu {
  /* left: -283px !important; */
  max-width: 701px !important;
}
#megaMenu ul.megaMenu li.ss-nav-menu-item-depth-0 ul.sub-menu.sub-menu-1 {
  background: transparent;
  border: none !important;
  box-shadow: none;
  display: none;
  /* MIGHT BE TEMPORARY */
  left: -156.5px;
  max-width: none !important;
  right: 0;
  min-width: 750px !important;
  position: absolute;
  white-space: inherit !important;
}
#megaMenu ul.megaMenu li.ss-nav-menu-item-depth-0 ul.sub-menu.sub-menu-1 li.ss-nav-menu-item-depth-1 {
  background: #ffffff;
  box-shadow: 3px 0px 8px 1px rgba(123, 124, 126, 0.75);
  -webkit-box-shadow: 3px 0px 8px 1px rgba(123, 124, 126, 0.75);
  -moz-box-shadow: 3px 0px 8px 1px rgba(123, 124, 126, 0.75);
  display: inline;
  margin-right: 0.762430939%;
  min-height: 300px;
  padding: 15px 10px;
  position: relative;
}
#megaMenu ul.megaMenu li.ss-nav-menu-item-depth-0 ul.sub-menu.sub-menu-1 li.ss-nav-menu-item-depth-1:last-child {
  margin-right: 0;
}
#megaMenu ul.megaMenu li.ss-nav-menu-item-depth-0 ul.sub-menu.sub-menu-1 li.menu-item {
  vertical-align: top;
}
#megaMenu .ss-colgroup-6 > .ss-col,
#megaMenu .wpmega-nonlink.ss-colgroup-6 li,
#megaMenu ul.megaMenu li.ss-nav-menu-mega.mega-colgroup-6 > ul > li {
  width: 12.364640883%;
}
/*********************
CONTENT STYLES
*********************/
#content {
  padding: 0 5%;
}
#contentHeaderWrap .departmentHeader h1 {
  padding: 2em .5em;
}
/*********************
SIDEBARS & ASIDES
*********************/
#sidebarBlog {
  display: block;
}
/*********************
CAROUSEL STYLES
*********************/
#main-slider .flex-direction-nav {
  margin-top: -4em;
}
#main-slider .flex-direction-nav .flex-prev,
#main-slider .flex-direction-nav .flex-next {
  font-size: 3.5em;
}
/*********************
FOOTER STYLES
*********************/
/******************************************************************

Stylesheet: Desktop Stylsheet

******************************************************************/
header #inner-header {
  padding: 5px 0 0;
}
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg ul.sub-menu li.menu-item.megaReg-with-sub > a,
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg ul.sub-menu li.menu-item.megaReg-with-sub > span.um-anchoremulator,
#megaMenu ul.megaMenu li.menu-item.mega-with-sub > a,
#megaMenu ul.megaMenu li.menu-item.mega-with-sub > span.um-anchoremulator,
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega > a,
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega > span.um-anchoremulator {
  padding: 27px 13px;
}
#megaMenu ul.megaMenu li.ss-nav-menu-item-depth-0 ul.sub-menu.sub-menu-1 {
  min-width: 925px !important;
}
#megaMenu ul.megaMenu li.lastItem ul.sub-menu {
  /* left: -421px !important; */
}
#megaMenu .ss-colgroup-6 > .ss-col,
#megaMenu .wpmega-nonlink.ss-colgroup-6 li,
#megaMenu ul.megaMenu li.ss-nav-menu-mega.mega-colgroup-6 > ul > li {
  width: 13.364640883%;
}
.no-touch #secondaryNavWrap .secondaryNav {
  padding: 0;
}
#secondaryNavWrap .secondaryNav {
  padding: 0;
}
#secondaryNavWrap .secondaryNav ul li a {
  font-size: 1em;
  font-weight: bold;
}
#secondaryNavWrap .secondaryNav > ul {
  margin-left: -10px;
}
#content {
  padding: 0;
}
#content.homeContent {
  padding: 0;
}
.footer {
  background-position: center top;
}
#inner-footer {
  padding: 30px 7% 150px 0;
}
#inner-footer .social {
  right: 0;
}
/******************************************************************
ADDITIONAL IE FIXES
These fixes are now ONLY seen by IE, so you don't have to worry
about using prefixes, although it's best practice. For more info
on using Modernizr classes, check out this link:
http://www.modernizr.com/docs/
******************************************************************/
/*
For example, you can use something like:

.no-textshadow .class { ... }

.lt-ie8 .class { ... }
*/
.lt-ie9 header #inner-header {
  background: url(../images/iebg-hdr.jpg) center center repeat-y transparent;
  background-size: contain;
  filter: none;
}
.lt-ie9 #main-slider li .slideDesc.black {
  background: rgba(0, 0, 0, 0.5);
}
.lt-ie9 #main-slider li .slideDesc.white {
  background: #ffffff;
}
