/*===========================================================
 Custom Variable
============================================================*/
:root {
    /* Hamber menu icon style */
    --hamWidth: 40px;
    --hamHeight: 4px;
    --hamMargin: 6px;
    /* summation of --hamMargin adn --hamHeight */
    --hamTranslate: 10px;
    /* summation of --hamMargin adn --hamHeight */
    --hamTranslate3: -10px;
    --hamBg: red;
    /* --preloaderBg: red; */
    /* Colors */
    --black: #0c252c;
    --white: #fff;
    --background: #fff;
    --primary: #3fa9c7;
    --main-red-accent: #ff0043;
    --main-orange: #fd9834;
    --main-yellow: #f6c64a;
    --main-green: #40bb71;
    --main-blue: #42BDFF;
    --main-blue-dark: #3597CC;
    --main-purple: #8f20ef;
    --main-magenta: #eb35ce;
    --main-secondary: #7bc1b7;
    --green-g-90: #204729;
    --green-g-80: #26552f;
    --green-g-70: #2a6b36;
    --green-g-60: #328741;
    --green-g-50: #46af59;
    --green-g-40: #67c177;
    --green-g-30: #9bdaa6;
    --green-g-20: #c7ebcd;
    --green-g-10: #e2f6e5;
    --green-g-5: #f3faf4;
    --blue-g-90: #2c1065;
    --blue-g-80: #491d95;
    --blue-g-70: #5821b6;
    --blue-g-60: #6928d9;
    --blue-g-50: #783aed;
    --blue-g-40: #895ef6;
    --blue-g-30: #a58bfa;
    --blue-g-20: #c2b5fd;
    --blue-g-10: #dcd6fe;
    --blue-g-5: #ede9fe;
    --grey-g-90: #1c1c1c;
    --grey-g-80: #373838;
    --grey-g-70: #535553;
    --grey-g-60: #6e716f;
    --grey-g-50: #8a8d8b;
    --grey-g-40: #a3a7a7;
    --grey-g-30: #b9bbb9;
    --grey-g-20: #f2f2f2;
    --grey-g-10: #e8e8e8;
    --grey-g-5: #f3f4f3;
    --grey-g-2: #fbfbfb;
    --primary-g-90: #0d2228;
    --primary-g-80: #194450;
    --primary-g-70: #266577;
    --primary-g-60: #32879f;
    --primary-g-50: #3fa9c7;
    --primary-g-40: #65bad2;
    --primary-g-30: #8ccbdd;
    --primary-g-20: #b2dde9;
    --primary-g-10: #c5e5ee;
    --primary-g-5: #d9eef4;
    --primary-g-2: #ecf6f9;
    --file-maintenance-auto-tint: #f00;
    --transparet-white: rgba(255, 255, 255, 0.15);
    --seg-bg: #f6f7f8;
    --seg-border: #d1d5db;
    --seg-text: #374151;
    --seg-active: #2563eb; /* accent color */
    --seg-activeTxt: #ffffff;
}

.main-blue {
    color: var(--main-blue);
}
.main-blue-dark {
    color: var(--main-blue-dark);
}

.main-purple {
    color: var(--main-purple);
}

.blue-90 {
    color: var(--blue-g-90);
}

.blue-80 {
    color: var(--blue-g-80);
}

.blue-70 {
    color: var(--blue-g-70);
}

.blue-60 {
    color: var(--blue-g-60);
}

.blue-50 {
    color: var(--blue-g-50);
}

.blue-40 {
    color: var(--blue-g-40);
}

.blue-30 {
    color: var(--blue-g-30);
}

.blue-20 {
    color: var(--blue-g-20);
}

.blue-10 {
    color: var(--blue-g-10);
}

.blue-5 {
    color: var(--blue-g-5);
}

.green-90 {
    color: var(--green-g-90);
}

.green-80 {
    color: var(--green-g-80);
}

.green-70 {
    color: var(--green-g-70);
}

.green-60 {
    color: var(--green-g-60);
}

.green-50 {
    color: var(--green-g-50);
}

.green-40 {
    color: var(--green-g-40);
}

.green-30 {
    color: var(--green-g-30);
}

.green-20 {
    color: var(--green-g-20);
}

.green-10 {
    color: var(--green-g-10);
}

.green-5 {
    color: var(--green-g-5);
}

/*===========================================================
 Placeholder Style
============================================================*/

::-webkit-input-placeholder {
    color: #6c6c6c;
    font-size: 14px;
    font-weight: 300;
    line-height: 30px;
    letter-spacing: 0.39px;
}

:-moz-placeholder {
    color: #6c6c6c;
    font-size: 14px;
    font-weight: 300;
    line-height: 30px;
    letter-spacing: 0.39px;
}

::-moz-placeholder {
    color: #6c6c6c;
    font-size: 14px;
    font-weight: 300;
    line-height: 30px;
    letter-spacing: 0.39px;
}

:-ms-input-placeholder {
    color: #6c6c6c;
    font-size: 14px;
    font-weight: 300;
    line-height: 30px;
    letter-spacing: 0.39px;
}