/*********************
NAVIGATION STYLES
*********************/

i.fa.fa-bars.fa-lg {
    color:#30892b;
    font-size:2.5em;
}

.topMenu {
  background: #FFFFFF;
  border-radius:5px;
  color:#585858;
  /*
  all navs have a .nav class applied; this is so we can
  easily write one group of styles for the navs on the site so our css is cleaner
  and more scalable.
  */
  /* end .nav */ }
  .topMenu a.toggleMenu {
    width: 100%;
    padding: 2%;
    text-transform: uppercase;
    margin-top: 0; }
    .topMenu a.toggleMenu span {
      display: block;
      width: auto;
      float: right; }
  .topMenu .nav {
    margin-top: 0;
    position: absolute;
    width: 96%;
    z-index: 8800;
      text-transform: uppercase;
    padding-bottom:0px;
    /* end .menu li */ }



    /* ul.nav :first-child :after { font-family:FontAwesome; content:"\f107"; } */

    .topMenu .nav li {
      position: relative;
      /* Sub-menu level 2 */
      /* end level 2	*/
      /* showing sub-menus */ }
      .topMenu .nav li a {
        display: inline-block;
        text-decoration: none;
        padding: 10px 20px;
        background: #FFFFFF;
        z-index:9999;
        color:#585858;
        font-size:16px; 
        font-weight:normal;
		/* removed 2016-02-23 */
        border-bottom: 1px solid #a6a6a6;
        /*
        remember this is for mobile ONLY, so there's no need
        to even declare hover styles here. We want to
        keep this file as small as possible!
        */ }

        .topMenu .nav li.hover > a.parent:before {
           /* removed 2016-02-23 */
			 content: "\f106"; 
        }
      .topMenu .nav li ul,
      .topMenu .nav li ul.sub-menu,
      .topMenu .nav li ul.children {
        margin-top: 0;
        /*border: 1px solid #ccc;*/
        border-top: 0;
        display: none;
        z-index: 8999; }
        .topMenu .nav li ul li,
        .topMenu .nav li ul.sub-menu li,
        .topMenu .nav li ul.children li {
          /* Sub-sub-menu level 3	*/
          /* end level 3	*/ }
          .topMenu .nav li ul li a,
          .topMenu .nav li ul.sub-menu li a,
          .topMenu .nav li ul.children li a {
            padding-left: 20px;
            text-transform: none;
            background-color:#f0f0f0;
            font-size:1em;
          }

          .topMenu .nav li ul li ul li,
          .topMenu .nav li ul.sub-menu li ul li,
          .topMenu .nav li ul.children li ul li {
            /* Sub-sub-menu level 4	*/
            /* end level 4	*/ }
            .topMenu .nav li ul li ul li a,
            .topMenu .nav li ul.sub-menu li ul li a,
            .topMenu .nav li ul.children li ul li a {
              /*padding-left: 30px;*/
              background-color:#f0f0f0;
            }
            .topMenu .nav li ul li ul li ul li a,
            .topMenu .nav li ul.sub-menu li ul li ul li a,
            .topMenu .nav li ul.children li ul li ul li a {
              /*padding-left: 40px;*/ }


/* end .topMenu */
.nav > li.hover > ul {
  left: 0;
  display: block; }

.nav li li.hover > ul {
  left: -220px;
  top: 0;
  display: block; }


@media only screen and (min-width: 481px) {
    /*********************
  NAVIGATION STYLES
  *********************/
    /* .menu is clearfixed inside mixins.scss */
    .menu {
        /* end .menu ul */
    }

        .menu ul {
            /* end .menu ul li */
            /* highlight current page */
            /* end current highlighters */
        }

            .menu ul li {
                /*
        plan your menus and drop-downs wisely.
        */
            }

                .menu ul li a {
                    /*
          you can use hover styles here even though this size
          has the possibility of being a mobile device.
          */
                }
}
  /* end .menu */


    @media only screen and (min-width: 1056px) {
        /*********************
  NAVIGATION STYLES
  *********************/
        .topMenu {
            /* end .nav */
        }

            .topMenu a.toggleMenu {
                display: none;
            }

            .topMenu .nav {
                position: relative;
                width: 100%;
                border: 0;
                /* -webkit-box-shadow: 0px 10px 23px -9px rgba(0,0,0,0.75);
        -moz-box-shadow: 0px 10px 23px -9px rgba(0,0,0,0.75);
        box-shadow: 0px 10px 23px -9px rgba(0,0,0,0.75); */
                float: right;
                /* padding-left:13%;
        padding-right:13%;*/
                /* end .menu ul li */
            }

                .topMenu .nav > li {
                    float: left;
                }

                .topMenu .nav li {
                    position: relative;
                    /* highlight current page */
                    /*
        plan your menus and drop-downs wisely.
        */
                    /* showing sub-menus */
                }

                    .topMenu .nav li a:hover, .topMenu .nav li a:focus {
                        background-color: #FFFFFF;
                        color: #000000;
                    }

                    /*.topMenu .nav li a.parent:before {
                        display: none;
                    }*/

                    .topMenu .nav li a.activerootmenulink {
                        background-color: #FFFFFF;
                        border-top: 1px solid #0061b2;
                        /* removed 2016-02-23 */
                        border-bottom: 3px solid #0061b2;
                        color: #585858;
                    }

                    .topMenu .nav li.hover a.parent:before {
                        display: none;
                    }

        .nonrootli a:hover {
            background-color: #eaeaea !important;
        }

        .topMenu .nav li ul,
        .topMenu .nav li ul.sub-menu,
        .topMenu .nav li ul.children {
            position: absolute;
            z-index: 99;
            left: -9999px;
        }

            .topMenu .nav li ul li,
            .topMenu .nav li ul.sub-menu li,
            .topMenu .nav li ul.children li {
                /*
            if you need to go deeper, go nuts
            just remember deeper menus suck
            for usability.
            */
            }

                .topMenu .nav li ul li a,
                .topMenu .nav li ul.sub-menu li a,
                .topMenu .nav li ul.children li a {
                    padding-left: 20px;
                    border-right: 0;
                    display: block;
                    width: 180px;
                    border-bottom: 1px solid #ccc;
                }

                .topMenu .nav li ul li:last-child a,
                .topMenu .nav li ul.sub-menu li:last-child a,
                .topMenu .nav li ul.children li:last-child a {
                    border-bottom: 0;
                }

        /* end .topMenu */
        .nav > li.hover > ul {
            left: 0;
        }

        .nav li li ul {
            left: -9999px;
            z-index: 99;
            position: absolute;
        }

        .nav li li.hover ul {
            left: -220px;
            top: 0;
            z-index: 99;
            position: absolute;
        }

        /* active state on home - not sure where else to put this for now*/
        body.Home .topMenu .nav li:first-child a {
            background-color: #226598;
            color: #585858;
        }
    }

 @media only screen and (min-width: 1050px) {
    .topMenu .nav li a {
        border-bottom: 0; 
    }

   
}

@media only screen and (max-width: 1056px) {
    .topMenu .nav > li > a:after {
        display: none;
    }
     .topMenu .nav li a.parent:before {
        /* removed 2016-02-23 */
	    content: "\f107";
        font-family: FontAwesome;
        display: block;
        float: right;
        font-size: large;
        padding-right: 0.5em;
        line-height: 1.2; 
    }
}