html {
    --blackish: #333231; 
    --whitish: #F5F4EF; 
    --ghost: #E9E6DC;
    --line-border: #BFBAAC;
    --skrim-hover: #E3E0D6; 
    --primary-light: #B3B0AA;
    --secondary-light: #BDC9AA;
    --tertiary-light: #E1E3D6; 
    --primary: #36332D;
    --secondary:#6A8244;
    --tertiary: #757168; 
    --alert: #8D3234;
    --caution: #CCA031; 
    --shadow: 0px 0px 3px #303030;

    --title-size: 24px;
    --subheader-size: 16px;
    --body2-size: 14px;
    --body1-size: 14px; 
    --caption-size: 10px;
    --button-size: 14px;

    --title-weight:500;
    --subheader-weight:500;
    --body2-weight:500;
    --body1-weight:400;
    --caption-weight:400;
    --button-weight:500;
}

html, body { margin: 0; height: 100%; width: 100%; background-color:var(--whitish); }
html, body, textarea, input { font-family: Roboto, sans-serif; font-size:var(--body1-size); font-weight:var(--body1-weight); color:var(--blackish); }
textarea, input, select { padding:0px 8px; font-size:1em; flex:1 1 260px; font-family: Roboto, Arial, Helvetica, sans-serif; color:var(--blackish); border: 1px solid var(--line-border); border-radius:2px; box-sizing:border-box; margin: 0px 4px 4px 0px; background-color:white; }
input, select { height:36px; }
input:focus, textarea:focus, select:focus { border: 1px solid gray; outline:none; }
input, select, textarea { -webkit-appearance: none; -moz-appearance: none; appearance: none; }
::placeholder { color:var(--blackish); opacity:0.5; }
.title { font-size: var(--title-size); font-weight:var(--title-weight); }
.subheader { line-height:1.4em; font-size:var(--subheader-size); font-weight: var(--subheader-weight); }
.body2 { font-size:var(--body2-size); font-weight: var(--body2-weight); }
.body1 { font-size:var(--body1-size); font-weight: var(--body1-weight); }
.caption { font-size:var(--caption-size); font-weight: var(--caption-weight); }
.button { padding:12px; border-radius:3px; background-color:var(--secondary); color:white; border:none; text-transform:uppercase; font-size:var(--button-size); font-weight: var(--button-weight); }
a { text-decoration:none; }
::-webkit-scrollbar { width:8px; }
::-webkit-scrollbar-track { background: var(--whitish); }
::-webkit-scrollbar-thumb { background-color: var(--line-border); border-radius:4px; }