@view-transition { navigation: auto; }
::view-transition-group(root) { animation-duration: 600ms; }

:root {
/**
 * FONTS
 */    
    
    --font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, sans-serif;
    --font-family-mono: ui-monospace, "Cascadia Code", "Fira Code", Consolas, "Courier New", monospace;
    --font-size: 16px;
    --font-line-height: 1.6;
    --font-color: #fff;
    
    --a-font-color: var( --color-primary );
    --a-text-decoration: underline;    
    --a-hover-font-color: var( --color-secondary );
    
/**
 * COLORS
 */    
    
    --background-color: #212529;
    --border-color: rgba( var( --color-muted-rgb ) / 15% );
    --border-color-light: rgba( var( --color-muted-rgb ) / 25% );
    --border-color-dark: rgba( var( --color-muted-rgb ) / 5% );
    
    --color-muted: #ffffff40;
    --color-muted-rgb: 255 255 255;
    
    --color-dark: #191E23;
    --color-dark-rgb: 25 30 35;
    --color-dark-font-color: #fff;
    
    --color-light: #ffffff;
    --color-light-rgb: 255 255 255;
    --color-light-font-color: #000;
    
    --color-primary: #009BFA;
    --color-primary-rgb: 0 155 250;
    --color-primary-font-color: #fff;
    
    --color-secondary: #BE5FDC;
    --color-secondary-rgb: 190 95 220;
    --color-secondary-font-color: #fff;
    
    --color-danger: #C83C3C;
    --color-danger-rgb: 200 60 60;
    --color-danger-font-color: #fff;
    
    --color-success: #14AA46;
    --color-success-rgb: 20 170 70;
    --color-success-font-color: #fff;
    
    --color-warning: #DC960A;
    --color-warning-rgb: 220 150 10;
    --color-warning-font-color: #fff;
    
    --color-info: #146EA0;
    --color-info-rgb: 20 110 160;
    --color-info-font-color: #fff;

}