﻿.so-widget-timeline { text-align:center; }

.so-widget-timeline .timeline { display:flex; align-items:flex-end; }

.so-widget-timeline .event { flex-grow:1; flex-basis:0; }

.so-widget-timeline .event .circle { padding:30px 0; position:relative; }
.so-widget-timeline .event .circle::before { background-color:#FE5716; content:''; display:block; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:100%; height:3px; }
.so-widget-timeline .event .circle::after { background-color:#fff; border:9px solid #FE5716; border-radius:50%; content:''; display:inline-block; position:relative; width:30px; height:30px; vertical-align:bottom; }

.so-widget-timeline .tooltip { border:1px solid #eee; border-radius:6px; margin:0 30px; padding:15px; position:relative; z-index:1; }
.so-widget-timeline .tooltip::before, .so-widget-timeline .tooltip::after { border-style:solid; content:''; position:absolute; left:50%; width:0; height:0; }
.so-widget-timeline .tooltip::before { border-color:#eee transparent transparent transparent; border-width:15px; bottom:-30px; margin-left:-15px; }
.so-widget-timeline .tooltip::after { border-color:#fff transparent transparent transparent; border-width:14px; bottom:-28px; margin-left:-14px; }

.so-widget-timeline .tooltip .icon { color:#10367A; font-size:36px; }

.so-widget-timeline .tooltip .name { margin:6px 0; }

.so-widget-timeline .tooltip .time { color:#10367A; font-size:24px; font-weight:400; line-height:1.3; }

@media (max-width:1199px) {
	.so-widget-timeline .tooltip { margin:0 15px; }
}

@media (max-width:991px) {
	.so-widget-timeline .timeline { display:block; }

	.so-widget-timeline .event .circle::before { width:3px; height:100%; }

	.so-widget-timeline .tooltip { margin:0 auto; width:300px; max-width:100%; }
}
