body, nav, ul, li, a  {margin: 0; padding: 0;}

body {
font-family: Helvetica, Arial, sans-serif; 
/*background: #5e9a78;*/
      background: #E9E9FF;
}

a {
text-decoration: none;
}

a:hover {
text-decoration: underline;
color: red;
}

a:visited{
color: blue;
 }

#banner {
        background-color: #000; 
        color: #fff;
        height: 200px;
 }

header {
        background: #000;
 }
 
h1 {
   margin: 0;
   font-weight: bold; 
   font-size: 2em;
   padding: 10px;
 }
 
 h2 {
    margin: 0;
    font-weight: bold;
    font-size: 1em;
    padding: 5px;
}

.container {
    width: 90%;
    max-width: 900px;
    margin: 0 auto 10px auto;
    background: #fff;
    border: 2px solid #000;
}

article{
        color: #000;
        padding: 0 20px;
}

/*-- Navigation --*/
.toggleMenu {
    display:  none;
    background: #666;
    padding: 5px 15px;
    color: #fff;
    height: 30px;
    background-image: url("images/downArrow.png");
    background-repeat: no-repeat;
    background-position: right;
}
.nav {
    list-style: none;
     *zoom: 1;
     background:#666;
}
.nav:before,
.nav:after {
    content: " "; 
    display: table; 
}
.nav:after {
    clear: both;
}
.nav ul {
    list-style: none;
    width: 9em;
}
.nav a {
    padding: 10px 15px;
    color:#fff;
}
.nav li {
    position: relative;
}
.nav > li { /* main buttons*/
    float: left;
    /*border-top: 1px solid #104336;*/
}

.nav > li > .parent {
    background-image: url("images/downArrow.png");
    background-repeat: no-repeat;
    background-position: right;
}
.nav > li > a {
    display: block;
}

.nav > li.hover {
    background: red; /* hover colour of main nav bar*/
}


.nav li  ul {
    position: absolute;
    left: -9999px;
}
.nav > li.hover > ul {
    left: 0;    
}
.nav li li.hover ul {
    left: 100%;
    top: 0;
}
.nav li li a { /* First drop-down */
    display: block;
    background: #666;
    position: relative;
    z-index:100;
    border-top: 1px solid #175e4c;
}

.nav li li a:hover { 
        background: red; /* hover colour of first drop down*/
}

.nav li li li a { /* Second drop-down */
    background:#249578;
    z-index:200;
    border-top: 1px solid #1d7a62;    
}

.nav li li li a:hover {
    background: #44a58c; /* hover colour of second drop down*/    
}



/*-- /Navigation --*/




@media screen and (max-width: 768px) {
       h1 {
          margin: 0;
          font-weight: bold;
          font-size: 1em;
          padding: 5px;
       }
       
       h2 {
          margin: 0;
          font-weight: bold; 
          font-size: .75em;
          padding: 5px;
       }
   
      #navbar{
              width: 100%;
              height: 40px;
              /*background: #175e4c;*/
              background: #28582b;
              
     }
     
     /*-- Navigation --*/
    .active {
        display: block;
    }
    .nav > li {
        float: none;
    }
    .nav > li > .parent {
        background-position: 95% 50%;
    }
    .nav li li .parent {
        background-image: url("images/downArrow.png");
        background-repeat: no-repeat;
        background-position: 95% 50%;
    }
    .nav ul {
        display: block;
        width: 100%;
    }
   .nav > li.hover > ul , .nav li li.hover ul {
        position: static;
    }
    /*-- /Navigation --*/
    
#banner {
        background-color: #000; 
        color: #fff;
        height: 240px;
 }

}