/* #region MATTHEW BASE STYLES */

.body--page,
.paragraph--section {
    overflow: normal;
    overflow: auto;
    position: relative;
}

.background-lightest-blue {
    padding-top: 2rem;
    padding-bottom: 3rem;
    background-color: var(--lightest-blue);
}

.background-be-well-bruin-blue {
    padding-top: 2rem;
    padding-bottom: 2rem;
    background: #005587;
}

.background-ucla-blue {
    padding-top: 2rem;
    padding-bottom: 2rem;
    background: var(--ucla-blue);
}

.background-gray {
    padding-top: 2rem;
    padding-bottom: 2rem;
    background-color: #f5f4f2;
}

.light-font,
.light-font .lead,
.light-font h1,
.light-font h2,
.light-font h3,
.light-font h4,
.light-font h5,
.light-font h6 {
    color: #fff;
}
.lead {
    font-size: 1.8rem;
}
.light-font p.button a {
    background-color: var(--ucla-gold);
    border-color: var(--ucla-gold);
    border-radius: calc(1rem * var(--default-line-height));
    color: #000;
}
.light-font p.button a:hover {
    border-color: hsla(49, 100%, 75%);
    background-color: hsla(49, 100%, 75%);
}

@media (max-width: 767px) {
    h1 {
        padding-top: 2rem;
        padding-bottom: 0;
    }

    .hero-header {
        text-align: center;
        padding-bottom: 0;
        z-index: 0;
    }
    .hero-header .container {
        overflow: hidden;
    }
    .hero-header .container img {
        min-width: 180%;
        transform: translate(-22.5%, 0.5rem);
    }
    .section-healthy-community {
        overflow: inherit;
    }
}
@media (min-width: 768px) {
    .page-style-deemphasize-page-title h1 {
        font-size: 36px;
        line-height: 40.5px;
    }

    .body--page.hero-header {
        padding-top: 0;
        padding-bottom: 0;
        overflow: hidden;
        font-size: 1.4rem;
        line-height: 1.3;
    }

    .body--page.hero-header .container {
        display: grid;
        grid-template-columns: 30ch 1fr;
        grid-auto-flow: row;
        position: relative;
        grid-template-rows: 40% repeat(auto, 1fr);
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .body--page.hero-header .container > * {
        grid-column: 1/2;
        padding: 0;
        margin: 0 0 1rem 0;
        z-index: 1;
    }

    .body--page.hero-header .container > *:first-child {
      padding-top: 8rem;
      /* align-content: end; */
    }

    .body--page.hero-header .container img {
        transform: translate(-10%, 2rem);
        grid-column: 2/3;
        grid-row: 1 / span 100;
        margin: 0;
        margin-top: -2rem;
        padding: 0;
        min-width: 160%;
        z-index: 0;
        align-self: end;
    }

    .hero-header {
        padding-top: 0;
        padding-bottom: 0;
        overflow: hidden;
        font-size: 1.4rem;
        line-height: 1.3;
    }

    .hero-header .container {
        display: grid;
        grid-template-columns: 1fr 30ch;
        grid-auto-flow: row;
        position: relative;
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .hero-header .container > * {
        grid-column: 2/3;
        padding: 0;
        margin: 0 0 1rem 0;
        z-index: 1;
    }

    .hero-header .container > *:first-child {
        padding-top: 8rem;
    }

    .hero-header .container img {
        transform: translate(-30%, 2rem);
        grid-column: 1/2;
        grid-row: 1/10;
        margin: 0;
        margin-top: -2rem;
        padding: 0;
        min-width: 140%;
        z-index: 0;
        align-self: end;
    }
}

.people-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 300px));
    gap: 2rem;
    width: 100%;
}

.people-list header {
    grid-row: 1 / 2;
    grid-column: 1/ -1;
}

.people-list div > *:first-child {
    width: 100%;
    height: 100%;
}

.person-card {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: #000;
}

.person-card .title {
    font-weight: bold;
    padding: 0.5rem 1rem 0 1rem;
}

.person-card .job-title {
    color: #666;
    padding: 0 1rem 0.5rem 1rem;
}

.person-card:visited {
    color: #000;
}

.person-card:hover .job-title {
    color: #fff;
}

dd a {
    display: block;
}

dd a + a {
    clear: both;
}

ol,
ul {
    list-style: revert;
}

@media (min-width: 768px) {
    .cards-container {
        grid-template-columns: repeat(3, 1fr);
        gap: 1.5rem;
    }
}

@media (max-width: 767px) {
    .cards-container {
        grid-template-columns: repeat(2, 1fr);
    }

    .card-summary .summary {
        display: none;
    }
}

.cards-theme-services .card img,
.cards-theme-services .card {
    border-radius: 0.7rem;
    background-color: #fff;
}

.cards-theme-services .card-title {
    text-align: center;
}

.cards-theme-services .card:hover {
    background-color: #fff;
}

.link-call-to-action {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: end;
}
.link-call-to-action a,
.link-call-to-action button {
    display: flex;
    flex-direction: row;
    gap: 1rem;
    color: #333;
    font-weight: bold;
    text-decoration: none;
    padding: 0.4rem 0 0 0;
    margin: 0;
    line-height: 2rem;
    padding-left: 1rem;
    border-radius: 1.2rem;
}
.link-call-to-action a::after,
.link-call-to-action button::after {
    display: inline-block;
    content: '';
    overflow: hidden;
    background-color: var(--ucla-gold);
    color: #000;
    text-indent: -1000px;
    text-align: left;
    height: 2.4rem;
    width: 2.4rem;
    margin-top: -0.4rem;
    border-radius: 1.2rem;
    background-image: url(../img/arrow-forward.svg);
    background-size: 60%;
    background-position: center center;
    background-repeat: no-repeat;
}
.paragraph-section {
    margin-bottom: 0;
}
.paragraph--type--buttons .cards-container {
    grid-template-columns: repeat(2, 1fr);
    margin-bottom: 2rem;
}
@media (min-width: 768px) {
    .paragraph--type--buttons .cards-container {
        grid-template-columns: repeat(4, 1fr);
    }
}
.cards-theme-buttons .card {
    border: 8px solid #ddebfc;
    padding-bottom: 2px;
}

.js .hcollapse-loaded .hsummary {
    display: grid;
    grid-template-columns: 3.2rem 1fr;
    grid-gap: 0;
    cursor: pointer;
    padding: 0;
}
.section-collapsing-faqs .link-call-to-action {
    margin-top: 2rem;
}
.js .background-gray .hcollapse {
    border-color: #94b8e4;
}
.hsummary .hsummary-button {
    grid-row: 1/2;
    grid-column: 1/2;
    margin-top: 0.8rem;
}
.hsummary h3 {
    grid-row: 1/2;
    grid-column: 2/3;
}
.hcollapse-closed h3 {
    font-weight: 600;
}
.js .hcollapse .hdetails[aria-expanded='true'] {
    display: block;
    padding-left: 3.2rem;
}
.hcollapse:hover,
.hcollapse-open,
.hsummary:hover,
.hsummary:focus,
.hsummary-active {
    background-color: #daebfe !important;
    color: #333 !important;
}

.js .hsummary:hover h2,
.js .hsummary:hover h3,
.js .hsummary:focus h2,
.js .hsummary:focus h3,
.js .hcollapse .hsummary-active h2,
.js .hcollapse .hsummary-active h3,
.js .hsummary-active h2,
.js .hsummary-active h3 {
    color: #333;
}
.ucla-button-toggle:hover,
.hsummary:hover .ucla-button-toggle,
.hsummary:focus .ucla-button-toggle,
.hsummary-active .ucla-button-toggle,
.hcollapse-open .hsummary .ucla-button-toggle:hover,
.hcollapse-open .hsummary:hover .ucla-button-toggle,
.hcollapse-open .hsummary:focus .ucla-button-toggle,
.hcollapse-open .hsummary-active .ucla-button-toggle {
    background-color: transparent;
}

.js .hcollapse .hsummary h2,
.js .hcollapse .hsummary h3 {
    color: #333;
}
.ucla-button-toggle {
    background-color: transparent;
    background-size: 1.2rem auto;
    background-image: url(/static/faq-plus.svg) !important;
}
.hcollapse-open .hsummary .ucla-button-toggle {
    background-size: 1.2rem auto;
    background-image: url(/static/faq-minus.svg) !important;
}

/* #endregion */

/* #region DANNY BASE STYLES */

/*
 * Main breakpoints used throughout are:
 *
 * - 575px
 * - 768px
 * - 1024px
 */

/* #region ALL PAGES */

/* Globalish */
@font-face {
    font-family: 'Karbon';
    font-weight: normal;
    font-style: normal;
    src: url('/static/fonts/Karbon-Regular.otf');
}
@font-face {
    font-family: 'Karbon';
    font-weight: bold;
    font-style: normal;
    src: url('/static/fonts/Karbon-Medium.otf');
}
body {
    font-family: 'Karbon', Helvetica, Arial, sans-serif !important;
    overflow-x: hidden;
}
body p {
    font-size: 17px;
}
a,
a:active,
a:visited {
    color: #005587;
}
.topbar-user-links a,
.topbar-user-links a:active,
.topbar-user-links a:visited {
    color: #fff;
}

/* Container */
.container {
    padding-left: 1rem;
    padding-right: 1rem;
}

/* Page headers */
h1 {
    padding-top: 1.5rem;
}
h1 ~ p.lead {
    margin-top: 0.5rem;
    font-size: 28px;
}
h1 ~ p.lead ~ p {
    font-size: 20px;
    margin-top: 2rem;
    --x-padding: 3rem;
    padding-left: var(--x-padding);
    padding-right: var(--x-padding);
}

/* Paragraph sections */
.paragraph--section {
    padding-top: 4rem;
}
.paragraph--section:not(:last-child) {
    padding-bottom: 4rem;
    margin-bottom: 0;
}
.paragraph--section h2 {
    margin-bottom: 2rem;
}
.paragraph--section .summary {
    margin-top: 0;
    margin-bottom: 3rem;
}

/* Call to actions */
.link-call-to-action a {
    color: #333;
}
.link-call-to-action a:hover {
    color: #333;
    background: var(--lightest-blue);
}

/* Browse resource cards w/ pictures */
.cards-with-images .card-title {
    font-size: 20px;
}

/* Scrolling resource cards */
.resource-cards .container {
    padding-left: 0;
    padding-right: 0;
}
.resource-cards .container > *:not([data-entity-bundle='resource_cards']) {
    padding-left: 1rem;
    padding-right: 1rem;
}
.resource-cards h2 {
    margin-bottom: 0.5rem;
}
.resource-cards .summary {
    margin-bottom: 1rem;
}
.resource-cards [data-entity-bundle='resource_cards'] {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding-left: 1rem;
    gap: 1rem;
}
[data-entity-bundle='resource_cards'] .resource-card {
    min-width: 42.5%;
    scroll-snap-align: start;
    border: none;
}
[data-entity-bundle='resource_cards'] .resource-card:first-child {
    margin-left: 1rem;
}
[data-entity-bundle='resource_cards'] .resource-card:last-child {
    margin-right: 1rem;
}
[data-entity-bundle='resource_cards'] .resource-card-title {
    color: #333;
}
[data-entity-bundle='resource_cards'] .resource-card:hover {
    background-color: var(--lightest-blue);
}
[data-entity-bundle='resource_cards']
    .resource-card:hover
    .resource-card-category,
[data-entity-bundle='resource_cards']
    .resource-card:hover
    .resource-card-title {
    color: #333;
}
[data-entity-bundle='resource_cards'] .resource-card-category {
    font-size: 11px;
}
[data-entity-bundle='resource_cards'] .resource-card-title {
    font-weight: bold;
    font-size: 17px;
    line-height: 1.25;
}
@media (min-width: 575px) {
    /* Common styles */
    .paragraph--section {
        padding-top: 3rem;
    }
    .paragraph--section h2 {
        font-size: 28px;
    }
    .paragraph--section .summary {
        font-size: 24px;
    }
    .paragraph--section:not(:last-child) {
        padding-bottom: 3rem;
        margin-bottom: 0;
    }
    .paragraph--section h2 {
        margin-bottom: 1.5rem;
    }
    .paragraph--section .summary {
        margin-top: 0;
        margin-bottom: 1rem;
    }

    /* Browse resource cards w/ pictures */
    .cards-with-images .card-title {
        font-size: 24px;
        line-height: 1;
        padding-bottom: 1rem;
    }
    .cards-with-images .summary {
        line-height: 1.25;
        margin-bottom: 1rem;
        font-size: 17px;
    }

    /* Scrolling resource cards */
    .resource-cards [data-entity-bundle='resource_cards'] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        margin-left: 1rem;
        margin-right: 1rem;
        width: unset;
    }
    [data-entity-bundle='resource_cards'] .resource-card:first-child {
        margin-left: unset;
    }
    [data-entity-bundle='resource_cards'] .resource-card:last-child {
        margin-right: unset;
    }

    [data-entity-bundle='resource_cards'] .resource-card-category {
        font-size: 18px;
    }
    [data-entity-bundle='resource_cards'] .resource-card-title {
        font-size: 26px;
        line-height: 1.5;
    }
}
@media (min-width: 768px) {
    .resource-cards [data-entity-bundle='resource_cards'] {
        gap: 1.5rem;
        grid-template-columns: repeat(3, 1fr);
    }
}

/* FAQs (i.e. collapsed headings) */
.hcollapse.H3collapse {
    margin-left: -1rem;
    margin-right: -1rem;
    padding-left: 1rem;
    padding-right: 1rem;
}
.hcollapse.H3collapse {
    border: none;
}
.hcollapse.H3collapse .hsummary {
    grid-template-columns: 40px 1fr;
}
.hcollapse.H3collapse ~ .hcollapse.H3collapse .hsummary {
    border-top: 1px solid #ddebfc;
}
.hcollapse.H3collapse h3,
.hcollapse.H3collapse h4 {
    font-weight: normal;
    font-size: 17px;
}
.hcollapse.H3collapse.hcollapse-open h3,
.hcollapse.H3collapse.hcollapse-open h4 {
    font-weight: bold;
    /* font-size: 28px; */
}
.hcollapse.H3collapse .ucla-button-toggle {
    transform: scale(0.8) translateY(4px);
}
.hcollapse.H3collapse .hdetails[aria-expanded='true'] {
    padding-left: 40px;
    padding-bottom: 1rem;
}
.hcollapse.H3collapse .hdetails[aria-expanded='true'] p:first-of-type {
    margin-top: 0;
}
.hcollapse.H3collapse .hdetails[aria-expanded='true'] p:last-of-type {
    margin-bottom: 0;
}
.hcollapse ~ .link-call-to-action {
    margin-top: 1rem;
    margin-right: 0.5rem;
    margin-bottom: 1rem;
}

/* Resource tags */
.resource-tags {
    grid-area: tags;
    display: flex;
    gap: 0.25rem;
    flex-wrap: wrap;
}

/* Resource teaser */
.resource-teaser {
    grid-template-columns: 1fr;
    grid-template-rows: unset;
    grid-template-areas:
        'image'
        'category'
        'title'
        'summary'
        'tags'
        'button';
    row-gap: unset;
}
.resource-teaser .resource-image {
    grid-area: image;
}
.resource-teaser header {
    display: contents;
}
.resource-teaser .resource-category {
    grid-area: category;
}
.resource-teaser h2 {
    grid-area: title;
}
.resource-teaser .summary {
    grid-area: summary;
}
.resource-teaser .resource-tags {
    grid-area: tags;
}
.resource-teaser .resource-links {
    grid-area: button;
}
@media (min-width: 575px) {
    .resource-teaser {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: repeat(4, auto) 1fr;
        grid-template-areas:
            'image  category'
            'image  title'
            'image  summary'
            'image  tags'
            'image  button';
    }
    .resource-teaser .resource-image {
        margin-bottom: 0;
        line-height: 0;
    }
    .resource-teaser .resource-category {
        align-self: start;
    }
    .resource-teaser .resource-category a {
        font-size: 16px;
    }
    .resource-teaser h2 {
        font-size: 28px;
        align-self: start;
    }
    .resource-teaser .summary {
        font-size: 18px;
        align-self: start;
    }
    .resource-teaser .resource-tags {
        align-self: start;
    }
    .resource-teaser .resource-links {
        margin-top: 0;
        align-self: end;
    }
}
@media (min-width: 768px) {
    .resource-teaser {
        grid-template-columns: 2fr 3fr;
    }
}
/* #endregion */

/* #region SITE HEADER/FOOTER */
/* ! Uncomment to debug header */
/* [data-ucla-origin^="http://localhost"] #block-ucla-campus-local-tasks {
  display: none;
} */
.topbar,
.global-footer {
    display: none;
}
.navbar-wrapper {
    border-bottom: none;
}
.navbar-wrapper .navbar-grid {
    grid-template-areas: unset;
    grid-template-columns: auto;
    grid-template-rows: auto;
    padding-left: 0;
    padding-right: 0;
}
.navbar-grid [role='heading'] {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
    text-align: center;
    margin: 0.125rem;
}
.navbar-grid img {
    padding-top: 1rem;
    width: 160px;
    padding-bottom: 0.33rem;
}
.navbar-grid button[aria-controls='menus'] {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
    padding-top: 10px;
    margin: 0;
    padding: 0;
    margin-right: 0.25rem;
}
.navbar-grid button[aria-controls='menus']:hover {
    background: var(--lightest-blue);
}
.navbar-grid button[aria-controls='menus'] .menu-icon {
    background: #333;
}
.navbar-grid button[aria-controls='menus'] .menu-icon::after {
    background: #333;
}
.navbar-grid button[aria-controls='menus'] .menu-icon::before {
    background: #333;
}
.navbar-grid .navbar-position {
    grid-column: 1 / 2;
    grid-row: 2 / 3;
    margin-left: 0;
    margin-right: 0;
}
.navbar-grid .site-search.mobile-only {
    display: none;
}
.navbar-grid ul {
    margin-top: 2.5rem;
    margin-bottom: 2.5rem;
}
.navbar-grid ul li {
    border: none;
    font-size: 19px;
}
.navbar-grid ul li a:hover {
    background: var(--lightest-blue);
    color: #333;
}
.navbar-grid ul li a {
    font-size: 19px;
    color: #333;
    display: inline-block;
    border-radius: 2rem;
    padding-bottom: 0.5rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    padding-top: 0.7rem;
    /* margin: -0.5rem; */
    margin-left: 2rem;
    margin-bottom: 1rem;
}
.navbar-grid ul li:last-child a {
    background: #ffd100;
    border-radius: 2rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}
.navbar-grid ul li:last-child a:hover {
    background: rgba(255, 208, 0, 0.5);
    /* border: 2px solid #FFD100;
  padding-left: calc(1.5rem - 2px);
  padding-right: calc(1.5rem - 2px);
  padding-bottom: calc(0.5rem - 2px);
  padding-top: calc(0.7rem - 2px); */
}

@media (min-width: 768px) {
    .navbar-wrapper .navbar-grid [aria-controls='desktop-search'],
    .navbar-wrapper .navtop {
        display: none;
    }
    .navbar-wrapper .navbar-grid {
        grid-template-areas:
            'logo'
            'navigation';
        margin-bottom: 1.5rem;
        gap: 1rem;
    }
    .navbar-wrapper .navbar-grid span[role='heading'] {
        grid-area: logo;
        margin: 0;
        display: block;
        line-height: 0;
        margin-left: auto;
        margin-right: auto;
        padding-top: 1rem;
        gap: 1.5rem;
    }
    .navbar-wrapper .navbar-grid span[role='heading'] a {
        display: inline-block;
        line-height: 0;
    }
    .navbar-wrapper .navbar-grid span[role='heading'] a:hover {
        background: var(--lightest-blue);
    }
    .navbar-wrapper .navbar-grid span[role='heading'] img {
        max-width: unset;
        padding-top: 0;
        width: 247px;
        padding-bottom: 0;
        padding: 0.5rem;
        padding-left: 0;
    }
    .navbar-wrapper .navbar-grid .navbar-position {
        grid-area: navigation;
        margin: 0 auto;
    }
    .navbar-wrapper .navbar-grid .navbar-position ul {
        margin-top: 0;
        margin-bottom: 0;
        gap: 0.5rem;
        align-items: center;
    }
    .navbar-wrapper .navbar-grid .navbar-position ul > li a {
        margin: 0;
        font-weight: normal;
        /* font-size: 15px; */
    }
    .navbar-grid ul li:last-child {
        margin-left: 0.75rem;
    }
}
@media (min-width: 1024px) {
    .navbar-wrapper .navbar-grid {
        grid-template-areas: 'logo navigation';
        margin-top: 1.5rem;
        margin-bottom: 1.5rem;
        padding-left: 1rem;
        padding-right: 1rem;
        justify-content: space-between;
    }
    .navbar-wrapper .navbar-grid span[role='heading'] {
        padding-top: 0;
    }
    .navbar-wrapper .navbar-grid .navbar-position {
        justify-self: end;
        align-items: center;
    }
}
/* #endregion */

/* #region SITE FOOTER */

#main footer {
    background: #f8f8f8;
    display: grid;
    grid-template-areas:
        'logo address'
        'about contact';
    grid-template-columns: 1fr 1fr;
    padding-top: 2rem;
    padding-left: 1rem;
    padding-right: 1rem;
    padding-bottom: 2rem;
    gap: 1rem;
}
#main footer a {
    color: #333;
}
#main footer .footer-content {
    display: contents;
}

/* Logo */
#main footer .footer-logo {
    grid-area: logo;
    padding: 0;
    line-height: 0;
}
#main footer .footer-logo a.site-name {
    margin-left: 0;
    margin-right: 0;
    transform: unset;
    display: inline-block;
    line-height: 0;
}
#main footer .footer-logo a.site-name:hover {
    background: #ffe500;
}
#main footer .footer-logo img {
    width: 200px;
    margin: 0;
    padding: 0;
}

/* Address */
#main footer .footer-address {
    grid-area: address;
}

/* About */
#main footer .footer-about {
    grid-area: about;
    margin: 0;
}
#main footer .footer-about a {
    font-size: 20px;
}

/* Contact */
#main footer .footer-contact {
    grid-area: contact;
    margin: 0;
}
#main footer .footer-contact a {
    font-size: 20px;
}

@media (min-width: 768px) {
    #main footer {
        grid-template-areas:
            'logo logo'
            'address about'
            'address contact';
        gap: 0;
        padding-top: 2rem;
        padding-left: calc((100% - 768px) / 2 + 1rem);
        padding-right: calc((100% - 768px) / 2 + 1rem);
    }
    #main footer .footer-logo {
        margin-top: 0;
    }
    #main footer .footer-address {
        margin-top: 1rem;
    }
}
@media (min-width: 1024px) {
    #main footer {
        padding-left: calc((100% - 1024px) / 2 + 1rem);
        padding-right: calc((100% - 1024px) / 2 + 1rem);
    }
}
@media (min-width: 1440px) {
    #main footer {
        padding-left: calc((100% - 1170px) / 2 + 1rem);
        padding-right: calc((100% - 1170px) / 2 + 1rem);
    }
}
/* #endregion */

/* #region HOME PAGE */

/* Fix spacing on sections with large graphics */
[data-ucla-path='/'] .hero-header .container,
[data-ucla-path='/'] h1 ~ p.lead ~ p ~ p.button a {
    padding-bottom: 0;
}

/* Yellow buttons wider with font fix */
[data-ucla-path='/'] h1 ~ p.lead ~ p ~ p.button a,
[data-ucla-path='/'] .paragraph--section p.button a[href='/guide'] {
    min-width: 170px;
    font-size: 17px;
    padding-bottom: 6px;
    text-align: center;
    font-weight: bold;
}

/* Be well bruin guide */
[data-ucla-path^='/'] .paragraph--section.background-be-well-bruin-blue {
    padding-bottom: 0;
}

/* Healthy community spacing */
[data-ucla-path='/'] .paragraph--section.section-healthy-community {
    padding-top: 8rem;
    padding-bottom: 4rem;
}

@media (min-width: 768px) {
    /* Header */
    [data-ucla-path='/'] .page-content .body--page .container {
        grid-template-columns: 1fr;
        grid-template-areas:
            'header'
            'lead'
            'paragraph'
            'button'
            'image';
        /* padding: 0; */
    }
    [data-ucla-path='/'] .page-content .body--page .container h1 {
        grid-area: header;
        text-align: center;
        font-size: 36px;
        padding-top: 4rem;
        margin-bottom: 0;
    }
    [data-ucla-path='/'] .page-content .body--page .container p.lead {
        grid-area: lead;
        text-align: center;
        margin-bottom: 3rem;
    }
    [data-ucla-path='/']
        .page-content
        .body--page
        .container
        p:not(.lead):not(.button) {
        grid-area: paragraph;
        text-align: center;
        font-size: 24px;
        margin-bottom: 3rem;
    }
    [data-ucla-path='/'] .page-content .body--page .container p.button {
        grid-area: button;
        text-align: center;
    }
    [data-ucla-path='/'] .page-content .body--page .container img {
        grid-area: image;
        transform: unset;
        margin-top: unset;
        min-width: 120%;
        position: relative;
        left: -8%;
    }

    /* Health campus university */
    [data-ucla-path='/'] .page-content .section-healthy-community {
        padding: 1.5rem;
    }
    [data-ucla-path='/'] .page-content .section-healthy-community .container {
        padding: 0;
        padding-top: 2rem;
        padding-right: 20rem;
        padding-bottom: 4rem;
        padding-left: 1rem;
    }
    [data-ucla-path='/'] .page-content .section-healthy-community h2 {
        font-size: 28px;
        margin-bottom: 1.5rem;
    }

    /* Be Well Bruin guide */
    [data-ucla-path^='/'] .paragraph--section.background-be-well-bruin-blue {
        padding-top: 0;
    }
    [data-ucla-path^='/']
        .paragraph--section.background-be-well-bruin-blue
        .container {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-areas:
            'header'
            'paragraph'
            'button'
            'image';
        padding-bottom: 0;
    }
    [data-ucla-path^='/']
        .paragraph--section.background-be-well-bruin-blue
        .container
        h2 {
        grid-area: header;
        text-align: center;
        padding-top: 2rem;
        margin-bottom: 1.5rem;
    }
    [data-ucla-path^='/']
        .paragraph--section.background-be-well-bruin-blue
        .container
        p:not(.button) {
        grid-area: paragraph;
        text-align: center;
        font-size: 24px;
        width: 60%;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 2.5rem;
    }
    [data-ucla-path^='/']
        .paragraph--section.background-be-well-bruin-blue
        .container
        p.button {
        grid-area: button;
        text-align: center;
    }
    [data-ucla-path^='/']
        .paragraph--section.background-be-well-bruin-blue
        .container
        img {
        grid-area: image;
        transform: unset;
        margin-top: unset;
        min-width: unset;
    }
}

@media (min-width: 1024px) {
    /* First banner with graphics */
    [data-ucla-path='/'] .page-content .body--page {
        padding-left: 1rem;
        padding-right: 1rem;
    }
    [data-ucla-path='/'] .page-content .body--page .container {
        grid-template-areas:
            'header    image'
            'lead      image'
            'paragraph image'
            'button    image';
        grid-template-columns: 2fr 3fr;
        grid-template-rows: auto auto auto 1fr;
        text-align: left;
    }
    [data-ucla-path='/'] .page-content .body--page .container h1 {
        text-align: left;
        font-size: 48px;
        padding-top: 6rem;
    }
    [data-ucla-path='/'] .page-content .body--page .container p.lead {
        text-align: left;
        font-size: 38px;
        margin-top: 0.5rem;
        margin-bottom: 1.5rem;
    }
    [data-ucla-path='/']
        .page-content
        .body--page
        .container
        p:not(.lead):not(.button) {
        text-align: left;
        font-size: 28px;
        line-height: 1.5;
        margin-bottom: 2rem;
    }
    [data-ucla-path='/'] .page-content .body--page .container p.button {
        text-align: left;
        font-size: 24px;
    }
    [data-ucla-path='/'] .page-content .body--page .container img {
        transform: unset;
        min-width: unset;
        position: unset;
        padding-top: 6rem;
        transform: scale(1.3) translateX(8rem);
        transform-origin: bottom right;
    }
    /* Second banner with graphics */
    [data-ucla-path^='/']
        .paragraph--section.background-be-well-bruin-blue
        .container {
        display: grid;
        grid-template-areas:
            'image header'
            'image paragraph'
            'image button';
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto 1fr;
        padding-top: 0;
    }
    [data-ucla-path^='/']
        .paragraph--section.background-be-well-bruin-blue
        .container
        h2 {
        font-size: 48px;
        padding-top: 6rem;
        margin-bottom: 1.5rem;
        text-align: left;
    }
    [data-ucla-path^='/']
        .paragraph--section.background-be-well-bruin-blue
        .container
        p:not(.button) {
        font-size: 28px;
        text-align: left;
        line-height: 1.5;
        margin-bottom: 2rem;
        width: unset;
    }
    [data-ucla-path^='/']
        .paragraph--section.background-be-well-bruin-blue
        .container
        p.button {
        text-align: left;
        padding-bottom: 4rem;
    }
    [data-ucla-path^='/']
        .paragraph--section.background-be-well-bruin-blue
        .container
        img {
        align-self: end;
        transform: scale(1.45) translateX(-10rem);
        transform-origin: bottom left;
    }
}

@media (min-width: 1440px) {
    /* [data-ucla-path="/"] .page-content .body--page .container img {

  } */
    [data-ucla-path^='/']
        .paragraph--section.background-be-well-bruin-blue
        .container
        h2 {
        padding-top: 8rem;
    }
    [data-ucla-path^='/']
        .paragraph--section.background-be-well-bruin-blue
        .container
        img {
        transform: scale(1.25) translateX(-8rem);
    }
}

/* #endregion HOME PAGE */

/* #region ASSESSMENT (FROM DANNY) */
[data-ucla-path='/guide'] .guide-question {
    padding-top: 1rem;
    padding-bottom: 2rem;
}
[data-ucla-path='/guide'] #debugContainer {
    display: flex;
    justify-content: center;
    position: sticky;
    bottom: 1rem;
    border: 2px dashed rgb(255, 127, 127);
    margin-left: 0 auto;
    margin-left: 1rem;
    width: calc(100% - 2rem);
    flex-wrap: wrap;
}
[data-ucla-path='/guide'] #debugContainer pre {
    background: rgb(255, 240, 240);
    margin-bottom: 0;
    white-space: nowrap;
    flex: 1;
}
[data-ucla-path='/guide'] #debugResourceSelection a:hover {
    background: unset;
    color: #333;
    text-decoration: underline;
}
[data-ucla-path='/guide'] small {
    font-size: 70%;
    color: #999;
}

/* Resource list */
[data-ucla-path='/guide'] .views-row {
    margin-top: 3rem;
    padding-bottom: 2rem;
}
@media (min-width: 575px) {
    /* Resource list */
    [data-ucla-path='/guide'] .views-row:not(:last-child) {
        border-bottom: 1px solid #bfbfbf;
    }
}

/* #endregion */

/* #region ASSESSMENT (FROM MATTHEW) */
.guide-question {
    background-color: #ddebfc;
    margin-bottom: 1rem;
}
.question-options {
    display: flex;
    flex-direction: row;
    gap: 1rem;
    margin: 0 auto;
}
.guide-question-option {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
}
.guide-question-option button {
    background: #fff;
    font-size: 1.2rem;
    padding: 0.5rem 1rem;
    border: 3px solid #ddebfc;
    border-radius: 0.3rem;
}
.guide-question-option button[aria-pressed='true'] {
    border: 3px solid #ffd100;
    background-color: #ffd100;
}
.guide--dialog {
    border: 0;
    width: 100vw;
    margin: 0;
    padding: 0;
    height: 100vh;
    max-width: 100vw;
    max-height: 100vw;
    min-height: 100vh;
    background-color: #ddebfc;
    padding: 1.5rem;
}
button {
    border: 0;
    background-color: transparent;
    font-size: 1.2rem;
}
.guide--dialog--header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.guide--dialog--footer,
#main .guide--dialog--footer {
    display: block;
    background-color: transparent;
    text-align: right;
}
.guide-question h2 {
    text-align: center;
    font-size: 28px;
    font-weight: normal;
}
.question-options {
    justify-content: center;
}
.guide-question-option button {
    background-color: #fff;
}
.guide-question--options-are-tiny .question-options {
    margin: 0 auto;
    width: auto;
    justify-content: center;
}
.guide-question--options-are-tiny button {
    width: 5rem;
    height: 5rem;
    border-radius: 50%;
}
.guide-question--options-are-medium .question-options {
    flex-direction: column;
    max-width: 50ch;
    text-align: left;
}
.guide-question--options-are-medium .question-options button {
    text-align: left;
}
.guide-question--options-are-categories .question-options {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
}
.guide-question--options-are-categories button {
    background-size: 150% auto;
    padding-top: 100%;
    background-repeat: no-repeat;
    background-position: center top;
    /* text-wrap: nowrap; */
}
.guide-question--options-are-categories [data-option='Academic'] button {
    background-image: url('/sites/default/files/styles/resize_3_2/public/2022-12/tag-academic-3x2.png');
}
.guide-question--options-are-categories [data-option='Basic Needs'] button {
    background-image: url('/sites/default/files/styles/resize_3_2/public/2022-12/tag-basic-needs-3x2.png');
}
.guide-question--options-are-categories [data-option='Emotional'] button {
    background-image: url('/sites/default/files/styles/resize_3_2/public/2022-12/tag-emotional-3x2.png');
}
.guide-question--options-are-categories [data-option='Financial'] button {
    background-image: url('/sites/default/files/styles/resize_3_2/public/2022-12/tag-financial-3x2.png');
}
.guide-question--options-are-categories [data-option='Physical'] button {
    background-image: url('/sites/default/files/styles/resize_3_2/public/2022-12/tag-physical-3x2.png');
}
.guide-question--options-are-categories [data-option='Social'] button {
    background-image: url('/sites/default/files/styles/resize_3_2/public/2022-12/tag-social-3x2.png');
}
.guide-activate-button {
    background-color: var(--ucla-gold);
    border-color: var(--ucla-gold);
    border-radius: calc(1rem * var(--default-line-height));
    color: #000;
    font-weight: normal;
    min-width: 170px;
    font-size: 17px;
    padding: 0.5rem 1rem;
    padding-bottom: 6px;
    text-align: center;
}
@media (max-width: 1024px) {
    .guide-question--options-are-categories .question-options {
        max-width: 600px;
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (max-width: 574px) {
    .guide--question--logolink {
        max-width: 200px;
    }
    .guide-question--options-are-categories .question-options {
        max-width: auto;
        grid-template-columns: repeat(2, 1fr);
    }
    .guide-question--options-are-tiny .question-options {
        flex-direction: column;
        align-items: center;
    }
}
/* #endregion */

/* #region RESOURCES */

[data-ucla-path^='/resources/'] .page-content header h1 {
    margin-bottom: 0.5rem;
}

/* Fix extra H1 (likely coming from page template... permanent fix should be done there */
[data-ucla-path='/resources/search'] .page-content header h1:not(:first-child) {
    display: none;
}

/* Header */
[data-ucla-path='/resources'] #search-resources-input {
    font-size: 20px;
    border: 0;
    border-radius: 0.33rem;
    background-image: unset;
    padding: 0.75rem;
    padding-top: calc(0.75rem + 1px);
    padding-left: 1rem;
}
[data-ucla-path='/resources'] .hero-header h1 {
    margin-top: 1.5rem;
    font-size: 32px;
    margin-bottom: 0.75rem;
}
[data-ucla-path='/resources'] .hero-header .lead {
    margin-bottom: 3rem;
}

/* Browse by Tag buttons */
[data-ucla-path='/resources'] .paragraph--type--buttons a {
    text-align: center;
    transition: transform 0.2s, box-shadow 0.2s;
}
[data-ucla-path='/resources'] .paragraph--type--buttons a:hover {
    transform: scale(1.02, 1.02);
    background-color: white;
    color: var(--black);
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2);
}
[data-ucla-path='/resources'] .paragraph--type--buttons .card-title {
    line-height: 1;
    padding-bottom: 0.75rem;
}

/* Resource cards */
[data-ucla-path='/resources'] .background-gray ~ .background-gray {
    margin-top: -1.5rem;
    padding-top: 0;
}

/* Footer */
[data-ucla-path='/resources'] footer {
    margin-top: 0;
}

@media (min-width: 768px) {
    /* Header */
    [data-ucla-path='/resources'] .hero-header .container {
        grid-template-areas:
            'header'
            'lead'
            'search'
            'image';
        grid-template-columns: 1fr;
    }
    [data-ucla-path='/resources'] .body--page.hero-header .container > h1 {
        grid-area: header;
        text-align: center;
        padding-top: 2rem;
    }
    [data-ucla-path='/resources'] .hero-header .container > p.lead {
        grid-area: lead;
        text-align: center;
        margin-bottom: 2.5rem;
    }
    [data-ucla-path='/resources'] .hero-header .container > #resources-search {
        grid-area: search;
        width: 450px;
        margin-left: auto;
        margin-right: auto;
    }
    [data-ucla-path='/resources']
        .hero-header
        .container
        > #resources-search
        input {
        padding-left: 2rem;
        padding-right: 2rem;
    }
    [data-ucla-path='/resources'] .hero-header .container > img {
        grid-area: image;
    }

    /* Browse by tags */
    [data-ucla-path='/resources'] .paragraph--type--buttons .cards-container {
        grid-template-columns: repeat(3, 1fr);
    }
    [data-ucla-path='/resources']
        .paragraph--type--buttons
        .cards-container
        .card-title {
        font-size: 24px;
        line-height: 1;
    }
}
@media (min-width: 1024px) {
    [data-ucla-path='/resources'] .hero-header .container {
        grid-template-areas:
            'header image'
            'lead image'
            'search image';
        grid-template-columns: 1fr 1fr;
    }
    [data-ucla-path='/resources'] .hero-header .container > img {
        margin-top: -4rem;
    }
    [data-ucla-path='/resources'] .body--page.hero-header .container > h1 {
        text-align: left;
        padding-right: 8rem;
        margin-top: 2rem;
    }
    [data-ucla-path='/resources'] .hero-header .container > p.lead {
        text-align: left;
        margin-top: -7rem;
        padding-right: 8rem;
    }
    [data-ucla-path='/resources'] .hero-header .container > #resources-search {
        text-align: left;
        width: 100%;
        margin-top: -7rem;
        padding-right: 8rem;
    }
}

/* #endregion */

/* #region RESOURCES BROWSER */
[data-ucla-path^='/resources/'] h1 {
    padding-bottom: 0;
}
[data-ucla-path^='/resources/'] main#main {
    overflow: unset;
}
[data-ucla-path^='/resources/'] .resource-list > div ~ div .resource-teaser {
    margin-top: 3rem;
}

@media (min-width: 575px) {
    /* Header */
    [data-ucla-path^='/resources/'] h1 {
        margin-bottom: 2rem;
    }

    /* Resource list */
    [data-ucla-path^='/resources/'] .resource-list > div + div {
        margin-top: 2rem;
        border-top: 1px solid #bfbfbf;
        padding-top: 2rem;
    }
    [data-ucla-path^='/resources/']
        .resource-list
        > div
        ~ div
        .resource-teaser {
        margin-top: 0;
    }
}
/* #endregion */

/* #region RESOURCES SEARCH */
[data-ucla-path='/search'] .views-exposed-form {
    display: none;
}
[data-ucla-path='/search'] .views-row ~ .views-row {
    margin-top: 3rem;
}

@media (min-width: 575px) {
    [data-ucla-path='/search'] .views-row + .views-row {
        margin-top: 2rem;
        border-top: 1px solid #bfbfbf;
        padding-top: 2rem;
    }
    [data-ucla-path='/search'] .views-row ~ .views-row .resource-teaser {
        margin-top: 0;
    }
}
/* #endregion */

/* #region RESOURCES BROWSER FILTERS */

.ucla-bewellbruin-filters {
    display: flex;
    margin-top: 1rem;
    margin-right: 0.5rem;
    margin-bottom: 1.5rem;
}
.ucla-bewellbruin-filters > * {
    display: inline-block;
    position: relative;
    margin: 0;
}
.ucla-bewellbruin-filters > *:not(:first-child) {
    margin-left: 0.5rem;
}
.ucla-bewellbruin-filter-submit {
    color: white;
    background: #00598c;
    padding: 0.5rem 1rem;
    border: none;
    border-radius: 2rem;
    font-size: 1rem;
}
.ucla-bewellbruin-filter-button {
    background: white;
    border: 1px solid #333;
    padding: 0.5rem 1rem;
    border-radius: 2rem;
    font-size: 1rem;
}
[data-ucla-bewellbruin-filter='open'] .ucla-bewellbruin-filter-button {
    background: #ddebfc;
    border-color: white;
}
.ucla-bewellbruin-filter[data-ucla-bewellbruin-filter='closed']
    .ucla-bewellbruin-filter-menu {
    display: none;
}
.ucla-bewellbruin-filter-list {
    position: absolute;
    z-index: 10000;
    display: grid;
    gap: 0.25rem;
    width: 15rem;
    font-size: 1rem;
    column-gap: 0.5rem;
    margin-top: 0.5rem;
    padding: 1rem;
    background: white;
    filter: drop-shadow(0 1rem 1rem rgba(0, 0, 0, 0.1));
    border-radius: 1rem;
}
.ucla-bewellbruin-filter-list > * {
    width: 100%;
}
@media (min-width: 768px) {
    .ucla-bewellbruin-filter-list {
        width: 15rem;
        grid-auto-flow: column;
        grid-template-rows: repeat(var(--ucla-bewellbruin-numrows), auto);
        grid-template-columns: repeat(var(--ucla-bewellbruin-numcols), 1fr);
    }
    .ucla-bewellbruin-filter:not(:first-child) .ucla-bewellbruin-filter-list {
        width: 30rem;
    }
}
.ucla-bewellbruin-filter-option {
    display: flex;
    align-items: center;
}
.ucla-bewellbruin-filter-option input {
    --length: 1.125rem;
    width: var(--length);
    height: var(--length);
    margin-right: 0.75rem;
}
.ucla-bewellbruin-filter-option label {
    display: block;
    flex: 1;
}

/* #endregion */

/* #region RESOURCE DETAILS */

/* Main grid */
[data-ucla-path^='/resource/'] .resource-page {
    grid-template-columns: 1fr;
    grid-template-areas:
        'image'
        'category'
        'title'
        'summary'
        'tags'
        'info'
        'details'
        'facilitators';
    gap: 0;
}
[data-ucla-path^='/resource/'] .resource-page header {
    display: contents;
}

/* Main grid: image */
[data-ucla-path^='/resource/'] .resource-page .resource-image {
    grid-area: image;
    padding-top: 1rem;
    padding-bottom: 0.5rem;
}

/* Main grid: category */
[data-ucla-path^='/resource/'] .resource-page .resource-category {
    grid-area: category;
}
[data-ucla-path^='/resource/'] .resource-page .resource-category .summary {
    margin-top: 0;
}
[data-ucla-path^='/resource/'] .resource-page .resource-category a {
    font-size: 18px;
}
/* Main grid: title */
[data-ucla-path^='/resource/'] .resource-page h1 {
    grid-area: title;
    padding-top: 0;
    margin-top: 0;
    margin-bottom: 0;
    font-size: 28px;
}

/* Main grid: summary */
[data-ucla-path^='/resource/'] .resource-page .resource-summary {
    grid-area: summary;
}

/* Main grid: tags */
[data-ucla-path^='/resource/'] .resource-page .resource-tags {
    grid-area: tags;
    padding-bottom: 2rem;
    font-size: 13px;
}

/* Main grid: info */
[data-ucla-path^='/resource/'] .resource-page .resource-aside {
    grid-area: info;
    padding: 2rem;
}
[data-ucla-path^='/resource/'] .resource-page .resource-aside a {
    color: #0069a8;
    text-decoration: none;
}
[data-ucla-path^='/resource/'] .resource-page .resource-aside a:hover {
    background: unset;
    text-decoration: underline;
}
[data-ucla-path^='/resource/'] .resource-page .resource-aside h3 {
    margin-top: 0;
    font-size: 28px;
    padding-bottom: 1rem;
    border-bottom: 1px solid #333;
}
[data-ucla-path^='/resource/'] .resource-page .resource-aside dl {
    margin-top: 1.5rem;
    margin-bottom: 2rem;
}
[data-ucla-path^='/resource/'] .resource-page .resource-aside dl dt {
    margin-bottom: 0;
}
[data-ucla-path^='/resource/']
    .resource-page
    .resource-aside
    dl
    dd:not(:last-of-type) {
    margin-bottom: 1.25rem;
}
[data-ucla-path^='/resource/']
    .resource-page
    .resource-aside
    dl
    dd:last-of-type {
    margin-bottom: 0;
}
[data-ucla-path^='/resource/'] .resource-page .resource-aside .resource-cta {
    text-align: center;
}
[data-ucla-path^='/resource/'] .resource-page .resource-aside .resource-cta a {
    border-radius: 1.5rem;
    background-color: #ffd100;
    display: inline-block;
    padding-top: calc(0.5rem + 3px);
    padding-left: 2rem;
    padding-right: 2rem;
    padding-bottom: 0.5rem;
    color: #333;
}

/* Main grid: details */
[data-ucla-path^='/resource/'] .resource-page .resource-details {
    grid-area: details;
    margin-top: 2rem;
}
[data-ucla-path^='/resource/'] .resource-page .resource-details h2 {
    margin-top: 0;
    margin-bottom: 1rem;
}

/* Main grid: facilitators */
[data-ucla-path^='/resource/'] .resource-page .resource-facilitators {
    background: #ededed;
    grid-area: facilitators;
    margin-top: 2rem;
    margin-left: -1rem;
    margin-right: -1rem;
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 2rem;
    padding-bottom: 3rem;
}
[data-ucla-path^='/resource/'] .resource-page .resource-facilitators h2 {
    margin-bottom: 1.5rem;
}
[data-ucla-path^='/resource/']
    .resource-page
    .resource-facilitators
    [class='field-entities'] {
    width: 100%;
    gap: 1rem;
    grid-template-columns: 1fr;
}
[data-ucla-path^='/resource/']
    .resource-page
    .resource-facilitators
    .person-card {
    display: grid;
    border: none;
    grid-template-areas:
        'image name'
        'image job-title';
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto 1fr;
}
[data-ucla-path^='/resource/']
    .resource-page
    .resource-facilitators
    .person-card
    .person-page-image {
    grid-area: image;
}
[data-ucla-path^='/resource/']
    .resource-page
    .resource-facilitators
    .person-card
    .title {
    grid-area: name;
    padding-top: 0;
    font-size: 20px;
    padding-right: 0;
}
[data-ucla-path^='/resource/']
    .resource-page
    .resource-facilitators
    .person-card
    .job-title {
    grid-area: job-title;
    padding-right: 0;
}

@media (min-width: 575px) {
    [data-ucla-path^='/resource/'] .resource-page {
        grid-template-areas:
            'category     category'
            'title        title'
            'summary      summary'
            'tags         tags'
            'image        info'
            'details      info'
            'facilitators facilitators';
        grid-template-columns: 2fr 1.5fr;
        grid-template-rows: repeat(5, auto) 1fr auto;
        column-gap: 2rem;
        margin-top: 1.5rem;
        padding: 2rem;
        margin-left: 0;
        margin-right: 0;
    }
    [data-ucla-path^='/resource/'] .resource-page .resource-image {
        padding-top: 0;
        padding-bottom: 2rem;
    }
    [data-ucla-path^='/resource/'] .resource-page .resource-details {
        margin-top: 0;
    }
    [data-ucla-path^='/resource/']
        .resource-page
        .resource-details
        > p:last-of-type {
        margin-bottom: 0;
    }
    [data-ucla-path^='/resource/'] .resource-page .resource-aside {
        padding: 1.5rem;
        align-self: start;
    }
    [data-ucla-path^='/resource/'] .resource-page .resource-facilitators {
        margin-top: 6rem;
        margin-left: -3rem;
        margin-right: -3rem;
        padding-left: 3rem;
        padding-right: 3rem;
    }
    [data-ucla-path^='/resource/']
        .resource-page
        .resource-facilitators
        [class='field-entities'] {
        grid-template-columns: repeat(3, 1fr);
    }
    [data-ucla-path^='/resource/']
        .resource-page
        .resource-facilitators
        .person-card {
        grid-template-areas:
            'image'
            'name'
            'job-title';
        grid-template-columns: 1fr;
        grid-template-rows: repeat(2, auto) 1fr;
    }
    [data-ucla-path^='/resource/']
        .resource-page
        .resource-facilitators
        .title {
        margin-top: 1rem;
    }
    [data-ucla-path^='/resource/'] .resource-page .resource-category,
    [data-ucla-path^='/resource/'] .resource-page h1,
    [data-ucla-path^='/resource/'] .resource-page .resource-summary,
    [data-ucla-path^='/resource/'] .resource-page .resource-tags {
        padding-right: 10rem;
    }
}

@media (min-width: 800px) {
    [data-ucla-path^='/resource/'] .resource-page {
        grid-template-columns: 2fr 1fr;
        margin: 0 auto;
    }
    [data-ucla-path^='/resource/'] .resource-page .resource-category,
    [data-ucla-path^='/resource/'] .resource-page h1,
    [data-ucla-path^='/resource/'] .resource-page .resource-summary,
    [data-ucla-path^='/resource/'] .resource-page .resource-tags {
        padding-right: 15rem;
    }
    [data-ucla-path^='/resource/']
        .resource-page
        .resource-facilitators
        [class='field-entities'] {
        gap: 2rem;
    }
}
@media (min-width: 1024px) {
    [data-ucla-path^='/resource/'] .resource-page {
        padding: 1rem;
        padding-top: 2rem;
    }
    [data-ucla-path^='/resource/'] .resource-page .resource-category,
    [data-ucla-path^='/resource/'] .resource-page h1,
    [data-ucla-path^='/resource/'] .resource-page .resource-summary,
    [data-ucla-path^='/resource/'] .resource-page .resource-tags {
        padding-right: 20rem;
    }
    [data-ucla-path^='/resource/'] .resource-page .resource-facilitators {
        --margin: calc(-1 * 50% + 19rem);
        margin-left: var(--margin);
        margin-right: var(--margin);
        --padding: calc(50% - 19rem);
        padding-left: var(--padding);
        padding-right: var(--padding);
    }
}
@media (min-width: 1440px) {
    [data-ucla-path^='/resource/'] .resource-page .resource-category,
    [data-ucla-path^='/resource/'] .resource-page h1,
    [data-ucla-path^='/resource/'] .resource-page .resource-summary,
    [data-ucla-path^='/resource/'] .resource-page .resource-tags {
        padding-right: 25rem;
    }
}
/* #endregion */

/* #region PERSON PAGE */
[data-ucla-path^='/people/'] .person-page {
    grid-template-areas:
        'photo'
        'title'
        'details';
    grid-template-columns: 1fr;
}
[data-ucla-path^='/people/'] .person-page .person-page-image {
    grid-area: photo;
    text-align: center;
}
[data-ucla-path^='/people/'] .person-page .person-page-image img {
    max-width: 300px;
    width: 100%;
}
[data-ucla-path^='/people/'] .person-page header {
    grid-area: title;
}
[data-ucla-path^='/people/'] .person-page header h1 {
    font-size: 28px;
    margin-top: 1rem;
    line-height: 1.15;
}
[data-ucla-path^='/people/'] .person-page header p.lead {
    margin-top: 0.5rem;
}
[data-ucla-path^='/people/'] .person-page .person-page-content {
    grid-area: details;
}
[data-ucla-path^='/people/'] .person-page .person-page-content dl {
    margin-top: 0;
}
@media (min-width: 575px) {
    [data-ucla-path^='/people/'] .person-page {
        grid-template-areas:
            'photo title'
            'photo details';
        grid-template-columns: auto auto; /* probably could be improved */
    }
}
@media (min-width: 800px) {
    [data-ucla-path^='/people/'] .person-page {
        margin-top: 2rem;
        grid-template-columns: auto auto; /* probably could be improved */
    }
    [data-ucla-path^='/people/'] .person-page header h1 {
        margin-top: 0.25rem;
    }
}
/* #endregion */

/* #region ABOUT PAGE */

/* Heading */
[data-ucla-path='/about'] .hero-header {
    overflow-y: hidden;
}
[data-ucla-path='/about'] .hero-header .container {
    margin-bottom: -0.5rem;
    /* overflow: hidden; */
}
@media (min-width: 768px) {
    [data-ucla-path='/about'] .body--page.hero-header h1,
    [data-ucla-path='/about'] .body--page.hero-header p {
        padding-right: 2rem;
    }
}
[data-ucla-path='/about'] .body--page.hero-header .lead {
    margin-bottom: -1rem;
}

/* Upper Blue Sections */
[data-ucla-path='/about'] .section-committed-to-health,
[data-ucla-path='/about'] .section-discover-resources {
    padding-bottom: 0;
}
[data-ucla-path='/about'] .section-connections {
    margin-bottom: 1rem;
}
[data-ucla-path='/about'] .section-discover-resources,
[data-ucla-path='/about'] .section-connections {
    padding-top: 2rem;
}
[data-ucla-path='/about'] .section-committed-to-health h2,
[data-ucla-path='/about'] .section-discover-resources h2,
[data-ucla-path='/about'] .section-connections h2 {
    margin-bottom: 1rem;
}
[data-ucla-path='/about'] .section-committed-to-health p,
[data-ucla-path='/about'] .section-discover-resources p {
    margin-bottom: 0;
}
@media (min-width: 575px) {
    [data-ucla-path='/about'] .section-committed-to-health .container,
    [data-ucla-path='/about'] .section-discover-resources .container,
    [data-ucla-path='/about'] .section-connections .container {
        padding-right: 40%;
    }
}
@media (min-width: 768px) {
    [data-ucla-path='/about'] .section-committed-to-health .container,
    [data-ucla-path='/about'] .section-discover-resources .container,
    [data-ucla-path='/about'] .section-connections .container {
        padding-left: 25rem;
        padding-right: 1.5rem; /* reset */
    }
}
@media (min-width: 768px) {
    [data-ucla-path='/about'] .section-committed-to-health {
        padding-top: 6rem;
    }
    [data-ucla-path='/about'] .section-connections {
        padding-bottom: 6rem;
    }
}

/* Who We Are */
[data-ucla-path='/about'] .section-connections + .paragraph--section {
    padding-top: 2.5rem;
    padding-bottom: 6rem;
}
[data-ucla-path='/about'] .section-connections + .paragraph--section h2 {
    font-size: 32px;
    margin-top: 3rem;
    margin-bottom: 1rem;
}
[data-ucla-path='/about'] .section-connections + .paragraph--section .summary {
    margin-bottom: 2rem;
}
[data-ucla-path='/about'] .people-advanced .person-card {
    border: none;
}
[data-ucla-path='/about']
    .field-entities[data-entity-bundle='people_advanced'] {
    grid-template-columns: 1fr;
    gap: 1rem;
}
[data-ucla-path='/about']
    .field-entities[data-entity-bundle='people_advanced']
    .title {
    font-size: 20px;
    padding-top: 0;
    margin-top: -5px;
}
[data-ucla-path='/about']
    .field-entities[data-entity-bundle='people_advanced']
    .person-card {
    margin-top: 1rem;
    width: 100%;
    display: grid;
    grid-template-areas:
        'image name'
        'image title';
    grid-template-columns: 1fr 2fr;
    grid-template-rows: auto 1fr;
}
[data-ucla-path='/about']
    .field-entities[data-entity-bundle='people_advanced']
    .person-card
    .person-page-image {
    grid-area: image;
}
[data-ucla-path='/about']
    .field-entities[data-entity-bundle='people_advanced']
    .person-card
    .title {
    grid-area: name;
}
[data-ucla-path='/about']
    .field-entities[data-entity-bundle='people_advanced']
    .person-card
    .job-title {
    grid-area: title;
}
[data-ucla-path='/about']
    .field-entities[data-entity-bundle='people_advanced']
    a:hover,
[data-ucla-path='/about']
    .field-entities[data-entity-bundle='people_advanced']
    a:hover
    .job-title {
    background: var(--lightest-blue);
    color: #333;
}
@media (min-width: 575px) {
    [data-ucla-path='/about']
        .field-entities[data-entity-bundle='people_advanced'] {
        grid-template-columns: 1fr 1fr;
    }
    [data-ucla-path='/about']
        .field-entities[data-entity-bundle='people_advanced']
        .person-card {
        grid-template-areas:
            'image'
            'name'
            'title';
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto;
        gap: 0.5rem;
    }
    [data-ucla-path='/about']
        .field-entities[data-entity-bundle='people_advanced']
        .person-card
        .title,
    [data-ucla-path='/about']
        .field-entities[data-entity-bundle='people_advanced']
        .person-card
        .job-title {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    [data-ucla-path='/about']
        .field-entities[data-entity-bundle='people_advanced']
        .person-card
        .title {
        padding-top: 0.5rem;
    }
}
@media (min-width: 768px) {
    [data-ucla-path='/about']
        .field-entities[data-entity-bundle='people_advanced'] {
        grid-template-columns: 1fr 1fr 1fr;
        gap: 2rem;
    }
    [data-ucla-path='/about']
        .field-entities[data-entity-bundle='people_advanced']
        .person-card
        .title {
        margin-top: 0;
        font-size: 28px;
    }
    [data-ucla-path='/about']
        .field-entities[data-entity-bundle='people_advanced']
        .person-card
        .job-title {
        margin-top: 0;
        font-size: 21px;
    }
}

/* Dedicated campus partners */
[data-ucla-path='/about'] .section-dedicated-partners {
    margin-top: 2rem;
    padding-bottom: 2rem;
}
[data-ucla-path='/about'] .section-dedicated-partners .column-2 h3 {
    color: #005587;
    font-size: 1.25rem;
}
[data-ucla-path='/about'] .section-dedicated-partners p:not(.summary) {
    margin-bottom: 1.75rem;
}
[data-ucla-path='/about']
    .section-dedicated-partners
    .column-2
    p:first-of-type {
    font-size: 1.125rem;
    margin-top: 0;
}
[data-ucla-path='/about'] .section-dedicated-partners {
    padding-top: 6rem;
}
[data-ucla-path='/about'] .section-dedicated-partners .column-1 {
    padding-bottom: 8rem;
}
@media (min-width: 575px) {
    [data-ucla-path='/about'] .section-dedicated-partners {
        padding-top: 2rem;
    }
    [data-ucla-path='/about'] .section-dedicated-partners .column-1 {
        padding-bottom: unset;
    }
}
@media (min-width: 575px) {
    [data-ucla-path='/about'] .section-dedicated-partners {
        padding-right: 40%;
    }
}
@media (min-width: 768px) {
    [data-ucla-path='/about'] .section-dedicated-partners {
        padding-right: unset;
    }
}
@media (min-width: 768px) {
    [data-ucla-path='/about'] .section-dedicated-partners .container {
        display: grid;
        grid-template-areas:
            'title       content'
            'title-desc  content';
        column-gap: 6rem;
    }
    [data-ucla-path='/about'] .section-dedicated-partners .container h2 {
        grid-area: title;
        align-self: end;
    }
    [data-ucla-path='/about'] .section-dedicated-partners .columns {
        display: contents;
    }
    [data-ucla-path='/about'] .section-dedicated-partners .column-1 {
        grid-area: title-desc;
        align-self: start;
    }
    [data-ucla-path='/about'] .section-dedicated-partners .column-2 {
        grid-area: content;
    }
}
@media (min-width: 768px) {
    [data-ucla-path='/about'] .section-dedicated-partners {
        padding-top: 6rem;
        padding-bottom: 6rem;
    }
}

/* Footer */
[data-ucla-path='/about'] footer {
    margin-top: 0;
}
/* #endregion */

/* #region FAQ PAGE */

/*** FAQ Page Header ***/

/* Add padding for blobs */
[data-ucla-path='/faq'] h1 {
    padding-top: 3rem;
    padding-bottom: 3rem;
}
/* Fix paragraph section defaults */
[data-ucla-path='/faq'] .paragraph--section {
    padding-top: 0;
    padding-bottom: 3rem;
}
[data-ucla-path='/faq'] h1 {
    text-align: center;
    font-size: 26px;
}
[data-ucla-path='/faq'] h2 {
    font-size: 32px;
}

/*** FAQ Lists ***/

/* Add padding below FAQ list headings */
[data-ucla-path='/faq'] .section-collapsing-faqs h2 {
    padding-bottom: 1rem;
}

/* Convert button to arrow style */
[data-ucla-path='/faq'] .paragraph--section a[href='/contact'] {
    display: flex;
    align-items: center;
    color: #333;
    background: unset;
    border: none;
    padding-left: 0;
    padding-right: 0;
    font-size: 1.25rem;
    transition: transform 0.3s ease-in-out;
    transform: scale(1);
}
[data-ucla-path='/faq'] .paragraph--section a[href='/contact']:hover {
    background: #daebfe;
}
[data-ucla-path='/faq'] .paragraph--section [href='/contact']::after {
    content: url(/themes/custom/ucla_campus/img/arrow-forward.svg);
    height: 1.25rem;
    width: 1.25rem;
    --padding: 0.75rem;
    --offset: -5.5px;
    padding-top: calc(var(--padding) + var(--offset));
    padding-bottom: calc(var(--padding) - var(--offset));
    padding-left: var(--padding);
    padding-right: var(--padding);
    margin-left: 0.75rem;
    background: #ffd100;
    border-radius: 3rem;
}

/* #endregion */

/* #region URGENT HELP PAGE */

/* Fix bullet points */
[data-ucla-path='/help'] .body-content ul li::before {
    content: '';
}

/* Page header */
[data-ucla-path='/help'] .body--page .container {
    padding: 0;
    text-align: center;
}
[data-ucla-path='/help'] .body--page .container h1 {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 26px;
    font-weight: bold;
    color: white;
    padding-top: 1.5rem;
    padding-left: 1rem;
    padding-right: 1rem;
}
[data-ucla-path='/help'] .body--page .container .lead {
    margin-top: 0;
    font-size: 13px;
    font-weight: bold;
    color: #daebfe;
    padding-bottom: 1.5rem;
    --width: 8rem;
    --padding: calc((100% - var(--width)) / 2);
    padding-left: var(--padding);
    padding-right: var(--padding);
    line-height: 1.5;
}
[data-ucla-path='/help'] .body--page .container h1,
[data-ucla-path='/help'] .body--page .container .lead {
    background: #005587;
}

/* Call 911 if you are experiencing a life-threatening emergency. */
[data-ucla-path='/help'] .body--page .container p:last-of-type {
    font-size: 28px;
    font-weight: bold;
    color: #005587;
    padding-left: 1rem;
    padding-right: 1rem;
    margin-top: 3rem;
    line-height: 1.25;
}

/* Emergency Services for UCLA Students */
[data-ucla-path='/help'] .body--page + .body-content {
    padding-top: 0;
}
[data-ucla-path='/help'] .body--page + .body-content h2 {
    padding-top: 3rem;
    font-weight: bold;
    font-size: 28px;
}

/* Case Management Services */
[data-ucla-path='/help'] .body--page + .body-content h3 {
    font-size: 28px;
    font-weight: bold;
    margin-top: 2.5rem;
    margin-bottom: 1rem;
    color: #0069a8;
}

/* CAPS Section */
[data-ucla-path='/help'] .body--page + .body-content ul {
    padding-left: 1rem;
    margin-bottom: 0;
}
[data-ucla-path='/help'] .body--page + .body-content ul li {
    margin-bottom: 0.25rem;
}

/* Gray boxes */
[data-ucla-path='/help'] .columns .column-2 {
    background: #ededed;
    padding: 2rem;
    margin-top: 2rem;
}
[data-ucla-path='/help'] .columns .column-2 h4 {
    font-size: 28px;
    padding-bottom: 1rem;
    border-bottom: 1px solid #6e6e6e;
}
[data-ucla-path='/help'] .columns .column-2 p strong {
    font-size: 15px;
    margin-top: 1rem;
}
[data-ucla-path='/help'] .columns .column-2 a {
    text-decoration: none;
}
[data-ucla-path='/help'] .columns .column-2 p:last-of-type {
    margin-bottom: 0;
}

/* Blue boxes */
[data-ucla-path='/help'] .background-lightest-blue {
    margin-top: 2rem;
    padding-top: 3rem;
}
[data-ucla-path='/help'] .background-lightest-blue h2 {
    margin-bottom: 3rem;
}
[data-ucla-path='/help'] .background-lightest-blue h3 {
    font-size: 28px;
    color: #0069a8;
}

[data-ucla-path='/help'] footer {
    margin-top: 0;
}
@media (min-width: 768px) {
    [data-ucla-path='/help'] .columns .column-1 p:first-child {
        margin-top: 0;
    }
    [data-ucla-path='/help'] .columns .column-2 {
        margin-top: 0;
    }
    [data-ucla-path='/help'] .background-lightest-blue .container {
        padding-right: 30%;
    }
}
@media (min-width: 1024px) {
    [data-ucla-path='/help'] .body--page .container {
        max-width: unset;
    }
    [data-ucla-path='/help'] .body--page .container h1 {
        font-size: 60px;
        padding-top: 4rem;
        padding-bottom: 0.5rem;
    }
    [data-ucla-path='/help'] .body--page .container .lead {
        font-size: 18px;
        padding-left: 1rem;
        padding-right: 1rem;
        padding-bottom: 5rem;
    }
    [data-ucla-path='/help'] .body--page .container h1,
    [data-ucla-path='/help'] .body--page .container .lead,
    [data-ucla-path='/help'] .body--page .container p:last-of-type {
        text-align: left;
        --padding: calc((100% - 1024px) / 2 + 1rem);
        padding-left: var(--padding);
        padding-right: var(--padding);
    }
}
@media (min-width: 1440px) {
    [data-ucla-path='/help'] .body--page .container h1,
    [data-ucla-path='/help'] .body--page .container .lead,
    [data-ucla-path='/help'] .body--page .container p:last-of-type {
        --padding: calc((100% - 1024px) / 2 + -3.65rem);
    }
}

/* #endregion */

/* #region CONTACT US PAGE */

/*
Note that the contact page has a MyUCLA Form that won't load in dev, so there
is some site-specific JS in the theme settings that will detect a localhost
environment and swap out the form with a stringified version of the HTML.

If the department updates the form and we want to work on the site off the live
server, we'll need to update the stringified HTML in the theme settings.
*/

[data-ucla-path='/contact'] h1 {
    font-size: 28px;
    margin-top: 4rem;
    margin-bottom: 0;
    padding-right: 8rem;
}
[data-ucla-path='/contact'] .uclaform {
    margin-top: 0;
}
[data-ucla-path='/contact'] .body--page > .container > p,
[data-ucla-path='/contact'] .uclaform-instruction {
    margin-top: 1rem;
    margin-bottom: 0;
    font-size: 17px;
    padding-right: 8rem;
}
[data-ucla-path='/contact'] [data-custom-embed-id='127'] {
    padding-right: 0;
    width: 100%;
    margin-bottom: 9rem;
}
[data-ucla-path='/contact'] .uclaform-question {
    margin-top: 1rem;
}
[data-ucla-path='/contact'] .uclaform-question label {
    font-size: 18px;
    font-weight: normal;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}
[data-ucla-path='/contact'] .uclaform-question__input {
    margin-top: 0;
}
[data-ucla-path='/contact'] .uclaform-question input {
    padding: 1rem;
    /* border: unset; */
    border-radius: 0;
    box-shadow: none;
    font-size: 18px;
    border: 1.5px solid #d0d0d0;
    width: 100%;
}
[data-ucla-path='/contact'] .uclaform-question textarea {
    padding: 1rem;
    border-radius: 0;
    font-size: 18px;
    width: 100% !important;
    max-width: 100% !important;
    box-shadow: none;
    border: 1.5px solid #d0d0d0;
    font-family: inherit;
}
[data-ucla-path='/contact'] .uclaform-submit {
    text-align: right;
}
[data-ucla-path='/contact'] .uclaform-submit button {
    border: unset;
    overflow: hidden;
    background: unset;
    align-items: center;
    text-align: center;
    justify-content: center;
    justify-self: center;
    flex: 1;
    cursor: pointer;
    display: flex;
    flex-direction: row;
    color: #333;
    font-weight: bold;
    text-decoration: none;
    padding: 0.4rem 0 0 0;
    margin: 0;
    line-height: 2rem;
    padding-left: 1rem;
    border-radius: 1.2rem;
    margin-left: auto;
    padding-top: 0;
    padding-right: 0;
}
[data-ucla-path='/contact'] .uclaform-submit button:hover {
    color: #333;
    background: var(--lightest-blue);
}
[data-ucla-path='/contact'] .uclaform-submit button::after {
    margin-left: 1rem;

    cursor: pointer;
    display: inline-block;
    content: '';
    border-radius: 100%;
    height: 2.4rem;
    width: 2.4rem;
    background-color: var(--ucla-gold);
    background-image: url(../img/arrow-forward.svg);
    background-size: 60%;
    background-position: center center;
    background-repeat: no-repeat;
}
/* #endregion */

/* #region BLOBS */

/* Navbar */
#menus.control-aria-expanded {
    overflow: hidden;
}
#menus.control-aria-expanded::after {
    overflow: visible;
    content: url(/static/blobs/navbar.png);
    display: block;
    height: 0;
    width: 0;
    margin-left: auto;
    pointer-events: none;
    direction: rtl;
    transform-origin: bottom right;
    scale: 0.28;
    translate: 19px -145px;
}

/* Home page */
[data-ucla-path='/'] .body--page {
    overflow: visible;
    overflow-x: clip;
}
[data-ucla-path='/'] .body--page::after {
    overflow: visible;
    content: url(/static/blobs/home-1.png);
    display: block;
    height: 0;
    pointer-events: none;
    direction: rtl;
    transform-origin: bottom right;
    scale: 0.55;
    translate: 61px -110px;
}
@media (min-width: 768px) {
    #menus.control-aria-expanded::after {
        display: none;
    }
    [data-ucla-path='/'] .body-content.background-be-well-bruin-blue {
        overflow: visible;
        overflow-x: clip;
    }
    [data-ucla-path='/'] .body-content.background-be-well-bruin-blue::before {
        overflow: visible;
        content: url(/static/blobs/navbar.png);
        display: block;
        height: 0;
        width: 0;
        pointer-events: none;
        margin-left: auto;
        direction: rtl;
        transform-origin: top right;
        scale: 0.6;
        translate: 59px -230px;
    }
    [data-ucla-path='/'] .body--page::after {
        scale: 0.7;
    }
    [data-ucla-path='/'] .cards-with-images .cards-container {
        position: relative;
        z-index: 1;
    }
    [data-ucla-path='/'] .cards-with-images {
        overflow: visible;
    }
    [data-ucla-path='/'] .cards-with-images::after {
        content: url(/static/blobs/home-3.png);
        display: block;
        height: 0;
        pointer-events: none;
        /* direction: rtl; */
        transform-origin: bottom left;
        scale: 0.42;
        translate: -175px -419px;
    }
}

/* Find a resouce */
@media (min-width: 768px) {
    [data-ucla-path='/resources'] .cards-with-images .cards-container {
        position: relative;
        z-index: 1;
    }
    [data-ucla-path='/resources'] .cards-with-images {
        overflow: visible;
    }
    [data-ucla-path='/resources'] .cards-with-images::after {
        content: url(/static/blobs/home-3.png);
        display: block;
        height: 0;
        pointer-events: none;
        /* direction: rtl; */
        transform-origin: bottom left;
        scale: 0.42;
        translate: -175px -419px;
    }
}

/* About us */
[data-ucla-path='/about'] .section-committed-to-health {
    overflow: visible;
    position: relative;
    z-index: 1;
}
[data-ucla-path='/about'] .section-committed-to-health::before {
    content: url(/static/blobs/about-1.png);
    display: block;
    height: 0;
    pointer-events: none;
    direction: rtl;
    transform-origin: top right;
    scale: 0.5;
    translate: 100px -127px;
}
[data-ucla-path='/about'] .section-dedicated-partners {
    overflow: visible;
    position: relative;
    z-index: 1;
}
[data-ucla-path='/about'] .section-dedicated-partners::before {
    content: url(/static/blobs/about-2.png);
    display: block;
    height: 0;
    pointer-events: none;
    /* direction: rtl; */
    transform-origin: top left;
    scale: 0.65;
    translate: -73px -250px;
}
[data-ucla-path='/about'] .section-dedicated-partners .column-1 {
    overflow: visible;
    position: relative;
    z-index: 1;
}
[data-ucla-path='/about'] .section-dedicated-partners .column-1::after {
    /* picked my own for this one since the one in the design was clipped */
    content: url(/static/blobs/about-3.png);
    display: block;
    height: 0;
    pointer-events: none;
    direction: rtl;
    transform-origin: bottom right;
    scale: 0.45;
    translate: 82px -18px;
    rotate: 16deg;
}
@media (min-width: 575px) {
    [data-ucla-path='/about'] .section-committed-to-health::before {
        display: none;
    }
    [data-ucla-path='/about'] .section-discover-resources {
        overflow: visible;
        position: relative;
        z-index: 1;
    }
    [data-ucla-path='/about'] .section-discover-resources::before {
        content: url(/static/blobs/about-4.png);
        display: block;
        height: 0;
        pointer-events: none;
        direction: rtl;
        transform-origin: top right;
        scale: 0.3;
        translate: 54px -129px;
    }
    [data-ucla-path='/about'] .section-discover-resources .container {
        overflow: visible;
        position: relative;
        z-index: 1;
    }
    [data-ucla-path='/about'] .section-discover-resources .container::before {
        content: url(/static/blobs/about-5.png);
        display: block;
        height: 0;
        pointer-events: none;
        direction: rtl;
        transform-origin: top right;
        scale: 0.3;
        translate: 368px -145px;
    }
    [data-ucla-path='/about'] .section-discover-resources::after {
        content: url(/static/blobs/about-8.png);
        display: block;
        height: 0;
        pointer-events: none;
        direction: rtl;
        transform-origin: bottom right;
        scale: 0.5;
        translate: 105px -57px;
    }
    [data-ucla-path='/about'] .section-dedicated-partners::before {
        direction: rtl;
        transform-origin: top right;
        scale: 0.75;
        translate: 333px -122px;
    }
    [data-ucla-path='/about'] .section-dedicated-partners .column-1::after {
        display: none;
    }
}
@media (min-width: 768px) {
    [data-ucla-path='/about'] .section-committed-to-health::before {
        display: none;
    }
    [data-ucla-path='/about'] .section-discover-resources::before {
        display: none;
    }
    [data-ucla-path='/about'] .section-discover-resources .container::before {
        display: none;
    }
    [data-ucla-path='/about'] .section-discover-resources::after {
        display: none;
    }
    [data-ucla-path='/about'] .section-committed-to-health .container {
        overflow: visible;
        position: relative;
        z-index: 1;
    }
    [data-ucla-path='/about'] .section-committed-to-health .container::before {
        content: url(/static/blobs/about-1.png);
        display: block;
        height: 0;
        pointer-events: none;
        direction: rtl;
        transform-origin: top right;
        scale: 0.65;
        translate: 115px -173px;
    }
    [data-ucla-path='/about'] .section-committed-to-health .container h2 {
        overflow: visible;
        position: relative;
        z-index: 1;
    }
    [data-ucla-path='/about']
        .section-committed-to-health
        .container
        h2::before {
        content: url(/static/blobs/about-4.png);
        display: block;
        height: 0;
        pointer-events: none;
        direction: ltr;
        transform-origin: top left;
        scale: 0.35;
        translate: -438px -218px;
    }
    [data-ucla-path='/about']
        .section-committed-to-health
        .container
        h2::after {
        content: url(/static/blobs/about-5.png);
        display: block;
        height: 0;
        pointer-events: none;
        direction: ltr;
        transform-origin: top left;
        scale: 0.35;
        translate: -331px -197px;
    }
    [data-ucla-path='/about'] .section-connections {
        overflow: visible;
        position: relative;
        z-index: 1;
    }
    [data-ucla-path='/about'] .section-connections::after {
        content: url(/static/blobs/about-6.png);
        display: block;
        height: 0;
        pointer-events: none;
        direction: ltr;
        transform-origin: bottom left;
        scale: 0.34;
        translate: -91px -212px;
    }
    [data-ucla-path='/about'] .section-dedicated-partners::before {
        display: none;
    }
    [data-ucla-path='/about'] .section-dedicated-partners h2 {
        overflow: visible;
        position: relative;
        z-index: 1;
    }
    [data-ucla-path='/about'] .section-dedicated-partners h2::before {
        content: url(/static/blobs/about-9.png);
        display: block;
        height: 0;
        width: 0;
        pointer-events: none;
        direction: ltr;
        transform-origin: top left;
        scale: 0.5;
        translate: -240px -646px;
    }
    [data-ucla-path='/about'] .section-dedicated-partners {
        overflow: visible;
        position: relative;
        z-index: 1;
    }
    [data-ucla-path='/about'] .section-dedicated-partners::after {
        content: url(/static/blobs/about-7.png);
        display: block;
        height: 0;
        width: 0;
        pointer-events: none;
        direction: ltr;
        transform-origin: bottom left;
        scale: 0.3;
        translate: 0px -212px;
    }
}

/* Resource details */
[data-ucla-path^='/resource/'] #block-ucla-campus-mainpagecontent {
    overflow: visible;
    overflow-x: clip;
    /* z-index: 1; */
}
[data-ucla-path^='/resource/'] #block-ucla-campus-mainpagecontent::before {
    content: url(/static/blobs/about-9.png);
    display: block;
    height: 0;
    width: 0;
    margin-left: auto;
    pointer-events: none;
    direction: rtl;
    transform-origin: top right;
    scale: 0.28;
    translate: 206px -127px;
}
@media (min-width: 768px) {
    [data-ucla-path^='/resource/'] #block-ucla-campus-mainpagecontent::before {
        scale: 0.3;
        translate: 158px -135px;
    }
}
@media (min-width: 1024px) {
    [data-ucla-path^='/resource/'] #block-ucla-campus-mainpagecontent::before {
        margin-left: auto;
        margin-right: auto;
        transform-origin: center center;
        scale: 0.34;
        translate: 665px -133px;
    }
}
@media (min-width: 1440px) {
    [data-ucla-path^='/resource/'] #block-ucla-campus-mainpagecontent::before {
        margin-left: auto;
        margin-right: auto;
        transform-origin: center center;
        scale: 0.36;
        translate: 690px -139px;
    }
}

/* Urgent help */
[data-ucla-path='/help'] .body--page {
    overflow: visible;
    overflow-x: clip;
    /* z-index: 1; */
}
[data-ucla-path='/help'] .body--page::before {
    content: url(/static/blobs/urgent-help-1.png);
    display: block;
    height: 0;
    width: 0;
    margin-left: auto;
    margin-right: auto;
    pointer-events: none;
    /* direction: ltr; */
    transform-origin: top center;
    scale: 0.23;
    translate: -282px -3px;
}
[data-ucla-path='/help'] .body--page .container {
    overflow: visible;
    overflow-x: clip;
    /* z-index: 1; */
}
[data-ucla-path='/help'] .body--page .container::before {
    content: url(/static/blobs/urgent-help-2.png);
    display: block;
    height: 0;
    width: 0;
    margin-left: auto;
    margin-right: auto;
    pointer-events: none;
    /* direction: ltr; */
    transform-origin: top center;
    scale: 0.23;
    translate: 73px -1px;
}
@media (min-width: 550px) {
    [data-ucla-path='/help'] .body--page::before {
        scale: 0.27;
        translate: -331px -12px;
    }
    [data-ucla-path='/help'] .body--page .container::before {
        scale: 0.32;
        translate: 92px -1px;
    }
}
@media (min-width: 1024px) {
    [data-ucla-path='/help'] .body--page::before {
        scale: 0.4;
        translate: -818px 4px;
    }
    [data-ucla-path='/help'] .body--page .container::before {
        scale: 0.55;
        translate: 346px -30px;
    }
}
@media (min-width: 1024px) {
    [data-ucla-path='/help'] .body--page::before {
        scale: 0.4;
        translate: -890px 4px;
    }
    [data-ucla-path='/help'] .body--page .container::before {
        scale: 0.6;
        translate: 129px -66px;
    }
}
@media (min-width: 1024px) {
    [data-ucla-path='/help'] .body--page::before {
        scale: 0.4;
        translate: -858px 4px;
    }
    [data-ucla-path='/help'] .body--page .container::before {
        scale: 0.6;
        translate: 220px -66px;
    }
}
@media (min-width: 1440px) {
    [data-ucla-path='/help'] .body--page::before {
        scale: 0.4;
        translate: -910px 4px;
    }
}

/* FAQs */
[data-ucla-path='/faq'] main#main {
    overflow: visible;
}
[data-ucla-path='/faq'] .body--page {
    overflow: visible;
}
[data-ucla-path='/faq'] .body--page .container::before {
    content: url(/static/blobs/faq-1.png);
    display: block;
    height: 0;
    width: 0;
    pointer-events: none;
    margin-right: auto;
    direction: ltr;
    scale: 0.27;
    translate: -73px -7px;
}
[data-ucla-path='/faq'] .body--page .container::after {
    content: url(/static/blobs/faq-2.png);
    display: block;
    height: 0;
    width: 0;
    pointer-events: none;
    margin-left: auto;
    scale: 0.27;
    translate: -118px -180px;
}
[data-ucla-path='/faq'] .paragraph--section:last-child {
    overflow: visible;
    padding-bottom: 12rem;
}
[data-ucla-path='/faq'] .paragraph--section:last-child .container {
    overflow: visible;
}
[data-ucla-path='/faq'] .paragraph--section:last-child .container::before {
    content: url(/static/blobs/about-8.png);
    display: block;
    height: 0;
    width: 0;
    pointer-events: none;
    margin-right: auto;
    direction: ltr;
    rotate: -24deg;
    scale: 0.38;
    translate: -136px 194px;
}
[data-ucla-path='/faq'] .paragraph--section:last-child .container::after {
    content: url(/static/blobs/about-3.png);
    display: block;
    height: 0;
    width: 0;
    pointer-events: none;
    margin-left: auto;
    direction: rtl;
    scale: 0.67;
    translate: 125px -71px;
}
@media (min-width: 768px) {
    [data-ucla-path='/faq'] .body--page .container::before {
        content: url('/static/blobs/faq-4.png');
        scale: 0.23;
        translate: -73px -7px;
    }
    [data-ucla-path='/faq'] .body--page .container::after {
        content: url('/static/blobs/faq-5.png');
        scale: 0.21;
        translate: -273px -211px;
    }
}
/* #endregion */

/* #region March 2024 updates */
.resource-teaser h2 a {
    text-decoration: none;
}
[data-ucla-path='/resources/online'] form.views-exposed-form,
[data-ucla-path='/resources/on-campus'] form.views-exposed-form,
[data-ucla-path='/resources/undergraduate'] form.views-exposed-form,
[data-ucla-path='/resources/graduate-professional'] form.views-exposed-form,
[data-ucla-path='/resources/faculty-staff'] form.views-exposed-form,
[data-ucla-path='/resources/alumni'] form.views-exposed-form {
    display: none;
}

[data-ucla-path='/resources/online'] .resource-list header,
[data-ucla-path='/resources/on-campus'] .resource-list header,
[data-ucla-path='/resources/undergraduate'] .resource-list header,
[data-ucla-path='/resources/graduate-professional'] .resource-list header,
[data-ucla-path='/resources/faculty-staff'] .resource-list header,
[data-ucla-path='/resources/alumni'] .resource-list header {
    padding-bottom: 2rem;
    padding-top: 1rem;
}

[data-ucla-path='/resources/online'] .resource-list header h1,
[data-ucla-path='/resources/on-campus'] .resource-list header h1,
[data-ucla-path='/resources/undergraduate'] .resource-list header h1,
[data-ucla-path='/resources/graduate-professional'] .resource-list header h1,
[data-ucla-path='/resources/faculty-staff'] .resource-list header h1,
[data-ucla-path='/resources/alumni'] .resource-list header h1 {
    padding-top: 0;
    /* margin-top: 1rem; */
    margin-bottom: 1rem;
}
/* #endregion */