:root {
  --pageBg:#f5f5f5;
  --cardBg:#fff;
  --pageTxt:#000;
  --theme:#2F6F6B;
  --themeAlt:#AEE6E2;
  --themeLight:#DBEEED;/*#D5E2E1;*/
  --alert:#b33f00;
  --error:#C10D00;
  --errorBg:#FFEBEE;
  --success:#256b29;
  --successBg:#DCEDC8;
  --line: 1px solid #ddd;
  --lineAlt: 1px solid #aaa;
  --linePopup: none;
  --txt:#333;
  --txtAlt:#6b6b6b;
  --bg:#333;
  --bgAlt:#eee;
  --spacing:15px;
  --coverBase:linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,1) 90%); /*pageBg*/
  --coverBaseAlt:linear-gradient(to bottom, rgba(238,238,238,0), rgba(238,238,238,1) 90%); /*bgAlt*/
  --coverLink:linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,1) 90%);
  --coverLinkAlt:linear-gradient(to right, rgba(238,238,238,0), rgba(238,238,238,1) 90%);
  --coverLinkTheme:linear-gradient(to right, rgba(219,238,237,0), rgba(219,238,237,1) 90%);
  --cardShadow: 0 2px 10px 0 rgba(0,0,0,.1);
  --shadowPopup:10px 10px 20px 0 rgba(0,0,0,.3);
  --shadow-1: inset 1px 1px 2px 0 rgba(0,0,0,.1);
  --selectedBg:var(--themeAlt);
  --selectedTxt:var(--txt);
  --hoverBg:var(--bgAlt);
  --controlBorder:#aaa;
  --fieldLabel:#666;
  --messageRadius:8px;
  --transition: cubic-bezier(0.7,0,.3,1);
}
/* DARK MODE */
@media (prefers-color-scheme: dark) {
  :root {
    --controlBorder:#666;
    --fieldLabel:#aaa;
    --pageBg:#121212;
    --cardBg:#212121;
    --pageTxt:#fff;
    --theme:#6DB7B2;
    --themeAlt:#3F6461;
    --themeLight:#002D29;/*#00524C;*/
    --alert:#C97800;
    --error:#ffaaa4;
    --errorBg:#382120;
    --success:#E8F5E9;
    --successBg:#004D40;
    --line: 1px solid #333;
    --lineAlt: 1px solid #333;
    --linePopup: 1px solid #333;
    --txt:#ccc;
    --selectedTxt:#e0e0e0;
    --txtAlt:#aaa;
    --bg:#999;
    --bgAlt:#333;
    --coverBase:linear-gradient(to bottom, rgba(33,33,33,0), rgba(33,33,33,1) 90%); /*pageBg*/
    --coverBaseAlt:linear-gradient(to bottom, rgba(51,51,51,0), rgba(51,51,51,1) 90%); /*bgAlt*/
    --coverLink:linear-gradient(to right, rgba(33,33,33,0), rgba(33,33,33,1) 90%);
    --coverLinkAlt:linear-gradient(to right, rgba(51,51,51,0), rgba(51,51,51,1) 90%); /*bgAlt*/
    --coverLinkTheme:linear-gradient(to right, rgba(0,45,41,0), rgba(0,45,41,1) 90%);
    --cardShadow: 0 5px 15px 0 rgba(0,0,0,.2);
    --shadowPopup: 0 0 20px 0 rgba(0,0,0,.8);
  }
}