/* GENERAL PURPOSE HORIZONTAL MENU BAR */
/***Colours***/
.horizontal-nav {
  margin: 0; }
  .horizontal-nav ul {
    margin: 0; }
  .horizontal-nav li {
    list-style-type: none;
    float: left;
    margin-right: 15px; }
  .horizontal-nav .invisible {
    width: 0;
    height: 0;
    padding: 0;
    margin: 0; }
    .horizontal-nav .invisible a {
      padding: 0;
      margin: 0; }

/* GENERAL PURPOSE VERTICAL MENU */
.vertical-nav {
  margin: 0; }
  .vertical-nav ul {
    margin: 0; }
  .vertical-nav li {
    list-style-type: none;
    padding: 4px 0;
    line-height: 1.3; }
    .vertical-nav li > a > i {
      margin: 2px 10px 4px 0;
      color: #333333;
      float: left; }
  .vertical-nav.line-separated li {
    border-bottom: 1px dashed #DDD;
    padding: 8px 0 7px 0; }
    .vertical-nav.line-separated li.first, .vertical-nav.line-separated li:first-child {
      padding-top: 0; }
    .vertical-nav.line-separated li a {
      font-weight: bold; }

.nav-text {
  display: block;
  margin-top: 5px;
  font-size: 90%;
  line-height: 17px;
  color: #777777; }

/* SECTION MENUS */
.section-menu-list h3 {
  margin: 0;
  padding: 0 0 10px 0;
  line-height: 1.2;
  font-size: 125%;
  border-bottom: 5px solid #CCCCCC; }

.section-menu-list > ul {
  margin: 0 0 30px 0;
  padding: 0;
  list-style-type: none; }
  .section-menu-list > ul > li {
    transition: background-color 200ms, color 200ms;
    -webkit-transition: background-color 200ms, color 200ms;
    -mos-transition: background-color 200ms, color 200ms;
    -o-transition: background-color 200ms, color 200ms;
    -ms-transition: background-color 200ms, color 200ms; }
    .section-menu-list > ul > li.last {
      border-bottom-color: #FFFFFF; }
    .section-menu-list > ul > li > a {
      display: block;
      padding: 10px 5px;
      font-size: 110%;
      font-weight: bold;
      text-decoration: none;
      border: none;
      color: #333333;
      transition: background-color 200ms, color 200ms;
      -webkit-transition: background-color 200ms, color 200ms;
      -mos-transition: background-color 200ms, color 200ms;
      -o-transition: background-color 200ms, color 200ms;
      -ms-transition: background-color 200ms, color 200ms; }
    .section-menu-list > ul > li.hover {
      background: #e6ce00; }
    .section-menu-list > ul > li i {
      margin-right: 10px;
      color: #333333; }
    .section-menu-list > ul > li .menu-item-wording {
      padding: 3px 0 3px 0;
      font-size: 90%;
      color: #777777; }

.section-menu-list .nav-text {
  margin: -3px 0 12px 33px; }

/* TOPIC NAVIGATION */
.topic-nav {
  margin-bottom: 20px;
  position: relative; }
  .topic-nav a, .topic-nav em {
    transition: background-color 200ms, color 200ms, border-color 200ms;
    -webkit-transition: background-color 200ms, color 200ms, border-color 200ms;
    -mos-transition: background-color 200ms, color 200ms, border-color 200ms;
    -o-transition: background-color 200ms, color 200ms, border-color 200ms;
    -ms-transition: background-color 200ms, color 200ms, border-color 200ms; }
  .topic-nav .topic-nav-header a {
    font-size: 110%;
    font-weight: bold; }
  .topic-nav .topic-nav-header i {
    float: left;
    font-size: 30px;
    margin-right: 10px;
    margin-top: 3px; }
/*  .topic-nav .topic-nav-header a.active {
    color: #FFFFFF; } */
  .topic-nav .topic-nav-header a:hover {
    background: #01527A;
    color: #FFFFFF;
    text-decoration: none;
    border-color: #01527A; }
  .topic-nav .topic-nav-header em {
    display: block;
    font-size: 80%;
    font-weight: normal;
    font-style: normal;
    color: #555555; }
  .topic-nav .topic-nav-header h2 {
    color: #333333;
    margin: 0; }
    @media (max-width: 767px) {
      .topic-nav .topic-nav-header h2 {
        color: #fff;
        padding: 20px; } }
  .topic-nav .topic-nav-header h4 {
    margin: 0 0 0 45px; }
    .topic-nav .topic-nav-header h4 span {
      display: block;
      font-weight: normal; }
  .topic-nav ul {
    margin: 0;
    padding: 5px 0;
    list-style-type: none;
    font-size: 90%; }
    .topic-nav ul li {
      padding: 0;
      margin: 0;
      border-bottom: 1px solid #FFFFFF; }
      .topic-nav ul li.last, .topic-nav ul li:last-child {
        border: none; }
      .topic-nav ul li a {
        display: block;
        padding: 3px 10px 3px 5px;
        font-weight: bold;
        border: none;
        color: #333333; }
        .topic-nav ul li a:hover {
          background: #e6ce00;
          color: #2a4c9f;
          text-decoration: none; }
      .topic-nav ul li.active a {
        background: #e6ce00;
        text-decoration: none; }
      .topic-nav ul li a:hover {
        background: #e6ce00; }

/* Various menus use a two column layout - use CSS3 columns where available */
.two-columns ul {
  -moz-column-count: 2;
  -webkit-column-count: 2;
  -o-column-count: 2;
  column-count: 2;
  -moz-column-gap: 20px;
  -webkit-column-gap: 20px;
  -o-column-gap: 20px;
  column-gap: 20px; }
  .two-columns ul li {
    display: inline-block;
    width: 100%; }

.no-csscolumns .two-columns li {
  width: 47%;
  display: block; }
  .no-csscolumns .two-columns li:nth-child(odd), .no-csscolumns .two-columns li.odd {
    float: left;
    clear: left; }
  .no-csscolumns .two-columns li:nth-child(even), .no-csscolumns .two-columns li.even {
    float: right; }

.two-columns > ul {
  zoom: 1;
  /* For IE 6/7 (trigger hasLayout) */ }
  .two-columns > ul:before {
    content: "";
    display: table; }
  .two-columns > ul:after {
    content: "";
    display: table;
    clear: both; }

/* PRIMARY MENU */
ul.primary-links {
  list-style-type: none;
  padding: 0;
  margin: 0;
  height: 45px;
  background: #00486f;
  border-radius: 30px 30px 0 0;
  display: flex;
  justify-content: space-between; }
  ul.primary-links > li {
    display: block;
    float: left;
    padding: 0;
    margin: 0 3px 0 0;
    position: relative;
    z-index: 1000;
    height: 45px; }
    ul.primary-links > li.menu-council-services {
      margin-right: 15px; }
    ul.primary-links > li > a {
      display: block;
      padding: 0 40px;
      text-decoration: none;
      line-height: 35px;
      height: 40px;
      -moz-text-shadow: #FFFFFF 1px 1px 0;
      -webkit-text-shadow: #FFFFFF 1px 1px 0;
      -o-text-shadow: #FFFFFF 1px 1px 0;
      -ms-text-shadow: #FFFFFF 1px 1px 0;
      text-shadow: #FFFFFF 1px 1px 0;
      background: #EEEEEE;
      font-weight: bold; }
    ul.primary-links > li > .primarylink-haschildren {
      font-weight: bold;
      text-transform: uppercase; }
    ul.primary-links > li.expandable > a, ul.primary-links > li.expandable > .primarylink-haschildren {
      padding: 0 10px 0 18px;
      overflow: hidden;
      font-size: 105%; }
    ul.primary-links > li > .primarylink-haschildren {
      display: block;
      margin: 0;
      text-decoration: none;
      line-height: 43px;
      height: 45px;
      background: none;
      border: none;
      color: #fff;
      font-weight: bold; }
    ul.primary-links > li > a > i.icon-, ul.primary-links > li > .primarylink-haschildren > i.icon-caret-down {
      font-size: 230%;
      position: relative;
      top: 6px; }
    ul.primary-links > li:hover > a, ul.primary-links > li.hover > a {
      color: #fff;
      -moz-text-shadow: #01527A 1px 1px 0;
      -webkit-text-shadow: #01527A 1px 1px 0;
      -o-text-shadow: #01527A 1px 1px 0;
      -ms-text-shadow: #01527A 1px 1px 0;
      text-shadow: #01527A 1px 1px 0; }
    ul.primary-links > li.active a {
      height: 40px !important;
      background: #FFF;
      color: #333333;
      text-transform: uppercase;
      padding-top: 5px; }
    ul.primary-links > li.active.hover a {
      color: #fff; }
    ul.primary-links > li.last.hover .primarylink-haschildren {
      border-radius: 0 30px 0 0; }
  ul.primary-links li .mega-menu {
    position: absolute;
    background: #00486f;
    color: #fff;
    left: -9999em;
    padding: 15px 18px 15px 18px;
    margin-left: 0;
    z-index: 500;
    border: 1px solid #01527A;
    border-width: 0 1px 1px 1px; }

.ie8 ul.primary-links li.shortcuts > .mega-menu {
  top: 40px; }

ul.primary-links li .mega-menu .icons-ul {
  padding-left: 20px; }
  ul.primary-links li .mega-menu .icons-ul i {
    color: #75C0E5; }

ul.primary-links li.first {
  border-radius: 30px 30px 0 0; }
  ul.primary-links li.first a {
    border-radius: 30px 30px 0 0; }

ul.primary-links li.menu-council-services .council-services {
  padding-bottom: 1px; }
  ul.primary-links li.menu-council-services .council-services li {
    margin-bottom: 13px;
    padding: 4px 0;
    line-height: 22px; }
  ul.primary-links li.menu-council-services .council-services i {
    font-size: 25px;
    margin-right: 13px;
    margin-bottom: 4px;
    float: left;
    position: relative;
    top: -1px;
    -moz-text-shadow: #01527A 1px 1px 0;
    -webkit-text-shadow: #01527A 1px 1px 0;
    -o-text-shadow: #01527A 1px 1px 0;
    -ms-text-shadow: #01527A 1px 1px 0;
    text-shadow: #01527A 1px 1px 0;
    color: #fff;
    text-decoration: none;
    display: inline-block;
    width: 1em;
    text-align: center; }

.no-js ul.primary-links > li.expandable:hover > a, ul.primary-links > li.expandable.hover > a {
  height: 40px; }

.no-js ul.primary-links > li:hover > a, ul.primary-links > li.hover > a {
  background: #0068A0; }

.no-js ul.primary-links > li.expandable:hover > span, ul.primary-links > li.expandable.hover > span {
  color: #fff;
  -moz-text-shadow: #01527A 1px 1px 0;
  -webkit-text-shadow: #01527A 1px 1px 0;
  -o-text-shadow: #01527A 1px 1px 0;
  -ms-text-shadow: #01527A 1px 1px 0;
  text-shadow: #01527A 1px 1px 0;
  background: #00486f; }

.no-js ul.primary-links > li:hover .mega-menu {
  left: 0 !important; }

ul.primary-links > li.hover .mega-menu {
  left: 0 !important; }

@media (min-width: 979px) {
  ul.primary-links > li.hover.last .mega-menu {
    right: -3px;
    left: auto !important; } }

@media (min-width: 979px) {
  ul.primary-links li.hover:nth-last-child(2) .mega-menu {
    right: -3px;
    left: auto !important; } }

ul.primary-links li .mega-menu ul {
  padding: 0;
  margin: 0; }

ul.primary-links li .mega-menu li {
  list-style-type: none;
  margin: 0 0 10px 0; }
  ul.primary-links li .mega-menu li.last {
    margin-bottom: 0; }
  ul.primary-links li .mega-menu li a {
    color: #fff; }

ul.primary-links li .mega-menu .popular {
  background: #0E7CB5;
  -moz-box-shadow: #01527A 0 0 3px;
  -webkit-box-shadow: #01527A 0 0 3px;
  -o-box-shadow: #01527A 0 0 3px;
  -ms-box-shadow: #01527A 0 0 3px;
  box-shadow: #01527A 0 0 3px; }
  ul.primary-links li .mega-menu .popular ul {
    margin: 0;
    padding: 0 10px 10px 30px; }

.primary-navigation {
  border-bottom: 5px solid #006498; }
  .primary-navigation .mega-menu .popular h5 {
    margin: 0 0 10px 0;
    padding: 0 10px 0 12px;
    line-height: 32px;
    -moz-text-shadow: #01527A 1px 1px 0;
    -webkit-text-shadow: #01527A 1px 1px 0;
    -o-text-shadow: #01527A 1px 1px 0;
    -ms-text-shadow: #01527A 1px 1px 0;
    text-shadow: #01527A 1px 1px 0;
    border-bottom: 1px solid #006498;
    font-size: 100%; }

ul.primary-links > li > .mega-menu .h4 {
    margin: 0 0 7px 0;
    line-height: 32px;
    /*    font-size: 110%;*/
    font-size: 116.65%;
    font-weight: 600;
    /*background: #0E7CB5;*/
    background: #0A5B82;
    padding: 0 10px;
    -moz-box-shadow: #01527A 0 0 3px;
    -webkit-box-shadow: #01527A 0 0 3px;
    -o-box-shadow: #01527A 0 0 3px;
    -ms-box-shadow: #01527A 0 0 3px;
    box-shadow: #01527A 0 0 3px;
    -moz-text-shadow: #01527A 1px 1px 0;
    -webkit-text-shadow: #01527A 1px 1px 0;
    -o-text-shadow: #01527A 1px 1px 0;
    -ms-text-shadow: #01527A 1px 1px 0;
    text-shadow: #01527A 1px 1px 0;
}

ul.primary-links > li.menu-i-want-to .mega-menu li {
  width: 47%; }
  ul.primary-links > li.menu-i-want-to .mega-menu li.odd, ul.primary-links > li.menu-i-want-to .mega-menu li:nth-child(odd) {
    float: left;
    clear: left; }
  ul.primary-links > li.menu-i-want-to .mega-menu li.even, ul.primary-links > li.menu-i-want-to .mega-menu li:nth-child(even) {
    float: right; }

/* Large desktop */
/* Tablets and larger */
@media (min-width: 768px) {
  /* GENERAL PURPOSE HORIZONTAL MENU BAR */
  .horizontal-nav li {
    float: left;
    margin: 0;
    border-right: 1px solid #CCCCCC;
    border-left: 1px solid #FFFFFF;
    line-height: 1; }
    .horizontal-nav li a, .horizontal-nav li .no-link {
      display: block;
      padding: 0 12px; }
    .horizontal-nav li.first a, .horizontal-nav li:first-child a {
      padding-left: 0; }
    .horizontal-nav li.first, .horizontal-nav li:first-child {
      border-left: none; }
    .horizontal-nav li.last, .horizontal-nav li:last-child {
      border-right: none; }
    .horizontal-nav li.last a, .horizontal-nav li:last-child a {
      padding-right: 0; }
    .horizontal-nav li i {
      margin-right: 8px;
      display: inline-block;
      text-decoration: none; }
  .horizontal-nav .nav-label {
    float: left;
    color: #fff;
    margin-right: 30px;
    margin-top: -3px;
    font-weight: bold; } }

/* Portrait tablet */
@media (min-width: 768px) and (max-width: 979px) {
  ul.primary-links > li.menu-i-am .mega-menu li {
    width: 47%; }
    ul.primary-links > li.menu-i-am .mega-menu li.odd, ul.primary-links > li.menu-i-am .mega-menu li:nth-child(odd) {
      float: left;
      clear: left; }
    ul.primary-links > li.menu-i-am .mega-menu li.even, ul.primary-links > li.menu-i-am .mega-menu li:nth-child(even) {
      float: right; } }

/* Phones */
@media (max-width: 767px) {
  .primary-navigation {
    display: none;
    position: fixed;
    top: 50px;
    left: -9999em;
    width: 100%;
    z-index: 500;
    background: #0E7CB5;
    border-bottom: 5px solid #01527A; }
    .primary-navigation .container {
      padding: 15px 20px 20px 20px; }
    .primary-navigation.expanded {
      left: 0;
      margin-top: 0; }
    .primary-navigation ul.primary-links {
      background: #0E7CB5; }
  ul.primary-links {
    list-style-type: none;
    margin: 0;
    padding: 0;
    color: #fff;
    transition: left 300ms;
    -webkit-transition: left 300ms;
    -mos-transition: left 300ms;
    -o-transition: left 300ms;
    -ms-transition: left 300ms;
    position: static;
    padding: 0;
    border: none;
    background: none; }
    ul.primary-links li .mega-menu {
      transition: left 300ms;
      -webkit-transition: left 300ms;
      -mos-transition: left 300ms;
      -o-transition: left 300ms;
      -ms-transition: left 300ms;
      position: static;
      padding: 0;
      border: none;
      background: none; }
    ul.primary-links > li {
      height: auto;
      margin: 0;
      clear: both;
      border-bottom: 1px dashed rgba(255, 255, 255, 0.3); }
      ul.primary-links > li.menu-council-services {
        margin: 0; }
      ul.primary-links > li > a, ul.primary-links > li > span {
        background: none;
        display: block;
        color: #fff;
        -moz-text-shadow: #01527A 1px 1px 0;
        -webkit-text-shadow: #01527A 1px 1px 0;
        -o-text-shadow: #01527A 1px 1px 0;
        -ms-text-shadow: #01527A 1px 1px 0;
        text-shadow: #01527A 1px 1px 0;
        border: none;
        height: auto; }
      ul.primary-links > li.active > a {
        background: none !important;
        border: none;
        height: auto !important; }
  .no-js ul.primary-links > li:hover > a {
    background: none !important;
    border: none;
    height: auto !important; }
  ul.primary-links > li {
    width: 50%;
    float: left;
    clear: none; }
    ul.primary-links > li.active > a, ul.primary-links > li.hover > a {
      background: none !important;
      border: none;
      height: auto !important; }
    ul.primary-links > li.leaf > a {
      padding: 0;
      font-weight: normal; }
    ul.primary-links > li > a i.icon-home, ul.primary-links > li > a i.icon-th {
      display: inline !important;
      margin-right: 5px; }
    ul.primary-links > li.expandable {
      padding: 10px 0;
      *zoom: 1; }
      ul.primary-links > li.expandable:before {
        display: table;
        line-height: 0;
        content: ""; }
      ul.primary-links > li.expandable:after {
        display: table;
        line-height: 0;
        content: "";
        clear: both; }
    ul.primary-links > li a {
      text-decoration: none; }
    ul.primary-links > li > a > i, ul.primary-links > li > span > i {
      display: none; }
    ul.primary-links > li > .mega-menu h4 {
      color: #fff;
      -moz-text-shadow: #01527A 1px 1px 0;
      -webkit-text-shadow: #01527A 1px 1px 0;
      -o-text-shadow: #01527A 1px 1px 0;
      -ms-text-shadow: #01527A 1px 1px 0;
      text-shadow: #01527A 1px 1px 0;
      margin: 0 0 5px 0;
      line-height: 20px;
      font-size: 100%;
      font-weight: normal; }
      ul.primary-links > li > .mega-menu h4 i {
        margin-right: 4px; }
    ul.primary-links > li.menu-council-services, ul.primary-links > li.menu-i-want-to {
      float: right; }
    ul.primary-links > li.menu-i-am {
      clear: left; }
    ul.primary-links > li.menu-home {
      padding: 0; }
    ul.primary-links > li.menu-council-services {
      padding: 0; }
      ul.primary-links > li.menu-council-services > a {
        width: 100%; }
      ul.primary-links > li.menu-council-services > .mega-menu {
        display: none; }
    ul.primary-links > li.menu-i-am, ul.primary-links > li.menu-i-want-to {
      padding-bottom: 0;
      width: 47%;
      border-bottom: none; }
    ul.primary-links > li.menu-i-am > span, ul.primary-links > li.menu-i-want-to > span {
      display: block;
      margin-bottom: 5px; }
    ul.primary-links > li.menu-do-it-online {
      padding: 0;
      background: none;
      border-bottom: none;
      width: 100%;
      clear: both;
      float: none; }
      ul.primary-links > li.menu-do-it-online .mega-menu {
        float: none;
        width: 100%; }
      ul.primary-links > li.menu-do-it-online > span {
        display: none; }
      ul.primary-links > li.menu-do-it-online > .mega-menu {
        padding: 0;
        background: none;
        border: none; }
        ul.primary-links > li.menu-do-it-online > .mega-menu div.span4 {
          width: 30%;
          margin-left: 5%;
          padding: 10px 0 0 0;
          float: left; }
          ul.primary-links > li.menu-do-it-online > .mega-menu div.span4:first-child {
            margin-left: 0; }
          ul.primary-links > li.menu-do-it-online > .mega-menu div.span4 h4 {
            box-shadow: none;
            -webkit-box-shadow: none;
            -moz-box-shadow: none;
            -ms-box-shadow: none;
            -o-box-shadow: none;
            padding: 0 0 2px 0; }
  ul.primary-links select.tinynav {
    margin: 0; }
  ul.primary-links > li.expandable > a, ul.primary-links > li.expandable > span {
    background: none !important;
    padding: 0;
    font-weight: normal; }
  ul.primary-links > li.menu-i-am > span, ul.primary-links > li.menu-i-want-to > span {
    line-height: 22px;
    font-weight: normal; }
  select.tinynav {
    width: 100%; }
  /* Hide these navs because the tinynav is being shown */
  ul.primary-links .mega-menu ul, .sitemap-columns ul {
    display: none; }
  /* Mobile topic nav */
  .topic-nav {
    background: #01527A;
    clear: both;
    margin: 0; }
    .topic-nav ul {
      border-bottom: none;
      padding: 40px 0;
      background: #00486f;
      border-bottom: 5px solid #01527A; }
      .topic-nav ul li {
        border-bottom: 1px solid #007CBB; }
        .topic-nav ul li a {
          padding: 10px 20px;
          color: #fff; }
  .topic-nav-toggle {
    position: absolute;
    top: 0;
    left: 10px;
    color: #FFFFFF !important;
    background: none;
    border: none;
    font-size: 200%;
    padding: 10px; }
    .topic-nav-toggle:hover {
      text-decoration: none; }
    .topic-nav-toggle:active, .topic-nav-toggle:visited {
      color: #fff; }
  .topic-nav .topic-nav-header em {
    color: #FFFFFF; }
  .topic-nav .topic-nav-header a {
    padding: 7px 60px 9px 20px;
    border: none;
    color: #FFFFFF; }
    .topic-nav .topic-nav-header a.active {
      padding: 7px 60px 9px 20px;
      border: none;
      color: #FFFFFF; }
    .topic-nav .topic-nav-header a:hover {
      text-decoration: none; }
  .topic-nav .topic-nav-header i {
    font-size: 25px; } }
