:root{
    --white:#FFFFFF;
    /* --- grey --- */
    --grey-1:#FAFAFA;
    --grey-2:#F5F5F5;
    --grey-3:#E5E5E5;
    --grey-4:#D4D4D4;
    --grey-5:#A3A3A3;
    /* --- grey --- */
    /* --- black --- */
    --black-1:#737373;
    --black-2:#525252;
    --black-3:#404040;
    --black-4:#262626;
    --black-5:#171717;
    /* --- black --- */
    /* --- primary --- */
    --primary-1:#D9E9F9;
    --primary-2:#99C4EE;
    --primary-3:#66A7E5;
    --primary-4:#006CD4;
    --primary-5:#0061BF;
    --primary-6:#1A56DB;
    /* --- primary --- */
    /* --- success --- */
    --success-1:#DDEBE5;
    --success-2:#A4CBBB;
    --success-3:#77B098;
    --success-4:#1C7C54;
    --success-5:#19704C;
    --success-6:#166343;
    /* --- success --- */
    /* --- danger --- */
    --danger-1:#FADFE1;
    --danger-2:#F2A9AE;
    --danger-3:#EC7F86;
    --danger-4:#DF2935;
    --danger-5:#C92530;
    --danger-6:#B2212A;
    --red:#d63736;
    
    /* --- danger --- */
    /* --- warning --- */
    --warning-1:#FEF7DB;
    --warning-2:#FCE794;
    --warning-3:#FED8EC;
    --warning-4:#FFF4CE;
    --warning-5:#FFF4CE;
    --warning-6:#FDE7E9;
    --warning-7:#FDCA40;
    /* --- warning --- */

    /* -------------- spacing ------------- */
    --spacing-4px:4px;
    --spacing-8px:8px;
    --spacing-12px:12px;
    --spacing-16px:16px;
    --spacing-20px:20px;
    --spacing-24px:24px;
    --spacing-28px:28px;
    --spacing-32px:32px;
    --spacing-40px:40px;
    --spacing-48px:48px;
    --spacing-60px:60px;
    --spacing-64px:64px;
    --spacing-80px:80px;
    --spacing-96px:96px;
    --spacing-128px:128px;
    --spacing-160px:160px;
    --spacing-192px:192px;
    /* -------------- spacing ------------- */
    
    /* -------------- drop-shadow ------------- */
    --shadow-1:0px 0.6px 1.8px rgba(0, 0, 0, 0.1), 0px 3.2px 7.2px rgba(0, 0, 0, 0.13);
    --shadow-2:0px 1.2px 3.6px rgba(0, 0, 0, 0.1), 0px 6.4px 14.4px rgba(0, 0, 0, 0.13);
    /* -------------- drop-shadow ------------- */
    
    /* -------------- border ------------- */
    --border-1: 1px solid var(--grey-2);
    --border-2: 1px solid var(--grey-5);
    --border-3: 1px solid var(--primary-6);
    --border-4: 1px solid var(--grey-4);
    /* -------------- border ------------- */


}


*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    font-family: 'ns-regular';
}

.container{
    padding: 20px;
    width: 100%;
    margin: auto;
    max-width: 1280px;
    
}
.dFlex{
    position: relative;
    gap: 15px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.mt5{
    margin-top: 5px;
}

.mt40{
    margin-top: 40px;
}

.flexColumn{
    flex-wrap: wrap;
    flex-direction: column;
    align-items: flex-start;
}

.gap5{
    gap: 5px;
}
::-webkit-scrollbar-track
{
	border-radius: 10px;
	background-color: transparent;
}

::-webkit-scrollbar
{
    
	width: 4px;
    height: 4px;
    background: transparent;
}

::-webkit-scrollbar-thumb
{
    
	border-radius: 12px;
	background-color: var(--grey-5);
}
.pointer{
    cursor: pointer;
}