content_page.less 2.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. /*
  2. Styling for content pages
  3. Including: about, home, blog, /for/__, legal, contact, portals
  4. */
  5. .content-page {
  6. word-break: break-word;
  7. a:not(.btn) {
  8. color: @link-color-alt;
  9. &:hover {
  10. color: @link-hover-color-alt;
  11. }
  12. }
  13. hr {
  14. border-color: @hr-border-alt;
  15. }
  16. .quote-by {
  17. min-width: 80px;
  18. overflow: hidden;
  19. }
  20. .page-header {
  21. margin-top: 0;
  22. }
  23. /*
  24. section
  25. */
  26. section {
  27. padding: @line-height-computed (@grid-gutter-width / 2);
  28. &.color-block {
  29. &.green-dark {
  30. background-color: @ol-dark-green;
  31. }
  32. &.green {
  33. background-color: @ol-green;
  34. }
  35. &.blue-gray-dark {
  36. background-color: @ol-blue-gray-5;
  37. }
  38. &.blue-gray-light {
  39. background-color: @ol-blue-gray-1;
  40. }
  41. }
  42. .section-row {
  43. margin: 0 auto;
  44. /* match .col-sm-10 */
  45. /* @grid-gutter-width is used for margins */
  46. max-width: (@screen-sm * (10/12)) - @grid-gutter-width;
  47. @media (min-width: @screen-md-min) {
  48. max-width: (@screen-md * (10/12)) - @grid-gutter-width;
  49. }
  50. @media (min-width: @screen-lg-min) {
  51. max-width: (@screen-lg * (10/12)) - @grid-gutter-width;
  52. }
  53. }
  54. }
  55. .content-container > section:first-child {
  56. /* header */
  57. padding-bottom: 0;
  58. padding-top: 0;
  59. }
  60. .content-container > section:nth-child(2) {
  61. /* first content section */
  62. padding-top: 0;
  63. }
  64. section.no-top-padding {
  65. /* opt out of padding via the CMS */
  66. padding-top: 0;
  67. }
  68. .container-small {
  69. section .section-row {
  70. /* match col-sm-8 */
  71. /* @grid-gutter-width is used for margins */
  72. max-width: (@screen-sm * (8/12)) - @grid-gutter-width;
  73. @media (min-width: @screen-md-min) {
  74. max-width: (@screen-md * (8/12)) - @grid-gutter-width;
  75. }
  76. @media (min-width: @screen-lg-min) {
  77. max-width: (@screen-lg * (8/12)) - @grid-gutter-width;
  78. }
  79. }
  80. }
  81. /*
  82. lists
  83. */
  84. .list-without-style {
  85. list-style: none;
  86. margin: 0;
  87. padding: 0;
  88. }
  89. }