_bullets.scss 990 B

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. .bullets {
  2. margin: $leading-margin 0;
  3. margin-left: -$leading-margin / 2;
  4. margin-right: -$leading-margin / 2;
  5. overflow: auto;
  6. }
  7. .bullet {
  8. float: left;
  9. padding: 0 $leading-margin / 2;
  10. }
  11. .two-column-bullet {
  12. @include columns(2);
  13. @include breakpoint(mobile-only) {
  14. @include columns(1);
  15. }
  16. }
  17. .three-column-bullet {
  18. @include columns(3);
  19. @include breakpoint(mobile-only) {
  20. @include columns(1);
  21. }
  22. }
  23. .four-column-bullet {
  24. @include columns(4);
  25. @include breakpoint(mobile-only) {
  26. @include columns(1);
  27. }
  28. }
  29. .bullet-icon {
  30. float: left;
  31. background: $bullet-icon-color-1;
  32. padding: $bullet-icon-size / 4;
  33. width: $bullet-icon-size;
  34. height: $bullet-icon-size;
  35. border-radius: 50%;
  36. color: $white;
  37. font-size: $bullet-icon-size / 2;
  38. text-align: center;
  39. }
  40. .bullet-icon-1 {
  41. background: $bullet-icon-color-1;
  42. }
  43. .bullet-icon-2 {
  44. background: $bullet-icon-color-2;
  45. }
  46. .bullet-icon-3 {
  47. background: $bullet-icon-color-3;
  48. }
  49. .bullet-content {
  50. margin-left: $bullet-icon-size * 1.3;
  51. }