More CSS improvements for the carousel caption

css/printrun.css

@@ -267,8 +267,8 @@ h2 {
 -------------------------------------------------- */
 
 /* Carousel base class */
-.carousel {
-    height: 500px;
+.carousel, .carousel .item {
+    max-height: 500px;
 }
 /* Since positioning the image, we need to help out the caption */
 .carousel-caption {
@@ -276,6 +276,7 @@ h2 {
     width: 768px;
     margin-left: -384px;
     margin-right: auto;
+    padding-bottom: 30px;
     left: 50%;
     right: auto;
 }
@@ -324,10 +325,6 @@ h2 {
     border-width: 2px;
 }
 
-/* Declare heights because of positioning of img element */
-.carousel .item {
-    height: 500px;
-}
 .carousel-inner > .item > img {
     margin-left: auto;
     margin-right: auto;
@@ -348,8 +345,8 @@ h2 {
 
 @media (max-width: 768px) {
     .carousel-caption {
-        width: 600px;
-        margin-left: -300px;
+        width: 540px;
+        margin-left: -270px;
     }
 }