Bottom Navigation

.tabs-wrapper.w-100.bottom-nav
  %ul.nav.classic-tabs.blue-grey.darken-3.d-flex.justify-content-center{ role: :tablist }
    %li.nav-item.m-0
      %a.nav-link.waves-light.d-flex.flex-column.py-1.grey-text.active{ href: "#panel1",
        data: { toggle: :tab }, role: :tab }
        %i.material-icons.mb-1 textsms
        Proof View
    %li.nav-item
      %a.nav-link.waves-light.d-flex.flex-column.py-1.grey-text{ href: "#panel2",
        data: { toggle: :tab }, role: :tab }
        %i.material-icons.mb-1 list
        List View
    %li.nav-item
      %a.nav-link.waves-light.d-flex.flex-column.py-1.grey-text{ href: "#panel3",
        data: { toggle: :tab }, role: :tab }
        %i.material-icons.mb-1 attach_money
        Overages
    %li.nav-item
      %a.nav-link.waves-light.d-flex.flex-column.py-1.grey-text{ href: "#panel3",
        data: { toggle: :tab }, role: :tab }
        %i.material-icons.mb-1 payment
        Make Payment

.tab-content
  #panel1.tab-pane.fade.in.show.active
    %p
      Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nihil
      odit magnam minima, soluta doloribus reiciendis molestiae placeat
      unde eos molestias. Quisquam aperiam, pariatur. Tempora, placeat
      ratione porro voluptate odit minima.
  #panel2.tab-pane.fade
    %p
      Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nihil
      odit magnam minima, soluta doloribus reiciendis molestiae placeat
      unde eos molestias. Quisquam aperiam, pariatur. Tempora, placeat
      ratione porro voluptate odit minima.
    %p
      Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nihil
      odit magnam minima, soluta doloribus reiciendis molestiae placeat
      unde eos molestias. Quisquam aperiam, pariatur. Tempora, placeat
      ratione porro voluptate odit minima.
  #panel3.tab-pane.fade
    %p
      Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nihil
      odit magnam minima, soluta doloribus reiciendis molestiae placeat
      unde eos molestias. Quisquam aperiam, pariatur. Tempora, placeat
      ratione porro voluptate odit minima.
  #panel4.tab-pane.fade
    %p
      Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nihil
      odit magnam minima, soluta doloribus reiciendis molestiae placeat
      unde eos molestias. Quisquam aperiam, pariatur. Tempora, placeat
      ratione porro voluptate odit minima.