/* images */
/* fonts */
/* Noto Sans */
/* Montserrat */
/* DIN */
.card ul {
  padding: 0; }
  .card ul > li {
    background: none;
    list-style-type: none;
    padding: 0; }
    .card ul > li:before {
      display: none;
      content: none; }
  .card ul ul {
    margin: 5px 0 8px; }
    .card ul ul > li {
      padding: 0 0 0 10px;
      margin: 0 0 5px; }

.card-thumbnail h3 a:hover, .list.managed ul h3 a:hover, .feature-primary .featured-text a:hover, .feature-secondary a:hover, .topic-feature a:hover, .guide-card .card ul.cancer-types li a:hover, a.arrow-link:hover, a.arrow-link-white:hover, .multimedia-slot .feature-card:hover, .multimedia h3 a:hover, .infographic-enlarge a:hover, .card-thumbnail h3 a:focus, .list.managed ul h3 a:focus, .feature-primary .featured-text a:focus, .feature-secondary a:focus, .topic-feature a:focus, .guide-card .card ul.cancer-types li a:focus, a.arrow-link:focus, a.arrow-link-white:focus, .multimedia-slot .feature-card:focus, .multimedia h3 a:focus, .infographic-enlarge a:focus {
  color: #BB0E3D;
  text-decoration: none; }

/**
 * The following variable and function originate from the sass-mq library.
 * If you have already included it, you can eliminate the below
 * https://github.com/sass-mq/sass-mq/blob/master/_mq.scss
 */
.hero-call-to-action::after, a.arrow-link::before, a.arrow-link-white::before, a.arrow-link:hover::before, a.arrow-link-white:hover::before, a.toggle-arrow-link::after, a.toggle-arrow-link:hover::after, a.toggle-arrow-link:focus::after, .guide-card--home ul a.arrow-link-white::before, .guide-card--home ul a.arrow-link-white:hover::before, .guide-card--home ul .card__view-more a.arrow-link-white::before,
.guide-card--home ul .card__view-more a.arrow-link::before, .guide-card--home ul .card__view-more a.arrow-link-white:hover::before,
.guide-card--home ul .card__view-more a.arrow-link:hover::before, .infographic-enlarge a::before {
  display: inline-block;
  background-image: url(../images/sprites/svg-sprite.svg);
  background-size: 12em 265.9375em; }

/* BEGIN THUMBNAIL CARDS ROW */
.card-thumbnail .card-thumbnail, .list.managed ul .card-thumbnail, .card-thumbnail .list.managed ul, .list.managed .card-thumbnail ul, .list.managed ul ul {
  margin-left: 0;
  margin-right: 0; }

.card-thumbnail, .list.managed ul {
  background: #FFFFFF;
  padding-top: 1em;
  padding-bottom: 1em; }
  .card-thumbnail .card-thumbnail:hover a.image-hover, .list.managed ul .card-thumbnail:hover a.image-hover, .card-thumbnail .list.managed ul:hover a.image-hover, .list.managed .card-thumbnail ul:hover a.image-hover, .list.managed ul ul:hover a.image-hover {
    background-color: #000000; }
  .card-thumbnail .card-thumbnail:hover img, .list.managed ul .card-thumbnail:hover img, .card-thumbnail .list.managed ul:hover img, .list.managed .card-thumbnail ul:hover img, .list.managed ul ul:hover img {
    opacity: .8; }
  .card-thumbnail .card-thumbnail:hover a, .list.managed ul .card-thumbnail:hover a, .card-thumbnail .list.managed ul:hover a, .list.managed .card-thumbnail ul:hover a, .list.managed ul ul:hover a {
    color: #BB0E3D; }
  .card-thumbnail h3, .list.managed ul h3 {
    margin-top: 0.5em; }
  .card-thumbnail .small-2, .list.managed ul .small-2 {
    margin-top: 1em; }
  .card-thumbnail .image-hover, .list.managed ul .image-hover {
    display: block; }
    .card-thumbnail .image-hover img, .list.managed ul .image-hover img {
      width: 100%; }
    .card-thumbnail .image-hover:hover, .list.managed ul .image-hover:hover, .card-thumbnail .image-hover:focus, .list.managed ul .image-hover:focus {
      background-color: #000000; }
      .card-thumbnail .image-hover:hover > img, .list.managed ul .image-hover:hover > img, .card-thumbnail .image-hover:focus > img, .list.managed ul .image-hover:focus > img {
        opacity: 0.8; }
  .card-thumbnail h3, .list.managed ul h3 {
    font-weight: normal; }

@media only screen and (max-width: 640px) {
  .card-thumbnail h3, .list.managed ul h3 {
    margin-top: 0;
    font-size: 1.125em;
    line-height: 1.111em; }
  .card-thumbnail .small-2, .list.managed ul .small-2, .card-thumbnail .small-3, .list.managed ul .small-3 {
    display: none; }
  .card-thumbnail .small-10, .list.managed ul .small-10, .card-thumbnail .small-9, .list.managed ul .small-9 {
    width: 100%; }
  /* no gutter on left and right in mobile */
  .card, .card-thumbnail div, .list.managed ul div {
    padding-right: 0;
    padding-left: 0; } }

/* END THUMBNAIL CARDS ROW */
/* BEGIN Hero Section */
.row .hero, .list.managed .hero {
  position: relative;
  padding-left: 0;
  padding-right: 0;
  box-shadow: 0 11px 15.2px 0.8px rgba(0, 0, 0, 0.4); }
  .row .hero .row, .list.managed .hero .row, .row .hero .list.managed, .list.managed .hero .list.managed {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    margin-bottom: 0;
    max-width: 62.5em; }
    @media only screen and (min-width: 1441px) {
      .row .hero .row, .list.managed .hero .row, .row .hero .list.managed, .list.managed .hero .list.managed {
        max-width: 1200px; } }
    .row .hero .row .hero-text, .list.managed .hero .row .hero-text, .row .hero .list.managed .hero-text, .list.managed .hero .list.managed .hero-text {
      left: auto;
      padding: 0 0 0 8px; }
      @media only screen and (min-width: 1441px) {
        .row .hero .row .hero-text, .list.managed .hero .row .hero-text, .row .hero .list.managed .hero-text, .list.managed .hero .list.managed .hero-text {
          padding-left: 20px; } }

.hero-slot {
  margin-bottom: 1em; }

.hero-inner-page {
  position: relative;
  margin-bottom: 1em;
  padding-left: 0;
  padding-right: 0; }

.hero-text {
  position: absolute;
  top: 49px;
  left: 90px;
  color: #FFFFFF;
  width: 23%;
  font-size: 1.55em;
  font-weight: bold; }
  .hero-text p {
    line-height: 1.1;
    margin-top: 0.7em;
    font-weight: bold; }
  .hero-text a {
    color: #FFFFFF; }
    .hero-text a:hover, .hero-text a:focus {
      text-decoration: none; }

@media only screen and (max-width: 1024px) {
  .hero-text {
    position: absolute;
    bottom: 0;
    color: white;
    background-color: rgba(10, 21, 28, 0.8);
    font-size: 1.2em;
    font-weight: bold;
    width: 100%;
    padding: 0 0.8em;
    left: 0;
    top: auto; }
  .hero-text p {
    line-height: 1;
    margin: 0.2em; } }

/* Used on Cancer Types hero */
.hero-call-to-action {
  display: inline-block;
  font-size: 18px; }
  .hero-call-to-action:hover::after, .hero-call-to-action:focus::after {
    -webkit-transform: translateX(0.5em) rotate(90deg);
            transform: translateX(0.5em) rotate(90deg); }
  .hero-call-to-action::after {
    content: '';
    font-size: .85em;
    width: 1.25em;
    height: 0.78125em;
    background-position: 5.84795% 21.92621%;
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
    transition: -webkit-transform 0.4s ease-in-out;
    transition: transform 0.4s ease-in-out;
    transition: transform 0.4s ease-in-out, -webkit-transform 0.4s ease-in-out; }

@media only screen and (max-width: 640px) {
  .hero-slot {
    display: none; } }

@media only screen and (min-width: 1025px) {
  .row.hero-slot, .hero-slot.list.managed {
    max-width: 1350px; }
  .row .large-4.gutter, .list.managed .large-4.gutter {
    width: 32%;
    margin-left: 2%; }
  .row .large-6.gutter, .list.managed .large-6.gutter {
    width: 48.5%;
    margin-left: 2%; }
  .row .gutter:first-child, .list.managed .gutter:first-child {
    margin-left: 0; } }

/* END Hero Section */
/* BEGIN CARDS GENERAL RULES */
/* equal height cards for desktop, visually push a div to the bottom of it's container */
.card {
  padding-top: 1em;
  background-color: #FFFFFF;
  /* for IE browsers that don't understand rgba */
  background-color: rgba(255, 255, 255, 0.8); }
  .card a:hover .image-hover, .card a:focus .image-hover {
    background-color: #000000; }
    .card a:hover .image-hover img, .card a:focus .image-hover img {
      opacity: 0.8; }
  .card a:hover, .card a:focus {
    text-decoration: none; }
  .card .equalheight > div, .card .equalheight > div > a {
    height: 100%; }
  .card-row .card a {
    color: #2e2e2e; }
  .card ul > li {
    margin: 0; }

/* END CARDS GENERAL RULES */
/********************* BEGIN Home Page Styles ******************************************/
h1 {
  margin-top: .58em; }

p:not(.site-name):not(.site-link) {
  margin: 0.5em 0; }

.ui-accordion .ui-accordion-header,
.ui-accordion div.ui-accordion-content {
  margin-left: -32px;
  margin-right: -32px; }

.ui-accordion div.ui-accordion-content {
  padding: 10px 10px 10px 21px; }

/* BEGIN FEATURE AND SECONDARY PRIMARY CARDS ROW */
.feature-primary .rawHtml,
.feature-primary .rawHtml .featured-text {
  height: 100%; }

.feature-primary {
  margin-bottom: 1em; }
  .feature-primary a,
  .feature-primary a h3 {
    color: #FFFFFF; }
  .feature-primary h3 {
    font-weight: normal;
    color: #FFFFFF;
    font-size: 1.375em;
    line-height: 1.272; }
  .feature-primary p {
    margin-bottom: 0;
    font-size: 1.125em;
    line-height: 1.167em; }
  .feature-primary .card {
    background: #14819b; }
  .feature-primary .featured-text {
    padding: 15px;
    background: #FFFFFF;
    color: #2b7bba !important; }
    .feature-primary .featured-text a {
      padding: 0 !important;
      color: #2b7bba; }
    .feature-primary .featured-text h3 {
      color: #606060; }
    .feature-primary .featured-text p {
      margin-top: 1em;
      margin-bottom: 0.5em; }
  .feature-primary .columns {
    padding: 0; }
    .feature-primary .columns a {
      padding: 1.875em;
      display: block; }

@media only screen and (max-width: 1024px) {
  .feature-primary-title {
    background: #14819b; }
  /* fix for white space appearing on feature card row in tablet view mtn 6-22-17 */
  .row.feature-primary, .feature-primary.list.managed {
    max-width: 64.5em;
    background: #14819b; }
  .feature-primary-title h3 {
    font-size: 1.375em;
    color: white;
    padding: 0.625em 30px;
    margin: 0em; } }

@media only screen and (min-width: 1025px) {
  .feature-primary a:hover h3 {
    color: white; }
  .feature-primary-title {
    display: none; } }

.feature-secondary {
  margin-bottom: 1em; }
  .feature-secondary .card {
    background: #FFFFFF; }
  .feature-secondary h3 {
    font-size: 1.375em;
    line-height: 1.272; }
  .feature-secondary a h3 {
    font-weight: normal;
    color: #2b7bba; }
  .feature-secondary a:hover h3, .feature-secondary a:focus h3 {
    color: #BB0E3D; }
  .feature-secondary p {
    margin-bottom: 0;
    color: #2e2e2e;
    font-size: 1.125em;
    line-height: 1.167em; }
  .feature-secondary .columns {
    padding: 0; }
    .feature-secondary .columns a {
      padding: 1.875em;
      display: block; }

@media only screen and (max-width: 640px) {
  .feature-primary {
    margin-bottom: 0; }
  .feature-primary .card {
    background: #14819b; }
  .feature-primary .columns a,
  .feature-secondary .columns a {
    padding-bottom: 15px;
    padding-top: 15px;
    overflow: auto; }
  .feature-primary .image-hover,
  .feature-secondary .image-hover {
    float: left;
    width: 30%; }
  .feature-primary h3,
  .feature-secondary h3 {
    margin-top: 0;
    float: right;
    width: 70%;
    font-size: 1.13em;
    line-height: 1.111em; }
  .feature-primary a:hover h3,
  .feature-primary a:hover h3 {
    color: white; }
  .feature-primary p,
  .feature-secondary p,
  .card-thumbnail img,
  .list.managed ul img {
    display: none; }
  /* the portal pages needed these items to not hit the edge of screen on mobile only */
  .feature-primary h3,
  .feature-primary p,
  .feature-secondary h3,
  .feature-secondary p,
  .other-sites-carousel h3,
  .row.card-thumbnail h4,
  .card-thumbnail.list.managed h4,
  .list.managed ul.list.managed h4,
  .list.managed ul.row h4,
  .row.card-thumbnail h3,
  .card-thumbnail.list.managed h3,
  .list.managed ul.list.managed h3,
  .list.managed ul.row h3,
  .row.card-thumbnail p,
  .card-thumbnail.list.managed p,
  .list.managed ul.list.managed p,
  .list.managed ul.row p {
    padding-left: 15px; }
  .feature-primary .featured-text {
    display: none; } }

/* END FEATURE AND SECONDARY PRIMARY CARDS ROW */
/* BEGIN SLOTTED AND INLINE FEATURE CARDS */
.topic-feature {
  margin-bottom: 1em;
  border: 1px solid #818181;
  background-color: #FFFFFF;
  box-shadow: 0 0 9px 1px rgba(0, 0, 0, 0.15); }
  .topic-feature.card {
    padding: 0; }
    .topic-feature.card.left {
      margin-right: 1em; }
    .topic-feature.card.right {
      margin-left: 1em; }
  .topic-feature h3 {
    font-size: 1.375em;
    line-height: 1.272; }
  .topic-feature a {
    padding: 1.875em;
    display: block; }
    .topic-feature a h3 {
      font-weight: normal;
      color: #2b7bba; }
    .topic-feature a:hover h3, .topic-feature a:focus h3 {
      color: #BB0E3D; }
  .topic-feature p {
    margin-bottom: 0;
    color: #2e2e2e;
    font-size: 1em;
    line-height: 1.167em; }
  .topic-feature .columns {
    padding: 0; }
    .topic-feature .columns a {
      padding: 1.875em;
      display: block; }
  .topic-feature .feature-card div {
    margin-bottom: 1em; }
  .topic-feature .feature-card h3 {
    margin-top: 0;
    font-size: 1.2em;
    line-height: 1.2; }
  .topic-feature .feature-card p {
    line-height: 1.375;
    font-size: 0.9em;
    color: #757575; }

@media only screen and (max-width: 640px) {
  .topic-feature {
    margin: 1.25em 0; }
    .topic-feature a:hover {
      color: white; }
    .topic-feature.columns a {
      padding-bottom: 15px;
      padding-top: 15px;
      overflow: auto; }
    .topic-feature.card.left, .topic-feature.card.right {
      float: none !important;
      margin: 1.25em 0; }
    .topic-feature .image-hover {
      float: left;
      width: 30%; }
    .topic-feature:not(.no-image) .feature-card h3, .topic-feature:not(.no-image) .feature-card p {
      float: right;
      width: 68%; }
    .topic-feature:not(.no-image) .feature-card h3 {
      margin-top: 0;
      font-size: 1.13em;
      line-height: 1.111em; }
  .feature-primary .card {
    background: #14819b; } }

.blog-feature a:hover h3, .blog-feature a:focus h3 {
  color: #BB0E3D; }

/* END SLOTTED AND INLINE FEATURE CARDS */
/* BEGIN GUIDE CARDS ROW */
.guide-card {
  margin-bottom: 1em; }
  .guide-card .card {
    padding: 2.375em 2em; }
    .guide-card .card ul {
      margin-bottom: 0; }
    .guide-card .card h2 {
      margin-top: 0;
      font-size: 1.5em; }
    .guide-card .card a {
      font-size: 1.125em;
      line-height: 1.22222em; }
    .guide-card .card li {
      margin-top: 0.25em;
      margin-bottom: 0.25em; }
    .guide-card .card ul.cancer-types li {
      background: none;
      float: left;
      width: 2.5em;
      padding-right: 0;
      margin: 0; }
      .guide-card .card ul.cancer-types li a,
      .guide-card .card ul.cancer-types li span {
        line-height: 2.046;
        font-size: 22px;
        font-size: 1.375rem; }
    @media only screen and (max-width: 765px) {
      .guide-card .card {
        width: 100%; } }

@media only screen and (max-width: 640px) {
  .guide-card {
    margin-bottom: 0;
    margin-top: 0;
    padding: 0; }
    .guide-card .card {
      background: #1d5e86;
      padding-top: 0;
      padding-bottom: 0;
      margin: 0; }
      .guide-card .card h2 {
        line-height: 1.111em;
        font-size: 1.125em; } }

a.arrow-link, a.arrow-link-white {
  padding: 1px 2em 1px 0;
  width: 100%;
  display: block;
  color: #2e2e2e;
  text-decoration: none;
  position: relative; }
  a.arrow-link:hover, a.arrow-link-white:hover {
    text-decoration: none; }
  a.arrow-link::before, a.arrow-link-white::before {
    width: 1.3125em;
    height: 1.3125em;
    background-position: 5.88235% 14.76494%;
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
    content: "";
    right: 0;
    position: absolute;
    margin-top: -8px;
    top: 39%; }
  a.arrow-link:hover::before, a.arrow-link-white:hover::before {
    width: 1.3125em;
    height: 1.3125em;
    background-position: 5.88235% 15.73352%;
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg); }

a.arrow-link-white {
  padding-right: 26px; }

@media only screen and (min-width: 641px) {
  a.arrow-link-white::before {
    width: 1.3125em;
    height: 1.3125em;
    background-position: 5.88235% 18.45027%;
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg); } }

/**** Styles for arrow links inside version toggle button ****/
a.toggle-arrow-link::after {
  content: "";
  position: absolute;
  right: 2%;
  width: 1.3125em;
  height: 1.3125em;
  background-position: 5.88235% 18.45027%;
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg); }

@media only screen and (max-width: 709px) {
  a.toggle-arrow-link::after {
    width: 1.3125em;
    height: 1.3125em;
    background-position: 5.88235% 12.04819%;
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg); }
  a.toggle-arrow-link:hover::after, a.toggle-arrow-link:focus::after {
    width: 1.3125em;
    height: 1.3125em;
    background-position: 5.88235% 15.73352%; } }

a.learn-more {
  margin-top: 1em;
  /* adding padding per #OCECREATIV-783 --sjc */ }

/* Class previously used to target homepage only with blue tint on 'Resources for' */
.guide-card--home .card {
  display: flex;
  flex-direction: column; }

.guide-card--home ul {
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  justify-content: flex-start; }
  .guide-card--home ul a.arrow-link-white {
    /* targets 'Resources For' guide card to match 'About Cancer' li styling */ }
    .guide-card--home ul a.arrow-link-white::before {
      width: 1.3125em;
      height: 1.3125em;
      background-position: 5.88235% 14.76494%;
      -webkit-transform: rotate(90deg);
              transform: rotate(90deg); }
    .guide-card--home ul a.arrow-link-white:hover::before {
      width: 1.3125em;
      height: 1.3125em;
      background-position: 5.88235% 15.73352%;
      -webkit-transform: rotate(90deg);
              transform: rotate(90deg); }
  .guide-card--home ul .card__view-more {
    /* targets last li to separate list from 'learn/view more' links  */
    padding: 3em 0 0.5em;
    margin-bottom: 0; }
    .guide-card--home ul .card__view-more a.arrow-link-white,
    .guide-card--home ul .card__view-more a.arrow-link,
    .guide-card--home ul .card__view-more a.arrow-link-white {
      /* targets last li item and adds dk blue chevron */ }
      .guide-card--home ul .card__view-more a.arrow-link-white::before,
      .guide-card--home ul .card__view-more a.arrow-link::before,
      .guide-card--home ul .card__view-more a.arrow-link-white::before {
        width: 1.3125em;
        height: 1.3125em;
        background-position: 5.88235% 12.04819%;
        -webkit-transform: rotate(90deg);
                transform: rotate(90deg); }
      .guide-card--home ul .card__view-more a.arrow-link-white:hover::before,
      .guide-card--home ul .card__view-more a.arrow-link:hover::before,
      .guide-card--home ul .card__view-more a.arrow-link-white:hover::before {
        width: 1.3125em;
        height: 1.3125em;
        background-position: 5.88235% 15.73352%;
        -webkit-transform: rotate(90deg);
                transform: rotate(90deg); }
    @media only screen and (min-width: 641px) {
      .guide-card--home ul .card__view-more {
        padding: 2em 0 0;
        margin-top: auto;
        /* align links to bottom */ } }
    @media only screen and (min-width: 769px) {
      .guide-card--home ul .card__view-more {
        margin-top: auto; } }

/* Upon resizing the browser window up from the mobile (accordion) view,
a div with a clearfix class is added that wraps around the ul of each card.
A height of 100% is added to force this clearfix div to be same height as
parent accordion in all breakpoints. */
.guide-card--home .clearfix {
  flex-grow: 1;
  height: 100%;
  /* forces entire clearfix div to be 100%  */ }
  .guide-card--home .clearfix ul {
    height: 100%;
    /* forces ul to be same height as parent clearfix inserted by jquery-ui accordion  */ }

/* END GUIDE CARDS ROW */
/* BEGIN MULTIMEDIA ROW */
.nvcgSlBodyLayout > div:last-of-type .multimedia-slot:last-child,
.nvcgSlBodyLayout > div:last-of-type .guide-card {
  margin-bottom: 0; }

.multimedia-slot {
  background: #099;
  margin-bottom: 1em;
  padding: 1em 0; }
  .multimedia-slot a:hover h3, .multimedia-slot a:focus h3 {
    color: #BB0E3D; }
  .multimedia-slot .feature-card {
    background: #FFFFFF;
    padding-bottom: 1em; }
    .multimedia-slot .feature-card h3,
    .multimedia-slot .feature-card p,
    .multimedia-slot .feature-card ul {
      padding: 0 15px; }
    .multimedia-slot .feature-card h3 {
      font-size: 1.375em;
      font-weight: normal;
      line-height: 1.272;
      color: #2b7bba; }

@media only screen and (max-width: 640px) {
  .multimedia-slot p,
  .multimedia-slot ul {
    display: none; }
  .multimedia-slot .equalheight .slot-item {
    margin-right: 15px; }
  .multimedia-slot .equalheight:last-child .slot-item {
    margin-right: 0; } }

@media only screen and (max-width: 1024px) {
  .multimedia-slot {
    padding: 1em; } }

@media only screen and (min-width: 1025px) {
  /* equal height cards for desktop, visually push a div to the bottom of it's container */
  .equalheight {
    overflow: hidden; }
  .equalheight .push-to-bottom-desktop {
    height: 100%; }
  .guide-card--home .equalheight {
    overflow: inherit; } }

.multimedia .card {
  background: none;
  opacity: 1;
  padding-left: 0; }
  .multimedia .card a {
    color: #2e2e2e; }
  .multimedia .card:hover h3 {
    color: #BB0E3D; }

.multimedia .card:last-of-type {
  padding-right: 0; }

@media only screen and (max-width: 1024px) {
  /* Multimedia row does need padding in tablet */
  .multimedia h3,
  .multimedia p {
    padding-left: 15px; } }

.multimedia-feature-card {
  background: #FFFFFF;
  padding-bottom: 1em;
  position: relative; }
  .multimedia-feature-card a {
    color: #2e2e2e; }
    .multimedia-feature-card a:before {
      text-transform: uppercase;
      position: absolute;
      z-index: 88;
      padding: 0.62em;
      color: #FFFFFF;
      background-color: #403f3f;
      right: 0;
      -webkit-transform-origin: top right;
      transform-origin: top right;
      -webkit-transform: rotate(90deg) translate(100%, -1px);
              transform: rotate(90deg) translate(100%, -1px); }
  .multimedia-feature-card h3 {
    font-size: 1.375em;
    font-weight: normal;
    line-height: 1.272;
    color: #2b7bba; }
  .multimedia-feature-card h3,
  .multimedia-feature-card p,
  .multimedia-feature-card ul {
    padding: 0 15px; }
  .multimedia-feature-card.cgvInfographic.non-playable a:before {
    content: "Infographic"; }
    html[lang="es"] .multimedia-feature-card.cgvInfographic.non-playable a:before {
      content: "Infograf\ED   a"; }
  .multimedia-feature-card.gloVideo.non-playable a:before {
    content: "Video"; }
    html[lang="es"] .multimedia-feature-card.gloVideo.non-playable a:before {
      content: "Video"; }
  .multimedia-feature-card.gloVideoCarousel.non-playable a:before {
    content: "Video Playlist"; }
    html[lang="es"] .multimedia-feature-card.gloVideoCarousel.non-playable a:before {
      content: "Lista de reproducci\F3   n de videos"; }
  .multimedia-feature-card.non-playable a.mm-additional-info:before {
    content: none; }
    html[lang="es"] .multimedia-feature-card.non-playable a.mm-additional-info:before {
      content: none; }

@media only screen and (max-width: 640px) {
  .multimedia-feature-card h3,
  .multimedia-slot .feature-card h3 {
    font-size: 1em;
    line-height: 1.125em;
    word-wrap: break-word; } }

.card > .slot-item {
  height: 100%; }

.multimedia-feature-card a,
.multimedia .feature-card a {
  display: block; }

.multimedia-slot .equalheight .slot-item {
  background-color: #FFFFFF; }

/* END MULIMEDIA ROW */
/* BEGIN Director's Row */
.directors-row h3 {
  color: #FFFFFF; }

.infographic {
  position: relative;
  /* allows for appearance of equal height cards on home page */
  background: #FFFFFF; }
  .infographic figcaption {
    padding: 0.5em 1em; }

.infographic-enlarge {
  position: absolute;
  top: 0;
  right: 0;
  color: #FFFFFF; }
  .infographic-enlarge a {
    position: relative;
    color: #FFFFFF;
    padding: 1em 2em 1em 1em;
    display: block;
    /* TODO: add this image to the sprite */
    background-color: #403f3f; }
    .infographic-enlarge a::before {
      width: 1.25em;
      height: 0.78125em;
      background-position: 5.84795% 21.92621%;
      content: "";
      position: absolute;
      top: 50%;
      right: 0.6em;
      -webkit-transform: translateY(-50%) rotate(90deg);
              transform: translateY(-50%) rotate(90deg); }

.home-director-stories {
  background: #FFFFFF;
  padding: 0.5em 1em 0.2em;
  margin-top: -10px; }

@media only screen and (max-width: 1024px) {
  .home-director-stories,
  .infographic {
    background: none; } }

/* END Director's Row */
.feature-card .image-hover {
  position: relative; }

/* News & events Item list */
.press-releases-list .list-item {
  margin: 2.5em 0; }
  .press-releases-list .list-item:first-child {
    margin-top: 1.875em; }

.press-releases-list .container .body {
  margin: 0.5em 0; }

@media only screen and (min-width: 641px) {
  .list.dynamic li.has-media .list-item-image {
    padding-right: 0; }
    .list.dynamic li.has-media .list-item-image + .title-and-desc {
      padding-left: 20px;
      padding-right: 0; } }

.list.managed {
  max-width: 62.5em;
  margin: 0 auto; }
  @media only screen and (min-width: 1441px) {
    .list.managed {
      max-width: 1200px; } }
  .list.managed h2 {
    margin-left: 15px; }
  .list.managed ul {
    padding: 1em 0; }
    .list.managed ul li.has-media > .container {
      padding: 0 0.9375em; }
    @media only screen and (min-width: 641px) {
      .list.managed ul li.has-media .list-item-image {
        width: 16.7%; } }
    .list.managed ul li.has-media .title-and-desc {
      margin-left: 0;
      padding-left: 15px; }
      @media only screen and (min-width: 641px) {
        .list.managed ul li.has-media .title-and-desc {
          margin-left: 16.7%; } }

/********************* END Home Page Styles ******************************************/
/* BEGIN Social Media section */
.row.social-media-title, .social-media-title.list.managed {
  margin-left: auto;
  margin-right: auto; }

.social-media-row {
  display: flex;
  margin-bottom: 2em; }
  .social-media-row:before, .social-media-rowafter {
    display: none; }

.social-media-card {
  flex-grow: 1;
  flex-basis: 23%;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-right: 2%;
  background: white; }
  .social-media-card .social-media-text h3 {
    text-align: center; }

.social-media-card:last-child {
  margin-right: 0; }

.social-media-card .social-media-icon {
  width: 80%;
  margin-top: 30px; }

.social-media-card .social-media-text {
  width: 80%;
  margin-bottom: 30px; }

.social-media-card .social-media-icon img {
  display: block;
  margin: 0 auto; }

.social-media-row .icon-exit-notification {
  font-size: 15px; }

@media only screen and (min-width: 901px) and (max-width: 1024px) {
  .row.social-media-title, .social-media-title.list.managed {
    padding-left: 33px; } }

@media only screen and (max-width: 900px) {
  .row.social-media-title, .social-media-title.list.managed {
    background: white;
    padding-left: 33px;
    margin-bottom: 0; }
  .social-media-row {
    flex-direction: column;
    margin-bottom: 0; }
  .social-media-card {
    flex-grow: 0;
    flex-basis: auto;
    width: 100%;
    margin: 0;
    padding: 15px 0;
    flex-direction: row;
    align-items: stretch; }
    .social-media-card:first-child {
      padding-top: 30px; }
    .social-media-card:last-child {
      padding-bottom: 30px; }
  .social-media-card .social-media-icon {
    margin-top: 0;
    width: 180px; }
    .social-media-card .social-media-icon a img {
      width: 104px;
      height: auto; }
  .social-media-card .social-media-text {
    margin-bottom: 0;
    flex-grow: 1;
    padding-right: 30px; }
  .social-media-card .social-media-text h3 {
    margin-top: 0; } }

@media only screen and (max-width: 640px) {
  .social-media-card {
    padding: 0;
    margin: 15px 0; }
    .social-media-card:first-child {
      padding-top: 0; }
  .social-media-card .social-media-icon {
    align-self: flex-start; }
    .social-media-card .social-media-icon a img {
      height: 85px;
      width: auto; } }

@media only screen and (max-width: 460px) {
  .social-media-row {
    flex-direction: row;
    flex-wrap: wrap; }
  .social-media-card {
    flex: 0 1 auto;
    width: 50%;
    flex-direction: column;
    margin-top: 0;
    margin-bottom: 25px; }
    .social-media-card:last-child {
      padding-bottom: 0; }
  .social-media-card .social-media-icon {
    align-self: inherit;
    width: 100%; }
    .social-media-card .social-media-icon a img {
      max-width: none;
      height: 100px;
      width: auto; }
  .social-media-card .social-media-text {
    padding-right: 0;
    width: 100%; }
  .social-media-card .social-media-text h3 {
    margin-top: 20px; }
  .social-media-card .social-media-text p {
    display: none; }
  .row.social-media-title, .social-media-title.list.managed {
    padding-left: 0;
    margin: 25px 0; }
  .social-media-title h2 {
    text-align: center;
    margin: 0; } }

@media only screen and (min-width: 461px) and (max-width: 900px) {
  .social-media-card .social-media-text h3 {
    margin-top: 20px;
    text-align: left; } }

/* END Social Media section */