Timeline
Use tm-timeline class to indicate events in a vertical chronological order. The timeline blocks alternate left and right positions. You can set the icon using the tm-timeline-icon class, the date using the tm-timeline-date class and the style using the tm-timeline-{style} class (styles can either be tm-timeline-default, tm-timeline-light, tm-timeline-primary or tm-timeline-secondary).
We are open
We opened our doors in the summer of 1933 and served our very first clients in Hamburg.
Acquisition & rebranding
After 30 years of services, we acquired Fintech solutions and rebranded our company brand.
Expansion of operations
With over 1200 clients all across the world, we became the top financial advisor for many internationals.
London branch opens
In January 2000, we open our first overseas office in the heart of London to better server our clients in UK.
Records broken
In our 78th anniversary, we posted a record $15 Billion trading profit making it the most profitable financial company in Germany
New things
In 2016, we ventured into new markets to expand our folio and establish our fiscal acumen in the industy.
Show code
<section id="tm-timeline">
<div class="tm-timeline-block tm-timeline-default" data-uk-scrollspy="{cls:'uk-animation-fade', delay: 300}">
<div class="tm-timeline-icon"></div>
<div class="tm-timeline-content">
<span class="tm-timeline-date">1933</span>
<div class="tm-timeline-img uk-cover-background" style="min-height: 150px; background-image: url(images/demo/general/timeline-1.jpg);"></div>
<h3 class="uk-module-title">We are open</h3>
<p>We opened our doors in the summer of 1933 and served our very first clients in Hamburg.</p>
</div>
</div>
<div class="tm-timeline-block tm-timeline-default" data-uk-scrollspy="{cls:'uk-animation-fade', delay: 300}">
<div class="tm-timeline-icon"></div>
<div class="tm-timeline-content">
<span class="tm-timeline-date">1963</span>
<h3 class="uk-module-title">Acquisition & rebranding</h3>
<p>After 30 years of services, we acquired Fintech solutions and rebranded our company brand.</p>
</div>
</div>
<div class="tm-timeline-block tm-timeline-default" data-uk-scrollspy="{cls:'uk-animation-fade', delay: 300}">
<div class="tm-timeline-icon"></div>
<div class="tm-timeline-content">
<span class="tm-timeline-date">1977</span>
<h3 class="uk-module-title">Expansion of operations</h3>
<p>With over 1200 clients all across the world, we became the top financial advisor for many internationals.</p>
</div>
</div>
<div class="tm-timeline-block tm-timeline-primary" data-uk-scrollspy="{cls:'uk-animation-fade', delay: 300}">
<div class="tm-timeline-icon"></div>
<div class="tm-timeline-content">
<span class="tm-timeline-date">2000</span>
<div class="tm-timeline-img uk-cover-background" style="min-height: 150px; background-image: url(images/demo/general/timeline-2.jpg);"></div>
<h3 class="uk-module-title">London branch opens</h3>
<p>In January 2000, we open our first overseas office in the heart of London to better server our clients in UK.</p>
</div>
</div>
<div class="tm-timeline-block tm-timeline-default" data-uk-scrollspy="{cls:'uk-animation-fade', delay: 300}">
<div class="tm-timeline-icon"></div>
<div class="tm-timeline-content">
<span class="tm-timeline-date">2011</span>
<h3 class="uk-module-title">Records broken</h3>
<p>In our 78th anniversary, we posted a record $15 Billion trading profit making it the most profitable financial company in Germany</p>
</div>
</div>
<div class="tm-timeline-block tm-timeline-secondary" data-uk-scrollspy="{cls:'uk-animation-fade', delay: 300}">
<div class="tm-timeline-icon"></div>
<div class="tm-timeline-content">
<span class="tm-timeline-date">2016</span>
<h3 class="uk-module-title">New things</h3>
<p>In 2016, we ventured into new markets to expand our folio and establish our fiscal acumen in the industy.</p>
</div>
</div>
</section>
