@font-face {
    font-family: 'BR Shape';
    src: url('https://literably-assets.s3.amazonaws.com/fonts/BRShape-Regular.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'BR Shape';
    src: url('https://literably-assets.s3.us-east-1.amazonaws.com/fonts/BRShape-Bold.otf') format('opentype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'BR Shape';
    src: url('https://literably-assets.s3.us-east-1.amazonaws.com/fonts/BRShape-SemiBold.otf') format('opentype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'BR Shape';
    src: url('https://literably-assets.s3.us-east-1.amazonaws.com/fonts/BRShape-Medium.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
}

:root {
    /* colors */
    --primary: #005AC8;
    --secondary: #002D64;
    --accent: #EF8275;
    --primary-text: #000000;
    --secondary-text: #002D64;
    --quartenary-text: #696D77;
    --tertiary-text: #FFFFFF;
    --border: #AAAAAA;
    --table-border: #D9D9D9;
    --background: #E7ECFC;
    --secondary-background: #DEE7ED;
    --tertiary-background: #001449;
    --quaternary-background : #F5F5F5;
    --content-container: #E7ECFC;
    --exceeds: #0461CF;
    --meets: #008016;
    --unknown: #696D77;
    --approaches: #F29D00;
    --below: #D5353E;
    --link: #0251BF;
    --link-hover: #002D64;
    --progress-bar: #16DB65;
    --note: #FFECB5;

    /* header colors */
    --heading-text: #005AC8;
    --table-header-text: #FFFFFF;
    --table-header-background: #001449;

    /* colors rgb - matches above colors. These numbers allow changing opacity a la https://stackoverflow.com/a/41265350/7632872 */
    --performance-report-opacity: 0.2;

    --primary-rgb: 0, 90, 200;
    --secondary-rgb: 0, 45, 100;
    --accent-rgb: 239, 130, 117;
    --primary-text-rgb: 0, 0, 0;
    --secondary-text-rgb: 0, 45, 100;
    --tertiary-text-rgb: 255, 255, 255;
    --border-rgb: 170, 170, 170;
    --table-border-rgb: 217, 217, 217;
    --background-rgb: 231, 236, 252;
    --secondary-background-rgb: 222, 231, 237;
    --tertiary-background-rgb: 0, 20, 73;
    --content-container-rgb: 231, 236, 252;
    --exceeds-rgb: 4, 97, 207;
    --meets-rgb: 0, 128, 22;
    --unknown-rgb: 105, 109, 119;
    --approaches-rgb: 242, 157, 0;
    --below-rgb: 213, 53, 62;
    --link-rgb: 2, 81, 191;
    --link-hover-rgb: 0, 45, 100;
    --progress-bar-rgb: 22, 219, 101;
    --note-rgb: 255, 236, 181;

    /* styles */
    --box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.05);
    --spacing: 1rem;
    --container-border-radius: 24px;

    /* typography */
    --non-student-font: 'BR Shape', sans-serif;
    --student-font: 'Andika', sans-serif;
    --font-size-xlarge: 3.4rem;
    --font-size-large: 2.6rem;
    --font-size-mlarge: 2.2rem;
    --font-size-medium: 1.8rem;
    --font-size-base: 1.6rem;
    --font-size-small: 1.4rem;
    --font-size-x-small: 1.2rem;
    --font-size-xx-small: 1rem;

    /* dimensions */
    --max-width: 1400px;
    --min-width: 768px;
    --drawer-min-width: 768px;
    --min-height: 768px;
    --header-height: 72px;
    --footer-height: 65px;

    /* breakpoints */
    --medium-screen: 768px;
    --large-screen: 1024px;
  }