/**
 * @file
 * Visual styles for menu.
 */

/* menu dropdown */

  .header .mega-menu {
    display: flex;
    background: #ffffff;
    border: 0;
    border-bottom: 1px solid #ddd;
    opacity: 0;
    position: absolute;
    transition: all .3s ease .15s;
    visibility: hidden;
    width: calc(100%);
    margin-top: 1em;
    left: calc(-50vw );
    padding-left: calc(50vw);
    padding-right: calc(50vw - 50% - 9px);
    z-index: 100;
}
  
  .header li:hover > .mega-menu, .header li:focus-within > .mega-menu  {
    opacity: 1;
    overflow: visible;
    visibility: visible;
  }
  
  .header li:hover > .mega-menu .level2, .header li:focus-within > .mega-menu .level2 {
    display: none;
  }
  
  .header .mega-menu li {
    list-style: none;
  }
  
  
  .header .mega-menu a {
    padding:0.9em 0 0.9em 0;
  }
  .header .mega-menu > li:last-child {
    text-align: left;
    padding-right: 0;
  }
  
  .header .mega-menu ul {
    padding: 0;
    margin:0;
  }
  
  .header .nav__wrapper > li:last-child {
    text-align: left;
  }
  
  .downline {
    border-right: 1px solid #003366;
  }
  
  /* menu content */
  .header .nav-column {
    float: left;
    padding: 0;
    margin: 0;
    width: calc(100%/3);
    padding-left: 1.25em;
  }
  
  .header .nav-column:nth-child(2) {
    margin-right:1em;
    margin-bottom:2em;
  }
  
  .header .nav-column a {
    color: #003366;
    display: block;
    font-weight: 400;
    line-height: 1em;
    text-transform: initial;
    font-size: 1.1rem;
  }
  
  .header .nav-column a:hover {
    color: #003366;
  }
  
  .highlight {
    color: #003366;
  }
  
  .header .nav-column img {
    float:right;
    width: 100%;
  }


  @media (max-width: 989px) {

    .sidemenu {
        visibility: hidden;
        display: none;
    }

    .header .nav-column {

       width: 100% !important;
        
    }

    .header .nav__wrapper > li {
        padding-right: 0 !important;
    }

    .header .nav__wrapper {
        position: absolute;
        top: 2em;
        display: none;
        overflow: hidden;
        width: 100%;
    }

    .header .mega-menu {
        display: flex;
        background: #ffffff;
        border: 0;
        border-bottom: 0;
        opacity: 0;
        position: relative;
        transition: all .3s ease .15s;
        visibility: hidden;
        width: calc(100%);
        margin-top: 0;
        left: 0;
        padding-left: 0;
        z-index: 100;
    }

    .header .mega-menu .level1 {
        border-bottom: 1px solid #ddd;  
    }
      
      .header li > .mega-menu, .header li > .mega-menu  {
        opacity: 1;
        overflow: visible;
        visibility: visible;
      }
      
      .header li > .mega-menu .level2, .header li > .mega-menu .level2 {
        display:flex;
      }

   
      .header .nav-column:nth-child(3),
      .header .nav-column:nth-child(2),
      .header .nav-column .downline {
        visibility: hidden;
        display: none;
    }

    .header .nav-column{
        display: flex;
        visibility: visible;
    float: left;
    padding: 0;
    margin: 0;
    width: calc(100%/3);
    padding-left: 1.25em;
    }

    .header li:hover > .mega-menu .level2, .header li:focus-within > .mega-menu .level2 {
        display: flex;
        visibility: visible;
      }


      .footer-teaser {
        display: flex;
        /* grid-auto-flow: column; */
        grid-auto-columns: 1fr 2fr;
        /* width: 1200px; */
        padding: 0 1em 0 1em;
        /* margin: 0 auto; */
        gap: 2.5em;
    }

    .front-layout-container .main {
         padding: 0 1em 0 1em;
    }
  }