html {
    --content-width:800px;

    --body-font: normal 1em Roboto, sans-serif;
    --body-background: #F5F4EF; 
    --body-inverse: #757168;

    --button-font: inherit; 
    --button-background: #E9E6DC;
    --button-inverse: #6A8244;
    --button-border: 1px solid transparent;
    --button-radius: 3px; 
    --button-padding: 8px 16px;
    --button-text-transform: uppercase; 

    --primary-background: #6A8244; 
    --primary-inverse: #F5F4EF; 
    --primary-border: 1px solid transparent;

    --label-font: normal smaller Roboto, sans-serif; 
    --label-background: #BFBAAC; 
    --label-inverse: #656055;
    --label-border: none; 
    --label-radius: 0px; 
    --label-padding: 0px 8px;
    --label-text-transform: lowercase; 

    --input-font: normal 1em Roboto, sans-serif;  
    --input-background: white; 
    --input-inverse: #757168; 
    --input-border: 1px solid #BFBAAC; 
    --input-radius: 3px; 
    --input-padding: 8px 8px;
    
    --shadow: 0px 0px 3px #303030;
    --alert-color:#8D3234;
    --caution-color: #ad7815; 
}

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, inputxß, 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; }
bright-card.table form { padding:4px; }
button:disabled { opacity: 0.2; }