|
|
| (6 intermediate revisions by the same user not shown) |
| Line 1: |
Line 1: |
| − | /* 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: 48px;
| |
| − |
| |
| − | }
| |
| − | /* 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 Bootstrap <hr> more */
| |
| − | }
| |
| − |
| |
| − | /* 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;
| |
| − | }
| |
| − |
| |
| − | /* TABS info */
| |
| − |
| |
| − | .tabs-below > .nav-tabs,
| |
| − | .tabs-right > .nav-tabs,
| |
| − | .tabs-left > .nav-tabs {
| |
| − | border-bottom: 0;
| |
| − | }
| |
| − |
| |
| − | .tab-content > .tab-pane,
| |
| − | .pill-content > .pill-pane {
| |
| − | display: none;
| |
| − | }
| |
| − |
| |
| − | .tab-content > .active,
| |
| − | .pill-content > .active {
| |
| − | display: block;
| |
| − | }
| |
| − |
| |
| − | .tabs-below > .nav-tabs {
| |
| − | border-top: 1px solid #ddd;
| |
| − | }
| |
| − |
| |
| − | .tabs-below > .nav-tabs > li {
| |
| − | margin-top: -1px;
| |
| − | margin-bottom: 0;
| |
| − | }
| |
| − |
| |
| − | .tabs-below > .nav-tabs > li > a {
| |
| − | -webkit-border-radius: 0 0 4px 4px;
| |
| − | -moz-border-radius: 0 0 4px 4px;
| |
| − | border-radius: 0 0 4px 4px;
| |
| − | }
| |
| − |
| |
| − | .tabs-below > .nav-tabs > li > a:hover,
| |
| − | .tabs-below > .nav-tabs > li > a:focus {
| |
| − | border-top-color: #ddd;
| |
| − | border-bottom-color: transparent;
| |
| − | }
| |
| − |
| |
| − | .tabs-below > .nav-tabs > .active > a,
| |
| − | .tabs-below > .nav-tabs > .active > a:hover,
| |
| − | .tabs-below > .nav-tabs > .active > a:focus {
| |
| − | border-color: transparent #ddd #ddd #ddd;
| |
| − | }
| |
| − |
| |
| − | .tabs-left > .nav-tabs > li,
| |
| − | .tabs-right > .nav-tabs > li {
| |
| − | float: none;
| |
| − | }
| |
| − |
| |
| − | .tabs-left > .nav-tabs > li > a,
| |
| − | .tabs-right > .nav-tabs > li > a {
| |
| − | min-width: 74px;
| |
| − | margin-right: 0;
| |
| − | margin-bottom: 3px;
| |
| − | }
| |
| − |
| |
| − | .tabs-left > .nav-tabs {
| |
| − | float: left;
| |
| − | margin-right: 19px;
| |
| − | border-right: 1px solid #ddd;
| |
| − | }
| |
| − |
| |
| − | .tabs-left > .nav-tabs > li > a {
| |
| − | margin-right: -1px;
| |
| − | -webkit-border-radius: 4px 0 0 4px;
| |
| − | -moz-border-radius: 4px 0 0 4px;
| |
| − | border-radius: 4px 0 0 4px;
| |
| − | }
| |
| − |
| |
| − | .tabs-left > .nav-tabs > li > a:hover,
| |
| − | .tabs-left > .nav-tabs > li > a:focus {
| |
| − | border-color: #eeeeee #dddddd #eeeeee #eeeeee;
| |
| − | }
| |
| − |
| |
| − | .tabs-left > .nav-tabs .active > a,
| |
| − | .tabs-left > .nav-tabs .active > a:hover,
| |
| − | .tabs-left > .nav-tabs .active > a:focus {
| |
| − | border-color: #ddd transparent #ddd #ddd;
| |
| − | *border-right-color: #ffffff;
| |
| − | }
| |
| − |
| |
| − | .tabs-right > .nav-tabs {
| |
| − | float: right;
| |
| − | margin-left: 19px;
| |
| − | border-left: 1px solid #ddd;
| |
| − | }
| |
| − |
| |
| − | .tabs-right > .nav-tabs > li > a {
| |
| − | margin-left: -1px;
| |
| − | -webkit-border-radius: 0 4px 4px 0;
| |
| − | -moz-border-radius: 0 4px 4px 0;
| |
| − | border-radius: 0 4px 4px 0;
| |
| − | }
| |
| − |
| |
| − | .tabs-right > .nav-tabs > li > a:hover,
| |
| − | .tabs-right > .nav-tabs > li > a:focus {
| |
| − | border-color: #eeeeee #eeeeee #eeeeee #dddddd;
| |
| − | }
| |
| − |
| |
| − | .tabs-right > .nav-tabs .active > a,
| |
| − | .tabs-right > .nav-tabs .active > a:hover,
| |
| − | .tabs-right > .nav-tabs .active > a:focus {
| |
| − | border-color: #ddd #ddd #ddd transparent;
| |
| − | *border-left-color: #ffffff;
| |
| − | }
| |