#timeline-section {background: var(--text-light-colour); margin-top: 15px; margin-bottom: 15px; padding-bottom: 15px; padding-top: 15px;}

.timeline-centered { position: relative; margin-top: 15px; margin-bottom:15px;}

.timeline-centered:before, .timeline-centered:after { content: " "; display: table;}
.timeline-centered:after {clear: both;}
.timeline-centered:before, .timeline-centered:after {content: " "; display: table; }
.timeline-centered:after {clear: both;}
.timeline-centered:before {content: ''; position: absolute; display: block; width:2px; background:var(--text-color); left: 50%;
top: 20px; bottom: 20px; margin-left: -2px;}
.timeline-centered .timeline-entry {position: relative; width: 50%; float: right; margin-bottom:30px; clear: both;}
.timeline-centered .timeline-entry:before, .timeline-centered .timeline-entry:after {content: " "; display: table;}
.timeline-centered .timeline-entry:after {clear: both;}
.timeline-centered .timeline-entry:before, .timeline-centered .timeline-entry:after {content: " "; display: table;}
.timeline-centered .timeline-entry:after {clear: both;}
.timeline-centered .timeline-entry.begin {margin-bottom: 0;}
.timeline-centered .timeline-entry.left-aligned {float: left;}
.timeline-centered .timeline-entry.left-aligned .timeline-entry-inner {margin-left: 0; margin-right: -20px;}
.timeline-centered .timeline-entry.left-aligned .timeline-entry-inner .timeline-time {left: auto; right: -100px; text-align: left;}
.timeline-centered .timeline-entry.left-aligned .timeline-entry-inner .timeline-icon {float: right;}
.timeline-centered .timeline-entry.left-aligned .timeline-entry-inner .timeline-label {margin-left: 0; margin-right: 70px;}

.timeline-centered .timeline-entry.left-aligned .timeline-entry-inner .timeline-label:after {left: auto; right: 0; margin-left: 0; margin-right: -9px; -moz-transform: rotate(180deg); -o-transform: rotate(180deg); -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg);}
.timeline-centered .timeline-entry .timeline-entry-inner {position: relative; margin-left: -20px;}
.timeline-centered .timeline-entry .timeline-entry-inner:before, .timeline-centered .timeline-entry .timeline-entry-inner:after { content: " "; display: table;}
.timeline-centered .timeline-entry .timeline-entry-inner:after {clear: both;}
.timeline-centered .timeline-entry .timeline-entry-inner:before, .timeline-centered .timeline-entry .timeline-entry-inner:after { content: " "; display: table;}
.timeline-centered .timeline-entry .timeline-entry-inner:after {clear: both;}
.timeline-centered .timeline-entry .timeline-entry-inner .timeline-time {position: absolute; left: -100px; text-align: right; padding: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.timeline-centered .timeline-entry .timeline-entry-inner .timeline-time > span {display: block;}
.timeline-centered .timeline-entry .timeline-entry-inner .timeline-time > span:first-child {font-size:20px; font-weight:var(--font-weight-800);}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-icon {background:var(--white-color); color: var(--text-color); display: block; width: 40px; height: 40px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; border-radius:var(--border-radius-50); text-align: center; -moz-box-shadow: 0 0 0 5px #f5f5f6; -webkit-box-shadow: 0 0 0 5px #f5f5f6; box-shadow: 0 0 0 5px #f5f5f6; line-height: 40px; font-size: 13px; float: left;}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-icon.bg-primary {background-color: #303641; color: var(--white-color);}
.timeline-centered .timeline-entry .timeline-entry-inner .timeline-icon.bg-secondary {background-color: #010101 !important; color: var(--white-color);}
.timeline-centered .timeline-entry .timeline-entry-inner .timeline-icon.bg-success {background-color:var(--primary-color) !important; color: var(--white-color);}


.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label {position: relative; background: var(--white-color); padding:15px; margin-left: 70px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box;  border-radius:var(--border-radius);}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label:after {content: ''; display: block; position: absolute; width: 0; height: 0; border-style: solid; border-width: 9px 9px 9px 0; border-color: transparent var(--white-color) transparent transparent; left: 0; top: 10px; margin-left: -9px;}
.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label h2, .timeline-centered .timeline-entry .timeline-entry-inner .timeline-label p { margin: 0;}
.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label p + p { margin-top: 15px;}
.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label h2 {font-size:16px; line-height: 20px; margin-bottom: 15px; color: var(--black-color)}

@media only screen and ( min-width: 600px) and ( max-width: 765px ) {
   
.timeline-centered .timeline-entry .timeline-entry-inner .timeline-time > span:first-child {font-size:16px;}
.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label h2 {font-size:14px; line-height: 20px;}
    
}

@media only screen and ( min-width: 481px) and ( max-width: 599px ) {
   
.timeline-centered .timeline-entry .timeline-entry-inner .timeline-time > span:first-child {font-size:16px;}
.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label h2 {font-size:14px; line-height: 20px;}
    
}


@media only screen and ( min-width: 320px) and ( max-width: 480px ) {

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-time > span:first-child {font-size:16px;}
.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label h2 {font-size:14px; line-height: 20px;} 
    
}