<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<header class="eaHeader animate">
<div class="section full-width">
<div class="content level0">
<div class="links align-left">
<a href="#" class="link current am-here">Home</a>
<a href="#" class="link">Business</a>
<a href="#" class="link">About us</a>
<a href="#" class="link">Blog</a></div>
<div class="links align-right">
<a href="#" class="link">My Account</a><a href="#" class="link">State<span class="icon-chevronDown no-underline"></span></a><a href="#" class="link search"><span class="icon-search"></span></a></div>
</div>
</div>
<div class="section search-wrapper full-width">
<div class="search-bar animate">
<input class="search-input" type="text" placeholder="Search" />
<button class="btn btn-quaternary"><span class="icon-ctaArrow"></span></button>
</div>
</div>
<div class="content level1">
<div class="eaLogo align-left "></div>
<div class="links align-right">
<a href="#" id="megaElecAndGas" class="link level1 current-page"><span>Electricity and gas </span><span class="icon-chevronDown"></span></a>
<a href="#" id="megaSolarAndBatteries" class="link level1">Solar and batteries <span class="icon-chevronDown"></span></a>
<a href="#" id="megaBillsAndAccounts" class="link level1">Bills and accounts <span class="icon-chevronDown"></span></a>
<a href="#" id="megaHelpAndSupport" class="link level1">Help and support <span class="icon-chevronDown"></span></a>
<a href="#" class="link level1">State<span class="icon-chevronDown"></span></a>
</div>
</div>
<div class="content level2">
<div class="megaMenu">
<div class="megaLinks megaElecAndGas ">
<div class="wrapper co_l compon_ent-8-cols-self"><h3 class="megaMenu-subheading">Looking for the best electricity or gas deal?</h3>
<div class="nav-three-column compon_ent-6-cols-self col1">
<a href="#" class="link level2 ">Compare electricity and gas plans<span class="icon-chevronRight"></span></a>
<a href="#" class="link level2 ">Understand electricity and gas plans<span class="icon-chevronRight"></span></a>
<a href="#" class="link level3 ">How to compare plans<span class="icon-chevronRight"></span></a>
<a href="#" class="link level3 current-page">What is off peak electricity?<span class="icon-chevronRight"></span></a>
<a href="#" class="link level3 ">When to switch<span class="icon-chevronRight"></span></a>
<a href="#" class="link level3 ">What is tariff?<span class="icon-chevronRight"></span></a>
</div>
<div class="nav-three-column compon_ent-6-cols-self col2">
<a href="#" class="link level2">Moving house<span class="icon-chevronRight"></span></a>
<a href="#" class="link level3 ">How to disconnect and reconnect<span class="icon-chevronRight"></span></a>
<a href="#" class="link level2 ">New meters and installations<span class="icon-chevronRight"></span></a>
<a href="#" class="link level2 ">Green energy plans<span class="icon-chevronRight"></span></a>
<a href="#" class="link level3 ">Green energy options<span class="icon-chevronRight"></span></a>
<a href="#" class="link level2 ">Energy saving and safety<span class="icon-chevronRight"></span></a>
</div>
</div>
<div class="nav-three-column three-column-width col3">
<div class="widget component-three-column component-with-image-and-text coloured-bkgd">
<div class="component-image component-image-variable-height"></div>
<div class="component-text-wrapper">
<h4 class="component-heading">Looking for cost savings, flexibility or want to avoid price rises?</h4>
<p class="component-blurb">Electricity and gas plans to meet your needs.</p>
<button class="btn btn-quaternary btn-bkgd-white">Pick a plan<span class="icon-ctaArrow"></span></button>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="content level2">
<div class="megaMenu">
<div class="megaLinks megaSolarAndBatteries ">
<div class="wrapper co_l compon_ent-8-cols-self">
<h3 class="megaMenu-subheading">Take control of your household electricity with solar</h3>
<div class="nav-three-column three-col_umn-width col1">
<a href="#" class="link level2 ">Solar power<span class="icon-chevronRight"></span></a>
<a href="#" class="link level3 ">Solar power systems<span class="icon-chevronRight"></span></a>
<a href="#" class="link level3 ">Solar power made easy<span class="icon-chevronRight"></span></a>
</div>
<div class="nav-three-column three-col_umn-width col2">
<a href="#" class="link level2 ">Battery storage<span class="icon-chevronRight"></span></a>
<a href="#" class="link level2 ">Finance options<span class="icon-chevronRight"></span></a>
<!-- <a href="#" class="link level2 ">NSW solar scheme<span class="icon-chevronRight"></span></a> -->
</div>
</div>
<div class="nav-three-column three-column-width col3">
<div class="widget centered-content component-three-column coloured-bkgd">
<div class="component-icon"><span class="icon-callback"></span></div>
<h4 class="component-heading">Request a callback</h4>
<p class="component-blurb">Leave your details and we’ll call you back at a time that’s convenient for you.</p>
<button class="btn btn-primary btn-bkgd-white">Have us call you<span class="icon-ctaArrow"></span></button>
</div>
</div>
</div>
</div>
</div>
<div class="content level2">
<div class="megaMenu">
<div class="megaLinks megaBillsAndAccounts ">
<div class="wrapper ">
<h3 class="megaMenu-subheading">Example meaningful subheading</h3>
<div class="nav-three-column three-col_umn-width col1">
<a href="#" class="link level2 ">Manage your accounts<span class="icon-chevronRight"></span></a>
<a href="#" class="link level2 ">Pay your bill<span class="icon-chevronRight"></span></a>
<a href="#" class="link level2 ">Understand your bill<span class="icon-chevronRight"></span></a>
<a href="#" class="link level2 ">Payment options<span class="icon-chevronRight"></span></a>
<a href="#" class="link level2 ">Request a payment extension<span class="icon-chevronRight"></span></a>
</div>
<div class="nav-three-column three-col_umn-width col2">
<a href="#" class="link level2 ">Go carbon neutral<span class="icon-chevronRight"></span></a>
<a href="#" class="link level2 ">Hardship policy<span class="icon-chevronRight"></span></a>
<a href="#" class="link level2 ">Switch to eBilling<span class="icon-chevronRight"></span></a>
<a href="#" class="link level2 ">Understand your meter<span class="icon-chevronRight"></span></a>
<a href="#" class="link level2 ">Concessions<span class="icon-chevronRight"></span></a>
</div>
</div>
<div class="nav-three-column three-column-width col3">
<div class="widget component-three-column component-with-image-and-text coloured-bkgd">
<div class="component-image component-image-variable-height"></div>
<div class="component-text-wrapper">
<h4 class="component-heading">100% carbon neutral electricity in your home, and it won’t cost you an extra cent.</h4>
<button class="btn btn-primary btn-bkgd-white">Change the future<span class="icon-ctaArrow"></span></button>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="content level2">
<div class="megaMenu">
<div class="megaLinks megaHelpAndSupport">
<div class="wrapper ">
<h3 class="megaMenu-subheading">Helpful meaningful subheading</h3>
<div class="nav-three-column three-col_umn-width col1">
<a href="#" class="link level2 not-a-link">Contact us</a>
<a href="#" class="link level3 ">Billing and enquiries<span class="icon-chevronRight"></span></a>
<a href="#" class="link level3 ">Electricity and gas plans<span class="icon-chevronRight"></span></a>
<a href="#" class="link level3 ">Faults and emergencies<span class="icon-chevronRight"></span></a>
<a href="#" class="link level3 ">Find an electricity distributor<span class="icon-chevronRight"></span></a>
<a href="#" class="link level3 ">Meter installations or upgrades<span class="icon-chevronRight"></span></a>
<a href="#" class="link level3 ">View all contacts<span class="icon-chevronRight"></span></a>
</div>
<div class="nav-three-column three-col_umn-width col2">
<a href="#" class="link level2 not-a-link">Frequently asked questions</span></a>
<a href="#" class="link level3 ">Accounts, bills and payments<span class="icon-chevronRight"></span></a>
<a href="#" class="link level3 ">My Account<span class="icon-chevronRight"></span></a>
<a href="#" class="link level3 ">Carbon neutral<span class="icon-chevronRight"></span></a>
<a href="#" class="link level3 ">Flexible pricing<span class="icon-chevronRight"></span></a>
<a href="#" class="link level3 ">Smart meters<span class="icon-chevronRight"></span></a>
<a href="#" class="link level3 ">View all FAQ categories<span class="icon-chevronRight"></span></a>
</div>
</div>
<div class="nav-three-column three-column-width col3">
<div class="widget centered-content component-three-column coloured-bkgd">
<div class="component-icon"><span class="icon-telephone"></span></div>
<h4 class="component-heading">Contact us regarding your existing account</h4>
<p class="component-blurb">Need help with your existing account?<br>
Our friendly team are here to help.</p>
<button class="btn btn-primary btn-bkgd-white">Contact us<span class="icon-ctaArrow"></span></button>
</div>
</div>
</div>
</div>
</div>
</header>
<!-- <div class="section-banner ">
<div class="section-banner-image group"></div>
<div class="section-banner-wrapper">
<div class="section-banner-content">
<h1>Generation & assets</h1>
<div class="blurb">EnergyAustralia owns and operates a portfolio of energy generation and storage facilities, including coal and gas assets.</div>
</div>
</div>
</div> -->
<!-- <section class="hero full-width">
<div class="content">
</div>
Hero
</section> -->
<section class="image full-width">
<div class="content">
</div>
Image
</section>
<nav class="quicklinks">
<div class="content">
<a href="#" class="link">
<span class="icon-GasElectricity"></span>Compare Plans
</a>
<a href="#" class="link">
<span class="icon-moving"></span>Move house
</a>
<a href="#" class="link">
<span class="icon-solar"></span>Solar and Batteries
</a>
<a href="#" class="link">
<span class="icon-avatar"></span>My Account
</a>
<a href="#" class="link">
<span class="icon-directDebit"></span>Pay a bill
</a>
<a href="#" class="link">
<span class="icon-question"></span>Help and support
</a>
</div>
</nav>
<section class="full-width-wrapper">
<div class="full-width-banner-image points-program-image"></div>
<div class="single-column-wrapper points-program-content">
<h2>Points partnership.</h2>
<a href="#" class="component-text-link secondary-link">Find out more<span class="icon-ctaArrow"></span></a>
</div>
</section>
<section class="three-column-wrapper">
<h2>Put the sun to work with a solar and battery system.</h2>
<div class="component-three-column three-column-width component-with-image">
<div class="component-image solar"></div>
<a href="#" class="component-text-link">Solar power<span class="icon-chevronRight"></span></a>
</div>
<div class="component-three-column three-column-width component-with-image">
<div class="component-image battery-storage"></div>
<a href="#" class="component-text-link">Battery and storage<span class="icon-chevronRight"></span></a>
</div>
<div class="component-three-column three-column-width component-with-image">
<div class="component-image payment-options"></div>
<a href="#" class="component-text-link">Payment options<span class="icon-chevronRight"></span></a>
</div>
</section>
[[[https://codepen.io/chrismoore/pen/gWwOQB]]]
/* Am linking to external css */
/* ea fonts */
/* http://codepen.io/chrismoore/pen/jyqrpL */
/* ea icons */
/* http://codepen.io/chrismoore/pen/XpdKwy */
/* section banners */
/* http://codepen.io/chrismoore/pen/RKqwWv */
/* components - three column */
/* http://codepen.io/chrismoore/pen/xgBOML */
/* points program */
/* http://codepen.io/chrismoore/pen/apxbaB */
/* Buttons and links */
/* http://codepen.io/chrismoore/pen/bqVNmB */
/* breakpoint overlay */
/* https://codepen.io/chrismoore/pen/QvjXdy */
/* grid overlay widget */
/* https://codepen.io/chrismoore/pen/gWwOQB */
/* common styles */
.animate {
-webkit-transition: all 350ms ease-in-out;
-moz-transition: all 350ms ease-in-out;
-ms-transition: all 350ms ease-in-out;
-o-transition: all 350ms ease-in-out;
transition: all 350ms ease-in-out;
transition: all 350ms ease-in-out;
}
body {
padding-top: 127px;
}
.full-width {
width: 100%;
}
.content {
/* max-width: 1200px; */
padding-left:10px;
padding-right:10px;
margin-left:auto;
margin-right:auto;
display:flex;
justify-content:center;
}
.content.level2 {
max-width: 100%;
padding:0;
background:rgba(242, 242, 242, 0.5);
/* darkest AAA grey */
background-color:#C2C2C2;
/* doubled the luminosity of e9eae8 */
background-color:#D1D1D1;
/* just freestyled */
background-color:#DBDBDB;
background: -moz-linear-gradient(top, rgba(219,219,219,1) 0%, rgba(233,234,232,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(219,219,219,1) 0%,rgba(233,234,232,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(219,219,219,1) 0%,rgba(233,234,232,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
/* flipping the order: dark at top, light at bottom */
background: -moz-linear-gradient(top, rgba(244,244,244,1) 0%, rgba(233,234,232,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(244,244,244,1) 0%,rgba(233,234,232,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(244,244,244,1) 0%,rgba(233,234,232,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
/* header */
.eaHeader {
width: 100%;
background: #fff;
border-top: 32px solid #d9d9d9; /* 85% luminosity */
position:absolute;
top:0;
box-shadow: -10px -15px 20px 10px rgba(0,0,0,0.15);
z-index:99;
}
.eaHeader:after {
/* content: "";
background: #e9eae8;
left: 0;
right: 0;
bottom: 0;
height: 2px;
position: absolute; */
}
.level0 {
margin-top: -32px;
}
.align-left {
/* flex-grow: 1; */
}
.align-right {
flex-grow: 1;
justify-content: flex-end;
}
.links {
display:flex;
align-items: stretch;
flex-grow: 1;
flex-basis: 0;
}
a {
font-size: 13px;
line-height: 1.4;
font-family: MSR700;
text-decoration: none;
color: #333;
}
.links a {
line-height:32px;
}
.links a:hover {
text-decoration: underline;
}
.links a:hover .no-underline {
text-decoration: none;
display:inline-block;
}
.links a.search:hover {
text-decoration:none;
color:#0d8924;
}
.links a:first-child {
margin-left: 0;
}
.links a.current-section {
font-family: MSR900;
position:relative;
}
.nav-three-column {
display: flex;
flex-direction: column;
align-items: stretch;
justify-content: flex-start;
box-sizing:border-box;
}
.nav-three-column a:first-child {
margin-top:20px;
}
.nav-three-column a:last-child {
border-bottom:0;
margin-bottom:40px;
}
.level0 {
max-width: 1200px;
}
.level0 .links a.current-section:after {
content:"";
width: 0px;
height: 0px;
border: 8px solid transparent;
border-left:6px solid #d9d9d9;
border-right:6px solid #d9d9d9;
border-top:0;
background-color: #fff;
position:absolute;
z-index: 1;
left:50%;
transform: translateX(-50%);
bottom:0px;
}
.level0 .link {
margin-left:30px;
color: #666;
}
.level0 .link.current-section {
/* margin-left:30px; */
color: #333;
}
.level0 .link.current-section:hover {
text-decoration: none;
}
.level0 .link.search {
padding: 0 10px;
margin-left:10px;
min-width: 35px;
text-align:center;
}
.level0 .links a.search.active:after {
background-color: #bfbfbf;
}
.level0 .links a.search.open > span:before {
content:"\e004";
font-size:12px;
}
.search-wrapper {
background:#bfbfbf;
width:100%;
}
.search-bar {
height:0px;
max-width: 1200px;
overflow:hidden;
margin: 0 auto;
display:flex;
justify-content: flex-end;
align-items: center;
position:relative;
}
.search-bar input {
height: 45px;
line-height:45px;
padding: 0 40px 0 20px;
border-radius: 2px;
border:none;
margin: 30px 0;
width:100%;
max-width: 47.91666%;
margin-right:1.041666%;
font-family:MSR500;
font-size:16px;
box-sizing: border-box;
}
.search-bar .btn {
margin-bottom:0;
position:absolute;
right:1.041666%;
top: 50%;
transform: translateY(-50%);
min-width:0;
padding:5px 10px;
}
.level1 {
height: 95px;
max-width:1200px;
/* background: #fff; */
/* max-width: 1200px; */
/* margin: 0 auto; */
position:relative;
}
.level1 .links a {
height: auto;
font-size: 18px;
line-height:1.2;
color: #666;
font-family: MSR700;
/* margin-left: 20px; */
padding:0 10px;
display: flex;
align-items: center;
text-align:center;
}
.level1 .links a:last-child {
display:none;
}
.level1 .links a:hover {
text-decoration: none;
position:relative;
color:#333;
}
.level1 .link [class^="icon-"], .level1 .link [class*=" icon-"] {
margin-top:-5px;
font-size:20px;
}
.level1 .links .active {
background-color: rgba(242, 242, 242, 0.5);
/* background-color: rgba(219, 219, 219, 0.85); */
background-color: #dbdbdb;
/* flipping the order: dark at top, lighter below */
background-color: #f4f4f4;
color:#333;
/* border-bottom:2px solid red; */
}
.level1 .links .active:after, .level1 .links a:hover:after {
/* content: "";
position:absolute;
left:0;
right:0;
bottom:0;
height:2px;
background-color:#0d8924;
z-index:1; */
}
a.link.level1 {
border-bottom:2px solid transparent;
}
a.link.level1.current-page {
border-color:green;
}
a.link.level1.active {
border-color:transparent;
color: green;
}
.eaLogo {
background-image: url(https://drive.google.com/uc?id=0B7VtXtcq_eQkRndOOG43Mjd1MDg);
background-repeat: no-repeat;
background-size: 100% auto;
background-position: 0px 50%;
width:100%;
max-width:280px;
margin-right:40px;
}
/* Hero */
.hero {
/* background-color:pink; */
line-height:600px;
text-align:center;
min-height: 600px;
}
/* Quicklinks */
.quicklinks {
background-color: #e9eae8;
}
.quicklinks .content {
max-width: 1200px;
align-items: center;
justify-content: space-around;
}
.quicklinks .link {
height: 120px;
flex-direction: column;
justify-content: center;
align-items: center;
display:flex;
text-decoration:none;
font-family:MSR900;
color:#333;
}
.quicklinks .link span {
color:#333;
}
.quicklinks span[class*="icon-"] {
font-size: 40px;
padding-bottom:13px;
}
/* mega menu */
.megaMenu {
display:flex;
flex-grow: 1;
max-width:1200px;
}
.megaMenu-subheading {
width:100%;
margin-left:1.53846%;
/* margin-left: calc(1.041666% + 10px); */
/* margin-top:40px; */
}
/* .megaMenu:before {
content: "";
border-top: 2px solid #e9eae8;
position: absolute;
left: 0;
right: 0;
top: 93px;
z-index: 0;
} */
.megaMenu .link {
/* padding-left:10px; */
padding-left: 3.2258%;
min-height: 35px;
display: flex;
align-items: center;
line-height: 1.2;
}
.megaMenu .link:not(.not-a-link):hover {
background: #0d8924;
color: #fff;
}
.megaMenu .link:hover span {
color: #fff;
}
.megaMenu .link.not-a-link:hover {
cursor:default;
}
.megaLinks {
height: 0;
/* max-width:0; */
overflow:hidden;
display: flex;
flex-grow: 1;
flex-wrap:wrap;
}
/* Mega menu links */
a.link.level2 {
font-family: 'MSR500';
font-size: 18px;
position: relative;
}
a.link.level2 + a.link.level2 {
margin-top: 15px;
}
a.link.level3 {
font-family: 'MSR300';
font-size: 16px;
margin-left: 20px;
}
a.link.level2 + a.link.level2 {
margin-top: 15px;
}
a.link.level3 + a.link.level2 {
margin-top: 15px;
}
a.level3.current-page {
font-family: MSR700;
color:green;
}
/* text links */
.link [class^="icon-"], .link [class*=" icon-"] {
color:#0d8924;
margin-top: -2px;
padding-left: 3px;
}
/* .level1 .links a span */
.link.search span {
color:#333;
font-size:16px;
padding-left:0;
}
/* alternative left border link style */
.megaMenu.left-border .link {
border-left: 2px solid #d9d9d9;
margin-left:0;
}
.megaMenu.left-border .link.current-page {
border-color:green;
}
/* widget */
.widget {
/* background-color:#f4f4f4; */
display:flex;
margin-top:0px;
margin-bottom:40px;
flex-grow:1;
justify-content:center;
align-items:center;
color:#ccc;
min-height:380px;
box-sizing:border-box;
}
.widget.centered-content {
text-align:center;
justify-content: center;
}
.widget .btn {
font-size:20px;
}
.widget .component-blurb + .btn-quaternary {
margin-top:-10px;
}
.widget .component-image {
background-image: url(https://www.energyaustralia.com.au/sites/default/files/styles/1x_col_feature_image/public/Mother%20and%20child%20planting%20tree.jpg?itok=xWIby4gc);
}
/* show/hide menu */
.megaLinks {
}
.reveal, .super-reveal {
/* min-height:440px; */
height:auto;
/* max-width:1200px; */
}
.megaLinks.reveal, .megaLinks.super-reveal {
padding-top:40px;
}
.image {
height:600px;
background-image: url(https://drive.google.com/uc?id=0B7VtXtcq_eQkeld3MGNFSmdKYWc);
background-size:cover;
background-position: 50%;
}
.megaLinks .nav-three-column .link {
opacity: 0;
}
.megaLinks.reveal .nav-three-column .link, .megaLinks.super-reveal .nav-three-column .link {
opacity: 1;
}
.megaLinks > .wrapper {
display: flex;
box-sizing: border-box;
justify-content: space-between;
align-content: flex-start;
flex-wrap: wrap;
width:67.708333%;
}
.megaLinks > .wrapper .col1 {
width: 50.7692%;
padding-right:3.0769%;
}
.megaLinks > .wrapper .col2 {
width: 49.2307%;
padding-right:3.0769%;
}
/* sticky */
@keyframes slideIn {
0% {
top: -127px;
}
100% {
top: -32px;
}
}
@keyframes slideBack {
0% {
top: -65px;
position:fixed;
}
50% {
top: -127px;
}
51%{
position:absolute;
}
}
@keyframes slideBackLogo {
0% {
width: 50px;
background-size: auto 65%;
}
50% {
width: 50px;
background-size: auto 65%;
}
100% {
width:100%;
}
}
@keyframes slideBackLevel1 {
0% {
height: 65px;
}
50% {
height: 65px;
}
51% {
height:95px;
}
}
.eaHeader.sticky {
top:-127px;
}
.eaHeader.fixed {
animation: slideIn 300ms;
position:fixed;
max-height:0;
overflow:hidden;
top:-32px;
max-height:900px;
}
.eaHeader.slideBack {
animation: slideBack 600ms;
}
.eaHeader.fixed .level1 {
height:65px;
}
.eaHeader.slideBack .level1 {
animation: slideBackLevel1 600ms;
}
.eaHeader.fixed .eaLogo {
width: 50px;
background-size: auto 65%;
}
.eaHeader.slideBack .eaLogo {
animation: slideBackLogo 600ms;
}
.eaHeader.fixed .megaMenu:before {
top:65px;
}
.eaHeader.fixed .level1 .link:last-child {
padding-left:15px;
position:relative;
display:flex;
}
.eaHeader.fixed .level1 .link:last-child:before {
content:"";
position:absolute;
left:0;
top:15px;
bottom:15px;
width:1px;
background:#e9eae8;
}
.megaSolarAndBatteries {
/* display:none; */
}
$(document).ready(function() {
var menuToShow;
var level0Hover = false;
var level1Hover = false;
var navOffset = 127;
$(".level0 .link").on('click', function() {
$(".level0 .current-page").removeClass("current-page");
$(this).addClass("current-page");
});
$(".level0 .link.search").on('click', function() {
$(".search-bar").toggleClass("reveal");
$(".search").toggleClass("open");
$( ".search-input" ).focus();
});
$(".level1 .link").mouseenter(function() {
level0Hover = true;
menuToShow = $(this).attr('id');
if (!$(this).hasClass("active")) {
$(" .reveal").removeClass("reveal");
$("." + menuToShow).addClass("reveal");
}
$(".level1 .active").removeClass("active");
$(this).addClass("active");
});
$( ".level1 .link" ).click(function() {
$(".level1 .current-page").removeClass("current-page");
$(this).addClass("current-page");
});
$( ".level1 .link" ).dblclick(function() {
menuToShow = $(this).attr('id');
$(this).toggleClass("super-reveal");
$("." + menuToShow).toggleClass("super-reveal");
});
$(".megaLinks").mouseenter(function() {
level1Hover = true;
});
$(".level1 .link").mouseleave(function() {
level0Hover = false;
setTimeout(function() {
if (level0Hover == false && level1Hover == false) {
$(".reveal").removeClass("reveal");
$(".level1 .active").removeClass("active");
}
}, 100);
});
$(".megaLinks").mouseleave(function() {
level1Hover = false;
setTimeout(function() {
if (level0Hover == false) {
$(".reveal").removeClass("reveal");
$(".level1 .active").removeClass("active");
}
}, 50);
});
$('.grid-overlay').on('click', function() {
$('.grid-overlay').toggleClass('hidden');
return false;
});
$(window).scroll(function() {
var sticky = $('.eaHeader'),
scroll = $(window).scrollTop();
if (scroll >= navOffset) sticky.addClass(' fixed').removeClass('slideBack');
if (scroll <= navOffset) $(".fixed").removeClass(' fixed').addClass('slideBack');
});
// $(document).keypress(function(e) {
// });
$(document).keydown(function(e) {
if(e.which == 13) {
// alert('You pressed enter!');
$('.grid-overlay').toggleClass('hidden');
}
if(e.which == 71) {
// alert('You pressed g!');
$('.megaMenu').toggleClass('left-border');
}
});
});
