Navigation typography

​Navigation typography in Wide desktop

  • Menu bar: Corporate A, Regular, #ffffff, font-size: 16px line height 17 px
  • 1st level: Corporate S, Bold, #529900 font-size 20px line height 22 px Bottom margin 10 px
  • 2nd level: Corporate S, Bold, #529900 font-size: 16px line height 20 px Top margin 20 px Bottom margin 10 px
  • 3rd level: Corporate S, Regular, #529900 font-size: 14 line height 17 px Bottom margin 5 px
  • Link Hover: Color #f08c00, underline
 

Desktop

  • Menu bar: Corporate A, Regular, #ffffff, font-size: 16px line height 17 px
  • 1st level: Corporate S, Bold, #529900 font-size 18px line height 20 px Bottom margin 10 px
  • 2nd level: Corporate S, Bold, #529900 font-size: 15px line height 19 px Top margin 20 px Bottom margin 10 px
  • 3rd level: Corporate S, Regular, #529900 font-size: 13 line height 16 px Bottom margin 5 px
  • Link Hover: Color #f08c00, underline
 
Nav-styles-WD.png 

 

Navigation typography in Tablet

  • Menu bar: Corporate A, Regular, #ffffff, font-size: 14px line height 16 px
  • 1st level: Corporate S, Bold, #529900 font-size 18px line height 20 px Bottom margin 10 px
  • 2nd level: Corporate S, Bold, #529900 font-size: 15px line height 19 px Top margin 20 px Bottom margin 10 px
  • 3rd level: Corporate S, Regular, #529900 font-size: 13 line height 16 px Bottom margin 5 px
  • Link Hover: Color #f08c00, underline

 

Nav-styles-T.png 
 

 

 Navigation typography in Mobile

  • Navigation links:
    • Corporate S, Regular, 15 px, dark green #529900 Element height 44 px, including 1 px divider line
    • Toolbar links:
      Corporate S, Regular, 14 px, #B3B3B3
      Element height 44 px, including 1 px divider line
    • Link Hover: #f08c00, underline
 


Nav-styles-M.png

 

4/21/2016