article {
	margin-left: auto;
	margin-right: auto;
	max-width: 680px;
}

article > header {
	position:relative;
}

article > header > h1 {
	font-weight:normal;
	margin:0px 0px 25px 0px;
	text-align: center;
	text-transform: uppercase;
	line-height: 41px;
	font-size: 22px;
	color:@darker;
}

article > header > a.pure-button {
	border:1px solid @border;
	position: absolute;
	top: 0px;
	right: 0px;
	background: #FFF;
	color: #999;
	padding: 13px 15px;
	font-size:15px;

	&:hover {
		box-shadow: 1px 1px 5px @border-light, -1px -1px 5px @border-light;
		background: #FFF;
	}
	&:active {
		border-color:@border;
		background:lighten(@border-light, 5%);
	}
}

article.pure-g {
	margin-left: auto;
	margin-right: auto;
	max-width: 980px;
}

article.pure-g > header > h1 {
	text-transform: none;
	text-align:left;
	color:@darker;

	* {
		text-decoration:none;
		color:@darker;
		opacity: 0.8;
		&:last-child {
			opacity: 1.0;
		}
	}

	a:hover {
		text-decoration:underline;
	}
}

article.pure-g {
	&> .pure-u-1-4 {
		width: 30%;
	}
	&> .pure-u-3-4 {
		width: 70%;
	}
}