:root {
    
        --design-color-7: #FFFFFF;
    
        --design-color-6: #F3F3F1;
    
        --design-color-5: #273A4F;
    
        --design-color-4: #E36B56;
    
        --design-color-3: #E9B14D;
    
        --design-color-2: #4F97A1;
    
        --design-color-1: #EC8218;
    

    /** component colors **/
    --comp-color-1: #3898EC;
    --comp-color-2: #333;
    --comp-color-3: #999;
    --comp-color-4: #ddd;
    --comp-color-5: #ffdede;
    --comp-color-6: #ccc;
    --comp-color-7: #eee;
    --comp-color-8: #f3f3f3;
    --comp-color-9: #fafafa;
    --comp-color-10: #ea384c;
    --comp-color-11: #758696;
    --comp-color-12: #5d6c7b;
    --comp-color-13: #222222;
    --comp-color-14: #0082f3;
    --comp-color-15: #000;
    --comp-color-16: #2895f7;
    --comp-color-17: #AAADB0;
    --comp-color-18: #E2E2E2;
    --comp-color-19: #C8C8C8;
    --comp-color-20: #ff0;
    --comp-color-21: #c0c0c0;
    --comp-color-22: #1d5564;
    --comp-color-23: #123b46;
    --comp-color-24: #fff;
}