@import './colors', './fonts', './fontSizeCalculator';

// Source Sans Pro
@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600,700,600italic,400italic,700italic);

html { font-size: 100%; }
    body {
        color: color(color);
        font-family: $fontFamily;
        font-size: em(16px);
        -moz-osx-font-smoothing: grayscale;
        -webkit-font-smoothing: antialiased;
        font-weight: $fontWeightRegular;
        //letter-spacing: .7px;
        line-height: 1.375;
    }
        //Links
        a {
            color: color(colorLink);
            cursor: pointer;
            font-weight: $fontWeightSemiBold;
            text-decoration: none;
        }
        // Text/Element Selection Highlight
        ::selection { background: color(colorLink); color: color(colorInverse); }
        // Text Colors
        .color-alert { color: color(colorAlert); }
        .color-disable { color: color(colorDisable); }
        .color-highlight { color: color(colorHighlight); }
        .color-inverse { color: color(colorInverse); }
        .color-link { color: color(colorLink); }
        .color-static { color: color(colorStatic); }
        .color-success { color: color(colorSuccess); }
        .color-text { color: color(color); }
        .color-warning { color: color(colorWarning); }
        // Font Sizes
        .font-size-xlarge { font-size: em(24px); }
        .font-size-large { font-size: em(20px); }
        .font-size-medium { font-size: em(18px); }
        .font-size-small { font-size: em(16px); }
        .font-size-xsmall { font-size: em(14px); }
        .font-size-xxsmall { font-size: em(12px); }
        // Font Weights
        .font-weight-normal { font-weight: $fontWeightRegular; }
        .font-weight-semibold { font-weight: $fontWeightSemiBold; }
        .font-weight-bold { font-weight: $fontWeightBold; }
        // Text Decoration
        .text-decoration-underline { border-bottom: 2px solid color(borderColorQuinary); display: inline-block; padding: 0 0 5px; }
        a.text-decoration-underline { border-bottom-color: color(borderColorHighlight); }
        // Label
        .label { color: color(colorStatic); display: block; font-size: em(14px); }
        // Code e.g. .im-a-selector
        code {
            background-color: #f9f0ed;
            border-radius: 4px;
            color: color(colorCode);
            font-size: 90%;
            padding: 2px 4px;
        }