@charset "UTF-8";

:root{
  /* primary */
  --primary-default : #3182F7;
  --primary-light-1 : #E4EFFD;
  --primary-light-2 : #D6E8FF;
  --primary-light-3: #F0F7FF;
  --primary-light-4: #BBE1FF;

  /* point */
  --red-default: #EB3F00;
  --red-light: #FFE9E2;
  --orange-default: #FF9D1F;
  --orange-light: #FFF1DE;
  --orange-light-1: #FFF1DE;
  --orange-light-2: #FFF1DE;
  --indigo-default: #144C9D;
  --indigo-light-1: #DCE4F0;
  --indigo-light-2: #F3F5FA;
  
  --skyBlue--default: #74CAE8;
  --skyBlue-dark-1: #48BFFF;

  /* gray */
  --gray-dark-1: #868686;
  --gray-dark-2: #555555;
  --gray-dark-3: #333333;
  --gray-dark-4: #222222;
  --gray-dark-5: #000000;
  --gray-dark-6: #999999;
  --gray-default: #C9C9C9;
  --gray-light-1: #FFFFFF;
  --gray-light-2: #F8F8FB;
  --gray-light-3: #F4F4F8;
  --gray-light-4: #E6E6E6;
  --gray-light-5: #DEDEDE;
  --gray-light-6: #CCCCCC;
  /* from sfa */
  --indigo-fade-1: #4E63B0;
  
  /* added - https://materializecss.com/color.html */
  --yellow-default: #FBC02D;
  --yellow-light: #FFFDE7;
  --lime-default: #C0CA33;
  --lime-light: #F9FBE7;
  --green-default: #43A047;
  --green-light: #E8F5E9;
  --green-light-1: #E8F5E9;
  --green-light-2: #C8E6C9;
  --green-light-3: #A5D6A7;
  --teal-default: #009688;
  --teal-light: #E0F2F1;
  --cyan-default: #00ACC1;
  --cyan-light: #E0F7FA;
  --purple-default: #673AB7;
  --purple-light: #EDE7F6;
  --pink-default: #E9361E;
  --pink-light-1: #FCE7E4;
  --pink-light-2: #F8C2BB;
  --pink-light-3: #F49C8F;
  
  --kcc-blue: #004098;
  --kcc-red: #E60012;
  --quick-menu: #374549;
}


.primary-gradient{
  background:  repeating-linear-gradient(  #81D1E0 0%, #337EEA 100% );
}