.page_timeline .collapsible figure:not(.slick-slide) {	
	width: 54%;
	transform: scale(1.08) translateX(4%);
	outline: 10px solid var(--white70percent);
	display: inline-block;
    vertical-align: middle;
    box-sizing: border-box;
}

.page_timeline .program_main .text_near_slider {font-size: inherit; background-color: var(--anthracitelightgrey); padding-left: 3%; padding-top: 3%; width: 40%;}

.page_timeline .collapsible figcaption {font-size: 0.8em;}
.page_timeline .slick-slide figcaption {padding: 1em 1em 0 1em;}

.xp_hero.horizontal .info {
    width: 40%;
    top: 0;
    right: 0;
    color: var(--white);
    font-size: 1.25rem;
    
    left: 0;
    bottom: 0;
    transform: none;
    padding-block: 1rem;
    line-height: 1.3;
    background: linear-gradient(
        to right,
        rgba(0, 0, 0, 0.82) 0%,
        rgba(0, 0, 0, 0.72) 30%,
        rgba(0, 0, 0, 0.40) 55%,
        rgba(0, 0, 0, 0.08) 75%,
        rgba(0, 0, 0, 0) 100%
    );
    padding-top: 3rem;
}

@media only screen and (max-width: 980px) {
    .xp_hero.horizontal .info {
        top: 0;
        font-size: inherit;
        line-height: inherit;
    }
}

@media only screen and (max-width: 767px) {
    .xp_hero.horizontal {
        margin-bottom: 0;
        display: flex;
        flex-direction: column-reverse;
    }

    .xp_hero.horizontal .info {
        top: 0;
        position: relative;
        width: 94%; 
        background: var(--anthracite);
    }
}

@media only screen and (max-width: 640px) {
    .page_timeline .program_main .text_near_slider, .program_main .side_text {width: 95%; padding-top: 1em; margin-top: 2rem;}
    .page_timeline .collapsible figure:not(.slick-slide) {width: 90%!important;}
}