header{
  margin-bottom:20px;
}
.headerbtns{
	width: 100%;
	margin: auto;
	display: flex;
	flex-direction: row;
}
.headerbtns li{
	display:flex;
	justify-content: space-between;
	flex-direction: column;
	width: 70px;
	height: 15px;
	margin: auto;
	font-size: 12px;
	font-weight:bold;
}
.headerbtns a{
	text-decoration: none;
	padding: 2px;
	line-height: 10px;
	margin-top: 10px;
	margin-bottom: 5px;
	border: 2px solid #cccccc;
	border-bottom-color: black;
	border-right-color: black;
	border-top-color: whitesmoke;
	border-left-color: whitesmoke;
	color: black;
}
.headerbtns a:hover{
	border-bottom-color: whitesmoke;
	border-right-color: whitesmoke;
	border-top-color: black;
	border-left-color: black;
	background-color: blue;
	color: yellow;
}
.btnpushed a{
	border-bottom-color: whitesmoke;
	border-right-color: whitesmoke;
	border-top-color: black;
	border-left-color: black;
	background-color: blue;
	color: yellow;
}


@media (max-width: 619px) {

header{
  width: 100%;
}
.headerbtns{
	flex-wrap: wrap;
}
.headerbtns li{
  width: 25%;
  height: 100%;
}
.headerbtns a{
	padding: 10px;
	line-height: 5px;
	margin-top: 0px;
	margin-bottom: 0px;
}

}
}
}