.zn-tabs-nav { list-style: none; margin: 0; padding: 0; display: -webkit-box; display: -ms-flexbox; display: flex; margin-bottom: -2px; position: relative; z-index: 1; }

.zn-tabs--alg-left .zn-tabs-nav { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }

.zn-tabs--alg-center .zn-tabs-nav { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

.zn-tabs--alg-right .zn-tabs-nav { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }

.zn-tabs--alg-justify .zn-tabs-nav { -ms-flex-pack: distribute; justify-content: space-around; text-align: center; }

.zn-tabs--alg-justify .zn-tabs-nav .zn-tabs-navItem { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; }

@media (max-width: 767px) { .zn-tabs-nav { white-space: nowrap; overflow: hidden; overflow-x: auto; display: block; }
  .zn-tabs-nav .zn-tabs-navItem { display: inline-block; border: 0; float: none; }
  .zn-tabs-nav .zn-tabs-navItem a { padding-top: 12px; padding-bottom: 12px; }
  .zn-tabs-nav .zn-tabs-nav::-webkit-scrollbar { -webkit-appearance: none; appearance: none; }
  .zn-tabs-nav .zn-tabs-nav::-webkit-scrollbar:vertical { width: 11px; }
  .zn-tabs-nav .zn-tabs-nav::-webkit-scrollbar:horizontal { height: 11px; }
  .zn-tabs-nav .zn-tabs-nav::-webkit-scrollbar-thumb { border-radius: 8px; border: 2px solid white; background-color: rgba(0, 0, 0, 0.3); }
  .zn-tabs-nav .zn-tabs-nav::-webkit-scrollbar-track { background-color: #fff; border-radius: 8px; } }

.zn-tabs-navItem { margin-left: 2px; margin-right: 2px; }

.zn-tabs-navItem:first-child { margin-left: 0; }

.zn-tabs-navItem:last-child { margin-right: 0; }

.zn-tabs-navItem > a { display: block; border: 1px solid #e6e5e5; background-color: #f7f7f7; color: rgba(0, 0, 0, 0.5); padding: 15px 30px; line-height: 1.4; -webkit-transition: all .2s ease-out; transition: all .2s ease-out; text-align: center; }

.zn-tabs-navItem:hover > a, .zn-tabs-navItem:focus > a, .zn-tabs-navItem.active > a { background-color: white; color: black; }

.zn-tabs-navItem.active > a { border-bottom-color: transparent; padding: 18px 30px 12px; }

.zn-tabs-navTitle { font-size: 14px; font-weight: 500; }

.zn-tabs-navIcon { margin-right: 5px; vertical-align: middle; }

.zn-tabs-navIcon + span { vertical-align: middle; }

.zn-tabs-content { background-color: white; padding: 20px 25px; border: 1px solid #e6e5e5; }

.zn-tabs-contentPane { display: none; }

.zn-tabs-contentPane.active { display: block; }

.zn-tabs--theme-dark .zn-tabs-navItem > a { border-color: #404040; background-color: #191a1a; color: rgba(255, 255, 255, 0.5); }

.zn-tabs--theme-dark .zn-tabs-navItem:hover > a, .zn-tabs--theme-dark .zn-tabs-navItem:focus > a, .zn-tabs--theme-dark .zn-tabs-navItem.active > a { background-color: black; color: white; }

.zn-tabs--theme-dark .zn-tabs-navItem.active > a { border-bottom-color: transparent; }

.zn-tabs--theme-dark .zn-tabs-content { background-color: black; border-color: #191a1a; color: rgba(255, 255, 255, 0.7); }
