/*print specific styles .*/
@media print {

	html,
	body {
		/*changing width to 100% causes huge overflow and wrap*/
		height: 100%;
		width: 100%;
		margin: 0;
		background-image: none;
		background-color: #fff;
		counter-reset: page;
		counter-increment: page;
		print-color-adjust: exact;
		-webkit-print-color-adjust: exact !important;
	}

	body * {
		visibility: visible !important;
	}

	@page {}

	h3.pag {
		display: initial;
	}

	.print {
		display: none;
	}

	#pageNumber:after {
		display: block;
		text-align: right;
		content: 'Page ' counter(page) ' of ' counter(pages);
	}

	/*  #pageNumber.first.page
        {
            page-break-before: avoid;
        } */
	.ui-panelgrid .ui-panelgrid-cell {
		border: 1px solid #a5a5a5 !important;
		color: #495057 !important;
		font-size: .85rem;
		padding: .25rem !important;
	}

	.ui-panelgrid .ui-panelgrid-cell.ui-widget-header {
		background: #cfcfcf !important;
		color: #495057;
		padding: .25rem !important;
		font-size: .9rem;
		font-weight: 600;
	}

	.flyer {
		background-color: #fff;
		padding: 0;
		width: 100%;
	}

	.no-print {
		display: none
	}

	.ShowOnPrint {
		display: inherit;
	}

	.printMapHdr {
		background-color: #4a4a4a;
		color: #ffc516;
		text-align: center;
		margin-bottom: .75rem;
		width: 100%;
	}

	.ui-panel {
		width: 100% !important;
	}

	.ui-button {
		display: none;
	}

	body .ui-datatable-reflow {
		all: unset;
	}

	#pageNumber {
		content: counter(page)
	}

	.sm\:col {
		flex-grow: 1;
		flex-basis: 0;
		padding: .5rem
	}

	.sm\:col-fixed {
		flex: 0 0 auto;
		padding: .5rem
	}

	.sm\:col-1 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 8.3333%
	}

	.sm\:col-2 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 16.6667%
	}

	.sm\:col-3 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 25%
	}

	.sm\:col-4 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 33.3333%
	}

	.sm\:col-5 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 41.6667%
	}

	.sm\:col-6 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 50%
	}

	.sm\:col-7 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 58.3333%
	}

	.sm\:col-8 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 66.6667%
	}

	.sm\:col-9 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 75%
	}

	.sm\:col-10 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 83.3333%
	}

	.sm\:col-11 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 91.6667%
	}

	.sm\:col-12 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 100%
	}

	.md\:col {
		flex-grow: 1;
		flex-basis: 0;
		padding: .5rem
	}

	.md\:col-fixed {
		flex: 0 0 auto;
		padding: .5rem
	}

	.md\:col-1 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 8.3333%
	}

	.md\:col-2 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 16.6667%
	}

	.md\:col-3 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 25%
	}

	.md\:col-4 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 33.3333%
	}

	.md\:col-5 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 41.6667%
	}

	.md\:col-6 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 50%
	}

	.md\:col-7 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 58.3333%
	}

	.md\:col-8 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 66.6667%
	}

	.md\:col-9 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 75%
	}

	.md\:col-10 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 83.3333%
	}

	.md\:col-11 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 91.6667%
	}

	.md\:col-12 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 100%
	}

	.lg\:col {
		flex-grow: 1;
		flex-basis: 0;
		padding: .5rem
	}

	.lg\:col-fixed {
		flex: 0 0 auto;
		padding: .5rem
	}

	.lg\:col-1 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 8.3333%
	}

	.lg\:col-2 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 16.6667%
	}

	.lg\:col-3 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 25%
	}

	.lg\:col-4 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 33.3333%
	}

	.lg\:col-5 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 41.6667%
	}

	.lg\:col-6 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 50%
	}

	.lg\:col-7 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 58.3333%
	}

	.lg\:col-8 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 66.6667%
	}

	.lg\:col-9 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 75%
	}

	.lg\:col-10 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 83.3333%
	}

	.lg\:col-11 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 91.6667%
	}

	.lg\:col-12 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 100%
	}

	.xl\:col {
		flex-grow: 1;
		flex-basis: 0;
		padding: .5rem
	}

	.xl\:col-fixed {
		flex: 0 0 auto;
		padding: .5rem
	}

	.xl\:col-1 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 8.3333%
	}

	.xl\:col-2 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 16.6667%
	}

	.xl\:col-3 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 25%
	}

	.xl\:col-4 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 33.3333%
	}

	.xl\:col-5 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 41.6667%
	}

	.xl\:col-6 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 50%
	}

	.xl\:col-7 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 58.3333%
	}

	.xl\:col-8 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 66.6667%
	}

	.xl\:col-9 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 75%
	}

	.xl\:col-10 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 83.3333%
	}

	.xl\:col-11 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 91.6667%
	}

	.xl\:col-12 {
		flex: 0 0 auto;
		padding: .5rem;
		width: 100%
	}

	#header {
		position: fixed;
		top: 0;
		width: 100%;
		height: 100px;
		/* For testing */
		background: yellow;
		opacity: 0.5;
	}

	#footer {
		position: fixed;
		bottom: 0;
		width: 100%;
		height: 50px;
		/* For testing */
		background: red;
		opacity: 0.5;
	}

	/* Print progressive page numbers */
	/* .page-number:before {
		counter-increment: page;
		content: "Page: " counter(page);
	} */
	#pageCounter {
		counter-reset: pageTotal;
	}

	#pageCounter span {
		counter-increment: pageTotal;
	}

	#pageNumbers {
		counter-reset: currentPage;
	}

	#pageNumbers div:before {
		counter-increment: currentPage;
		content: "Page " counter(currentPage) " of ";
	}

	#pageNumbers div:after {
		content: counter(pageTotal);
	}
}