Difference between revisions of "Team:British Columbia/Format/CarouselCSS"
Line 117: | Line 117: | ||
margin-top: 120px; | margin-top: 120px; | ||
} | } | ||
+ | |||
+ | /* Back to top */ | ||
+ | |||
+ | .back-to-top { | ||
+ | background: none; | ||
+ | margin: 0; | ||
+ | position: fixed; | ||
+ | bottom: 0; | ||
+ | right: 0; | ||
+ | width: 70px; | ||
+ | height: 70px; | ||
+ | z-index: 100; | ||
+ | display: none; | ||
+ | text-decoration: none; | ||
+ | color: #ffffff; | ||
+ | background-color: #ff9000; | ||
+ | } | ||
+ | |||
+ | .back-to-top i { | ||
+ | font-size: 60px; | ||
+ | } |
Revision as of 23:08, 31 March 2015
/* GLOBAL STYLES
*/
/* Padding below the footer and lighter body text */
body {
padding-top: 48px; padding-bottom: 40px; color: #5a5a5a;
}
/* CUSTOMIZE THE NAVBAR
*/
/* Special class on .container surrounding .navbar, used for positioning it into place. */ .navbar {
margin-top: 16px;
}
/* CUSTOMIZE THE CAROUSEL
*/
/* Carousel base class */ .carousel {
height: 500px; margin-bottom: 60px; margin-top: -8px;
} /* Since positioning the image, we need to help out the caption */ .carousel-caption {
z-index: 10;
}
/* Declare heights because of positioning of img element */ .carousel .item {
height: 500px; background-color: #FFFFFF;
} .carousel-inner > .item > img {
min-width: auto%; height: 500px;
/* control colour */
.carousel-control {
color: #000000;
}
/* MARKETING CONTENT
*/
/* Center align the text within the three columns below the carousel */ .marketing .col-lg-4 {
margin-bottom: 20px; text-align: center;
} .marketing h2 {
font-weight: normal;
} .marketing .col-lg-4 p {
margin-right: 10px; margin-left: 10px;
}
/* Featurettes
*/
.featurette-divider {
margin: 80px 0; /* Space out the Bootstrapmore */
}
/* Thin out the marketing headings */ .featurette-heading {
font-weight: 300; line-height: 1; letter-spacing: -1px;
}
/* RESPONSIVE CSS
*/
@media (min-width: 768px) {
/* Navbar positioning foo */ .navbar-wrapper { margin-top: 20px; } .navbar-wrapper .container { padding-right: 15px; padding-left: 15px; } .navbar-wrapper .navbar { padding-right: 0; padding-left: 0; }
/* The navbar becomes detached from the top, so we round the corners */ .navbar-wrapper .navbar { border-radius: 4px; }
/* Bump up size of carousel content */ .carousel-caption p { margin-bottom: 20px; font-size: 21px; line-height: 1.4; }
.featurette-heading { font-size: 50px; }
}
@media (min-width: 992px) {
.featurette-heading { margin-top: 120px; }
/* Back to top */
.back-to-top { background: none; margin: 0; position: fixed; bottom: 0; right: 0; width: 70px; height: 70px; z-index: 100; display: none; text-decoration: none; color: #ffffff; background-color: #ff9000; }
.back-to-top i {
font-size: 60px;
}