:root {
    /**Common*/
    --white: #ffffff;
    --catalyst-dark: #272931;
    --low-opacity-scrim-layer: #333333b3;

    /**light Theme Primary*/
    --light-default-blue: #4570e1;
    --light-hover-blue: #1240bd;
    --light-active-blue: #0d3092;
    --light-solid-hover: #ecf1fc;
    --light-solid-active: #dae2f9;

    /**Light Theme Content*/
    --light-medium-priority: #4c5060;
    --light-low-priority: #70768e;
    --light-non-text-contrast-dark: #b7b7b7;
    --light-non-text-contrast-light: #d3d3d3;

    /**Light Theme Surfaces*/
    --light-surface-one: #fafafa;
    --light-surface-two: #f5f5f5;
    --light-surface-three: #f0f0f0;
    --light-surface-disabled: #c9cacd;

    /**Light Theme Feedback Colors*/
    --light-positive-feedback: #51a800;
    --light-high-priority-warning-feedback: #ee0000;
    --light-warning-feedback: #e57300;

    /**Light Theme Low-Opacity*/
    --light-low-opacity-hover: #4570e11a;
    --light-low-opacity-active: #4570e133;
    --light-low-opacity-translucent-surface: #ebebebcc;
    --light-low-opacity-alternate-hover: #77eaf026;
    --light-low-opacity-alternate-active: #4570e10d;

    /**Dark Theme Primary*/
    --dark-default-blue: #c2fcff;
    --dark-hover-blue: #d4fdff;
    --dark-active-blue: #e5ffff;
    --dark-solid-hover: #50596e;
    --dark-solid-active: #697499;

    /**Dark Theme Content*/
    --dark-medium-priority: #cccccc;
    --dark-low-priority: #bababa;
    --dark-non-text-contrast-light: #5e6786;
    --dark-non-text-contrast-dark: #4d556f;

    /**Dark Theme Surfaces*/
    --dark-surface-one-dp: #2e313a;
    --dark-surface-two-dp: #323640;
    --dark-surface-four-dp: #373c47;
    --dark-surface-eight-dp: #3d434f;
    --dark-surface-sixteen-dp: #414855;
    --dark-surface-disabled: #55565f;

    /**Dark Theme Feedback Colors*/
    --dark-positive-feedback: #b4ffc5;
    --dark-high-priority-warning-feedback: #ffa1a1;
    --dark-warning-feedback: #ffb770;

    /**Dark Theme Low-Opacity*/
    --dark-low-opacity-hover: #a6b7ff26;
    --dark-low-opacity-active: #a6b7ff66;
    --dark-low-opacity-translucent-surface: #414855cc;
    --dark-low-opacity-alternate-hover: #c3faff1a;
    --dark-low-opacity-alternate-active: #c3faff33;

    /** Default Heights **/
    --default-header-height: 4rem;
}
h1,
h2,
h3,
h4,
caption,
b,
body,
p,
input {
    font-family: "Open Sans";
    font-style: normal;
}
body {
    font-size: 1rem;
    font-weight: 400;
}
h1 {
    font-size: 2.5rem;
    font-weight: 500;
}
h2 {
    font-size: 2rem;
    font-weight: 500;
}
h3 {
    font-size: 1.5rem;
    font-weight: 500;
}
h4 {
    font-size: 1.25rem;
    font-weight: 400;
}
caption {
    font-size: 0.75rem;
    font-weight: 400;
}
b {
    font-weight: 600;
    font-size: 1rem;
}
p {
    font-weight: 400;
    font-size: 1rem;
}
input {
    font-size: 0.875rem;
    font-weight: 500;
}