:root {

    /*general variables*/
    --defautl-font-color: var(--dark-grey);
    --first-background-color: var(--light-grey);
    --second-background-color: white;
    --default-border-color: var(--grey);
    --default-border: 1px solid var(--default-border-color);

    /*colors*/
    --grey: #d8dae1;
    --dark-grey: #646571;
    --light-grey: #f0f0f0;
    --white: white;
    --red: #f95d5d;
    --green: #6bdb6b;
    --yellow: #ffff00;
    --blue: #6495ED;
    

    /*effects*/
    --default-shadow-box: 0 0 10px #ccc;

}