:root {
    /* Colors */
    --grayLightest: #e9ecef;
    --grayLighter: #dee2e6;
    --grayLight: #ced4da;
    --grayMediumLight: #adb5bd;
    --gray: #6c757d;
    --grayMediumDark: #5a6268;
    --grayDark: #495057;
    --grayDarker: #343a40;
    --grayDarkest: #212529;
    --red: #dc3545;
    --redDark: #c82333;
    --green: #28a745;
    --greenDark: #218838;
    --gold: #C78228;
    --goldDark: #B5711F;
    --goldDarker: #A8610A;
    --purple: #8079D6;
    --textColor: #262726;

    /* Sizes */
    --spacing: 24px;
    --small: 14px;
    --xsmall: 12px;
    --xxsmall: 10px;
    --xxxsmall: 8px;
    --medium: 18px;
    --large: 24px;
    --xlarge: 32px;
    --xxlarge: 48px;
    --xxxlarge: 64px;

    /* Others */
    --transition: all 0.3s ease-in-out;
    --shadowFloor: 0 8px 6px -6px var(--grayDarker);
}

/* Helpers */
.bg-white{ background-color: white !important; }

.txt-white{ color: white !important; }

.uppercase{ text-transform: uppercase !important; }
.lowercase{ text-transform: lowercase !important; }
.cursor-pointer{ cursor: pointer !important; }
.overflow-hidden{ overflow: hidden !important; }

/* UiKit */

/* Structure */
* {
    box-sizing: border-box;
}

html, body, h1, h2, h3, h4, h5, h6, p, a, button, input, select, textarea {
    font-family: 'Montserrat', sans-serif !important;
    color: var(--textColor);
}

body {
    background-color: var(--grayLightest);
}
