.pipeline {
  @media screen and (max-width: 1360px) {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;

    .container {
      margin: 0 !important;
      padding: 0 !important;
    }
  }

      .desktop {
        @media screen and (max-width: 1360px) {
          display: none !important;
        }
    }

  .text-blue {
    color: #0077CF;
  }

  .text-magenta {
      color: #BE2090;
  }

  .text-black {
      color: #000000;
  }

  .legend {
    margin-top: 4.3rem;
    font-family: "nexa", sans-serif;
    font-weight: 900;
    font-style: heavy;
    font-size: 18px;
    margin-bottom: 50px;

    .circle {
      height: 15px;
      width: 15px;
      margin-right: .5rem;
    }
    
    span  {
      margin-right: 3rem;
    }
  }

  .pd-verticaltext {
    padding-left: 0 !important;
    background-color: white;
    font-family: Nexa-XBold !important;
    font-size: 24px;
  }

   #mkPipeline,
  .pd-mk-pipeline__table {
    border-bottom: 2px solid black !important;

    thead {
      tr {
        th {
          color: #BE2090 !important;
          font-size: 24px;
          border-bottom: 1px solid #3C3C3C;
          padding: 10px !important;

          &:first-of-type {
            padding-left: 0 !important;
          }
        }
      }
    }

    td {
      background-color: white !important;
      max-width: 400px !important;
      border-bottom: 1px solid #EDEAEA;
      padding: 0 20px !important;

      &:first-of-type {
        padding-left: 0 !important;
      }
    }

    .section-bar--magenta,
    .section-bar--blue {
      border-bottom: 1px solid #EDEAEA !important;
    }

    .pd-mk-pipeline__product-name {
      width: unset !important;
      padding: 1.25rem !important;
      a,
      span {
        font-size: 24px !important;
        line-height: 29px;
      }

      .product-name {
        strong {
          @include Nexa-XBold;
          font-weight: 900 !important;
          font-family: "Nexa-Xbold" !important;
        }
      }

      .subtitle {
        font-family: Nexa;
        font-weight: 400;
        font-style: Regular;
        font-size: 18px !important;
        leading-trim: NONE;
        line-height: 100%;
        letter-spacing: 0%;
        color: #464646
      }

      small {
        display: inline !important;
      }
    }

    .text-1,
    .text-2 {
      padding: 20px !important;
      text-align: right;
      border: 0 !important;

      table {
        td {
          border: 0 !important;
        }
      }

    }

    .text-2 {
      border-top: 1px solid #EDEAEA !important;
    }

    .pd-mk-pipeline__product-text
    {
      width: unset !important;
      background-color: white !important;
      border-right: 1px solid #E0E0E0;
      padding: 0 !important;
      font-family: "nexa", sans-serif;
      font-weight: 300;
      font-style: Book;
      font-size: 20px;
      leading-trim: NONE;
      line-height: 100%;
      letter-spacing: 0%;
      text-align: right;

      
      small {
        font-size: 20px;
      }
    }

    .pd-mk-pipeline__product-text-2 {
      font-family: "nexa", sans-serif;
      font-weight: 300;
      font-style: Book;
      font-size: 20px;
      leading-trim: NONE;
      line-height: 100%;
      letter-spacing: 0%;
      text-align: right;
    }

    .graph-table {
      position: relative;
      left: -1.25rem;
      width: 105%;

      td {
        border: 0 !important;
        padding: 20px 0 !important;
      }
    }

    .pd-mk-pipeline__graph-line {
      border-radius: 0 2rem 2rem 0;
      color: white;
      text-align: right;
      padding: .75rem;
      font-size: 16px;
      font-weight: 900 !important;
      font-family: "nexa", sans-serif;
      font-style: heavy;

      &::after {
        display: none;
      }


      .under-bar {
        display: block;
        color: #464646;
        margin-top: .75rem;
        font-family: "nexa", sans-serif;
        font-weight: 700;
        font-style: Bold;
        font-size: 18px;
        leading-trim: NONE;
        line-height: 100%;
        letter-spacing: 0%;
        text-align: right;


        strong {
          @include Nexa-XBold;
          font-weight: 900;
          font-family: "Nexa-Xbold" !important;
        }
      }
    }

    .graph-bar--magenta {
      .pd-mk-pipeline__graph-line {
        background-color: #BE2090 !important;
        background-image: unset !important;
      }
    }

    .graph-bar--blue {
      .pd-mk-pipeline__graph-line {
        background-color: #0077CF !important;
        background-image: unset !important;
      }
    }

    .undisclosed {
      font-family: "nexa", sans-serif;
      font-weight: 900;
      font-style: Heavy;
      font-size: 18px;
      leading-trim: NONE;
      line-height: 100%;
      letter-spacing: 0%;
      text-align: center;

    }
  }

  .pd-mk-pipeline__separator {
    height: 1px;
    background: #E0E0E0;
    margin: 2rem 0;
  }

  .wp-block-buttons {
    @media screen and (max-width: 768px) {
      margin-left: 3.5rem !important;
      margin-bottom: 2rem !important;
    }
  }

  .wp-element-button {
    background-color: white !important;

    border-radius: 0 !important;
    color: #BE2090 !important;
    margin-top: 3.5rem;
    padding: .5rem 1rem;
    font-size: 21px;
    background: url('/wp-content/themes/mannkindcorp-theme/images/dl-arrow.svg') no-repeat right 1rem center/1.5rem;
    padding-right: 4rem;
    position: relative;

    @media screen and (max-width: 768px) {
      font-size: 12px;
      left: 0;
      margin-bottom: 2rem;
    }
  }

  .glossary {
    margin-top: 25px !important;
    width: 100%;

    td {
      width: 20%;
      white-space: nowrap;
    }

    .name {
      font-family: "nexa", sans-serif;
      font-weight: 900;
      font-style: Heavy;
      font-size: 18px;
      leading-trim: NONE;
      line-height: 21px;
      letter-spacing: 0%;
      padding-right: 4.5px;
      border-right: 1px solid #EDEAEA;
      display: inline-flex;
      width: 4rem; /* adjust based on longest abbreviation */
      font-weight: bold;
    }

    .name2 {
      font-family: "nexa", sans-serif;
      font-weight: 900;
      font-style: Heavy;
      font-size: 18px;
      leading-trim: NONE;
      line-height: 21px;
      letter-spacing: 0%;
      padding-right: 4.5px;
      border-right: 1px solid #EDEAEA;
      display: inline-flex;
      width: 4.25em; /* adjust based on longest abbreviation */
      font-weight: bold;
    }

    .name3 {
      font-family: "nexa", sans-serif;
      font-weight: 900;
      font-style: Heavy;
      font-size: 18px;
      leading-trim: NONE;
      line-height: 21px;
      letter-spacing: 0%;
      padding-right: 4.5px;
      border-right: 1px solid #EDEAEA;
      display: inline-flex;
      width: 3rem; /* adjust based on longest abbreviation */
      font-weight: bold;
    }

    .description {
      font-family: "nexa", sans-serif;
      font-weight: 900;
      font-style: Heavy;
      font-size: 18px;
      leading-trim: NONE;
      line-height: 21px;
      letter-spacing: 0%;
      display: inline-block;
      vertical-align: top;
      margin-left: 0.4em;
      margin-right: 1rem;
    }
  }
}