Added feature component

src/stylesheets/components/_feature.scss

@@ -0,0 +1,46 @@
+.feature {
+	display: grid;
+	grid-template-areas: 'image' 'text';
+	margin: 2rem 0;
+	align-items: center;
+
+	img {
+		width: 100%;
+		grid-area: image;
+		text-align: center;
+	}
+
+	.feature__text {
+		grid-area: text;
+
+		h2 {
+			font-size: 2em;
+			font-family: Roboto;
+			font-style: normal;
+			font-weight: 300;
+			letter-spacing: -0.005em;
+			text-transform: capitalize;
+			text-align: center;
+		}
+
+		p {
+			font-family: Roboto;
+			font-style: normal;
+			font-weight: 300;
+			font-size: 1.1em;
+			letter-spacing: -0.005em;
+		}
+	}
+
+	@include respond-to('medium') {
+		grid-template-columns: 50% 50%;
+
+		&:nth-child(odd) {
+			grid-template-areas: 'image text';
+		}
+
+		&:nth-child(even) {
+			grid-template-areas: 'text image';
+		}
+	}
+}

src/stylesheets/main.scss

@@ -8,3 +8,4 @@
 
 @import 'components/homeNav';
 @import 'components/button';
+@import 'components/feature';

views/partials/feature.hbs

@@ -0,0 +1,7 @@
+<div class='feature'>
+	<img src='{{img}}' alt='{{alt}}'/>
+	<div class='feature__text'>
+		<h2 class='feature__title'>{{title}}</h2>
+		<p class='feature__content'>{{content}}</p>
+	</div>
+</div>