/*
 * 
 * SendGrid Design Tokens
 * 
 */
$border-large: 6px;
$border-medium: 4px;
$border-radius: 3px;
$border-small: 2px;
$box-shadow-buttons: 0 2px 4px 0 #c8d7ee;
$box-shadow-large: 0 20px 32px -8px #ebf2ff, 0 0 1px 0 #a8b9d5;
$box-shadow-small: 0 7px 11px -4px rgba(0, 23, 62, 0.2), 0 0 1px 0 #a8b9d5;
$breakpoint-desktop: 1280px;
$breakpoint-mobile: 768px;
$breakpoint-small: 520px;
$breakpoint-tablet: 992px;
$color-black: #000;
$color-blue: #3368fa;
$color-blue-dark: #002ca6;
$color-blue-darkest: #000e35;
$color-blue-light: #baccff;
$color-blue-lightest: #f5f8ff;
$color-blue-10: #f5f8ff;
$color-blue-100: #000e35;
$color-blue-20: #dbe6ff;
$color-blue-30: #baccff;
$color-blue-40: #85a5ff;
$color-blue-50: #3368fa;
$color-blue-60: #003adb;
$color-blue-70: #002ca6;
$color-blue-80: #001f75;
$color-blue-90: #00154d;
$color-gray-100: #ebf2ff;
$color-gray-200: #dfe9fa;
$color-gray-300: #c8d7ee;
$color-gray-400: #a8b9d5;
$color-gray-50: #f5f8fd;
$color-gray-500: #8ba3ca;
$color-gray-600: #4a6592;
$color-gray-700: #2c4a7d;
$color-gray-800: #0b2c64;
$color-gray-900: #00173e;
$color-gray-blue-10: #f5f8fd;
$color-gray-blue-100: #00173e;
$color-gray-blue-20: #ebf2ff;
$color-gray-blue-30: #dfe9fa;
$color-gray-blue-40: #c8d7ee;
$color-gray-blue-50: #a8b9d5;
$color-gray-blue-60: #8ba3ca;
$color-gray-blue-70: #4a6592;
$color-gray-blue-80: #2c4a7d;
$color-gray-blue-90: #0b2c64;
$color-green: #23bf6e;
$color-green-dark: #006631;
$color-green-darkest: #00361a;
$color-green-light: #8eeebc;
$color-green-lightest: #e0ffef;
$color-green-10: #e0ffef;
$color-green-100: #00361a;
$color-green-20: #c7ffe2;
$color-green-30: #8eeebc;
$color-green-40: #5fe7a1;
$color-green-50: #23bf6e;
$color-green-60: #00994a;
$color-green-70: #00803d;
$color-green-80: #006631;
$color-green-90: #004d25;
$color-orange: #f28510;
$color-orange-dark: #a83e00;
$color-orange-darkest: #762e04;
$color-orange-light: #fbb68f;
$color-orange-lightest: #ffecd8;
$color-orange-10: #ffecd8;
$color-orange-100: #2c1102;
$color-orange-20: #fdd5bf;
$color-orange-30: #fbb68f;
$color-orange-40: #fa9c66;
$color-orange-50: #f28510;
$color-orange-60: #e46216;
$color-orange-70: #a83e00;
$color-orange-80: #762e04;
$color-orange-90: #451b02;
$color-pink: #f772a2;
$color-pink-dark: #d82a68;
$color-pink-darkest: #7c002c;
$color-pink-light: #ffcadd;
$color-pink-lightest: #ffeff5;
$color-pink-10: #ffeff5;
$color-pink-100: #470019;
$color-pink-20: #ffe0ec;
$color-pink-30: #ffcadd;
$color-pink-40: #faa3c3;
$color-pink-50: #f772a2;
$color-pink-60: #f44383;
$color-pink-70: #d82a68;
$color-pink-80: #ac2052;
$color-pink-90: #7c002c;
$color-purple: #6f3cca;
$color-purple-dark: #400e9a;
$color-purple-darkest: #1c0050;
$color-purple-light: #dbc7ff;
$color-purple-lightest: #f3edff;
$color-purple-10: #f3edff;
$color-purple-100: #10002e;
$color-purple-20: #ebe0ff;
$color-purple-30: #dbc7ff;
$color-purple-40: #aa7aff;
$color-purple-50: #6f3cca;
$color-purple-60: #582da4;
$color-purple-70: #400e9a;
$color-purple-80: #300b75;
$color-purple-90: #1c0050;
$color-red: #ce241a;
$color-red-dark: #700600;
$color-red-darkest: #4a0400;
$color-red-light: #ff8c85;
$color-red-lightest: #ffe9e7;
$color-red-10: #ffe9e7;
$color-red-100: #2e0200;
$color-red-20: #ffb9b3;
$color-red-30: #ff8c85;
$color-red-40: #e8534a;
$color-red-50: #ce241a;
$color-red-60: #ac1e16;
$color-red-70: #940800;
$color-red-80: #700600;
$color-red-90: #4a0400;
$color-teal: #22d5a7;
$color-teal-dark: #00634a;
$color-teal-darkest: #001611;
$color-teal-light: #96fde2;
$color-teal-lightest: #dbfff6;
$color-teal-10: #dbfff6;
$color-teal-100: #001611;
$color-teal-20: #c2ffef;
$color-teal-30: #96fde2;
$color-teal-40: #64fbd5;
$color-teal-50: #35e4b8;
$color-teal-60: #22d5a7;
$color-teal-70: #1ba783;
$color-teal-80: #00634a;
$color-teal-90: #004735;
$color-turquoise: #199dff;
$color-turquoise-dark: #006cbc;
$color-turquoise-darkest: #00345a;
$color-turquoise-light: #b9e1ff;
$color-turquoise-lightest: #ebf7ff;
$color-turquoise-10: #ebf7ff;
$color-turquoise-100: #001a2e;
$color-turquoise-20: #d1ebff;
$color-turquoise-30: #b9e1ff;
$color-turquoise-40: #66beff;
$color-turquoise-50: #199dff;
$color-turquoise-60: #008af0;
$color-turquoise-70: #006cbc;
$color-turquoise-80: #004f8a;
$color-turquoise-90: #00345a;
$color-violet: #c850de;
$color-violet-dark: #740089;
$color-violet-darkest: #490057;
$color-violet-light: #f3b1ff;
$color-violet-lightest: #fdf1ff;
$color-violet-10: #fdf1ff;
$color-violet-100: #2f0038;
$color-violet-20: #f9d6ff;
$color-violet-30: #f3b1ff;
$color-violet-40: #ec85ff;
$color-violet-50: #c850de;
$color-violet-60: #a000bd;
$color-violet-70: #740089;
$color-violet-80: #5f0070;
$color-violet-90: #490057;
$color-white: #fff;
$color-yellow: #fabb2b;
$color-yellow-dark: #996b00;
$color-yellow-darkest: #704e00;
$color-yellow-light: #ffde92;
$color-yellow-lightest: #fff7e5;
$color-yellow-10: #fff7e5;
$color-yellow-100: #2e2000;
$color-yellow-20: #ffecc2;
$color-yellow-30: #ffde92;
$color-yellow-40: #fbca5b;
$color-yellow-50: #fabb2b;
$color-yellow-60: #eaa506;
$color-yellow-70: #996b00;
$color-yellow-80: #704e00;
$color-yellow-90: #4d3500;
$font-weight-bold: 600;
$font-weight-light: 300;
$font-weight-medium: 500;
$font-weight-normal: 400;
$row-large: 1280px;
$row-medium: 880px;
$row-small: 672px;
$row-xsmall: 392px;
$scale-base: 16px;
$scale-down-01: 14px;
$scale-down-02: 12px;
$scale-down-03: 8px;
$scale-down-04: 4px;
$scale-down-05: 2px;
$scale-up-01: 18px;
$scale-up-02: 20px;
$scale-up-03: 24px;
$scale-up-04: 28px;
$scale-up-05: 32px;
$scale-up-06: 36px;
$scale-up-07: 40px;
$scale-up-08: 48px;
$scale-up-09: 56px;
$scale-up-10: 64px;
$scale-up-11: 72px;
$scale-up-12: 80px;
$scale-up-13: 88px;
$scale-up-14: 96px;
$scale-up-15: 104px;
$spacing-lg: 30px;
$spacing-md: 20px;
$spacing-sm: 12px;
$spacing-xl: 45px;
$spacing-xs: 9px;
$spacing-xxl: 60px;
$z-index-01: 100;
$z-index-02: 200;
$z-index-03: 300;
$z-index-04: 400;
$z-index-05: 500;
$z-index-06: 600;
$z-index-07: 700;
$z-index-08: 800;
$z-index-09: 900;
$z-index-10: 1000;