﻿/*** CSS OUTPUT LOCALLY FROM SCSS AND MODIFIED FOR CODEPEN ***/

/*** There are a lot of things about Superfish that I don't love;
     in particualar, I don't love the mobile application. Further
     modification would be needed to make the mobile-nav a click-
     based setup even in a touch-free environment. Anyway, this is
     the fastest solution to style but not necessearily the best
     responsive pattern. Still, it's functional enough for the
     purposes that the question asker needed. ***/

.icon-home:before {
  content: '\e800'; }
.icon-menu:before {
  content: '\e801'; }

/*** Core Superfish Menu Styles ***/
.sf-menu {
  margin: 0;
  padding: 0;
  list-style: none; }
  .sf-menu * {
    margin: 0;
    padding: 0;
    list-style: none; }
  .sf-menu ul {
    position: absolute;
    top: -999em;
    width: 10em;
    /* left offset of submenus need to match (see below) */ }
    .sf-menu ul li {
      width: 100%; }
  .sf-menu li {
    float: right;
    position: relative; }
    .sf-menu li:hover {
      visibility: inherit;
      /* fixes IE7 'sticky bug' */ }
  .sf-menu a {
    display: block;
    position: relative; }
  .sf-menu li:hover ul, .sf-menu li.sfHover ul {
    right: 0;
    top: 3.5em;
    /* match top ul list item height */
    z-index: 99; }

ul.sf-menu li:hover li ul, ul.sf-menu li.sfHover li ul {
  top: -999em; }
ul.sf-menu li li:hover ul, ul.sf-menu li li.sfHover ul {
  left: 10em;
  /* match ul width */
  top: 0; }
ul.sf-menu li li:hover li ul, ul.sf-menu li li.sfHover li ul {
  top: -999em; }
ul.sf-menu li li li:hover ul, ul.sf-menu li li li.sfHover ul {
  left: 10em;
  /* match ul width */
  top: 0; }


/*** Theme Styles **/

.wrap {
  max-width: 1045px;
 }

header.global {
  /* Begin modifications to Superfish menu */ }
 
  header.global nav {
        background: #074f90;
    /** Bonus - here's how to do a double border ;) **/
    height: 40px; }
    header.global nav #SaymanMenu{
      display: none;
      cursor: pointer;
      text-align: center;
      line-height: 50px;
      color: #dddddd; }
      @media screen and (max-width: 768px) {
      	.wrap {display:none;}
        
         .TopMenuLGBack
         {
		display:none;} }
   
      header.global nav ul li {
        display: inline-block;
        color: #dddddd;
        line-height: 44px;
        border-right: 1px solid white;
        border-left: 1px solid white; }

        
        header.global nav ul li:first-child {
          border-left: none; }
        header.global nav ul li:last-child {
          border-right: none; }
        header.global nav ul li:hover {
          color: white;
          background-color:#052a4c; }
          
        header.global nav ul li ul {
          margin-top: -15px;
          background: #052a4c;
          border-top: 4px solid #053561;
          padding: 0; }
				
          header.global nav ul li ul li {
            border-top: 1px solid #474747;
            border-bottom: 1px solid white;
            border-right: none;
            border-left: none; }
            header.global nav ul li ul li:first-child {
              border-top: none; }
            header.global nav ul li ul li:last-child {
              border-bottom: none; }
            header.global nav ul li ul li a {
              padding: 10px 15px;
              line-height: 1em; }
            header.global nav ul li ul li:hover {
              padding-left: 5px;
              -webkit-transition-property: all;
              -moz-transition-property: all;
              -o-transition-property: all;
              transition-property: all;
              -webkit-transition-duration: 0.5s;
              -moz-transition-duration: 0.5s;
              -o-transition-duration: 0.5s;
              transition-duration: 0.5s;
              background-color:#074f90; }
             
        header.global nav ul li a {
          text-decoration: none;
          color: #dddddd;
          padding: 0 22px;
          line-height:40px;}
          header.global nav ul li a:hover {
            color: white; }
        header.global nav ul li.home {
        	height:40px;
          min-width: 46px;
          background: #074f90;
          border-right: none;
          text-align: center; 
           font-size: 18px;
    	padding-top: 11px;}
          header.global nav ul li.home span {
            display: none; }
        header.global nav ul li .sub-indicator, header.global nav ul li .top-menu ul li a .sub-indicator {
          left: 7px;
          top: 50%;
          margin-top: -2px;
          position: absolute;
          display: inline-block;
          content: '';
          width: 0;
          height: 0;
          border: 4px solid rgba(0, 0, 0, 0);
          border-top: 4px solid #dddddd; }
