///
/// Future Imperfect by HTML5 UP
/// html5up.net | @ajlkn
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
///

/* Intro */

	#intro {
		.logo {
			border-bottom: 0;
			display: inline-block;
			margin: 0 0 (_size(element-margin) * 0.5) 0;
			overflow: hidden;
			position: relative;
			width: 4em;

			&:before {
				background-image: svg-url('<svg xmlns="http://www.w3.org/2000/svg" width="100px" height="100px" viewBox="0 0 100 100" preserveAspectRatio="none" zoomAndPan="disable"><polygon points="0,0 100,0 100,25 50,0 0,25" style="fill:#{_palette(bg-alt)}" /><polygon points="0,100 100,100 100,75 50,100 0,75"  style="fill:#{_palette(bg-alt)}" /></svg>');
				background-position: top left;
				background-repeat: no-repeat;
				background-size: 100% 100%;
				content: '';
				display: block;
				height: 100%;
				left: 0;
				position: absolute;
				top: 0;
				width: 100%;
			}

			img {
				display: block;
				margin-left: -0.25em;
				width: 4.5em;
			}
		}

		header {
			h2 {
				font-size: 2em;
				font-weight: _font(weight-heading-extrabold);
			}

			p {
				font-size: 0.8em;
			}
		}

		@include breakpoint(large) {
			margin: 0 0 _size(section-spacing) 0;
			text-align: center;

			header {
				h2 {
					font-size: 2em;
				}

				p {
					font-size: 0.7em;
				}
			}
		}

		@include breakpoint(small) {
			margin: 0 0 _size(section-spacing-small) 0;
			padding: 1.25em 0;

			> :last-child {
				margin-bottom: 0;
			}

			.logo {
				margin: 0 0 (_size(element-margin) * 0.25) 0;
			}

			header {
				h2 {
					font-size: 1.25em;
				}

				> :last-child {
					margin-bottom: 0;
				}
			}
		}
	}