:root {
    /* old colors */
    --backColorBody: #F7F8FC;
    --txtColordefault: #252733;
    /*---------------------------new colors-------------------------------------------------------------------*/
    --white: #ffffff;
    --textFunctionality: var(--redPattern);
    --svgBackgroundColor: var(--redPattern);
    /*------------------------RED--------------------------------*/
    --redPattern: #E00000;
    --primary: var(--redPattern);
    --darkRed: #B91313;
    --redMedium: #E02222;
    --lightRed: #F3A5A5;
    --lightRed2: #E28982;
    --gradientRed: linear-gradient( 270deg, var(--redPattern) 0%, #F26522 100%);
    --gradientBlackToWhite: linear-gradient( 360deg, #000 -26%, #ffffff00 100%);
    /*------------------------GRAY-------------------------------*/
    --lightGray: #F0F1F7;
    --lightGray2: #dfe1eb;
    --lightGray3: #9FA2B4;
    --mediumGray: #636573;
    --darkGray: #252733;
    --darkGray2: #34454E;
    /*--------------------[Success]----[Danger]----[Waring]-----------------*/
    --colorSuccess: #72CB46;
    --colorDanger: #E92641;
    --colorWarning: #F5CF07;
    /*----------------------alert-----------------------------------------*/
    --alertDangerBackColor: rgba(235, 31, 55, 0.1);
    --alertWarningBackColor: rgba(245, 207, 7, 0.1);
    --alertSuccessBackColor: rgba(65, 194, 101, 0.1);
    /*--------------------------INPUT AND SELECT----------------------------------------------*/
    --borderColorInputSelectFocus: var(--mediumGray);
    --borderColorInputSelect: var(--lightGray2);
    /*------------------------------FONT--------------------------------------------*/
    --fontSizeDefault: 14px;
    --fontWeightNormal: 400;
    --fontWeightRegular: 500;
    --fontWeightBold: 700;
    /*----------------------PANEL------------------------------------------*/
    --borderRadiusPanel: 10px;
}