@import 'base';
/***** Multi Column Left Icon Variables *****/ /*Font Size*/ $general_size: 12px; $column_title_size: 16px;
/*Font Color*/ $color: #555;
/*Font Weight*/ $general_weight: 400; $column_title_weight: 500;
/***** Multi Column Left Icon Styles *****/
/*General Styles*/ .multi-column-wrapper {
font-size: $general_size; font-weight: $general_weight; color: $color; .title { h2 { padding-bottom: 0; } &.center { text-align: center; } &.left { text-align: left; } &.right { text-align: right; } } .multi-columns { margin-left: 0; margin-top: 36px; li.columns { list-style: none; .column-header { position: relative; display: block; text-decoration: none; .left-icon { position: absolute; display: block; width: 64px; } .column-title { font-size: $column_title_size; font-weight: $column_title_weight; margin-left: 84px; } } .column-content { margin-left: 84px; padding-top: 10px; } } }
} /*Media Queries*/ @include mobile-only{
.multi-column-wrapper { .multi-columns { margin-top: 28px; li.columns{ &:not(:first-child){ margin-top: 40px; } .column-header { .left-icon { width: 48px; } .column-title { margin-left: 68px; } } .column-content { margin-left: 68px; } } } }
}