Как сверстать такую кнопку?

body {
  background: #C79B4B;
}
div {
  width: 200px;
  height: 60px;
  line-height: 60px;
  text-align: center;
  color: #FFF;
  background: 
  linear-gradient(-135deg, #C79B4B 0, #C79B4B 5px, #fff 6px, #fff 8px, transparent 9px, transparent 100%),
  linear-gradient(135deg, #C79B4B 0, #C79B4B 5px, #fff 6px, #fff 8px, transparent 9px, transparent 100%),
  linear-gradient(-45deg, #C79B4B 0, #C79B4B 5px, #fff 6px, #fff 8px, transparent 9px, transparent 100%),
  linear-gradient(45deg, #C79B4B 0, #C79B4B 5px, #fff 6px, #fff 8px, transparent 9px, transparent 100%),
  linear-gradient(to right,#fff 0, #fff 2px, transparent 3px, transparent calc(100% - 3px), #fff calc(100% - 2px), #fff 100%),
  linear-gradient(to bottom, #fff 0, #fff 2px, #f00 3px, #900 calc(100% - 3px), #fff calc(100% - 2px), #fff 100%);
  margin: 30px;
}

#octagon {
	width: 100px;
	height: 100px;
	background: red;
	position: relative;
}

#octagon:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	border-bottom: 29px solid red;
	border-left: 29px solid #eee;
	border-right: 29px solid #eee;
	width: 42px;
	height: 0;
}

#octagon:after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	border-top: 29px solid red;
	border-left: 29px solid #eee;
	border-right: 29px solid #eee;
	width: 42px;
	height: 0;
}