@charset "UTF-8";
/**
 * CONTENTS
 *
 * SETTINGS
 * Global...............File-specific variables and config.
 *
 * BASE
 * 
 *
 * OBJECTS
 * Wrappers.............Wrapping and constraining elements.
 *
 * COMPONENTS
 * action-row...........A pattern for a row of calls-to-action
 * 
 * SECTIONS
 * fund-top.............Styles specific for top section
 * fund-actions
 * fund-steps
 *
 * TRUMPS
 * Text.................Text helpers.
 */
/*------------------------------------*   #SETTINGS
   #global
 \*------------------------------------*/
/*------------------------------------*  #BASE
  #
\*------------------------------------*/
/*------------------------------------*  #OBJECTS
  #wrappers
\*------------------------------------*/
.disease-container {
  max-width: 1200px;
  margin: 0 auto; }

.big-container {
  max-width: 1800px; }

.flex-center {
  display: flex;
  align-items: center;
  justify-content: center; }

@media (max-width: 599px) {
  .no-mobile {
    display: none; } }

/*------------------------------------*  #COMPONENTS
\*------------------------------------*/
/*------------------------------------*  #SECTIONS
\*------------------------------------*/
/*------------------------------------*  #disease-top
\*------------------------------------*/
.disease-top {
  color: white;
  padding: 64px 24px 96px;
  font-size: 0.75em;
  background: url("https://www.mda.org/files/mda-frontend/diseases/list/list-top.jpg") 90% 60% no-repeat;
  background-size: cover;
  text-align: center; }
  .disease-top h1 {
    font-size: 2.6em;
    line-height: 1.2em; }
    @media (min-width: 600px) {
      .disease-top h1 {
        font-size: 2.6em;
        line-height: 1.3em; } }
  .disease-top p {
    font-size: 1.4em;
    max-width: 750px;
    margin: 0 auto; }
  @media (min-width: 900px) {
    .disease-top {
      font-size: 1em;
      min-height: 500px;
      background: url("https://www.mda.org/files/mda-frontend/diseases/list/list-top.jpg") center no-repeat;
      background-size: cover;
      padding: 204px 32px 84px; }
      .disease-top .fund-goright {
        max-width: 500px;
        margin: 0 0 16px auto; } }

/*------------------------------------*  #disease-search
\*------------------------------------*/
.disease-search {
  min-width: 280px;
  margin-top: 32px;
  font-size: 1.25em; }
  @media (min-width: 900px) {
    .disease-search {
      font-size: 1em;
      min-width: 550px; } }

.search-list {
  position: absolute;
  top: calc(100% - 2px);
  width: 100%;
  max-height: 300px;
  overflow-y: scroll;
  overflow-x: hidden;
  margin: 0;
  padding: 0;
  list-style: none;
  background: white;
  font-size: 0.9em;
  border: 1px solid #d9d9d9;
  z-index: 10;
  transition: opacity 100ms linear; }
  .search-list a:link, .search-list a:visited {
    color: #414042; }
  .search-list li {
    text-align: left;
    padding: 12px 16px;
    border-bottom: 1px solid #d9d9d9;
    color: #414042; }

.list--hidden {
  opacity: 0;
  pointer-events: none; }

.search-list__inner-list {
  list-style: none;
  border-top: 1px solid #d9d9d9;
  margin: 0;
  padding: 0;
  margin-top: 16px; }
  .search-list__inner-list li {
    padding-left: 24px; }
    .search-list__inner-list li:hover, .search-list__inner-list li:focus {
      background: #f1b434;
      color: white; }

/*------------------------------------*  #disease-list
\*------------------------------------*/
.disease-list .disease-container {
  display: flex;
  flex-flow: column nowrap;
  padding: 24px 0 84px; }
  @media (min-width: 900px) {
    .disease-list .disease-container {
      flex-flow: row nowrap; } }

.disease-list .disease-half {
  flex: 1; }

.disease__class {
  padding: 16px 32px; }
  .disease__class h2 {
    border-top: 2px solid #d9d9d9;
    padding-top: 32px; }
  .disease__class:first-child h2 {
    border-top: 0; }

.disease__list {
  list-style: none;
  margin: 0;
  padding: 0; }
  .disease__list li {
    padding: .5em; }
  .disease__list ul {
    font-size: 0.9rem;
    list-style: none;
    padding-left: 8px;
    padding-top: 8px; }
    .disease__list ul li:before {
      content: '•';
      position: relative;
      left: -8px; }
  .disease__list ul ul li:before {
    content: '- '; }

/*------------------------------------*  #disease-contact
\*------------------------------------*/
.disease-contact {
  text-align: center;
  padding: 32px 16px 48px; }
  .disease-contact p {
    max-width: 850px;
    margin: 0 auto;
    font-size: 0.8em; }
    @media (min-width: 900px) {
      .disease-contact p {
        font-size: 1.2em; } }
  .disease-contact .tk-media {
    align-items: center; }
  .disease-contact .tk-media-figure img {
    height: 100px;
    width: 100px;
    border-radius: 50%;
    border: 5px solid white;
    box-shadow: 0 0 2px #999; }
    @media (min-width: 900px) {
      .disease-contact .tk-media-figure img {
        height: 180px;
        width: 180px; } }
  .disease-contact:after {
    content: '';
    height: 115%;
    width: 100%;
    position: absolute;
    top: -15%;
    left: 0;
    background: #FBFBFB url("https://www.mda.org/files/mda-frontend/diseases/list/bottom.jpg") bottom center no-repeat;
    background-size: contain;
    z-index: -1; }
  @media (min-width: 600px) {
    .disease-contact:after {
      background-position: top center;
      background-size: cover; } }