// Company History
.cms-company-history{
    .content-item{
        display: flex;
        .left-content{
            padding-right: 42px;
            position: relative;
            [dir="rtl"] &{
                padding-left: 42px;
                padding-right: 0;
            }
            span.dot{
                content: "";
                display: flex;
                align-items: center;
                justify-content: center;
                width: 24px;
                height: 24px;
                border: 2px solid #dcdee2;
                position: absolute;
                top: 3px;
                right: -11px;
                &:before{
                    content: "";
                    display: block;
                    width: 8px;
                    height: 8px;
                    border: 2px solid $accent-color;
                    background-color: $accent-color;
                }
                [dir='rtl'] &{
                    right: auto;
                    left: -11px;
                }
            }
            &:after{
                content: "";
                display: block;
                width: 2px;
                background-color: #dcdee2;
                position: absolute;
                top: 26px;
                right: 0;
                bottom: -3px;
                [dir="rtl"] &{
                    right: auto;
                    left: 0;
                }
            }
            .timeline-year{
                width: 75px;
                font-size: 14px;
                line-height: 30px;
                font-weight: bold;
                display: inline-block;
                padding: 0;
                background-color: $accent-color;
                color: #fff;
                text-align: center;
                position: relative;
                &:before{
                    position: absolute;
                    content: "";
                    display: block;
                    height: 21px;
                    width: 21px;
                    top: 50%;
                    right: -11px;
                    background-color: $accent-color;
                    transform: translateY(-50%) rotate(45deg);
                    [dir="rtl"] &{
                        right: auto;
                        left: -11px;
                    }
                }
            }
        }
        .right-content{
            padding-left: 40px;
            [dir="rtl"] &{
                padding-right: 40px;
                padding-left: 0;
            }
            .timeline-title{
                margin-bottom: 13px;
            }
            .timeline-text{
                font-size: 15px;
                line-height: 25px;
                margin-bottom: 40px;
            }
        }
        &:last-child{
            .right-content{
                .timeline-text{
                    margin-bottom: 0;
                }
            }
            .left-content:after{
                bottom: 7px;
            }
        }
        @media (max-width: $screen-sm-max) {
            flex-direction: column;
            span.dot, .left-content:after{
                display: none !important;
            }
            .right-content{
                padding-left: 0;
                margin-top: 15px;
            }
        }
    }
}