:root{
    /*========== Colors ==========*/
  /*Color mode HSL(hue, saturation, lightness)*/
  --black-color: hsl(220, 24%, 12%);
  --black-color-light: hsl(220, 24%, 15%);
  --black-color-lighten: hsl(220, 20%, 18%);
  --blue-dark: #4d627f;
  --black-outfit: #1e3551;
  --para-color:#161E2A;
  --white-color: #fff;
  --body-color: #fefef7;
  --light-body: #f5f5f5;
  --overlay--color: rgba(0,0,0,0.5);
  --header-link-color: #00fff7;
  --primary--darkblue:#001c46;
  --primary--highlight:#27a5f8;
  --help-way-no: #c0e8ff;
  --light-grey:#fefef7;
  --soft-grey:#F6F5F5;
  --creator-mba:#F6F5F5;
  --blue-sky: #50c0ff;
  --link-hover: #1da1f2;
  --check-color: #0072EF;
  --call-to-action: #2761f8;
  --active-color: #4A249D;
  --box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
  --small-text: #727272;

  /*========== Font Size ==========*/
  --f-500: 500%;
  --f-1-3: 1.3rem; --f-3-3: 3.3rem; --f-3-5: 3.5rem; --f-4-5: 4.5rem; --f-40: 40px; --f-18: 18px;--f-20: 20px;
  --f-35: 35px; --f-50: 50px; --f-125: 1.25rem; --f-175: 1.75rem; --f-1: 1rem; --f-1-5: 1.5rem; --f-2: 2rem;
  --f-2-5: 2.5rem; --f-6: 6rem; --f-23: 23px;--f-30:30px;--f-35: 35px; --f-66: 66px;--f-14: 14px;--f-45: 45px;
  --f-28: 28px;--f-170: 170%; --f-60: 60px;--f-6-9:6.9rem;
  
}

/* base */

::-ms-input-placeholder { /* Edge 12-18 */
    color: #4d627f;
  }
  
  ::placeholder {
    color: #4d627f;
  }
  .text-grey{
    color: #667790;
  }