.timeline {
    position: relative;
    color: #000;
    margin-left: 48px;

    &__event {
        position: relative;
        padding-left: 80px;
        margin-bottom: 24px;

        &::before {
            content: "";
            position: absolute;
            width: 50px;
            height: 50px;
            background-color: #00D0A0;
            left: 0;
            top: 0;
        }

        &::after{
            content: "";
            position: absolute;
            left: 24px;
            top: 50px;
            width: 3px;
            height: 80px;
            background-color: #00D0A0;
            margin-top: 10px;
            margin-bottom: 10px;
            // For mobile view we may need to chnage style from square to circular
        }

        &:last-child {
            &::after{
                all: initial;
            }
        }

        &--highlight {
            &::before {
                background-color: #002235;
                outline: 2px solid #002235;
                outline-offset: 6px;
            }
        }

    }
    &__title {
        font-size: 36px;
    }
    &__description {
        font-size: 24px;
            margin-left: 0;
    }
}