You are here

Home » API reference » Varbase Bootstrap Paragraphs 8.7

vbp-default.base.css in Varbase Bootstrap Paragraphs 8.7

Same filename and directory in other branches
  1. 8.4 css/base/vbp-default.base.css
  2. 8.5 css/base/vbp-default.base.css
  3. 8.6 css/base/vbp-default.base.css
  4. 9.0.x css/base/vbp-default.base.css
.paragraph {
  margin-right: 0;
  margin-left: 0;
}

.paragraph > .paragraph__column {
  padding-bottom: calc(1.325rem + 0.9vw);
}

@media (min-width: 1200px) {
  .paragraph > .paragraph__column {
    padding-bottom: 2rem;
  }
}

.paragraph > .paragraph__column .paragraph > .paragraph__column {
  float: none;
}

.paragraph > .paragraph__column .paragraph > .paragraph__column .paragraph > .paragraph__column {
  float: none;
}

.paragraph > .paragraph__column div > .paragraph {
  right: 0;
  left: 0;
  width: 100%;
  margin-right: 0;
  margin-left: 0;
}

.paragraph > .paragraph__column > .tab-content > .tab-pane > .paragraph {
  right: 0;
  left: 0;
  width: 100%;
  margin-right: 0;
  margin-left: 0;
}

.paragraph .paragraph .bg-edge2edge,
.paragraph .paragraph.bg-edge2edge {
  position: initial;
  width: 100%;
  margin: 0;
}

.paragraph .paragraph .paragraph {
  position: initial;
  width: 100%;
  margin-right: 0;
  margin-left: 0;
}

.paragraph.paragraph--type--bp-columns .paragraph--type--bp-columns__5col {
  position: relative;
  min-height: 1px;
  padding-right: 0.9375rem;
  padding-left: 0.9375rem;
}

@media (min-width: 768px) {
  .paragraph.paragraph--type--bp-columns .paragraph--type--bp-columns__5col {
    float: left;
    width: 20%;
  }
}

.paragraph.paragraph--type--bp-columns .paragraph--type--bp-columns__6col {
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
}

@media (min-width: 768px) {
  .paragraph.paragraph--type--bp-columns .paragraph--type--bp-columns__6col {
    flex: 0 0 16.66667%;
    max-width: 16.66667%;
  }
}

.paragraph__column {
  padding: 0 calc(1.28125rem + 0.375vw);
}

@media (min-width: 1200px) {
  .paragraph__column {
    padding: 0 1.5625rem;
  }
}

.paragraph--type--bp-carousel .paragraph:last-of-type > .paragraph__column {
  padding-bottom: 0;
}

.paragraph--type--bp-columns .paragraph:last-of-type > .paragraph__column {
  padding-bottom: 0;
}

.paragraph--type--bp-columns-three-uneven .paragraph > .paragraph__column {
  padding-bottom: 0;
}

.paragraph--type--bp-tabs .paragraph:last-of-type > .paragraph__column {
  padding-bottom: 0;
}

.modal .modal-body .paragraph {
  position: initial;
  width: 100%;
  margin-right: 0;
  margin-left: 0;
}

.modal .modal-footer .paragraph {
  position: initial;
  width: 100%;
  margin-right: 0;
  margin-left: 0;
}

.paragraph--type--bp-columns__1col .paragraph.paragraph--width--narrow > .paragraph__column {
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
}

@media (min-width: 768px) {
  .paragraph--type--bp-columns__1col .paragraph.paragraph--width--narrow > .paragraph__column {
    flex: 0 0 50%;
    max-width: 50%;
    margin-left: 25%;
  }
}

@media (min-width: 992px) {
  .paragraph--type--bp-columns__1col .paragraph.paragraph--width--narrow > .paragraph__column {
    flex: 0 0 50%;
    max-width: 50%;
    margin-left: 25%;
  }
}

@media (min-width: 1200px) {
  .paragraph--type--bp-columns__1col .paragraph.paragraph--width--narrow > .paragraph__column {
    flex: 0 0 50%;
    max-width: 50%;
    margin-left: 25%;
  }
}

.background-style {
  background-repeat: no-repeat;
  background-size: cover;
}

File

css/base/vbp-default.base.css
View source 
  1. .paragraph {

  2.   margin-right: 0;

  3.   margin-left: 0;

  4. }

  5. 

  6. .paragraph > .paragraph__column {

  7.   padding-bottom: calc(1.325rem + 0.9vw);

  8. }

  9. 

  10. @media (min-width: 1200px) {

  11.   .paragraph > .paragraph__column {

  12.     padding-bottom: 2rem;

  13.   }

  14. }

  15. 

  16. .paragraph > .paragraph__column .paragraph > .paragraph__column {

  17.   float: none;

  18. }

  19. 

  20. .paragraph > .paragraph__column .paragraph > .paragraph__column .paragraph > .paragraph__column {

  21.   float: none;

  22. }

  23. 

  24. .paragraph > .paragraph__column div > .paragraph {

  25.   right: 0;

  26.   left: 0;

  27.   width: 100%;

  28.   margin-right: 0;

  29.   margin-left: 0;

  30. }

  31. 

  32. .paragraph > .paragraph__column > .tab-content > .tab-pane > .paragraph {

  33.   right: 0;

  34.   left: 0;

  35.   width: 100%;

  36.   margin-right: 0;

  37.   margin-left: 0;

  38. }

  39. 

  40. .paragraph .paragraph .bg-edge2edge,

  41. .paragraph .paragraph.bg-edge2edge {

  42.   position: initial;

  43.   width: 100%;

  44.   margin: 0;

  45. }

  46. 

  47. .paragraph .paragraph .paragraph {

  48.   position: initial;

  49.   width: 100%;

  50.   margin-right: 0;

  51.   margin-left: 0;

  52. }

  53. 

  54. .paragraph.paragraph--type--bp-columns .paragraph--type--bp-columns__5col {

  55.   position: relative;

  56.   min-height: 1px;

  57.   padding-right: 0.9375rem;

  58.   padding-left: 0.9375rem;

  59. }

  60. 

  61. @media (min-width: 768px) {

  62.   .paragraph.paragraph--type--bp-columns .paragraph--type--bp-columns__5col {

  63.     float: left;

  64.     width: 20%;

  65.   }

  66. }

  67. 

  68. .paragraph.paragraph--type--bp-columns .paragraph--type--bp-columns__6col {

  69.   position: relative;

  70.   width: 100%;

  71.   padding-right: 15px;

  72.   padding-left: 15px;

  73. }

  74. 

  75. @media (min-width: 768px) {

  76.   .paragraph.paragraph--type--bp-columns .paragraph--type--bp-columns__6col {

  77.     flex: 0 0 16.66667%;

  78.     max-width: 16.66667%;

  79.   }

  80. }

  81. 

  82. .paragraph__column {

  83.   padding: 0 calc(1.28125rem + 0.375vw);

  84. }

  85. 

  86. @media (min-width: 1200px) {

  87.   .paragraph__column {

  88.     padding: 0 1.5625rem;

  89.   }

  90. }

  91. 

  92. .paragraph--type--bp-carousel .paragraph:last-of-type > .paragraph__column {

  93.   padding-bottom: 0;

  94. }

  95. 

  96. .paragraph--type--bp-columns .paragraph:last-of-type > .paragraph__column {

  97.   padding-bottom: 0;

  98. }

  99. 

  100. .paragraph--type--bp-columns-three-uneven .paragraph > .paragraph__column {

  101.   padding-bottom: 0;

  102. }

  103. 

  104. .paragraph--type--bp-tabs .paragraph:last-of-type > .paragraph__column {

  105.   padding-bottom: 0;

  106. }

  107. 

  108. .modal .modal-body .paragraph {

  109.   position: initial;

  110.   width: 100%;

  111.   margin-right: 0;

  112.   margin-left: 0;

  113. }

  114. 

  115. .modal .modal-footer .paragraph {

  116.   position: initial;

  117.   width: 100%;

  118.   margin-right: 0;

  119.   margin-left: 0;

  120. }

  121. 

  122. .paragraph--type--bp-columns__1col .paragraph.paragraph--width--narrow > .paragraph__column {

  123.   position: relative;

  124.   width: 100%;

  125.   padding-right: 15px;

  126.   padding-left: 15px;

  127. }

  128. 

  129. @media (min-width: 768px) {

  130.   .paragraph--type--bp-columns__1col .paragraph.paragraph--width--narrow > .paragraph__column {

  131.     flex: 0 0 50%;

  132.     max-width: 50%;

  133.     margin-left: 25%;

  134.   }

  135. }

  136. 

  137. @media (min-width: 992px) {

  138.   .paragraph--type--bp-columns__1col .paragraph.paragraph--width--narrow > .paragraph__column {

  139.     flex: 0 0 50%;

  140.     max-width: 50%;

  141.     margin-left: 25%;

  142.   }

  143. }

  144. 

  145. @media (min-width: 1200px) {

  146.   .paragraph--type--bp-columns__1col .paragraph.paragraph--width--narrow > .paragraph__column {

  147.     flex: 0 0 50%;

  148.     max-width: 50%;

  149.     margin-left: 25%;

  150.   }

  151. }

  152. 

  153. .background-style {

  154.   background-repeat: no-repeat;

  155.   background-size: cover;

  156. }