:root {
    /* OrthoMedia Generic Media Site Theme */
    /* – Colors */
    --base-01: #ffffff;
    /* Base color of page, used for blank backgrounds */
    --base-02: #FBF9FA;
    /* Base color, a darker tone of --base-01 */
    --base-03: #F7F3F7;
    /* Base color, a darker tone of --base-02 */
    --base-04: #F3EDF0;
    /* Base color, a darker tone of --base-03 */
    --base-05: #EFE7EB;
    /* Base color, a darker tone of --base-04 */
    --base-content: #323F4D;
    /* Foreground content color to use on base color (This foreground tone meets WCAG 2.1 AA Contrast Guidelines of all base background tones) */
    --base-emphasis: #191F26;
    /* Foreground content color to bring emphasis, for example on Heading Tags (This foreground tone meets WCAG 2.1 AA Contrast Guidelines of all base background tones)*/
    --base-mute: #5B6571;
    /* Foreground content color to reduce empasis  (This foreground tone meets WCAG 2.1 AA Contrast Guidelines of all base background tones) */
    --dark-01: #323F4D;
    /* Base color of page, used for dark backgrounds */
    --dark-content: var(--base-01);
    /* Foreground content color on dark background tones*/
    --dark-focus: #2C3845;
    /* Dark content colour when focused */
    --primary: #3CCECB;
    /* Primary brand color for links, buttons, etc. */
    --primary-focus: #3BBFBE;
    /* Primary color when focused. A darker tone of primary */
    --primary-content: var(--base-content);
    /* Foreground content color to use on primary color. A readable tone of primary */
    --secondary: #006C7B;
    /* Secondary brand color for links, buttons, etc. */
    --secondary-focus: #01616F;
    /* Secondary color when focused. A darker tone of secondary */
    --secondary-content: var(--base-01);
    /* Foreground content color to use on secondary color. A readable tone of secondary */
    --tertiary: #C4F0EF;
    /* Tertiary brand color for links, buttons, etc. */
    --tertiary-focus: #A9E9E8;
    /* Tertiary color when focused. A darker tone of tertiary */
    --tertiary-content: var(--base-content);
    /* Foreground content color to use on tertiary color. A readable tone of tertiary */
    --quaternary: #C94E32;
    /* Quaternary brand color for links, buttons, etc. */
    --quaternary-focus: #AB432A;
    /* Quaternary color when focused. A darker tone of quaternary */
    --quaternary-content: var(--base-01);
    /* Foreground content color to use on quaternary color. A readable tone of quaternary */
    --border-color: #DADADA;
    /* A  border tone*/
    --info: #00b6ff;
    --info-content: var(--base-emphasis);
    --success: #00a96e;
    --success-content: var(--base-emphasis);
    --warning: #ffbe00;
    --warning-content: var(--base-emphasis);
    --error: #ff5861;
    --error-content: var(--base-emphasis);
    /* – Typography */
    --heading-font: 'Lato', "Arial", "Helvetica", "Tahoma", "Verdana", sans-serif;
    --paragraph-font: 'Lato', "Arial", "Helvetica", "Tahoma", "Verdana", sans-serif;
    font-family: var(--paragraph-font);
    font-weight: normal;
    color: var(--base-content);
    --text-xs: 0.79rem;
    --text-sm: 0.889rem;
    --text-base: 1rem;
    --text-lg: 1.125rem;
    --text-xl: 1.266rem;
    --text-2xl: 1.424rem;
    --text-3xl: 1.602rem;
    --text-4xl: 1.802rem;
    --text-5xl: 2.027rem;
    --text-6xl: 2.281rem;
    --text-7xl: 2.566rem;
    /* – Logos */
    --nav-logo: url("https://cadmoremediastorage.blob.core.windows.net/483758bf-978b-4df1-a591-a87ebfd603ac/ApplicationContent/logo?sv=2018-03-28&sr=c&sig=IzgVdwJ9GOhMAydRaCpZH0eDUbO67FkHCBKn%2FjfkbW8%3D&st=2025-08-02T22%3A18%3A28Z&se=2025-08-03T02%3A23%3A28Z&sp=r");
    --reverselogo: url("https://cadmoremediastorage.blob.core.windows.net/483758bf-978b-4df1-a591-a87ebfd603ac/ApplicationContent/OrthoLogoReversed?sv=2018-03-28&sr=c&sig=IzgVdwJ9GOhMAydRaCpZH0eDUbO67FkHCBKn%2FjfkbW8%3D&st=2025-08-02T22%3A18%3A28Z&se=2025-08-03T02%3A23%3A28Z&sp=r");
    --nav-logomark: var(--nav-logo);
    /* Organization's logo as it would appear in the header navigation */
    --footer-logo: url("");
    /* Organization's logo as it would appear in the footer */
    --three: all 0.3s ease-in-out;
    --five: all 0.5s ease-in-out;
    --i-cadmore-c: url("https://cadmoremediastorage.blob.core.windows.net/483758bf-978b-4df1-a591-a87ebfd603ac/ApplicationContent/cadmore-c.svg?sv=2018-03-28&sr=c&sig=IzgVdwJ9GOhMAydRaCpZH0eDUbO67FkHCBKn%2FjfkbW8%3D&st=2025-08-02T22%3A18%3A28Z&se=2025-08-03T02%3A23%3A28Z&sp=r");
    /* Background */
    --bg-img: url("https://cadmoremediastorage.blob.core.windows.net/483758bf-978b-4df1-a591-a87ebfd603ac/ApplicationContent/background-1920x1120.jpg?sv=2018-03-28&sr=c&sig=IzgVdwJ9GOhMAydRaCpZH0eDUbO67FkHCBKn%2FjfkbW8%3D&st=2025-08-02T22%3A18%3A28Z&se=2025-08-03T02%3A23%3A28Z&sp=r");
}

/* lato-regular - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Lato';
    font-style: normal;
    font-weight: 400;
    src: url('@(Model.Content("body-font-regular.woff2"))') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    url('@(Model.Content("body-font-regular.ttf"))') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* lato-italic - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Lato';
    font-style: italic;
    font-weight: 400;
    src: url('@(Model.Content("body-font-italic.woff2"))') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    url('@(Model.Content("body-font-italic.ttf"))') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* lato-700 - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Lato';
    font-style: normal;
    font-weight: 700;
    src: url('@(Model.Content("body-font-700.woff2"))') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    url('@(Model.Content("body-font-700.ttf"))') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* lato-700italic - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Lato';
    font-style: italic;
    font-weight: 700;
    src: url('@(Model.Content("body-font-700italic.woff2"))') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    url('@(Model.Content("body-font-700italic.ttf"))') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* lato-900 - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Lato';
    font-style: normal;
    font-weight: 900;
    src: url('@(Model.Content("body-font-900.woff2"))') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    url('@(Model.Content("body-font-900.ttf"))') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* lato-900italic - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Lato';
    font-style: italic;
    font-weight: 900;
    src: url('@(Model.Content("body-font-900italic.woff2"))') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    url('@(Model.Content("body-font-900italic.ttf"))') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* Site Wide Items */




button,
a, a:hover, button, button:hover {
    transition: var(--three);
    cursor: pointer;
}

#pageContent {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

    #pageContent main {
        flex-grow: 1;
        background-color: var(--base-02);
    }

.full-width {
    padding: .75rem;
}

@media only screen and (min-width: 360px) {
}

@media only screen and (min-width: 500px) {
}

@media only screen and (min-width: 640px) {
    .full-width {
        padding: 1.25rem;
    }
}

@media only screen and (min-width: 768px) {
}

@media only screen and (min-width: 1024px) {
    .full-width {
        padding: 2rem 2.5rem;
    }
}

@media only screen and (min-width: 1280px) {
}

@media only screen and (min-width: 1536px) {
    .full-width {
        padding: 2rem 0;
    }

        .full-width .wrapper {
            max-width: 90rem;
            margin: 0 auto;
        }
}







/* RESET */

/* Box sizing rules */
*,
*::before,
*::after {
    box-sizing: border-box;
}

/* Prevent font size inflation */
html {
    -moz-text-size-adjust: none;
    -webkit-text-size-adjust: none;
    text-size-adjust: none;
}

/* Remove default margin in favour of better control in authored CSS */
body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd {
    margin: 0;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role='list'],
ol[role='list'] {
    list-style: none;
    list-style-type: none;
}

/* Set core body defaults */
body {
    min-height: 100vh;
    line-height: 1.625;
}

/* Set shorter line heights on headings and interactive elements */
h1,
h2,
h3,
h4,
button,
input,
label {
    line-height: 1.5;
}

/* A elements that don't have a class get default styles */
a:not([class]) {
    text-decoration-skip-ink: auto;
    color: currentColor;
}

/* Make images easier to work with */
img,
picture {
    max-width: 100%;
    display: block;
}

/* Inherit fonts for inputs and buttons */
input,
button,
textarea,
select {
    font: inherit;
}

    /* Make sure textareas without a rows attribute are not tiny */
    textarea:not([rows]) {
        min-height: 10em;
    }

/* Anything that has been anchored to should have extra scroll margin */
:target {
    scroll-margin-block: 5ex;
}

ul {
    margin-block-start: 0;
    margin-block-end: 0;
    padding-inline-start: 0;
}

p:not(:first-of-type) {
    padding-top: 1rem;
}




a.accent-primary,
a.accent-primary:visited {
    color: var(--primary)
}

    a.accent-primary:hover {
        color: var(--primary-focus)
    }

.badge {
    background: var(--base-05);
    border: 1px solid var(--base-05);
    color: var(--base-content);
}

    .badge:hover {
        background: var(--base-01);
        border: 1px solid var(--base-05);
    }