.ctl-horizontal-timeline {
    --ctw-ibx-position: 50;
    --ctw-ybx-size: 50px;
    --ctw-ybx-text-size: 16px;
    --ctw-cbx-text-align: center;
    --ctw-cbx-img-order: 0;
    --nav-icon-height: 30px;
    --nav-icon-width: 30px;
    --nav-icon-color: var(--ctw-line-bg, #222);
    --nav-icon-radius: 0;
    --nav-icon-bd-width: 0px;
    --nav-icon-bd-clr: var(--ctw-line-bg);
    --nav-icon-bd-style: solid;
    overflow: visible;
    --ctw-ibx-radius: 0;
    padding: 0;
    max-width: 100%;
    --ctw-cbx-img-padding: 10px 10px 10px 10px
}

.ctl-wrapper .ctl-horizontal-wrapper:where(.ctl-default, .ctl-design-1) {
    --ctw-cbx-title-padding: 15px 0px 5px 0px;
    --ctw-cbx-des-padding: 0px;
    --ctw-cbx-padding: 10px
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-default, .ctl-design-1) {
    --ctw-ybx-size: 75px;
    --ctw-ybx-text-size: 19px;
    --nav-icon-bd-width: 2px
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-3 {
    --ctw-cbx-radius: 0px 0px 0px 0px;
    --ctw-cbx-padding: 0px;
    --ctw-cbx-des-padding: 0px 15px 0px 15px;
    --ctw-cbx-bd-top-width: 0px;
    --ctw-cbx-bg: #fff;
    --ctw-cbx-shadow: 0px;
    --ctw-cbx-title-font-weight: 500;
    --ctw-cbx-text-align: left;
    --ctw-cbx-date-font-weight: 400;
    --ctw-cbx-title-padding: 0px 15px 15px 15px
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 {
    --ctw-cbx-radius: 8px 8px 5px 5px;
    --ctw-cbx-bd-top-width: 0px;
    --ctw-cbx-bg: #fff;
    --ctw-cbx-padding: 10px;
    --ctw-cbx-shadow: 0 2px 8px -2px rgba(0, 0, 0, .3);
    --ctw-cbx-des-padding: 0px;
    --nav-icon-bd-width: 2px;
    --ctw-lbl-justify: initial
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4.dark-skin {
    --ctw-cbx-des-background: transparent
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-5 {
    --ctw-ibx-radius: 50;
    --ctw-cbx-text-align: left;
    --ctw-cbx-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.08);
    --ctw-cbx-date-font-weight: 400;
    --ctw-cbx-title-color: #000000;
    --ctw-cbx-title-font-size: 22px;
    --ctw-cbx-title-font-weight: 400;
    --ctw-cbx-img-order: -1;
    --nav-icon-bd-width: 2px;
    --ctw-cbx-des-padding: 0px 15px 15px 15px;
    --ctw-line-width: 2px
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-5.light-skin {
    --ctw-cbx-img-padding: 10px 10px 10px 10px;
    --ctw-line-bg: #aeaeae
}

.ctl-wrapper .ctl-horizontal-wrapper:where(.ctl-design-6, .ctl-design-8) {
    --ctw-cbx-padding: 10px;
    --ctw-cbx-title-padding: 5px 5px;
    --ctw-cbx-img-padding: 5px 5px 5px 5px;
    --ctw-cbx-des-padding: 0px 5px;
    --ctw-cbx-text-align: left;
    --ctw-cbx-bd-top-width: 1px;
    --ctw-cbx-bd-right-width: 1px;
    --ctw-cbx-bd-bottom-width: 1px;
    --ctw-cbx-bd-left-width: 1px;
    --ctw-cbx-bd-color: #000;
    --ctw-cbx-title-color: var(--ctw-cbx-des-color);
    --ctw-ibx-size: 45px;
    --ctw-ybx-size: 70px;
    --ctw-line-width: 2px
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-7 {
    --ctw-cbx-date-font-weight: 500;
    --ctw-cbx-title-font-size: 15px;
    --ctw-cbx-title-font-weight: 500;
    --ctw-ybx-size: 60px;
    --ctw-ybx-text-size: 15px;
    --ctw-ybx-text-weight: 500
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-1 {
    --ctw-ybx-size: 65px
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-1.light-skin {
    --ctw-cbx-padding: 0px 0px 0px 0px;
    --ctw-cbx-img-padding: 10px 10px 10px 10px
}

.ctl-wrapper .ctl-horizontal-timeline.dark-skin.ctl-design-1 .ctl-description {
    background-color: var(--ctw-first-story-color, var(--ctw-second-story-color))
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-1 .ctl-icon {
    border-radius: 50%;
    box-shadow: 0 0 0 3px #fff, inset 0 0 0 2px rgba(0, 0, 0, .05), 0 0 0 6px var(--ctw-line-bg)
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-1 .ctl-year-label.ctl-year-text {
    border-radius: 50%
}

.ctl-wrapper .ctl-horizontal-timeline.dark-skin:where(.ctl-default, .ctl-design-1) .swiper-slide-active :where(.ctl-label-big, .ctl-label-small, .ctl-label-smalla) {
    color: var(--ctw-first-story-color) !important
}

.ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-wrapper:where(.ctl-default, .ctl-design-1).dark-skin {
    --ctw-cbx-des-color: #ffffff;
    --ctw-cbx-title-color: #ffffff
}

.ctl-wrapper .ctl-horizontal-wrapper.dark-skin.ctl-design-2 {
    --ctw-cbx-title-color: #ffffff;
    --ctw-cbx-des-color: #ffffff
}

.ctl-wrapper .ctl-horizontal-wrapper.light-skin.ctl-design-2 {
    --ctw-cbx-title-color: #ffffff;
    --ctw-cbx-img-padding: 0px 0px 0px 0px
}

.ctl-wrapper .ctl-horizontal-wrapper.dark-skin.ctl-design-4 {
    --ctw-cbx-img-bg: #000000;
    --ctw-cbx-title-color: #ffffff;
    --ctw-cbx-des-color: #ffffff
}

.ctl-wrapper .ctl-horizontal-wrapper.light-skin.ctl-design-4 {
    --ctw-arw-bg: #aeaeae
}

.ctl-wrapper .ctl-horizontal-wrapper.dark-skin.ctl-design-5 {
    --ctw-cbx-des-background: #ffffff;
    --ctw-cbx-bd-color: #000000;
    --ctw-cbx-des-color: #000000
}

.ctl-wrapper .ctl-horizontal-wrapper.dark-skin.ctl-design-6 {
    --ctw-cbx-des-background: #ffffff;
    --ctw-cbx-title-color: #000000;
    --ctw-cbx-des-color: #000000
}

.ctl-wrapper .ctl-horizontal-timeline.light-skin:not(.ctl-design-6, .ctl-design-8) {
    --ctw-second-story-color: #aeaeae;
    --ctw-first-story-color: #aeaeae;
    --ctw-ibx-color: #eaeaea;
    --ctw-cbx-bd-top-width: 0px;
    --ctw-cbx-bd-right-width: 0px;
    --ctw-cbx-bd-bottom-width: 0px;
    --ctw-cbx-bd-left-width: 0px
}

.ctl-wrapper .ctl-horizontal-timeline.light-skin.ctl-design-3 {
    --ctw-arw-bg: #aeaeae
}

.ctl-wrapper .ctl-horizontal-wrapper.light-skin:where(.ctl-design-6, .ctl-design-8) {
    --ctw-cbx-bd-color: #aeaeae;
    --ctw-ibx-color: #ffffff
}

.ctl-wrapper .ctl-horizontal-wrapper:where(.ctl-default, .ctl-design-1) .ctl-labels :where(.ctl-label-big, .ctl-label-small) {
    color: var(--ctw-lbel-big-color, #000)
}

.ctl-wrapper .ctl-horizontal-wrapper:not(.dark-skin) .ctl-story.odd :where(.ctl-label-big, .ctl-label-small) {
    --ctw-lbl-big-color: var(--ctw-lbel-big-color, var(--ctw-first-story-color))
}

.ctl-wrapper .ctl-horizontal-wrapper:not(.dark-skin) .ctl-story.even :where(.ctl-label-big, .ctl-label-small) {
    --ctw-lbl-big-color: var(--ctw-lbel-big-color, var(--ctw-second-story-color))
}

.ctl-wrapper .ctl-horizontal-timeline {
    width: 100%;
    display: block;
    position: relative
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-2:not(.light-skin) .ctl-title a {
    color: var(--ctw-cbx-title-color)
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-5 .ctl-icon {
    border: 1px solid var(--ctw-arw-bg)
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-5 .ctl-icon i,
.ctl-wrapper .ctl-horizontal-timeline.ctl-design-5 .ctl-icon svg path {
    color: var(--ctw-arw-bg);
    fill: var(--ctw-arw-bg)
}

.ctl-wrapper .ctl-horizontal-wrapper:where(.ctl-design-6, .ctl-design-8) .ctl-icon img,
.ctl-wrapper .ctl-horizontal-wrapper:where(.ctl-design-6, .ctl-design-8) .ctl-icon svg {
    transform: rotate(316deg)
}

.ctl-wrapper .ctl-horizontal-wrapper:where(.ctl-design-6, .ctl-design-8) .ctl-icon img {
    height: 20px;
    width: 20px
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-5 .ctl-title,
.ctl-wrapper .ctl-horizontal-timeline.ctl-design-5:not(.light-skin) .ctl-icon {
    background-color: var(--ctw-cbx-des-background) !important
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-5 .ctl-content {
    border: 1px solid var(--ctw-arw-bg);
    padding: 5px
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-5 .ctl-arrow {
    background: var(--ctw-cbx-des-background) !important;
    border: 1px solid;
    border-image: linear-gradient(to bottom right, var(--ctw-arw-bg, var(--ctw-cbx-title-bg)) 51%, transparent 48%);
    border-image-slice: 1
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-5 .ctl-labels {
    text-align: left;
    padding: 5px
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-5 .ctl_read_more {
    align-self: start;
    border-color: var(--ctw-arw-bg)
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-5.light-skin .ctl-content {
    border: 1px solid #aeaeae
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-5.light-skin .ctl-arrow {
    border-image: linear-gradient(to bottom right, #aeaeae 52%, transparent 48%);
    border-image-slice: 1
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-5.light-skin .ctl-icon {
    border: 1px solid #aeaeae
}

.ctl-wrapper .ctl-horizontal-wrapper:where(.ctl-design-6, .ctl-design-8).light-skin .ctl-labels {
    border: 2px solid #aeaeae;
    background-color: #aeaeae
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-design-6, .ctl-design-8).light-skin .ctl-icon {
    border: 2px solid #aeaeae
}

.ctl-wrapper .ctl-horizontal-timeline.dark-skin:not(.ctl-default, .ctl-design-1, .ctl-design-2, .ctl-design-4, .ctl-design-5) .ctl-content {
    background: #fff
}

.ctl-wrapper .ctl-horizontal-timeline.dark-skin:not(.ctl-default, .ctl-design-1, .ctl-design-3, .ctl-design-5, .ctl-design-6, .ctl-design-8) .ctl-story .ctl-content {
    background-color: var(--ctw-first-story-color, var(--ctw-second-story-color))
}

.ctl-wrapper .ctl-horizontal-wrapper.light-skin :where(.ctl-icondot, .ctl-icon) {
    background: #aeaeae
}

.ctl-wrapper .ctl-horizontal-timeline.light-skin .ctl-icondot,
.ctl-wrapper .ctl-horizontal-timeline.light-skin:not(.ctl-default, .ctl-design-1, .ctl-design-3, .ctl-design-4, .ctl-design-5, .ctl-design-6, .ctl-design-7, .ctl-design-8) .ctl-story .ctl-title {
    background: #aeaeae !important
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-design-6, .ctl-design-8).dark-skin .ctl-arrow {
    background: linear-gradient(to bottom right, #fff 52%, transparent 48%)
}

.ctl-wrapper .ctl-horizontal-timeline.light-skin .ctl-story :where(.ctl-label-big, .ctl-label-small),
.ctl-wrapper .ctl-horizontal-timeline.light-skin:where(.ctl-design-3, .ctl-design-4, .ctl-design-5, .ctl-design-6, .ctl-design-8) .ctl-story .ctl-title a,
.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-7.light-skin .ctl-story .ctl-title a {
    color: #aeaeae !important
}

.ctl-wrapper .ctl-horizontal-timeline.light-skin:not(.ctl-default, .ctl-design-1, .ctl-design-4, .ctl-design-6, .ctl-design-8) .ctl-arrow {
    background: linear-gradient(to bottom right, #aeaeae 52%, transparent 48%)
}

.ctl-wrapper .ctl-horizontal-timeline.light-skin.ctl-design-7 .ctl-arrow {
    background: linear-gradient(to bottom, #aeaeae 0, rgba(229, 229, 229, 0) 100%) !important
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-3.light-skin .ctl-story :where(.ctl-label-big, .ctl-label-small) {
    color: #fff !important
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-3.light-skin .ctl-content {
    border-top: 4px solid #aeaeae !important;
    border: 1px solid #aeaeae
}

.ctl-wrapper .ctl-horizontal-wrapper.light-skin.ctl-design-3 .ctl-label-big:after {
    border-top: 8px solid #aeaeae
}

.ctl-wrapper .ctl-horizontal-wrapper.light-skin:where(.ctl-design-6, .ctl-design-8) .ctl-label-big:after {
    background: #aeaeae
}

.ctl-wrapper .ctl-horizontal-wrapper:where(.ctl-design-6, .ctl-design-8):not(.dark-skin) .ctl-story .ctl-title a {
    color: var(--ctw-arw-bg)
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-design-6, .ctl-design-8) .swiper-backface-hidden .swiper-slide {
    text-align: right;
    display: flex;
    justify-content: center
}

.ctl-wrapper .ctl-horizontal-timeline.cool-timeline-wrapper:where(.ctl-design-6, .ctl-design-8) .ctl-icon {
    border: 2px solid var(--ctw-line-bg);
    box-shadow: inset 0 0 0 2px #fff;
    transform: rotate(45deg);
    top: calc(var(--ctw-ibx-size)/ 1.3 - var(--ctw-ibx-size) * 2);
    left: calc(var(--ctw-ibx-position) * 1% - var(--ctw-ibx-size) * var(--ctw-ibx-position)/ 1px)
}

.ctl-wrapper .ctl-horizontal-timeline.cool-timeline-wrapper:where(.ctl-design-6, .ctl-design-8) .ctl-arrow {
    background: linear-gradient(to bottom right, var(--ctw-cbx-des-background) 52%, transparent 48%);
    border-color: var(--ctw-cbx-bd-color);
    left: 50%;
    transform: translateX(-50%) rotate(45deg)
}

.ctl-wrapper .ctl-horizontal-wrapper:where(.ctl-design-6, .ctl-design-8) .ctl-year-label.ctl-year-text {
    top: -13px;
    border: 2px solid var(--ctw-line-bg);
    box-shadow: inset 0 0 0 2px #fff
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-6 .ctl-icon i {
    transform: rotate(314deg)
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-6 .ctl-label-big:after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    width: 2px;
    height: calc(var(--ctw-lbl-big-size) + var(--ctw-lbl-small-size) + var(--ctw-lbl-gap) + 16px - var(--ctw-cbx-date-font-size));
    background: var(--ctw-line-bg);
    transform: translate(-50%, 0)
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-6 .ctl-label-full .ctl-label-big:after {
    height: calc(var(--ctw-lbl-big-size) + var(--ctw-lbl-small-size) + var(--ctw-lbl-gap) + 16px - var(--ctw-cbx-date-font-size) + var(--ctw-ibx-size)/ 4)
}

.ctl-wrapper .ctl-horizontal-timeline.cool-timeline-wrapper:where(.ctl-design-6, .ctl-design-8) .ctl-icondot {
    left: calc(var(--ctw-ibx-position) * 1% - var(--ctw-ibx-size) * var(--ctw-ibx-position)/ 85 + var(--ctw-ibx-size)/ 2.9);
    transform: rotate(45deg);
    top: calc(var(--ctw-ibx-size) * 2 - var(--ctw-ibx-size) * 3);
    border: 2px solid var(--ctw-line-bg);
    box-shadow: inset 0 0 0 2px #fff
}

.ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-timeline:where(.ctl-design-2, .ctl-design-4, .ctl-design-3) .ctl-button-next,
.ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-timeline:where(.ctl-design-2, .ctl-design-4, .ctl-design-3) .ctl-button-prev {
    border: 3px solid var(--ctw-line-bg);
    border-radius: 3px
}

.ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-timeline:where(.ctl-design-6, .ctl-design-8) .ctl-button-next,
.ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-timeline:where(.ctl-design-6, .ctl-design-8) .ctl-button-prev {
    border: 2px solid var(--ctw-line-bg);
    border-radius: 3px
}

.ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-timeline:where(.ctl-design-3, .ctl-design-4) .ctl-button-next,
.ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-timeline:where(.ctl-design-3, .ctl-design-4) .ctl-button-prev {
    background-color: var(--ctw-line-bg);
    color: #fff
}

.ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-timeline.ctl-design-4 .ctl-button-next:hover,
.ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-timeline.ctl-design-4 .ctl-button-prev:hover {
    border: 1px solid var(--ctw-line-bg);
    border-radius: 3px;
    background-color: #fff !important
}

.ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-timeline.ctl-design-4 .ctl-button-next:hover i,
.ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-timeline.ctl-design-4 .ctl-button-prev:hover i {
    color: var(--ctw-line-bg)
}

.ctl-wrapper .ctl-horizontal-wrapper:where(.ctl-default, .ctl-design-1) .ctl-description p {
    align-items: center
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-3 .ctl-description p {
    align-items: flex-start
}

.ctl-wrapper .ctl-horizontal-timeline {
    width: calc(100% - var(--nav-icon-width) * 2);
    margin: 0 var(--nav-icon-width)
}

.ctl-wrapper-inside {
    overflow: hidden;
    position: relative
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-slider-container {
    width: calc(100% - var(--ctw-cbx-space));
    margin: 0 calc(var(--ctw-cbx-space) * .5px);
    display: block;
    position: relative
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-slider-container.swiper-container {
    overflow: hidden;
    transition: height .3s ease-in-out
}

.ctl-wrapper .ctl-horizontal-wrapper:where(.ctl-default, .ctl-design-1, .ctl-design-6, .ctl-design-8) .swiper-container {
    overflow: visible !important
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-button-next,
.ctl-wrapper .ctl-horizontal-timeline .ctl-button-prev {
    position: absolute;
    top: calc(calc(0px + var(--ctw-lbl-big-size) + var(--ctw-lbl-small-size) + var(--ctw-lbl-gap) + 20px + var(--ctw-ibx-size) - var(--nav-icon-height) * .5 + var(--lbl-bd-width)*2));
    background: var(--nav-icon-background);
    color: var(--nav-icon-color);
    width: var(--nav-icon-width);
    height: var(--nav-icon-height);
    font-size: calc(var(--nav-icon-height) - 6px);
    line-height: 1em;
    border: var(--nav-icon-bd-width) var(--nav-icon-bd-style) var(--nav-icon-bd-clr);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9;
    cursor: pointer;
    border-radius: 50%;
    font-size: 17px
}

.ctl-wrapper .ctl-horizontal-timeline :where(.ctl-button-prev, .ctl-button-next).ctl-btn-click-effect::after {
    content: '';
    position: absolute;
    width: calc(100% * 1.9);
    height: calc(100% * 1.9);
    background-color: var(--ctw-line-bg);
    transform: scale3d(1.2, 1.2, 1);
    animation: ctl-btn-effect .6s forwards;
    z-index: -1;
    border-radius: 50%
}

.ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-timeline:where(.ctl-design-2, .ctl-design-4, .ctl-design-3) :where(.ctl-button-prev, .ctl-button-next).ctl-btn-click-effect::after {
    border-radius: 3px
}

@keyframes ctl-btn-effect {
    0% {
        transform: scale3d(.3, .3, 1)
    }

    25%,
    50% {
        opacity: .2
    }

    100% {
        opacity: 0;
        transform: scale3d(1.2, 1.2, 1)
    }
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-button-next svg path,
.ctl-wrapper .ctl-horizontal-timeline .ctl-button-prev svg path {
    fill: var(--nav-icon-color)
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-design-3, .ctl-design-4) .ctl-button-next svg path,
.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-design-3, .ctl-design-4) .ctl-button-prev svg path {
    fill: #fff
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-button-next:hover svg path,
.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-button-prev:hover svg path {
    fill: var(--nav-icon-color)
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-button-next:hover svg path,
.ctl-wrapper .ctl-horizontal-timeline .ctl-button-prev:hover svg path {
    fill: #fff
}

.ctl-wrapper .ctl-horizontal-timeline :where(.ctl-button-prev, .ctl-button-next).swiper-button-disabled {
    opacity: .5;
    cursor: not-allowed !important
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-button-next:hover,
.ctl-wrapper .ctl-horizontal-timeline .ctl-button-prev:hover {
    background: var(--ctw-line-bg) !important;
    color: #fff !important;
    border-color: var(--ctw-line-bg) !important
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-button-next {
    right: calc(0px - var(--nav-icon-width))
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-button-prev {
    left: calc(0px - var(--nav-icon-width))
}

.ctl-button-next i.fas.fa-long-arrow-alt-right {
    display: block !important
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-story-line {
    position: absolute;
    top: calc(0px - var(--ctw-ibx-size) - var(--ctw-line-width)/ 2);
    left: calc(0px - var(--ctw-cbx-space) * .5px);
    display: block;
    width: calc(100% + var(--ctw-cbx-space) * 1px);
    height: var(--ctw-line-width);
    background-color: var(--ctw-line-bg);
    border-width: calc(var(--ctw-line-bd-width) * 1px) 0 calc(var(--ctw-line-bd-width) * 1px) 0;
    border-style: var(--ctw-line-bd-style);
    border-color: var(--ctw-line-bd-color)
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-story-line {
    top: auto;
    bottom: calc(0px - var(--ctw-ibx-size) - var(--ctw-line-width)/ 2)
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-h-line {
    position: absolute;
    top: calc(0px + var(--ctw-lbl-big-size) + var(--ctw-lbl-small-size) + var(--ctw-lbl-gap) + 20px + var(--ctw-ibx-size) - var(--ctw-line-width) * .5);
    left: 0;
    display: block;
    width: 100%;
    height: var(--ctw-line-width);
    background-color: var(--ctw-line-bg);
    border-width: calc(var(--ctw-line-bd-width) * 1px) 0 calc(var(--ctw-line-bd-width) * 1px) 0;
    border-style: var(--ctw-line-bd-style);
    border-color: var(--ctw-line-bd-color)
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-story-line {
    top: auto;
    bottom: calc(0px + var(--ctw-lbl-big-size) + var(--ctw-lbl-small-size) + var(--ctw-lbl-gap) + 20px + var(--ctw-ibx-size) - var(--ctw-line-width) * .5)
}

.ctl-line-fill.swiper-pagination-progressbar {
    position: absolute;
    top: calc(0px + var(--ctw-lbl-big-size) + var(--ctw-lbl-small-size) + var(--ctw-lbl-gap) + 20px + var(--ctw-ibx-size) - var(--ctw-line-width) * .5 + var(--lbl-bd-width)*2);
    left: 0;
    width: 100%;
    height: var(--ctw-line-width);
    background: 0 0
}

.ctl-line-fill.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background: var(--ctw-line-filling-color)
}

.ctl-wrapper .ctl-line-filler .ctl-story-line {
    display: none
}

.ctl-wrapper .ctl-horizontal-timeline.cool-timeline-wrapper.ctl-design-6 .ctl-year-swiper-slide.ctl-in-view-port :where(.ctl-icondot, .ctl-icon) {
    border-color: var(--ctw-line-filling-color)
}

.ctl-wrapper .ctl-horizontal-timeline.cool-timeline-wrapper:where(.ctl-design-1, .ctl-design-2) .ctl-story.ctl-in-view-port .ctl-icon {
    box-shadow: 0 0 0 3px #fff, inset 0 0 0 2px rgba(0, 0, 0, .05), 0 0 0 6px var(--ctw-line-filling-color)
}

.ctl-wrapper .ctl-horizontal-timeline.cool-timeline-wrapper.ctl-design-6 .ctl-year-swiper-slide.ctl-in-view-port .ctl-labels {
    border-color: var(--ctw-line-filling-color)
}

.ctl-wrapper .ctl-horizontal-timeline.cool-timeline-wrapper.ctl-design-6 .ctl-year-swiper-slide.ctl-in-view-port .ctl-label-big:after {
    background: var(--ctw-line-filling-color)
}

.ctl-wrapper .ctl-horizontal-timeline.cool-timeline-wrapper:where(.ctl-design-2, .ctl-design-6) .ctl-year-label.ctl-in-view-port {
    box-shadow: 0 0 0 2px #fff, inset 0 0 0 2px rgba(0, 0, 0, .05), 0 0 0 5px var(--ctw-line-filling-color)
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-year {
    position: absolute;
    top: calc(0px - 40px - var(--ctw-line-width)/ 2);
    margin: 0;
    justify-content: flex-start;
    width: auto
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-year {
    top: auto;
    bottom: calc(0px - var(--ctw-ibx-size) + var(--ctw-line-width)/ 2 - (var(--ctw-ybx-size) * ((70 + var(--ctw-ibx-radius)/ 1.25)/ 100))/ 2)
}

.ctl-wrapper .ctl-horizontal-timeline :where(.ctl-year-text:before, .ctl-year-text:after) {
    width: calc(var(--ctw-ybx-bd-width) + var(--ctw-line-width) * .1);
    height: calc(var(--ctw-line-width) - var(--ctw-line-bd-width) * 2px);
    top: calc(50% - (var(--ctw-line-width) - var(--ctw-line-bd-width) * 2px)/ 2)
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-year-text:before {
    left: 0
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-year-text:after {
    right: 0
}

.ctl-wrapper .ctl-horizontal-wrapper .ctl-year-label.ctl-year-text {
    position: absolute;
    left: calc(100% - var(--ctw-ybx-size) * 1.6);
    box-shadow: 0 0 0 2px #fff, inset 0 0 0 2px rgba(0, 0, 0, .05), 0 0 0 5px var(--ctw-line-bg)
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-4 .ctl-year-label.ctl-year-text {
    left: calc(100% - var(--ctw-ybx-size) * 1.9)
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-7 .ctl-year-label.ctl-year-text {
    left: calc(100% - var(--ctw-ybx-size) * 1.5)
}

.ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-wrapper.ctl-design-4 .ctl-year-label.ctl-year-text {
    width: calc(var(--ctw-ybx-size) + 10px);
    height: calc(var(--ctw-ybx-size) * ((70 + var(--ctw-ibx-radius)/ 1.25)/ 100));
    bottom: 0;
    top: -34px;
    box-shadow: unset
}

.ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-wrapper.ctl-design-3 .ctl-year-label.ctl-year-text {
    box-shadow: unset;
    width: calc(var(--ctw-ybx-size) + 10px);
    height: calc(var(--ctw-ybx-size) * ((80 + var(--ctw-ibx-radius)/ 1.25)/ 100));
    top: calc(1px - (var(--ctw-ybx-size) * ((80 + var(--ctw-ibx-radius)/ 1.25)/ 100))/ 2)
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-7 .ctl-year-text {
    box-shadow: none
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-labels {
    justify-content: var(--ctw-lbl-justify);
    top: calc(0px - (var(--ctw-lbl-big-size) + var(--ctw-lbl-small-size) + var(--ctw-lbl-gap)) - var(--ctw-ibx-size) * 2 + 10px);
    height: calc(var(--ctw-lbl-big-size) + var(--ctw-lbl-small-size) + var(--ctw-lbl-gap));
    text-align: center
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-labels.ctl-label-full {
    top: calc(0px - (var(--ctw-lbl-big-size) + var(--ctw-lbl-small-size) + var(--ctw-lbl-gap)) - var(--ctw-ibx-size) * 2)
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-labels {
    top: auto;
    bottom: calc(0px - (var(--ctw-lbl-big-size) + var(--ctw-lbl-small-size) + var(--ctw-lbl-gap)) - var(--ctw-ibx-size) * 2)
}

.ctl-wrapper .ctl-vertical-wrapper.ctl-horizontal-wrapper:where(.ctl-default, .ctl-design-1) .ctl-story :where(.ctl-label-big, .ctl-label-small) {
    color: var(--ctw-lbl-big-color, var(--ctw-second-story-color))
}

.ctl-wrapper .ctl-horizontal-wrapper:where(.ctl-design-3, .ctl-design-6, .ctl-design-8) :where(.ctl-label-big, .ctl-label-small) {
    color: #fff !important
}

.ctl-wrapper .ctl-horizontal-wrapper:where(.ctl-design-3, .ctl-design-6, .ctl-design-8) .ctl-label-small a {
    color: #fff !important
}

.ctl-wrapper .ctl-horizontal-wrapper.dark-skin:where(.ctl-design-3, .ctl-design-6, .ctl-design-8) .ctl-label-big {
    color: #fff
}

.ctl-wrapper .ctl-horizontal-wrapper:where(.ctl-default, .ctl-design-1, .ctl-design-3, .ctl-design-6, .ctl-design-7, .ctl-design-8) .ctl-label-small {
    margin-bottom: 0
}

.ctl-wrapper .ctl-horizontal-wrapper:where(.ctl-design-3, .ctl-design-6, .ctl-design-8) .ctl-labels {
    flex-direction: column;
    justify-content: center !important;
    height: unset;
    top: calc(0px - (var(--ctw-lbl-big-size) + var(--ctw-lbl-small-size) + var(--ctw-lbl-gap)) - var(--ctw-ibx-size) * 1.6);
    display: flex;
    width: auto;
    background: var(--ctw-arw-bg);
    padding: 5px
}

.ctl-wrapper .ctl-horizontal-wrapper.cool-timeline-wrapper:where(.ctl-design-6, .ctl-design-8) .ctl-labels {
    margin-left: calc(var(--ctw-line-width)/ 2);
    border: 2px solid var(--ctw-line-bg);
    box-shadow: inset 0 0 0 2px #fff;
    top: calc(0px - (var(--ctw-lbl-big-size) + var(--ctw-lbl-small-size) + var(--ctw-lbl-gap)) - var(--ctw-ibx-size) * 1.4)
}

.ctl-wrapper .ctl-horizontal-wrapper:where(.ctl-design-3, .ctl-design-6, .ctl-design-8) .ctl-labels.ctl-label-full {
    top: calc(0px - (var(--ctw-lbl-big-size) + var(--ctw-lbl-small-size) + var(--ctw-lbl-gap)) - var(--ctw-ibx-size) * 2)
}

.ctl-wrapper .ctl-horizontal-wrapper :where(.ctl-design-3, .ctl-design-6, .ctl-design-8) .ctl-story.odd .ctl-label-big {
    --ctw-lbl-big-color: var(--ctw-lbel-big-color, var(--ctw-first-story-color, var(--ctw-cbx-des-color)))
}

.ctl-wrapper .ctl-horizontal-wrapper :where(.ctl-design-3, .ctl-design-6, .ctl-design-8) .ctl-story.even .ctl-label-big {
    --ctw-lbl-big-color: var(--ctw-lbel-big-color, var(--ctw-second-story-color, var(--ctw-cbx-des-color)))
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-3 .ctl-label-big:after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -8px;
    width: 0;
    height: 0;
    border-top: 8px solid var(--ctw-arw-bg);
    border-right: 8px solid transparent;
    border-left: 8px solid transparent
}

.ctl-wrapper .ctl-horizontal-wrapper:where(.ctl-default, .ctl-design-1) .ctl-story:nth-child(odd) .ctl-label-big {
    color: var(--ctw-first-story-color, var(--ctw-lbel-big-color))
}

.ctl-wrapper .ctl-horizontal-wrapper:where(.ctl-default, .ctl-design-1) .ctl-story:nth-child(even) .ctl-label-big {
    color: var(--ctw-second-story-color, var(--ctw-lbel-big-color))
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .swiper-container .ctl-slider-wrapper {
    height: 100% !important
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-story {
    margin-bottom: calc(var(--ctw-ibx-size) * 2 + var(--ctw-lbl-big-size) + var(--ctw-lbl-small-size) + var(--ctw-lbl-gap) + 20px + var(--lbl-bd-width)*2) !important
}

.ctl-wrapper .ctl-horizontal-timeline:not(.ctl-design-4) .ctl-story {
    margin-bottom: 10px;
    margin-top: calc(var(--ctw-ibx-size) * 2 + var(--ctw-lbl-big-size) + var(--ctw-lbl-small-size) + var(--ctw-lbl-gap) + 20px + var(--lbl-bd-width)*2) !important;
    display: flex;
    justify-content: center
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-h-line,
.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-line-fill.swiper-pagination-progressbar {
    bottom: calc(0px + var(--ctw-lbl-big-size) + var(--ctw-lbl-small-size) + var(--ctw-lbl-gap) + 20px + var(--ctw-ibx-size) - var(--ctw-line-width) * .5 + var(--lbl-bd-width)*2) !important
}

.ctl-wrapper .ctl-horizontal-timeline:not(.ctl-design-4) .ctl-h-line,
.ctl-wrapper .ctl-horizontal-timeline:not(.ctl-design-4) .ctl-line-fill.swiper-pagination-progressbar {
    top: calc(0px + var(--ctw-lbl-big-size) + var(--ctw-lbl-small-size) + var(--ctw-lbl-gap) + 20px + var(--ctw-ibx-size) - var(--ctw-line-width) * .5 + var(--lbl-bd-width)*2) !important;
    height: var(--ctw-line-width)
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-icon {
    left: calc(var(--ctw-ibx-position) * 1% - var(--ctw-ibx-size) * var(--ctw-ibx-position)/ 100);
    top: calc(var(--ctw-ibx-size)/ 2 - var(--ctw-ibx-size) * 2)
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-3 .ctl-icon {
    left: calc(var(--ctw-ibx-position) * 1% - var(--ctw-ibx-size) * var(--ctw-ibx-position)/ 1px)
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-default, .ctl-design-1, .ctl-design-3, .ctl-design-5, .ctl-design-7) .ctl-icon {
    top: calc(0px - 38px - (var(--ctw-ibx-size) - 2.5px)/ 2 - var(--ctw-line-width)/ 2)
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-icon {
    top: auto;
    bottom: calc(0px - var(--ctw-ibx-size) - (var(--ctw-line-width) * .5)/ 4 - (var(--ctw-ibx-size) - 5px)/ 2)
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-icondot {
    top: calc(0px - 39px - var(--ctw-ibx-size)/ 4 - var(--ctw-line-width)/ 2);
    left: calc(var(--ctw-ibx-position) * 1% - var(--ctw-ibx-size) * var(--ctw-ibx-position)/ 100 + var(--ctw-ibx-size)/ 4)
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-design-5, .ctl-default, .ctl-design-1) .ctl-icondot {
    top: calc(0px - 39px - var(--ctw-ibx-size)/ 4 - var(--ctw-line-width)/ 2)
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-icondot {
    top: auto;
    bottom: calc(var(--ctw-ibx-size) * .75 - var(--ctw-ibx-size) * 2);
    left: calc(var(--ctw-ibx-position) * 1% - var(--ctw-ibx-size) * var(--ctw-ibx-position)/ 100 + var(--ctw-ibx-size)/ 5)
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-default, .ctl-design-1) :where(.ctl-icondot, .ctl-icon) {
    --ctw-ibx-radius: 50;
    background-color: #000
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-default, .ctl-design-1) :where(.ctl-media, .swiper-wrapper.swiper-slide) img {
    width: auto;
    max-height: 400px;
    object-fit: contain;
    height: auto;
    object-position: unset;
    min-width: auto;
    margin: auto !important
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-default, .ctl-design-1) .ctp-story-slider {
    overflow: hidden;
    position: relative;
    margin-inline: auto
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-default, .ctl-design-1) .ctp-story-slider img {
    width: 100%;
    object-fit: cover
}

.ctl-wrapper .ctl-horizontal-timeline :where(.ctl-icondot:before, .ctl-icondot:after, .ctl-icon:before, .ctl-icon:after) {
    width: calc(var(--ctw-ibx-bd-width) + var(--ctw-line-width) * .1);
    height: calc(var(--ctw-line-width) - var(--ctw-line-bd-width) * 2px);
    top: calc(50% - (var(--ctw-line-width) - var(--ctw-line-bd-width) * 2px)/ 2)
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-default, .ctl-design-1) .swiper-slide-active :where(.ctl-icon, .ctl-icondot) {
    --ctw-ibx-size: 55px;
    background: var(--ctw-first-story-color)
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-default, .ctl-design-1):not(.light-skin) .swiper-slide-active :where(.ctl-label-big, .ctl-label-small) {
    color: var(--ctw-first-story-color)
}

.ctl-wrapper .ctl-horizontal-timeline :where(.ctl-icondot:before, .ctl-icon:before) {
    left: calc(0px - var(--ctw-ibx-bd-width))
}

.ctl-wrapper .ctl-horizontal-timeline :where(.ctl-icondot:after, .ctl-icon:after) {
    right: calc(0px - var(--ctw-ibx-bd-width))
}

.ctl-wrapper .ctl-horizontal-wrapper .ctl-media a {
    width: calc(var(--ctw-cbx-img-width) - (var(--ctw-cbx-img-margin-left) + var(--ctw-cbx-img-margin-right)))
}

.ctl-wrapper .ctl-horizontal-timeline :where(.ctl-story, .ctl-year-swiper-slide) {
    display: flex;
    justify-content: center
}

.ctl-wrapper .ctl-nav-swiper .ctl-year-swiper-slide.ctl_previous_slide {
    opacity: 0;
    transition: opacity .3s ease-in-out
}

.ctl-wrapper .ctl-horizontal-timeline:not(.light-skin) :where(.ctl-story, .ctl-year-swiper-slide):nth-child(odd) {
    --ctw-arw-bg: var(--ctw-first-story-color, var(--ctw-cbx-des-color, var(--ctw-cbx-title-color)))
}

.ctl-wrapper .ctl-horizontal-timeline:not(.light-skin) :where(.ctl-story, .ctl-year-swiper-slide):nth-child(even) {
    --ctw-arw-bg: var(--ctw-second-story-color, var(--ctw-cbx-des-color, var(--ctw-cbx-title-color)))
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-default, .ctl-design-1) .ctl-story:nth-child(odd) {
    --ctw-arw-bg: var(--ctw-first-story-color, var(--ctw-line-bg))
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-default, .ctl-design-1) .ctl-story:nth-child(even) {
    --ctw-arw-bg: var(--ctw-second-story-color, var(--ctw-line-bg))
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-arrow {
    background: linear-gradient(to bottom right, var(--ctw-arw-bg, var(--ctw-cbx-title-bg)) 52%, transparent 48%);
    top: calc(var(--ctw-ibx-size)/ 7 - var(--ctw-ibx-size)/ 2.65 + var(--ctw-cbx-bd-top-width)/ 3);
    left: calc(var(--ctw-ibx-position) * 1% - var(--ctw-ibx-size) * var(--ctw-ibx-position)/ 100 + var(--ctw-ibx-size)/ - var(--ctw-ibx-size)/ 7);
    border-width: var(--ctw-cbx-bd-top-width) 0 0 var(--ctw-cbx-bd-top-width);
    width: calc(var(--ctw-ibx-size)/ 2);
    height: calc(var(--ctw-ibx-size)/ 2);
    transform: rotate(45deg)
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-6 .ctl-arrow {
    top: calc(var(--ctw-ibx-size)/ 7 - var(--ctw-ibx-size)/ 2.5 + var(--ctw-cbx-bd-top-width)/ 3)
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-arrow-line {
    top: calc(0px - var(--ctw-ibx-size) * .5);
    left: calc(var(--ctw-ibx-position) * 1% - var(--ctw-ibx-size) * var(--ctw-ibx-position)/ 100 + var(--ctw-ibx-size)/ 2 - var(--ctw-line-width)/ 2);
    height: calc(var(--ctw-ibx-size) * .5);
    width: var(--ctw-line-width);
    border-width: 0 calc(var(--ctw-line-bd-width) * 1px) 0 calc(var(--ctw-line-bd-width) * 1px)
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-default, .ctl-design-1) :where(.ctl-arrow-line, .ctl-arrow) {
    display: none
}

.ctl-wrapper .ctl-horizontal-timeline :where(.ctl-arrow-line:before, .ctl-arrow-line:after) {
    width: var(--ctw-line-width);
    left: calc(0px - calc(var(--ctw-line-bd-width) * 1px));
    border-width: 0 calc(var(--ctw-line-bd-width) * 1px) 0 calc(var(--ctw-line-bd-width) * 1px)
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-arrow-line:before {
    height: calc(var(--ctw-ibx-bd-width));
    top: calc(0px - var(--ctw-ibx-bd-width))
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-arrow-line:after {
    height: calc(var(--ctw-cbx-bd-top-width));
    bottom: calc(0px - var(--ctw-cbx-bd-top-width))
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-story {
    margin-top: calc(var(--ctw-ibx-size) * 2 + var(--ctw-lbl-big-size) + var(--ctw-lbl-small-size) + var(--ctw-lbl-gap) + 20px)
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-story {
    margin-top: 0;
    margin-bottom: calc(var(--ctw-ibx-size) * 2 + var(--ctw-lbl-big-size) + var(--ctw-lbl-small-size) + var(--ctw-lbl-gap) + 20px)
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-story {
    align-self: flex-end
}

.ctl-wrapper .ctl-design-4 .equal-height-slides .ctl-story {
    align-self: stretch
}

.ctl-wrapper .ctl-horizontal-timeline .equal-height-slides .ctl-story {
    height: auto !important
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-story.swiper-slide {
    overflow: visible
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-content {
    flex-flow: row;
    flex-wrap: wrap;
    margin: 0 10px;
    height: 100%;
    width: 100%
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-design-6, .ctl-design-8) .ctl-content {
    display: block;
    text-align: left;
    width: 100%
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-3 .ctl-content {
    border-radius: unset;
    border-top: 4px solid var(--ctw-arw-bg) !important;
    border: 1px solid #e1e1e1;
    padding: 10px 0
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-3 .ctl-media {
    padding-bottom: 15px
}

.ctl-wrapper .ctl-horizontal-timeline :where(.ctl-media, .full-width, .ctp-media-slider) {
    width: 100%;
    overflow: hidden;
    z-index: 9
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-default, .ctl-design-1) :where(.ctl-media, .full-width) {
    width: 70%;
    margin: 0 auto
}

.ctl-content .ctp-media-slider~.ctl-description,
.ctl-content .full-width~.ctl-description,
.ctl-horizontal-wrapper .ctl-content .ctl-media~.ctl-description {
    width: 100%
}

.ctl-wrapper .ctl-horizontal-timeline .ctl-title {
    width: 100%;
    order: unset
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-default, .ctl-design-1) .ctl-title {
    --ctw-cbx-title-text-align: center
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-default, .ctl-design-1, .ctl-design-6, .ctl-design-8) .ctl-story .ctl-title {
    background-color: transparent;
    order: 1
}

.ctl-wrapper .ctl-horizontal-timeline.dark-skin:not(.ctl-default, .ctl-design-1, .ctl-design-3, .ctl-design-5, .ctl-design-6, .ctl-design-8) .ctl-story .ctl-content,
.ctl-wrapper .ctl-horizontal-timeline.dark-skin:not(.ctl-default, .ctl-design-1, .ctl-design-3, .ctl-design-5, .ctl-design-6, .ctl-design-8) .ctl-story .ctl-content .ctl-description {
    background-color: var(--ctw-first-story-color, var(--ctw-second-story-color))
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-default, .ctl-design-1, .ctl-design-7) .ctl-icon img {
    border-radius: 50%
}

.ctl-wrapper .ctl-horizontal-timeline:not(.ctl-design-4, .ctl-default, .ctl-design-1, .ctl-design-6, .dark-skin, .ctl-design-8) .ctl-story:nth-child(odd) .ctl-title {
    background-color: var(--ctw-first-story-color, var(--ctw-cbx-des-color, var(--ctw-cbx-des-background)))
}

.ctl-wrapper .ctl-horizontal-timeline:not(.ctl-design-4, .ctl-default, .ctl-design-1, .ctl-design-6, .dark-skin, .ctl-design-8) .ctl-story:nth-child(even) .ctl-title {
    background-color: var(--ctw-second-story-color, var(--ctw-cbx-des-color, var(--ctw-cbx-des-background)))
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-design-4, .ctl-design-3, .ctl-design-5) .ctl-story:nth-child(odd) .ctl-title a {
    color: var(--ctw-first-story-color, var(--ctw-cbx-title-color))
}

.ctl-wrapper .ctl-horizontal-timeline:where(.ctl-design-4, .ctl-design-3, .ctl-design-5) .ctl-story:nth-child(even) .ctl-title a {
    color: var(--ctw-second-story-color, var(--ctw-cbx-title-color))
}

.ctl-wrapper .ctl-horizontal-timeline.dark-skin:where(.ctl-design-4, .ctl-design-3, .ctl-design-5) .ctl-story .ctl-title a {
    color: var(--ctw-cbx-title-color)
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-3 .ctl-title {
    order: 1;
    background-color: var(--ctw-cbx-des-background) !important
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-7 .ctl-title {
    background-color: #ffffff00 !important;
    text-align: center
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-7 .ctl-story.even .ctl-content {
    padding-top: 40px
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-7 .ctl-story .ctl-content {
    padding-top: 90px
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-7 .ctl-label-full~.ctl-content {
    padding-top: 115px
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-7 .ctl-story.even .ctl-label-full~.ctl-content {
    padding-top: 65px
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-7 .ctl-story:nth-child(odd) .ctl-title :where(a, a:hover) {
    color: var(--ctw-first-story-color)
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-7 .ctl-story.even .ctl-title :where(a, a:hover) {
    color: var(--ctw-second-story-color)
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-7 :where(.ctl-media, .ctp-media-slider, .full-width, .ctl-description) {
    display: none !important
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-7 .ctl-content {
    background-color: #ffffff00 !important
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-7 .ctl-icondot {
    border-radius: 50%
}

.ctl-horizontal-timeline.ctl-design-4 {
    --ctw-cbx-bd-top-width: 0px;
    --ctw-cbx-bd-bottom-width: 3px
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-h-line,
.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-line-fill.swiper-pagination-progressbar {
    bottom: calc(0px + var(--ctw-lbl-big-size) + var(--ctw-lbl-small-size) + var(--ctw-lbl-gap) + 20px + var(--ctw-ibx-size) - var(--ctw-line-width) * .5);
    top: auto
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-button-next,
.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-button-prev {
    bottom: calc(0px + var(--ctw-lbl-big-size) + var(--ctw-lbl-small-size) + var(--ctw-lbl-gap) + 20px + var(--ctw-ibx-size) - var(--nav-icon-height) * .5 + var(--lbl-bd-width)*2);
    top: auto
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-button-next:hover,
.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-button-prev:hover {
    background-color: var(--ctw-line-bg);
    color: #fff
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-content {
    border-width: var(--ctw-cbx-bd-top-width) var(--ctw-cbx-bd-right-width) var(--ctw-cbx-bd-bottom-width) var(--ctw-cbx-bd-left-width);
    border-color: var(--ctw-first-story-color, var(--ctw-cbx-bd-color))
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-story:nth-child(odd) .ctl-content {
    border-color: var(--ctw-first-story-color, var(--ctw-cbx-des-color, var(--ctw-cbx-bd-color)))
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-story:nth-child(even) .ctl-content {
    border-color: var(--ctw-second-story-color, var(--ctw-cbx-des-color, var(--ctw-cbx-bd-color)))
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-arrow {
    content: '';
    width: 4px;
    height: calc(var(--ctw-ibx-size) - var(--ctw-line-width) * .5);
    background: var(--ctw-arw-bg);
    top: 100%;
    transform: rotate(1deg);
    transform: translate(-50%, 0);
    z-index: -9
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-3 .ctl-arrow {
    top: calc(var(--ctw-ibx-size)/ 7 - var(--ctw-ibx-size)/ 2.5 + var(--ctw-cbx-bd-top-width)/ 3)
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-7 .ctl-arrow {
    transform: rotate(360deg);
    width: 2px;
    height: 36px;
    background: linear-gradient(to bottom, var(--ctw-arw-bg) 0, rgba(229, 229, 229, 0) 100%);
    top: calc(var(--ctw-ibx-size)/ 6 - var(--ctw-ibx-size) + var(--ctw-cbx-bd-top-width)/ 1 - 5px);
    left: calc(var(--ctw-ibx-position) * 1% - var(--ctw-ibx-size) * var(--ctw-ibx-position)/ 150 + var(--ctw-ibx-size)/ 2.2 - var(--ctw-ibx-size)/ 7);
    z-index: 1
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-7 .ctl-story:nth-child(odd) .ctl-arrow {
    background: linear-gradient(to bottom, var(--ctw-arw-bg) 0, rgba(229, 229, 229, 0) 100%);
    height: 92px
}

.ctl-wrapper .ctl-nav-swiper-container {
    position: absolute;
    width: 100%;
    overflow: hidden;
    z-index: 99
}

.ctl-nav-slider-container {
    position: relative;
    top: 148px;
    overflow: visible !important
}

.ctl-nav-slider-wrapper {
    position: absolute
}

.ctl-wrapper .ctl-horizontal-wrapper .ajax_load_more {
    display: none
}

.ctl-wrapper .ctl-category-container.ctl-category-design-4 {
    position: absolute;
    bottom: -52px;
    left: calc(50% - 102px);
    margin-inline: 0
}

.ctl-wrapper .ctl-category-container:not(.ctl-category-dropdown).ctl-category-design-4 {
    left: 50%;
    transform: translateX(-50%)
}

.ctl-wrapper .ctl-navigation-bar.ctl-nav-design-4 {
    position: absolute;
    bottom: -25px;
    width: 100%;
    left: 0
}

.ctl-wrapper .ctl-category-container~.ctl-navigation-bar.ctl-nav-design-4 {
    bottom: -110px
}

.ctl-wrapper :where(.ctl-navigation-bar, .ctl-category-container)~.cool-timeline-wrapper.ctl-design-4 {
    margin-bottom: 65px
}

.ctl-wrapper .ctl-category-container~.ctl-navigation-bar~.cool-timeline-wrapper.ctl-design-4 {
    margin-bottom: 160px
}

.ctl-wrapper .ctl-navigation-bar button.ctl-nav-dropdown-button~ul.ctl-nav {
    padding: 0;
    background: #fff
}

.ctl-wrapper .ctl-navigation-bar button.ctl-nav-dropdown-button~ul.ctl-nav li {
    padding: 3px 19px;
    margin: 0 0
}

.ctl-wrapper .ctl-horizontal-timeline .ctp-media-slider .ctp-story-slider .ctl_glightbox_gallery {
    width: 100%
}

@media (min-width:768px) {

    .ctl-wrapper .ctl-horizontal-timeline:where(.ctl-design-6, .ctl-design-8) .ctl-media,
    .ctl-wrapper .ctl-horizontal-timeline:where(.ctl-design-6, .ctl-design-8) .ctp-media-slider,
    .ctl-wrapper .ctl-horizontal-timeline:where(.ctl-design-6, .ctl-design-8) .full-width {
        margin-right: 10px;
        float: left;
        width: calc(var(--ctw-cbx-img-width));
        max-width: calc(35% - 10px)
    }

    .ctl-wrapper .ctl-horizontal-timeline:where(.ctl-design-6, .ctl-design-8) .ctl-media iframe,
    .ctl-wrapper .ctl-horizontal-timeline:where(.ctl-design-6, .ctl-design-8) .ctl-media img {
        float: left;
        width: calc(100% - (var(--ctw-cbx-img-margin-left) + var(--ctw-cbx-img-margin-right)));
        object-fit: cover;
        object-position: center
    }

    .ctl-wrapper .ctl-horizontal-timeline:where(.ctl-design-6, .ctl-design-8) .ctl-story:not(.ctl-no-media) .ctl-content .ctl-title {
        display: inline-block;
        min-width: 65%;
        width: calc(100% - var(--ctw-cbx-img-width) - 10px) !important
    }

    .ctl-wrapper .ctl-horizontal-timeline:where(.ctl-design-6, .ctl-design-8) .ctl-content .ctl-media~.ctl-description,
    .ctl-wrapper .ctl-horizontal-timeline:where(.ctl-design-6, .ctl-design-8) .ctl-content .ctp-media-slider~.ctl-description,
    .ctl-wrapper .ctl-horizontal-timeline:where(.ctl-design-6, .ctl-design-8) .ctl-content .full-width~.ctl-description {
        display: inline-block;
        min-width: 65%;
        width: calc(100% - var(--ctw-cbx-img-width) - 10px) !important
    }

    .ctl-wrapper .ctl-horizontal-timeline.ctl-design-5 .ctl-arrow {
        left: calc(var(--ctw-ibx-size) + 10px)
    }

    .ctl-wrapper .ctl-horizontal-timeline.ctl-design-5 .ctl-icon {
        left: calc(var(--ctw-ibx-size) + 2px)
    }

    .ctl-wrapper .ctl-horizontal-timeline.ctl-design-5 .ctl-labels {
        left: calc(var(--ctw-ibx-size));
        transform: translate(-25%)
    }

    .ctl-wrapper .ctl-horizontal-timeline.ctl-design-5 .ctl-icondot {
        left: calc(var(--ctw-ibx-size) + 10px)
    }
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-7 .ctl-labels {
    top: unset;
    z-index: 9;
    padding-top: 70px
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-7 .ctl-story.odd .ctl-label-big {
    color: var(--ctw-lbl-big-color)
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-7 .ctl-story.even .ctl-label-big {
    color: var(--ctw-lbl-big-color)
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-7 .ctl-story.even .ctl-labels {
    padding-top: 20px
}

.ctl-wrapper .ctl-horizontal-wrapper:not(.ctl-default, .ctl-design-1, .ctl-design-6, .ctl-design-8) .ctl-year-label.ctl-year-text {
    top: calc(0px - (var(--ctw-ybx-size) * ((61 + var(--ctw-ibx-radius)/ 1.25)/ 100))/ 2)
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-1 .ctl-year-label.ctl-year-text {
    top: calc(0px - var(--ctw-ybx-size)/ 2)
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-2 .ctl-icon {
    box-shadow: 0 0 0 2px #fff, inset 0 0 0 2px rgba(0, 0, 0, .05), 0 0 0 5px var(--ctw-line-bg)
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-2 .ctl-icon {
    width: calc(var(--ctw-ibx-size) - 10px);
    height: calc(var(--ctw-ibx-size) - 10px);
    left: calc(var(--ctw-ibx-position) * 1% - var(--ctw-ibx-size) * var(--ctw-ibx-position)/ 120);
    top: calc(var(--ctw-ibx-size)/ 2 - var(--ctw-ibx-size) * 1.9)
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-7 .ctl-icon {
    z-index: 2;
    border-radius: 50%;
    left: calc(var(--ctw-ibx-position) * 1% - var(--ctw-ibx-size) * var(--ctw-ibx-position)/ 115)
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-2 .ctl-content {
    border: 1px solid #f0f2f4;
    border-top: 0;
    padding: 0;
    border-radius: unset
}

.ctl-wrapper .ctl-horizontal-wrapper:not(.ctl-design-5, .ctl-design-6, .ctl-design-8).dark-skin .ctl-content {
    border: unset
}

.ctl-wrapper .ctl-horizontal-wrapper:where(.ctl-default, .ctl-design-1) .ctl-year-label.ctl-year-text {
    box-shadow: unset;
    border-radius: 50%
}

.ctl-wrapper .ctl-horizontal-wrapper:where(.ctl-default, .ctl-design-1) .ctl-year-text {
    width: var(--ctw-ybx-size);
    height: calc(var(--ctw-ybx-size) * ((100 + var(--ctw-ibx-radius)/ 1.25)/ 100))
}

.ctl-horizontal-navigationBar .ctl-year-nav {
    border: 1px solid;
    border-color: var(--ctw-ybx-bd-color);
    padding: 4px;
    text-align: center;
    color: var(--ctw-ybx-text-color);
    filter: brightness(.9);
    background-color: var(--ctw-ybx-bg)
}

.ctl-horizontal-navigationBar .ctl-year-nav.active {
    font-weight: 700;
    filter: brightness(1)
}

.horizontalSwiper.ctl-horizontal-navigationBar {
    overflow: hidden;
    position: relative;
    margin: 0 auto;
    padding: 5px;
    display: flex
}

.ctl-hor-nav-wrapper :where(.swiper-button-prev, .swiper-button-next) {
    display: none
}

.ctl-hor-nav-wrapper {
    --ctw-nav-align: left;
    position: relative;
    width: calc(100% - 32px);
    margin: 0 16px 0 16px
}

.ctl-hor-nav-wrapper .swiper-button-next,
.ctl-hor-nav-wrapper .swiper-button-prev {
    position: absolute;
    transform: translateY(-50%);
    margin-top: 0;
    width: auto;
    height: auto;
    font-size: 16px
}

.ctl-hor-nav-wrapper .swiper-button-next,
.ctl-hor-nav-wrapper .swiper-container-rtl .swiper-button-prev {
    right: -16px
}

.ctl-hor-nav-wrapper .swiper-button-prev,
.ctl-hor-nav-wrapper .swiper-container-rtl .swiper-button-next {
    left: -16px
}

.ctl-hor-nav-wrapper .swiper-button-next,
.ctl-hor-nav-wrapper .swiper-button-prev {
    background-image: none !important
}

.ctl-hor-nav-wrapper .ctl-nav-next i,
.ctl-hor-nav-wrapper .ctl-nav-prev i {
    color: var(--ctw-ybx-text-color)
}

.ctl-horizontal-navigation-items {
    justify-content: var(--ctw-nav-align)
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-content-empty .ctl-button-next,
.ctl-wrapper .ctl-horizontal-wrapper.ctl-content-empty .ctl-button-prev,
.ctl-wrapper .ctl-horizontal-wrapper.ctl-content-empty .ctl-h-line {
    display: none
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-content-empty .ctl-slider-wrapper {
    display: flex;
    justify-content: center
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-content-empty .ctl-slider-container {
    margin-top: 0
}

.ctl-wrapper .ctl-horizontal-wrapper .ctl_load_more_pagination {
    display: none
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-8 .ctl-slider-container {
    padding-top: 5px
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-8 .ctl-icondot {
    transform: rotate(0);
    border: unset;
    box-shadow: unset;
    width: calc(var(--ctw-ibx-size)/ 3);
    height: calc(var(--ctw-ibx-size)/ 3);
    top: calc(var(--ctw-ibx-size) * 2 - var(--ctw-ibx-size) * 3 + 3px)
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-8 .ctl-icon {
    transform: rotate(0);
    border-width: 0;
    box-shadow: unset;
    width: calc(var(--ctw-ibx-size) - 18px);
    height: calc(var(--ctw-ibx-size) - 18px);
    top: calc(var(--ctw-ibx-size)/ 1.3 - var(--ctw-ibx-size) * 2 + 8px)
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-8 .ctl-icon i {
    font-size: calc(var(--ctw-ibx-text-size) - 7px)
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-8 .ctl-content,
.ctl-wrapper .ctl-horizontal-timeline.ctl-design-8 .ctl-content .ctl-description {
    border-width: 0;
    background: 0 0
}

.ctl-wrapper .ctl-horizontal-timeline.dark-skin.ctl-design-8 .ctl-content,
.ctl-wrapper .ctl-horizontal-timeline.dark-skin.ctl-design-8 .ctl-content .ctl-description {
    background: var(--ctw-cbx-des-background)
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-8 .ctl-arrow {
    border-width: 0;
    background: 0 0
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-8 .ctl-year-label.ctl-year-text {
    border: unset;
    box-shadow: unset
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-8 .ctl-labels {
    border: unset;
    box-shadow: unset;
    background-color: transparent
}

.ctl-wrapper .ctl-horizontal-wrapper.ctl-design-8 .ctl-year-swiper-slide .timeline-year {
    display: none
}

.ctl-wrapper .ctl-horizontal-wrapper.cool-timeline-wrapper.ctl-design-8 :where(.ctl-label-big, .ctl-label-small),
.ctl-wrapper .ctl-horizontal-wrapper.cool-timeline-wrapper.ctl-design-8 :where(.ctl-label-big, .ctl-label-small) * {
    color: var(--ctw-arw-bg) !important
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-8 .ctl-year-swiper-slide.swiper-slide-active :where(.ctl-icondot, .ctl-icon)::after,
.ctl-wrapper .ctl-horizontal-timeline.ctl-design-8 .ctl-year-swiper-slide.swiper-slide-active :where(.ctl-icondot, .ctl-icon)::before {
    width: 100%;
    height: 100%;
    background: 0 0;
    top: 0;
    left: 0;
    box-shadow: 0 0 0 0 var(--ctw-arw-bg);
    opacity: 1;
    border-radius: 3px;
    animation: iconAnimation 3s infinite;
    transition: all ease .4s;
    opacity: .5
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-8 .ctl-year-swiper-slide.swiper-slide-active :where(.ctl-icondot, .ctl-icon)::before {
    animation-delay: .9s
}

.ctl-wrapper .ctl-horizontal-timeline.ctl-design-8 .ctl-year-swiper-slide.swiper-slide-active :where(.ctl-icondot, .ctl-icon)::after {
    animation-delay: .6s
}

@keyframes iconAnimation {
    70% {
        box-shadow: 0 0 0 calc(var(--ctw-ibx-size)/ 3) var(--ctw-arw-bg);
        opacity: 0
    }

    100% {
        box-shadow: 0 0 0 0 var(--ctw-arw-bg);
        opacity: 0
    }
}

@media screen and (max-width:1024px) {

    .ctl-horizontal-navigation-center .ctl-horizontal-navigation-items,
    .ctl-horizontal-navigation-right .ctl-horizontal-navigation-items {
        justify-content: left !important
    }
}

@media screen and (max-width:768px) {
    .ctl-wrapper .ctl-horizontal-wrapper:where(.ctl-default, .ctl-design-1) {
        --ctw-cbx-des-padding: 15px 15px 15px 15px
    }

    .ctl-wrapper .ctl-horizontal-timeline:where(.ctl-design-6, .ctl-design-8):where(.ctl-description, .ctl-title) {
        width: 100px !important;
        display: block
    }

    .ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-wrapper .ctl-year-label.ctl-year-text {
        left: calc(100% - var(--ctw-ybx-size) * 2)
    }

    .ctl-wrapper .ctl-horizontal-timeline:where(.ctl-default, .ctl-design-1, .ctl-design-6, .ctl-design-8) .swiper-slide.ctl-story {
        margin-top: unset
    }

    .ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-slider-container {
        margin-inline: 0
    }

    .ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-description,
    .ctl-wrapper .ctl-horizontal-timeline.ctl-design-4 .ctl-story.swiper-slide {
        padding: 0 10px
    }

    .ctl-wrapper .ctl-horizontal-timeline:where(.ctl-design-6, .ctl-design-8) .ctl-content .ctl-description {
        padding: 10px
    }

    .ctl-wrapper .ctl-horizontal-timeline .ctp-media-slider .swiper-wrapper img {
        object-fit: cover;
        height: 60vw !important
    }
}

@media (max-width:445px) {
    .ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-wrapper .ctl-year-label.ctl-year-text {
        left: calc(100% - var(--ctw-ybx-size) * 1.6)
    }

    .ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-wrapper:where(.ctl-design-3, .ctl-design-4) .ctl-year-label.ctl-year-text {
        left: calc(50% - var(--ctw-ybx-size) - var(--ctw-ibx-size)/ 1)
    }

    .ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-wrapper.ctl-design-2 .ctl-year-label.ctl-year-text {
        left: calc(100% - var(--ctw-ybx-size) * 2)
    }

    .ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-wrapper:where(.ctl-design-6, .ctl-design-8) .ctl-year-label.ctl-year-text {
        left: calc(50% - var(--ctw-ybx-size) - var(--ctw-ibx-size)/ 1.9);
        top: -12px;
        width: calc(var(--ctw-ybx-size) * .85)
    }

    .ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-wrapper.ctl-design-1 .ctl-year-label.ctl-year-text {
        left: calc(100% - var(--ctw-ybx-size) * 1.45);
        width: calc(var(--ctw-ybx-size) * .9);
        height: calc(var(--ctw-ybx-size) * .9);
        top: -30px
    }

    .ctl-wrapper .ctl-horizontal-timeline:not(.ctl-design-3, .ctl-design-4, .ctl-design-6, .ctl-design-8) .ctl-icon img {
        border-radius: 50%
    }

    .ctl-wrapper .ctl-horizontal-timeline .ctl-icon img {
        max-height: unset !important;
        object-fit: cover !important;
        height: 100% !important
    }

    .ctl-wrapper .ctl-horizontal-timeline .ctl_load_more_pagination {
        display: none
    }

    .ctl-wrapper .ctl-horizontal-timeline .ctl-content {
        margin: 0;
        padding: 0
    }

    .ctl-wrapper .ctl-horizontal-timeline:where(.ctl-default, .ctl-design-1, .ctl-design-6, .ctl-design-8) .ctl-content {
        margin-inline: 10px !important
    }

    .ctl-wrapper .ctl-horizontal-timeline:where(.ctl-default, .ctl-design-1, .ctl-design-6, .ctl-design-8) .ctl-story:not(.swiper-slide-active) .ctl-year-container {
        visibility: hidden
    }

    .ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-wrapper:where(.ctl-default, .ctl-design-1) .ctl-year-label.ctl-year-text {
        left: calc(50% - var(--ctw-ybx-size) - var(--ctw-ibx-size)/ 1.3);
        top: -35px
    }
}