/// /// Stellar by HTML5 UP /// html5up.net | @ajlkn /// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) ///

/* Statistics */

.statistics {
        @include vendor('display', 'flex');
        width: 100%;
        margin: 0 0 (_size(element-margin) * 1.5) 0;
        padding: 0;
        list-style: none;
        cursor: default;
        li {
                @include vendor('flex', '1');
                padding: 1.5em;
                color: _palette(fg-bold);
                text-align: center;
                &.style1 {
                        background-color: _palette(accent1);
                }
                &.style2 {
                        background-color: _palette(accent2);
                }
                &.style3 {
                        background-color: _palette(accent3);
                }
                &.style4 {
                        background-color: _palette(accent4);
                }
                &.style5 {
                        background-color: _palette(accent5);
                }
                strong, b {
                        display: block;
                        font-size: 2em;
                        line-height: 1.1;
                        color: inherit !important;
                        font-weight: _font(weight);
                        letter-spacing: _font(letter-spacing);
                }
                &:first-child {
                        border-top-left-radius: _size(border-radius);
                        border-bottom-left-radius: _size(border-radius);
                }
                &:last-child {
                        border-top-right-radius: _size(border-radius);
                        border-bottom-right-radius: _size(border-radius);
                }
                .icon {
                        display: inline-block;
                        &:before {
                                font-size: 2.75rem;
                                line-height: 1.3;
                        }
                }
        }
        @include breakpoint('<=medium') {
                li {
                        strong, b {
                                font-size: 1.5em;
                        }
                }
        }
        @include breakpoint('<=small') {
                display: block;
                width: 20em;
                max-width: 100%;
                margin: 0 auto _size(element-margin) auto;
                li {
                        &:first-child {
                                border-bottom-left-radius: 0;
                                border-top-right-radius: _size(border-radius);
                        }
                        &:last-child {
                                border-top-right-radius: 0;
                                border-bottom-left-radius: _size(border-radius);
                        }
                        .icon {
                                &:before {
                                        font-size: 3.75rem;
                                }
                        }
                        strong, b {
                                font-size: 2.5em;
                        }
                }
        }
}