Add responsive font sizing for the index page caption box (OperationCode#528)

spoonref · rickr · commit 9834c05062bf · 2016-10-05T11:15:38.000-04:00
Add responsive font sizing for the index page caption box
diff --git a/app/assets/stylesheets/application.css.scss b/app/assets/stylesheets/application.css.scss
@@ -22,12 +22,24 @@ nav ul li a {
 // Fix vertical alignment in main page slider
 .slider .slides li .caption {
   color: #fff;
-  left: 15%;
+  left: 10%;
   opacity: 0;
   position: absolute;
   top: 40% !important;
-  width: 65%;
+  width: 80%;
   text-shadow: 1px 1px 7px #000000;
+  @media only screen and (min-width: 992px){
+    left: 15%;
+    width: 65%;
+  }
+  h3{
+    font-size: 2.2rem;
+    line-height:120%;
+    @media only screen and (min-width: 992px){
+      font-size: 2.92rem;
+      line-height:110%;
+    }
+  }
 }
 
 // Hacks to use fa icons with materialize
