.timeline-container-md,
.timeline-carousel-wrapper,
.owl-stage-outer {
  padding: 0 !important;
  margin: 0 !important;
}
.section-history {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.page-history {
    padding-top: 2.5rem;
}

@media only screen and (max-width: 991px) {
    .page-history .intro {
        margin-bottom: 3rem;
    }
}


.timeline-carousel {
    width: 100%;
    margin: 0 auto;
}

.carousel-container {
    display: block;
}

.timeline-line {
    position: absolute;
    top: 50%;
    left: 15px;
    width: 100%;
    height: 1px;
    background: #000;
    z-index: -1;
    transform: translateY(-50%);
}



.timeline-slide {
    width: 100%;
    max-width: 1200px;
    box-sizing: border-box;
}



.timeline-marker {
    position: absolute;
    top: 50%;
    left: 11px;
    transform: translate(-50%, -50%);
    width: 16px;
    height: 16px;
    background-color: #132D4F;
    border-radius: 50%;
    z-index: 3;
}

.timeline-year {
    color: #003A7E;
    font-weight: 500;
    font-size: 35px;
    text-align: justify;
}

.timeline-carousel-wrapper::-webkit-scrollbar {
    display: none;
}

.owl-carousel .owl-stage {
    display: flex;
    align-items: center;
    transition: transform 0.3s ease;
}

.owl-carousel .pair-slide {
    flex: 0 0 auto;
}

.timeline-carousel {
    overflow: hidden;
}
.slide-content-top.alertnate .timeline-content {
    padding: 50px 0px;
}
.timeline-content.img-content {
    margin: 0px;
    margin-left: 10px;
    border-left: 1px solid #E0E0E0;
    background: #fff;
}
.timeline-content {
    /* text-align: center; */
    flex: 1;
    background: #F8F8F8;
    padding-left: 32px;
    width: 100%;
}
.slide-content-bottom .img-content {
    margin-top: 25px;
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.slide-content-top .img-content {
    display: flex;
    flex-direction: column;
    gap: 25px;
    margin-bottom: 25px;
}

.timeline-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    position: relative;
}



.video-container {
    position: relative;
    display: flex;
    justify-content: start;
}

.play-button {
    position: absolute;
    top: 50%;
    left: 30%;
    transform: translate(-50%, -50%);
    width: 50px;
    height: 50px;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.play-button::before {
    content: '';
    width: 0;
    height: 0;
    border-left: 15px solid white;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    margin-left: 3px;
}

.play-button-text {
    text-align: center;
    font-size: 14px;
    color: #003A7E;
    margin-top: 5px;
}
.slide-content-top, .slide-content-bottom {
    width: 100%;
    height: 340px;
}



.owl-carousel.owl-loaded {
    display: block;
}

.owl-carousel.owl-loading {
    opacity: 0;
    display: block;
}

.owl-carousel.owl-hidden {
    opacity: 0;
}
.owl-carousel .owl-item .img-content img {
    max-width: 350px;
    height: 200px;
    object-fit: cover;
}

.owl-carousel .owl-stage-outer {
    position: relative;
    overflow: hidden;
    transform: translate3d(0px, 0px, 0px);
}
/* Responsive Design */
@media (max-width: 1024px) {
    .pair-slide {
        min-width: 600px;
        padding: 0 15px;
    }
    
    .timeline-year {
        font-size: 24px;
    }
}

@media (max-width: 768px) {
    .pair-slide {
        min-width: 400px;
        padding: 0 10px;
        flex-direction: column;
    }
    .timeline-item .img-holder {
    margin: 0px;
}
    .timeline-year {
        font-size: 25px;
    }
    
    .timeline-content {
        padding: 0px 18px;
        margin: 10px;
    }

    .timeline-carousel-wrapper .owl-carousel .owl-stage {
    height: 100%;
    }
    .play-button {
        left: 50%;
    }
    .slide-content-top, .slide-content-bottom {
        height: auto;
    }
    .owl-carousel .owl-stage-outer {
        position: relative;
        overflow: hidden;
    }

}


.slide-content-bottom .timeline-content:not(.img-content) {
    margin-top: 25px;
    padding-top: 32px;
    padding-right: 32px;
    padding-bottom: 32px;
    min-height: 200px;
}

.timeline-content:not(.img-content) {
    max-width: 85%;
}

.slide-content-top .timeline-content:not(.img-content) {
    /* margin-top: 25px; */
    padding-top: 32px;
    padding-right: 32px;
    padding-bottom: 32px;
    min-height: 200px;
    margin-bottom: 25px;
}

@media only screen and (max-width: 420px) {
    .slide-content-bottom .timeline-content:not(.img-content) {
        max-width: unset;
    }
}

@media only screen and (max-width: 767px) {
    .slide-content-top .timeline-content:not(.img-content) {
        padding-left: 40px;
        max-width: unset;
    }

    .timeline-nav {
        justify-content: flex-start !important;
    }
}

.slide-content-top.alternate {
    display: inline-flex;
    align-items: flex-start;
    flex-direction: column;
}

.slide-content-top, .slide-content-bottom {
    width: 100%;
    height: 285px;
}

.slide-content-bottom {
    display: inline-flex;
}

.carrousel-fix {
    @media only screen and (min-width: 992px) {
        padding-left: calc((100vw - 60.75rem) / 2 );
    }

    @media only screen and (min-width: 911px) and (max-width: 991px) {
        padding-left: calc(((100vw - 60.75rem) / 2 ) + 15px);
    }

    @media only screen and (max-width: 910px) {
        padding-left: 15px;
    }
}


/** NAVIGATION ARROWS **/
.timeline-nav {
	 margin-top: 2rem;
	 display: flex;
	 flex-direction: row;
	 gap: 0.5rem;
	 justify-content: flex-end;
}

 .timeline-nav .timeline-next {
	 transition: all 0.3s ease-in-out;
	 content: "";
	 position: relative;
	 width: 3rem;
	 height: 3rem;
	 background-color: #132d4f;
	 z-index: 2;
	 font-size: 0;
	 border: unset;
}
 .timeline-nav .timeline-next::after {
	 content: '';
	 width: 1.5rem;
	 height: 1.5rem;
	 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M17.4697 9.53033C17.1768 9.23744 17.1768 8.76256 17.4697 8.46967C17.7626 8.17678 18.2374 8.17678 18.5303 8.46967L21.5283 11.4676C21.535 11.4743 21.5416 11.4811 21.5481 11.4881C21.6733 11.6221 21.75 11.8021 21.75 12C21.75 12.1006 21.7302 12.1966 21.6943 12.2842C21.6577 12.3738 21.603 12.4577 21.5303 12.5303L18.5303 15.5303C18.2374 15.8232 17.7626 15.8232 17.4697 15.5303C17.1768 15.2374 17.1768 14.7626 17.4697 14.4697L19.1893 12.75H3C2.58579 12.75 2.25 12.4142 2.25 12C2.25 11.5858 2.58579 11.25 3 11.25H19.1893L17.4697 9.53033Z' fill='white'/%3E%3C/svg%3E");
	 background-size: contain;
	 background-repeat: no-repeat;
	 position: absolute;
	 top: calc(50% - 0.75rem);
	 right: 0.75rem;
}
 .timeline-nav .timeline-prev {
	 transition: all 0.3s ease-in-out;
	 content: "";
	 position: relative;
	 width: 3rem;
	 height: 3rem;
	 background-color: #132d4f;
	 z-index: 2;
	 font-size: 0;
	 border: unset;
}
 .timeline-nav .timeline-prev::after {
	 content: '';
	 width: 1.5rem;
	 height: 1.5rem;
	 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M17.4697 9.53033C17.1768 9.23744 17.1768 8.76256 17.4697 8.46967C17.7626 8.17678 18.2374 8.17678 18.5303 8.46967L21.5283 11.4676C21.535 11.4743 21.5416 11.4811 21.5481 11.4881C21.6733 11.6221 21.75 11.8021 21.75 12C21.75 12.1006 21.7302 12.1966 21.6943 12.2842C21.6577 12.3738 21.603 12.4577 21.5303 12.5303L18.5303 15.5303C18.2374 15.8232 17.7626 15.8232 17.4697 15.5303C17.1768 15.2374 17.1768 14.7626 17.4697 14.4697L19.1893 12.75H3C2.58579 12.75 2.25 12.4142 2.25 12C2.25 11.5858 2.58579 11.25 3 11.25H19.1893L17.4697 9.53033Z' fill='white'/%3E%3C/svg%3E");
	 background-size: contain;
	 background-repeat: no-repeat;
	 position: absolute;
	 top: calc(50% - 0.75rem);
	 right: 0.75rem;
	 transform: rotate(-180deg);
}
 .timeline-nav .timeline-prev:hover,
 .timeline-nav .timeline-next:hover {
    cursor: pointer;
 }