:root {
  --ucla-gold: #ffd100;
  --ucla-blue: #2774ae;
  --ucla-lightest-blue: #daebfe;
  --ucla-lighter-blue: #8bb8e8;
  --ucla-darker-blue: #005587;
  --ucla-darkest-blue: #003b5c;
  --ucla-darker-gold: #ffc72c;
  --ucla-darkest-gold: #ffb81c;
  --ucla-cyan: #0ff;
  --ucla-magenta: #ff00a5;
  --ucla-green: #00ff87;
  --ucla-darker-green: #32aa56;
  --ucla-yellow: #ff0;
  --ucla-purple: #8a69d4;
  --black: #000;
  --black-90: #1a1a1a;
  --black-80: #333;
  --black-70: #4d4d4d;
  --black-60: #666;
  --black-50: #808080;
  --black-40: #999;
  --black-30: #b3b3b3;
  --black-20: #ccc;
  --black-10: #e6e6e6;
  --white: #fff;
  --color-primary: var(--ucla-blue);
  --color-secondary: var(--ucla-darkest-blue);
  --color-accent: var(--ucla-lightest-blue);
  --font-family: Helvetica, Arial, sans-serif;
  --font-family-alt: "Nunito", Helvetica, Arial, sans-serif;
  --font-family-display: var(--font-family);
  --font-family-system: -apple-system, BlinkMacSystemFont, "helvetica neue",
    helvetica, Ubuntu, roboto, noto, segoe ui, arial, sans-serif;
  --font-family-mono: Menlo, Consolas, Monaco, "Liberation Mono",
    "Lucida Console", monospace;
  --font-weight-thin: 100;
  --font-weight-extra-light: 200;
  --font-weight-light: 300;
  --font-weight: 400;
  --font-weight-medium: 500;
  --font-weight-semi-bold: 600;
  --font-weight-bold: 700;
  --font-weight-extra-bold: 800;
  --font-weight-black: 900;
  --text-scale-ratio: 1.125;
  --font-size-xxxx-display: 4.624rem;
  --font-size-xxx-display: 4.11rem;
  --font-size-xx-display: 3.653rem;
  --font-size-x-display: 2.887rem;
  --font-size-display: 2.566rem;
  --font-size-xxxx-large: 2.027rem;
  --font-size-xxx-large: 1.802rem;
  --font-size-xx-large: 1.602rem;
  --font-size-x-large: 1.424rem;
  --font-size-large: 1.266rem;
  --font-size-medium: 1.125rem;
  --font-size: 1rem;
  --font-size-small: 0.889rem;
  --font-size-x-small: 0.79rem;
  --line-height-text: 1.5;
  --line-height-display: 1.125;
  --line-height-alt: 1.25;
  --line-height: 1;
  --border-radius-x-small: 0.25rem;
  --border-radius-small: 0.5rem;
  --border-radius-medium: 0.75rem;
  --border-radius-large: 1rem;
  --border-radius-circle: 50%;
  --border-width-hairline: 1px;
  --border-width-thin: 2px;
  --border-width-thick: 5px;
  --border-thin: var(--border-width-hairline) solid var(--black-50);
  --border-thick: var(--border-width-thick) solid var(--black-20);
  --border-thin-primary: var(--border-width-hairline) solid var(--ucla-blue);
  --border-thick-primary: var(--border-width-thick) solid var(--ucla-blue);
  --max-width: 90rem;
  --min-width: 60rem;
  --spacing-x-small: 0.25rem;
  --spacing-small: 0.5rem;
  --spacing: 0.75rem;
  --spacing-medium: 1rem;
  --spacing-large: 1.5rem;
  --spacing-xx-small: 0.125rem;
  --spacing-x-large: 2rem;
  --spacing-xx-large: 3rem;
  --bp-x-small: 18.75em;
  --bp-small: 30em;
  --bp-medium: 48em;
  --bp-large: 64em;
  --bp-x-large: 75em;
  --bp-xx-large: 87.5rem;
}

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

body {
  color: var(--black-80);
  font-family: var(--font-family);
  font-size: var(--font-size);
  line-height: var(--line-height-text);
  margin: var(--spacing-x-large);
  max-width: var(--max-width);
  min-height: 100vh;
  scroll-behavior: smooth;
  text-rendering: optimizeSpeed;
}

article > * + * {
  margin-top: 1em;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: var(--font-weight-bold);
}

h1,
.h1 {
  font-size: var(--font-size-display);
  line-height: var(--line-height);
}

h2,
.h2 {
  font-size: var(--font-size-xx-large);
  line-height: var(--line-height-display);
}

h3,
.h3 {
  font-size: var(--font-size-large);
  line-height: var(--line-height-display);
}

h4,
.h4 {
  font-size: var(--font-size-medium);
}

h5,
.h5 {
  font-size: var(--font-size);
}

h6,
.h6 {
  font-size: var(--font-size-small);
}

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid var(--black-10);
  margin: 1em 0;
  padding: 0;
}

ul[class],
ol[class] {
  list-style: none;
  margin: 0;
  padding: 0;
}

figure,
figcaption {
  margin: 0;
  padding: 0;
}

::selection {
  background: var(--color-accent);
  text-shadow: none;
}

small,
.small,
.legal {
  font-size: var(--font-size-x-small);
}

code {
  font-family: var(--font-family-mono);
}

img {
  max-width: 100%;
  display: block;
}

table {
  border-collapse: collapse;
  margin: var(--spacing) 0;
  table-layout: fixed;
  width: 100%;
}

th {
  border-bottom: var(--border-style-thin);
  padding: var(--spacing) 0;
}

td {
  border-bottom: var(--border-style-thin);
  padding: var(--spacing);
}

td,
th,
tr {
  vertical-align: middle;
}

input,
button,
textarea,
select {
  font: inherit;
}

.social-icons > a:link {
  text-decoration: none;
}

.social-icons > a:hover,
.social-icons > a:focus {
  background-color: initial;
  outline: initial;
}

.social-icons a > .icon {
  fill: var(--color-secondary);
}

.social-icons a > .icon:focus,
.social-icons a > .icon:hover {
  fill: var(--color-primary);
}

.icon.microblog {
  transform: translateY(-7px);
}

.standfirst {
  font-size: var(--font-size-x-large);
  line-height: var(--line-height-alt);
}

.lede {
  font-size: var(--font-size-large);
  line-height: var(--line-height-alt);
}

@media print {
  *,
*:before,
*:after {
    background: transparent !important;
    color: #000 !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }
  a,
a:visited {
    text-decoration: underline;
  }
  a[href]:after {
    content: " (" attr(href) ")";
  }
  abbr[title]:after {
    content: " (" attr(title) ")";
  }
  a[href^="#"]:after,
a[href^="javascript:"]:after {
    content: "";
  }
  pre {
    white-space: pre-wrap !important;
  }
  pre,
blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }
  thead {
    display: table-header-group;
  }
  tr,
img {
    page-break-inside: avoid;
  }
  p,
h2,
h3 {
    orphans: 3;
    widows: 3;
  }
  h2,
h3 {
    page-break-after: avoid;
  }
}