:root {
    /* color theme variables */
    --maintheme: #fe4d01;
    --secondtheme: rgb(246, 244, 239); /* usually used for body background */
    --dialog-bkgrnd: #ffd966;
    --whitetheme: rgb(255,255,255);
    --blacktheme: rgb(21, 21, 21);
    --greytheme: #999;
    --navbar-form-bkgrnd: rgba(255, 255, 255, 0.075);
    
    --texttheme1: var(--blacktheme);
    --texttheme2: var(--whitetheme);
    --texttheme-main: var(--maintheme); 
    --texttheme-main-active: #c53c02;

    --texttheme1-trans: rgba(21, 21, 21, 0.281);
    --dialog-bkgrnd-light: #ffd96629;

    --border-color: #d6ceb5;
    --border-color-dark: #a9a392;

    --maintheme-alpha: #fe4d011d;
    --secondtheme-dark: rgb(234, 234, 234);
    
    /* z-indices for different modals/content */
    --content-axis: 0;
    --navbar-axis: 1;
    --footer-axis: 1;
    --float-button-axis: 3;
    --dialog-box-axis1: 2;
    --dialog-box-axis2: 4;

    font-size: 16px; /* overall root font-size */
}

* {
    margin: 0px;
    padding: 0px;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

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