/* -------------------------------------------------- 
IE hacks
-------------------------------------------------- */

/* The main issue with Foundation 5 is the use of REM units instead of EM.  These are not picked
up by IE 6,7,8.  There is a polyfill that can be used:

https://github.com/chuckcarpenter/REM-unit-polyfill

Unfortunately at the time of this writing the polyfill has issues when it encounters the !important
tag.  Any tag that has this applied then does not have the REM units converted.
So, idea is to try to have a number of ie fixes that can be used in basically any project that uses
Foundation 5.  basically the site in these early ie browsers defaults to mobile view (since no media queries
and avoided using reponse.js or similar).

/* -------- START GENERIC FIXES FOR FOUNDATION 5 -------- */

/* Hide images that should only be for IE6.  Could also use the AlphaImageLoader */
.ie-only {
	display:none;
}
.ie-6-only {
	display:none;
}

.lt-ie9 .ie-only {
	display:block;
}
.lt-ie9 .ie-hide {
	display:none!important;
}

.lt-ie9 .ie-6-only {
  display:none;
}
.lt-ie9 .ie-7-8-only {
  display:block;
}

.lt-ie7 .ie-6-only {
  display:block;
}
.lt-ie7 .ie-7-8-only {
  display:none;
}
.lt-ie9 #js-toggle-nav {
  display:none;
}
.lt-ie9 .no-border {
  padding:0 !important;
}

/* -------------------------------------------------- 
Fix overall Width
-------------------------------------------------- */

.lt-ie9 .row {
	width:650px;
}
.lt-ie9 .columns {
	width:650px;
}

/* -------------------------------------------------- 
Typography
-------------------------------------------------- */

.lt-ie9 h1 {
  font-size:2.5em;
  margin-bottom:1em;
}
.lt-ie9 h2 {
  font-size:1.8em;
  margin-bottom:0.75em;
}
.lt-ie9 h3 {
  font-size:1.5em;
  margin-bottom:0.5em;
}
.lt-ie9 h4 {
  font-size:1.3em;
  margin-bottom:0.5em;
}
.lt-ie9 h5 {
  font-size:1.1em;
  margin-bottom:0.5em;
}
.lt-ie9 h6 {
  font-size:1em;
  margin-bottom:0.5em;
}
.lt-ie9 p {
  margin-bottom:1em;
}

/* -------------------------------------------------- 
Block Grid
-------------------------------------------------- */

.lt-ie9 ul.small-block-grid-2,
.lt-ie9 ul.small-block-grid-3,
.lt-ie9 ul.small-block-grid-4,
.lt-ie9 ul.medium-block-grid-2,
.lt-ie9 ul.medium-block-grid-3,
.lt-ie9 ul.medium-block-grid-4,
.lt-ie9 ul.large-block-grid-2,
.lt-ie9 ul.large-block-grid-3,
.lt-ie9 ul.large-block-grid-4 {
  margin-left:0;
}

.lt-ie9 ul.small-block-grid-2 li,
.lt-ie9 ul.small-block-grid-3 li,
.lt-ie9 ul.small-block-grid-4 li,
.lt-ie9 ul.medium-block-grid-2 li,
.lt-ie9 ul.medium-block-grid-3 li,
.lt-ie9 ul.medium-block-grid-4 li,
.lt-ie9 ul.large-block-grid-2 li,
.lt-ie9 ul.large-block-grid-3 li,
.lt-ie9 ul.large-block-grid-4 li{
  width:45%;
  padding-bottom: 10px;
}

.lt-ie9 ul.small-block-grid-2 li .panel,
.lt-ie9 ul.small-block-grid-3 li .panel,
.lt-ie9 ul.small-block-grid-4 li .panel,
.lt-ie9 ul.medium-block-grid-2 li .panel,
.lt-ie9 ul.medium-block-grid-3 li .panel,
.lt-ie9 ul.medium-block-grid-4 li .panel,
.lt-ie9 ul.large-block-grid-2 li .panel,
.lt-ie9 ul.large-block-grid-3 li .panel
.lt-ie9 ul.large-block-grid-4 li .panel {
  margin-right:2%;
}

/* -------------------------------------------------- 
Embedding
-------------------------------------------------- */

.lt-ie9 .flex-video {
  width:650px;
  height:400px;
  padding:0;
  margin-bottom:1em;
}

/* -------------------------------------------------- 
Panels
-------------------------------------------------- */

.lt-ie9 .panel {
  padding:4%;
  margin-bottom:2em;
}

/* -------------------------------------------------- 
Images
-------------------------------------------------- */

.lt-ie9 p img {
  margin-bottom:1em;
}

/* -------------------------------------------------- 
Overflow (particulary images)
-------------------------------------------------- */

.lt-ie9 div {
	overflow:hidden;
}

/* -------------------------------------------------- 
Button styles
-------------------------------------------------- */

.lt-ie9 button,
.lt-ie9 .button {
  background-image:none;
}

.lt-ie9 button,
.lt-ie9 a.button,
.lt-ie9 p a.button {
  font-size:1.2em;
  padding: 0.5em;
  text-align:center;
  width:auto;
  margin-top:0.4em;
  color:#fff;
}

.lt-ie9 a {
  color: #006dac;
}

/* -------- / END GENERIC FIXES FOR FOUNDATION 5 -------- */

/* -------------------------------------------------- 
Upgrade Browser Rant
-------------------------------------------------- */

.lt-ie9 .my-ie-rant {
	text-align: center;
	background: #111;
}
.lt-ie9 .my-ie-rant p{
	margin:0;
	padding:0.4em 0;
  color: #fff;
}
.lt-ie9 .my-ie-rant a{
  color: #fff;
  text-decoration: underline;
}

/* -------------------------------------------------- 
Header
-------------------------------------------------- */

.lt-ie9 .my-header-wrapper {
  background: url("/img/misc/header-bgd-150.png?095096bef1f9bd079498c5ee94c3d6b8703b1f58") center center repeat-x;
  padding: 0;
  background: #0063b1;
}

/* -------------------------------------------------- 
Main Content
-------------------------------------------------- */

.lt-ie9 .main-content {
  background: #fff;
}

/* -------------------------------------------------- 
Navigation
-------------------------------------------------- */

.lt-ie9 .my-navigation-wrapper {
	display: block;
}
.lt-ie9 .my-navigation-wrapper ul {
	margin-left:0 !important;
}
.lt-ie9 .my-navigation-wrapper li {
  float:left;
	list-style-type:none;
	border-bottom:solid 1px #666;
}
.lt-ie9 .my-navigation-wrapper li a {
	line-height: 2em;
  font-size: 1.3em;
	color: #fff;
  padding: 0.5em 15px;
}
.lt-ie9 .breadcrumbs li {
	padding-right: 10px;
}

/* -------------------------------------------------- 
Sidebar
-------------------------------------------------- */

.lt-ie9 .sidebar {
  background-color: #fff;
  margin-top: 30px;
  padding: 30px 0;
  border-top: solid 1px #ccc;
}

/* -------------------------------------------------- 
Search
-------------------------------------------------- */

.lt-ie9 #search {
	display: none;
}

/* -------------------------------------------------- 
Forms
-------------------------------------------------- */

.lt-ie9 input{
  margin: 0 0 0.4em 0;
  padding: 0.5em;
  height: auto;
  color: #333;
}

/* -------------------------------------------------- 
Footer
-------------------------------------------------- */

.lt-ie9 .my-footer-wrapper {
	padding-top: 2em;
}
.lt-ie9 .my-footer-wrapper li {
	width: 100%;
}