MYMEMORY WARNING: YOU USED ALL AVAILABLE FREE TRANSLATIONS FOR TODAY. NEXT AVAILABLE IN 23 HOURS 56 MINUTES 32 SECONDS VISIT HTTPS://MYMEMORY.TRANSLATED.NET/DOC/USAGELIMITS.PHP TO TRANSLATE MORE
MYMEMORY WARNING: YOU USED ALL AVAILABLE FREE TRANSLATIONS FOR TODAY. NEXT AVAILABLE IN 23 HOURS 56 MINUTES 31 SECONDS VISIT HTTPS://MYMEMORY.TRANSLATED.NET/DOC/USAGELIMITS.PHP TO TRANSLATE MORE
MYMEMORY WARNING: YOU USED ALL AVAILABLE FREE TRANSLATIONS FOR TODAY. NEXT AVAILABLE IN 23 HOURS 56 MINUTES 29 SECONDS VISIT HTTPS://MYMEMORY.TRANSLATED.NET/DOC/USAGELIMITS.PHP TO TRANSLATE MORE
<div class="main-container">
<section id="timeline" class="timeline-outer">
<div class="container" id="content">
<div class="row">
<div class="col s12 m12 l12">
<h1 class="blue-text lighten-1 header">Responsive Material Design Timeline</h1>
<ul class="timeline">
<li class="event" data-date="2015/Present">
<h3>Management and Entreprenurship (MSc)</h3>
<p>
This September 2015 I will begin an MSc in Management and Entrepreneurship at University of Sussex, to broaden my knowledge and gain skills necessary for my future in business and management.
</p>
</li>
<li class="event" data-date="2015/Present">
<h3>Claromentis</h3>
<p>
Claromentis is an intranet software provider company. I started working at the Brighton office as a Marketing Designer while I was still attending my final year at the University of Sussex. My primary responsibilities included creating corporate identity
for the company; I re-designed their website, and have created marketing materials such as brochures.
</p>
<p>Since graduating from university, I have also undertaken responsibilities for designing a product for the company. The roles I have been given have provided the perfect opportunity to implement the skills I have gained throughout my higher
education, as well as experiencing the running of a successful business.</p>
</li>
<li class="event" data-date="2012/2015">
<h3>Games & Multimedia Environments BSc (Hons)</h3>
<p>Throughout my degree I have gained expansive knowledge of informatics areas including Human Computer Interaction, Multimedia Design and Development, Program Analysis and Design For my final year project, I created a 2D Puzzler Game for iOS
called Flat Ball and received a first. I therefore hope to release this game and further develop it to add new levels and improve the features.
</p>
</li>
<li class="event" data-date="2012/2015">
<h3>1108 Studios</h3>
<p>This is a small startup that a friend and I created to gain more skills and apply those I had learned while completing my diploma. Since its inception, as a front - end web developer I have advised, designed and built web solutions for numerous
clients.</p>
</li>
<li class="event" data-date="2010/2012">
<h3>IT Practitioners BTEC National Diploma</h3>
<p>This is where my interest in building things for interactive media began. During my first computing course I studied a range of core topics including multimedia design, database design, computer games development, computer networks and object
oriented programming.</p>
</li>
</ul>
</div>
</div>
</div>
</section>
<a class="portfolio-link" target "_blank" href="http://www.erpik.com"><h6>www.erpik.com</h6></a>
<br/>
</div>
MYMEMORY WARNING: YOU USED ALL AVAILABLE FREE TRANSLATIONS FOR TODAY. NEXT AVAILABLE IN 23 HOURS 56 MINUTES 28 SECONDS VISIT HTTPS://MYMEMORY.TRANSLATED.NET/DOC/USAGELIMITS.PHP TO TRANSLATE MORE
/*——————————————
Global
———————————————*/
body {
font-family: helvetica;
}
/*——————————————
TimeLine CSS
———————————————*/
/* Base */
#content {
margin-top: 50px;
text-align: center;
}
section.timeline-outer {
width: 80%;
margin: 0 auto;
}
h1.header {
font-size: 50px;
line-height: 70px;
}
/* Timeline */
.timeline {
border-left: 8px solid #42A5F5;
border-bottom-right-radius: 2px;
border-top-right-radius: 2px;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
color: #333;
margin: 50px auto;
letter-spacing: 0.5px;
position: relative;
line-height: 1.4em;
padding: 20px;
list-style: none;
text-align: left;
}
.timeline h1,
.timeline h2,
.timeline h3 {
font-size: 1.4em;
}
.timeline .event {
border-bottom: 1px solid rgba(160, 160, 160, 0.2);
padding-bottom: 15px;
margin-bottom: 20px;
position: relative;
}
.timeline .event:last-of-type {
padding-bottom: 0;
margin-bottom: 0;
border: none;
}
.timeline .event:before,
.timeline .event:after {
position: absolute;
display: block;
top: 0;
}
.timeline .event:before {
left: -177.5px;
color: #212121;
content: attr(data-date);
text-align: right;
/* font-weight: 100;*/
font-size: 16px;
min-width: 120px;
}
.timeline .event:after {
box-shadow: 0 0 0 8px #42A5F5;
left: -30px;
background: #212121;
border-radius: 50%;
height: 11px;
width: 11px;
content: "";
top: 5px;
}
/**/
/*——————————————
Responsive Stuff
———————————————*/
@media (max-width: 945px) {
.timeline .event::before {
left: 0.5px;
top: 20px;
min-width: 0;
font-size: 13px;
}
.timeline h3 {
font-size: 16px;
}
.timeline p {
padding-top: 20px;
}
section.lab h3.card-title {
padding: 5px;
font-size: 16px
}
}
@media (max-width: 768px) {
.timeline .event::before {
left: 0.5px;
top: 20px;
min-width: 0;
font-size: 13px;
}
.timeline .event:nth-child(1)::before,
.timeline .event:nth-child(3)::before,
.timeline .event:nth-child(5)::before {
top: 38px;
}
.timeline h3 {
font-size: 16px;
}
.timeline p {
padding-top: 20px;
}
}
/*——————————————
others
———————————————*/
a.portfolio-link {
margin: 0 auto;
display: block;
text-align: center;
}
MYMEMORY WARNING: YOU USED ALL AVAILABLE FREE TRANSLATIONS FOR TODAY. NEXT AVAILABLE IN 23 HOURS 56 MINUTES 26 SECONDS VISIT HTTPS://MYMEMORY.TRANSLATED.NET/DOC/USAGELIMITS.PHP TO TRANSLATE MORE
MYMEMORY WARNING: YOU USED ALL AVAILABLE FREE TRANSLATIONS FOR TODAY. NEXT AVAILABLE IN 23 HOURS 56 MINUTES 25 SECONDS VISIT HTTPS://MYMEMORY.TRANSLATED.NET/DOC/USAGELIMITS.PHP TO TRANSLATE MORE
MYMEMORY WARNING: YOU USED ALL AVAILABLE FREE TRANSLATIONS FOR TODAY. NEXT AVAILABLE IN 23 HOURS 56 MINUTES 23 SECONDS VISIT HTTPS://MYMEMORY.TRANSLATED.NET/DOC/USAGELIMITS.PHP TO TRANSLATE MORE
