@media (min-width:992px) {
	.fontlistson {
		width: 25% !important;
		max-width: 25% !important;
	}
}

.fontlist {
	display: -webkit-flex;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-star;
}

.fontlistson {
	width: 33%;
	flex: 1 1 auto;
	max-width: 33%;
	height: 100%
}

.button {
	margin: 5px 10px;
	text-decoration: none;
	font: 600 1rem "Trebuchet MS", Arial, Helvetica;
	/*Change the em value to scale the button*/
	display: inline-block;
	text-align: center;
	color: #fff;
	border: 1px solid #9c9c9c;
	/* Fallback style */
	border: 1px solid rgba(0, 0, 0, 0.3);
	text-shadow: 0 1px 0 rgba(0, 0, 0, 0.4);
	box-shadow: 0 0 .05em rgba(0, 0, 0, 0.4);
	width: 95%;
	-moz-box-shadow: 0 0 .05em rgba(0, 0, 0, 0.4);
	-webkit-box-shadow: 0 0 .05em rgba(0, 0, 0, 0.4);
}
.fontlistson .button:before {
    display: none !important;
}

.button,
.button span {
	-moz-border-radius: .3em;
	border-radius: .3em;
}

.button span {
	/*border-top: 1px solid #fff;*/
	/* Fallback style */
	/*border-top: 1px solid rgba(255, 255, 255, 0.5);*/
	display: block;
	padding: 0.5em 0.3em;
	/* The background pattern */
	background-size: 3px 3px;
}

.button:hover {
	box-shadow: 0 0 .1em rgba(0, 0, 0, 0.4);
	-moz-box-shadow: 0 0 .1em rgba(0, 0, 0, 0.4);
	-webkit-box-shadow: 0 0 .1em rgba(0, 0, 0, 0.4);
	text-decoration: none;
	color: #fff;
}

.button:active {
	/* When pressed, move it down 1px */
	position: relative;
	top: 1px;
}

/*----------------------------*/
.button-khaki {
	background: #A2B598;
}

.button-khaki:hover {
	background: #BDD1B4;
}

.button-khaki:active {
	background: #A2B598;
}

/*----------------------------*/
.button-blue {
	background: #268df7;
}

.button-blue:hover {
	background: #0062cc;
}

.button-blue:active {
	background: #0062cc;
}

/*----------------------------*/
.button-brown {
	background: #8f3714;
}

.button-brown:hover {
	background: #bf6f50;
}

.button-brown:active {
	background: #8f3714;
}

/*----------------------------*/
.button-green {
	background: #428739;
}

.button-green:hover {
	background: #c8dd95;
}

.button-green:active {
	background: #428739;
}

/*----------------------------*/
.button-red {
	background: #ff6fc7;
}

.button-red:hover {
	background: #ff6fc7;
}

.button-red:active {
	background: #ff6fc7;
}

/*----------------------------*/
.button-purple {
	background: #6F50E7;
}

.button-purple:hover {
	background: #B8A9F3;
}

.button-purple:active {
	background: #6F50E7;
}


/*----------------------------*/
.button-black {
	background: #141414;
}

.button-black:hover {
	background: #656565;
}

.button-black:active {
	background: #141414;
}

/*----------------------------*/
.button-orange {
	background: #f09c15;
}

.button-orange:hover {
	background: #f8c939;
}

.button-orange:active {
	background: #f09c15;
}

/*----------------------------*/
.button-silver {
	background: #c5c5c5;
}

.button-silver:hover {
	background: #eaeaea;
}

.button-silver:active {
	background: #c5c5c5;
}