

/**
* 1. Correct color not being inherited.
*    Known issue: affects color of disabled elements.
*/
button,
input,
optgroup,
select,
textarea {
  color: inherit; /* 1 */
}


/*---- kz_starts ----*/
.aspNetHidden
{
  display: none;
}

.kz-clearfix:after
{
  content: "";
  display: table;
  clear: both;
}

/* All input elements margins was normalized to 0 */
/* Conflict with bootstrap
 input[type=checkbox] + label
,input[type=radio] + label
{
	margin-left: 0.45em;
}
 label + input[type=checkbox] 
,label + input[type=radio]
{
  margin-left: 0.45em;
}
*/

/*--- 
	IE padding-top is perform above fieldset box rather than inside. 
	Reset margin.
*/
fieldset {
  padding-top: 0.01em;
	margin: 0px;
}

/* webkit has hidden bottom margin on textarea, input[text] 
	Important to include vertical margin.
	DOES NOT WORK.
*/
/*
 textarea
,input[type="text"]
{
	margin: 0px;
	vertical-align: text-bottom;	
}
*/

textarea
{
	resize: none !important;
}


/* User Info Bar */
.kz-user-info-bar
{
  display: flex;
  flex-wrap: nowrap;
  position: relative;
  width: 100%;
  height: 100px;
  padding-left: 0.5rem;
  background-color: #fdfdfd;
  border-bottom: solid 1px #d1d2d3;
  align-items: center;
}

.kz-user-info-bar__logosvg
{
  flex: 1 1 auto;
  width: 100%;
  height: 300%;
  max-height: 70px;
}

@media (min-width: 768px) 
{
  .kz-user-info-bar
  {
    padding-left: 1rem;
  }

  .kz-user-info-bar__logosvg
  {
    max-height: 70px;
  }
}

.kz-user-info-bar__linkscont
{
  display: flex;
  flex-wrap: nowrap;
  flex: 0 0 auto;
  padding-left: .5rem;
  padding-right: .5rem;
}

.kz-user-info-bar__linkscont__link
{
  margin-right: 1rem;
}

.kz-user-info-bar a:link, .kz-user-info-bar a:visited, .kz-user-info-bar a:hover, .kz-user-info-bar a:active
{
  color: inherit;
}

.kz-proc-msg
{
  font-weight: bold;
  font-size: 1.125rem;
  color: indigo;
}

.kz-warning-text,
.kz-err-text,
.kz-error,
.kz-errorblk,
.kz-val-error,
.kz-val-errorblk,
.kz-err-text-9,
.kz-err-text-bold-10,
.kz-err-text-bold-14,
.kz-obsolete-text,
.kz-err-text-bold-14,
.kz-obsolete-text
{
  color: red;
}

.kz-warning-text
{
  font-style: italic;
}

.kz-errorblk
{
  display: block;
  width: 100%;
  max-width: 44rem;
  word-break: break-word;
  overflow-wrap: break-word;
  white-space: pre-wrap;
}

.kz-val-error,
.kz-val-errorblk
{
  font-size: 0.90625rem;
}

.kz-val-errorblk
{
  display: block;
}

.kz-err-text-9
{
  font-size: 1.125rem;
}

.kz-err-text-bold-10
{
  font-weight: bold;
  font-size: 1.25rem;
}

.kz-err-text-bold-14,
.kz-obsolete-text
{
  font-weight: bold;
  font-size: 1.7rem;
  color: red;
}

.kz-welcome-bar
{
  border-bottom: 1px solid #d1d2d3;
  padding-top: 0.5rem;
}

.kz-welcome-bar-caption
{
  font-size: 1rem;
  font-weight: 600;
  padding-top: 0;
}

.kz-welcome-bar-logo
{
  min-width: 1px;
  height: 70px;
}

@media (min-width: 768px)
{
  .kz-welcome-bar-caption
  {
    font-size: 1.125rem;
    padding-top: 0.25rem;
  }
  .kz-welcome-bar-logo
  {
    height: 70px;
  }
}

/* Copyright */
.kz-copyright
{
  font-weight: normal;
  font-size: 0.8rem;
  color: black;
  font-variant: normal;
  text-align: center;
}

.kz-copyright a:link, .kz-copyright a:visited
{
  color: black;
}
.kz-copyright a:hover, .kz-copyright a:active
{
  color: Blue;
}

/* PM Panel Style */
.PmPanel
{
}

.PmSectionHeader
{
  font-weight: bold;
  font-size: 1.13em;
  color: white;
  background-color: #00796B;
}

.PmSectionHeader td
{
	padding: 0.2em 0.2em 0.2em 0.3em;
	white-space: nowrap;
}

.PmSectionFooter
{
  font-weight: bold;
  font-size: 1.13em;
  color: white;
  background-color: #26A69A;
}

.PmItemTable
{
  border: solid 1px #c0c0c0;
}

.PmItemTable td
{
  border: solid 1px #c0c0c0;
}

.PmItemTable tr.ptitem td
{
  background-color: #f8f8f8;
	padding: 0.2em;
}

.PmItemTable tr.ptalt td
{
  background-color: white;
  padding: 0.2em;
}

.PmItemHeader
{
  font-weight: bold;
  background-color: #E0F2F1;
}

.PmItemHeader td
{
	white-space: nowrap;
	padding-top: 0.25em;
	padding-bottom: 0.25em;
	padding-left : 0.2em;
}

/* Use in survey */
.PmItemRemarkHeader
{
  font-weight: bold;
  background-color: #ececec;
}

.PmItemRemarkHeader td
{
  padding: 0.35em 0.2em;
}


.PmItemPosition
{
  background-color: Azure;
}

.PmItem
{
}

.PmItem td
{
  white-space: nowrap;
  padding: 0.2em 0px 0.2em 0.1em;
}

.PmItem td textarea
{
  white-space: pre-wrap;
}


.PmItemRoTdBgColor
{
  background-color: #f8f8f8;
}

.PmSectionText
{
  font-size: 1.25em;
  padding-top: 0.3em;
  padding-left: 0.2em;
}

.PmItemGrpHeader
{
  font-weight: bold;
  font-size: 1.13em;
  color: white;
  background-color: #009688;
}

.PmItemGrpHeader td
{
  padding: 0.2em 0.2em 0.2em 0.3em;
	white-space: nowrap;
}

.PmShowHideCtl
{
  cursor: pointer;
  color: #FFF9C4;
  text-decoration: underline;
}


.kz-error-summary
{
	color: red;
  padding-left: 0.25rem;
}

/* adhoc bar styles */
.kz-ahbar-container
{
  width: 70em;
}


/* New stuff starts */

/*-- Radio button list inner label */
span.rdblist label
{
  margin-left: 0.5rem;
}

table.rdbtab td
{
	border: none 0px;
	padding: 0.2em;
	white-space: nowrap;
}

tr.kz-trtd-nowrap td
{
	white-space: nowrap;
}

.kz-title
{ 
  font-size: 1.25rem;
  font-weight: 600;
  margin: 0 0 .3125rem;
  line-height: 1.3;
}

.kz-td-edit
{
  border: none 0px;
	margin: 0px;
  background-color: transparent;
}
/*
  padding-left: 0px;
  padding-right: 0px;
*/

.kz-edit-ro-bgcolor
{
  background-color: #FAFAFA;
}
/* Hardcode in program.*/
.kz-clm-item-td-ro
{
  background-color: #F5F5F5;
}

/* all form input control. Font-weight intentionally remove */
.kz-form-edit
,.kz-form-edit-pop
,.kz-form-edit-ro
,.kz-form-combo
,.kz-form-edit-10
,.kz-form-edit-pop-10
,.kz-FormReadOnlyTextBox
,.kz-edit-normal
,.kz-edit-bold
,.kz-edit-bold-10
,.kz-edit-flat-normal
,.kz-edit-flat-normal-10
,.kz-edit-flat-bold
,.kz-edit-flat-bold-10
,.kz-combo-normal
{
  padding: 2px 4px 2px;
  border-style: solid;
  border-width: 1px;
  border-color: #a6a6a6;
}
/* border-color: #7f9db9; */


.kz-form-edit-ro
,.kz-FormReadOnlyTextBox
{
  background-color: #FAFAFA;
}

.kz-form-combo
{
}

.kz-form-edit-10
,.kz-form-edit-pop-10
,.kz-edit-bold-10
,.kz-edit-flat-normal-10
,.kz-edit-flat-bold-10
{
  font-size: 1.25rem;
}

.kz-div-border
{
  border: solid 1px #d0d0d0;
}

/* Caption color */
.kz-FormCaptionCell,
.kz-dggrid tr.hdr,
.kz-dggrid tr.hdrnowrap,
.kz-dllist tr.hdr,
.kz-dllist tr.hdrnowrap
{
  background-color: #107484;
  color: white;
}

/* Use in KzJsBuild.cs */
.kz-hilite-table-item-bg
{
  background-color: #e6f7ff !important;
}

/* Background color for Table use to layout a entry or display form*/
.kz-FormTable,
.kz-form-bg
{
  background-color: #F5F5F5;
}

/* Form using table. See kz-form */
.kz-form-tb
{
  background-color: #F5F5F5;
  border: solid 1px #c0c0c0;
}

.kz-form-tb td
{
	padding: 0.2em 0px;
}

.kz-form-tb td.lbl
{
  text-align: right;
  padding-right: 0.1em;
  vertical-align: top;
  padding-top: 0.35em;
}

.kz-form-tb td.lblbold
{
  text-align: right;
  padding-right: 0.1em;
	font-weight: 600;
  vertical-align: top;
  padding-top: 0.35em;
}

 .kz-form-tb td.lbl + td
,.kz-form-tb td.lblbold + td
{
  vertical-align: top;
	padding-left: 0.1em;
}

.kz-form-tb td.sep
{
  height: 1em;
	padding: 0px;
}

/* 
  .btn class conflict with bootstrap .btn class.
  Style after padding is to reset BS.

*/
.kz-form-tb td.btn
{
  border-top: solid 1px #d0d0d0; 
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  
  display: table-cell !important;
  transition: none !important;
  text-align: initial;
  border-bottom: solid 1px #d0d0d0;
  border-radius: 0;
}

/* Reset BS .btn class. Conflict */
.kz-form-tb tr td.btn:first-child
{
  border-left: solid 1px #d0d0d0; 
}
.kz-form-tb tr td.btn:last-child
{
  border-right: solid 1px #d0d0d0; 
}


.kz-form-tb td img.kz-clrinput,
.kz-form-tb td img.kz-nvimgbtn,
.kz-form-tb td input[type="image"].kz-nvimgbtn
{
  vertical-align: text-top;
}

span.kz-form-cb
{
  display: inline-block;
  min-height: 1.5rem;
  white-space: nowrap;
}

span.kz-form-cb input[type=checkbox]
{
	margin-right: 0.5rem;
  vertical-align: -1px;
}

/* new error grid */
.kz-error-grid
{
  width: 100%;
  max-width: 44rem;
}

.kz-error-grid td.hdr,
.kz-error-grid th.hdr
{
  font-weight: 600;
  border-bottom: solid #c0c0c0 1px;
  padding: 0.25rem 0.25rem 0.125rem 0.25rem;
	text-align: left;
}

.kz-error-grid td.item
{
  font-size: 87.5%;
  color: red;
	padding: 0.1875rem 0.25rem;
  word-break: break-word;
  overflow-wrap: break-word;
}

/* new data grid and list  */
.kz-dggrid th,
.kz-dllist th
{
	text-align: left;
}

.kz-dggrid td,
.kz-dggrid th,
.kz-dllist td,
.kz-dllist th
{
  padding: 0.25rem 0.25rem;
  border: solid 1px #c0c0c0;
}

.kz-dggrid tr.hdr td,
.kz-dggrid tr.hdr th,
.kz-dggrid tr.hdrnowrap td,
.kz-dggrid tr.hdrnowrap th,
.kz-dllist tr.hdr td,
.kz-dllist tr.hdr th,
.kz-dllist tr.hdrnowrap td,
.kz-dllist tr.hdrnowrap th
{
  font-weight: 600;
  color: inherit;
  vertical-align: bottom;
}

.kz-dggrid tr.hdrnowrap td,
.kz-dggrid tr.hdrnowrap td,
.kz-dllist tr.hdrnowrap td,
.kz-dllist tr.hdrnowrap th
{
  white-space: nowrap;
}

 .kz-dggrid tr.hdr td a 
,.kz-dggrid tr.hdr th a
,.kz-dggrid tr.hdrnowrap td a
,.kz-dggrid tr.hdrnowrap th a
{
	color: inherit;
	text-decoration: underline;
}

 .kz-dggrid tr.hdr td a:hover 
,.kz-dggrid tr.hdr td a:active 
,.kz-dggrid tr.hdr th a:hover 
,.kz-dggrid tr.hdr th a:active 
,.kz-dggrid tr.hdrnowrap td a:hover 
,.kz-dggrid tr.hdrnowrap td a:active
,.kz-dggrid tr.hdrnowrap th a:hover 
,.kz-dggrid tr.hdrnowrap th a:active
{
  color: yellow;
	text-decoration: underline;
}

.kz-dggrid tr.item,
.kz-dggrid tr.itemvtop,
.kz-dllist tr.item,
.kz-dllist tr.itemvtop,
.kz-dllist tbody.item_tbody
{
  background-color: #fafbfc;
}

.kz-dggrid tr.alt,
.kz-dggrid tr.altvtop,
.kz-dllist tr.alt,
.kz-dllist tr.altvtop,
.kz-dllist tbody.alt_tbody
{
  background-color: #f1f2f3;
}

.kz-dggrid tr.item td.precol,
.kz-dggrid tr.alt td.precol,
.kz-dggrid tr.itemvtop td.precol,
.kz-dggrid tr.altvtop td.precol
{
	white-space: pre-wrap;
  overflow-wrap: break-word;
  word-break: break-word;
	vertical-align: top;
}

.kz-dggrid tr.itemvtop td,
.kz-dggrid tr.altvtop td,
.kz-dllist tr.itemvtop td,
.kz-dllist tr.item.vatop td,
.kz-dllist tr.altvtop td,
.kz-dllist tr.alt.vatop td
{
	vertical-align: top;
}

.kz-dggrid tr.sep,
.kz-dggrid td.sep,
.kz-dllist td.sep,
.kz-dllist tr.sep
{
}

.kz-dggrid tr.sel,.kz-dggrid td.sel
{
  background-color: papayawhip;
}

.kz-dggrid tr.ftr,
.kz-dggrid td.ftr,
.kz-dllist tr.ftr,
.kz-dllist td.ftr,
.kz-dllist tfoot.ftr_tfoot
{
  background-color: #e8e9ea;
}

.kz-dggrid tr.pgr,
.kz-dggrid-ftr-bgcolor,
.kz-dggrid-pgr
{
  background-color: #fff;
}

.kz-dggrid-pgr
{
  display: flex;
  flex-wrap: wrap;
}

.kz-dggrid-pgr span,
.kz-dggrid-pgr a
{
  padding-right: 0.75rem;
}

.kz-dggrid tr.pgr td span , .kz-dggrid tr.pgr td a,
.kz-dggrid tr.pgr th span , .kz-dggrid tr.pgr th a,
.kz-dggrid-pgr span,
.kz-dggrid-pgr a
{
	font-weight: 600;
	font-size: 1.25rem;
}


/* following rule to be use in datagrid columns CssClass
	as we cant set style attribute.
*/
.kz-ta-center
{
	text-align: center;
}
.kz-ta-right
{
	text-align: right;
}
.kz-va-top
{
	vertical-align: top;
}
.kz-va-bottom
{
	vertical-align: bottom;
}
.kz-va-middle
{
	vertical-align: middle;
}

/*----------------- Buttons ----------------------*/
.kz-btn,
.kz-button-normal,
.kz-btn-9,
.kz-btn-bold,
.kz-button-bold,
.kz-button-bold-10
{
  padding: 0.1875rem 0.375rem;
}

.kz-btn-9
{
  font-size: 1.125rem;
}

.kz-btn-bold,
.kz-button-bold
{
  font-weight: 600;
}

.kz-button-bold-10
{
  font-size: 1.25rem;
  font-weight: 600;
}


/*----------------- Labels ----------------------*/
.kz-lbl-bold
,.kz-label-bold
{
	font-weight: bold;
}

.kz-lbl-6
{
  font-size: 0.875rem;
}

.kz-lbl-7
{
  font-size: 0.9375rem;
}

.kz-lbl-8
{
  font-size: 1rem;
}

.kz-lbl-9
{
  font-size: 1.125rem;
}
.kz-lbl-9-bold
{
  font-size: 1.125rem;
	font-weight: 600;
}

.kz-lbl-10
{
  font-size: 1.25rem;
  line-height: 1.2;
}

.kz-lbl-10-bold
,.kz-label-bold-10
{
  font-size: 1.25rem;
  line-height: 1.2;
	font-weight: 600;
}

.kz-lbl-12
{
  font-size: 1.5rem;
  line-height: 1.2;
}

.kz-lbl-12-bold
{
  font-size: 1.5rem;
  line-height: 1.2;
  font-weight: 600;
}


.kz-hdr-9-bold
{
  font-size: 1.125rem;
	font-weight: 600;
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
}

div.indent10,
div.indent10-pop
{
	padding-left: 1rem;
}

#kz_pg_content:not(.indent10),
div.indent10,
.kz-main-container-mh
{
  min-height: calc(100vh - 150px);  /*mike_header_size*/
}

/*--- Hide hr in kz_pg_content div ---*/
#kz_pg_content > hr:nth-of-type(1)
{
  display: none;
}


/* Link */
/* bs-conflict
a
{
  color: blue;
	text-decoration: underline;
}

a:hover,a:active
{
  color: DeepSkyBlue;
	text-decoration: underline;
}
*/

.kz-clmtrh-remark-div
{
	white-space: pre;
	width: 30rem;
	max-height: 7.3rem;
	overflow-x: auto;
	overflow-y: auto;
}

.kz-clmtrh-remark-width
{
	width: 30rem;
}

/*------------------------------- Calendar ----------------------------------*/
.kz-calendar
{
}
.kz-calendar td.daycell
{
	padding: 0px;
	border: solid 1px #c0c0c0;
}
.kz-calendar td.dayhdr,.kz-calendar th.dayhdr
{
	padding: 0.2em;
	border: solid 1px #c0c0c0;
	background-color: #e0e0e0;
	font-weight: bold;
}

.kz-calendar table.title
{
	background-color: #679bfc;
	color: white;
	font-weight: bold;
}


/*------------------------------- Claim Usage Template Controls ----------------------------------*/
.kz-clm-table
{
  margin-top: 1em;
  border: solid 1px #c0c0c0;
  width: 86em;
}


.kz-clm-header
{
  font-weight: bold;
  background-color: #CFD8DC;
}


.kz-clm-header td, .kz-clm-header th
{
  white-space: nowrap;
  border: solid 1px #c0c0c0;
  padding: 0.3em 0px 0.3em 0.1em;
}

.kz-clm-header-btn
{
  margin-left: 1em;
  vertical-align: bottom;
}

.kz-clm-item
{
}

.kz-clm-item td
{
  white-space: nowrap;
  border: solid 1px #c0c0c0;
	padding-top: 0.2em;
	padding-bottom: 0.2em;
	padding-left: 0.1em;
	padding-right: 0px;
}

/*-- Borders  --*/
.kz-border-all
{
  border: solid 1px #d0d0d0;
}

.kz-border-t
{
  border-top: solid 1px #d0d0d0;
}

.kz-border-b
{
  border-bottom: solid 1px #d0d0d0;
}

.kz-border-l
{
  border-left: solid 1px #d0d0d0;
}

.kz-border-r
{
  border-right: solid 1px #d0d0d0;
}

.kz-border-lr
{
  border-left: solid 1px #d0d0d0;
  border-right: solid 1px #d0d0d0;
}

.kz-border-tb
{
  border-top: solid 1px #d0d0d0;
  border-bottom: solid 1px #d0d0d0;
}

.kz-box-caption
{
  background-color: #F5F5F5;
	padding-top: 2px;
	padding-bottom: 2px;
}

/*--------------- Sticky Table Header -----------*/
.sticky-component 
{
  max-width: 94em;
  overflow: hidden;
  width: 95%;
}

.sticky-wrap
{
  position: relative;
  width: 100%;
  overflow-x: hidden;
}

.sticky-wrap .sticky-thead,
.sticky-wrap .sticky-col,
.sticky-wrap .sticky-intersect
{
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  transition: all .125s ease-in-out;
  z-index: 50;
  width: auto; /* Prevent table from stretching to full size */
}

.sticky-wrap .sticky-thead
{
  box-shadow: 0 0.25em 0.1em -0.1em rgba(0,0,0,.125);
  z-index: 100;
  width: 100%; /* Force stretch */
}

.sticky-wrap .sticky-intersect
{
  opacity: 1;
  z-index: 150;
}

.sticky-wrap .sticky-intersect th
{
  /*
  background-color: #666;
  color: #eee;
  */
}

.sticky-wrap.overflow-y
{
  /*max-height: 75vh;*/
  overflow-y: auto;
}


.sticky-mb-2r
{
  margin-bottom: 4rem;
}

.sticky-mb-3r
{
  margin-bottom: 6rem;
}

.sticky-mb-4r
{
  margin-bottom: 8rem;
}

.sticky-mb-5r
{
  margin-bottom: 10rem;
}

.sticky-mb-6r
{
  margin-bottom: 12rem;
}

.sticky-mb-7r
{
  margin-bottom: 14rem;
}


/*--- Print dl ---*/
.kz-dlprint
{
  border-collapse: separate;
  border-spacing: 0;
}

.kz-dlprint th
{
  border-bottom: solid 1px #808080;
  border-top: solid 1px #808080;
}

.kz-dlprint td
{
  border-bottom: solid 1px #808080;
}


.kz-dlprint td + td, .kz-dlprint th + th
{
  border-left: solid 1px #808080;
}

.kz-dlprint td:first-child, .kz-dlprint th:first-child
{
  border-left: solid 1px #808080;
}

.kz-dlprint td:last-child, .kz-dlprint th:last-child
{
  border-right: solid 1px #808080;
}

.kz-dlprint th
{
  text-align: left;
  vertical-align: bottom;
}

.kz-dlprint td, .kz-dlprint th
{
  padding: 0.5em 0.3em;
}

.kz-dlprint tr.itemvtop td, .kz-dlprint tr.altvtop td
{
  vertical-align: top;
}

/*--- Print form table---*/
.kz-prtform-tb td, .kz-prtform-tb th
{
  padding: 0.4em;
}

.kz-prtform-tb-bdrall td
{
  border: solid 1px #808080;
}

.kz-prtform-tb td.lblbold
{
  font-weight: bold;
}

/*--- Typical printing ---*/
@media print
{
  .kz-no-print, .kz-no-print *
  {
    display: none;
  }

  html
  {
    font-size: 8pt;
    font-family: Arial, sans-serif;
  }

  body
  {
    margin: 0;
  }

  thead 
  {
    display:table-header-group;
  }

  .kz-dlprint tfoot.ftratend
  {
    display: table-row-group;
  }

  table.kz-pg-nobreak  tbody,
  table.kz-pg-nobreak  thead,
  table.kz-pg-nobreak  tfoot
  {
    page-break-inside: avoid;
  }
}

/*------------------------------------
* Web menu.
------------------------------------*/
.kz-top-menu-header
{
  min-height: 40px;
}

@media (min-width: 768px)
{
  .kz-top-menu-header
  {
    position: -webkit-sticky;
    position: sticky;
    top: 0px;
    left: 0px;
    z-index: 30040;
  }
}

.kz-top-menu-header--no-sticky
{
  position: static;
}

/* Horizontal menu */
.kzmenu {
  font-size: 0.9375em;
  font-size: 0.9375rem;
  width: auto;
  margin: 0;
  padding: 0;
  border: 0;
  line-height: 1;
}

.kzmenu a:visited,
.kzmenu a:focus,
.kzmenu a:active
{
  outline: 0;
}

.kzmenu
{
  transition: top 0.05s ease-in;
}

.kzmenu ul,
.kzmenu ul li,
.kzmenu ul li a
{
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
  line-height: 1;
  display: block;
}

.kzmenu ul li a
{
  white-space: nowrap;
  cursor: pointer;
}

.kzmenu > ul,
.kzpumenu-trigger-cont
{
  background-color: #0e6572;
  color: #fff;
}
/*background-color: #546e7a;*/

.kzmenu > ul > li > a
{
  padding: 5px 6px 5px 6px;
  text-decoration: none;
  color: inherit;
}

.kzmenu > ul > li {
  display: inline-block;
  padding: 7px 4px 5px 0px;
}

/* only if not using float above */
.kzmenu > ul
{
  white-space: nowrap;
}

/* menubar first li has extra left padding */
.kzmenu > ul > li:nth-child(1)
{
  padding-left: 12px;
}

.kzmenu > ul > li.hover > a
{
  color: #000;
  background-color: rgb(255, 227, 107);
}

.kzmenu ul ul li.hover
{
  background-color: rgb(255, 227, 107);
}

.kzmenu ul ul
{
  border: 1px solid #808080;
  box-shadow: 2px 2px 1px #888888;
  background: #fafafa;
  color: #000;
}

.kzmenu ul li.has-sub
{
  position: relative;
}

.kzmenu ul ul {
  position: absolute;
  display: none;
}

.kzmenu ul > li.has-sub.active > ul {
  z-index: 30050;
  display: block;
}

.kzmenu ul ul ul
{
  top: 2px;
}

.kzmenu ul ul li a
{
  padding: 7px 30px 7px 20px;
  text-decoration: none;
  color: inherit;
  min-width: 100px;
}

.kzmenu ul ul li.divider
{
  height: 1px;
  background-color: #a6a5a5;
}

/* Right arrow for dropdown menuitem li that has sub.*/
.kzmenu ul ul li.has-sub:after
{
  content: "\0027A4";
  position: absolute;
  font-size: 0.6rem;
  top: 33%;
  right: 7px;
  display: inline-block;
  color: inherit;
  opacity: .6;
}

/* Popup menu overlay fixed position. */
.kzpumenupnl
{
  flex-direction: column;
  flex-wrap: nowrap;
  position: fixed;
  z-index: 30045;
  top: 0;
  left: 0;
  width: 100vw;
  height: calc(100vh - 56px);
  background-color: #2e3233;
  color: #fff;
  backface-visibility: hidden;
}


.kzpumenupnl__titlebar
{
  flex: 0 0 auto;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  height: 38px;
  width: 100%;
  margin: 0;
  padding: 0 20px 0 1rem;
  overflow: hidden;
  background-color: #3e4243;
  color: #fff;
}

.kzpumenupnl__titlebar__close_btn
{
  display: inline-block;
  margin-left: auto;
  width: 44px;
  height: 100%;
  border: none;
  padding: 0;
  overflow: hidden;
  user-select: none;
  padding-bottom: 4px;
  background-color: transparent;
  color: inherit;
}

.kzpumenupnl__titlebar__close_btn:focus
{
  outline: 0;
}

.kzpumenu
{
  flex: 1 1 auto;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior-y: none;
}

.kzpumenu a:visited,
.kzpumenu a:focus,
.kzpumenu a:active
{
  outline: 0;
}

.kzpumenu ul,
.kzpumenu ul li,
.kzpumenu ul li a
{
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
  line-height: 1;
  display: block;
}

.kzpumenu ul li a
{
  color: inherit;
  font-weight: 600;
  text-decoration: none;
}

.kzpumenu ul li
{
  padding: 0.5rem 0 0.5rem 1.5rem;
  position: relative;
}

/* padding: 0.375rem 0 0.375rem 1.5rem; */

.kzpumenu ul li.has-sub > a:before
{
  content: ">";
  position: absolute;
  left: 0.5rem;
  display: inline-block;
  font-size: 1.05rem;
  transform: rotate(90deg);
}

.kzpumenu ul li.has-sub.active > a:before
{
  transform: rotate(-90deg);
}

.kzpumenu ul li a
{
  cursor: pointer;
}

.kzpumenu ul ul {
  display: none;
}

.kzpumenu ul > li.has-sub.active > ul 
{
  display: block;
}

.kzpumenu ul li > a:hover,
.kzpumenu ul li > a:hover:before
{
  color: #00cbff;
}

/* Collapsed menu bar */
.kzpumenu-trigger-cont
{
  flex-wrap: nowrap;
  height: 38px;
  width: 100%;
  padding: 0 20px 0 0;
}

.kzpumenu-open-trigger
{
  display: inline-block;
  margin-left: auto;
  width: 44px;
  height: 38px;
  border: none;
  padding: 0;
  overflow: hidden;
  user-select: none;
  padding-bottom: 7px;
  background-color: transparent;
  color: inherit;
}

.kzpumenu-open-trigger:focus
{
  outline: 0;
}

/*-- --*/
.kzpumenu-trigger-cont
{
  display: none;
}

.kzpumenupnl
{
  display: none;
}

@media (max-width: 1200px)
{
  .kzmenu
  {
    display: none;
  }

  .kzpumenu-trigger-cont
  {
    display: flex;
  }
  
  .kzpumenu-trigger-cont.hide
  {
    display: none;
  }

  .kzpumenupnl.show
  {
    display: flex;
  }

  .kzpumenupnl-visible-no-scroll
  {
    overflow: hidden;
    overscroll-behavior-y: none;
  }
}

/*-----------------------
* SVG icons
------------------------*/
.kz-svg-icon
{
  display: inline-block;
  width: 1rem;
  height: 1rem;
  fill: currentColor;
}

.kz-svg-icon-12
{
  width: .75rem;
  height: .75rem;
}

.kz-svg-icon-14
{
  width: .875rem;
  height: .875rem;
}

.kz-svg-icon-18
{
  width: 1.125rem;
  height: 1.125rem;
}

.kz-svg-icon-20
{
  width: 1.25rem;
  height: 1.25rem;
}

.kz-svg-icon-24
{
  width: 1.5rem;
  height: 1.5rem;
}

.kz-svg-icon-30
{
  width: 1.875rem;
  height: 1.875rem;
}

.kz-svg-icon-32
{
  width: 2rem;
  height: 2rem;
}

/*-----------------------------
* white space
------------------------------*/
.kz-ws-pre-wrap
{
  white-space: pre-wrap !important;
}


/*-----------------------------
* Link
------------------------------*/
/*
.kz-link-light
{
  color: #000;
  opacity: .6;
}

.kz-link-light:hover
{
  color: #000;
  opacity: 1;
}
*/

.kz-link-dark
{
  color: #fff;
}

.kz-link-dark:hover
{
  color: yellow;
}

/*----- Overflow utililty ---*/
.kz-overflow-hidden
{
  overflow: hidden;
}

.kz-overflow-x-hidden 
{
  overflow-x: hidden;
}

.kz-overflow-y-hidden 
{
  overflow-y: hidden;
}

.kz-overflow-auto
{
  overflow: auto;
}

.kz-overflow-x-auto 
{
  overflow-x: auto;
}

.kz-overflow-y-auto 
{
  overflow-y: auto;
}