/*updated 10/27/23 MF*/
body {
  max-width: 1920px;
}

.hidden {
  display: none !important;
}

@media all and (min-width: 0px) {
  /* =================================================================================================================================== */
  /* =========================================================Global==================================================================== */
  /* ====================================================================================================================================*/
  /* BREADCRUMB */
  #breadcrumb,
  #curated-breadcrumb {
    width: 100%;
    color: var(--breadcrumbText-color);
    /*breadcrumb arrows*/
    background-color: var(--ribbonBackground-color);
  }

  /* Hiding default breadcrumb on curated pages per Pete */
  .curated-content #breadcrumb,
  .curated-content #subject {
    display: none;
  }

  /* makes cursor default on breadcrumb item (not 'home') */
  #curated-breadcrumb > ul > li:nth-child(2) > span {
    cursor: default;
  }

  /* eliminates round selection on some breadcrumb elements */
  #breadcrumb *,
  #curated-breadcrumb * {
    border-radius: 0;
  }

  /* flexes breadcrumb elements into row */
  #breadcrumb ul,
  #curated-breadcrumb ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 30px 0 0 0;
    height: 80px;
  }

  #breadcrumb ul li,
  #curated-breadcrumb ul li {
    font-size: 1.2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    max-width: 200px;
    font-family: var(--paragraphFont);
  }

  #breadcrumb ul li *,
  #curated-breadcrumb ul li * {
    text-align: start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    flex-flow: row;
    line-height: 20px;
    color: var(--breadcrumbText-color);
  }

  #breadcrumb li + li::before,
  #curated-breadcrumb li + li::before {
    /* padding: 0px;*/
    /* No padding between links on mobile */
    content: "\276d";
    /* MEDIUM RIGHT-POINTING ANGLE BRACKET ORNAMENT */
    font-size: 1.6rem;
    padding: 10px;
  }

  /* Hides pagemacro background and border, overrides font color */
  #breadcrumb .action,
  #curated-breadcrumb .action {
    background: none;
    color: var(--breadcrumbText-color);
    line-height: 1.5rem;
  }

  /* Hides right arrow img */
  #breadcrumb button[data-popup-id] img,
  #curated-breadcrumb button[data-popup-id] img {
    display: none;
  }

  /**making cursor default on search template 'search' breadcrumb element**/
  .search #breadcrumb > ul:nth-child(2) > li:nth-child(2) span:nth-child(1),
  .search
    #curated-breadcrumb
    > ul:nth-child(2)
    > li:nth-child(2)
    span:nth-child(1) {
    cursor: default;
  }

  /* ================================================================================================================================================ */
  /* =========================================================STORY PAGES STYLING==================================================================== */
  /* =================================================================================================================================================*/
  /*.content #logo img, .results #logo img {
    margin-top: 10px;
  }*/

  /* puts X axis padding on everything under breadcrumb */
  .content #content {
    padding: 0px 5%;
  }

  /* PAGE TOOLS MENU ABOVE MAIN */
  .content form#actions {
    background: inherit;
    border-bottom: 1.5px solid grey;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row nowrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    flex-flow: row nowrap;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    margin-top: 10px;
  }

  /* eliminates pagemacro border and splits tools and ratings inside container */
  .content #toolbar,
  #rating {
    border: none;
    width: 50%;
  }

  /* Actions */
  /* "Tools" and "Rate" font styling */
  .content form#actions {
    font-size: 1.2rem;
    color: black;
  }

  /* alignment of "Tools" and "Rate" */
  #actions fieldset legend {
    position: relative;
    padding: 0;
    left: 0;
    top: -10px;
  }

  /* Toolbar buttons */
  #actions #toolbar button {
    padding: 0 2px;
    cursor: pointer;
  }

  #actions #toolbar button img {
    opacity: 0.5;
    width: 1.8rem;
  }

  #actions #toolbar button#decrease img {
    width: 1.3rem;
  }

  #actions #rating button {
    cursor: pointer;
  }

  /* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
  /* ===================Content Area============================ */
  /* sizing and centering any images that appear in story content */
  .content #copy img {
    display: block;
    max-width: 300px;
    height: auto;
    margin: auto;
  }

  /* Heading */
  .content #copy h1 {
    font-size: 300%;
    color: var(--storyH1-color);
    text-align: center;
    line-height: 1.2;
  }

  .content #copy h2 {
    font-size: 125%;
    font-weight: bold;
  }

  .content #copy > div {
    color: var(--storyParagraph-color);
    font-size: 180%;
  }

  /* making list bullets */
  .content #copy ol,
  .content #copy ul li {
    list-style: disc outside;
    /*text-indent: -2rem;*/
    /* padding-left: 2rem; */
  }

  .content #copy ul,
  .content ol,
  .textBlock.services ul {
    padding-left: 4rem;
  }

  .content #copy li {
    margin: 1rem 0;
  }

  /* styling any tables that may appear */
  .content #content div table {
    max-width: 100%;
    margin: auto;
    text-align: center;
  }

  .content #publisher {
    color: var(--storyParagraph-color);
  }

  /* Image Gallery */
  .content #related h1 {
    color: var(--storyH1-color);
    font-size: 2.5rem;
    text-align: center;
    width: 100%;
  }

  /* overlay on images */
  .content .blurb.overlaid > footer {
    position: absolute;
    height: 100%;
    width: 100%;
    bottom: 0;
    left: 0;
  }

  .content .blurb.overlaid > footer p {
    margin: 0;
    height: 100%;
  }

  .content .blurb.overlaid > footer a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
  }

  /* image on hover buttons */
  .content .blurb.overlaid > footer a > span {
    visibility: hidden;
    position: relative;
    top: calc(50% - 4rem);
    font-size: 1.4rem;
  }

  .content .blurb.overlaid > footer a:hover,
  .content .blurb.overlaid > footer a:focus {
    -webkit-transition: ease-in-out 0.3s;
    -o-transition: ease-in-out 0.3s;
    transition: ease-in-out 0.3s;
  }

  .content .blurb.overlaid > footer a:hover > span,
  .content .blurb.overlaid > footer a:focus > span {
    visibility: visible;
  }

  /* centers image containers on screen */
  .content #related article {
    margin: auto;
  }

  /* flexes images */
  .content aside.trifold {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    flex-flow: row wrap;
    gap: 20px;
    border: none;
  }

  /* styling image containers */
  .content .blurb.compact {
    width: 100%;
    min-height: 169px;
    min-width: 350px;
    max-width: 350px;
    color: var(--storyImageText-color);
    padding: 0;
  }

  /* hiding h2 (the word article) */
  .content .blurb.compact h2 {
    display: none !important;
  }

  /*injected paragraph on image overlay*/
  .content .blurb.compact div p {
    display: none !important;
  }

  /* makes image appear above overlay/text */
  .content .blurb.compact img {
    width: 100%;
    /* height: 140px; */
  }

  /* IMAGE SCALE ON HOVER */
  .content .blurb.animated:hover > figure img {
    -webkit-transform: scale(1.02);
    -ms-transform: scale(1.02);
    transform: scale(1.02);
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
  }

  /* gallery text box transperancy/color */
  .content .blurb.compact > header {
    background-color: var(--storyImageOverlay-color);
    padding: 0 15px;
    height: 60px;
    width: 100%;
    bottom: 0;
    position: absolute;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

  .content aside.trifold article h3 {
    font-size: 1.4rem;
    font-weight: 600;
  }

  /* }====================================================================================== */
  /* }====================================EXTERNAL RESOURCE================================= */
  .resourceButton {
    display: inline-block;
    background: var(--button-color);
    color: var(--buttonText-color);
    padding: 10px 20px;
    border-radius: var(--line-round);
    margin: 20px auto;
  }

  .resourceButton:hover {
    background: var(--buttonOnHover-color);
    color: var(--buttonTextOnHover-color);
    -webkit-transition: 0.4s ease;
    -o-transition: 0.4s ease;
    transition: 0.4s ease;
  }

  /* }====================================================================================== */
  /* }====================================================================================== */

  /* ================================================================================================================================================ */
  /* =========================================================TOPIC PAGES STYLING====================================================================== */
  /* ===================================================================================================================================================*/
  /* makes heading at top of content 100% to prevent flexing */
  .results section#subject {
    width: 100%;
    height: auto;
  }

  /* sizes carousel image to fit */
  .results .blurb.elastic {
    height: calc(100% - 1.5rem);
  }

  /* removes pagemacro zoom out effect on hover */
  .results .blurb.animated:hover > figure img {
    -webkit-transform: scale(1.02);
    -ms-transform: scale(1.02);
    transform: scale(1.02);
  }

  /* Hides topic page header text */
  .results #related.projector > header {
    display: none;
  }

  /* removes margin underneath causing whitespace */
  /* .results main #breadcrumb ul {
     margin: 0;
   } */
  /* removes pagemacro rounded edge/border radius on carousel */
  .results aside .carousel .elastic.animated {
    border-radius: 0;
    max-height: 500px;
    /*max height of topic hero image*/
    padding: 0 !important;
    z-index: 0;
  }

  /* PageMacro™ Blurb - Animated. */
  .blurb.animated > figure img {
    -webkit-transition: ease-in-out 0.5s;
    -o-transition: ease-in-out 0.5s;
    transition: ease-in-out 0.5s;
  }

  /* removing page macro "@768px width 50%" to let image fit entire container */
  .results .blurb.elastic > * {
    width: unset;
    /*removed !important from width 7/19/22*/
  }

  /* Hero image sizing */
  .results aside .carousel .elastic.animated img {
    margin: 0;
    width: 100vw !important;
    /*max-height: 500px !important;*/
    position: relative;
  }

  /* changes zoom out from pagemacro to zoom in */
  .results aside .carousel .elastic.animated img:hover {
    -webkit-transform: scale(1.02);
    -ms-transform: scale(1.02);
    transform: scale(1.02);
  }

  /* Setting container for position nested elements */
  .results #related.projector {
    position: relative;
  }

  /* overlay on heading text inside carousel */
  .results .carousel .elastic.animated header {
    background: var(--backgroundOverlay-color);
    color: var(--topicCarouselText-color);
    width: 100% !important;
    position: absolute !important;
    z-index: 1000 !important;
    bottom: 0;
  }

  /* Styling and positioning of carousel big text and image overlay */
  .results .carousel .elastic.animated h3 {
    bottom: 0px;
    width: 100%;
    font-size: 1.4em;
  }

  /* Carousel button position and style */
  .results aside#related.projector .back,
  .results aside#related.projector .next {
    /* max-width: 48px; */
    /* max-height: 48px; */
    position: absolute;
    top: 25%;
    z-index: 2;
  }

  .results aside#related.projector .back {
    left: 10px;
  }

  .results aside#related.projector .next {
    right: 10px;
  }

  /* Hides Carousel heading, paragraph, and button */
  .results #related.projector h2,
  .results #related.projector .carousel article > div {
    display: none;
  }

  .results .carousel {
    min-height: 133px;
  }

  /* overlay on hero image */
  .results #related .carousel .elastic.animated footer {
    width: 100vw !important;
    max-width: 1920px;
    height: 100%;
    display: none;
    z-index: 1000;
    position: absolute;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

  .results #related .carousel .elastic.animated:hover footer,
  .results #related .carousel .elastic.animated:focus footer,
  .results #related .carousel .elastic.animated:active footer {
    background: var(--backgroundOverlay-color);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
  }

  /* Hides other "area-controls filled" buttons */
  .results aside#related .controls.area-filled .list {
    display: none;
  }

  .results .playlist ol li a {
    font-size: 2rem;
    font-family: initial;
  }

  /*Styling carousel navigation bulletpoints*/
  .results .projector .controls .playlist .entry.active a {
    font-weight: bolder;
    font-size: 3rem;
  }

  .results .projector .controls button.play.running {
    margin-top: 6px;
  }

  .results .projector .controls button.list ~ .playlist {
    background: transparent;
    display: block;
  }

  .results .projector .controls ol {
    display: flex;
    gap: 1rem;
    justify-content: end;
    /* align-items: center; */
    line-height: 3rem;
  }

  .results .playlist ol li:first-child {
    position: absolute;
    left: 4rem;
    /*margin-bottom: .5rem;*/
  }

  /* Play pause button on topic/query page carousel */
  .results aside#related .controls.area-filled {
    border: none;
    height: auto;
    width: 100%;
    background: none;
    position: absolute;
    bottom: 4px;
    justify-content: end;
  }

  @media screen and (min-width: 450px) {
    .results .playlist ol li a {
      font-size: 4rem;
    }

    /*Styling carousel navigation bulletpoints*/
    .results .projector .controls .playlist .entry.active a {
      font-weight: bolder;
      font-size: 5rem;
    }

    .results .projector .controls button.play.running {
      margin-top: 10px;
    }
  }

  @media screen and (min-width: 1024px) {
    .results .projector .controls ol {
      gap: 3rem;
    }
  }

  /* =================content area====================== */
  .results section#results {
    padding: 0 5%;
    margin-top: 10px;
  }

  /* Hides filters into hamburger menu on small screen */
  .results form#filter {
    display: none;
  }

  .results #results button {
    color: var(--buttonText-color);
  }

  /* removing heading and paragrah per Web8 */
  .results #results #subject header h2,
  #results #subject div {
    display: none !important;
  }

  /* styling content heading */
  .results #results #subject h3 {
    font-size: 2rem;
    font-weight: 400;
    color: var(--topicHeading-color);
    font-family: var(--h1Font-family);
  }

  .results #results #subject article {
    padding: 0;
    margin: auto;
  }

  .results #results ol {
    list-style: none;
  }

  .results article.match {
    border: none;
    border-bottom: solid 1px var(--contactBorder-color);
    border-radius: 0;
    font-size: 1.2rem;
  }

  /* Article Titles */
  .headline {
    color: var(--link-color);
  }

  /* un-bolding "updated" at bottom of article */
  .results .match .updated {
    font-weight: 300;
  }

  .results .match .summary,
  .match .length,
  .match .updated {
    color: var(--topicHeading-color);
  }

  /**
   * PageMacro™ Match.
   */
  .match {
    padding: 1rem;
    margin: 1rem auto;
    border-radius: var(--line-round);
    border: var(--line-width) solid var(--line-color);
  }

  .match img {
    height: 1.6rem;
    vertical-align: text-top;
  }

  .match img:not(.stars) {
    opacity: 0.5;
  }

  .match .kicker {
    margin: 0;
    display: inline;
    font-size: 125%;
  }

  .match .kicker img {
    vertical-align: baseline;
  }

  .match .headline {
    margin: 0;
    display: inline;
    font-size: 125%;
  }

  .match .excerpt {
    margin: 1rem auto;
  }

  .match .updated time {
    color: darkgray;
  }

  .match .updated::after {
    content: "\2014";
    color: darkgray;
  }

  .match .metadata {
    margin: 0;
    color: darkgray;
  }

  .match .metadata > * {
    padding-right: 0.5rem;
  }

  /* ==========Filter popup overlay=============================== */

  .results .action img {
    width: 1rem;
    height: 1rem;
  }

  .results .dialog #filter {
    width: 100%;
    padding: 2%;
  }

  /* Hides the h2/word "filter" */
  .results .dialog #filter h2 {
    display: none;
  }

  /* filter boxes styling and pagemacro border overriding */
  .results .dialog #sorting,
  .results .dialog #category {
    border: 1px solid black;
    padding-left: 10%;
    font-size: 1.8rem;
    width: 100%;
    color: black;
    border-radius: 4px;
  }

  /* centers "apply" button */
  .results .dialog #filter footer {
    text-align: center;
  }

  /* gives apply button spacing below  */
  .results #filter footer button {
    margin-top: 20px;
  }

  /* ============================================================================================================================================== */
  /* =========================================================Learning Center====================================================================== */
  /* ===============================================================================================================================================*/

  .learning .trifold > :not(h1) {
    -webkit-box-flex: 1;
    -ms-flex: 1 0;
    flex: 1 0;
  }

  /* removes all centers list from showing up on learning center breadcrumb */
  .learning div#centers,
  .resource-page div#centers {
    display: none;
  }

  /* ribbon styling */
  .learning #subject h1 {
    font-family: var(--h2Font-family);
    color: var(--featuredText-color);
    text-transform: uppercase;
    font-size: 3rem;
    font-weight: 400;
    margin: 40px 30px;
  }

  #learning-center-title span b {
    font-weight: 400;
  }

  /* notepad and webinar */
  .learning .learningheader {
    height: 620px;
    background: var(--carouselBackground-color);
  }

  .learning .learningheader h1 + article {
    margin: 0;
  }

  /* "Notepad" styling */
  .learning .learningheader .notepad {
    color: var(--notePadText-color);
    font-size: 1.3rem;
    background-image: url("https://web.personaladvantage.com/images/learning-centers/tile_notebook.webp");
    background-repeat: no-repeat;
    margin: 20px auto 0 auto;
    padding: 40px 50px 0 50px;
    height: 300px;
    width: 300px;
    max-width: 470px;
    max-height: 470px;
    background-size: 100%;
  }

  /* video sizing */
  .lcmainvideo {
    width: 80%;
    max-width: 450px;
  }

  /* keeps video fully visible (bottom was getting cut off) */
  .learning .learningheader > article + article {
    height: auto;
    min-height: 300px;
  }

  /* hiding source text */
  .learning figcaption {
    display: none;
  }

  .learning .learning-hero {
    background-size: cover;
    background-repeat: no-repeat;
  }

  @media screen and (max-width: 1024px) {
    .learning .learning-hero article > p {
      background: var(--heroOverlay-color);
      font-size: 2rem !important;
      width: 80% !important;
      margin: 5% auto;
    }

    .learning .learning-hero {
      background-position: center !important;
      height: 400px;
    }
  }

  .learning .learning-hero article > p {
    background: rgba(255, 255, 255, 0.8);
    font-size: 3rem;
    width: 50%;
    border-radius: var(--line-round);
    padding: 3rem;
  }

  .calculators-page #sitemap.curated-sitemap ul li {
    padding-left: 0rem;
    font-family: var(--paragraphFont);
  }

  /* Learning Center hero images */
  .learning .learning-hero.anger {
    background-image: url("https://cdn.personaladvantage.com/images/learning-centers/anger-banner.webp");
    background-position: center !important;
  }

  .learning .learning-hero.anxiety {
    background-image: url("https://cdn.personaladvantage.com/images/learning-centers/anxiety-banner.webp");
    background-position: center !important;
  }

  .learning .learning-hero.budgeting {
    background-image: url("https://cdn.personaladvantage.com/images/learning-centers/budgeting-and-saving-banner.webp");
    background-position: center !important;
  }

  .learning .learning-hero.depression {
    background-image: url("https://cdn.personaladvantage.com/images/learning-centers/depression-banner.webp");
    background-position: center !important;
  }

  .learning .learning-hero.digital-wellness {
    background-image: url("https://cdn.personaladvantage.com/images/learning-centers/digital-wellness-banner.webp");
    background-position: center !important;
  }

  .learning .learning-hero.general-wellbeing {
    background-image: url("https://cdn.personaladvantage.com/images/learning-centers/general-wellbeing-banner.webp");
    background-position: center !important;
  }

  .learning .learning-hero.goal-setting {
    background-image: url("https://cdn.personaladvantage.com/images/learning-centers/goal-setting-banner.webp");
    background-position: center !important;
  }

  .learning .learning-hero.grief {
    background-image: url("https://cdn.personaladvantage.com/images/learning-centers/grief-banner.webp");
    background-position: center !important;
  }

  .learning .learning-hero.investing {
    background-image: url("https://cdn.personaladvantage.com/images/learning-centers/investing-banner.webp");
    background-position: center !important;
  }

  .learning .learning-hero.kids {
    background-image: url("https://cdn.personaladvantage.com/images/learning-centers/raising-resilient-kids-banner.webp");
    background-position: center !important;
  }

  .learning .learning-hero.loneliness {
    background-image: url("https://cdn.personaladvantage.com/images/learning-centers/loneliness-banner.webp");
    background-position: center !important;
  }

  .learning .learning-hero.relationships {
    background-image: url("https://cdn.personaladvantage.com/images/learning-centers/relationships-banner.webp");
    background-position: center !important;
  }

  .learning .learning-hero.resilience {
    background-image: url("https://cdn.personaladvantage.com/images/learning-centers/building-resilience-banner.webp");
    background-position: center !important;
  }

  .learning .learning-hero.retirement {
    background-image: url("https://cdn.personaladvantage.com/images/learning-centers/retirement-banner.webp");
    background-position: center !important;
  }

  .learning .learning-hero.substance {
    background-image: url("https://cdn.personaladvantage.com/images/learning-centers/substance-misuse-banner.webp");
    background-position: center !important;
  }

  .learning .learning-hero.stress {
    background-image: url("https://cdn.personaladvantage.com/images/learning-centers/stress-banner.webp");
    background-position: center !important;
  }

  .learning .learning-hero.totalcare {
    background-image: url("https://cdn.personaladvantage.com/images/learning-centers/total-care-banner.webp");
    background-position: center !important;
  }

  .learning .learning-hero.workplace {
    background-image: url("https://cdn.personaladvantage.com/images/learning-centers/building-a-respectful-workplace-banner.webp");
    background-position: center !important;
  }

  .learning .learning-hero.calculators {
    background-image: url("https://cdn.personaladvantage.com/images/posters/calculators_banner.png");
    background-position: center !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  .learning .learning-hero.assessments {
    background-image: url("https://cdn.personaladvantage.com/images/posters/assessments_banner.png");
    background-position: center !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  .learning .learning-hero.trainings {
    background-image: url("https://cdn.personaladvantage.com/images/posters/training_banner.png");
    background-position: center !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  .learning .learning-hero.webinars {
    background-image: url("https://cdn.personaladvantage.com/images/posters/webinars_banner.png");
    background-position: center !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  .learning .learning-hero.legal-forms {
    background-image: url("https://cdn.personaladvantage.com/images/posters/legalforms_banner.png");
    background-position: center !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  .learning .learning-hero.news {
    background-image: url("https://cdn.personaladvantage.com/images/posters/news.webp");
    background-position: center !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  /* added 10/11/23 */
  .learning .learning-hero.newsletters {
    background-image: url("https://cdn.personaladvantage.com/images/posters/newsletters.webp");
  }
  .learning .learning-hero.marketing {
    background-image: url(https://cdn.personaladvantage.com/images/posters/marketing.webp);
  }
  /* added 10/11/23 */
  .learning .learning-hero.learning-centers {
    background-image: url("https://cdn.personaladvantage.com/images/posters/learning-centers.webp");
  }

  .learning .learning-hero.learning-centers article p,
  .learning .learning-hero.newsletters article p,
  .learning .learning-hero.marketing article p {
    font-size: 3rem;
    background: none;
  }

  .two-column h2.learning-center-column-heading {
    margin-left: 1rem;
    font-weight: bold;
    font-size: 2.4rem;
  }

  .learning.calculators-page.curated-content
    .textBlock.services
    .two-column
    ul
    li
    a {
    color: black;
  }

  /* =============quadfold section================= */
  /* flexing containers into row */
  .quadfoldIcons {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    flex-flow: row wrap;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    padding: 5% 0;
    color: black;
  }

  .quadfoldIcons article header {
    height: 60%;
    /*transparent overlay*/
    background: rgba(255, 255, 255, 0.6);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 302px;
    /* align-items: center !important; */
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    /* padding-bottom: 10% !important; */
    position: absolute;
    bottom: 0;
  }

  .quadfoldIcons header h2 {
    font-family: var(--h2Font-family);
    font-size: 4rem;
    margin: 0;
  }

  .quadfoldIcons header h3 {
    font-size: 1.5rem;
    font-weight: 400;
    padding: 0 10px;
    /*gives small text in container horizontal padding*/
  }

  /* removes pagemacro min-height effecting safari display */
  /* .quadfold .blurb.compact {
    min-height: 0 !important;
  } */
  /* setting image container size */
  .quadfold article {
    width: 290px;
    height: 300px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 1.5rem;
  }

  /* keeps bg images from skewing on small screens */
  .quadfold .blurb.compact figure {
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
  }

  /* flexing items inside footer images */
  .quadfold article * {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  .quadfoldIcons header img {
    -webkit-transform: scale(0.8);
    -ms-transform: scale(0.8);
    transform: scale(0.8);
  }

  /* flexes container text into column */
  .quadfoldText {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  /* makes entire container clickable */
  .quadfold article a {
    width: 300px !important;
  }

  /* hides on hover button */
  .quadfold .blurb.overlaid > footer a:hover,
  .quadfold .blurb.overlaid > footer a:focus {
    background-color: transparent !important;
  }

  /* check this functionality -mf 4/14 */
  .quadfold article a span {
    display: none;
  }

  /* sizing gallery icons inside container */
  .quadfold article header {
    padding: 0px 25px;
  }

  /* ==========================More resources section======================== */
  #moreresources {
    border: 1px solid var(--ribbonBackground-color);
    width: 90%;
    text-align: center;
    font-size: 2rem;
    padding: 0 10%;
    margin: 0 auto 20px auto;
  }

  /* hides more resources popup */
  .moreresources > div {
    display: none;
  }

  /* More resources heading */
  #moreresources h1 {
    margin-bottom: 0;
    margin: -38px auto 0 auto;
    font-family: var(--h2Font-family);
    color: var(--featuredText-color);
    font-size: 5rem;
    background: white;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    padding: 1rem;
  }

  /* flexing more resources icons into row */
  #moreresources .moreresources {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    flex-flow: row wrap;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  /* more resource Icons */
  .moreresourcebutton {
    width: 37px !important;
    height: 37px !important;
    opacity: 1 !important;
  }

  /* icon background (circles) */
  .moreresourcebuttonog {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    /* flex-direction: row wrap; */
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--carouselBackground-color);
    width: 37px !important;
    height: 37px !important;
    padding: 40px;
    border-radius: 50%;
    margin: 0 20px 0 0;
  }

  /* button positioning and styling*/
  .moreresources button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 200px;
    height: 180px;
    text-align: start !important;
    color: black;
    font-size: 2.5rem;
  }

  /* More resources popups */
  .learning div.dialog {
    padding: 20px;
  }

  .moreResourcesPopup {
    width: 100%;
    padding: 20px;
  }

  /* dialog popup heading text styling */
  .moreResourcesPopup h2 {
    font-family: var(--h2Font-family);
    font-size: 6rem;
    color: black;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: auto;
  }

  /* positioning popup icon */
  .moreResourcesPopup > img {
    position: absolute;
    top: 20px;
    left: 20px;
  }

  /* removes left padding in more-resources popup item list */
  .moreResourcesPopup ul {
    padding: 0;
  }

  /* aligning images and text centrally */
  .moreResourcesPopup li * {
    vertical-align: middle;
  }

  .moreResourcesPopup li {
    margin: 20px 0;
    line-height: 25px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  /* popup paragraph text color */
  .moreResourcesPopup a {
    font-size: 2rem;
    color: var(--popupText-color);
  }

  @media screen and (min-width: 768px) {
    .moreResourcesPopup a {
      font-size: 2.6rem;
      line-height: 1.2;
    }

    /* Play pause button on topic/query page carousel */
    .results aside#related .controls.area-filled {
      bottom: 8px;
    }
  }

  hr#bottom {
    display: none;
  }

  /* ===========carousel========================== */
  .learning .projector header,
  .resource-page .projector header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

  /* sizing view featured and view all buttons*/
  .learning footer.controls button,
  .resource-page footer.controls button {
    font-size: 1.4rem;
    width: 80px;
    height: 60px;
    overflow: visible;
    color: var(--carouselText-color);
  }

  /* carousel paragraph font size */
  .learning .projector p,
  .resource-page .projector p {
    font-size: 1.2rem;
  }

  /* removes scroll bar on carousel paragraph */
  .learning .projector div,
  .resource-page .projector div {
    overflow: visible;
  }

  /* carousel view all learning centers popup text */
  .learning #centers li,
  .resource-page #centers li {
    font-size: 1.8rem;
    color: var(--popupText-color);
  }

  /* ================================================================================================================================================ */
  /* =========================================================FEEDBACK============================================================================== */
  /* ==================================================================================================================================================*/
  .feedback * {
    max-width: 1920px;
    text-align: center;
    font-size: 1.6rem;
  }

  .feedback h1 {
    font-size: 2rem;
  }

  .feedback img {
    width: 80%;
    max-width: 400px;
    margin: auto;
  }

  .feedback form {
    max-width: 60%;
    max-width: 800px;
    margin: auto;
  }

  /* ================================================================================================================================================ */
  /* ====================================================History and Favorite======================================================================== */
  /* ==================================================================================================================================================*/
  .history .navbar,
  .history .topbar,
  .library .navbar,
  .library .topbar {
    display: none;
  }

  #results #recent {
    font-size: 3rem;
    padding-left: 3rem;
  }

  .history .search ol,
  .library .search ol {
    width: 98%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    margin: auto;
  }

  .history .search ol li,
  .library .search ol li {
    width: 90%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    line-height: 20px;
    margin: auto;
    padding: 0 0 2rem 3rem;
    text-align: left;
    vertical-align: middle;
    border-bottom: 1px solid black;
  }

  .history .search ol li label img,
  .library .search ol li label img {
    display: none;
  }

  .history .search ol li label input,
  .library .search ol li label input {
    top: 18px;
    left: -30px;
    right: unset;
    display: none;
  }

  .history .search ol li a,
  .library .search ol li a {
    text-decoration: none;
    font-size: 1.6rem;
    line-height: 2rem;
  }

  .history .search ol li:hover,
  .library .search ol li:hover {
    background: rgb(255, 222, 222);
    font-size: 110%;
  }

  .history a,
  .library a {
    color: black;
    padding-bottom: 10px;
  }

  .history form label,
  .library form label {
    margin: 0;
  }

  /* .history .search ol li a:hover{
      text-decoration: underline;
      font-size: 110%;
    } */
  /*==Favorites Page==*/
  .library .search ol li label input {
    display: inline;
    top: 23px;
  }

  #delete-fav {
    position: absolute;
    top: 3rem;
    left: 0rem;
    background: transparent;
    border: none;
  }

  #delete-fav img {
    width: 36px;
    height: 36px;
  }

  /* ===============POSTCARD============================ */
  .postcard {
    padding: 20px;
  }

  .postcard figure div img {
    width: 50%;
    margin: auto;
  }

  /* Training Course Form */
  .training form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    margin: 1rem;
    width: 50%;
  }

  .training form input {
    margin: 1rem;
    width: 80%;
  }

  .training form input:last-child {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
  }

  .additionalforminfo {
    display: none;
  }

  /* =============================Curated============================================ */
  /*.curated-content{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }*/
  .curated-sitemap ul li:nth-child(n + 4) {
    display: none;
  }

  .show-list {
    display: block !important;
  }

  .webinar video {
    max-width: 1200px;
  }

  /*bolds and italicizes webinar page disclaimer*/
  .webinar#copy i {
    font-style: italic;
    font-weight: bold;
  }

  #sitemap.upcoming-webinars {
    display: flex;
    flex-flow: column;
    margin: auto;
    width: 100%;
  }

  #sitemap .upcoming-webinars h2 {
    cursor: default;
  }

  #upcoming-webinar-sitemap {
    padding: 3rem 0rem;
    display: flex;
    flex-flow: row wrap;
    gap: 4rem;
    justify-content: center;
  }

  #upcoming-webinar-sitemap > section {
    break-inside: avoid;
    width: 98%;
  }

  .learningheader.calculators article {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row;
    flex-flow: row;
  }

  .learningheader.calculators article p {
    font-size: 4rem !important;
    background: none;
    font-family: var(--h2Font-family);
    margin: 0;
    padding: 0;
  }

  .calculators-page main > section #sitemap ul li h2::before,
  .upcoming-webinars h2:before {
    content: "•";
    font-size: 100%;
    padding-right: 5px;
  }

  .calculators-page main > section #sitemap ul li h2,
  .upcoming-webinars h2 {
    text-indent: -1.5rem;
  }

  .calculators-page main > section #sitemap .subject a {
    color: black;
    line-height: 1.5;
  }

  #upcoming-webinar-sitemap h1 {
    margin: 0;
  }

  #sitemap.curated-sitemap ul,
  #upcoming-webinar-sitemap ul {
    padding-left: 1.5rem;
    margin: 1rem 0;
    border-top: 1px solid black;
    width: 80%;
    padding-top: 1rem;
  }

  .upcoming-webinars h2 {
    line-height: 2.5rem;
    margin: 0;
    font-weight: normal;
  }

  .upcoming-webinars p {
    font-size: 1.6rem;
    margin: 1rem 0;
  }

  #sitemap.curated-sitemap h1 {
    margin: 1.2rem 0;
  }

  #sitemap.curated-sitemap > section > div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1rem;
  }

  #sitemap.curated-sitemap img {
    max-height: 34px;
  }

  .curated-sitemap button {
    margin-bottom: 1rem;
    font-size: 1.8rem;
    color: var(--sitemapCurated-color);
    border-radius: 0;
  }

  /* for new curated sitemap 7/5/22 */
  /* #sitemap.curated-sitemap section li:nth-child(n + 5) {
    display: none;
  } */
  #sitemap.curated-sitemap {
    /*display: inline-block;*/
    width: 100%;
    /*-webkit-column-break-inside: avoid;
       -moz-column-break-inside: avoid;
            break-inside: avoid;*/
    /*columns: 1;*/
  }

  #sitemap.curated-sitemap section {
    width: 100%;
    display: block;
    break-inside: avoid;
  }

  #sitemap.curated-sitemap section:last-child:nth-child(2) {
    display: block;
  }

  /* #sitemap.curated-sitemap section:nth-child(5) {
    break-after: column;
  } */
  .column-break {
    break-after: column;
    break-after: always;
  }

  .sitemap-last-section {
    padding-bottom: 6rem;
  }

  .learning.calculators-page
    .learningheader
    article.blurb.animated.overlaid.compact.noborder {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 6rem;
  }

  .learning.calculators-page
    .learningheader
    article.blurb.animated.overlaid.compact.noborder
    p
    + p {
    font-size: 2rem !important;
    padding: 0 2rem;
    font-family: var(--paragraphFont);
  }

  .chevron::after {
    border-style: solid;
    border-width: 0.1em 0.1em 0 0;
    content: "";
    display: inline-block;
    height: 0.45em;
    left: 1em;
    position: relative;
    top: 0.4em;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    vertical-align: top;
    width: 0.45em;
  }

  .chevron.right:after {
    left: 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
  }

  .chevron.bottom:after {
    top: 0;
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg);
  }

  .chevron.left:after {
    left: 0.25em;
    -webkit-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
    transform: rotate(-135deg);
  }

  #content.custom-article article {
    padding: 2rem;
  }

  .custom-article p {
    font-size: 2rem;
  }

  .custom-article ul {
    padding-left: 4rem;
  }

  .custom-article td,
  .custom-article th,
  .content td,
  .content th {
    border: 1px solid black;
    font-size: 1.8rem;
    width: fit-content;
    padding: 1rem;
  }

  .content section#content.custom-article {
    width: 100%;
  }

  #sitemap.newsworthy h2 {
    margin-bottom: 2rem;
  }

  .newsworthy a {
    padding: 1rem 4rem 0 0;
    font-size: 2rem;
    color: var(--sitemapPersonal-color);
    border-top: 1px solid black;
  }

  /* =================About ================ */
  .about main {
    flex-flow: column nowrap;
    margin: 1rem auto;
  }

  .about h1 {
    font-size: 2rem;
    font-weight: bold;
  }

  .about .topbar {
    text-align: center;
  }

  .about #personal {
    padding: 0 1em;
  }

  .about #email {
    padding: 0 1em;
    display: flex;
    flex-direction: column;
    /*align-items: end;
    justify-content: space-between;*/
  }

  .about button {
    background: var(--aboutButton-color);
    color: var(--buttonText-color);
    border-radius: 5px;
  }

  .about #email > ul,
  .about #email > p,
  .about #email li {
    width: 100%;
  }

  .about .about-p {
    padding: 1em;
  }

  .about #file {
    text-align: center;
  }

  /* Webinar Disclaimer/overlay */
  .action.webinar-disclaimer {
    font-size: 1.4rem;
  }

  button.action.webinar-disclaimer {
    padding: 1rem;
  }
}

@media all and (min-width: 330px) {
  /* ================================================================================================================================================ */
  /* =========================================================TOPIC PAGES STYLING===================================================================== */
  /* ==================================================================================================================================================*/
  /* overlay on heading text inside carousel */
  .results .carousel .elastic.animated header {
    min-height: -webkit-fit-content;
    min-height: -moz-fit-content;
    min-height: fit-content;
    padding: 2%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  /* Styling and positioning of carousel big text */
  .results .carousel .elastic.animated h3 {
    /* font-size: 1.6rem; */
    margin: 0 auto;
    max-width: 70%;
  }

  /* Carousel button position and style */
  .results aside#related.projector .back,
  .results aside#related.projector .next {
    top: 35%;
  }
}

@media all and (min-width: 768px) {
  /* ================================================================================================================================================ */
  /* =========================================================STORY PAGES STYLING==================================================================== */
  /* =================================================================================================================================================*/
  /* eliminates logo top margin when  */
  /* .content #logo img, .results #logo img {
    margin-top: 50px;
  }  */
  /* puts X axis padding on everything under breadcrumb */
  .content #content {
    padding: 0px 30px;
  }

  /* BREADCRUMB */
  #breadcrumb,
  #curated-breadcrumb {
    width: 100%;
  }

  /* breadcrumb font color/size */
  #breadcrumb ul li,
  #curated-breadcrumb ul li {
    font-size: 1.8rem;
    max-width: unset;
  }

  /* Arrows between links */
  #breadcrumb li + li:before,
  #curated-breadcrumb li + li:before {
    padding: 10px;
    /* Adding between links on desktop */
    font-size: 2rem;
  }

  /* aligns "Tools" and "Rate" hoirzontally with icons for larger screens */
  .content #actions fieldset {
    /* display: flex; */
    position: relative;
    padding-left: 4rem;
  }

  /* aligns "Tools" and "Rate" hoirzontally with icons for larger screens */
  .content #actions fieldset legend {
    position: absolute;
    /* padding: 0; */
    left: 0;
    top: 0px;
  }

  /* ===================Content Area============================ */
  /* Heading */
  .content #copy h1 {
    font-size: 300%;
    text-align: start;
  }

  /* .content #copy > div {
     font-size: 2.3rem;
   } */
  /* ================================================================================================================================================ */
  /* =========================================================TOPIC PAGES STYLING====================================================================== */
  /* ===================================================================================================================================================*/

  /* Styling and positioning of carousel big text and image overlay */
  .results .carousel .elastic.animated h3 {
    font-size: 2rem;
  }

  .results .projector .controls button.play.running {
    margin-top: 2px;
  }

  /* styling content heading */
  .results #results #subject h3 {
    font-size: 4rem;
    text-align: start;
  }

  /* keeping any story images centered within content */
  .content #copy img {
    max-width: 600px;
  }

  /* .results .playlist ol li:first-child {
    margin: .1rem 0 0 0;
  } */
  /* ===================================================================================================================================================== */
  /* ==========================================================Learning Center============================================================================ */
  /* ===================================================================================================================================================== */

  .learning footer.controls button,
  .resource-page footer.controls button {
    font-size: 1.6rem;
    width: 80px;
    height: 60px;
    overflow: visible;
  }

  .learning .projector p,
  .resource-page .projector p {
    font-size: 1.6rem;
  }

  /* ================================================================================================================================= */
  /* ======================================================Curated==================================================================== */
  /* ================================================================================================================================= */
  #sitemap.curated-sitemap {
    columns: 300px 2;
    column-count: 2;
  }

  #sitemap.curated-sitemap section {
    width: 80%;
    min-height: 100%;
    margin: auto;
  }

  #upcoming-webinar-sitemap {
    gap: 17rem;
  }

  #upcoming-webinar-sitemap > section {
    break-inside: avoid;
    width: 34%;
  }

  /*====History and Favorites =====*/
  .history .search ol li,
  .library .search ol li {
    margin: auto 4rem;
  }

  /* register */
  .register ul.orgList {
    width: 92%;
    font-size: 1rem;
  }
}

@media all and (min-width: 1024px) {
  /* ================================================================================================================================================ */
  /* =========================================================STORY PAGES STYLING==================================================================== */
  /* =================================================================================================================================================*/
  /* flexing all content in page for horizontal text and gallery alignment */
  .content main.storyMain {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    flex-flow: row wrap;
  }

  /* keeps ribbon full width when flexing main container */
  .content section#subject {
    width: 100%;
    height: auto;
  }

  /* narrowing text content to make room for gallery on right */
  .content section#content {
    width: 70%;
  }

  /* image flexing into column */
  .content aside.trifold {
    width: 30%;
    -ms-flex-flow: column nowrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-flow: column nowrap;
    -ms-flex-item-align: start;
    -ms-grid-row-align: start;
    align-self: start;
    gap: 40px;
    padding: 0 10px 0 0 !important;
  }

  /* gallery overlay text box */
  /* .content aside .blurb.compact > header {
    height:60px;
  } */
  /* Gallery bottom text */
  .content aside.trifold article h3 {
    font-size: 1.6rem;
    margin: auto;
  }

  /* ================================================================================================================================================ */
  /* =========================================================TOPIC PAGES STYLING====================================================================== */
  /* ===================================================================================================================================================*/

  /* overlay on heading text inside carousel */
  /* .results .carousel .elastic.animated header {
    height: 20% !important;
  } */
  /* Play pause button on topic/query page carousel */
  .results aside#related .controls.area-filled {
    bottom: 16px;
  }

  /* Styling and positioning of carousel big text and image overlay */
  .results .carousel .elastic.animated h3 {
    font-size: 3rem;
    max-width: 80%;
  }

  /* styling content heading ("Featured Resources")*/
  .results #results #subject h3 {
    margin-top: 50px;
    width: 100%;
  }

  /* UnHides filters from hamburger menu on large screens */
  .results form#filter {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: end;
  }

  .results #results #subject article {
    padding: 0;
    margin: auto;
  }

  /* Hides filter button on desktop */
  .results #results span.action {
    display: none;
  }

  /* flexing articles and filter into columns */
  .results #results {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    /* width: 50%; */
  }

  /* flexing articles and filter into columns */
  .results #results ol {
    width: 75%;
    padding: 0 5% 0 0;
  }

  /* increases all content font size */
  .results #results ol article {
    font-size: 1.8rem;
  }

  /* flexing articles and filter into columns */
  .results #results #filter {
    width: 25%;
  }

  /* flexing filter into it's own column */
  .results #filter {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 30%;
    font-size: 1.8rem;
    font-weight: 300;
    color: var(--topicPageFilterText);
    text-align: start;
    white-space: nowrap;
  }

  /* gives legend text space so border lines don't touch text */
  .results fieldset legend {
    padding: 0 10px;
  }

  /* Hides the h2/word "filter" */
  .results #filter h2 {
    display: none;
  }

  /* filter boxes (sorting and category) styling and pagemacro border overriding on big screen */
  .results #sorting,
  .results #category {
    border: 1px solid black;
    width: 100%;
    padding-left: 2%;
    max-width: 330px;
    min-width: 280px;
  }

  /* adds vertical space between 2 filter boxes */
  .results #sorting {
    margin-bottom: 60px;
  }

  /* centers "apply" button */
  .results #filter footer {
    text-align: center;
    width: 100%;
    /*to match sorting and category width*/
    margin-top: 25px;
    max-width: 330px;
    min-width: 280px;
  }

  /* Making stars larger on desktop */
  .results .stars {
    height: 50%;
  }

  /* ============================================================================================================================================== */
  /* =========================================================Learning Center====================================================================== */
  /* ===============================================================================================================================================*/
  /* ribbon styling */
  .learning #subject h1 {
    font-size: 6rem;
  }

  /* notepad and webinar */
  .learning .learningheader {
    height: 500px;
    padding: 0 10%;
  }

  .learning .learningheader article.blurb.animated.overlaid.compact.noborder {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

  /* "Notepad" styling */
  .learning .learningheader .notepad {
    font-size: 2rem;
    padding: 70px 70px 0 70px;
    height: 430px;
    width: 430px;
  }

  /* video sizing */
  .lcmainvideo {
    width: 100%;
    max-width: 800px;
    padding-right: 0%;
  }

  /* button styling*/
  .moreresources button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  /* LC carousel font size and styling */
  .learning .projector p,
  .resource-page .projector p {
    font-size: 1.8rem;
    padding: 0 10%;
  }

  /* LC carousel "view featured" and "view all" buttons */
  .learning footer.controls button,
  .resource-page footer.controls button {
    font-size: 1.8rem;
    width: 120px;
    height: 80px;
  }

  /* ==================================================================================== */
  /* =======================================Curated=====================================*/
  /* ================================================================================= */
  .learningheader.calculators article p {
    font-size: 9rem !important;
  }

  .learningheader.calculators article p:first-of-type {
    line-height: 10rem;
  }

  .learning.calculators-page
    .learningheader
    article.blurb.animated.overlaid.compact.noborder
    p
    + p {
    font-size: 3rem !important;
  }

  .learning .learning-hero.learning-centers article p,
  .learning .learning-hero.newsletters article p,
  .learning .learning-hero.marketing article p {
    font-size: 6rem;
  }
}

@media screen and (min-width: 1450px) {
  /* Play pause button on topic/query page carousel */
  .results aside#related .controls.area-filled {
    bottom: 18px;
  }

  .results .projector .controls button.play.running {
    margin-top: 0px;
  }
}

@media screen and (min-width: 1600px) {
  /*============CURATED===============*/
  #upcoming-webinar-sitemap {
    gap: 19rem;
  }

  .featured-webinar {
    width: 36%;
    padding-left: 1rem;
  }

  .learning .learning-hero.learning-centers article p,
  .learning .learning-hero.newsletters article p {
    font-size: 8rem;
  }
}

@media all and (min-width: 1800px) {
  /* ================================================================================================================================================ */
  /* =========================================================STORY PAGES STYLING==================================================================== */
  /* =================================================================================================================================================*/

  /* styling image containers */
  .content .blurb.compact {
    min-height: 266px;
    max-width: 500px;
  }

  /* gallery overlay text box */
  .content aside .blurb.compact > header {
    height: 80px;
  }

  /* makes image appear above overlay/text */
  .content .blurb.compact img {
    width: 100%;
    height: 186px;
  }

  /* overlay bottom text */
  .content aside.trifold article h3 {
    font-size: 2rem;
  }

  /* ======================================================================================================= */
  /* ========================================Topic Page============================================ */
  /* ======================================================================================================= */
  /* overlay on heading text inside carousel */
  .results .carousel .elastic.animated header {
    padding: 2%;
  }

  /* Styling and positioning of carousel big text */
  .results .carousel .elastic.animated h3 {
    max-width: 90%;
  }

  /* Play pause button on topic/query page carousel */
  .results aside#related .controls.area-filled {
    bottom: 20px;
  }

  /* .results .playlist ol li:first-child {
    margin: 1rem 0 0 0;
	} */

  /*============CURATED===============*/
  #upcoming-webinar-sitemap {
    gap: 22rem;
  }

  #upcoming-webinar-sitemap > section {
    width: 37%;
  }
}

/* ======================================================================================================= */
/* ========================================    Course forms   ============================================ */
/* ======================================================================================================= */
.forguestsonly {
  display: none;
}

/*========================================register.html================================================*/
.register select {
  height: auto !important;
  overflow: auto !important;
  cursor: pointer;
}

.register fieldset {
  position: relative;
}

.register .orgList {
  background-color: white;
  margin: 0px;
  text-align: left;
  padding: 0;
  position: absolute;
  width: 89%;
  z-index: 1;
  font-size: 0.9rem;
}

.register .orgList li {
  cursor: pointer;
}

.register .orgList li:hover {
  background-color: #f5f5f5;
}

.register .orgList li:not(:first-child) {
  border-top: 1px solid #dadada;
}

.register option {
  cursor: pointer;
}

.login-back-button {
  background: url(https://web.personaladvantage.com/images/icons/goBack.png);
  background-repeat: no-repeat;
  background-size: 24px;
  width: 100px;
  margin: 0 auto;
}

/*========================================Locators================================================*/
.learning.calculators-page #locators:not(#sitemap #locators) {
  padding: 0 1rem;
}

.learning.calculators-page #locators iframe {
  border: none;
}

.learning.calculators-page #locators > h1 {
  padding: 0 0 1rem 6rem;
  font-size: 2rem;
  font-weight: 900;
  border-bottom: 2px solid #dadada;
}

.locators {
  padding: 0 0 0 6rem;
}

.locators #code,
.locators #city,
.locators #radius {
  border: none;
  width: 80%;
  margin: 1rem 0;
}

.locators fieldset legend {
  display: none;
}

.locators fieldset label {
  display: flex;
  gap: 2rem;
}

.locators fieldset label input,
.locators fieldset label select {
  width: 300px;
  min-width: 200px;
  font-size: 1.6rem;
}

.locators fieldset label b {
  width: 100%;
  font-size: 1.8rem;
}

.locators fieldset h2 {
  width: 50%;
  text-align: center;
}

.caregiver {
  width: 50%;
}

.locators #results footer p button {
  margin-left: 6rem;
}

.locators .match {
  border: unset;
  border-bottom: 1px solid #dadada;
  border-radius: 0;
}

.locators .match:hover {
  background-color: #dadada;
}

.locators * span {
  display: block;
  color: black;
  font-size: 1.6rem;
  margin: 0.4rem 0;
}

.locators * span a {
  color: black;
}

.locators .distance span {
  display: inline;
}

.locators .match .headline span {
  font-size: 1.8rem;
  font-weight: bold;
}

.locators #results ol {
  list-style: none;
}

@media screen and (max-width: 450px) {
  .locators {
    padding: 0;
  }

  .locators fieldset label {
    flex-flow: column;
  }
}