1.item { 2 @include flexbox(); 3 @include media-breakpoint-down(md) { 4 @include flex-direction(column); 5 } 6} 7 8.item__image { 9 margin-right: map-get($spacers, 3); 10 & + .item__content { 11 & > :first-child { 12 margin-top: 0; 13 & > :first-child { 14 margin-top: 0; 15 } 16 } 17 } 18 @include media-breakpoint-down(md) { 19 margin-right: 0; 20 } 21} 22 23.item__content { 24 @include flex(1); 25 min-width: 0; 26} 27 28a > .item__header, a.item__header, .item__header > a { 29 @include link-colors($text-color-d, $main-color-1); 30} 31 32.item__meta { 33 color: $text-color-l; 34} 35 36.item__description { 37 &, .article__content { 38 font-size: map-get($base, font-size-sm); 39 line-height: map-get($base, line-height); 40 @include block-elements() { 41 margin-top: map-get($spacers, 2); 42 margin-bottom: map-get($spacers, 2); 43 } 44 @include heading-elements() { 45 margin-top: map-get($spacers, 3); 46 } 47 h1, h2, h3 { 48 color: $text-color; 49 } 50 h1, h2 { 51 padding: 0; 52 border: none; 53 } 54 h1 { 55 font-size: map-get($base, font-size-h1-xs); 56 } 57 h2 { 58 font-size: map-get($base, font-size-h2-xs); 59 } 60 h3 { 61 font-size: map-get($base, font-size-h3-xs); 62 } 63 h4 { 64 font-size: map-get($base, font-size-h4-xs); 65 } 66 h5 { 67 font-size: map-get($base, font-size-h5-xs); 68 } 69 h6 { 70 font-size: map-get($base, font-size-h6-xs); 71 } 72 img { 73 max-height: 32rem; 74 @include media-breakpoint-down(md) { 75 max-height: 14rem; 76 } 77 } 78 } 79} 80 81.items { 82 & > .item { 83 &:not(:last-child) { 84 margin-bottom: map-get($spacers, 2); 85 } 86 } 87} 88 89.items--divided { 90 & > .item { 91 &:not(:first-child) { 92 padding-top: map-get($spacers, 4); 93 } 94 &:not(:last-child) { 95 padding-bottom: map-get($spacers, 4); 96 @include split-line(bottom); 97 } 98 list-style-type: none; 99 } 100}