.list { padding-left: 0; &, &-item { list-style: none; .list-icon { display: inline-block; margin-bottom: $spacer * 0.6; } } &_plain &-item:not(.col) { padding-left: 0; } &_bullets &-item { padding-left: 1rem; position: relative; &:before { color: $primary-light; content: '\2022'; left: 0; position: absolute; font-size: 1.75rem; line-height: $line-height-base * 1rem; } } } .icon-list { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; &-item { padding: ($spacer * 1) ($spacer * 1.5); @media (min-width: $screen-lg){ padding: ($spacer * 1.4) ($spacer * 2.2); } } &_inline &-item { padding: ($spacer * 1) ($spacer * 0.5); @media (min-width: $screen-lg){ padding: ($spacer * 1) ($spacer * 0.75); } } } .card-list { @extend .row; margin-top: $spacer * 3; overflow: hidden; &-item { @extend .col; display: flex; flex-direction: column; margin-bottom: $spacer * 3; margin-top: $spacer * 2; width: 100%; flex: 0 0 auto; flex-wrap: wrap; .container { padding-bottom: 0; padding-top: $spacer; padding-left: 0; flex: 1 0 auto; display: flex; flex-direction: column; &:first-child { padding-bottom: 60px; padding-top: 60px; padding-left: $spacer * 2; padding-right: $spacer * 2; background-color: $secondary; display: flex; flex-direction: column; justify-content: center; } .btn-link:last-child{ padding-bottom: 0; position: relative; top: 6px; } } .image-block { height: 240px; display: block; position: relative; text-align: center; overflow: hidden; padding: 0; img { width: auto; object-fit: cover; min-height: 240px; position: absolute; top: 50%; left: 50%; transform: translate3d(-50%,-50%,0); } } .headline-caption { font-size: $font-size-base; margin-bottom: $spacer * 0.75; } &:nth-child(odd) .container:first-child{ background-color: $pink; } @media (min-width: $screen-sm) { width: 50%; .container:first-child { padding-top: 80px; padding-bottom: 80px; } } @media (min-width: $screen-lg){ width: 33.33%; } @media (min-width: $screen-xl){ .container:first-child { padding-top: 100px; padding-bottom: 100px; } } } }