//----------------------------------------------------------------------------------------------------------------------
// CONTENT
//----------------------------------------------------------------------------------------------------------------------

/// Full-width content block.
/// @group layout
.content {
	@extend %viewport-padding;

	// Shaded content block
	&.shaded {
		background: pitch($color-base, 90);
	}

	// Apply padding to wrapper
	.wrapper {
		padding: rhythm(5) 0;

		// Large viewport and up
		@include media(">=", $breakpoint-l) {
			padding: rhythm(6) 0;
		}
	}
}