/* PIPELINE */
.flex-ct { display: flex; }
.flex-grow { flex-grow: 1; }

.pipeline {
    margin: 0 0 0 0;
}

.pipeline a {
  text-decoration: underline;
}

/*.content-wrap .container:last-of-type .pipeline.single {
    border-bottom: 1px solid #dfddd9;
}*/

#pipeline-legend .container .row:first-of-type {
    margin: 0;
}

#pipeline-legend .container:first-child .col-sm-12 {
    border-top: 1px solid #dfddd9;
    padding-top: 20px;
}

#pipeline-legend .container:first-child .col-sm-12 .row {
    margin: 0 -15px;
    font-size: 12px;
}

.content-wrap div[data-container="block"]:not(:last-of-type) .container:last-of-type .pipeline.single {
  border-bottom: none;
}

.top-border {

}


.has-header .top-border {
    border-top: none;
}

.pipeline-header {
    overflow: hidden;
}

.pipeline-header .phases-header{
    padding: 0px 0 20px;
    background: repeating-linear-gradient(90deg, #e0e1e0, #e0e1e0 1px, #fff 1px, #fff 20%);
    background-position: -1px 0;
    background-repeat: no-repeat;
}

.pipeline-header .program-header{
    padding: 0px 0 20px;
}

.pipeline-header .program-header div {
    padding-left: 12px;
}

.pipeline-header .program-header div, .pipeline-header .phases-header .phase-title {
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: #999;
    color: #fff !important;
}
.pipeline-header .phases-header .phase-title{
    width: 20%;
}
.pipeline-product-column div {
    padding-top: 25px;
}

.pipeline-header .row div {
    color: #0d87a8;
    font-weight: bold;
}


.pipeline-rows {
    font-size: 14px;
    padding: 0;
    position: relative;
}

.pipeline-row {
    overflow: hidden;
    background-position: 0 0;
    background-repeat: repeat-y;
    margin-left: 0;
    margin-right: 0;
    display: flex;
}


.accordion-expand-btn {
    left: 0;
    top: 0;
    width: 20px;
    height: 20px;
    z-index: 1;
    margin: 0;
    padding: 0;
    margin-top: 4px;
    cursor: pointer;
}

.accordion-expand-btn::before {
    font-family: "FontAwesome";
    content: "\f05c";
    font-size: 1.25em;
    font-weight: 500;
    color: #479E6E;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.25s ease-in-out;
    transform: rotate(45deg);
}

.active-pipeline.accordion-expand-btn::before {
    transform: rotate(0deg);
}

.no-accordion-ct {
    display: block;
    width: 20px;
}

.pipeline-desc {
    padding-top: 30px;
    padding-left: 25px;
    border-top: 1px solid #e0e1e0;
    border-bottom: 1px solid #e0e1e0;
}

.pipeline-row .pipeline-product-column {
    padding-right: 0;
    padding-left: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.pipeline-row .pipeline-product-column div {
    border-bottom: 1px solid #e0e1e0;
    padding-left: 0;
    padding-top: 8px;
    padding-bottom: 8px;
    border-bottom: none;
}

.pipeline-row .pipeline-product-column div.program-title {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
    display: flex;
}

.pipeline-row .pipeline-product-column div.program-title h3 {
    margin-bottom: 0;
    margin-top: 0;
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 5px;
    width: 100%;
    font-size: 1.25em;
}

.pipeline-row .pipeline-product-column .status-value {
    color: #0d87a8;
}

.pipeline-row .partner-ct img {
    max-width: 100px;
}

.row-indications {
    overflow: hidden;
    float: left;
    width: 87%;
}

.pipeline-table-header {
    float: left;
    background: #dfddd9;
    background: #585858;
    color: #081c33;
    color: #fff;
    text-transform: uppercase;
    padding: 0.8em 1em;
    border-left: 1px solid #fff;
    text-align: center;
}

.pipeline-table-header:first-child {
    border-left: none;
}


.indication-phases .phase {
    display: inline-block;
    margin: 0;
    padding: 0;
}


.indication-phases .phase span {
    display: inline-block;
    height: 26px;
    padding: 0 7px;
    margin-bottom: 5px;
    line-height: 26px;
    background: #d5d5d5;
    position: relative;
    width: 80%;
    text-align: center;
}

.indication-phases .phase span::after {
    content: '';
    border-top: 13px solid transparent;
    border-bottom: 13px solid transparent;
    border-left: 13px solid #d5d5d5;
    position: absolute;
    top: 0;
    right: -13px;
}

.indication-phases .phase-name-ct {
    display: none;
}

#content #content-main .pipeline-bottom {
    border: 1px solid #dfddd9;
    border-bottom: 0;
    border-top: 0;
    padding: 1.4em 0.8em 1.4em 0.8em;
    margin: 0;
}

.pipeline-note span {
    display: block;
}

.indication-phases {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 15px 0;
    background: repeating-linear-gradient(90deg, #e0e1e0, #e0e1e0 1px, #fff 1px, #fff 20%);
    background-position: -1px 0;
    background-repeat: no-repeat;
    min-height: 55px;
}

.indication-phases.has-header {
    border-top: none;
}

.indication-phases .phase {
    display: inline-block;
    margin: 0;
    color: #fff;
    background-image: linear-gradient(to right, #0086a7, #489e6e);
    height: 40px;
    padding: 0 0 0 5px;
    line-height: 40px;
    width: 20%;
    text-align: left;
    position: relative;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 700;
    min-width: 60px;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
}

.indication-phases .phase:after{
    /* content: '';
    border-top: 40px solid transparent;
    border-left: 40px solid #00ff00;
    position: absolute;
    top: 0;
    right: -15px;
    border-radius: 50%; */
}

.started .indication-phases .phase.phase0,
.started .indication-phases .phase.phase-1 { width: calc(2%); min-width: 25px; }
.started .indication-phases .phase.phase1 { width: calc(24%); }
.started .indication-phases .phase.phase2 { width: calc(44%); }
.started .indication-phases .phase.phase3 { width: calc(64%); }
.started .indication-phases .phase.phase4 { width: calc(84%); }

.mid-way .indication-phases .phase.phase0,
.mid-way .indication-phases .phase.phase-1 { width: calc(10%); }
.mid-way .indication-phases .phase.phase1 { width: calc(30%); }
.mid-way .indication-phases .phase.phase2 { width: calc(50%); }
.mid-way .indication-phases .phase.phase3 { width: calc(70%); }
.mid-way .indication-phases .phase.phase4 { width: calc(90%); }


.indication-phases .phase.phase0,
.indication-phases .phase.phase-1 { width: calc(20%); }
.indication-phases .phase.phase1 { width: calc(40%); }
.indication-phases .phase.phase2 { width: calc(60%); }
.indication-phases .phase.phase3 { width: calc(80%); }
.indication-phases .phase.phase4 { width: calc(100%); }

.indication-phases .phase span {
    display: inline-block;
    height: 26px;
    padding: 0 7px;
    margin-bottom: 5px;
    line-height: 26px;
    background: #26686d;
    position: relative;
    width: 80%;
    text-align: center;
}

.indication-phases .phase span::after {
    content: '';
    border-top: 13px solid transparent;
    border-bottom: 13px solid transparent;
    border-left: 13px solid #26686d;
    position: absolute;
    top: 0;
    right: -13px;
}

.indication-phases .phase3 span {
    background: rgba(38,104,109, .5);
}

.indication-phases .phase3 span::after {
    border-left: 13px solid rgba(38,104,109, .5);
}

#pipeline-legend-ct #active,
#pipeline-legend-ct #planned {
    float: right;
    margin: 0 0 0 35px;
    padding: 0;
}

#pipeline-legend-ct #active .phase-box,
#pipeline-legend-ct #planned .phase-box {
    display: inline-block;
    width: 16px;
    height: 16px;
    background-color: #d5d5d5;
    margin: 0;
    padding: 0;
}

#pipeline-legend-ct #planned .phase-box {
    background-color: rgba(38,104,109, .5);
}

#pipeline-legend-ct .phase-box-text {
    display: inline-block;
    font-size: 12px;
    padding: 0 0 0 5px;
    margin: 0;
    vertical-align: top;
}

@media (max-width: 991px) {
    .pipeline-desc {
        border-top: 1px solid #dfddd9;
        border-bottom: none;
    }

    .indication-phases .phase span {
        /*width: 50%;*/
    }

    .top-border {
        border-top: none;
    }
    /* .pipeline-product-column > div:first-child:not(:empty),
    .indication-phases, .indication-phases.has-header {
      border-top: 1px solid #dfddd9;
    } */
    .pipeline-product-column .group_with_parent {
        border-top: none !important;
        display: none;
    }

    .pipeline-product-column .no-data {
        display: none;
    }

    /*.pipeline.single {
        border-bottom: 1px solid #dfddd9;
    }*/

    .pipeline-row .pipeline-product-column .text-center{
        text-align: left;
    }
}

@media (max-width: 767px) {
    .pipeline-row {
        display: block;
    }
    .pipeline-header {
        display: none;
    }

    .pipeline-desc {
        border-bottom: 1px solid #dfddd9;
        border-top: none;
        padding-left: inherit;
    }

    .pipeline-row .pipeline-product-column div.program-title {
        padding-bottom: 0 !important;
    }

    .phase-name-ct {
        display: block !important;
    }

    .pipeline-product-column > div:first-child:not(:empty),
    .indication-phases, .indication-phases.has-header {
      border-top: none;
    }

    .indication-phases {
        background: none;
        /* border-bottom: 1px solid #dfddd9; */
        padding-top: 0;
    }

    .indication-phases .phase.phase0, .indication-phases .phase.phase-1,
    .mid-way .indication-phases .phase.phase0, .mid-way .indication-phases .phase.phase-1,
    .started .indication-phases .phase.phase0, .started .indication-phases .phase.phase-1
    { width: calc(30%); }

    .indication-phases .phase.phase1,
    .mid-way .indication-phases .phase.phase1,
    .started .indication-phases .phase.phase1
    { width: calc(40%); }

    .indication-phases .phase.phase2,
    .mid-way .indication-phases .phase.phase2,
    .started .indication-phases .phase.phase2
    { width: calc(60%); }

    .indication-phases .phase.phase3,
    .mid-way .indication-phases .phase.phase3,
    .started .indication-phases .phase.phase3
    { width: calc(80%); }

    .indication-phases .phase.phase4,
    .mid-way .indication-phases .phase.phase4,
    .started .indication-phases .phase.phase4
    { width: calc(100%); }

    /* .indication-phases .phase { width: calc(100%) !important; } */
    #pipeline-legend-ct #active,
    #pipeline-legend-ct #planned {
        float: left;
        margin: 0 35px 0 0;
    }
}
