// --------------------------------------------------
// This file contains all styles for all pages.
// --------------------------------------------------

html {
    background: $color-white;
    color: var(--primary-color);
    font-family: $font-text;
    @media (max-width: $to-tiny) {
        font-size: $font-size;
    }
    @media (min-width: $to-tiny) and (max-width: $to-small) {
        font-size: $font-tiny;
    }
    @media (min-width: $from-small) and (max-width: $to-medium) {
        font-size: $font-small;
    }
    @media (min-width: $from-medium) and (max-width: $to-large) {
        font-size: $font-medium;
    }
    @media (min-width: $from-large) and (max-width: $to-big) {
        font-size: $font-large;
    }
    @media (min-width: $from-big) and (max-width: $to-huge) {
        font-size: $font-big;
    }
    @media (min-width: $from-huge) and (max-width: $to-enormous) {
        font-size: $font-huge;
    }
    @media (min-width: $from-enormous) and (max-width: $to-gigantic) {
        font-size: $font-enormous;
    }
    @media (min-width: $from-gigantic) and (max-width: $to-colossal) {
        font-size: $font-gigantic;
    }
    @media (min-width: $from-colossal) {
        font-size: $font-colossal;
    }
}