
:host, 
:root {
    --rem: 10;
}

:root {
    --font-default: "Roboto Condensed", sans-serif;
    --font-roboto: "Roboto", system-ui;
    // Color Start
    --color-black: #000000;
    --color-black-rgb: 0, 0, 0;
    --color-white: #fff;
    --color-white-rgb: 255, 255, 255;
    --color-body: #000;
    --color-primary:#D50055;
    --color-primary-rgb: 213, 0, 85;
    --color-secondary: #F1F1F1;
    --color-heading: #111827;
    --color-heading2: #141314;
    --color-content: #CACACA;
    --color-content2: #525252;
    --color-yellow: #FFDF00;
    --color-green: #20D86C;
    --color-border: #EEEEEE;
    // Color RGBA
    // Color Social
    // --color-success: #3EB75E;
    // --color-danger: #FF0003;
    // --color-warning: #FF8F3C;
    // --color-info: #1BA2DB;
    // --color-facebook: #3B5997;
    // --color-twitter: #1BA1F2;
    // --color-youtube: #ED4141;
    // --color-linkedin: #0077B5;
    // --color-pinterest: #E60022;
    // --color-instagram: #C231A1;
    // --color-vimeo: #00ADEF;
    // --color-twitch: #6441A3;
    // --color-discord: #7289da;

    // Font Weight
    --font-light: 300;
    --font-regular: 400;
    --font-medium: 500;
    --font-semibold: 600;
    --font-bold: 700;
    --font-extrabold: 800;
    --font-black: 900;

    // Shadow
    --shadow: 0px 15px 35px 0px rgba(0, 0, 0, 0.1);
    --transition: all 300ms ease-in-out;
}