.noColumns(){
	column-count         : auto;
	column-fill          : auto;
	column-gap           : auto;
	column-width         : auto;
	-webkit-column-count : auto;
	-moz-column-count    : auto;
	-webkit-column-width : auto;
	-moz-column-width    : auto;
	-webkit-column-gap   : auto;
	-moz-column-gap      : auto;
}
.listPage{
	height : unset !important;
	.content{
		.phb{
			.noColumns();
			height     : auto;
			min-height : 279.4mm;
			margin     : 20px auto;
			&::after{
				display : none;
			}
			.noBrews{
				margin     : 10px 0px;
				font-size  : 1.3em;
				font-style : italic;
			}

		}
	}
	.sort-container{
		font-family        : 'Open Sans', sans-serif;
		position           : sticky;
		top                : 0;
		left               : 0;
		width              : 100%;
		background-color   : #555;
		border-top         : 1px solid #666;
		color              : white;
		padding            : 2px;
		text-align         : center;
		z-index            : 500;
		display            : flex;
		justify-content    : center;
		align-items        : center;
		h6{
			text-transform : uppercase;
			font-family    : 'Open Sans', sans-serif;
			font-size      : 11px;
			font-weight    : bold;
		}
		.filter-option {
			background-color: transparent !important;
			i{
				padding-right : 5px
			}
		}
		button{
				background-color : transparent;
				font-family      : 'Open Sans', sans-serif;
				font-size        : 11px;
				text-transform   : uppercase;
				font-weight      : normal;
				color            : #888;
				&.active{
					font-weight      : bold;
					text-decoration  : underline;
					color            : unset;
				}
				&.sortDir{
					width : 75px;
				}
			}
		
		
	}
	h1 {
		cursor: pointer;
		&.active {
			color: #58180D;
		}
		&.inactive {
			color: #707070;
			
		}
		&.active::before, &.inactive::before {
			font-family: 'Font Awesome 5 Free';
			font-weight: 900;
			font-size: 0.6cm;
    			padding-right: 0.5em;
		}
		&.active::before {
			content: '\f107';
		}
		&.inactive::before {
			content: '\f105';
		}
	}
}