*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.main {
	width: 90%;
	padding: 1em;
	margin: 0 auto;
}

.bp-icon:after {
	font-family: 'bpicons';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	text-align: center;
	color: #47a3da;
	-webkit-font-smoothing: antialiased;
}

.product > header nav .bp-icon:after {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	line-height: 2;
	text-indent: 0;
}

.product > header nav a:hover:after {
	color: #fff;
}

@media screen and (max-width: 55em) {

	.product > header h1,
	.product > header nav {
		float: none;
	}

	.product > header > span,
	.product > header h1 {
		text-align: center;
	}

	.product > header nav {
		margin: 0 auto;
	}

	.product > header > span {
		text-indent: 30px;
	}
}