h1,h2 {
    color: var(--c-prim);
    font-style: italic;
    text-align: center;
    color: var(--c-prim);
    font-style: italic;
    text-align: center !important;
}

h1 {
    font-size: 2.6em
}

h2 {
    font-size: 2.2em
}

.timeline .cont {
    position: relative;
    border-left: 3px solid var(--c-prim);
    padding-left: 2rem
}

.timeline .cont .deco {
    position: absolute;
    top: -.2rem;
    left: calc(-1.5rem - 1.5px);
    width: 3rem
}

.timeline .item {
    --w1: 75%;
    --w2: 25%
}

.timeline .item>:first-child {
    width: var(--w1)
}

.timeline .item>:last-child {
    width: var(--w2)
}

.timeline .year {
    font-size: 1.8em;
    padding: 0 0 .4em .2em;
    font-style: italic
}

.sec-num h2 {
    white-space: pre-wrap;
    margin-bottom: 1em
}

.sec-num .deco {
    position: absolute;
    top: 5%;
    left: 0;
    width: 30%
}

.timeline-list {
    list-style-image: url(/assets/site/icons/bullet.svg);
    font-weight: var(--fw-bold);
    padding: 0 2em 2em 3.4em
}

.timeline-list li {
    line-height: 1.4em
}

.timeline-list li::marker {
    font-size: 1.5em
}

@media (max-width: 1200px) {
    .timeline .item {
        --w1:70%;
        --w2: 30%
    }
}

@media (max-width: 992px) {
    .timeline .item {
        --w1:60%;
        --w2: 40%
    }
}

@media (max-width: 768px) {
    .sec-num .deco {
        display:none;
        visibility: hidden
    }
}

@media (max-width: 768px) {
    .timeline .cont {
        margin-left:var(--swpad)
    }

    .timeline-list {
        padding: 0 0 1em 1.6em
    }
}

#num-carousel {
    --cgap: 2rem;
    --btn-pos: calc((var(--cgap) * -1));
    --fs-text: .8em;
    margin: 0 calc(var(--cgap) / -2);
    text-align: center
}



#num-carousel .item {
    padding: 0 calc(var(--cgap) / 2)
}

#num-carousel .item .inner {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: .6em;
    border: 2px solid #7587fa;
    padding: .8rem
}

#num-carousel .item .inner>* {
    display: block;
    font-weight: var(--fw-bold)
}

#num-carousel .item .inner .title {
    font-size: var(--fs-text);
    color: var(--c-prim)
}

#num-carousel .item .inner .num {
    font-size: 1.8em;
    font-family: var(--ff-sec);
    color: var(--c-prim);
    padding: .2em 0
}

#num-carousel .item .inner .text {
    margin-top: auto;
    font-size: var(--fs-text)
}

@media (max-width: 768px) {
    #num-carousel {
        --cgap:var(--swpad);
        --btn-pos: -2rem;
        --fs-text: 1em;
        width: calc(100% - (var(--cgap) / 2));
        margin: 0 auto
    }
}

@media (max-width: 576px) {
    #num-carousel {
        --cgap:4rem;
        width: calc(100% - (var(--cgap) / 2) - 1rem)
    }
}
