// spread featured post full width
.featuredPost {
	margin-bottom: $xlarge-space;
	background-color: $light;
	display: inline-block;
	margin-top: -($large-space + 1px);
	.columns {
		padding-left: 0;
		padding-right: 0;
		@media #{$small-only}{
			order: 2;
		}
		@media #{$medium-down}{
			margin-left: 0;
		}
		>.row {
			width: 100%;
			max-width: 100%;
			margin-left: 0;
			margin-right: 0;
		}
	}
	h1 {
		font-size: rem-calc(40);
		@media #{$small-only}{
			font-size: rem-calc(25);
		}
		a {
			color: $body-font-color;
		}
	}
	// sit this over the row to keep ontop
	section {
		@extend .absolute-center;
		width: 100%;
		max-width: $global-width;
		margin-right: ($grid-gutter-medium / 2);
		margin-left: ($grid-gutter-medium / 2);
		@media #{$medium-down}{
			position: relative;
			transform: none;
			top: auto;
			left: auto;
			order:1;
			padding: $large-space $medium-space;
			margin: 0;
		}
		> .row {
			margin: 0;
		}
	}
	img {
		display: inherit;
	}
}