Index: includes/index/style.html
===================================================================
--- a/includes/index/style.html
+++ b/includes/index/style.html
@@ -69,9 +69,66 @@
@media (min-width: 930px)
{
#media small
{
display: none;
}
}
+/*
+ * Hero section
+ */
+
+#hero > div
+{
+ position: relative;
+ padding: 0;
+}
+
+#hero img
+{
+ display: block;
+ width: 100%;
+}
+
+#hero h1
+{
+ position: absolute;
+ right: 0;
+ bottom: 0;
+ width: 100%;
+ padding: 10px;
+ background-color: #fff;
+ text-transform: uppercase;
+ font-size: 18px;
+ font-weight: 300;
+ box-sizing: border-box;
+}
+
+@media (min-width: 350px)
+{
+ #hero h1
+ {
+ width: 80%;
+ }
+}
+
+@media (min-width: 450px)
+{
+ #hero h1
+ {
+ width: 60%;
+ font-size: 20px;
+ }
+}
+
+@media (min-width: 800px)
+{
+ #hero h1
+ {
+ padding: 15px;
+ width: 39%;
+ font-size: 22px;
+ }
+}
+