Add style sheet for front page, and copy styling from test.

1 files changed, 80 insertions, 0 deletions

diff --git a/front.scss b/front.scss
new file mode 100644
index 0000000..e62cf19
--- /dev/null
+++ b/front.scss
@@ -0,0 +1,80 @@
+@import 'h5bp/helpers';
+@import 'compass/css3';
+@import "partials/base";
+
+#content {
+	width: 96%;
+	max-width: none;
+	margin: 2%;
+}
+
+.inlinepage {
+	position: relative;
+//set to make inline header position work
+	border: 0;
+	padding: 0;
+	margin: 0 0 1em 0;
+	background-color: transparent;
+	height: 15em;
+	overflow: hidden;
+}
+
+//set to annull style.css
+.inlinecontent {
+	margin-top: 0;
+}
+
+.inlineheader {
+	display: block;
+	position: absolute;
+	bottom: 0;
+	left: 0;
+	width: 100%;
+	a {
+		font-weight: normal;
+		color: white;
+		background-color: #6699cc;
+		display: block;
+		padding: 0.5em;
+		opacity: 0.8;
+	}
+}
+
+
+.inlinecontent p {
+	margin-bottom: 0;
+	margin-top: 0;
+}
+
+.inlinefooter,
+.inlineheader .author,
+.sidebar,
+.farbar {
+	@include h5bp-hidden;
+}
+
+//Responsive design
+@media screen and (max-width: 480px) {
+	#content {
+		width: 100%;
+		margin: 0;
+	}
+	.columns {
+		@include column-count(1);
+	}
+	.inlinepage {
+		margin: 0;
+	}
+}
+
+@media screen and (min-width: 480px) and (max-width: 700px) {
+	.columns {
+		@include column-count(2);
+	}
+}
+
+@media screen and (min-width: 701px) {
+	.columns {
+		@include column-count(3);
+	}
+}