.main-timeline{
    font-family: 'Lato', sans-serif;
    position: relative;
    padding:10% 0 0;
}
.main-timeline:after{
    content: '';
    display: block;
    clear: both;
}
.main-timeline:before{
    content: '';
    background-color: #333;
    height: 94%;
    width: 1px;
    border-radius: 20px;
    transform: translateX(-50%);
    position: absolute;
    left: 50%;
    top: 0;
}
.main-timeline .timeline{
    width: 50%;
    padding: 0 60px 0 0;
    margin: 0 10px 20px 0;
    float: left;
}
.main-timeline .timeline-content{
    background: transparent;
    text-align: center;
    min-height: 300px;
    padding: 0 0 20px;
    border-radius: 15px;
    display: block;
    position: relative;
    margin-top:-100px;
}
.main-timeline .timeline-content:hover{ text-decoration: none; }
.main-timeline .timeline-icon{
    color: #fff;
    background:url('../img/timeline-year1.png') center no-repeat;
    background-size:cover;
    font-size: 16px;
    letter-spacing:4px;
    line-height: 89px;
    width: 89px;
    height: 89px;
    border-radius: 50%;
    box-shadow: 10px 20px 35px rgba(0,0,0,0.5);
    transform: translateY(-50%);
    position: absolute;
    top: 50%;
    right: -104px;
}
.main-timeline .time-line {width:45px;height:10px;border-bottom:1px solid #333;position:absolute;top:49%;right:-60px;}
.main-timeline .time-line i.fa {position:absolute;right:90%;font-size:12px;padding-top:4px;}
.main-timeline .title{
    color: #fff;
    background-color: #FA9E00;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 5px;
    margin: 0 0 20px;
    border-radius: 25px;
    border: 4px solid #fff;
    box-shadow: 0 0 5px rgba(0,0,0,0.5);
}
.main-timeline .description {
    color: #333;
    font-size: 13px;
    letter-spacing: 0.5px;
    margin: 0 25px 0;
    min-height:200px;
    display:table;
    width:100%;
}
.main-timeline .description p strong {font-size:15px;color:black;font-weight:900;}
.main-timeline .description .desc-align-middle {vertical-align:middle;display:table-cell;height:100%;}
.main-timeline .description img {max-width:200px;}
.main-timeline .timeline:nth-child(even){
    float: right;
    padding: 0 0 0 60px;
    margin: 0 0 20px 10px;
}
.main-timeline .timeline:nth-child(even) .timeline-icon{
    right: auto;
    left: -104px;
}
.main-timeline .timeline:nth-child(even) .time-line {top:49%;left:-60px;}
.main-timeline .timeline:nth-child(even) .time-line i.fa {left:90%;}
/*.main-timeline .timeline:nth-child(4n+2) .timeline-icon,
.main-timeline .timeline:nth-child(4n+2) .title{ background-color: #F20263; }
.main-timeline .timeline:nth-child(4n+3) .timeline-icon,
.main-timeline .timeline:nth-child(4n+3) .title{ background-color: #00CAA2; }
.main-timeline .timeline:nth-child(4n+4) .timeline-icon,
.main-timeline .timeline:nth-child(4n+4) .title{ background-color: #008AD5; }*/
@media screen and (max-width:767px){
  .main-timeline:before {left:0px;}
  .main-timeline .timeline,
  .main-timeline .timeline:nth-child(even){width:100%;}
  .main-timeline .timeline, .main-timeline .timeline:nth-child(even) {padding: 0 0 0 40px;}
  .main-timeline .timeline .timeline-icon{right: auto;left: -106px;}
  .main-timeline .timeline-content {
      background: transparent;
      text-align: center;
      min-height: 125px;
      padding: 0 50px 20px;
      border-radius: 15px;
      display: block;
      position: relative;
      margin-top:0%;}
  .main-timeline .timeline .time-line {top:49%;left:-40px;}
  .main-timeline .timeline:nth-child(even) .time-line {top:49%;left:-40px;}
  .main-timeline .timeline .time-line i.fa {left:90%;}
}
@media screen and (max-width:479px){
  .main-timeline:before {left:40px;}
  .main-timeline .timeline .timeline-icon{right: auto;left: -116px;
    font-size: 11px;
    letter-spacing:2px;
    line-height: 80px;
    width: 80px;
    height: 80px;}
  .main-timeline .description{margin: 0 0 0 5px;}
  .main-timeline .description img {max-width:110px;}
  .main-timeline .timeline .time-line {left:0;}
  .main-timeline .timeline:nth-child(even) .time-line {;left:0;}
    /*.main-timeline .timeline,
    .main-timeline .timeline:nth-child(even){
        padding: 110px 0 0;
    }
    .main-timeline .timeline-icon,
    .main-timeline .timeline:nth-child(even) .timeline-icon{
        transform: translateY(0) translateX(-50%);
        top: -110px;
        left: 50%;
        right: auto;
    }*/
}
