/* Special class on .container surrounding .navbar, used for positioning it into place. */
.navbar-wrapper {
- position: relative;
- z-index: 15;
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ z-index: 20;
+}
+
+/* Flip around the padding for proper display in narrow viewports */
+.navbar-wrapper .container {
+ padding-left: 0;
+ padding-right: 0;
+}
+.navbar-wrapper .navbar {
+ padding-left: 15px;
+ padding-right: 15px;
}
/* Carousel base class */
.carousel {
+ height: 500px;
margin-bottom: 60px;
-
- /* Negative margin to pull up carousel. 90px is roughly margins and height of navbar. */
- margin-top: -90px;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
.navbar-wrapper {
margin-top: 20px;
}
+ .navbar-wrapper .container {
+ padding-left: 15px;
+ padding-right: 15px;
+ }
+ .navbar-wrapper .navbar {
+ padding-left: 0;
+ padding-right: 0;
+ }
+
/* The navbar becomes detached from the top, so we round the corners */
.navbar-wrapper .navbar {
border-radius: 4px;