:root {
  /* Font Family */
  --cis-font-primary: 'Work Sans', serif;

  /*** Colors ***/

  /* Neutral Color */
  --cis-neutral-900: #121314;
  --cis-neutral-800: #24292e;
  --cis-neutral-700: #444d56;
  --cis-neutral-600: #92979d;
  --cis-neutral-300: #cfd1d3;
  --cis-neutral-200: #ecedee;
  --cis-neutral-100: #fbfbfb;
  --cis-neutral-0: #ffffff;

  /* Accent Color */
  --cis-accent-900: #102c60;
  --cis-accent-800: #0841aa;
  --cis-accent-700: #2952cc;
  --cis-accent-600: #5b91f5;
  --cis-accent-200: #d7dff6;
  --cis-accent-100: #ebedfa;

  /* Success Color */
  --cis-success-900: #10462d;
  --cis-success-800: #03703c;
  --cis-success-700: #149957;
  --cis-success-600: #06c167;
  --cis-success-200: #d7f2df;
  --cis-success-100: #e6f2ed;

  /* Info Color */
  --cis-info-900: #5c3e02;
  --cis-info-800: #8c6008;
  --cis-info-700: #ffc043;
  --cis-info-600: #ffcf70;
  --cis-info-200: #ffedb1;
  --cis-info-100: #fffaf0;

  /* Warning Color */
  --cis-warning-900: #9a3f21;
  --cis-warning-800: #c14f29;
  --cis-warning-700: #ff6937;
  --cis-warning-600: #fa9269;
  --cis-warning-200: #fdcead;
  --cis-warning-100: #fff3ef;

  /* Error Color */
  --cis-error-900: #751a0f;
  --cis-error-800: #ae1300;
  --cis-error-700: #e11900;
  --cis-error-600: #e85c4a;
  --cis-error-200: #f6d8db;
  --cis-error-100: #ffefed;

  /* Data Viz - Darkest */
  --cis-dataviz-darkest-violet: #2d4885;
  --cis-dataviz-darkest-yellow: #9d9714;
  --cis-dataviz-darkest-turquoise: #44987c;
  --cis-dataviz-darkest-orange: #aa6237;
  --cis-dataviz-darkest-blue: #6692b3;
  --cis-dataviz-darkest-magenta: #762c72;
  --cis-dataviz-darkest-red: #ab3e3d;
  --cis-dataviz-darkest-green: #446742;

  /* Data Viz - Main */
  --cis-dataviz-main-violet: #566ec2;
  --cis-dataviz-main-yellow: #c6b415;
  --cis-dataviz-main-turquoise: #4fbe9b;
  --cis-dataviz-main-orange: #d47941;
  --cis-dataviz-main-blue: #79baed;
  --cis-dataviz-main-magenta: #954d91;
  --cis-dataviz-main-red: #d64649;
  --cis-dataviz-main-green: #56a455;

  /* Data Viz - Dark */
  --cis-dataviz-dark-violet: #949cd2;
  --cis-dataviz-dark-yellow: #f8d648;
  --cis-dataviz-dark-turquoise: #76caac;
  --cis-dataviz-dark-orange: #df9164;
  --cis-dataviz-dark-blue: #9dc9eb;
  --cis-dataviz-dark-magenta: #d174b7;
  --cis-dataviz-dark-red: #e26d68;
  --cis-dataviz-dark-green: #85b882;

  /* Data Viz - Light */
  --cis-dataviz-light-violet: #cacce8;
  --cis-dataviz-light-yellow: #f1e8ae;
  --cis-dataviz-light-turquoise: #b8e1d0;
  --cis-dataviz-light-orange: #efc2aa;
  --cis-dataviz-light-blue: #c7dbee;
  --cis-dataviz-light-magenta: #cfb1cc;
  --cis-dataviz-light-red: #f2b1ab;
  --cis-dataviz-light-green: #bed6ba;

  /* Data Viz - Lightest */
  --cis-dataviz-lightest-violet: #ecedf5;
  --cis-dataviz-lightest-yellow: #f2f0e0;
  --cis-dataviz-lightest-turquoise: #eaf4f0;
  --cis-dataviz-lightest-orange: #f4efeb;
  --cis-dataviz-lightest-blue: #ebf0f5;
  --cis-dataviz-lightest-magenta: #f2e8f0;
  --cis-dataviz-lightest-red: #f6edec;
  --cis-dataviz-lightest-green: #eef4e8;

  /* Transpency Color */
  --cis-transparent-netural-30: #00000033;
  --cis-transparent-netural-0: #ffffff01;

  /* Shadows & Seperator */
  --cis-dropshadow1: 0px 0px 10px 0px #24292e40;
  --cis-dropshadow2: 0px 1px 4px 0px #00000040;

  /* Seperator */
  --cis-verticalSeparator: 1px 0px 0px 0px #ecedee;
  --cis-horizontalSeparator: 0px -1px 0px 0px #ecedee inset;
  --cis-horizontalSeparator-top: 0px 1px 0px 0px #ecedee inset;
  --cis-horizontalSeparator-link: 0px -1px 0px 0px #2952cc inset;

  /* Font Size */
  --cis-font-size-8: 0.5rem;
  --cis-font-size-9: 0.563rem;
  --cis-font-size-10: 0.625rem;
  --cis-font-size-11: 0.688rem;
  --cis-font-size-12: 0.75rem;
  --cis-font-size-13: 0.813rem;
  --cis-font-size-14: 0.875rem;
  --cis-font-size-15: 0.938rem;
  --cis-font-size-16: 1rem;
  --cis-font-size-17: 1.063rem;
  --cis-font-size-18: 1.125rem;
  --cis-font-size-19: 1.188rem;
  --cis-font-size-20: 1.25rem;
  --cis-font-size-21: 1.313rem;
  --cis-font-size-22: 1.375rem;
  --cis-font-size-23: 1.438rem;
  --cis-font-size-24: 1.5rem;
  --cis-font-size-25: 1.563rem;
  --cis-font-size-26: 1.625rem;
  --cis-font-size-27: 1.688rem;
  --cis-font-size-28: 1.75rem;
  --cis-font-size-29: 1.813rem;
  --cis-font-size-30: 1.875rem;
  --cis-font-size-31: 1.938rem;
  --cis-font-size-32: 2rem;
  --cis-font-size-33: 2.063rem;
  --cis-font-size-34: 2.125rem;
  --cis-font-size-35: 2.188rem;
  --cis-font-size-36: 2.25rem;
  --cis-font-size-37: 2.313rem;
  --cis-font-size-38: 2.375rem;
  --cis-font-size-39: 2.438rem;
  --cis-font-size-40: 2.5rem;

  /* Font Weight */
  --cis-font-weight-900: 900;
  --cis-font-weight-800: 800;
  --cis-font-weight-700: 700;
  --cis-font-weight-600: 600;
  --cis-font-weight-500: 500;
  --cis-font-weight-400: 400;
  --cis-font-weight-300: 300;
  --cis-font-weight-200: 200;
  --cis-font-weight-100: 100;

  /* Spacing Tokens */
  --cis-space-xxx-small: 0.125rem;
  --cis-space-xx-small: 0.25rem;
  --cis-space-x-small: 0.5rem;
  --cis-space-small: 0.75rem;
  --cis-space-medium: 1rem;
  --cis-space-large: 1.25rem;
  --cis-space-x-large: 1.5rem;
  --cis-space-xx-large: 2rem;
  --cis-space-xxx-large: 2.5rem;
  --cis-space-xxxx-large: 3rem;
  --cis-space-xxxxx-large: 5rem;

  /** typography var**/

  --cis-title-900: 900 2.144rem/3.25rem var(--cis-font-primary);
  --cis-title-800: 800 1.949rem/3rem var(--cis-font-primary);
  --cis-title-700: 700 1.611rem/2.5rem var(--cis-font-primary);
  --cis-title-600: 600 1.339rem/2rem var(--cis-font-primary);
  --cis-title-500: 500 1.21rem/1.75rem var(--cis-font-primary);
  --cis-title-400: 400 1rem/1.5rem var(--cis-font-primary);
  --cis-title-300: 300 1rem/0.909rem var(--cis-font-primary);
  --cis-title-200: 200 0.826rem/1.25rem var(--cis-font-primary);
}





* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
}
html,
body {
  height: 100%;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}
body {
  line-height: 1;
  font-family: var(--cis-font-primary);
}
ol,
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* Work Sans fonts Start*/
@font-face {
  font-family: 'Work Sans';
  src:
    url('../fonts/WorkSans-ExtraBold.woff2') format('woff2'),
    url('../fonts/WorkSans-ExtraBold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Work Sans';
  src:
    url('../fonts/WorkSans-ExtraLight.woff2') format('woff2'),
    url('../fonts/WorkSans-ExtraLight.woff') format('woff');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Work Sans';
  src:
    url('../fonts/WorkSans-Black.woff2') format('woff2'),
    url('../fonts/WorkSans-Black.woff') format('woff');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Work Sans';
  src:
    url('../fonts/WorkSans-Light.woff2') format('woff2'),
    url('../fonts/WorkSans-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Work Sans';
  src:
    url('../fonts/WorkSans-SemiBold.woff2') format('woff2'),
    url('../fonts/WorkSans-SemiBold.woff') format('woff');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Work Sans';
  src:
    url('../fonts/WorkSans-Medium.woff2') format('woff2'),
    url('../fonts/WorkSans-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Work Sans';
  src:
    url('../fonts/WorkSans-Bold.woff2') format('woff2'),
    url('../fonts/WorkSans-Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Work Sans';
  src:
    url('../fonts/WorkSans-Regular.woff2') format('woff2'),
    url('../fonts/WorkSans-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Work Sans';
  src:
    url('../fonts/WorkSans-Thin.woff2') format('woff2'),
    url('../fonts/WorkSans-Thin.woff') format('woff');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
/* Work Sans fonts Start*/

/* Styles */
cis-side-nav-items[slot='submenu']::part(side-menu-link) {
  padding-left: 1.5rem;
}

@media only screen and (min-width: 1024px) and (max-width: 1300px) {
  .switcher-wrapper-default{
    max-height: 450px;
  }
}