#timeline .note:nth-child(3).animated{
  -webkit-animation-delay: 0.4s;
    -moz-animation-delay: 0.4s;
    -o-animation-delay: 0.4s;
    -ms-animation-delay: 0.4s;
}

#timeline .note:nth-child(4).animated{
  -webkit-animation-delay: 0.7s;
    -moz-animation-delay: 0.7s;
    -o-animation-delay: 0.7s;
    -ms-animation-delay: 0.7s;
}

#timeline .note:nth-child(5).animated{
  -webkit-animation-delay: 1s;
    -moz-animation-delay: 1s;
    -o-animation-delay: 1s;
    -ms-animation-delay: 1s;
}

#timeline .note:nth-child(6).animated{
  -webkit-animation-delay: 1.3s;
    -moz-animation-delay: 1.3s;
    -o-animation-delay: 1.3s;
    -ms-animation-delay: 1.3s;
}

#timeline .note:nth-child(8).animated{
  -webkit-animation-delay: 1.6s;
    -moz-animation-delay: 1.6s;
    -o-animation-delay: 1.6s;
    -ms-animation-delay: 1.6s;
}

#timeline .note:nth-child(9).animated{
  -webkit-animation-delay: 1.9s;
    -moz-animation-delay: 1.9s;
    -o-animation-delay: 1.9s;
    -ms-animation-delay: 1.9s;
}
/*
* TIMELINE SECTION
* -------------------------------------------------- */






@media (max-device-width : 1024px)  {     

#timeline {
background:url(../img/rodetrip.jpg) center top no-repeat;

  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
color:#fff;

}/* STYLES GO HERE */ }





@media (min-width: 1025px) {
  #timeline {
background:url(../img/rodetrip.jpg) center top fixed;

  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
color:#fff;

}
}








#timeline .line {
background:#fff;
height:100%;
left:49.9%;
position:absolute;
width:3px;
}

#timeline ul.timeline {
display:block;
height:auto;
margin:50px auto 0;
padding:0 0 150px;
position:relative;
width:100%;
}

#timeline ul.timeline li.note {
-moz-transition:all .3s;
-webkit-transition:all .3s;
background:#FFF;
cursor:pointer;
float:right;
margin:35px 0;
min-height:1px;
padding:14px 14px 0;
position:relative;
text-align:left;
transition:all .3s;
width:46%;
}

#timeline ul.timeline li.note .note-circle {
background:#FFF;
border-radius:100px;
display:block;
height:21px;
left:-10.7%;
position:absolute;
right:auto;
top:50%;
width:21px;
z-index:20;
}

#timeline ul.timeline li.note p.timeline-date,#timeline ul.timeline li.note p.timeline-head,#timeline ul.timeline li.note p.timeline-desc {
color:#FFF;
}

#timeline ul.timeline li.note span.note-arrow,#timeline ul.timeline li.note span.note-arrow:after {
border-right-color:#278DC5;
}

#timeline ul.timeline li.note,#timeline ul.timeline li.note:after {
background:#278DC5;
}

#timeline ul.timeline li.note:nth-of-type(2n) {
clear:left;
float:left;
}

#timeline ul.timeline li.note:nth-of-type(2n) .note-circle {
left:auto;
right:-10.7%;
}

#timeline ul.timeline li.note:nth-of-type(2n) span.note-arrow,#timeline ul.timeline li.note:nth-of-type(2n) span.note-arrow:after {
border-left-color:#278DC5;
}

#timeline ul.timeline li.note:nth-of-type(2n+1):before {
border-bottom:10px solid transparent;
border-right:10px solid #278DC5;
border-top:10px solid transparent;
content:'';
display:block;
height:0;
left:-10px;
position:absolute;
right:auto;
top:50%;
width:0;
}

#timeline ul.timeline li.note:nth-of-type(2n+2):before {
border-bottom:10px solid transparent;
border-left:10px solid #278DC5;
border-top:10px solid transparent;
content:'';
left:auto;
position:absolute;
right:-10px;
top:50%;
}

#timeline ul.timeline li.start {
bottom:-1%;
clear:both;
display:block;
height:70px;
left:49.9%;
margin-left:-35px;
position:absolute;
width:70px;
}

#timeline ul.timeline li.start a {
background:#fff;
border-radius:50%;
color:#191919;
display:block;
font-size:25px;
height:70px;
line-height:60px;
text-align:center;
width:70px;
}

#timeline ul.timeline li.start a span.up-arrow {
-moz-transform:rotate(-45deg);
-webkit-transform:rotate(-45deg);
background:url(../images/up-arrow.png) no-repeat center center;
display:block;
height:17px;
line-height:50px;
margin:0 auto;
position:relative;
top:20px;
transform:rotate(-45deg);
width:12px;
}

#timeline ul.timeline li.time {
background:#fff;
border-radius:50%;
clear:both;
color:#191919;
cursor:default;
font-size:20px;
height:70px;
line-height:65px;
margin:0px auto;
position:relative;
text-align:center;
width:70px;
}

#timeline ul.timeline li.time + li.note {
margin-top:-5px;
}

#timeline ul.timeline li.today {
background:#fff;
border-radius:50%;
color:#191919;
height:70px;
line-height:65px;
margin:40px auto;
width:70px;
}

.timeline {
padding-bottom:0;
}

.inner {
height:auto;
margin:0 auto;
position:relative;
text-align:center;
width:100%;
}

.inner:after,.clear {
clear:both;
}

li.note p,li.note span,li.note span:after {
-moz-transition:all .3s;
-webkit-transition:all .3s;
transition:all .3s;
}

li.note p.timeline-date,li.note p.timeline-desc {
color:#949494;
font-size:13px;
}

li.note p.timeline-head {
color:#696969;
font-size:17px;
margin:3px auto;
}

/* Tooltip */

 .tooltip-inner{

-webkit-border-radius:0;

   -moz-border-radius:0;

        border-radius:0;

padding:10px;

font-size:15px;

}