@import 'constants';
@import 'styling';

.counter {
	@include counter-base;

	& > .value {
	  font-size: $counter-value-font-size;
	  font-weight: $counter-value-font-weight;
	  line-height: $counter-value-line-height;
	  color: $color-black;
	  text-transform: uppercase;
	  text-align: center;
	}

	& > .description {
	  font-size: $counter-desc-font-size;
	  font-weight: $counter-desc-font-weight;
	  color: $color-black;
	  text-transform: uppercase;
	  text-align: center;
	}

	@each $size, $fontSize in $counter-font-sizing-list {
        &.#{$size} {
        	& > .value {
				font-size: $fontSize;
        	}
        }
    }

}