@charset "UTF-8";
/*
 * Helper utilities
 * Mixins and utilities that are globally used
 */
/* ==========================================================================
   Helper classes
   ========================================================================== */
/* force inline block styling */
.inline-block {
  display: inline-block !important;
}

/*
 * Align right
 */
.align-right {
  text-align: right;
}

/*
 * Justify (use with flex elements)
 */
.justify-left {
  justify-content: left;
}

.justify-right {
  justify-content: right;
}

/*
 * Hide visually and from screen readers
 */
.hidden {
  display: none !important;
}

/*
 * Hide only visually, but have it available for screen readers:
 * https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 *
 * 1. For long content, line feeds are not interpreted as spaces and small width
 *    causes content to wrap 1 word per line:
 *    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
 */
.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  white-space: nowrap;
  /* 1 */
}

/*
 * Extends the .visuallyhidden class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto;
  white-space: inherit;
}

/*
 * Hide visually and from screen readers, but maintain layout
 */
.invisible {
  visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */
.clearfix:before,
.clearfix:after {
  content: " ";
  /* 1 */
  display: table;
  /* 2 */
}

.clearfix:after {
  clear: both;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */
@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */
}
@media print, (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 1.25dppx), (min-resolution: 120dpi) {
  /* Style adjustments for high resolution devices */
}
/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   https://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */
@media print {
  *,
*:before,
*:after {
    background: transparent !important;
    color: #000000 !important;
    /* Black prints faster */
    -webkit-box-shadow: none !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) ")";
  }

  /*
   * Don't show links that are fragment identifiers,
   * or use the `javascript:` pseudo protocol
   */
  a[href^="#"]:after,
a[href^="javascript:"]:after {
    content: "";
  }

  pre {
    white-space: pre-wrap !important;
  }

  pre,
blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }

  /*
   * Printing Tables:
   * http://css-discuss.incutio.com/wiki/Printing_Tables
   */
  thead {
    display: table-header-group;
  }

  tr,
img {
    page-break-inside: avoid;
  }

  p,
h2,
h3 {
    orphans: 3;
    widows: 3;
  }

  h2,
h3 {
    page-break-after: avoid;
  }
}
/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/
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, 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%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
  font-family: "Helvetica", "Arial", sans-serif;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
  line-height: 1.15;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

/* Grouping content
   ========================================================================== */
/**
 * 1. remove borders from tables
 */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

/* Text-level semantics
   ========================================================================== */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  text-decoration: underline dotted;
  /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove the border on images inside links in IE 10.
 */
img {
  border-style: none;
}

/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
  /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
  /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  box-sizing: border-box;
  /* 1 */
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type=checkbox],
[type=radio] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type=search] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

/* Interactive
   ========================================================================== */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}

/* Misc
   ========================================================================== */
/**
 * Add the correct display in IE 10+.
 */
template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
  display: none;
}

/*! HTML5 Boilerplate v6.1.0 | MIT License | https://html5boilerplate.com/ */
/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */
/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */
html {
  color: #222;
  font-size: 1em;
  line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * Vendor-prefixed and regular ::selection selectors cannot be combined:
 * https://stackoverflow.com/a/16982510/7133471
 *
 * Customize the background color to match your design.
 */
::-moz-selection {
  background: #DAEBFE;
  text-shadow: none;
}

::selection {
  background: #DAEBFE;
  text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #E5E5E5;
  margin: 1em 0;
  padding: 0;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */
audio,
canvas,
iframe,
img,
svg,
video {
  vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */
fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */
textarea {
  resize: vertical;
}

/*------------------------------------*\
    $VARIABLES
\*------------------------------------*/
/*
 * Grid parameter defaults
 * These are used to customize the grid layout
 * Feel free to overwrite them as necessary
 */
/* this is all from Bootstrap */
.m-0 {
  margin: 0 !important;
}

.mt-0,
.my-0 {
  margin-top: 0 !important;
}

.mr-0,
.mx-0 {
  margin-right: 0 !important;
}

.mb-0,
.my-0 {
  margin-bottom: 0 !important;
}

.ml-0,
.mx-0 {
  margin-left: 0 !important;
}

.m-2 {
  margin: 0.125rem !important;
}

.mt-2,
.my-2 {
  margin-top: 0.125rem !important;
}

.mr-2,
.mx-2 {
  margin-right: 0.125rem !important;
}

.mb-2,
.my-2 {
  margin-bottom: 0.125rem !important;
}

.ml-2,
.mx-2 {
  margin-left: 0.125rem !important;
}

.m-4 {
  margin: 0.25rem !important;
}

.mt-4,
.my-4 {
  margin-top: 0.25rem !important;
}

.mr-4,
.mx-4 {
  margin-right: 0.25rem !important;
}

.mb-4,
.my-4 {
  margin-bottom: 0.25rem !important;
}

.ml-4,
.mx-4 {
  margin-left: 0.25rem !important;
}

.m-8 {
  margin: 0.5rem !important;
}

.mt-8,
.my-8 {
  margin-top: 0.5rem !important;
}

.mr-8,
.mx-8 {
  margin-right: 0.5rem !important;
}

.mb-8,
.my-8 {
  margin-bottom: 0.5rem !important;
}

.ml-8,
.mx-8 {
  margin-left: 0.5rem !important;
}

.m-12 {
  margin: 0.75rem !important;
}

.mt-12,
.my-12 {
  margin-top: 0.75rem !important;
}

.mr-12,
.mx-12 {
  margin-right: 0.75rem !important;
}

.mb-12,
.my-12 {
  margin-bottom: 0.75rem !important;
}

.ml-12,
.mx-12 {
  margin-left: 0.75rem !important;
}

.m-16 {
  margin: 1rem !important;
}

.mt-16,
.my-16 {
  margin-top: 1rem !important;
}

.mr-16,
.mx-16 {
  margin-right: 1rem !important;
}

.mb-16,
.my-16 {
  margin-bottom: 1rem !important;
}

.ml-16,
.mx-16 {
  margin-left: 1rem !important;
}

.m-24 {
  margin: 1.5rem !important;
}

.mt-24,
.my-24 {
  margin-top: 1.5rem !important;
}

.mr-24,
.mx-24 {
  margin-right: 1.5rem !important;
}

.mb-24,
.my-24 {
  margin-bottom: 1.5rem !important;
}

.ml-24,
.mx-24 {
  margin-left: 1.5rem !important;
}

.m-32 {
  margin: 2rem !important;
}

.mt-32,
.my-32 {
  margin-top: 2rem !important;
}

.mr-32,
.mx-32 {
  margin-right: 2rem !important;
}

.mb-32,
.my-32 {
  margin-bottom: 2rem !important;
}

.ml-32,
.mx-32 {
  margin-left: 2rem !important;
}

.m-64 {
  margin: 4rem !important;
}

.mt-64,
.my-64 {
  margin-top: 4rem !important;
}

.mr-64,
.mx-64 {
  margin-right: 4rem !important;
}

.mb-64,
.my-64 {
  margin-bottom: 4rem !important;
}

.ml-64,
.mx-64 {
  margin-left: 4rem !important;
}

.m-80 {
  margin: 4.75rem !important;
}

.mt-80,
.my-80 {
  margin-top: 4.75rem !important;
}

.mr-80,
.mx-80 {
  margin-right: 4.75rem !important;
}

.mb-80,
.my-80 {
  margin-bottom: 4.75rem !important;
}

.ml-80,
.mx-80 {
  margin-left: 4.75rem !important;
}

.p-0 {
  padding: 0 !important;
}

.pt-0,
.py-0 {
  padding-top: 0 !important;
}

.pr-0,
.px-0 {
  padding-right: 0 !important;
}

.pb-0,
.py-0 {
  padding-bottom: 0 !important;
}

.pl-0,
.px-0 {
  padding-left: 0 !important;
}

.p-2 {
  padding: 0.125rem !important;
}

.pt-2,
.py-2 {
  padding-top: 0.125rem !important;
}

.pr-2,
.px-2 {
  padding-right: 0.125rem !important;
}

.pb-2,
.py-2 {
  padding-bottom: 0.125rem !important;
}

.pl-2,
.px-2 {
  padding-left: 0.125rem !important;
}

.p-4 {
  padding: 0.25rem !important;
}

.pt-4,
.py-4 {
  padding-top: 0.25rem !important;
}

.pr-4,
.px-4 {
  padding-right: 0.25rem !important;
}

.pb-4,
.py-4 {
  padding-bottom: 0.25rem !important;
}

.pl-4,
.px-4 {
  padding-left: 0.25rem !important;
}

.p-8 {
  padding: 0.5rem !important;
}

.pt-8,
.py-8 {
  padding-top: 0.5rem !important;
}

.pr-8,
.px-8 {
  padding-right: 0.5rem !important;
}

.pb-8,
.py-8 {
  padding-bottom: 0.5rem !important;
}

.pl-8,
.px-8 {
  padding-left: 0.5rem !important;
}

.p-12 {
  padding: 0.75rem !important;
}

.pt-12,
.py-12 {
  padding-top: 0.75rem !important;
}

.pr-12,
.px-12 {
  padding-right: 0.75rem !important;
}

.pb-12,
.py-12 {
  padding-bottom: 0.75rem !important;
}

.pl-12,
.px-12 {
  padding-left: 0.75rem !important;
}

.p-16 {
  padding: 1rem !important;
}

.pt-16,
.py-16 {
  padding-top: 1rem !important;
}

.pr-16,
.px-16 {
  padding-right: 1rem !important;
}

.pb-16,
.py-16 {
  padding-bottom: 1rem !important;
}

.pl-16,
.px-16 {
  padding-left: 1rem !important;
}

.p-24 {
  padding: 1.5rem !important;
}

.pt-24,
.py-24 {
  padding-top: 1.5rem !important;
}

.pr-24,
.px-24 {
  padding-right: 1.5rem !important;
}

.pb-24,
.py-24 {
  padding-bottom: 1.5rem !important;
}

.pl-24,
.px-24 {
  padding-left: 1.5rem !important;
}

.p-32 {
  padding: 2rem !important;
}

.pt-32,
.py-32 {
  padding-top: 2rem !important;
}

.pr-32,
.px-32 {
  padding-right: 2rem !important;
}

.pb-32,
.py-32 {
  padding-bottom: 2rem !important;
}

.pl-32,
.px-32 {
  padding-left: 2rem !important;
}

.p-64 {
  padding: 4rem !important;
}

.pt-64,
.py-64 {
  padding-top: 4rem !important;
}

.pr-64,
.px-64 {
  padding-right: 4rem !important;
}

.pb-64,
.py-64 {
  padding-bottom: 4rem !important;
}

.pl-64,
.px-64 {
  padding-left: 4rem !important;
}

.p-80 {
  padding: 4.75rem !important;
}

.pt-80,
.py-80 {
  padding-top: 4.75rem !important;
}

.pr-80,
.px-80 {
  padding-right: 4.75rem !important;
}

.pb-80,
.py-80 {
  padding-bottom: 4.75rem !important;
}

.pl-80,
.px-80 {
  padding-left: 4.75rem !important;
}

@media (min-width: 0px) {
  .m-na-0 {
    margin: 0 !important;
  }

  .mt-na-0,
.my-na-0 {
    margin-top: 0 !important;
  }

  .mr-na-0,
.mx-na-0 {
    margin-right: 0 !important;
  }

  .mb-na-0,
.my-na-0 {
    margin-bottom: 0 !important;
  }

  .ml-na-0,
.mx-na-0 {
    margin-left: 0 !important;
  }

  .m-na-2 {
    margin: 0.125rem !important;
  }

  .mt-na-2,
.my-na-2 {
    margin-top: 0.125rem !important;
  }

  .mr-na-2,
.mx-na-2 {
    margin-right: 0.125rem !important;
  }

  .mb-na-2,
.my-na-2 {
    margin-bottom: 0.125rem !important;
  }

  .ml-na-2,
.mx-na-2 {
    margin-left: 0.125rem !important;
  }

  .m-na-4 {
    margin: 0.25rem !important;
  }

  .mt-na-4,
.my-na-4 {
    margin-top: 0.25rem !important;
  }

  .mr-na-4,
.mx-na-4 {
    margin-right: 0.25rem !important;
  }

  .mb-na-4,
.my-na-4 {
    margin-bottom: 0.25rem !important;
  }

  .ml-na-4,
.mx-na-4 {
    margin-left: 0.25rem !important;
  }

  .m-na-8 {
    margin: 0.5rem !important;
  }

  .mt-na-8,
.my-na-8 {
    margin-top: 0.5rem !important;
  }

  .mr-na-8,
.mx-na-8 {
    margin-right: 0.5rem !important;
  }

  .mb-na-8,
.my-na-8 {
    margin-bottom: 0.5rem !important;
  }

  .ml-na-8,
.mx-na-8 {
    margin-left: 0.5rem !important;
  }

  .m-na-12 {
    margin: 0.75rem !important;
  }

  .mt-na-12,
.my-na-12 {
    margin-top: 0.75rem !important;
  }

  .mr-na-12,
.mx-na-12 {
    margin-right: 0.75rem !important;
  }

  .mb-na-12,
.my-na-12 {
    margin-bottom: 0.75rem !important;
  }

  .ml-na-12,
.mx-na-12 {
    margin-left: 0.75rem !important;
  }

  .m-na-16 {
    margin: 1rem !important;
  }

  .mt-na-16,
.my-na-16 {
    margin-top: 1rem !important;
  }

  .mr-na-16,
.mx-na-16 {
    margin-right: 1rem !important;
  }

  .mb-na-16,
.my-na-16 {
    margin-bottom: 1rem !important;
  }

  .ml-na-16,
.mx-na-16 {
    margin-left: 1rem !important;
  }

  .m-na-24 {
    margin: 1.5rem !important;
  }

  .mt-na-24,
.my-na-24 {
    margin-top: 1.5rem !important;
  }

  .mr-na-24,
.mx-na-24 {
    margin-right: 1.5rem !important;
  }

  .mb-na-24,
.my-na-24 {
    margin-bottom: 1.5rem !important;
  }

  .ml-na-24,
.mx-na-24 {
    margin-left: 1.5rem !important;
  }

  .m-na-32 {
    margin: 2rem !important;
  }

  .mt-na-32,
.my-na-32 {
    margin-top: 2rem !important;
  }

  .mr-na-32,
.mx-na-32 {
    margin-right: 2rem !important;
  }

  .mb-na-32,
.my-na-32 {
    margin-bottom: 2rem !important;
  }

  .ml-na-32,
.mx-na-32 {
    margin-left: 2rem !important;
  }

  .m-na-64 {
    margin: 4rem !important;
  }

  .mt-na-64,
.my-na-64 {
    margin-top: 4rem !important;
  }

  .mr-na-64,
.mx-na-64 {
    margin-right: 4rem !important;
  }

  .mb-na-64,
.my-na-64 {
    margin-bottom: 4rem !important;
  }

  .ml-na-64,
.mx-na-64 {
    margin-left: 4rem !important;
  }

  .m-na-80 {
    margin: 4.75rem !important;
  }

  .mt-na-80,
.my-na-80 {
    margin-top: 4.75rem !important;
  }

  .mr-na-80,
.mx-na-80 {
    margin-right: 4.75rem !important;
  }

  .mb-na-80,
.my-na-80 {
    margin-bottom: 4.75rem !important;
  }

  .ml-na-80,
.mx-na-80 {
    margin-left: 4.75rem !important;
  }

  .p-na-0 {
    padding: 0 !important;
  }

  .pt-na-0,
.py-na-0 {
    padding-top: 0 !important;
  }

  .pr-na-0,
.px-na-0 {
    padding-right: 0 !important;
  }

  .pb-na-0,
.py-na-0 {
    padding-bottom: 0 !important;
  }

  .pl-na-0,
.px-na-0 {
    padding-left: 0 !important;
  }

  .p-na-2 {
    padding: 0.125rem !important;
  }

  .pt-na-2,
.py-na-2 {
    padding-top: 0.125rem !important;
  }

  .pr-na-2,
.px-na-2 {
    padding-right: 0.125rem !important;
  }

  .pb-na-2,
.py-na-2 {
    padding-bottom: 0.125rem !important;
  }

  .pl-na-2,
.px-na-2 {
    padding-left: 0.125rem !important;
  }

  .p-na-4 {
    padding: 0.25rem !important;
  }

  .pt-na-4,
.py-na-4 {
    padding-top: 0.25rem !important;
  }

  .pr-na-4,
.px-na-4 {
    padding-right: 0.25rem !important;
  }

  .pb-na-4,
.py-na-4 {
    padding-bottom: 0.25rem !important;
  }

  .pl-na-4,
.px-na-4 {
    padding-left: 0.25rem !important;
  }

  .p-na-8 {
    padding: 0.5rem !important;
  }

  .pt-na-8,
.py-na-8 {
    padding-top: 0.5rem !important;
  }

  .pr-na-8,
.px-na-8 {
    padding-right: 0.5rem !important;
  }

  .pb-na-8,
.py-na-8 {
    padding-bottom: 0.5rem !important;
  }

  .pl-na-8,
.px-na-8 {
    padding-left: 0.5rem !important;
  }

  .p-na-12 {
    padding: 0.75rem !important;
  }

  .pt-na-12,
.py-na-12 {
    padding-top: 0.75rem !important;
  }

  .pr-na-12,
.px-na-12 {
    padding-right: 0.75rem !important;
  }

  .pb-na-12,
.py-na-12 {
    padding-bottom: 0.75rem !important;
  }

  .pl-na-12,
.px-na-12 {
    padding-left: 0.75rem !important;
  }

  .p-na-16 {
    padding: 1rem !important;
  }

  .pt-na-16,
.py-na-16 {
    padding-top: 1rem !important;
  }

  .pr-na-16,
.px-na-16 {
    padding-right: 1rem !important;
  }

  .pb-na-16,
.py-na-16 {
    padding-bottom: 1rem !important;
  }

  .pl-na-16,
.px-na-16 {
    padding-left: 1rem !important;
  }

  .p-na-24 {
    padding: 1.5rem !important;
  }

  .pt-na-24,
.py-na-24 {
    padding-top: 1.5rem !important;
  }

  .pr-na-24,
.px-na-24 {
    padding-right: 1.5rem !important;
  }

  .pb-na-24,
.py-na-24 {
    padding-bottom: 1.5rem !important;
  }

  .pl-na-24,
.px-na-24 {
    padding-left: 1.5rem !important;
  }

  .p-na-32 {
    padding: 2rem !important;
  }

  .pt-na-32,
.py-na-32 {
    padding-top: 2rem !important;
  }

  .pr-na-32,
.px-na-32 {
    padding-right: 2rem !important;
  }

  .pb-na-32,
.py-na-32 {
    padding-bottom: 2rem !important;
  }

  .pl-na-32,
.px-na-32 {
    padding-left: 2rem !important;
  }

  .p-na-64 {
    padding: 4rem !important;
  }

  .pt-na-64,
.py-na-64 {
    padding-top: 4rem !important;
  }

  .pr-na-64,
.px-na-64 {
    padding-right: 4rem !important;
  }

  .pb-na-64,
.py-na-64 {
    padding-bottom: 4rem !important;
  }

  .pl-na-64,
.px-na-64 {
    padding-left: 4rem !important;
  }

  .p-na-80 {
    padding: 4.75rem !important;
  }

  .pt-na-80,
.py-na-80 {
    padding-top: 4.75rem !important;
  }

  .pr-na-80,
.px-na-80 {
    padding-right: 4.75rem !important;
  }

  .pb-na-80,
.py-na-80 {
    padding-bottom: 4.75rem !important;
  }

  .pl-na-80,
.px-na-80 {
    padding-left: 4.75rem !important;
  }

  .m-na-n2 {
    margin: -0.125rem !important;
  }

  .mt-na-n2,
.my-na-n2 {
    margin-top: -0.125rem !important;
  }

  .mr-na-n2,
.mx-na-n2 {
    margin-right: -0.125rem !important;
  }

  .mb-na-n2,
.my-na-n2 {
    margin-bottom: -0.125rem !important;
  }

  .ml-na-n2,
.mx-na-n2 {
    margin-left: -0.125rem !important;
  }

  .m-na-n4 {
    margin: -0.25rem !important;
  }

  .mt-na-n4,
.my-na-n4 {
    margin-top: -0.25rem !important;
  }

  .mr-na-n4,
.mx-na-n4 {
    margin-right: -0.25rem !important;
  }

  .mb-na-n4,
.my-na-n4 {
    margin-bottom: -0.25rem !important;
  }

  .ml-na-n4,
.mx-na-n4 {
    margin-left: -0.25rem !important;
  }

  .m-na-n8 {
    margin: -0.5rem !important;
  }

  .mt-na-n8,
.my-na-n8 {
    margin-top: -0.5rem !important;
  }

  .mr-na-n8,
.mx-na-n8 {
    margin-right: -0.5rem !important;
  }

  .mb-na-n8,
.my-na-n8 {
    margin-bottom: -0.5rem !important;
  }

  .ml-na-n8,
.mx-na-n8 {
    margin-left: -0.5rem !important;
  }

  .m-na-n12 {
    margin: -0.75rem !important;
  }

  .mt-na-n12,
.my-na-n12 {
    margin-top: -0.75rem !important;
  }

  .mr-na-n12,
.mx-na-n12 {
    margin-right: -0.75rem !important;
  }

  .mb-na-n12,
.my-na-n12 {
    margin-bottom: -0.75rem !important;
  }

  .ml-na-n12,
.mx-na-n12 {
    margin-left: -0.75rem !important;
  }

  .m-na-n16 {
    margin: -1rem !important;
  }

  .mt-na-n16,
.my-na-n16 {
    margin-top: -1rem !important;
  }

  .mr-na-n16,
.mx-na-n16 {
    margin-right: -1rem !important;
  }

  .mb-na-n16,
.my-na-n16 {
    margin-bottom: -1rem !important;
  }

  .ml-na-n16,
.mx-na-n16 {
    margin-left: -1rem !important;
  }

  .m-na-n24 {
    margin: -1.5rem !important;
  }

  .mt-na-n24,
.my-na-n24 {
    margin-top: -1.5rem !important;
  }

  .mr-na-n24,
.mx-na-n24 {
    margin-right: -1.5rem !important;
  }

  .mb-na-n24,
.my-na-n24 {
    margin-bottom: -1.5rem !important;
  }

  .ml-na-n24,
.mx-na-n24 {
    margin-left: -1.5rem !important;
  }

  .m-na-n32 {
    margin: -2rem !important;
  }

  .mt-na-n32,
.my-na-n32 {
    margin-top: -2rem !important;
  }

  .mr-na-n32,
.mx-na-n32 {
    margin-right: -2rem !important;
  }

  .mb-na-n32,
.my-na-n32 {
    margin-bottom: -2rem !important;
  }

  .ml-na-n32,
.mx-na-n32 {
    margin-left: -2rem !important;
  }

  .m-na-n64 {
    margin: -4rem !important;
  }

  .mt-na-n64,
.my-na-n64 {
    margin-top: -4rem !important;
  }

  .mr-na-n64,
.mx-na-n64 {
    margin-right: -4rem !important;
  }

  .mb-na-n64,
.my-na-n64 {
    margin-bottom: -4rem !important;
  }

  .ml-na-n64,
.mx-na-n64 {
    margin-left: -4rem !important;
  }

  .m-na-n80 {
    margin: -4.75rem !important;
  }

  .mt-na-n80,
.my-na-n80 {
    margin-top: -4.75rem !important;
  }

  .mr-na-n80,
.mx-na-n80 {
    margin-right: -4.75rem !important;
  }

  .mb-na-n80,
.my-na-n80 {
    margin-bottom: -4.75rem !important;
  }

  .ml-na-n80,
.mx-na-n80 {
    margin-left: -4.75rem !important;
  }

  .m-na-auto {
    margin: auto !important;
  }

  .mt-na-auto,
.my-na-auto {
    margin-top: auto !important;
  }

  .mr-na-auto,
.mx-na-auto {
    margin-right: auto !important;
  }

  .mb-na-auto,
.my-na-auto {
    margin-bottom: auto !important;
  }

  .ml-na-auto,
.mx-na-auto {
    margin-left: auto !important;
  }
}
@media (min-width: 480px) {
  .m-xs-0 {
    margin: 0 !important;
  }

  .mt-xs-0,
.my-xs-0 {
    margin-top: 0 !important;
  }

  .mr-xs-0,
.mx-xs-0 {
    margin-right: 0 !important;
  }

  .mb-xs-0,
.my-xs-0 {
    margin-bottom: 0 !important;
  }

  .ml-xs-0,
.mx-xs-0 {
    margin-left: 0 !important;
  }

  .m-xs-2 {
    margin: 0.125rem !important;
  }

  .mt-xs-2,
.my-xs-2 {
    margin-top: 0.125rem !important;
  }

  .mr-xs-2,
.mx-xs-2 {
    margin-right: 0.125rem !important;
  }

  .mb-xs-2,
.my-xs-2 {
    margin-bottom: 0.125rem !important;
  }

  .ml-xs-2,
.mx-xs-2 {
    margin-left: 0.125rem !important;
  }

  .m-xs-4 {
    margin: 0.25rem !important;
  }

  .mt-xs-4,
.my-xs-4 {
    margin-top: 0.25rem !important;
  }

  .mr-xs-4,
.mx-xs-4 {
    margin-right: 0.25rem !important;
  }

  .mb-xs-4,
.my-xs-4 {
    margin-bottom: 0.25rem !important;
  }

  .ml-xs-4,
.mx-xs-4 {
    margin-left: 0.25rem !important;
  }

  .m-xs-8 {
    margin: 0.5rem !important;
  }

  .mt-xs-8,
.my-xs-8 {
    margin-top: 0.5rem !important;
  }

  .mr-xs-8,
.mx-xs-8 {
    margin-right: 0.5rem !important;
  }

  .mb-xs-8,
.my-xs-8 {
    margin-bottom: 0.5rem !important;
  }

  .ml-xs-8,
.mx-xs-8 {
    margin-left: 0.5rem !important;
  }

  .m-xs-12 {
    margin: 0.75rem !important;
  }

  .mt-xs-12,
.my-xs-12 {
    margin-top: 0.75rem !important;
  }

  .mr-xs-12,
.mx-xs-12 {
    margin-right: 0.75rem !important;
  }

  .mb-xs-12,
.my-xs-12 {
    margin-bottom: 0.75rem !important;
  }

  .ml-xs-12,
.mx-xs-12 {
    margin-left: 0.75rem !important;
  }

  .m-xs-16 {
    margin: 1rem !important;
  }

  .mt-xs-16,
.my-xs-16 {
    margin-top: 1rem !important;
  }

  .mr-xs-16,
.mx-xs-16 {
    margin-right: 1rem !important;
  }

  .mb-xs-16,
.my-xs-16 {
    margin-bottom: 1rem !important;
  }

  .ml-xs-16,
.mx-xs-16 {
    margin-left: 1rem !important;
  }

  .m-xs-24 {
    margin: 1.5rem !important;
  }

  .mt-xs-24,
.my-xs-24 {
    margin-top: 1.5rem !important;
  }

  .mr-xs-24,
.mx-xs-24 {
    margin-right: 1.5rem !important;
  }

  .mb-xs-24,
.my-xs-24 {
    margin-bottom: 1.5rem !important;
  }

  .ml-xs-24,
.mx-xs-24 {
    margin-left: 1.5rem !important;
  }

  .m-xs-32 {
    margin: 2rem !important;
  }

  .mt-xs-32,
.my-xs-32 {
    margin-top: 2rem !important;
  }

  .mr-xs-32,
.mx-xs-32 {
    margin-right: 2rem !important;
  }

  .mb-xs-32,
.my-xs-32 {
    margin-bottom: 2rem !important;
  }

  .ml-xs-32,
.mx-xs-32 {
    margin-left: 2rem !important;
  }

  .m-xs-64 {
    margin: 4rem !important;
  }

  .mt-xs-64,
.my-xs-64 {
    margin-top: 4rem !important;
  }

  .mr-xs-64,
.mx-xs-64 {
    margin-right: 4rem !important;
  }

  .mb-xs-64,
.my-xs-64 {
    margin-bottom: 4rem !important;
  }

  .ml-xs-64,
.mx-xs-64 {
    margin-left: 4rem !important;
  }

  .m-xs-80 {
    margin: 4.75rem !important;
  }

  .mt-xs-80,
.my-xs-80 {
    margin-top: 4.75rem !important;
  }

  .mr-xs-80,
.mx-xs-80 {
    margin-right: 4.75rem !important;
  }

  .mb-xs-80,
.my-xs-80 {
    margin-bottom: 4.75rem !important;
  }

  .ml-xs-80,
.mx-xs-80 {
    margin-left: 4.75rem !important;
  }

  .p-xs-0 {
    padding: 0 !important;
  }

  .pt-xs-0,
.py-xs-0 {
    padding-top: 0 !important;
  }

  .pr-xs-0,
.px-xs-0 {
    padding-right: 0 !important;
  }

  .pb-xs-0,
.py-xs-0 {
    padding-bottom: 0 !important;
  }

  .pl-xs-0,
.px-xs-0 {
    padding-left: 0 !important;
  }

  .p-xs-2 {
    padding: 0.125rem !important;
  }

  .pt-xs-2,
.py-xs-2 {
    padding-top: 0.125rem !important;
  }

  .pr-xs-2,
.px-xs-2 {
    padding-right: 0.125rem !important;
  }

  .pb-xs-2,
.py-xs-2 {
    padding-bottom: 0.125rem !important;
  }

  .pl-xs-2,
.px-xs-2 {
    padding-left: 0.125rem !important;
  }

  .p-xs-4 {
    padding: 0.25rem !important;
  }

  .pt-xs-4,
.py-xs-4 {
    padding-top: 0.25rem !important;
  }

  .pr-xs-4,
.px-xs-4 {
    padding-right: 0.25rem !important;
  }

  .pb-xs-4,
.py-xs-4 {
    padding-bottom: 0.25rem !important;
  }

  .pl-xs-4,
.px-xs-4 {
    padding-left: 0.25rem !important;
  }

  .p-xs-8 {
    padding: 0.5rem !important;
  }

  .pt-xs-8,
.py-xs-8 {
    padding-top: 0.5rem !important;
  }

  .pr-xs-8,
.px-xs-8 {
    padding-right: 0.5rem !important;
  }

  .pb-xs-8,
.py-xs-8 {
    padding-bottom: 0.5rem !important;
  }

  .pl-xs-8,
.px-xs-8 {
    padding-left: 0.5rem !important;
  }

  .p-xs-12 {
    padding: 0.75rem !important;
  }

  .pt-xs-12,
.py-xs-12 {
    padding-top: 0.75rem !important;
  }

  .pr-xs-12,
.px-xs-12 {
    padding-right: 0.75rem !important;
  }

  .pb-xs-12,
.py-xs-12 {
    padding-bottom: 0.75rem !important;
  }

  .pl-xs-12,
.px-xs-12 {
    padding-left: 0.75rem !important;
  }

  .p-xs-16 {
    padding: 1rem !important;
  }

  .pt-xs-16,
.py-xs-16 {
    padding-top: 1rem !important;
  }

  .pr-xs-16,
.px-xs-16 {
    padding-right: 1rem !important;
  }

  .pb-xs-16,
.py-xs-16 {
    padding-bottom: 1rem !important;
  }

  .pl-xs-16,
.px-xs-16 {
    padding-left: 1rem !important;
  }

  .p-xs-24 {
    padding: 1.5rem !important;
  }

  .pt-xs-24,
.py-xs-24 {
    padding-top: 1.5rem !important;
  }

  .pr-xs-24,
.px-xs-24 {
    padding-right: 1.5rem !important;
  }

  .pb-xs-24,
.py-xs-24 {
    padding-bottom: 1.5rem !important;
  }

  .pl-xs-24,
.px-xs-24 {
    padding-left: 1.5rem !important;
  }

  .p-xs-32 {
    padding: 2rem !important;
  }

  .pt-xs-32,
.py-xs-32 {
    padding-top: 2rem !important;
  }

  .pr-xs-32,
.px-xs-32 {
    padding-right: 2rem !important;
  }

  .pb-xs-32,
.py-xs-32 {
    padding-bottom: 2rem !important;
  }

  .pl-xs-32,
.px-xs-32 {
    padding-left: 2rem !important;
  }

  .p-xs-64 {
    padding: 4rem !important;
  }

  .pt-xs-64,
.py-xs-64 {
    padding-top: 4rem !important;
  }

  .pr-xs-64,
.px-xs-64 {
    padding-right: 4rem !important;
  }

  .pb-xs-64,
.py-xs-64 {
    padding-bottom: 4rem !important;
  }

  .pl-xs-64,
.px-xs-64 {
    padding-left: 4rem !important;
  }

  .p-xs-80 {
    padding: 4.75rem !important;
  }

  .pt-xs-80,
.py-xs-80 {
    padding-top: 4.75rem !important;
  }

  .pr-xs-80,
.px-xs-80 {
    padding-right: 4.75rem !important;
  }

  .pb-xs-80,
.py-xs-80 {
    padding-bottom: 4.75rem !important;
  }

  .pl-xs-80,
.px-xs-80 {
    padding-left: 4.75rem !important;
  }

  .m-xs-n2 {
    margin: -0.125rem !important;
  }

  .mt-xs-n2,
.my-xs-n2 {
    margin-top: -0.125rem !important;
  }

  .mr-xs-n2,
.mx-xs-n2 {
    margin-right: -0.125rem !important;
  }

  .mb-xs-n2,
.my-xs-n2 {
    margin-bottom: -0.125rem !important;
  }

  .ml-xs-n2,
.mx-xs-n2 {
    margin-left: -0.125rem !important;
  }

  .m-xs-n4 {
    margin: -0.25rem !important;
  }

  .mt-xs-n4,
.my-xs-n4 {
    margin-top: -0.25rem !important;
  }

  .mr-xs-n4,
.mx-xs-n4 {
    margin-right: -0.25rem !important;
  }

  .mb-xs-n4,
.my-xs-n4 {
    margin-bottom: -0.25rem !important;
  }

  .ml-xs-n4,
.mx-xs-n4 {
    margin-left: -0.25rem !important;
  }

  .m-xs-n8 {
    margin: -0.5rem !important;
  }

  .mt-xs-n8,
.my-xs-n8 {
    margin-top: -0.5rem !important;
  }

  .mr-xs-n8,
.mx-xs-n8 {
    margin-right: -0.5rem !important;
  }

  .mb-xs-n8,
.my-xs-n8 {
    margin-bottom: -0.5rem !important;
  }

  .ml-xs-n8,
.mx-xs-n8 {
    margin-left: -0.5rem !important;
  }

  .m-xs-n12 {
    margin: -0.75rem !important;
  }

  .mt-xs-n12,
.my-xs-n12 {
    margin-top: -0.75rem !important;
  }

  .mr-xs-n12,
.mx-xs-n12 {
    margin-right: -0.75rem !important;
  }

  .mb-xs-n12,
.my-xs-n12 {
    margin-bottom: -0.75rem !important;
  }

  .ml-xs-n12,
.mx-xs-n12 {
    margin-left: -0.75rem !important;
  }

  .m-xs-n16 {
    margin: -1rem !important;
  }

  .mt-xs-n16,
.my-xs-n16 {
    margin-top: -1rem !important;
  }

  .mr-xs-n16,
.mx-xs-n16 {
    margin-right: -1rem !important;
  }

  .mb-xs-n16,
.my-xs-n16 {
    margin-bottom: -1rem !important;
  }

  .ml-xs-n16,
.mx-xs-n16 {
    margin-left: -1rem !important;
  }

  .m-xs-n24 {
    margin: -1.5rem !important;
  }

  .mt-xs-n24,
.my-xs-n24 {
    margin-top: -1.5rem !important;
  }

  .mr-xs-n24,
.mx-xs-n24 {
    margin-right: -1.5rem !important;
  }

  .mb-xs-n24,
.my-xs-n24 {
    margin-bottom: -1.5rem !important;
  }

  .ml-xs-n24,
.mx-xs-n24 {
    margin-left: -1.5rem !important;
  }

  .m-xs-n32 {
    margin: -2rem !important;
  }

  .mt-xs-n32,
.my-xs-n32 {
    margin-top: -2rem !important;
  }

  .mr-xs-n32,
.mx-xs-n32 {
    margin-right: -2rem !important;
  }

  .mb-xs-n32,
.my-xs-n32 {
    margin-bottom: -2rem !important;
  }

  .ml-xs-n32,
.mx-xs-n32 {
    margin-left: -2rem !important;
  }

  .m-xs-n64 {
    margin: -4rem !important;
  }

  .mt-xs-n64,
.my-xs-n64 {
    margin-top: -4rem !important;
  }

  .mr-xs-n64,
.mx-xs-n64 {
    margin-right: -4rem !important;
  }

  .mb-xs-n64,
.my-xs-n64 {
    margin-bottom: -4rem !important;
  }

  .ml-xs-n64,
.mx-xs-n64 {
    margin-left: -4rem !important;
  }

  .m-xs-n80 {
    margin: -4.75rem !important;
  }

  .mt-xs-n80,
.my-xs-n80 {
    margin-top: -4.75rem !important;
  }

  .mr-xs-n80,
.mx-xs-n80 {
    margin-right: -4.75rem !important;
  }

  .mb-xs-n80,
.my-xs-n80 {
    margin-bottom: -4.75rem !important;
  }

  .ml-xs-n80,
.mx-xs-n80 {
    margin-left: -4.75rem !important;
  }

  .m-xs-auto {
    margin: auto !important;
  }

  .mt-xs-auto,
.my-xs-auto {
    margin-top: auto !important;
  }

  .mr-xs-auto,
.mx-xs-auto {
    margin-right: auto !important;
  }

  .mb-xs-auto,
.my-xs-auto {
    margin-bottom: auto !important;
  }

  .ml-xs-auto,
.mx-xs-auto {
    margin-left: auto !important;
  }
}
@media (min-width: 600px) {
  .m-sm-0 {
    margin: 0 !important;
  }

  .mt-sm-0,
.my-sm-0 {
    margin-top: 0 !important;
  }

  .mr-sm-0,
.mx-sm-0 {
    margin-right: 0 !important;
  }

  .mb-sm-0,
.my-sm-0 {
    margin-bottom: 0 !important;
  }

  .ml-sm-0,
.mx-sm-0 {
    margin-left: 0 !important;
  }

  .m-sm-2 {
    margin: 0.125rem !important;
  }

  .mt-sm-2,
.my-sm-2 {
    margin-top: 0.125rem !important;
  }

  .mr-sm-2,
.mx-sm-2 {
    margin-right: 0.125rem !important;
  }

  .mb-sm-2,
.my-sm-2 {
    margin-bottom: 0.125rem !important;
  }

  .ml-sm-2,
.mx-sm-2 {
    margin-left: 0.125rem !important;
  }

  .m-sm-4 {
    margin: 0.25rem !important;
  }

  .mt-sm-4,
.my-sm-4 {
    margin-top: 0.25rem !important;
  }

  .mr-sm-4,
.mx-sm-4 {
    margin-right: 0.25rem !important;
  }

  .mb-sm-4,
.my-sm-4 {
    margin-bottom: 0.25rem !important;
  }

  .ml-sm-4,
.mx-sm-4 {
    margin-left: 0.25rem !important;
  }

  .m-sm-8 {
    margin: 0.5rem !important;
  }

  .mt-sm-8,
.my-sm-8 {
    margin-top: 0.5rem !important;
  }

  .mr-sm-8,
.mx-sm-8 {
    margin-right: 0.5rem !important;
  }

  .mb-sm-8,
.my-sm-8 {
    margin-bottom: 0.5rem !important;
  }

  .ml-sm-8,
.mx-sm-8 {
    margin-left: 0.5rem !important;
  }

  .m-sm-12 {
    margin: 0.75rem !important;
  }

  .mt-sm-12,
.my-sm-12 {
    margin-top: 0.75rem !important;
  }

  .mr-sm-12,
.mx-sm-12 {
    margin-right: 0.75rem !important;
  }

  .mb-sm-12,
.my-sm-12 {
    margin-bottom: 0.75rem !important;
  }

  .ml-sm-12,
.mx-sm-12 {
    margin-left: 0.75rem !important;
  }

  .m-sm-16 {
    margin: 1rem !important;
  }

  .mt-sm-16,
.my-sm-16 {
    margin-top: 1rem !important;
  }

  .mr-sm-16,
.mx-sm-16 {
    margin-right: 1rem !important;
  }

  .mb-sm-16,
.my-sm-16 {
    margin-bottom: 1rem !important;
  }

  .ml-sm-16,
.mx-sm-16 {
    margin-left: 1rem !important;
  }

  .m-sm-24 {
    margin: 1.5rem !important;
  }

  .mt-sm-24,
.my-sm-24 {
    margin-top: 1.5rem !important;
  }

  .mr-sm-24,
.mx-sm-24 {
    margin-right: 1.5rem !important;
  }

  .mb-sm-24,
.my-sm-24 {
    margin-bottom: 1.5rem !important;
  }

  .ml-sm-24,
.mx-sm-24 {
    margin-left: 1.5rem !important;
  }

  .m-sm-32 {
    margin: 2rem !important;
  }

  .mt-sm-32,
.my-sm-32 {
    margin-top: 2rem !important;
  }

  .mr-sm-32,
.mx-sm-32 {
    margin-right: 2rem !important;
  }

  .mb-sm-32,
.my-sm-32 {
    margin-bottom: 2rem !important;
  }

  .ml-sm-32,
.mx-sm-32 {
    margin-left: 2rem !important;
  }

  .m-sm-64 {
    margin: 4rem !important;
  }

  .mt-sm-64,
.my-sm-64 {
    margin-top: 4rem !important;
  }

  .mr-sm-64,
.mx-sm-64 {
    margin-right: 4rem !important;
  }

  .mb-sm-64,
.my-sm-64 {
    margin-bottom: 4rem !important;
  }

  .ml-sm-64,
.mx-sm-64 {
    margin-left: 4rem !important;
  }

  .m-sm-80 {
    margin: 4.75rem !important;
  }

  .mt-sm-80,
.my-sm-80 {
    margin-top: 4.75rem !important;
  }

  .mr-sm-80,
.mx-sm-80 {
    margin-right: 4.75rem !important;
  }

  .mb-sm-80,
.my-sm-80 {
    margin-bottom: 4.75rem !important;
  }

  .ml-sm-80,
.mx-sm-80 {
    margin-left: 4.75rem !important;
  }

  .p-sm-0 {
    padding: 0 !important;
  }

  .pt-sm-0,
.py-sm-0 {
    padding-top: 0 !important;
  }

  .pr-sm-0,
.px-sm-0 {
    padding-right: 0 !important;
  }

  .pb-sm-0,
.py-sm-0 {
    padding-bottom: 0 !important;
  }

  .pl-sm-0,
.px-sm-0 {
    padding-left: 0 !important;
  }

  .p-sm-2 {
    padding: 0.125rem !important;
  }

  .pt-sm-2,
.py-sm-2 {
    padding-top: 0.125rem !important;
  }

  .pr-sm-2,
.px-sm-2 {
    padding-right: 0.125rem !important;
  }

  .pb-sm-2,
.py-sm-2 {
    padding-bottom: 0.125rem !important;
  }

  .pl-sm-2,
.px-sm-2 {
    padding-left: 0.125rem !important;
  }

  .p-sm-4 {
    padding: 0.25rem !important;
  }

  .pt-sm-4,
.py-sm-4 {
    padding-top: 0.25rem !important;
  }

  .pr-sm-4,
.px-sm-4 {
    padding-right: 0.25rem !important;
  }

  .pb-sm-4,
.py-sm-4 {
    padding-bottom: 0.25rem !important;
  }

  .pl-sm-4,
.px-sm-4 {
    padding-left: 0.25rem !important;
  }

  .p-sm-8 {
    padding: 0.5rem !important;
  }

  .pt-sm-8,
.py-sm-8 {
    padding-top: 0.5rem !important;
  }

  .pr-sm-8,
.px-sm-8 {
    padding-right: 0.5rem !important;
  }

  .pb-sm-8,
.py-sm-8 {
    padding-bottom: 0.5rem !important;
  }

  .pl-sm-8,
.px-sm-8 {
    padding-left: 0.5rem !important;
  }

  .p-sm-12 {
    padding: 0.75rem !important;
  }

  .pt-sm-12,
.py-sm-12 {
    padding-top: 0.75rem !important;
  }

  .pr-sm-12,
.px-sm-12 {
    padding-right: 0.75rem !important;
  }

  .pb-sm-12,
.py-sm-12 {
    padding-bottom: 0.75rem !important;
  }

  .pl-sm-12,
.px-sm-12 {
    padding-left: 0.75rem !important;
  }

  .p-sm-16 {
    padding: 1rem !important;
  }

  .pt-sm-16,
.py-sm-16 {
    padding-top: 1rem !important;
  }

  .pr-sm-16,
.px-sm-16 {
    padding-right: 1rem !important;
  }

  .pb-sm-16,
.py-sm-16 {
    padding-bottom: 1rem !important;
  }

  .pl-sm-16,
.px-sm-16 {
    padding-left: 1rem !important;
  }

  .p-sm-24 {
    padding: 1.5rem !important;
  }

  .pt-sm-24,
.py-sm-24 {
    padding-top: 1.5rem !important;
  }

  .pr-sm-24,
.px-sm-24 {
    padding-right: 1.5rem !important;
  }

  .pb-sm-24,
.py-sm-24 {
    padding-bottom: 1.5rem !important;
  }

  .pl-sm-24,
.px-sm-24 {
    padding-left: 1.5rem !important;
  }

  .p-sm-32 {
    padding: 2rem !important;
  }

  .pt-sm-32,
.py-sm-32 {
    padding-top: 2rem !important;
  }

  .pr-sm-32,
.px-sm-32 {
    padding-right: 2rem !important;
  }

  .pb-sm-32,
.py-sm-32 {
    padding-bottom: 2rem !important;
  }

  .pl-sm-32,
.px-sm-32 {
    padding-left: 2rem !important;
  }

  .p-sm-64 {
    padding: 4rem !important;
  }

  .pt-sm-64,
.py-sm-64 {
    padding-top: 4rem !important;
  }

  .pr-sm-64,
.px-sm-64 {
    padding-right: 4rem !important;
  }

  .pb-sm-64,
.py-sm-64 {
    padding-bottom: 4rem !important;
  }

  .pl-sm-64,
.px-sm-64 {
    padding-left: 4rem !important;
  }

  .p-sm-80 {
    padding: 4.75rem !important;
  }

  .pt-sm-80,
.py-sm-80 {
    padding-top: 4.75rem !important;
  }

  .pr-sm-80,
.px-sm-80 {
    padding-right: 4.75rem !important;
  }

  .pb-sm-80,
.py-sm-80 {
    padding-bottom: 4.75rem !important;
  }

  .pl-sm-80,
.px-sm-80 {
    padding-left: 4.75rem !important;
  }

  .m-sm-n2 {
    margin: -0.125rem !important;
  }

  .mt-sm-n2,
.my-sm-n2 {
    margin-top: -0.125rem !important;
  }

  .mr-sm-n2,
.mx-sm-n2 {
    margin-right: -0.125rem !important;
  }

  .mb-sm-n2,
.my-sm-n2 {
    margin-bottom: -0.125rem !important;
  }

  .ml-sm-n2,
.mx-sm-n2 {
    margin-left: -0.125rem !important;
  }

  .m-sm-n4 {
    margin: -0.25rem !important;
  }

  .mt-sm-n4,
.my-sm-n4 {
    margin-top: -0.25rem !important;
  }

  .mr-sm-n4,
.mx-sm-n4 {
    margin-right: -0.25rem !important;
  }

  .mb-sm-n4,
.my-sm-n4 {
    margin-bottom: -0.25rem !important;
  }

  .ml-sm-n4,
.mx-sm-n4 {
    margin-left: -0.25rem !important;
  }

  .m-sm-n8 {
    margin: -0.5rem !important;
  }

  .mt-sm-n8,
.my-sm-n8 {
    margin-top: -0.5rem !important;
  }

  .mr-sm-n8,
.mx-sm-n8 {
    margin-right: -0.5rem !important;
  }

  .mb-sm-n8,
.my-sm-n8 {
    margin-bottom: -0.5rem !important;
  }

  .ml-sm-n8,
.mx-sm-n8 {
    margin-left: -0.5rem !important;
  }

  .m-sm-n12 {
    margin: -0.75rem !important;
  }

  .mt-sm-n12,
.my-sm-n12 {
    margin-top: -0.75rem !important;
  }

  .mr-sm-n12,
.mx-sm-n12 {
    margin-right: -0.75rem !important;
  }

  .mb-sm-n12,
.my-sm-n12 {
    margin-bottom: -0.75rem !important;
  }

  .ml-sm-n12,
.mx-sm-n12 {
    margin-left: -0.75rem !important;
  }

  .m-sm-n16 {
    margin: -1rem !important;
  }

  .mt-sm-n16,
.my-sm-n16 {
    margin-top: -1rem !important;
  }

  .mr-sm-n16,
.mx-sm-n16 {
    margin-right: -1rem !important;
  }

  .mb-sm-n16,
.my-sm-n16 {
    margin-bottom: -1rem !important;
  }

  .ml-sm-n16,
.mx-sm-n16 {
    margin-left: -1rem !important;
  }

  .m-sm-n24 {
    margin: -1.5rem !important;
  }

  .mt-sm-n24,
.my-sm-n24 {
    margin-top: -1.5rem !important;
  }

  .mr-sm-n24,
.mx-sm-n24 {
    margin-right: -1.5rem !important;
  }

  .mb-sm-n24,
.my-sm-n24 {
    margin-bottom: -1.5rem !important;
  }

  .ml-sm-n24,
.mx-sm-n24 {
    margin-left: -1.5rem !important;
  }

  .m-sm-n32 {
    margin: -2rem !important;
  }

  .mt-sm-n32,
.my-sm-n32 {
    margin-top: -2rem !important;
  }

  .mr-sm-n32,
.mx-sm-n32 {
    margin-right: -2rem !important;
  }

  .mb-sm-n32,
.my-sm-n32 {
    margin-bottom: -2rem !important;
  }

  .ml-sm-n32,
.mx-sm-n32 {
    margin-left: -2rem !important;
  }

  .m-sm-n64 {
    margin: -4rem !important;
  }

  .mt-sm-n64,
.my-sm-n64 {
    margin-top: -4rem !important;
  }

  .mr-sm-n64,
.mx-sm-n64 {
    margin-right: -4rem !important;
  }

  .mb-sm-n64,
.my-sm-n64 {
    margin-bottom: -4rem !important;
  }

  .ml-sm-n64,
.mx-sm-n64 {
    margin-left: -4rem !important;
  }

  .m-sm-n80 {
    margin: -4.75rem !important;
  }

  .mt-sm-n80,
.my-sm-n80 {
    margin-top: -4.75rem !important;
  }

  .mr-sm-n80,
.mx-sm-n80 {
    margin-right: -4.75rem !important;
  }

  .mb-sm-n80,
.my-sm-n80 {
    margin-bottom: -4.75rem !important;
  }

  .ml-sm-n80,
.mx-sm-n80 {
    margin-left: -4.75rem !important;
  }

  .m-sm-auto {
    margin: auto !important;
  }

  .mt-sm-auto,
.my-sm-auto {
    margin-top: auto !important;
  }

  .mr-sm-auto,
.mx-sm-auto {
    margin-right: auto !important;
  }

  .mb-sm-auto,
.my-sm-auto {
    margin-bottom: auto !important;
  }

  .ml-sm-auto,
.mx-sm-auto {
    margin-left: auto !important;
  }
}
@media (min-width: 768px) {
  .m-md-0 {
    margin: 0 !important;
  }

  .mt-md-0,
.my-md-0 {
    margin-top: 0 !important;
  }

  .mr-md-0,
.mx-md-0 {
    margin-right: 0 !important;
  }

  .mb-md-0,
.my-md-0 {
    margin-bottom: 0 !important;
  }

  .ml-md-0,
.mx-md-0 {
    margin-left: 0 !important;
  }

  .m-md-2 {
    margin: 0.125rem !important;
  }

  .mt-md-2,
.my-md-2 {
    margin-top: 0.125rem !important;
  }

  .mr-md-2,
.mx-md-2 {
    margin-right: 0.125rem !important;
  }

  .mb-md-2,
.my-md-2 {
    margin-bottom: 0.125rem !important;
  }

  .ml-md-2,
.mx-md-2 {
    margin-left: 0.125rem !important;
  }

  .m-md-4 {
    margin: 0.25rem !important;
  }

  .mt-md-4,
.my-md-4 {
    margin-top: 0.25rem !important;
  }

  .mr-md-4,
.mx-md-4 {
    margin-right: 0.25rem !important;
  }

  .mb-md-4,
.my-md-4 {
    margin-bottom: 0.25rem !important;
  }

  .ml-md-4,
.mx-md-4 {
    margin-left: 0.25rem !important;
  }

  .m-md-8 {
    margin: 0.5rem !important;
  }

  .mt-md-8,
.my-md-8 {
    margin-top: 0.5rem !important;
  }

  .mr-md-8,
.mx-md-8 {
    margin-right: 0.5rem !important;
  }

  .mb-md-8,
.my-md-8 {
    margin-bottom: 0.5rem !important;
  }

  .ml-md-8,
.mx-md-8 {
    margin-left: 0.5rem !important;
  }

  .m-md-12 {
    margin: 0.75rem !important;
  }

  .mt-md-12,
.my-md-12 {
    margin-top: 0.75rem !important;
  }

  .mr-md-12,
.mx-md-12 {
    margin-right: 0.75rem !important;
  }

  .mb-md-12,
.my-md-12 {
    margin-bottom: 0.75rem !important;
  }

  .ml-md-12,
.mx-md-12 {
    margin-left: 0.75rem !important;
  }

  .m-md-16 {
    margin: 1rem !important;
  }

  .mt-md-16,
.my-md-16 {
    margin-top: 1rem !important;
  }

  .mr-md-16,
.mx-md-16 {
    margin-right: 1rem !important;
  }

  .mb-md-16,
.my-md-16 {
    margin-bottom: 1rem !important;
  }

  .ml-md-16,
.mx-md-16 {
    margin-left: 1rem !important;
  }

  .m-md-24 {
    margin: 1.5rem !important;
  }

  .mt-md-24,
.my-md-24 {
    margin-top: 1.5rem !important;
  }

  .mr-md-24,
.mx-md-24 {
    margin-right: 1.5rem !important;
  }

  .mb-md-24,
.my-md-24 {
    margin-bottom: 1.5rem !important;
  }

  .ml-md-24,
.mx-md-24 {
    margin-left: 1.5rem !important;
  }

  .m-md-32 {
    margin: 2rem !important;
  }

  .mt-md-32,
.my-md-32 {
    margin-top: 2rem !important;
  }

  .mr-md-32,
.mx-md-32 {
    margin-right: 2rem !important;
  }

  .mb-md-32,
.my-md-32 {
    margin-bottom: 2rem !important;
  }

  .ml-md-32,
.mx-md-32 {
    margin-left: 2rem !important;
  }

  .m-md-64 {
    margin: 4rem !important;
  }

  .mt-md-64,
.my-md-64 {
    margin-top: 4rem !important;
  }

  .mr-md-64,
.mx-md-64 {
    margin-right: 4rem !important;
  }

  .mb-md-64,
.my-md-64 {
    margin-bottom: 4rem !important;
  }

  .ml-md-64,
.mx-md-64 {
    margin-left: 4rem !important;
  }

  .m-md-80 {
    margin: 4.75rem !important;
  }

  .mt-md-80,
.my-md-80 {
    margin-top: 4.75rem !important;
  }

  .mr-md-80,
.mx-md-80 {
    margin-right: 4.75rem !important;
  }

  .mb-md-80,
.my-md-80 {
    margin-bottom: 4.75rem !important;
  }

  .ml-md-80,
.mx-md-80 {
    margin-left: 4.75rem !important;
  }

  .p-md-0 {
    padding: 0 !important;
  }

  .pt-md-0,
.py-md-0 {
    padding-top: 0 !important;
  }

  .pr-md-0,
.px-md-0 {
    padding-right: 0 !important;
  }

  .pb-md-0,
.py-md-0 {
    padding-bottom: 0 !important;
  }

  .pl-md-0,
.px-md-0 {
    padding-left: 0 !important;
  }

  .p-md-2 {
    padding: 0.125rem !important;
  }

  .pt-md-2,
.py-md-2 {
    padding-top: 0.125rem !important;
  }

  .pr-md-2,
.px-md-2 {
    padding-right: 0.125rem !important;
  }

  .pb-md-2,
.py-md-2 {
    padding-bottom: 0.125rem !important;
  }

  .pl-md-2,
.px-md-2 {
    padding-left: 0.125rem !important;
  }

  .p-md-4 {
    padding: 0.25rem !important;
  }

  .pt-md-4,
.py-md-4 {
    padding-top: 0.25rem !important;
  }

  .pr-md-4,
.px-md-4 {
    padding-right: 0.25rem !important;
  }

  .pb-md-4,
.py-md-4 {
    padding-bottom: 0.25rem !important;
  }

  .pl-md-4,
.px-md-4 {
    padding-left: 0.25rem !important;
  }

  .p-md-8 {
    padding: 0.5rem !important;
  }

  .pt-md-8,
.py-md-8 {
    padding-top: 0.5rem !important;
  }

  .pr-md-8,
.px-md-8 {
    padding-right: 0.5rem !important;
  }

  .pb-md-8,
.py-md-8 {
    padding-bottom: 0.5rem !important;
  }

  .pl-md-8,
.px-md-8 {
    padding-left: 0.5rem !important;
  }

  .p-md-12 {
    padding: 0.75rem !important;
  }

  .pt-md-12,
.py-md-12 {
    padding-top: 0.75rem !important;
  }

  .pr-md-12,
.px-md-12 {
    padding-right: 0.75rem !important;
  }

  .pb-md-12,
.py-md-12 {
    padding-bottom: 0.75rem !important;
  }

  .pl-md-12,
.px-md-12 {
    padding-left: 0.75rem !important;
  }

  .p-md-16 {
    padding: 1rem !important;
  }

  .pt-md-16,
.py-md-16 {
    padding-top: 1rem !important;
  }

  .pr-md-16,
.px-md-16 {
    padding-right: 1rem !important;
  }

  .pb-md-16,
.py-md-16 {
    padding-bottom: 1rem !important;
  }

  .pl-md-16,
.px-md-16 {
    padding-left: 1rem !important;
  }

  .p-md-24 {
    padding: 1.5rem !important;
  }

  .pt-md-24,
.py-md-24 {
    padding-top: 1.5rem !important;
  }

  .pr-md-24,
.px-md-24 {
    padding-right: 1.5rem !important;
  }

  .pb-md-24,
.py-md-24 {
    padding-bottom: 1.5rem !important;
  }

  .pl-md-24,
.px-md-24 {
    padding-left: 1.5rem !important;
  }

  .p-md-32 {
    padding: 2rem !important;
  }

  .pt-md-32,
.py-md-32 {
    padding-top: 2rem !important;
  }

  .pr-md-32,
.px-md-32 {
    padding-right: 2rem !important;
  }

  .pb-md-32,
.py-md-32 {
    padding-bottom: 2rem !important;
  }

  .pl-md-32,
.px-md-32 {
    padding-left: 2rem !important;
  }

  .p-md-64 {
    padding: 4rem !important;
  }

  .pt-md-64,
.py-md-64 {
    padding-top: 4rem !important;
  }

  .pr-md-64,
.px-md-64 {
    padding-right: 4rem !important;
  }

  .pb-md-64,
.py-md-64 {
    padding-bottom: 4rem !important;
  }

  .pl-md-64,
.px-md-64 {
    padding-left: 4rem !important;
  }

  .p-md-80 {
    padding: 4.75rem !important;
  }

  .pt-md-80,
.py-md-80 {
    padding-top: 4.75rem !important;
  }

  .pr-md-80,
.px-md-80 {
    padding-right: 4.75rem !important;
  }

  .pb-md-80,
.py-md-80 {
    padding-bottom: 4.75rem !important;
  }

  .pl-md-80,
.px-md-80 {
    padding-left: 4.75rem !important;
  }

  .m-md-n2 {
    margin: -0.125rem !important;
  }

  .mt-md-n2,
.my-md-n2 {
    margin-top: -0.125rem !important;
  }

  .mr-md-n2,
.mx-md-n2 {
    margin-right: -0.125rem !important;
  }

  .mb-md-n2,
.my-md-n2 {
    margin-bottom: -0.125rem !important;
  }

  .ml-md-n2,
.mx-md-n2 {
    margin-left: -0.125rem !important;
  }

  .m-md-n4 {
    margin: -0.25rem !important;
  }

  .mt-md-n4,
.my-md-n4 {
    margin-top: -0.25rem !important;
  }

  .mr-md-n4,
.mx-md-n4 {
    margin-right: -0.25rem !important;
  }

  .mb-md-n4,
.my-md-n4 {
    margin-bottom: -0.25rem !important;
  }

  .ml-md-n4,
.mx-md-n4 {
    margin-left: -0.25rem !important;
  }

  .m-md-n8 {
    margin: -0.5rem !important;
  }

  .mt-md-n8,
.my-md-n8 {
    margin-top: -0.5rem !important;
  }

  .mr-md-n8,
.mx-md-n8 {
    margin-right: -0.5rem !important;
  }

  .mb-md-n8,
.my-md-n8 {
    margin-bottom: -0.5rem !important;
  }

  .ml-md-n8,
.mx-md-n8 {
    margin-left: -0.5rem !important;
  }

  .m-md-n12 {
    margin: -0.75rem !important;
  }

  .mt-md-n12,
.my-md-n12 {
    margin-top: -0.75rem !important;
  }

  .mr-md-n12,
.mx-md-n12 {
    margin-right: -0.75rem !important;
  }

  .mb-md-n12,
.my-md-n12 {
    margin-bottom: -0.75rem !important;
  }

  .ml-md-n12,
.mx-md-n12 {
    margin-left: -0.75rem !important;
  }

  .m-md-n16 {
    margin: -1rem !important;
  }

  .mt-md-n16,
.my-md-n16 {
    margin-top: -1rem !important;
  }

  .mr-md-n16,
.mx-md-n16 {
    margin-right: -1rem !important;
  }

  .mb-md-n16,
.my-md-n16 {
    margin-bottom: -1rem !important;
  }

  .ml-md-n16,
.mx-md-n16 {
    margin-left: -1rem !important;
  }

  .m-md-n24 {
    margin: -1.5rem !important;
  }

  .mt-md-n24,
.my-md-n24 {
    margin-top: -1.5rem !important;
  }

  .mr-md-n24,
.mx-md-n24 {
    margin-right: -1.5rem !important;
  }

  .mb-md-n24,
.my-md-n24 {
    margin-bottom: -1.5rem !important;
  }

  .ml-md-n24,
.mx-md-n24 {
    margin-left: -1.5rem !important;
  }

  .m-md-n32 {
    margin: -2rem !important;
  }

  .mt-md-n32,
.my-md-n32 {
    margin-top: -2rem !important;
  }

  .mr-md-n32,
.mx-md-n32 {
    margin-right: -2rem !important;
  }

  .mb-md-n32,
.my-md-n32 {
    margin-bottom: -2rem !important;
  }

  .ml-md-n32,
.mx-md-n32 {
    margin-left: -2rem !important;
  }

  .m-md-n64 {
    margin: -4rem !important;
  }

  .mt-md-n64,
.my-md-n64 {
    margin-top: -4rem !important;
  }

  .mr-md-n64,
.mx-md-n64 {
    margin-right: -4rem !important;
  }

  .mb-md-n64,
.my-md-n64 {
    margin-bottom: -4rem !important;
  }

  .ml-md-n64,
.mx-md-n64 {
    margin-left: -4rem !important;
  }

  .m-md-n80 {
    margin: -4.75rem !important;
  }

  .mt-md-n80,
.my-md-n80 {
    margin-top: -4.75rem !important;
  }

  .mr-md-n80,
.mx-md-n80 {
    margin-right: -4.75rem !important;
  }

  .mb-md-n80,
.my-md-n80 {
    margin-bottom: -4.75rem !important;
  }

  .ml-md-n80,
.mx-md-n80 {
    margin-left: -4.75rem !important;
  }

  .m-md-auto {
    margin: auto !important;
  }

  .mt-md-auto,
.my-md-auto {
    margin-top: auto !important;
  }

  .mr-md-auto,
.mx-md-auto {
    margin-right: auto !important;
  }

  .mb-md-auto,
.my-md-auto {
    margin-bottom: auto !important;
  }

  .ml-md-auto,
.mx-md-auto {
    margin-left: auto !important;
  }
}
@media (min-width: 1024px) {
  .m-lg-0 {
    margin: 0 !important;
  }

  .mt-lg-0,
.my-lg-0 {
    margin-top: 0 !important;
  }

  .mr-lg-0,
.mx-lg-0 {
    margin-right: 0 !important;
  }

  .mb-lg-0,
.my-lg-0 {
    margin-bottom: 0 !important;
  }

  .ml-lg-0,
.mx-lg-0 {
    margin-left: 0 !important;
  }

  .m-lg-2 {
    margin: 0.125rem !important;
  }

  .mt-lg-2,
.my-lg-2 {
    margin-top: 0.125rem !important;
  }

  .mr-lg-2,
.mx-lg-2 {
    margin-right: 0.125rem !important;
  }

  .mb-lg-2,
.my-lg-2 {
    margin-bottom: 0.125rem !important;
  }

  .ml-lg-2,
.mx-lg-2 {
    margin-left: 0.125rem !important;
  }

  .m-lg-4 {
    margin: 0.25rem !important;
  }

  .mt-lg-4,
.my-lg-4 {
    margin-top: 0.25rem !important;
  }

  .mr-lg-4,
.mx-lg-4 {
    margin-right: 0.25rem !important;
  }

  .mb-lg-4,
.my-lg-4 {
    margin-bottom: 0.25rem !important;
  }

  .ml-lg-4,
.mx-lg-4 {
    margin-left: 0.25rem !important;
  }

  .m-lg-8 {
    margin: 0.5rem !important;
  }

  .mt-lg-8,
.my-lg-8 {
    margin-top: 0.5rem !important;
  }

  .mr-lg-8,
.mx-lg-8 {
    margin-right: 0.5rem !important;
  }

  .mb-lg-8,
.my-lg-8 {
    margin-bottom: 0.5rem !important;
  }

  .ml-lg-8,
.mx-lg-8 {
    margin-left: 0.5rem !important;
  }

  .m-lg-12 {
    margin: 0.75rem !important;
  }

  .mt-lg-12,
.my-lg-12 {
    margin-top: 0.75rem !important;
  }

  .mr-lg-12,
.mx-lg-12 {
    margin-right: 0.75rem !important;
  }

  .mb-lg-12,
.my-lg-12 {
    margin-bottom: 0.75rem !important;
  }

  .ml-lg-12,
.mx-lg-12 {
    margin-left: 0.75rem !important;
  }

  .m-lg-16 {
    margin: 1rem !important;
  }

  .mt-lg-16,
.my-lg-16 {
    margin-top: 1rem !important;
  }

  .mr-lg-16,
.mx-lg-16 {
    margin-right: 1rem !important;
  }

  .mb-lg-16,
.my-lg-16 {
    margin-bottom: 1rem !important;
  }

  .ml-lg-16,
.mx-lg-16 {
    margin-left: 1rem !important;
  }

  .m-lg-24 {
    margin: 1.5rem !important;
  }

  .mt-lg-24,
.my-lg-24 {
    margin-top: 1.5rem !important;
  }

  .mr-lg-24,
.mx-lg-24 {
    margin-right: 1.5rem !important;
  }

  .mb-lg-24,
.my-lg-24 {
    margin-bottom: 1.5rem !important;
  }

  .ml-lg-24,
.mx-lg-24 {
    margin-left: 1.5rem !important;
  }

  .m-lg-32 {
    margin: 2rem !important;
  }

  .mt-lg-32,
.my-lg-32 {
    margin-top: 2rem !important;
  }

  .mr-lg-32,
.mx-lg-32 {
    margin-right: 2rem !important;
  }

  .mb-lg-32,
.my-lg-32 {
    margin-bottom: 2rem !important;
  }

  .ml-lg-32,
.mx-lg-32 {
    margin-left: 2rem !important;
  }

  .m-lg-64 {
    margin: 4rem !important;
  }

  .mt-lg-64,
.my-lg-64 {
    margin-top: 4rem !important;
  }

  .mr-lg-64,
.mx-lg-64 {
    margin-right: 4rem !important;
  }

  .mb-lg-64,
.my-lg-64 {
    margin-bottom: 4rem !important;
  }

  .ml-lg-64,
.mx-lg-64 {
    margin-left: 4rem !important;
  }

  .m-lg-80 {
    margin: 4.75rem !important;
  }

  .mt-lg-80,
.my-lg-80 {
    margin-top: 4.75rem !important;
  }

  .mr-lg-80,
.mx-lg-80 {
    margin-right: 4.75rem !important;
  }

  .mb-lg-80,
.my-lg-80 {
    margin-bottom: 4.75rem !important;
  }

  .ml-lg-80,
.mx-lg-80 {
    margin-left: 4.75rem !important;
  }

  .p-lg-0 {
    padding: 0 !important;
  }

  .pt-lg-0,
.py-lg-0 {
    padding-top: 0 !important;
  }

  .pr-lg-0,
.px-lg-0 {
    padding-right: 0 !important;
  }

  .pb-lg-0,
.py-lg-0 {
    padding-bottom: 0 !important;
  }

  .pl-lg-0,
.px-lg-0 {
    padding-left: 0 !important;
  }

  .p-lg-2 {
    padding: 0.125rem !important;
  }

  .pt-lg-2,
.py-lg-2 {
    padding-top: 0.125rem !important;
  }

  .pr-lg-2,
.px-lg-2 {
    padding-right: 0.125rem !important;
  }

  .pb-lg-2,
.py-lg-2 {
    padding-bottom: 0.125rem !important;
  }

  .pl-lg-2,
.px-lg-2 {
    padding-left: 0.125rem !important;
  }

  .p-lg-4 {
    padding: 0.25rem !important;
  }

  .pt-lg-4,
.py-lg-4 {
    padding-top: 0.25rem !important;
  }

  .pr-lg-4,
.px-lg-4 {
    padding-right: 0.25rem !important;
  }

  .pb-lg-4,
.py-lg-4 {
    padding-bottom: 0.25rem !important;
  }

  .pl-lg-4,
.px-lg-4 {
    padding-left: 0.25rem !important;
  }

  .p-lg-8 {
    padding: 0.5rem !important;
  }

  .pt-lg-8,
.py-lg-8 {
    padding-top: 0.5rem !important;
  }

  .pr-lg-8,
.px-lg-8 {
    padding-right: 0.5rem !important;
  }

  .pb-lg-8,
.py-lg-8 {
    padding-bottom: 0.5rem !important;
  }

  .pl-lg-8,
.px-lg-8 {
    padding-left: 0.5rem !important;
  }

  .p-lg-12 {
    padding: 0.75rem !important;
  }

  .pt-lg-12,
.py-lg-12 {
    padding-top: 0.75rem !important;
  }

  .pr-lg-12,
.px-lg-12 {
    padding-right: 0.75rem !important;
  }

  .pb-lg-12,
.py-lg-12 {
    padding-bottom: 0.75rem !important;
  }

  .pl-lg-12,
.px-lg-12 {
    padding-left: 0.75rem !important;
  }

  .p-lg-16 {
    padding: 1rem !important;
  }

  .pt-lg-16,
.py-lg-16 {
    padding-top: 1rem !important;
  }

  .pr-lg-16,
.px-lg-16 {
    padding-right: 1rem !important;
  }

  .pb-lg-16,
.py-lg-16 {
    padding-bottom: 1rem !important;
  }

  .pl-lg-16,
.px-lg-16 {
    padding-left: 1rem !important;
  }

  .p-lg-24 {
    padding: 1.5rem !important;
  }

  .pt-lg-24,
.py-lg-24 {
    padding-top: 1.5rem !important;
  }

  .pr-lg-24,
.px-lg-24 {
    padding-right: 1.5rem !important;
  }

  .pb-lg-24,
.py-lg-24 {
    padding-bottom: 1.5rem !important;
  }

  .pl-lg-24,
.px-lg-24 {
    padding-left: 1.5rem !important;
  }

  .p-lg-32 {
    padding: 2rem !important;
  }

  .pt-lg-32,
.py-lg-32 {
    padding-top: 2rem !important;
  }

  .pr-lg-32,
.px-lg-32 {
    padding-right: 2rem !important;
  }

  .pb-lg-32,
.py-lg-32 {
    padding-bottom: 2rem !important;
  }

  .pl-lg-32,
.px-lg-32 {
    padding-left: 2rem !important;
  }

  .p-lg-64 {
    padding: 4rem !important;
  }

  .pt-lg-64,
.py-lg-64 {
    padding-top: 4rem !important;
  }

  .pr-lg-64,
.px-lg-64 {
    padding-right: 4rem !important;
  }

  .pb-lg-64,
.py-lg-64 {
    padding-bottom: 4rem !important;
  }

  .pl-lg-64,
.px-lg-64 {
    padding-left: 4rem !important;
  }

  .p-lg-80 {
    padding: 4.75rem !important;
  }

  .pt-lg-80,
.py-lg-80 {
    padding-top: 4.75rem !important;
  }

  .pr-lg-80,
.px-lg-80 {
    padding-right: 4.75rem !important;
  }

  .pb-lg-80,
.py-lg-80 {
    padding-bottom: 4.75rem !important;
  }

  .pl-lg-80,
.px-lg-80 {
    padding-left: 4.75rem !important;
  }

  .m-lg-n2 {
    margin: -0.125rem !important;
  }

  .mt-lg-n2,
.my-lg-n2 {
    margin-top: -0.125rem !important;
  }

  .mr-lg-n2,
.mx-lg-n2 {
    margin-right: -0.125rem !important;
  }

  .mb-lg-n2,
.my-lg-n2 {
    margin-bottom: -0.125rem !important;
  }

  .ml-lg-n2,
.mx-lg-n2 {
    margin-left: -0.125rem !important;
  }

  .m-lg-n4 {
    margin: -0.25rem !important;
  }

  .mt-lg-n4,
.my-lg-n4 {
    margin-top: -0.25rem !important;
  }

  .mr-lg-n4,
.mx-lg-n4 {
    margin-right: -0.25rem !important;
  }

  .mb-lg-n4,
.my-lg-n4 {
    margin-bottom: -0.25rem !important;
  }

  .ml-lg-n4,
.mx-lg-n4 {
    margin-left: -0.25rem !important;
  }

  .m-lg-n8 {
    margin: -0.5rem !important;
  }

  .mt-lg-n8,
.my-lg-n8 {
    margin-top: -0.5rem !important;
  }

  .mr-lg-n8,
.mx-lg-n8 {
    margin-right: -0.5rem !important;
  }

  .mb-lg-n8,
.my-lg-n8 {
    margin-bottom: -0.5rem !important;
  }

  .ml-lg-n8,
.mx-lg-n8 {
    margin-left: -0.5rem !important;
  }

  .m-lg-n12 {
    margin: -0.75rem !important;
  }

  .mt-lg-n12,
.my-lg-n12 {
    margin-top: -0.75rem !important;
  }

  .mr-lg-n12,
.mx-lg-n12 {
    margin-right: -0.75rem !important;
  }

  .mb-lg-n12,
.my-lg-n12 {
    margin-bottom: -0.75rem !important;
  }

  .ml-lg-n12,
.mx-lg-n12 {
    margin-left: -0.75rem !important;
  }

  .m-lg-n16 {
    margin: -1rem !important;
  }

  .mt-lg-n16,
.my-lg-n16 {
    margin-top: -1rem !important;
  }

  .mr-lg-n16,
.mx-lg-n16 {
    margin-right: -1rem !important;
  }

  .mb-lg-n16,
.my-lg-n16 {
    margin-bottom: -1rem !important;
  }

  .ml-lg-n16,
.mx-lg-n16 {
    margin-left: -1rem !important;
  }

  .m-lg-n24 {
    margin: -1.5rem !important;
  }

  .mt-lg-n24,
.my-lg-n24 {
    margin-top: -1.5rem !important;
  }

  .mr-lg-n24,
.mx-lg-n24 {
    margin-right: -1.5rem !important;
  }

  .mb-lg-n24,
.my-lg-n24 {
    margin-bottom: -1.5rem !important;
  }

  .ml-lg-n24,
.mx-lg-n24 {
    margin-left: -1.5rem !important;
  }

  .m-lg-n32 {
    margin: -2rem !important;
  }

  .mt-lg-n32,
.my-lg-n32 {
    margin-top: -2rem !important;
  }

  .mr-lg-n32,
.mx-lg-n32 {
    margin-right: -2rem !important;
  }

  .mb-lg-n32,
.my-lg-n32 {
    margin-bottom: -2rem !important;
  }

  .ml-lg-n32,
.mx-lg-n32 {
    margin-left: -2rem !important;
  }

  .m-lg-n64 {
    margin: -4rem !important;
  }

  .mt-lg-n64,
.my-lg-n64 {
    margin-top: -4rem !important;
  }

  .mr-lg-n64,
.mx-lg-n64 {
    margin-right: -4rem !important;
  }

  .mb-lg-n64,
.my-lg-n64 {
    margin-bottom: -4rem !important;
  }

  .ml-lg-n64,
.mx-lg-n64 {
    margin-left: -4rem !important;
  }

  .m-lg-n80 {
    margin: -4.75rem !important;
  }

  .mt-lg-n80,
.my-lg-n80 {
    margin-top: -4.75rem !important;
  }

  .mr-lg-n80,
.mx-lg-n80 {
    margin-right: -4.75rem !important;
  }

  .mb-lg-n80,
.my-lg-n80 {
    margin-bottom: -4.75rem !important;
  }

  .ml-lg-n80,
.mx-lg-n80 {
    margin-left: -4.75rem !important;
  }

  .m-lg-auto {
    margin: auto !important;
  }

  .mt-lg-auto,
.my-lg-auto {
    margin-top: auto !important;
  }

  .mr-lg-auto,
.mx-lg-auto {
    margin-right: auto !important;
  }

  .mb-lg-auto,
.my-lg-auto {
    margin-bottom: auto !important;
  }

  .ml-lg-auto,
.mx-lg-auto {
    margin-left: auto !important;
  }
}
@media (min-width: 1280px) {
  .m-xl-0 {
    margin: 0 !important;
  }

  .mt-xl-0,
.my-xl-0 {
    margin-top: 0 !important;
  }

  .mr-xl-0,
.mx-xl-0 {
    margin-right: 0 !important;
  }

  .mb-xl-0,
.my-xl-0 {
    margin-bottom: 0 !important;
  }

  .ml-xl-0,
.mx-xl-0 {
    margin-left: 0 !important;
  }

  .m-xl-2 {
    margin: 0.125rem !important;
  }

  .mt-xl-2,
.my-xl-2 {
    margin-top: 0.125rem !important;
  }

  .mr-xl-2,
.mx-xl-2 {
    margin-right: 0.125rem !important;
  }

  .mb-xl-2,
.my-xl-2 {
    margin-bottom: 0.125rem !important;
  }

  .ml-xl-2,
.mx-xl-2 {
    margin-left: 0.125rem !important;
  }

  .m-xl-4 {
    margin: 0.25rem !important;
  }

  .mt-xl-4,
.my-xl-4 {
    margin-top: 0.25rem !important;
  }

  .mr-xl-4,
.mx-xl-4 {
    margin-right: 0.25rem !important;
  }

  .mb-xl-4,
.my-xl-4 {
    margin-bottom: 0.25rem !important;
  }

  .ml-xl-4,
.mx-xl-4 {
    margin-left: 0.25rem !important;
  }

  .m-xl-8 {
    margin: 0.5rem !important;
  }

  .mt-xl-8,
.my-xl-8 {
    margin-top: 0.5rem !important;
  }

  .mr-xl-8,
.mx-xl-8 {
    margin-right: 0.5rem !important;
  }

  .mb-xl-8,
.my-xl-8 {
    margin-bottom: 0.5rem !important;
  }

  .ml-xl-8,
.mx-xl-8 {
    margin-left: 0.5rem !important;
  }

  .m-xl-12 {
    margin: 0.75rem !important;
  }

  .mt-xl-12,
.my-xl-12 {
    margin-top: 0.75rem !important;
  }

  .mr-xl-12,
.mx-xl-12 {
    margin-right: 0.75rem !important;
  }

  .mb-xl-12,
.my-xl-12 {
    margin-bottom: 0.75rem !important;
  }

  .ml-xl-12,
.mx-xl-12 {
    margin-left: 0.75rem !important;
  }

  .m-xl-16 {
    margin: 1rem !important;
  }

  .mt-xl-16,
.my-xl-16 {
    margin-top: 1rem !important;
  }

  .mr-xl-16,
.mx-xl-16 {
    margin-right: 1rem !important;
  }

  .mb-xl-16,
.my-xl-16 {
    margin-bottom: 1rem !important;
  }

  .ml-xl-16,
.mx-xl-16 {
    margin-left: 1rem !important;
  }

  .m-xl-24 {
    margin: 1.5rem !important;
  }

  .mt-xl-24,
.my-xl-24 {
    margin-top: 1.5rem !important;
  }

  .mr-xl-24,
.mx-xl-24 {
    margin-right: 1.5rem !important;
  }

  .mb-xl-24,
.my-xl-24 {
    margin-bottom: 1.5rem !important;
  }

  .ml-xl-24,
.mx-xl-24 {
    margin-left: 1.5rem !important;
  }

  .m-xl-32 {
    margin: 2rem !important;
  }

  .mt-xl-32,
.my-xl-32 {
    margin-top: 2rem !important;
  }

  .mr-xl-32,
.mx-xl-32 {
    margin-right: 2rem !important;
  }

  .mb-xl-32,
.my-xl-32 {
    margin-bottom: 2rem !important;
  }

  .ml-xl-32,
.mx-xl-32 {
    margin-left: 2rem !important;
  }

  .m-xl-64 {
    margin: 4rem !important;
  }

  .mt-xl-64,
.my-xl-64 {
    margin-top: 4rem !important;
  }

  .mr-xl-64,
.mx-xl-64 {
    margin-right: 4rem !important;
  }

  .mb-xl-64,
.my-xl-64 {
    margin-bottom: 4rem !important;
  }

  .ml-xl-64,
.mx-xl-64 {
    margin-left: 4rem !important;
  }

  .m-xl-80 {
    margin: 4.75rem !important;
  }

  .mt-xl-80,
.my-xl-80 {
    margin-top: 4.75rem !important;
  }

  .mr-xl-80,
.mx-xl-80 {
    margin-right: 4.75rem !important;
  }

  .mb-xl-80,
.my-xl-80 {
    margin-bottom: 4.75rem !important;
  }

  .ml-xl-80,
.mx-xl-80 {
    margin-left: 4.75rem !important;
  }

  .p-xl-0 {
    padding: 0 !important;
  }

  .pt-xl-0,
.py-xl-0 {
    padding-top: 0 !important;
  }

  .pr-xl-0,
.px-xl-0 {
    padding-right: 0 !important;
  }

  .pb-xl-0,
.py-xl-0 {
    padding-bottom: 0 !important;
  }

  .pl-xl-0,
.px-xl-0 {
    padding-left: 0 !important;
  }

  .p-xl-2 {
    padding: 0.125rem !important;
  }

  .pt-xl-2,
.py-xl-2 {
    padding-top: 0.125rem !important;
  }

  .pr-xl-2,
.px-xl-2 {
    padding-right: 0.125rem !important;
  }

  .pb-xl-2,
.py-xl-2 {
    padding-bottom: 0.125rem !important;
  }

  .pl-xl-2,
.px-xl-2 {
    padding-left: 0.125rem !important;
  }

  .p-xl-4 {
    padding: 0.25rem !important;
  }

  .pt-xl-4,
.py-xl-4 {
    padding-top: 0.25rem !important;
  }

  .pr-xl-4,
.px-xl-4 {
    padding-right: 0.25rem !important;
  }

  .pb-xl-4,
.py-xl-4 {
    padding-bottom: 0.25rem !important;
  }

  .pl-xl-4,
.px-xl-4 {
    padding-left: 0.25rem !important;
  }

  .p-xl-8 {
    padding: 0.5rem !important;
  }

  .pt-xl-8,
.py-xl-8 {
    padding-top: 0.5rem !important;
  }

  .pr-xl-8,
.px-xl-8 {
    padding-right: 0.5rem !important;
  }

  .pb-xl-8,
.py-xl-8 {
    padding-bottom: 0.5rem !important;
  }

  .pl-xl-8,
.px-xl-8 {
    padding-left: 0.5rem !important;
  }

  .p-xl-12 {
    padding: 0.75rem !important;
  }

  .pt-xl-12,
.py-xl-12 {
    padding-top: 0.75rem !important;
  }

  .pr-xl-12,
.px-xl-12 {
    padding-right: 0.75rem !important;
  }

  .pb-xl-12,
.py-xl-12 {
    padding-bottom: 0.75rem !important;
  }

  .pl-xl-12,
.px-xl-12 {
    padding-left: 0.75rem !important;
  }

  .p-xl-16 {
    padding: 1rem !important;
  }

  .pt-xl-16,
.py-xl-16 {
    padding-top: 1rem !important;
  }

  .pr-xl-16,
.px-xl-16 {
    padding-right: 1rem !important;
  }

  .pb-xl-16,
.py-xl-16 {
    padding-bottom: 1rem !important;
  }

  .pl-xl-16,
.px-xl-16 {
    padding-left: 1rem !important;
  }

  .p-xl-24 {
    padding: 1.5rem !important;
  }

  .pt-xl-24,
.py-xl-24 {
    padding-top: 1.5rem !important;
  }

  .pr-xl-24,
.px-xl-24 {
    padding-right: 1.5rem !important;
  }

  .pb-xl-24,
.py-xl-24 {
    padding-bottom: 1.5rem !important;
  }

  .pl-xl-24,
.px-xl-24 {
    padding-left: 1.5rem !important;
  }

  .p-xl-32 {
    padding: 2rem !important;
  }

  .pt-xl-32,
.py-xl-32 {
    padding-top: 2rem !important;
  }

  .pr-xl-32,
.px-xl-32 {
    padding-right: 2rem !important;
  }

  .pb-xl-32,
.py-xl-32 {
    padding-bottom: 2rem !important;
  }

  .pl-xl-32,
.px-xl-32 {
    padding-left: 2rem !important;
  }

  .p-xl-64 {
    padding: 4rem !important;
  }

  .pt-xl-64,
.py-xl-64 {
    padding-top: 4rem !important;
  }

  .pr-xl-64,
.px-xl-64 {
    padding-right: 4rem !important;
  }

  .pb-xl-64,
.py-xl-64 {
    padding-bottom: 4rem !important;
  }

  .pl-xl-64,
.px-xl-64 {
    padding-left: 4rem !important;
  }

  .p-xl-80 {
    padding: 4.75rem !important;
  }

  .pt-xl-80,
.py-xl-80 {
    padding-top: 4.75rem !important;
  }

  .pr-xl-80,
.px-xl-80 {
    padding-right: 4.75rem !important;
  }

  .pb-xl-80,
.py-xl-80 {
    padding-bottom: 4.75rem !important;
  }

  .pl-xl-80,
.px-xl-80 {
    padding-left: 4.75rem !important;
  }

  .m-xl-n2 {
    margin: -0.125rem !important;
  }

  .mt-xl-n2,
.my-xl-n2 {
    margin-top: -0.125rem !important;
  }

  .mr-xl-n2,
.mx-xl-n2 {
    margin-right: -0.125rem !important;
  }

  .mb-xl-n2,
.my-xl-n2 {
    margin-bottom: -0.125rem !important;
  }

  .ml-xl-n2,
.mx-xl-n2 {
    margin-left: -0.125rem !important;
  }

  .m-xl-n4 {
    margin: -0.25rem !important;
  }

  .mt-xl-n4,
.my-xl-n4 {
    margin-top: -0.25rem !important;
  }

  .mr-xl-n4,
.mx-xl-n4 {
    margin-right: -0.25rem !important;
  }

  .mb-xl-n4,
.my-xl-n4 {
    margin-bottom: -0.25rem !important;
  }

  .ml-xl-n4,
.mx-xl-n4 {
    margin-left: -0.25rem !important;
  }

  .m-xl-n8 {
    margin: -0.5rem !important;
  }

  .mt-xl-n8,
.my-xl-n8 {
    margin-top: -0.5rem !important;
  }

  .mr-xl-n8,
.mx-xl-n8 {
    margin-right: -0.5rem !important;
  }

  .mb-xl-n8,
.my-xl-n8 {
    margin-bottom: -0.5rem !important;
  }

  .ml-xl-n8,
.mx-xl-n8 {
    margin-left: -0.5rem !important;
  }

  .m-xl-n12 {
    margin: -0.75rem !important;
  }

  .mt-xl-n12,
.my-xl-n12 {
    margin-top: -0.75rem !important;
  }

  .mr-xl-n12,
.mx-xl-n12 {
    margin-right: -0.75rem !important;
  }

  .mb-xl-n12,
.my-xl-n12 {
    margin-bottom: -0.75rem !important;
  }

  .ml-xl-n12,
.mx-xl-n12 {
    margin-left: -0.75rem !important;
  }

  .m-xl-n16 {
    margin: -1rem !important;
  }

  .mt-xl-n16,
.my-xl-n16 {
    margin-top: -1rem !important;
  }

  .mr-xl-n16,
.mx-xl-n16 {
    margin-right: -1rem !important;
  }

  .mb-xl-n16,
.my-xl-n16 {
    margin-bottom: -1rem !important;
  }

  .ml-xl-n16,
.mx-xl-n16 {
    margin-left: -1rem !important;
  }

  .m-xl-n24 {
    margin: -1.5rem !important;
  }

  .mt-xl-n24,
.my-xl-n24 {
    margin-top: -1.5rem !important;
  }

  .mr-xl-n24,
.mx-xl-n24 {
    margin-right: -1.5rem !important;
  }

  .mb-xl-n24,
.my-xl-n24 {
    margin-bottom: -1.5rem !important;
  }

  .ml-xl-n24,
.mx-xl-n24 {
    margin-left: -1.5rem !important;
  }

  .m-xl-n32 {
    margin: -2rem !important;
  }

  .mt-xl-n32,
.my-xl-n32 {
    margin-top: -2rem !important;
  }

  .mr-xl-n32,
.mx-xl-n32 {
    margin-right: -2rem !important;
  }

  .mb-xl-n32,
.my-xl-n32 {
    margin-bottom: -2rem !important;
  }

  .ml-xl-n32,
.mx-xl-n32 {
    margin-left: -2rem !important;
  }

  .m-xl-n64 {
    margin: -4rem !important;
  }

  .mt-xl-n64,
.my-xl-n64 {
    margin-top: -4rem !important;
  }

  .mr-xl-n64,
.mx-xl-n64 {
    margin-right: -4rem !important;
  }

  .mb-xl-n64,
.my-xl-n64 {
    margin-bottom: -4rem !important;
  }

  .ml-xl-n64,
.mx-xl-n64 {
    margin-left: -4rem !important;
  }

  .m-xl-n80 {
    margin: -4.75rem !important;
  }

  .mt-xl-n80,
.my-xl-n80 {
    margin-top: -4.75rem !important;
  }

  .mr-xl-n80,
.mx-xl-n80 {
    margin-right: -4.75rem !important;
  }

  .mb-xl-n80,
.my-xl-n80 {
    margin-bottom: -4.75rem !important;
  }

  .ml-xl-n80,
.mx-xl-n80 {
    margin-left: -4.75rem !important;
  }

  .m-xl-auto {
    margin: auto !important;
  }

  .mt-xl-auto,
.my-xl-auto {
    margin-top: auto !important;
  }

  .mr-xl-auto,
.mx-xl-auto {
    margin-right: auto !important;
  }

  .mb-xl-auto,
.my-xl-auto {
    margin-bottom: auto !important;
  }

  .ml-xl-auto,
.mx-xl-auto {
    margin-left: auto !important;
  }
}
/**** UCLA html5reset.css ****/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i, dl, dt, dd, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

nav ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote::before, blockquote::after,
q::before, q::after {
  content: "";
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000000;
  text-decoration: none;
}

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000000;
  font-style: italic;
  font-weight: bold;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

input, select {
  vertical-align: middle;
}

/*  SECTIONS  ============================================================================= */
.ucla {
  clear: both;
  padding: 0px;
  margin: 0px;
}

/*  GROUPING  ============================================================================= */
.campus::before,
.campus::after {
  content: "";
  display: table;
}

.campus::after {
  clear: both;
}

.campus {
  zoom: 1;
  /* For IE 6/7 (trigger hasLayout) */
}

.ucla.campus {
  display: block;
  position: relative;
  max-width: 1176px;
  margin: 0 auto;
  padding: 0 24px;
}
@media (min-width: 1024px) {
  .ucla.campus {
    padding: 0 12px;
  }
}

/*  GRID COLUMN SETUP   ==================================================================== */
.col {
  display: block;
  float: left;
  margin: 0 0 0 1.6%;
}

.col:first-child {
  margin-left: 0;
}

/* all browsers except IE6 and lower */
/*  REMOVE MARGINS AS ALL GO FULL WIDTH AT 768 PIXELS */
@media only screen and (max-width: 768px) {
  .col {
    margin: 0;
  }
}
.ucla.campus {
  display: block;
  position: relative;
  max-width: 1176px;
  margin: 0 auto;
  padding: 0 24px;
}
@media (min-width: 1024px) {
  .ucla.campus {
    padding: 0 12px;
  }
}
.ucla.campus .first-child.col {
  margin-left: 0;
}
.ucla.campus .last-child.col {
  margin-left: 0;
}

/*  GRID OF TWO   ============================================================================= */
.span_2_of_2 {
  width: 100%;
}

.span_1_of_2 {
  width: 49.2%;
}

/*  GO FULL WIDTH AT LESS THAN 768 PIXELS */
@media only screen and (max-width: 768px) {
  .span_2_of_2 {
    width: 100%;
  }

  .span_1_of_2 {
    width: 100%;
  }
}
/*  GRID OF THREE   ============================================================================= */
.span_3_of_3 {
  width: 100%;
}

.span_2_of_3 {
  width: 66.13%;
}

.span_1_of_3 {
  width: 32.26%;
}

/*  GO FULL WIDTH AT LESS THAN 768 PIXELS */
@media only screen and (max-width: 768px) {
  .span_3_of_3 {
    width: 100%;
  }

  .span_2_of_3 {
    width: 100%;
  }

  .span_1_of_3 {
    width: 100%;
  }
}
/*  GRID OF FOUR   ============================================================================= */
.span_4_of_4 {
  width: 100%;
}

.span_3_of_4 {
  width: 74.6%;
}

.span_2_of_4 {
  width: 49.2%;
}

.span_1_of_4 {
  width: 23.8%;
}

/*  GO FULL WIDTH AT LESS THAN 768 PIXELS */
@media only screen and (max-width: 768px) {
  .span_4_of_4 {
    width: 100%;
  }

  .span_3_of_4 {
    width: 100%;
  }

  .span_2_of_4 {
    width: 100%;
  }

  .span_1_of_4 {
    width: 100%;
  }
}
/*  GRID OF FIVE   ============================================================================= */
.span_5_of_5 {
  width: 100%;
}

.span_4_of_5 {
  width: 79.68%;
}

.span_3_of_5 {
  width: 59.36%;
}

.span_2_of_5 {
  width: 39.04%;
}

.span_1_of_5 {
  width: 18.72%;
}

/*  GO FULL WIDTH AT LESS THAN 768 PIXELS */
@media only screen and (max-width: 768px) {
  .span_5_of_5 {
    width: 100%;
  }

  .span_4_of_5 {
    width: 100%;
  }

  .span_3_of_5 {
    width: 100%;
  }

  .span_2_of_5 {
    width: 100%;
  }

  .span_1_of_5 {
    width: 100%;
  }
}
/*  GRID OF SIX   ============================================================================= */
.span_6_of_6 {
  width: 100%;
}

.span_5_of_6 {
  width: 83.06%;
}

.span_4_of_6 {
  width: 66.13%;
}

.span_3_of_6 {
  width: 49.2%;
}

.span_2_of_6 {
  width: 32.26%;
}

.span_1_of_6 {
  width: 15.33%;
}

/*  GO FULL WIDTH AT LESS THAN 768 PIXELS */
@media only screen and (max-width: 768px) {
  .span_6_of_6 {
    width: 100%;
  }

  .span_5_of_6 {
    width: 100%;
  }

  .span_4_of_6 {
    width: 100%;
  }

  .span_3_of_6 {
    width: 100%;
  }

  .span_2_of_6 {
    width: 100%;
  }

  .span_1_of_6 {
    width: 100%;
  }
}
/*  GRID OF SEVEN   ============================================================================= */
.span_7_of_7 {
  width: 100%;
}

.span_6_of_7 {
  width: 85.48%;
}

.span_5_of_7 {
  width: 70.97%;
}

.span_4_of_7 {
  width: 56.45%;
}

.span_3_of_7 {
  width: 41.94%;
}

.span_2_of_7 {
  width: 27.42%;
}

.span_1_of_7 {
  width: 12.91%;
}

/*  GO FULL WIDTH AT LESS THAN 768 PIXELS */
@media only screen and (max-width: 768px) {
  .span_7_of_7 {
    width: 100%;
  }

  .span_6_of_7 {
    width: 100%;
  }

  .span_5_of_7 {
    width: 100%;
  }

  .span_4_of_7 {
    width: 100%;
  }

  .span_3_of_7 {
    width: 100%;
  }

  .span_2_of_7 {
    width: 100%;
  }

  .span_1_of_7 {
    width: 100%;
  }
}
/*  GRID OF EIGHT   ============================================================================= */
.span_8_of_8 {
  width: 100%;
}

.span_7_of_8 {
  width: 87.3%;
}

.span_6_of_8 {
  width: 74.6%;
}

.span_5_of_8 {
  width: 61.9%;
}

.span_4_of_8 {
  width: 49.2%;
}

.span_3_of_8 {
  width: 36.5%;
}

.span_2_of_8 {
  width: 23.8%;
}

.span_1_of_8 {
  width: 11.1%;
}

/*  GO FULL WIDTH AT LESS THAN 768 PIXELS */
@media only screen and (max-width: 768px) {
  .span_8_of_8 {
    width: 100%;
  }

  .span_7_of_8 {
    width: 100%;
  }

  .span_6_of_8 {
    width: 100%;
  }

  .span_5_of_8 {
    width: 100%;
  }

  .span_4_of_8 {
    width: 100%;
  }

  .span_3_of_8 {
    width: 100%;
  }

  .span_2_of_8 {
    width: 100%;
  }

  .span_1_of_8 {
    width: 100%;
  }
}
/*  GRID OF NINE   ============================================================================= */
.span_9_of_9 {
  width: 100%;
}

.span_8_of_9 {
  width: 88.71%;
}

.span_7_of_9 {
  width: 77.42%;
}

.span_6_of_9 {
  width: 66.13%;
}

.span_5_of_9 {
  width: 54.84%;
}

.span_4_of_9 {
  width: 43.55%;
}

.span_3_of_9 {
  width: 32.26%;
}

.span_2_of_9 {
  width: 20.97%;
}

.span_1_of_9 {
  width: 9.68%;
}

/*  GO FULL WIDTH AT LESS THAN 768 PIXELS */
@media only screen and (max-width: 768px) {
  .span_9_of_9 {
    width: 100%;
  }

  .span_8_of_9 {
    width: 100%;
  }

  .span_7_of_9 {
    width: 100%;
  }

  .span_6_of_9 {
    width: 100%;
  }

  .span_5_of_9 {
    width: 100%;
  }

  .span_4_of_9 {
    width: 100%;
  }

  .span_3_of_9 {
    width: 100%;
  }

  .span_2_of_9 {
    width: 100%;
  }

  .span_1_of_9 {
    width: 100%;
  }
}
/*  GRID OF TEN   ============================================================================= */
.span_10_of_10 {
  width: 100%;
}

.span_9_of_10 {
  width: 89.84%;
}

.span_8_of_10 {
  width: 79.68%;
}

.span_7_of_10 {
  width: 69.52%;
}

.span_6_of_10 {
  width: 59.36%;
}

.span_5_of_10 {
  width: 49.2%;
}

.span_4_of_10 {
  width: 39.04%;
}

.span_3_of_10 {
  width: 28.88%;
}

.span_2_of_10 {
  width: 18.72%;
}

.span_1_of_10 {
  width: 8.56%;
}

/*  GO FULL WIDTH AT LESS THAN 768 PIXELS */
@media only screen and (max-width: 768px) {
  .span_10_of_10 {
    width: 100%;
  }

  .span_9_of_10 {
    width: 100%;
  }

  .span_8_of_10 {
    width: 100%;
  }

  .span_7_of_10 {
    width: 100%;
  }

  .span_6_of_10 {
    width: 100%;
  }

  .span_5_of_10 {
    width: 100%;
  }

  .span_4_of_10 {
    width: 100%;
  }

  .span_3_of_10 {
    width: 100%;
  }

  .span_2_of_10 {
    width: 100%;
  }

  .span_1_of_10 {
    width: 100%;
  }
}
/*  GRID OF ELEVEN   ============================================================================= */
.span_11_of_11 {
  width: 100%;
}

.span_10_of_11 {
  width: 90.76%;
}

.span_9_of_11 {
  width: 81.52%;
}

.span_8_of_11 {
  width: 72.29%;
}

.span_7_of_11 {
  width: 63.05%;
}

.span_6_of_11 {
  width: 53.81%;
}

.span_5_of_11 {
  width: 44.58%;
}

.span_4_of_11 {
  width: 35.34%;
}

.span_3_of_11 {
  width: 26.1%;
}

.span_2_of_11 {
  width: 16.87%;
}

.span_1_of_11 {
  width: 7.63%;
}

/*  GO FULL WIDTH AT LESS THAN 768 PIXELS */
@media only screen and (max-width: 768px) {
  .span_11_of_11 {
    width: 100%;
  }

  .span_10_of_11 {
    width: 100%;
  }

  .span_9_of_11 {
    width: 100%;
  }

  .span_8_of_11 {
    width: 100%;
  }

  .span_7_of_11 {
    width: 100%;
  }

  .span_6_of_11 {
    width: 100%;
  }

  .span_5_of_11 {
    width: 100%;
  }

  .span_4_of_11 {
    width: 100%;
  }

  .span_3_of_11 {
    width: 100%;
  }

  .span_2_of_11 {
    width: 100%;
  }

  .span_1_of_11 {
    width: 100%;
  }
}
/*  GRID OF TWELVE   ============================================================================= */
.span_12_of_12 {
  width: 100%;
}

.span_11_of_12 {
  width: 91.53%;
}

.span_10_of_12 {
  width: 83.06%;
}

.span_9_of_12 {
  width: 74.6%;
}

.span_8_of_12 {
  width: 66.13%;
}

.span_7_of_12 {
  width: 57.66%;
}

.span_6_of_12 {
  width: 49.2%;
}

.span_5_of_12 {
  width: 40.73%;
}

.span_4_of_12 {
  width: 32.26%;
}

.span_3_of_12 {
  width: 23.8%;
}

.span_2_of_12 {
  width: 15.33%;
}

.span_1_of_12 {
  width: 6.86%;
}

/*  GO FULL WIDTH AT LESS THAN 768 PIXELS */
@media only screen and (max-width: 768px) {
  .span_12_of_12 {
    width: 100%;
  }

  .span_11_of_12 {
    width: 100%;
  }

  .span_10_of_12 {
    width: 100%;
  }

  .span_9_of_12 {
    width: 100%;
  }

  .span_8_of_12 {
    width: 100%;
  }

  .span_7_of_12 {
    width: 100%;
  }

  .span_6_of_12 {
    width: 100%;
  }

  .span_5_of_12 {
    width: 100%;
  }

  .span_4_of_12 {
    width: 100%;
  }

  .span_3_of_12 {
    width: 100%;
  }

  .span_2_of_12 {
    width: 100%;
  }

  .span_1_of_12 {
    width: 100%;
  }
}
h1, h2, h3, h4, h5, h6 {
  color: #333;
  font-weight: bold;
  font-family: "Helvetica", "Arial", sans-serif;
  padding-bottom: 16px;
}

h1, .h1 {
  font-size: 36px;
  line-height: 40.5px;
  font-weight: bold;
}
@media (min-width: 768px) {
  h1, .h1 {
    font-size: 48px;
    line-height: 54px;
  }
}

h2, .h2 {
  font-size: 28px;
  line-height: 32px;
  font-weight: bold;
}
@media (min-width: 768px) {
  h2, .h2 {
    font-size: 36px;
    line-height: 40.5px;
  }
}

h3, .h3 {
  font-size: 24px;
  line-height: 27px;
  font-weight: bold;
}

h4, .h4 {
  font-size: 20px;
  line-height: 22.5px;
  font-weight: bold;
}

h5, .h5 {
  font-size: 16px;
  line-height: 20px;
  font-weight: bold;
}

h6, .h6 {
  font-size: 12.8px;
  line-height: 16px;
  font-weight: bold;
}

p {
  font-size: 16px;
  line-height: 24px;
  color: #333;
  padding-bottom: 16px;
}
p strong {
  font-size: bold;
}
p small {
  font-size: 12.8px;
  line-height: 16px;
}
p em {
  font-style: italic;
}

.lead {
  font-size: 1.5rem;
  line-height: 2rem;
}

.body-copy-small {
  font-size: 0.75rem;
  line-height: 1.125rem;
  color: #333;
}

.right-align {
  text-align: right;
}

.left-align {
  text-align: left;
}

.center-align {
  text-align: center;
}

.mark-text {
  background: #FFF0A5;
}

.insert-text {
  background: #DAEBFE;
}

.has-white-text {
  color: #FFFFFF;
}
.has-white-text > h1, .has-white-text h2, .has-white-text h3, .has-white-text h4, .has-white-text h5, .has-white-text h6,
.has-white-text p, .has-white-text span,
.has-white-text tr th,
.has-white-text dt,
.has-white-text li::before,
.has-white-text .stat-tout__label, .has-white-text .stat-tout__number, .has-white-text .stat-tout__source {
  color: #FFFFFF;
}
.has-white-text > div > h1, .has-white-text > div h2, .has-white-text > div h3, .has-white-text > div h4, .has-white-text > div h5, .has-white-text > div h6,
.has-white-text > div p, .has-white-text > div span,
.has-white-text > div tr th,
.has-white-text > div dt,
.has-white-text > div li::before,
.has-white-text > div .stat-tout__label, .has-white-text > div .stat-tout__number, .has-white-text > div .stat-tout__source,
.has-white-text > aside > h1,
.has-white-text > aside h2,
.has-white-text > aside h3,
.has-white-text > aside h4,
.has-white-text > aside h5,
.has-white-text > aside h6,
.has-white-text > aside p,
.has-white-text > aside span,
.has-white-text > aside tr th,
.has-white-text > aside dt,
.has-white-text > aside li::before,
.has-white-text > aside .stat-tout__label,
.has-white-text > aside .stat-tout__number,
.has-white-text > aside .stat-tout__source {
  color: #FFFFFF;
}

.has-background-grey-40 {
  background: #999;
}

.has-background-lightest-grey-2 {
  background: #EBEBEB;
}

.has-background-light-grey {
  background: #E7E7E8;
}

.has-background-ucla-blue {
  background: #2774AE;
}

.has-background-white {
  background: #FFFFFF;
}

.alert {
  /* Default Alerts Styling */
  padding: 16px 16px 16px 16px;
  border-width: 4px;
  border-style: solid;
  line-height: 24px;
  /* Specific Alert Styles */
}
.alert img {
  float: left;
  width: 24px;
  height: 24px;
  margin-right: 8px;
}
.alert figcaption {
  display: flex;
}
.alert--primary {
  border-color: #8BB8E8;
}
.alert--secondary {
  border-color: #979797;
}
.alert--success {
  border-color: #007339;
}
.alert--error {
  border-color: #D60000;
}
.alert--warning {
  border-color: #F57F17;
}

.accordion {
  display: block;
  padding: 0px 22px 0px;
  max-width: 776px;
}
.accordion__title {
  border: 0;
  border-top: 1px solid #E5E5E5;
  width: 100%;
  text-align: left;
  color: #00598C;
  font-size: 1rem;
  line-height: 24px;
  font-weight: bold;
  position: relative;
  -moz-appearance: none;
  -webkit-appearance: none;
  background: rgba(0, 0, 0, 0);
  margin-top: 1px;
  padding: 8px 32px 8px 16px;
}
.accordion__title:focus {
  outline-style: dotted;
}
.accordion__title:hover, .accordion__title.active {
  background: #0079BF;
  color: #FFFFFF;
  cursor: pointer;
}
.accordion__title:hover::after, .accordion__title.active::after {
  background: url("/img/icons/arrow-down-white.svg");
  background-position: center;
  background-size: contain;
  position: absolute;
  right: 16px;
  top: 8px;
  width: 24px;
  height: 24px;
}
@media (min-width: 768px) {
  .accordion__title:hover::after, .accordion__title.active::after {
    right: 16px;
    top: 16px;
    width: 32px;
    height: 32px;
  }
}
.accordion__title.active::after {
  -moz-transform: scaleY(-1);
  -o-transform: scaleY(-1);
  -webkit-transform: scaleY(-1);
  transform: scaleY(-1);
}
.accordion__title::after {
  display: block;
  content: "";
  background: url("/img/icons/arrow-down-defaultblue.svg");
  background-position: center;
  background-size: contain;
  position: absolute;
  right: 16px;
  top: 8px;
  width: 24px;
  height: 24px;
}
@media (min-width: 768px) {
  .accordion__title {
    font-size: 24px;
    padding: 22px 64px 18px 16px;
  }
  .accordion__title::after {
    background-size: contain;
    right: 16px;
    top: 16px;
    width: 32px;
    height: 32px;
  }
}
.accordion__title:last-of-type {
  border-bottom: none;
}
.accordion__content {
  display: none;
  padding: 16px;
  padding-bottom: 32px;
}
.accordion__content.show-me {
  display: block;
}
.accordion.accordion-last::after {
  content: "";
  display: block;
  border-bottom: 1px solid #E5E5E5;
}

.load-more.btn {
  border: 2px solid #00598C;
  background: #FFFFFF;
  padding: 12px 16px 8px;
  font-size: 1rem;
  line-height: 1.25rem;
  color: #00598C;
}
.load-more.btn:hover {
  background: #0079BF;
  border-color: #0079BF;
  color: #FFFFFF;
}
.load-more.btn:focus {
  background: #0079BF;
  border-color: #0079BF;
  color: #FFFFFF;
  outline: 1px dotted #0079BF;
  outline-offset: 2px;
}
.load-more.btn:active {
  background: #003B5C;
  border-color: #003B5C;
  color: #FFFFFF;
}

.blockquote-wrapper .blockquote {
  display: block;
  border-left: 4px solid #2774AE;
  padding: 0 0 0 32px;
  margin: 24px 24px 0;
}
.blockquote-wrapper .blockquote__quote {
  font-size: 16px;
  line-height: 24px;
  display: block;
  margin-bottom: 16px;
  color: #333333;
}
.blockquote-wrapper .blockquote__citation {
  font-size: 16px;
  line-height: 24px;
  display: block;
  color: #666666;
  max-width: 212px;
}
@media (min-width: 768px) {
  .blockquote-wrapper .blockquote__citation {
    max-width: 312px;
  }
}
@media only screen and (min-width: 768px) {
  .blockquote-wrapper .blockquote {
    width: calc((100%/2) - (24px/2));
    float: left;
    margin-right: 24px;
  }
  .blockquote-wrapper .blockquote:nth-child(2n) {
    margin-right: 0;
  }
}
@media only screen and (min-width: 1024px) {
  .blockquote-wrapper .blockquote {
    width: calc((100%/3) - (48px/3));
    float: left;
    margin-right: 24px;
  }
  .blockquote-wrapper .blockquote:nth-child(2n) {
    margin-right: 24px;
  }
  .blockquote-wrapper .blockquote:nth-child(3n) {
    margin-right: 0;
  }
}

.btn {
  padding: 12px 16px 8px;
  font-size: 16px;
  font-weight: bold;
  border-radius: 2px;
  border: 2px solid transparent;
  line-height: 1.25;
  cursor: pointer;
  display: flex;
  text-decoration: none;
  /*** Button Group Styling ***/
}
.btn:focus {
  outline: none;
}
.btn:disabled {
  cursor: not-allowed;
}
.btn.icon--play::before {
  flex-shrink: 0;
  content: "";
  width: 24px;
  height: 24px;
  vertical-align: middle;
  margin-right: 8px;
  margin-left: -8px;
  background: url("/img/icons/denotive/play--white.svg");
  background-size: contain;
  background-position: 0 -1px;
}
.btn.icon--link::after {
  flex-shrink: 0;
  content: "";
  width: 24px;
  height: 24px;
  vertical-align: middle;
  margin-left: 8px;
  margin-right: -8px;
  background: url("/img/icons/denotive/external-link--white.svg");
  background-size: contain;
  background-position: 0 -1px;
}
.btn--lightbg {
  background: #00598C;
  color: #FFFFFF;
}
.btn--lightbg:visited {
  background: #00598C;
  color: #FFFFFF;
}
.btn--lightbg:hover {
  background: #0079BF;
}
.btn--lightbg:focus {
  background: #0079BF;
  outline: 1px dotted #0079BF;
  outline-offset: 2px;
}
.btn--lightbg:active {
  background: #003B5C;
  outline: none;
}
.btn--lightbg:disabled {
  background: #757575;
  color: #FFFFFF;
}
.btn--darkbg {
  color: black;
  background: #FFD100;
}
.btn--darkbg:visited {
  color: black;
  background: #FFD100;
}
.btn--darkbg:hover {
  background: #FFE500;
  color: black;
}
.btn--darkbg:focus {
  background: #FFE500;
  outline: 1px dotted #FFFFFF;
  outline-offset: 2px;
}
.btn--darkbg:active {
  background: #FFBF0F;
  outline: none;
}
.btn--darkbg:disabled {
  background: #E5E5E5;
}
.btn--darkbg.icon--play::before {
  background: url("/img/icons/denotive/play--black.svg");
  background-size: contain;
  background-position: 0 -1px;
}
.btn--darkbg.icon--link::after {
  background: url("/img/icons/denotive/external-link--black.svg");
  background-size: contain;
  background-position: 0 -1px;
}
.btn--secondary {
  background: #FFFFFF;
  color: #00598C;
  border: 2px solid #00598C;
}
.btn--secondary:visited {
  background: #FFFFFF;
  color: #00598C;
  border: 2px solid #00598C;
}
.btn--secondary:hover {
  background: #0079BF;
  border-color: #0079BF;
  color: #FFFFFF;
}
.btn--secondary:focus {
  background: #0079BF;
  border-color: #0079BF;
  outline: 1px dotted #0079BF;
  outline-offset: 2px;
  color: #FFFFFF;
}
.btn--secondary:active {
  background: #003B5C;
  color: #FFFFFF;
  outline: none;
}
.btn--secondary:disabled {
  border-color: #757575;
  color: #757575;
  background: #FFFFFF;
}
.btn--tertiary {
  background: transparent;
  color: #00598C;
}
.btn--tertiary:visited {
  background: transparent;
  color: #00598C;
}
.btn--tertiary:hover {
  background: #0079BF;
  color: #FFFFFF;
}
.btn--tertiary:focus {
  background: #0079BF;
  outline: 1px dotted #0079BF;
  outline-offset: 2px;
  color: #FFFFFF;
}
.btn--tertiary:active {
  background: #003B5C;
  color: #FFFFFF;
  outline: none;
}
.btn--tertiary:disabled {
  color: #757575;
  background: transparent;
}
.btn--secondary.icon--play:hover::before, .btn--secondary.icon--play:focus::before, .btn--tertiary.icon--play:hover::before, .btn--tertiary.icon--play:focus::before {
  background: url("/img/icons/denotive/play--white.svg");
  background-size: contain;
  background-position: 0 -1px;
}
.btn--secondary.icon--play::before, .btn--tertiary.icon--play::before {
  background: url("/img/icons/denotive/play--blue.svg");
  background-size: contain;
  background-position: 0 -1px;
}
.btn--secondary.icon--link:hover::after, .btn--secondary.icon--link:focus::after, .btn--tertiary.icon--link:hover::after, .btn--tertiary.icon--link:focus::after {
  background: url("/img/icons/denotive/external-link--white.svg");
  background-size: contain;
  background-position: 0 -1px;
}
.btn--secondary.icon--link::after, .btn--tertiary.icon--link::after {
  background: url("/img/icons/denotive/external-link--blue.svg");
  background-size: contain;
  background-position: 0 -1px;
}
.btn--group {
  background: transparent;
  display: flex;
  justify-content: center;
  gap: 2px;
  margin-bottom: 2px;
}
.btn--group-left, .btn--group-center, .btn--group-right {
  background: #FFFFFF;
  color: #00598C;
  border: 2px solid #00598C;
  border-radius: 0px;
}
.btn--group-left:visited, .btn--group-center:visited, .btn--group-right:visited {
  background: #FFFFFF;
  color: #00598C;
  border: 2px solid #00598C;
}
.btn--group-left:hover, .btn--group-center:hover, .btn--group-right:hover {
  color: #FFFFFF;
  border-color: #0079BF;
  background: #0079BF;
}
.btn--group-left:focus, .btn--group-center:focus, .btn--group-right:focus {
  color: #FFFFFF;
  border-color: #0079BF;
  background: #0079BF;
  outline: 1px dotted #0079BF;
  outline-offset: 2px;
}
.btn--group-left:active, .btn--group-center:active, .btn--group-right:active {
  color: #FFFFFF;
  background: #003B5C;
  border-color: #003B5C;
  outline: none;
}
.btn--group-left:disabled, .btn--group-center:disabled, .btn--group-right:disabled {
  background: #757575;
  border-color: #757575;
  color: #FFFFFF;
}
.btn--group-left {
  border-top-left-radius: 2px;
  border-bottom-left-radius: 2px;
}
.btn--group-right {
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
}

.pagination,
.pagination--boxed {
  padding-inline-start: 0;
  display: flex;
  gap: 2px;
}
.pagination li::before,
.pagination--boxed li::before {
  content: none;
}
.pagination li,
.pagination--boxed li {
  display: inline;
}
.pagination li .page,
.pagination--boxed li .page {
  text-decoration: none;
  padding: 7px 12px;
  border-width: 2px;
  border-style: solid;
  border-color: transparent;
  color: #00598C;
  background: white;
}
.pagination li .page:visited,
.pagination--boxed li .page:visited {
  color: #00598C;
  background: white;
}
.pagination li .page:hover,
.pagination--boxed li .page:hover {
  color: #FFFFFF;
  background: #0079BF;
  border-color: #0079BF;
}
.pagination li .page:focus,
.pagination--boxed li .page:focus {
  background: #0079BF;
  border-color: #0079BF;
  outline: 1px dotted #0079BF;
  outline-offset: 2px;
  color: #FFFFFF;
}
.pagination li .page:active,
.pagination--boxed li .page:active {
  background: #003B5C;
  border-color: #003B5C;
  color: #FFFFFF;
  outline: none;
}
.pagination li .page--current,
.pagination--boxed li .page--current {
  color: #757575;
}
.pagination li .page--current:visited,
.pagination--boxed li .page--current:visited {
  color: #757575;
  border-color: #757575;
}
.pagination li .page--current:hover,
.pagination--boxed li .page--current:hover {
  color: #FFFFFF;
  border-color: #0079BF;
}
.pagination li .page--current:focus,
.pagination--boxed li .page--current:focus {
  color: #FFFFFF;
}
.pagination li .page--current:active,
.pagination--boxed li .page--current:active {
  border-color: #003B5C;
}

.pagination--boxed li .page {
  padding: 7px 12px;
  border-width: 2px;
  border-style: solid;
  border-color: #00598C;
}

.basic-card, .basic-card-grey, .basic-card-gray {
  display: inline-block;
  background: #FFFFFF;
  margin: 32px 2% 0 0;
  vertical-align: top;
}
@media only screen and (min-width: 600px) {
  .basic-card, .basic-card-grey, .basic-card-gray {
    max-width: 376px;
    margin: 32px 2% 0 0;
  }
}
.basic-card__image, .basic-card-grey__image, .basic-card-gray__image {
  display: block;
  width: 100%;
  height: auto;
}
@media only screen and (min-width: 600px) {
  .basic-card__image, .basic-card-grey__image, .basic-card-gray__image {
    max-width: 376px;
    max-height: 250px;
  }
}
.basic-card__title, .basic-card-grey__title, .basic-card-gray__title {
  font-size: 24px;
  font-weight: bold;
  line-height: 27px;
}
.basic-card__info-wrapper, .basic-card-grey__info-wrapper, .basic-card-gray__info-wrapper {
  padding: 32px;
}
.basic-card__description, .basic-card-grey__description, .basic-card-gray__description {
  font-size: 16px;
  line-height: 24px;
  color: #333333;
  max-height: 300px;
}
.basic-card__description:last-child, .basic-card-grey__description:last-child, .basic-card-gray__description:last-child {
  margin-bottom: 0px;
}
.basic-card__buttons, .basic-card-grey__buttons, .basic-card-gray__buttons {
  margin: 0 auto;
  display: grid;
  grid-gap: 4px;
  justify-items: start;
  margin-left: -8px;
}

.basic-card-grey > .basic-card__info-wrapper, .basic-card-gray > .basic-card__info-wrapper {
  background: #F2F2F2;
}

.event-card {
  width: 100%;
  height: auto;
  margin: 16px 0 0;
  display: inline-block;
  position: relative;
  background: #FFFFFF;
  vertical-align: top;
}
@media only screen and (min-width: 600px) {
  .event-card {
    max-width: 276px;
    margin: 40px 2% 0 0;
  }
}
.event-card:focus {
  outline: 1px dotted #0079BF;
}
.event-card__image {
  width: 100%;
  height: auto;
}
@media only screen and (min-width: 600px) {
  .event-card__image {
    max-width: 276px;
    max-height: 184px;
  }
}
.event-card__link {
  text-decoration: none;
}
.event-card__link span:hover {
  background-color: #0079BF;
  color: #FFFFFF;
  text-decoration: none;
}
.event-card__link:focus {
  outline: 1px dotted #0079BF;
}
.event-card__link:hover {
  color: #00598C;
  background-color: transparent;
}
.event-card__link:hover:visited {
  background-color: #5223B0;
  color: #5223B0;
  text-decoration: none;
}
.event-card__link:focus span, .event-card__link:active span {
  color: #FFFFFF;
  outline: 1px dotted #0079BF;
  background-color: #003B5C;
}
.event-card__title {
  color: #00598C;
  margin: 24px 24px 0;
  font-size: 20px;
  font-weight: bold;
  line-height: 22.5px;
}
.event-card-icon__time {
  display: inline-block;
  content: "";
  background: url(/img/icons/time-grey60.svg);
  background-size: contain;
  width: 16px;
  height: 16px;
  margin-bottom: -1.5px;
  margin-left: 1px;
  margin-right: 6px;
  vertical-align: bottom;
}
.event-card-icon__play {
  display: inline-block;
  content: "";
  background: url(/img/icons/play-grey.svg);
  background-size: contain;
  width: 15px;
  height: 15px;
  margin-bottom: 0px;
  margin-left: 1.25px;
  margin-right: 6px;
  vertical-align: bottom;
}
.event-card-info {
  display: block;
  padding: 8px 24px 24px 24px;
  background: #FFFFFF;
}
.event-card-info__date {
  position: absolute;
  display: block;
  max-width: 100px;
  height: 44px;
  padding: 8px 12px;
  background: #FFD100;
  color: #333;
  font-weight: bold;
  top: 0;
  left: 0;
}
.event-card-info__date .small-block {
  margin-top: 9px;
  display: inline-block;
}
.event-card-info__day, .event-card-info__month {
  display: block;
  font-size: 0.75rem;
  text-transform: uppercase;
}
.event-card-info__month {
  padding-top: 4px;
}
.event-card-info__number {
  display: inline-block;
  font-size: 2.25rem;
}
.event-card-info__time, .event-card-info__location {
  margin-bottom: 8px;
  font-size: 12.8px;
  font-weight: bold;
  color: #666666;
}
.event-card-info__time img, .event-card-info__location img {
  display: inline;
  margin-bottom: 3px;
  margin-left: 2px;
  margin-right: 6px;
  vertical-align: middle;
}
.event-card-info__description {
  margin-bottom: 8px;
  font-size: 16px;
  line-height: 24px;
  color: #333333;
  max-height: 300px;
}
.event-card-info__description:last-child {
  margin-bottom: 0px;
}
.event-card:first-child {
  margin-top: 0px;
}
@media only screen and (min-width: 600px) {
  .event-card:first-child {
    margin-top: 40px;
  }
}

/**********
I. "Featured" Heading

II. Tier 1 story
  a. list of story (for accessibility)
    b. link to story
      - image
    c. content wrapper
      - title
        * link to story
      - description/blurb
      - source

III. Tier 2 stories
  a. list of stories (for accessibility)
    b. link to story
      - image/thumbnail
      - story title
        * span for the title text
    c. content wrapper
      - description/blurb
      - source

* Note about wrapping both the image and heading in an anchor tag: this is for accessibility to avoid redundant links with the same destination. Otherwise, when a screenreader iterates through the page, it will read out the links twice.

The spans in the tier 2 stories are for styling purposes.

***********/
.story {
  margin-bottom: 0;
  padding: 0 10px;
  /***************
    .story__featured is the top story that appears first, above the secondary stories.
    On mobile, the entire story card has 100% viewport width.
    On desktop, the story title, description, and source appear in a white overlay above the image.
  ****************/
  /***************
  .story__secondary include the secondary stories that appear below the top featured story.
  On mobile, all stories appear in one column, stacked.
  On desktop, stories appear in a 1x3 grid.
  ****************/
}
@media (min-width: 1280px) {
  .story {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 10px;
  }
}
.story__featured {
  float: left;
}
@media (min-width: 1024px) {
  .story__featured {
    position: relative;
    width: 100%;
  }
}
.story__featured-card {
  min-height: 540px;
}
@media (min-width: 1280px) {
  .story__featured-card {
    width: 100%;
    margin-bottom: 0;
  }
}
.story__featured-content {
  margin: 0 25px;
  padding: 32px;
  position: relative;
  top: -24px;
  background-color: #FFFFFF;
}
@media (min-width: 1024px) {
  .story__featured-content {
    margin: 0;
    width: 576px;
    position: absolute;
  }
}
@media (min-width: 1024px) {
  .story__featured-content {
    transform: translateY(100%);
  }
}
.story__featured-image {
  width: 100%;
  height: auto;
}
@media (min-width: 1024px) {
  .story__featured-image {
    width: 776px;
    height: 517px;
    float: right;
  }
}
.story__featured-title {
  font-size: 2.25rem;
  line-height: 1.125;
  margin-bottom: 16px;
}
.story__featured-title > .link {
  color: #00598C;
  text-decoration: none;
}
.story__featured-blurb {
  margin: 0 0 16px;
  line-height: 1.5;
}
.story__featured-source {
  line-height: 1.25rem;
  font-weight: bold;
  line-height: 1.25;
}
.story__featured-source > .link {
  color: #00598C;
  text-decoration: none;
}
.story__featured-source > .link:hover {
  background-color: #0079BF;
  color: #FFFFFF;
  text-decoration: none;
}
.story__featured-source > .link:active {
  background-color: #003B5C;
  color: #FFFFFF;
  text-decoration: none;
}
.story__featured-source > .link:focus {
  background-color: #0079BF;
  color: #FFFFFF;
  text-decoration: none;
}
.story__secondary {
  margin: 0 24px;
}
@media (min-width: 768px) {
  .story__secondary {
    margin: 0 auto;
  }
}
@media (min-width: 1024px) {
  .story__secondary {
    padding-top: 24px;
  }
}
.story__secondary-card, .story__secondary-card-grey {
  position: relative;
  margin: 0 24px 24px 0;
  padding-left: 0px;
  display: inline-block;
  vertical-align: top;
}
@media (min-width: 768px) {
  .story__secondary-card, .story__secondary-card-grey {
    padding-left: 38px;
  }
}
@media (min-width: 1024px) {
  .story__secondary-card, .story__secondary-card-grey {
    padding-left: 0px;
    min-height: 540px;
    width: calc((100% - 58px)/3);
  }
}
@media (max-width: 1023.98px) {
  .story__secondary-card, .story__secondary-card-grey {
    width: 100%;
    /* remove margins and set padding with values
    so grey background is applied to the whole element */
    margin: 0;
    padding: 12px 24px;
  }
}
@media (min-width: 1024px) {
  .story__secondary-card:nth-child(3n), .story__secondary-card-grey:nth-child(3n) {
    margin-right: 0;
  }
}
.story__secondary-card a, .story__secondary-card-grey a {
  outline: none;
}
.story__secondary-card a:focus .story__secondary-title-text, .story__secondary-card-grey a:focus .story__secondary-title-text {
  outline: auto;
  outline-style: dotted;
  outline-width: thin;
}
.story__secondary-card-grey, .story__secondary-card-gray {
  background: #F2F2F2;
}
.story__secondary-card-grey > a > .story__secondary-title, .story__secondary-card-gray > a > .story__secondary-title {
  background: #F2F2F2;
}
.story__secondary-content {
  box-sizing: border-box;
  width: 100%;
}
@media (max-width: 767.98px) {
  .story__secondary-content {
    float: left;
    width: 61%;
  }
}
@media (min-width: 767.98px) and (max-width: 1023.98px) {
  .story__secondary-content {
    float: left;
    width: 65%;
  }
}
@media (min-width: 1024px) {
  .story__secondary-content {
    padding: 0 32px 0;
  }
}
.story__secondary a {
  text-decoration: none;
}
.story__secondary-image {
  height: auto;
  width: 100%;
  max-width: 72px;
}
@media (min-width: 768px) {
  .story__secondary-image {
    margin-bottom: 28px;
    max-width: 168px;
    margin-bottom: 29px;
  }
}
@media (min-width: 1024px) {
  .story__secondary-image {
    max-width: 376px;
    max-height: 282px;
    min-width: 100%;
    margin-bottom: 0;
  }
}
.story__secondary-image-wrapper {
  margin-right: 12px;
  max-width: 377px;
  float: left;
}
@media (min-width: 768px) {
  .story__secondary-image-wrapper {
    display: block;
    margin-right: 40px;
  }
}
@media (min-width: 1024px) {
  .story__secondary-image-wrapper {
    float: none;
    width: 100%;
    min-width: 100%;
  }
}
.story__secondary-title {
  font-size: 1rem;
  line-height: 1.125rem;
  color: #00598C;
  margin: 0 16px;
  outline: none;
}
@media (max-width: 767.98px) {
  .story__secondary-title {
    margin: 0;
    width: 100%;
  }
}
@media (min-width: 768px) {
  .story__secondary-title {
    font-size: 1.5rem;
    line-height: 1.6875rem;
    padding-right: 24px;
  }
}
@media (min-width: 1024px) {
  .story__secondary-title {
    padding: 16px;
    background: white;
    position: relative;
    bottom: 16px;
  }
}
.story__secondary-title-text {
  /*
  pseudo-classes() is a SASS mixin located at src/scss/utilities/_mixins/_helper.scss

  This was created because both the image and title are wrapped in the anchor element, but &-title is more specifically a span. Instead of duplicating the anchor link pseudo-classes, we can use a mixin.
  */
}
.story__secondary-title-text:link {
  color: #00598C;
}
.story__secondary-title-text:focus {
  color: #0079BF;
  outline: 1px dotted #0079BF;
}
.story__secondary-title-text:hover {
  background-color: #0079BF;
}
.story__secondary-title-text:hover, .story__secondary-title-text:active {
  color: #FFFFFF;
  text-decoration: none;
}
.story__secondary-title-text:active {
  background-color: #003B5C;
  color: #FFFFFF;
  outline: none;
}
.story__secondary-title-text:visited {
  color: #5223B0;
}
.story__secondary-title-text:visited:hover {
  color: #FFFFFF;
}
@media (min-width: 1024px) {
  .story__secondary-title-text {
    top: 24px;
  }
}
.story__secondary-blurb {
  font-size: 0.8rem;
  line-height: 1rem;
  margin: 12px 0;
}
@media (min-width: 768px) {
  .story__secondary-blurb {
    font-size: 1rem;
    line-height: 1.5rem;
    margin-top: 0;
    margin-bottom: 24px;
  }
}
.story__secondary-source {
  font-size: 0.8rem;
  line-height: 0.875rem;
  font-weight: bold;
  margin: 12px 0;
}
@media (min-width: 768px) {
  .story__secondary-source {
    position: relative;
    font-size: 1rem;
    line-height: 1.25rem;
  }
}
@media (min-width: 1024px) {
  .story__secondary-source {
    position: absolute;
    bottom: 0;
  }
}
.story__secondary-source > a.link {
  color: #00598C;
  text-decoration: none;
}
.story__secondary-source > a.link:hover {
  background-color: #0079BF;
  color: #FFFFFF;
  text-decoration: none;
}
.story__secondary-source > a.link:active {
  background-color: #003B5C;
  color: #FFFFFF;
  text-decoration: none;
}
.story__secondary-source > a.link:focus {
  background-color: #0079BF;
  color: #FFFFFF;
  text-decoration: none;
}

.person-card, .person-card-grey, .person-card-gray {
  height: auto;
  display: inline-block;
  position: relative;
  background: #FFFFFF;
  vertical-align: top;
}
@media only screen and (min-width: 480px) {
  .person-card, .person-card-grey, .person-card-gray {
    max-width: 276px;
    margin: 0 16px 32px;
  }
}
.person-card-grey > .person-card__info-wrapper, .person-card-gray > .person-card__info-wrapper, .person-card-grey > .person-card-grey__info-wrapper, .person-card-gray > .person-card-grey__info-wrapper, .person-card-grey > .person-card-gray__info-wrapper, .person-card-gray > .person-card-gray__info-wrapper, .person-card-grey-grey > .person-card__info-wrapper, .person-card-grey-gray > .person-card__info-wrapper, .person-card-grey-grey > .person-card-grey__info-wrapper, .person-card-grey-gray > .person-card-grey__info-wrapper, .person-card-grey-grey > .person-card-gray__info-wrapper, .person-card-grey-gray > .person-card-gray__info-wrapper, .person-card-gray-grey > .person-card__info-wrapper, .person-card-gray-gray > .person-card__info-wrapper, .person-card-gray-grey > .person-card-grey__info-wrapper, .person-card-gray-gray > .person-card-grey__info-wrapper, .person-card-gray-grey > .person-card-gray__info-wrapper, .person-card-gray-gray > .person-card-gray__info-wrapper {
  background: #F2F2F2;
}
.person-card-grey > .person-card__info-wrapper, .person-card-gray > .person-card__info-wrapper, .person-card-grey > .person-card-grey__info-wrapper, .person-card-gray > .person-card-grey__info-wrapper, .person-card-grey > .person-card-gray__info-wrapper, .person-card-gray > .person-card-gray__info-wrapper, .person-card-grey-grey > .person-card__info-wrapper, .person-card-grey-gray > .person-card__info-wrapper, .person-card-grey-grey > .person-card-grey__info-wrapper, .person-card-grey-gray > .person-card-grey__info-wrapper, .person-card-grey-grey > .person-card-gray__info-wrapper, .person-card-grey-gray > .person-card-gray__info-wrapper, .person-card-gray-grey > .person-card__info-wrapper, .person-card-gray-gray > .person-card__info-wrapper, .person-card-gray-grey > .person-card-grey__info-wrapper, .person-card-gray-gray > .person-card-grey__info-wrapper, .person-card-gray-grey > .person-card-gray__info-wrapper, .person-card-gray-gray > .person-card-gray__info-wrapper {
  background: #F2F2F2;
}
.person-card__image, .person-card-grey__image, .person-card-gray__image {
  height: auto;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 599.98px) {
  .person-card__image, .person-card-grey__image, .person-card-gray__image {
    width: 100%;
  }
}
@media only screen and (min-width: 480px) {
  .person-card__image, .person-card-grey__image, .person-card-gray__image {
    width: 160px;
    height: 160px;
    padding-left: 32px;
  }
}
.person-card__info-wrapper, .person-card-grey__info-wrapper, .person-card-gray__info-wrapper {
  position: relative;
  bottom: 32px;
  background: #FFFFFF;
  z-index: 0;
  padding: 64px 32px 32px;
}
@media only screen and (min-width: 480px) and (max-width: 600px) {
  .person-card__info-wrapper, .person-card-grey__info-wrapper, .person-card-gray__info-wrapper {
    max-width: 192px;
  }
}
.person-card__name, .person-card-grey__name, .person-card-gray__name {
  color: #00598C;
  font-size: 24px;
  line-height: 27px;
  margin-bottom: 8px;
}
.person-card__department, .person-card-grey__department, .person-card-gray__department {
  color: #666666;
  font-size: 18px;
  line-height: 22.5px;
  margin-bottom: 12px;
}
.person-card__description, .person-card-grey__description, .person-card-gray__description {
  margin-bottom: 8px;
  font-size: 16px;
  line-height: 24px;
  color: #333333;
  max-height: 300px;
}
.person-card__description:last-child, .person-card-grey__description:last-child, .person-card-gray__description:last-child {
  margin-bottom: 0px;
}
.person-card:first-child, .person-card-grey:first-child, .person-card-gray:first-child {
  margin-top: 0px;
}
@media only screen and (min-width: 600px) {
  .person-card:first-child, .person-card-grey:first-child, .person-card-gray:first-child {
    margin-top: 40px;
  }
}

.footer__dept, .footer__global {
  padding: 32px 24px;
}
@media only screen and (min-width: 768px) {
  .footer__dept, .footer__global {
    padding: 40px;
  }
}
.footer__dept {
  background: #2774AE;
  color: #FFFFFF;
  font-weight: bold;
}
.footer__dept--logo {
  display: block;
  height: auto;
  margin-bottom: 32px;
}
@media only screen and (min-width: 480px) {
  .footer__dept--logo {
    max-width: 50%;
  }
}
@media only screen and (min-width: 768px) {
  .footer__dept--logo {
    max-width: 25%;
  }
}
@media only screen and (min-width: 1280px) {
  .footer__dept--logo {
    max-width: 18%;
  }
}
.footer__dept--info, .footer__dept--links {
  display: block;
}
@media only screen and (min-width: 1064px) {
  .footer__dept--info, .footer__dept--links {
    display: inline-block;
  }
}
.footer__dept--links {
  vertical-align: top;
}
@media only screen and (min-width: 768px) {
  .footer__dept--links-wrapper {
    display: inline-block;
  }
}
.footer__dept--links ul {
  margin-top: 0;
  margin-right: 24px;
  padding-left: 0;
  vertical-align: top;
  width: auto;
  display: inline-block;
}
.footer__dept--links ul li {
  margin-bottom: 2px;
  font-size: 1rem;
}
.footer__dept--links ul li a {
  color: #FFFFFF;
  text-decoration: none;
}
.footer__dept--links ul li a:hover {
  background: #FFE500;
  color: #000000;
}
.footer__dept--links ul li a:focus {
  outline: 1px dotted #FFFFFF;
}
.footer__dept--links ul li a:active {
  background: #FFBF0F;
}
.footer__dept--links ul li:not(:first-child) {
  font-size: 0.75rem;
}
.footer__dept--links ul li::before {
  content: none;
}
.footer__dept--info {
  margin-right: 24px;
}
@media only screen and (min-width: ) {
  .footer__dept--info {
    max-width: 25%;
  }
}
.footer__dept--contact {
  margin-bottom: 12px;
}
.footer__dept--contact p {
  color: #FFFFFF;
  font-size: 14px;
}
.footer__dept--contact a {
  color: #FFFFFF;
  text-decoration: none;
}
.footer__dept--contact a:hover {
  background: #FFE500;
  color: #000000;
}
.footer__dept--contact a:focus {
  outline: 1px dotted #FFFFFF;
}
.footer__dept--contact a:active {
  background: #FFBF0F;
}
.footer__dept--contact p:nth-child(2) {
  margin-bottom: 14px;
}
@media only screen and (min-width: breakpoint-mid(md)) {
  .footer__dept--contact {
    margin-bottom: 12px;
  }
}
.footer__dept--social {
  height: 48px;
  max-height: 100%;
  margin-bottom: 14px;
}
@media only screen and (min-width: 768px) {
  .footer__dept--social {
    margin-bottom: 14px;
    height: 48px;
  }
}
.footer__dept--social-facebook:hover, .footer__dept--social-facebook:active {
  content: url("/img/icons/social/facebook--black.svg");
}
.footer__dept--social-twitter:hover, .footer__dept--social-twitter:active {
  content: url("/img/icons/social/twitter--black.svg");
}
.footer__dept--social-instagram:hover, .footer__dept--social-instagram:active {
  content: url("/img/icons/social/instagram--black.svg");
}
.footer__dept--social-snapchat:hover, .footer__dept--social-snapchat:active {
  content: url("/img/icons/social/snapchat--black.svg");
}
.footer__dept--social-linkedin:hover, .footer__dept--social-linkedin:active {
  content: url("/img/icons/social/linkedin--black.svg");
}
.footer__dept--social-youtube:hover, .footer__dept--social-youtube:active {
  content: url("/img/icons/social/youtube--black.svg");
}
.footer__dept--social-tiktok:hover, .footer__dept--social-tiktok:active {
  content: url("/img/icons/social/tiktok--black.svg");
}
.footer__dept--social-facebook, .footer__dept--social-twitter, .footer__dept--social-instagram, .footer__dept--social-snapchat, .footer__dept--social-linkedin, .footer__dept--social-youtube, .footer__dept--social-tiktok {
  max-height: 100%;
  width: 48px;
  background-size: 48px;
  background-repeat: no-repeat;
  border-radius: 2px;
  display: inline-block;
  position: relative;
}
.footer__dept--social-facebook span, .footer__dept--social-twitter span, .footer__dept--social-instagram span, .footer__dept--social-snapchat span, .footer__dept--social-linkedin span, .footer__dept--social-youtube span, .footer__dept--social-tiktok span {
  position: relative;
}
.footer__dept--social-facebook:focus, .footer__dept--social-twitter:focus, .footer__dept--social-instagram:focus, .footer__dept--social-snapchat:focus, .footer__dept--social-linkedin:focus, .footer__dept--social-youtube:focus, .footer__dept--social-tiktok:focus {
  outline: 1px dotted #FFFFFF;
  border-radius: 2px;
}
.footer__dept--social-facebook:hover, .footer__dept--social-twitter:hover, .footer__dept--social-instagram:hover, .footer__dept--social-snapchat:hover, .footer__dept--social-linkedin:hover, .footer__dept--social-youtube:hover, .footer__dept--social-tiktok:hover {
  background-size: 48px;
  background: #FFE500;
}
.footer__dept--social-facebook:active, .footer__dept--social-twitter:active, .footer__dept--social-instagram:active, .footer__dept--social-snapchat:active, .footer__dept--social-linkedin:active, .footer__dept--social-youtube:active, .footer__dept--social-tiktok:active {
  background: #FFBF0F;
}
@media only screen and (min-width: 768px) {
  .footer__dept--social-facebook, .footer__dept--social-twitter, .footer__dept--social-instagram, .footer__dept--social-snapchat, .footer__dept--social-linkedin, .footer__dept--social-youtube, .footer__dept--social-tiktok {
    width: 48px;
    background-size: 48px;
  }
  .footer__dept--social-facebook:hover, .footer__dept--social-twitter:hover, .footer__dept--social-instagram:hover, .footer__dept--social-snapchat:hover, .footer__dept--social-linkedin:hover, .footer__dept--social-youtube:hover, .footer__dept--social-tiktok:hover {
    background-size: 48px;
  }
}
.footer__global {
  display: flex;
  flex-direction: column;
}
@media only screen and (min-width: 1157px) {
  .footer__global {
    display: block;
  }
}
.footer__global--copyright, .footer__global--links, .footer__global--social {
  width: 100%;
  display: block;
  vertical-align: top;
  font-size: 12.8px;
  width: 100%;
}
@media only screen and (min-width: 1175px) {
  .footer__global--copyright, .footer__global--links, .footer__global--social {
    width: 33%;
    display: inline-block;
  }
}
.footer__global--copyright {
  order: 2;
  line-height: 24px;
}
@media only screen and (max-width: 1175px) {
  .footer__global--copyright {
    margin-bottom: 24px;
    line-height: 18px;
  }
}
.footer__global--links {
  order: 3;
}
.footer__global--links ul {
  margin-bottom: 0;
  margin-top: 0;
  padding-left: 0;
}
.footer__global--links ul li {
  margin-bottom: 0;
  display: block;
}
.footer__global--links ul li::before {
  content: none;
}
.footer__global--links ul li:nth-child(2) {
  margin: 0;
}
@media only screen and (min-width: 1156px) {
  .footer__global--links ul li:nth-child(2) {
    margin-left: 32px;
    margin-right: 32px;
  }
}
.footer__global--links ul li a {
  font-weight: bold;
  text-decoration: none;
  color: #00598C;
}
.footer__global--links ul li a:hover {
  background: #0079BF;
  color: #FFFFFF;
}
.footer__global--links ul li a:active {
  background: #003B5C;
}
.footer__global--links ul li a:focus {
  outline: 1px dotted #0079BF;
}
@media only screen and (min-width: 1156px) {
  .footer__global--links ul li {
    display: inline-block;
  }
}
.footer__global--social {
  margin-top: -5px;
  text-align: left;
  order: 1;
}
@media only screen and (min-width: 1175px) {
  .footer__global--social {
    float: right;
    text-align: right;
  }
}
@media only screen and (max-width: 1174px) {
  .footer__global--social {
    margin-top: 0;
    margin-bottom: 24px;
  }
}
.footer__global--social a, .footer__global--social div {
  vertical-align: top;
  max-height: 48px;
  display: inline-block;
}
.footer__global--social-facebook:hover, .footer__global--social-facebook:active {
  content: url("/img/icons/social/facebook--white.svg");
}
.footer__global--social-twitter:hover, .footer__global--social-twitter:active {
  content: url("/img/icons/social/twitter--white.svg");
}
.footer__global--social-instagram:hover, .footer__global--social-instagram:active {
  content: url("/img/icons/social/instagram--white.svg");
}
.footer__global--social-snapchat:hover, .footer__global--social-snapchat:active {
  content: url("/img/icons/social/snapchat--white.svg");
}
.footer__global--social-linkedin:hover, .footer__global--social-linkedin:active {
  content: url("/img/icons/social/linkedin--white.svg");
}
.footer__global--social-youtube:hover, .footer__global--social-youtube:active {
  content: url("/img/icons/social/youtube--white.svg");
}
.footer__global--social-tiktok:hover, .footer__global--social-tiktok:active {
  content: url("/img/icons/social/tiktok--white.svg");
}
.footer__global--social-facebook, .footer__global--social-twitter, .footer__global--social-instagram, .footer__global--social-snapchat, .footer__global--social-linkedin, .footer__global--social-youtube, .footer__global--social-tiktok {
  max-height: 100%;
  width: 48px;
  background-size: 48px;
  background-repeat: no-repeat;
  border-radius: 2px;
  position: relative;
  display: inline-block;
  text-decoration: none;
}
.footer__global--social-facebook:hover, .footer__global--social-twitter:hover, .footer__global--social-instagram:hover, .footer__global--social-snapchat:hover, .footer__global--social-linkedin:hover, .footer__global--social-youtube:hover, .footer__global--social-tiktok:hover {
  background-size: 48px;
  background-repeat: no-repeat;
  background: #0079BF;
}
.footer__global--social-facebook:active, .footer__global--social-twitter:active, .footer__global--social-instagram:active, .footer__global--social-snapchat:active, .footer__global--social-linkedin:active, .footer__global--social-youtube:active, .footer__global--social-tiktok:active {
  background: #003B5C;
}
.footer__global--social-facebook:focus, .footer__global--social-twitter:focus, .footer__global--social-instagram:focus, .footer__global--social-snapchat:focus, .footer__global--social-linkedin:focus, .footer__global--social-youtube:focus, .footer__global--social-tiktok:focus {
  outline: 1px dotted #0079BF;
}

.email {
  background: #005587;
  padding: 32px 24px;
}
@media only screen and (min-width: 768px) {
  .email {
    padding: 40px;
  }
}
.email__heading, .email__description, .email__form, .email__legal-text, .email__legal-link, .email__legal-link:visited, .email__legal-link:link {
  color: #FFFFFF;
}
.email__heading {
  font-size: 16px;
  font-weight: bold;
  line-height: 20px;
  text-transform: uppercase;
  margin-bottom: 16px;
}
.email__description {
  margin-bottom: 32px;
}
.email__input {
  display: block;
  padding: 0px;
  margin-bottom: 22px;
  vertical-align: top;
}
@media (min-width: 1024px) {
  .email__input {
    display: table-cell;
    padding: 0 12px;
    margin-bottom: 0;
  }
}
.email__input-text {
  box-sizing: border-box;
  padding: 12px 30px 12px 12px;
  width: 100%;
  height: 48px;
  border: none;
  font-size: 1rem;
  background-color: #003B5C;
  opacity: 1;
  border-radius: 2px;
  color: #FFFFFF;
  margin-top: 6px;
}
.email__input-text::placeholder {
  color: #CCCCCC;
}
.email__input-text:focus {
  outline: 1px dotted #FFFFFF;
  outline-offset: -3px;
}
.email__input-text.checked {
  background-image: url("/img/Success.svg") !important;
  background-repeat: no-repeat;
  background-size: auto !important;
  background-position: 96% 51%;
}
@media (min-width: 768px) {
  .email__input-text.checked {
    background-position: 98% 50%;
  }
}
.email__input-text.error {
  background-image: url("/img/Error.svg") !important;
  background-repeat: no-repeat;
  background-size: auto !important;
  background-position: 98% 50%;
  border: 2px solid #FFD100;
}
.email__input-submit {
  background-color: #FFD100;
  height: 48px;
  border: none;
  border-radius: 2px;
  color: #333;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  font-weight: bold;
  padding: 12px 24px;
  width: 100%;
  margin-top: 6px;
  position: relative;
  top: 0px;
  max-width: 120px;
}
@media (min-width: 1024px) {
  .email__input-submit {
    margin-top: 0px;
    top: 23px;
    max-width: none;
  }
}
.email__input-submit:active {
  background-color: #FFBF0F;
}
.email__input-submit:focus {
  background-color: #FFE500;
  outline: 1px dotted #FFFFFF;
  outline-offset: 1px;
}
.email__input-container {
  display: block;
  padding: 0;
  width: 100%;
  margin-bottom: 24px;
}
@media (min-width: 1024px) {
  .email__input-container {
    display: table;
  }
}
.email__input-label {
  font-weight: bold;
  display: block;
}
.email__input-email {
  width: auto;
}
@media (min-width: 1024px) {
  .email__input-email {
    width: 28.32%;
    padding-left: 0;
  }
}
@media (min-width: 768px) {
  .email__input-email input[type=text] {
    max-width: 520px;
  }
}
.email__input-firstname {
  width: auto;
}
@media (min-width: 768px) {
  .email__input-firstname {
    width: 256px;
    display: inline-block;
    margin-right: 5px;
  }
}
@media (min-width: 1024px) {
  .email__input-firstname {
    width: 23.89%;
    display: table-cell;
  }
}
.email__input-lastname {
  width: auto;
}
@media (min-width: 768px) {
  .email__input-lastname {
    width: 256px;
    display: inline-block;
  }
}
@media (min-width: 1024px) {
  .email__input-lastname {
    width: 24.34%;
    display: table-cell;
  }
}
.email__input-zipcode {
  width: auto;
}
@media (min-width: 1024px) {
  .email__input-zipcode {
    width: 12.04%;
  }
}
.email__input-zipcode input[name=Zip] {
  max-width: 120px;
  clear: both;
}
.email__input-button {
  width: auto;
  padding-right: 0;
  position: relative;
  margin-bottom: 8px;
}
@media (min-width: 1024px) {
  .email__input-button {
    width: 11.53%;
    margin-bottom: 0;
  }
}
.email__legal-text {
  font-size: 0.8rem;
  line-height: 18px;
}
.email__legal-link {
  text-decoration: underline;
}
.email__legal-link:hover {
  background: #FFE500;
  color: #000000;
}
.email__legal-link:focus {
  outline: 1px dotted #FFFFFF;
}
.email__legal-link:active {
  background: #FFBF0F;
}

.text, .radio, .select, .checkbox {
  margin-bottom: 8px;
}

.text__label, .text__input, .text__help, .text__error {
  display: block;
}
.text__label {
  display: block;
  font-size: 16px;
  line-height: 24px;
  color: #333333;
  margin-top: 8px;
  margin-bottom: 8px;
}
.text__input {
  box-sizing: border-box;
  -moz-appearance: none;
  /* Firefox */
  -webkit-appearance: none;
  /* Safari and Chrome */
  appearance: none;
  background: #EBEBEB;
  background-size: 24px;
  font-size: 16px;
  line-height: 24px;
  padding: 8px 24px 8px 16px;
  border: 1px solid #808080;
  border-radius: 2px;
  color: #666666;
}
.text__input:focus {
  outline: 1px dotted #0079BF;
  outline-offset: 1px;
}
.text.full-width > .text__input {
  width: 100%;
  max-width: 100%;
}
.text__help {
  display: block;
  color: #666666;
  margin-top: 8px;
}
.text__error {
  display: none;
}
.text.hasError > .text__input {
  border: 1px solid red;
}
.text.hasError > .text__error {
  display: block;
  color: #D60000;
  margin-top: 8px;
}

.select__label {
  display: block;
  font-size: 16px;
  line-height: 24px;
  color: #333333;
  margin-top: 8px;
  margin-bottom: 8px;
}
.select.full-width > .select__menu {
  width: 100%;
}
.select__menu {
  -moz-appearance: none;
  /* Firefox */
  -webkit-appearance: none;
  /* Safari and Chrome */
  appearance: none;
  background: #EBEBEB url("/img/icons/arrow-down-defaultblue.svg") no-repeat 98.5% 50%;
  background-size: 24px;
  font-size: 16px;
  line-height: 24px;
  padding: 8px 24px 8px 16px;
  border: 1px solid #808080;
  border-radius: 2px;
  color: #666666;
}
.select__menu::-ms-expand {
  display: none;
  /* Hide the default arrow in Internet Explorer 10 and Internet Explorer 11 */
}
.select__menu:focus {
  outline: 1px dotted #0079BF;
  outline-offset: 1px;
}
.select__menu:active {
  color: #000000;
}
.select__help {
  display: block;
  color: #666666;
  margin-top: 8px;
}
.select__error {
  display: none;
}
.select.hasError > .select__menu {
  border: 1px solid red;
  background: #EBEBEB url("/img/icons/error-red.svg") no-repeat 96.5% 50%;
  background-size: 24px 24px;
}
.select.hasError > .select__error {
  display: block;
  color: #D60000;
  margin-top: 8px;
}

.checkbox__input {
  appearance: none;
  -webkit-appearance: none;
  border: 1px solid #cacece;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05);
  padding: 9px;
  border-radius: 2px;
  display: inline-block;
  margin-right: 12px;
}
.checkbox__input:hover {
  background: #0079BF;
}
.checkbox__input:focus {
  outline-style: dotted;
  outline-offset: 1px;
}
.checkbox__input:active, .checkbox__input:checked:active {
  outline-offset: -1px;
}
.checkbox__input:checked {
  background-color: #003B5C;
  border: 1px solid #adb8c0;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05), inset 15px 10px -12px rgba(255, 255, 255, 0.1);
  padding: 0 4px;
}
.checkbox__input:checked::after {
  background-image: url("/img/icons/checkmark-white.svg");
  background-size: 10px 10px;
  display: inline-block;
  width: 10px;
  height: 10px;
  content: "";
}
.checkbox__input:checked {
  background-color: #003B5C;
  border: 1px solid #adb8c0;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05), inset 15px 10px -12px rgba(255, 255, 255, 0.1);
  padding: 0 4px;
}

.radio__input {
  -moz-appearance: none;
  /* Firefox */
  -webkit-appearance: none;
  /* Safari and Chrome */
  appearance: none;
  display: inline-block;
  height: 24px;
  width: 24px;
  border-radius: 12px;
  border: 1px solid #808080;
  background-clip: content-box;
  margin-right: 11px;
}
.radio__input:hover {
  background: #0079BF;
  border-color: #0079BF;
}
.radio__input:checked {
  background: #003B5C;
  border-color: #003B5C;
}
.radio__input:checked::after {
  background-image: url("/img/icons/radio-bullet-icon.svg");
  background-size: 25px 25px;
  background-repeat: none;
  background-position: 50%;
  display: inline-block;
  content: "";
  width: 22px;
  height: 22px;
}
.radio__input:focus {
  outline-style: dotted;
  outline-offset: 1px;
}

.fieldset {
  border: 1px solid #808080;
  padding: 32px;
}
.fieldset__legend {
  font-size: 20px;
  font-weight: bold;
  line-height: 22.5px;
  color: #333333;
  padding: 0 4px;
}

.ucla a {
  color: #00598C;
}
.ucla a:not(.page):visited {
  color: #5223B0;
}
.ucla a:hover {
  color: white;
  background: #0079BF;
}
.ucla a:active {
  color: white;
  background: #003B5C;
}
.ucla a:focus {
  outline: 1px dotted #00598C;
}
.ucla .white-link {
  color: #FFFFFF;
}
.ucla .white-link:visited {
  color: #FFFFFF;
}
.ucla .white-link:focus {
  outline: 1px dotted #FFFFFF;
  color: #FFFFFF;
}
.ucla .white-link:hover {
  color: #333333;
  background: #FFE500;
}
.ucla .white-link:active {
  color: #333333;
  background: #FFBF0F;
}
.ucla .related-links {
  border-bottom: 1px solid #E5E5E5;
  padding-inline-start: 0;
}
.ucla .related-links li {
  position: relative;
  border-top: 1px solid #E5E5E5;
  margin: 0;
}
.ucla .related-links li::before {
  content: "";
  margin-left: 0;
  display: block;
}
.ucla .related-links li a {
  line-height: 1.5rem;
  color: #00598C;
  text-decoration: none;
  display: block;
  padding: 12px 80px 12px 16px;
  font-weight: bold;
}
.ucla .related-links li a:focus {
  background-color: #FFFFFF;
  color: #00598C;
  outline: 1px dotted #00598C;
  outline-offset: -3px;
}
.ucla .related-links li a:hover, .ucla .related-links li a:active {
  color: #FFFFFF;
}
.ucla .related-links li a:hover {
  background-color: #0079BF;
}
.ucla .related-links li a:active {
  background-color: #003B5C;
}
.ucla .related-links li a.related-links--external::after {
  content: "";
  background: url("/img/icons/external-link-defaultblue.svg");
  background-size: contain;
  width: 24px;
  height: 24px;
  display: block;
  position: absolute;
  right: 24px;
  top: calc(50% - 11px);
}
.ucla .related-links li a.related-links--external:hover::after {
  background: url("/img/icons/external-link-white.svg");
  background-size: contain;
}
.ucla .related-links li a.related-links--download::after {
  content: "";
  background: url("/img/icons/download-defaultblue.svg");
  background-size: contain;
  width: 24px;
  height: 24px;
  display: block;
  position: absolute;
  right: 24px;
  top: calc(50% - 11px);
}
.ucla .related-links li a.related-links--download:hover::after {
  background: url("/img/icons/download-white.svg");
  background-size: contain;
}

.ucla-list--bulleted {
  list-style: none;
  line-height: 24px;
  padding-left: 28.5px;
}
.ucla-list--bulleted li {
  margin-bottom: 16px;
}
.ucla-list--bulleted li::before {
  content: "▪";
  color: #2774AE;
  width: 3em;
  margin-left: -18px;
  padding-right: 13px;
}
li .ucla-list--bulleted li::before {
  content: "□";
}
.ucla-list--bulleted li .ucla-list--bulleted, .ucla-list--bulleted li .ucla-list--numbered {
  margin-top: 16px;
  padding-left: 20px;
}
.ucla-list--bulleted li .ucla-list--bulleted li, .ucla-list--bulleted li .ucla-list--numbered li {
  padding-left: 0;
}
.ucla-list--bulleted li .ucla-list--bulleted li::before, .ucla-list--bulleted li .ucla-list--numbered li::before {
  font-size: 9px;
}

.ucla-list--numbered {
  list-style: none;
  counter-reset: li;
  line-height: 24px;
  padding-left: 5px;
}
.ucla-list--numbered li {
  margin-bottom: 16px;
  counter-increment: li;
  padding-left: 24px;
}
.ucla-list--numbered li::before {
  content: "." counter(li);
  color: #2774AE;
  display: inline-block;
  width: 1em;
  margin-left: -1.5em;
  margin-right: 0.5em;
  text-align: right;
  direction: rtl;
}
.ucla-list--numbered li .ucla-list--bulleted, .ucla-list--numbered li .ucla-list--numbered {
  padding-left: 20px;
  margin-top: 16px;
}
.ucla-list--numbered li .ucla-list--bulleted li, .ucla-list--numbered li .ucla-list--numbered li {
  padding-left: 0;
}

.ribbon span {
  font-size: 1.5rem;
  font-weight: bold;
  text-transform: uppercase;
  color: #FFFFFF;
  background: #2774AE;
  display: inline-block;
  padding: 8px 4px 6px 4px;
  margin-bottom: 2px;
  position: relative;
}
.ribbon span.first {
  padding-left: 8px;
}
.ribbon span.last {
  padding-right: 8px;
}
@media (min-width: 768px) {
  .ribbon span {
    font-size: 3rem;
    padding: 8px 4px 4px 12px;
    margin-bottom: 2px;
  }
  .ribbon span.first {
    padding-left: 14px;
  }
  .ribbon span.last {
    padding-right: 14px;
  }
}

.ribbon--highlight span {
  font-size: 1.5rem;
  font-weight: bold;
  text-transform: none;
  line-height: 1;
  color: #333333;
  background: #FFD100;
  display: inline-block;
  padding: 12px 3px 6px 3px;
  margin-bottom: 2px;
}
.ribbon--highlight span.first {
  padding-left: 12px;
}
.ribbon--highlight span.last {
  padding-right: 12px;
}

.social-links-container,
.social-links-container--blue {
  padding: 10px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.social-links-container a,
.social-links-container--blue a {
  height: 48px;
  width: 48px;
  margin: 2px;
  border-radius: 2px;
}
.social-links-container svg,
.social-links-container--blue svg {
  height: 48px;
  width: 48px;
}

.social-links-container a:hover {
  background-color: #0079BF;
}
.social-links-container a:focus {
  outline: 1px dotted #0079BF;
}
.social-links-container a:active {
  background-color: #003B5C;
}
.social-links-container--blue {
  background-color: #2774AE;
}
.social-links-container--blue a:hover {
  background-color: #FFE500;
}
.social-links-container--blue a:focus {
  outline: 1px dotted #FFFFFF;
}
.social-links-container--blue a:active {
  background-color: #FFBF0F;
}
.social-links-container .social-icon--facebook {
  background: url("/img/icons/social-icons/facebook-color.svg");
}
.social-links-container .social-icon--twitter {
  background: url("/img/icons/social-icons/twitter-color.svg");
}
.social-links-container .social-icon--instagram {
  background: url("/img/icons/social-icons/instagram-color.svg");
}
.social-links-container .social-icon--snapchat {
  background: url("/img/icons/social-icons/snapchat-color.svg");
}
.social-links-container .social-icon--linkedin {
  background: url("/img/icons/social-icons/linkedin-color.svg");
}
.social-links-container .social-icon--youtube {
  background: url("/img/icons/social-icons/youtube-color.svg");
}
.social-links-container .social-icon--tiktok {
  background: url("/img/icons/social-icons/tiktok-color.svg");
}
.social-links-container--blue .social-icon--facebook,
.social-links-container a:hover .social-icon--facebook,
.social-links-container a:active .social-icon--facebook {
  background: url("/img/icons/social-icons/facebook-white.svg");
}
.social-links-container--blue .social-icon--twitter,
.social-links-container a:hover .social-icon--twitter,
.social-links-container a:active .social-icon--twitter {
  background: url("/img/icons/social-icons/twitter-white.svg");
}
.social-links-container--blue .social-icon--instagram,
.social-links-container a:hover .social-icon--instagram,
.social-links-container a:active .social-icon--instagram {
  background: url("/img/icons/social-icons/instagram-white.svg");
}
.social-links-container--blue .social-icon--snapchat,
.social-links-container a:hover .social-icon--snapchat,
.social-links-container a:active .social-icon--snapchat {
  background: url("/img/icons/social-icons/snapchat-white.svg");
}
.social-links-container--blue .social-icon--linkedin,
.social-links-container a:hover .social-icon--linkedin,
.social-links-container a:active .social-icon--linkedin {
  background: url("/img/icons/social-icons/linkedin-white.svg");
}
.social-links-container--blue .social-icon--youtube,
.social-links-container a:hover .social-icon--youtube,
.social-links-container a:active .social-icon--youtube {
  background: url("/img/icons/social-icons/youtube-white.svg");
}
.social-links-container--blue .social-icon--tiktok,
.social-links-container a:hover .social-icon--tiktok,
.social-links-container a:active .social-icon--tiktok {
  background: url("/img/icons/social-icons/tiktok-white.svg");
}
.social-links-container--blue a:hover .social-icon--facebook, .social-links-container--blue a:active .social-icon--facebook {
  background: url("/img/icons/social-icons/facebook-black.svg");
}
.social-links-container--blue a:hover .social-icon--twitter, .social-links-container--blue a:active .social-icon--twitter {
  background: url("/img/icons/social-icons/twitter-black.svg");
}
.social-links-container--blue a:hover .social-icon--instagram, .social-links-container--blue a:active .social-icon--instagram {
  background: url("/img/icons/social-icons/instagram-black.svg");
}
.social-links-container--blue a:hover .social-icon--snapchat, .social-links-container--blue a:active .social-icon--snapchat {
  background: url("/img/icons/social-icons/snapchat-black.svg");
}
.social-links-container--blue a:hover .social-icon--linkedin, .social-links-container--blue a:active .social-icon--linkedin {
  background: url("/img/icons/social-icons/linkedin-black.svg");
}
.social-links-container--blue a:hover .social-icon--youtube, .social-links-container--blue a:active .social-icon--youtube {
  background: url("/img/icons/social-icons/youtube-black.svg");
}
.social-links-container--blue a:hover .social-icon--tiktok, .social-links-container--blue a:active .social-icon--tiktok {
  background: url("/img/icons/social-icons/tiktok-black.svg");
}

.social-tile-container {
  padding: 10px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

.social-tile {
  width: 276px;
  height: 276px;
  margin: 0 24px 24px 0;
  background-color: #2774AE;
}
.social-tile a {
  position: relative;
  width: 276px;
  height: 276px;
  display: block;
  text-decoration: none;
}
.social-tile a:hover {
  background: #0079BF;
}
.social-tile a:focus {
  background: #0079BF;
  outline: 1px dotted #0079BF;
  outline-offset: 2px;
}
.social-tile a:active {
  background: #003B5C;
}
.social-tile__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.social-tile__text, .social-tile__info {
  color: #FFFFFF;
}
.social-tile__text {
  font-size: 0.8rem;
  line-height: 1rem;
  position: absolute;
  top: 0px;
  left: 0px;
  max-height: 152px;
  padding: 24px;
  padding-bottom: 24px;
  padding-bottom: 0px;
  overflow: hidden;
}
.social-tile__info {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 0px 24px 24px 24px;
  font-size: 0.8rem;
  line-height: 1rem;
  font-weight: bold;
}
.social-tile__info span {
  display: block;
}
.social-tile__instagram::after, .social-tile__twitter::after {
  content: "";
  position: absolute;
  background-size: cover;
  bottom: 16px;
  right: 16px;
  height: 48px;
  width: 48px;
}
.social-tile__instagram .social-tile__text,
.social-tile__instagram .social-tile__info {
  visibility: hidden;
}
.social-tile__instagram:hover .social-tile__text,
.social-tile__instagram:hover .social-tile__info, .social-tile__instagram:focus .social-tile__text,
.social-tile__instagram:focus .social-tile__info, .social-tile__instagram:active .social-tile__text,
.social-tile__instagram:active .social-tile__info {
  visibility: visible;
}
.social-tile__instagram:hover .social-tile__photo, .social-tile__instagram:focus .social-tile__photo, .social-tile__instagram:active .social-tile__photo {
  opacity: 0.2;
}
.social-tile__instagram::after {
  background: url("/img/icons/social-icons/instagram-white.svg");
}
.social-tile__twitter::after {
  background: url("/img/icons/social-icons/twitter-white.svg");
}

/*************************************
************************************

Statistic touts are visual callouts used to highlight an important fact, data point, or ranking.

TABLE OF CONTENTS:
1. The container for multiple stat touts: .stat-set
2. Individual stat touts
    a. Number (value text)
    b. Label (descriptor text)
    c. Source text
3. Variations
    a. Inline

*************************************
************************************/
@media (min-width: 768px) {
  .stat-set {
    display: flex;
  }
}

.stat-wrapper .stat-tout {
  display: block;
  border-left: 4px solid #FFD100;
  padding: 16px 24px 16px 28px;
  /************
    Variation: inline stat touts

    Note: inline stat touts appear stacked on mobile widths.
  *************/
}
@media (min-width: 768px) {
  .stat-wrapper .stat-tout {
    display: inline-block;
  }
}
.stat-wrapper .stat-tout__number {
  font-size: 54px;
  line-height: 48px;
  color: #333333;
  font-weight: bold;
  display: block;
  margin-bottom: 8px;
}
.stat-wrapper .stat-tout__number > span {
  font-size: 18px;
  vertical-align: middle;
  margin: 0 -5px;
}
.stat-wrapper .stat-tout__label {
  font-size: 20px;
  line-height: 24px;
  font-weight: bold;
  display: block;
  max-width: 212px;
  color: #333333;
}
@media (min-width: 768px) {
  .stat-wrapper .stat-tout__label {
    max-width: 312px;
  }
}
.stat-wrapper .stat-tout__source {
  display: block;
  font-size: 12.8px;
  font-weight: bold;
  font-style: italic;
  color: #666;
  padding-top: 8px;
  line-height: 16px;
}
@media (min-width: 1024px) {
  .stat-wrapper .stat-tout--inline {
    display: flex;
    align-items: stretch;
  }
  .stat-wrapper .stat-tout--inline .stat-tout__number {
    margin-right: 16px;
    margin-bottom: 8px;
  }
}
@media (min-width: 1024px) and (min-width: 1024px) {
  .stat-wrapper .stat-tout--inline .stat-tout__number {
    margin-bottom: 0;
  }
}
@media (min-width: 1024px) {
  .stat-wrapper .stat-tout--inline .stat-tout__label {
    display: block;
    max-width: inherit;
  }
}

.fixed-table {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.fixed-table__scroller {
  margin-left: calc(36% + 16px);
  /* If you change this line you must also change the nested class ".fixed-table__sticky-col" width to match. */
  overflow-x: auto;
  overflow-y: visible;
}
@media (min-width: 768px) {
  .fixed-table__scroller {
    overflow-x: visible;
    margin-left: 0;
  }
}
.fixed-table__wrapper {
  border: none;
  border-spacing: 0;
  width: 100%;
}
.fixed-table__wrapper thead th {
  font-size: 0.75rem;
  line-height: 0.75rem;
  font-weight: bold;
  text-transform: uppercase;
  color: #333333;
  padding: 8px 16px;
  word-wrap: break-word;
  text-align: left;
}
.fixed-table__wrapper thead th.align-right {
  text-align: right;
}
@-moz-document url-prefix() {
  .fixed-table__wrapper .fixed-table__sticky-col {
    margin-top: -24px;
  }
  @media (min-width: 768px) {
    .fixed-table__wrapper .fixed-table__sticky-col {
      margin-top: 0;
    }
  }
}
.fixed-table__wrapper tbody > tr:nth-child(odd), .fixed-table__wrapper tbody > tr:nth-child(odd) td:nth-child(1) {
  background-color: #EBEBEB;
}
.fixed-table__wrapper tbody > tr:nth-child(even), .fixed-table__wrapper tbody > tr:nth-child(even) td:nth-child(1) {
  background-color: #FFFFFF;
}
.fixed-table__wrapper tbody > tr.blue-total, .fixed-table__wrapper tbody > tr.blue-total td:nth-child(1) {
  background-color: #DAEBFE;
  font-weight: bold;
}
.fixed-table__wrapper tbody > tr.yellow-total, .fixed-table__wrapper tbody > tr.yellow-total td:nth-child(1) {
  background-color: #FFD100;
  font-weight: bold;
}
.fixed-table__wrapper tbody > tr.yellow-total > td, .fixed-table__wrapper tbody > tr.yellow-total td:nth-child(1) > td {
  border: none;
}
.fixed-table__wrapper tbody td {
  font-size: 0.8rem;
  line-height: 1rem;
  color: #333;
  padding: 8px 16px;
  word-wrap: break-word;
}
.fixed-table__wrapper tfoot > tr.blue-total, .fixed-table__wrapper tfoot > tr.blue-total td:nth-child(1) {
  background-color: #DAEBFE;
  font-weight: bold;
}
.fixed-table__wrapper tfoot > tr.yellow-total, .fixed-table__wrapper tfoot > tr.yellow-total td:nth-child(1) {
  background-color: #FFD100;
  font-weight: bold;
}
.fixed-table__wrapper tfoot > tr.yellow-total > td, .fixed-table__wrapper tfoot > tr.yellow-total td:nth-child(1) > td {
  border: none;
}
.fixed-table__wrapper tfoot td {
  font-size: 0.8rem;
  line-height: 1rem;
  color: #333333;
  padding: 8px 16px;
  word-wrap: break-word;
}
.fixed-table #sortTable {
  opacity: 0;
  filter: alpha(opacity=0);
}
.fixed-table #sortTable tr th:nth-child(1) {
  position: absolute;
}
@media (min-width: 768px) {
  .fixed-table #sortTable tr th:nth-child(1) {
    position: relative;
  }
}
.fixed-table #sortTable tr th:nth-child(1) {
  width: 34%;
}
.fixed-table #sortTable th {
  position: relative;
  cursor: pointer;
  padding-left: 32px;
}
.fixed-table #sortTable th::before, .fixed-table #sortTable th::after {
  content: "◤";
  font-size: 6px;
  color: #333333;
  display: block;
  position: absolute;
  left: 18px;
  top: 12px;
  width: 6px;
  height: 9px;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
.fixed-table #sortTable th::after {
  left: 16px;
  top: 16px;
  -webkit-transform: rotate(225deg);
  -moz-transform: rotate(225deg);
  -ms-transform: rotate(225deg);
  -o-transform: rotate(225deg);
  transform: rotate(225deg);
}
.fixed-table #sortTable th.sorting-asc::after {
  color: #00598C;
}
.fixed-table #sortTable th.sorting-desc::before {
  color: #00598C;
}
.fixed-table__sticky-col {
  left: 0;
  position: absolute;
  top: auto;
  width: 36%;
  /* If you change this line change you must also change the parent class ".fixed-table__scroller" margin-left to match. */
  overflow-y: scroll;
  font-weight: bold;
}
@media (min-width: 768px) {
  .fixed-table__sticky-col {
    min-width: 300px;
    position: relative;
  }
}
.fixed-table ::-webkit-scrollbar {
  width: 0;
  height: 8px;
}
.fixed-table ::-webkit-scrollbar-track {
  box-shadow: inset 0 -1px 0 0 #E5E5E5, inset 0 1px 0 0 #E5E5E5;
  border-radius: 4px;
}
.fixed-table ::-webkit-scrollbar-thumb {
  background: #00598C;
  border-radius: 4px;
}
.fixed-table ::-webkit-scrollbar-thumb:hover {
  background: #0079BF;
}

/*************************************
  Tabbed card section
************************************/
/* .tabs is the container for tab buttons and tab panels */
.tabs {
  /* container for tab buttons */
  /* .tablinks are buttons controlling which panel displays */
  /* .tabcontent are the tab panels containing content */
}
@media (min-width: 768px) {
  .tabs {
    max-width: 776px;
    margin: 0 auto;
    display: block;
    overflow: hidden;
    border-bottom: 1px solid #E5E5E5;
  }
}
.tabs div[role=tablist] {
  white-space: nowrap;
  border-bottom: 1px solid #E5E5E5;
}
@media (min-width: 1280px) {
  .tabs div[role=tablist] {
    overflow: hidden;
  }
}
.tabs .tablinks {
  display: inline-block;
  position: relative;
  margin: 0;
  cursor: pointer;
  padding: 8px 16px 12px;
  color: #00598C;
  font-weight: bold;
  background: none;
  border-bottom: 4px solid transparent;
  /* when button is active */
}
.tabs .tablinks[aria-selected=true] {
  color: #333;
  border-bottom: 4px solid #FFD100;
}
.tabs .tablinks:hover {
  color: #0079BF;
  border-bottom: 4px solid #0079BF;
}
.tabs .tablinks:focus {
  color: #0079BF;
  outline: 1px dotted #0079BF;
  outline-offset: -2px;
}
.tabs .tablinks:active {
  color: #333;
  border-bottom: 4px solid #FFD100;
}
.tabs .tabcontent {
  position: relative;
  z-index: 2;
}
.tabs .tabcontent:focus {
  outline: 1px dotted #0079BF;
  outline-offset: -2px;
}
.tabs .tabcontent p {
  font-size: 16px;
  line-height: 24px;
}
.tabs .tabcontent p a {
  text-decoration: underline;
  color: #00598C;
}
.tabs .tabcontent p a:visited {
  color: #5223B0;
}
.tabs .tabcontent p a:hover {
  color: #FFFFFF;
  background-color: #0079BF;
}
.tabs .tabcontent p a:focus {
  color: #FFFFFF;
  background-color: #0079BF;
  outline: 1px dotted #0079BF;
  outline-offset: 2px;
}
.tabs .tabcontent p a:active {
  color: #FFFFFF;
  background-color: #003B5C;
}

/*------------------------------------
    Header
  ------------------------------------*/
#header {
  border-bottom: 1px solid #E5E5E5;
}
#header a:focus {
  outline: 1px dotted #0079BF;
}
#header .header-logo a:focus {
  outline: 1px dotted #FFFFFF;
}

/*------------------------------------
    Header Logo
  ------------------------------------*/
.header-logo {
  background-color: #2774AE;
  padding: 8px 24px;
  max-height: 48px;
}
@media (min-width: 1024px) {
  .header-logo {
    padding: 12px 24px;
  }
}
.header-logo a {
  text-decoration: none;
}
.header-logo__wrap {
  display: block;
  max-width: 1176px;
  margin: 0 auto;
}
.header-logo__image {
  display: inline-block;
  height: 24px;
  margin-right: 13px;
}
.header-logo .breadcrumb {
  position: relative;
  top: 5px;
  width: calc(100% - 100px);
}

/*------------------------------------
    Breadcrumb
  ------------------------------------*/
.breadcrumb {
  margin: 0;
  padding: 0;
  list-style: none;
  white-space: nowrap;
  overflow-y: scroll;
  width: 100%;
  -ms-overflow-style: none;
  scrollbar-width: none;
  display: inline-block;
  width: calc(100% - 5px);
}
@media (min-width: 1024px) {
  .breadcrumb {
    width: 100%;
  }
}
.breadcrumb::-webkit-scrollbar {
  display: none;
}
.breadcrumb__item {
  display: inline-block;
  padding: 0;
  margin: 0;
  font-size: 1rem;
  line-height: 1.25rem;
  font-weight: bold;
  border-radius: 1px;
}
.breadcrumb__item a {
  text-decoration: none;
  color: #00598C;
}
.breadcrumb__item a:hover {
  background-color: #0079BF;
  color: #FFFFFF;
}
.breadcrumb__item a:focus {
  outline: 1px dotted #0079BF;
}
.breadcrumb__item::before {
  content: "/";
  display: inline;
  padding: 0 8px;
  margin: 0;
  font-weight: normal;
  color: #949494;
}
.breadcrumb__item--first::before {
  content: none;
}
.breadcrumb--white {
  color: #FFFFFF;
  position: relative;
}
.breadcrumb--white .breadcrumb__item a {
  color: #FFFFFF;
}
.breadcrumb--white .breadcrumb__item a:hover {
  background-color: #FFE500;
  color: #333333;
}
.breadcrumb--white .breadcrumb__item::before {
  color: #FFFFFF;
}
.breadcrumb--fade {
  display: inline-block;
  position: relative;
  width: 0px;
  height: 25px;
}
@media (min-width: 1024px) {
  .breadcrumb--fade {
    display: none;
  }
}
.breadcrumb--fade::after {
  content: "";
  position: absolute;
  width: 5px;
  height: 24px;
  top: 0px;
  right: 0px;
  background: white;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, white 84%, white 100%);
}
.breadcrumb--fade.white::after {
  background: #2774ae;
  background: linear-gradient(90deg, rgba(39, 116, 174, 0) 0%, #2774ae 84%, #2774ae 100%);
}

/*--------------------------------------
    Site Name
  ------------------------------------*/
.site-name {
  font-weight: bold;
  font-size: 1.75rem;
  line-height: 1.75rem;
  margin-bottom: 16px;
}
.site-name a {
  text-decoration: none;
  color: #333333;
  display: block;
}

/*--------------------------------------
    Header Wrap
  ------------------------------------*/
.header-wrap {
  display: block;
  max-width: 1176px;
  margin: 0 auto;
  padding: 16px 0px 0px;
  position: relative;
  top: 1px;
  min-height: 41px;
}
@media (min-width: 1024px) {
  .header-wrap {
    padding: 24px 24px 0px;
    min-height: auto;
  }
}
.header-wrap::after {
  content: "";
  display: block;
}
.header-wrap .site-name {
  float: left;
  width: 75%;
  margin-left: 24px;
}
@media (min-width: 1024px) {
  .header-wrap .site-name {
    width: 50%;
    margin-left: 0px;
    margin-bottom: 0px;
  }
}
.header-wrap .site-name a {
  margin-bottom: 0px;
}
@media (min-width: 1024px) {
  .header-wrap .site-name a {
    margin-bottom: 32px;
  }
}
.header-wrap #menu-secondary {
  float: right;
  width: 50%;
  position: relative;
  display: none;
}
@media (min-width: 1024px) {
  .header-wrap #menu-secondary {
    display: block;
  }
}
.header-wrap #menu-secondary .nav-secondary {
  float: right;
  position: relative;
  top: -6px;
}

/*------------------------------------
    Navigation Container
  ------------------------------------*/
#menu {
  display: block;
  position: relative;
  width: 100%;
}
@media (min-width: 1024px) {
  #menu {
    width: auto;
  }
}
#menu .nav-primary {
  right: -100%;
  top: 43px;
  position: relative;
  width: 100%;
  z-index: 100;
}
@media (min-width: 1024px) {
  #menu .nav-primary {
    top: 0px;
    z-index: 100;
  }
}
#menu .nav-primary__list {
  float: right;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
@media (min-width: 1024px) {
  #menu .nav-primary__list {
    width: auto;
    position: relative;
    left: auto;
    top: auto;
  }
}
#menu .nav-primary--is-active {
  right: 0%;
}
@media (min-width: 1024px) {
  #menu .nav-primary--is-active {
    right: 0;
  }
}
#menu .hamburger {
  position: absolute;
  right: 0px;
  bottom: -31px;
  margin-right: 24px;
}
@media (min-width: 1024px) {
  #menu .hamburger {
    display: none;
    margin-right: 0px;
  }
}

/*------------------------------------
    Secondary navigation
  ------------------------------------*/
.nav-secondary__list {
  margin: 0;
  padding: 0;
}
.nav-secondary__item {
  margin: 0;
  padding: 0;
  display: inline-block;
}
.nav-secondary__item::before {
  display: none;
}
.nav-secondary__link {
  text-decoration: none;
  font-size: 0.875rem;
  line-height: 1.286;
  font-weight: bold;
  color: #00598C;
  display: block;
  padding: 8px 16px;
  margin-left: 2px;
  border-radius: 2px;
}
.nav-secondary__link:hover {
  color: #FFFFFF;
  background-color: #0079BF;
}
.nav-secondary__link:active {
  color: #FFFFFF;
  background-color: #003B5C;
}
.nav-secondary__link:focus {
  outline: 1px dotted #0079BF;
}
.nav-secondary__link--active {
  color: #FFFFFF;
  background-color: #00598C;
}

/*------------------------------------
    Primary Main navigation
  ------------------------------------*/
.nav-primary {
  position: relative;
  border-top: 1px solid #CCCCCC;
  transition: right 0.5s ease;
  /* The main list of navigation links. */
  /* Child list ul(s) */
  /* Link styling
     TODO most of this could be moved to the a selector. Really only need this to target the has children class. */
  /* Hide child items with this class
     Class added vis JS */
  /* All primary nav links */
  /* Search Form */
  /* Search Mobile */
  /* Search Desktop */
}
@media (min-width: 1024px) {
  .nav-primary {
    float: left;
    left: 0%;
    border-top: none;
  }
}
.nav-primary__list {
  margin: 0;
  padding: 0;
  list-style: none;
  /* Make the navigation a flexbox above 1024px */
  /* Style li(s) */
}
.nav-primary__list li {
  list-style: none;
  background: #FFFFFF;
}
@media (min-width: 1024px) {
  .nav-primary__list li {
    background: none;
  }
}
.nav-primary__list li::before {
  content: "";
  margin: 0;
  padding: 0;
  display: none;
}
@media (min-width: 1024px) {
  .nav-primary__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}
.nav-primary__list li {
  margin: 0;
  min-width: 100%;
  border-bottom: 1px solid #CCCCCC;
  /* Style li(s) above 1024px */
  /* Style child links below 1024px */
}
@media (min-width: 1024px) {
  .nav-primary__list li {
    min-width: inherit;
    flex-basis: auto;
    align-self: flex-end;
    border: 1px solid none;
    border-bottom: 0;
  }
  .nav-primary__list li:hover {
    /* Keep top level item hover state when inside child elesearch-iconts */
    /* Show child links on hover of parents container */
  }
  .nav-primary__list li:hover > .nav-primary__link {
    background: #0079BF;
    color: #FFFFFF;
  }
  .nav-primary__list li:hover > .nav-primary__link::after {
    filter: brightness(0) invert(1);
  }
  .nav-primary__list li:hover > ul {
    display: block;
    margin-top: 0;
    z-index: 820;
  }
}
.nav-primary__list li > ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.nav-primary__list li > ul li {
  list-style: none;
}
.nav-primary__list li > ul li::before {
  content: "";
  margin: 0;
  padding: 0;
}
.nav-primary__list li > ul a {
  display: block;
  background-color: #E5E5E5;
  /* Unset child link styles above 1024px */
}
@media (min-width: 1024px) {
  .nav-primary__list li > ul a {
    background-color: #FFFFFF;
    padding-left: 1rem;
  }
}
.nav-primary__item a.nav-primary__link--current-page {
  border-left: 4px solid #FFD100;
  padding-left: 20px;
}
.nav-primary__item .nav-primary__sublist a.nav-primary__link--current-page {
  padding-left: 44px;
}
@media (min-width: 1024px) {
  .nav-primary__item {
    padding-right: 10px;
  }
  .nav-primary__item a.nav-primary__link--current-page {
    border-left: 0;
    position: relative;
  }
  .nav-primary__item a.nav-primary__link--current-page::before {
    content: "";
    display: block;
    width: calc(100% - 32px);
    height: 4px;
    position: absolute;
    background: #FFD100;
    top: 35px;
    left: 16px;
  }
  .nav-primary__item .nav-primary__sublist .nav-primary__item {
    padding-right: 0px;
  }
  .nav-primary__item .nav-primary__sublist .nav-primary__item a.nav-primary__link--current-page {
    border-left: 4px solid #FFD100;
    padding-left: 12px;
  }
  .nav-primary__item .nav-primary__sublist .nav-primary__item a.nav-primary__link--current-page::before {
    display: none;
  }
}
.nav-primary__toggle {
  background-color: #FFFFFF;
  border: 0;
  border-left: 1px solid #E5E5E5;
  width: 3.2em;
  margin-left: auto;
}
.nav-primary__toggle.is-open::after {
  transform: rotate(-90deg);
}
.nav-primary__toggle::after {
  transform: rotate(90deg);
}
.nav-primary__toggle:hover {
  background-color: #0079BF;
}
.nav-primary__toggle:hover::after {
  filter: brightness(0) invert(1);
}
.nav-primary__toggle:focus {
  outline-offset: -0.25rem;
  outline: 1px dotted #0079BF;
}
.nav-primary__toggle::after {
  content: "";
  display: block;
  width: 100%;
  height: 1em;
  background: url("/img/icons/arrow-right-defaultblue.svg") no-repeat center;
  background-size: 24px;
}
@media (min-width: 1024px) {
  .nav-primary__toggle {
    display: none;
  }
}
.nav-primary__sublist {
  width: 100%;
  /* TODO refactor this to .nav-primary__list li>ul li */
}
@media (min-width: 1024px) {
  .nav-primary__sublist {
    position: absolute;
    width: 20rem;
    top: 44px;
  }
}
.nav-primary__sublist--open {
  display: block;
}
@media (min-width: 1024px) {
  .nav-primary__sublist .nav-primary__item {
    border: 1px solid #E5E5E5;
    border-top: 0;
  }
  .nav-primary__sublist .nav-primary__item a {
    padding: 14px 16px;
  }
}
.nav-primary__sublist .nav-primary__item:first-child {
  border-top: 1px solid #CCCCCC;
}
@media (min-width: 1024px) {
  .nav-primary__sublist .nav-primary__item:first-child {
    border-top: 1px solid #E5E5E5;
  }
}
.nav-primary__sublist .nav-primary__item:last-child {
  border-bottom: 0;
}
@media (min-width: 1024px) {
  .nav-primary__sublist .nav-primary__item:last-child {
    border-bottom: 1px solid #E5E5E5;
  }
}
.nav-primary__sublist .nav-primary__link {
  padding: 14px 24px 14px 48px;
  background-color: #EBEBEB;
}
@media (min-width: 1024px) {
  .nav-primary__sublist .nav-primary__link {
    background-color: #FFFFFF;
  }
}
.nav-primary__link {
  display: block;
}
.nav-primary__link:hover {
  background: #0079BF;
  color: #FFFFFF;
}
.nav-primary__link:focus {
  outline-offset: -0.25rem;
  outline: 1px dotted #0079BF;
}
@media (min-width: 1024px) {
  .nav-primary__link:focus {
    outline-offset: -0.25rem;
  }
}
.nav-primary__link:active {
  background: #003B5C;
  color: #FFFFFF;
}
.nav-primary__link--has-children {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
}
.nav-primary__link--has-children > *:nth-child(1) {
  flex: 1;
}
@media (min-width: 1024px) {
  .nav-primary__link--has-children {
    display: inline-block;
    position: relative;
    padding-right: 2px;
  }
  .nav-primary__link--has-children .nav-primary__link:hover {
    border-bottom: 1px;
  }
  .nav-primary__link--has-children > a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
  }
  .nav-primary__link--has-children > a::after {
    content: "";
    display: block;
    height: 1em;
    width: 1em;
    background: url("/img/icons/arrow-right-defaultblue.svg") no-repeat center;
    background-size: 24px;
    margin-left: 6px;
    transform: rotate(90deg);
  }
}
.nav-primary__sublist--hidden {
  display: none;
}
.nav-primary a {
  color: #00598C;
  font-weight: bold;
  font-size: 1rem;
  line-height: 1.333rem;
  text-decoration: none;
  padding: 14px 24px;
}
@media (min-width: 1024px) {
  .nav-primary a {
    padding: 8px 16px 16px;
    font-size: 1.125rem;
  }
}
.nav-primary__search-mobile .nav-primary__search-form, .nav-primary__search-desktop .nav-primary__search-form {
  display: block;
  position: relative;
}
.nav-primary__search-mobile .nav-primary__search-form::before, .nav-primary__search-desktop .nav-primary__search-form::before {
  display: block;
  content: " ";
  width: 18px;
  height: 18px;
  position: absolute;
  background-image: url(/img/icons/search-grey60.svg);
  background-position: center;
  background-size: contain;
  margin: 12px;
  background-size: cover;
  z-index: 2;
}
.nav-primary__search-mobile .nav-primary__search-form label, .nav-primary__search-desktop .nav-primary__search-form label {
  width: 100%;
  display: block;
  position: inherit;
}
@media (min-width: 1024px) {
  .nav-primary__search-mobile .nav-primary__search-form label, .nav-primary__search-desktop .nav-primary__search-form label {
    display: inline-block;
    width: 91%;
    margin: 0;
    border: 1px solid #333;
  }
}
.nav-primary__search-mobile .nav-primary__search-form label input, .nav-primary__search-desktop .nav-primary__search-form label input {
  width: 100%;
  padding: 11px 12px 11px 38px;
  background: #EBEBEB;
  border: 0;
  -webkit-appearance: none;
}
.nav-primary__search-mobile .nav-primary__search-form label input::-webkit-search-cancel-button, .nav-primary__search-desktop .nav-primary__search-form label input::-webkit-search-cancel-button {
  background-image: url(/img/icons/clear-grey60.svg);
  background-size: 23px;
  -webkit-appearance: none;
  width: 23px;
  height: 23px;
}
.nav-primary__search-mobile .nav-primary__search-form label input:focus, .nav-primary__search-desktop .nav-primary__search-form label input:focus {
  outline-offset: -0.25rem;
  outline: 1px dotted #0079BF;
}
.nav-primary__search-mobile .nav-primary__search-form .nav-primary__search-submit, .nav-primary__search-desktop .nav-primary__search-form .nav-primary__search-submit {
  display: none;
}
@media (min-width: 1024px) {
  .nav-primary__search-mobile .nav-primary__search-form .nav-primary__search-submit, .nav-primary__search-desktop .nav-primary__search-form .nav-primary__search-submit {
    display: inline-block;
    width: 8%;
    padding: 12px !important;
    -webkit-appearance: none;
    background: #00598C;
    color: #FFFFFF;
    border: 0px;
    border-radius: 0 2px 2px 0;
    margin-left: -5px;
  }
}
@media (min-width: 1024px) {
  .nav-primary__search-mobile {
    display: none;
  }
}
.nav-primary__search-desktop {
  display: none;
}
@media (min-width: 1024px) {
  .nav-primary__search-desktop {
    display: inline-block;
    height: 44px;
    width: 56px;
    position: relative;
    top: -1px;
  }
}
.nav-primary__search-desktop .nav-primary__search-desktop-button {
  display: none;
}
.nav-primary__search-desktop .nav-primary__search-desktop-button:hover {
  background: #0079BF;
  cursor: pointer;
}
.nav-primary__search-desktop .nav-primary__search-desktop-button:hover svg {
  filter: brightness(0) invert(1);
}
@media (min-width: 1024px) {
  .nav-primary__search-desktop .nav-primary__search-desktop-button {
    display: block;
    height: 44px;
    width: 56px;
    background: #FFFFFF;
    -webkit-appearance: none;
    border: 0;
  }
  .nav-primary__search-desktop .nav-primary__search-desktop-button--is-active {
    background: #0079BF;
  }
  .nav-primary__search-desktop .nav-primary__search-desktop-button--is-active svg {
    filter: brightness(0) invert(1);
  }
}
@media (min-width: 1024px) {
  .nav-primary__search-desktop .nav-primary__search-block-form {
    display: none;
    background: #FFFFFF;
    padding: 17px 32px 15px 32px;
    border: 1px solid #CCCCCC;
  }
  .nav-primary__search-desktop .nav-primary__search-block-form--is-active {
    display: block;
    position: absolute;
  }
}
.nav-primary__search-desktop .nav-primary__search-desktop-button:focus {
  outline-offset: -0.25rem;
  outline: 1px dotted #0079BF;
}

/*------------------------------------
    Hamburger Navigation
  ------------------------------------*/
.hamburger {
  width: 40px;
  padding: 12px;
  border-radius: 2px;
  display: inline-block;
  cursor: pointer;
  transition-property: opacity, filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  color: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0;
  margin: 0;
  overflow: visible;
}
.hamburger:focus {
  outline-offset: -0.25rem;
  outline: 1px dotted #0079BF;
}
.hamburger:hover {
  opacity: 1;
  background: #2774AE;
}
.hamburger:hover .hamburger__inner {
  background-color: #FFFFFF;
}
.hamburger:hover .hamburger__inner::before {
  background-color: #FFFFFF;
}
.hamburger:hover .hamburger__inner::after {
  background-color: #FFFFFF;
}
.hamburger:active {
  background-color: #003B5C;
}
.hamburger__box {
  width: 16px;
  height: 12px;
  display: inline-block;
  position: relative;
}
.hamburger__inner {
  transition-duration: 0.075s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  transition-property: transform;
  width: 16px;
  height: 2px;
  background: #2774AE;
  border-radius: 0px;
  position: absolute;
  display: block;
  top: 50%;
  margin-top: -2px;
}
.hamburger__inner::before, .hamburger__inner::after {
  content: "";
  position: relative;
  display: block;
  width: 16px;
  height: 2px;
  background: #2774AE;
  border-radius: 0px;
}
.hamburger__inner::before {
  transition: top 0.075s 0.12s ease, opacity 0.075s ease;
  top: -5px;
}
.hamburger__inner::after {
  transition: bottom 0.075s 0.12s ease, transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19);
  bottom: -3px;
}
.hamburger--is-active .hamburger__inner {
  transform: rotate(45deg);
  transition-delay: 0.12s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
.hamburger--is-active .hamburger__inner::before {
  top: 0;
  opacity: 0;
  transition: top 0.075s ease, opacity 0.075s 0.12s ease;
}
.hamburger--is-active .hamburger__inner::after {
  bottom: 2px;
  transform: rotate(-90deg);
  transition: bottom 0.075s ease, transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.ucla a.tile__link:link {
  background-color: rgba(0, 89, 140, 0.85);
  text-decoration: none;
}
.ucla a.tile__link:hover, .ucla a.tile__link:focus {
  background-color: rgba(0, 121, 191, 0.85);
}
.ucla a.tile__link:active {
  background-color: rgba(0, 59, 92, 0.85);
}

.tile {
  display: flex;
  margin: 1% 0;
}
.tile__section {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
@media (min-width: 768px) {
  .tile__section {
    flex-direction: row;
    flex-wrap: wrap;
  }
}
@media (min-width: 768px) {
  .tile__section--col-1 {
    max-width: calc((276px + 18px) * 1);
  }
}
@media (min-width: 768px) {
  .tile__section--col-2 {
    max-width: calc((276px + 18px) * 2);
  }
}
@media (min-width: 768px) {
  .tile__section--col-3 {
    max-width: calc((276px + 18px) * 3);
  }
}
@media (min-width: 768px) {
  .tile__section--col-4 {
    max-width: calc((276px + 18px) * 4);
  }
}
.tile__section--centered {
  margin: 0 auto;
  justify-content: center;
}
@media (min-width: 768px) {
  .tile {
    margin: 1% calc(18px / 2);
  }
}
.tile * {
  color: #FFFFFF;
}
.tile__background {
  background: #00598C;
  width: 100%;
}
@media (min-width: 768px) {
  .tile__background {
    max-width: 276px;
  }
}
.tile__background--royce {
  background: #00598C url("../img/examples/tile-example-1.jpg") no-repeat center/cover;
}
.tile__background--students {
  background: #00598C url("../img/examples/tile-example-2.jpg") no-repeat center/cover;
}
.tile__background--events {
  background: #00598C url("../img/examples/tile-example-3.jpg") no-repeat center/cover;
}
.tile__link {
  display: block;
  height: calc(108px - 0 - 16px);
  overflow: hidden;
  padding: 0 32px 16px;
  width: 100%;
}
@media (min-width: 768px) {
  .tile__link {
    height: calc(188px - 32px - 64px);
    padding: 32px 32px 64px;
  }
}
.tile__link::before {
  background: #FFD100;
  content: "";
  display: block;
  height: 4px;
  margin: 16px 0 12px;
  width: 40px;
}
@media (min-width: 768px) {
  .tile__link::before {
    margin: 0 0 28px;
  }
}
.tile__title {
  line-height: 30px;
}