static/scss/bootstrap-4.0.0-alpha.6/docs/assets/scss/_page-header.scss

   1 // scss-lint:disable ImportantRule
   2
   3 .bd-pageheader {
   4   padding: 2rem ($grid-gutter-width-base / 2);
   5   margin-bottom: 1.5rem;
   6   color: $bd-purple-light;
   7   text-align: center;
   8   background-color: $bd-purple;
   9
  10   .container {
  11     position: relative;
  12   }
  13
  14   h1 {
  15     font-size: 3rem;
  16     font-weight: normal;
  17     color: #fff;
  18   }
  19
  20   p {
  21     margin-bottom: 0;
  22     font-size: 1.25rem;
  23     font-weight: 300;
  24   }
  25
  26   @include media-breakpoint-up(sm) {
  27     padding-top: 4rem;
  28     padding-bottom: 4rem;
  29     margin-bottom: 3rem;
  30     text-align: left;
  31
  32     .carbonad {
  33       margin: 2rem 0 0 !important;
  34     }
  35   }
  36
  37   @include media-breakpoint-up(md) {
  38     h1 {
  39       font-size: 4rem;
  40     }
  41
  42     p {
  43       font-size: 1.5rem;
  44     }
  45   }
  46
  47   @include media-breakpoint-up(lg) {
  48     h1,
  49     p {
  50       margin-right: 380px;
  51     }
  52
  53     .carbonad {
  54       position: absolute;
  55       top: 0;
  56       right: .75rem; // offset from the .container's padding
  57       margin: 0 !important;
  58     }
  59   }
  60 }