/* TradeXX mobile menu visibility hard-fix v10.7.55
 * Makes the mobile hamburger bars clearly visible in bold black and
 * keeps the opened mobile navigation links readable.
 */

@media (max-width:980px){
  body.landing-page .landing-menu-button{
    display:grid!important;
    place-items:center!important;
    position:relative!important;
    flex:0 0 40px!important;
    width:40px!important;
    min-width:40px!important;
    height:40px!important;
    padding:0!important;
    margin:0!important;
    border:1px solid #d9d9df!important;
    border-radius:10px!important;
    background:#ffffff!important;
    color:#111111!important;
    opacity:1!important;
    visibility:visible!important;
    filter:none!important;
    transform:none!important;
    box-shadow:none!important;
    font-size:0!important;
    line-height:1!important;
    cursor:pointer!important;
    z-index:95!important;
    overflow:hidden!important;
  }

  /* Draw the hamburger ourselves so it does not depend on the button's glyph/font. */
  body.landing-page .landing-menu-button::before{
    content:""!important;
    display:block!important;
    width:21px!important;
    height:15px!important;
    border-radius:1px!important;
    background:
      linear-gradient(#111111,#111111) 0 0 / 21px 3px no-repeat,
      linear-gradient(#111111,#111111) 0 6px / 21px 3px no-repeat,
      linear-gradient(#111111,#111111) 0 12px / 21px 3px no-repeat!important;
    opacity:1!important;
    visibility:visible!important;
    filter:none!important;
    transform:none!important;
  }

  body.landing-page .landing-menu-button::after{
    content:none!important;
  }

  body.landing-page .landing-menu-button:hover,
  body.landing-page .landing-menu-button:focus,
  body.landing-page .landing-menu-button:focus-visible{
    background:#f7f4ff!important;
    border-color:#bca8ea!important;
    outline:0!important;
    box-shadow:0 0 0 3px rgba(109,40,217,.10)!important;
  }

  body.landing-page .landing-nav{
    z-index:94!important;
    background:#ffffff!important;
    border:1px solid #e2e2e8!important;
    box-shadow:0 18px 40px rgba(17,17,17,.12)!important;
  }

  body.landing-page .landing-nav.open{
    display:flex!important;
    opacity:1!important;
    visibility:visible!important;
  }

  body.landing-page .landing-nav a{
    display:flex!important;
    align-items:center!important;
    min-height:44px!important;
    padding:11px 12px!important;
    color:#111111!important;
    font-size:14px!important;
    font-weight:850!important;
    line-height:1.25!important;
    opacity:1!important;
    visibility:visible!important;
    text-shadow:none!important;
    border-bottom:1px solid #eeeeF2!important;
  }

  body.landing-page .landing-nav a:hover,
  body.landing-page .landing-nav a:focus{
    color:#5b21b6!important;
    background:#f8f5ff!important;
  }
}

@media (max-width:680px){
  body.landing-page .landing-menu-button{
    flex-basis:38px!important;
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    border-radius:9px!important;
  }

  body.landing-page .landing-menu-button::before{
    width:20px!important;
    height:14px!important;
    background:
      linear-gradient(#111111,#111111) 0 0 / 20px 3px no-repeat,
      linear-gradient(#111111,#111111) 0 5.5px / 20px 3px no-repeat,
      linear-gradient(#111111,#111111) 0 11px / 20px 3px no-repeat!important;
  }

  body.landing-page .landing-nav{
    left:10px!important;
    right:10px!important;
    top:63px!important;
  }

  body.landing-page .landing-nav a{
    font-size:13px!important;
    font-weight:900!important;
  }
}