



/*--timeline Process*/





.prosses-timeline{

  position: relative;

}

.prosses-timeline .conference-center-line{

  position: absolute;

  width:100%;

  height:2px;

  top:50%;

  transform: translateY(-50%);

  background:#9a9a9a;

}

.main-timeline-section{

  position: relative; 

  width: 100%;  

  margin:auto; 

  height:300px;

}

.main-timeline-section .timeline-end{

  right:0px;

}

.main-timeline-section .conference-center-line{

  position: absolute;

  width:100%;

  height:2px;

  top:50%;

  transform: translateY(-50%);

  background:#9a9a9a;

}

.timeline-article{

    width: 20%;

    position: relative;

    min-height: 300px;

    float:left;

}

.timeline-article .content-date{

    position: absolute;

    top: 35%;

    left: 50%; 

    font-size:18px;

}

.timeline-article .meta-date{

    position: absolute;

    top: 50%;

    left: 25%;

    transform: translateY(-50%); 

    width:30px;

    height:30px;

    border-radius: 100%;

    background-image: -moz-linear-gradient( 0deg, rgb(255,150,0) 0%, rgb(255,78,0) 100%);

    background-image: -webkit-linear-gradient( 0deg, rgb(255,150,0) 0%, rgb(255,78,0) 100%);

    background-image: -ms-linear-gradient( 0deg, rgb(255,150,0) 0%, rgb(255,78,0) 100%);

    border:5px solid #dddddd;

}

.timeline-article.st-two .meta-date {

  left: 40%;

}

.timeline-article.st-three .meta-date {

  left: 75%;

}

.timeline-article.st-four .meta-date {

  left: 100%;

}

.timeline-article .meta-date.top-line::before{

  content: '';

    width: 2px;

    height: 15px;

    background: #9a9a9a;

    position: absolute;

    top: -20px;

    left: 50%;

}

.timeline-article .meta-date.bot-line::before{

  content: '';

    width: 2px;

    height: 15px;

    background: #9a9a9a;

    position: absolute;

    bottom: -20px;

    left: 50%;

}

.timeline-article .content-box{

  width: 180px;

  position: absolute;

  top: 60%;

  left: 0; 

  padding:10px;

}

.timeline-article.st-two .content-box{

  left: -40%;

}

.timeline-article.st-three .content-box{

  left: 50%;

}

.timeline-article.st-four .content-box{

  left: -40%;

}

.timeline-article-bottom .content-date{

  top: 59%;

}

.timeline-article-bottom .content-box{

  top: -15%;

}

.timeline-article-bottom .content-box img, .timeline-article-top .content-box img {

    width: 115px;

    height: 115px;

  margin-right: 15px;

  max-width: none;

}

.content-box h4 {

    font-weight: 900;

  text-transform: uppercase;

    background: -webkit-linear-gradient(#ff9600, #ff4e00);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

  margin-bottom: 5px;

}

.content-box h6 {

    font-weight: 900;

}

.content-box p {

    width: 290px;

  font-size: 0.9rem;

}

.st-one .content-box p {

    width: 290px;

}

.st-two .content-box p {

    width: 260px;

}

.st-three .content-box p {

    width: 320px;

}

.st-four .content-box p {

    width: 390px;

}



/*@media screen and (min-device-width: 992px) and (max-device-width: 1170px) { 

  .timeline-article.st-two .content-box {

    left: -70%;

  }

  .st-four .content-box p {

    width: 300px;

  }

}*/

@media (max-width: 1920px) {

  .prosses-timeline > .conference-center-line{

    display: none;

  }

  .main-timeline-section .conference-center-line {

    width: 2px;

    height: 110%;

    top: 0;

    transform: translateY(0%);

    left: 50% !important;

  }

  .timeline-article.st-two .content-box,
  .timeline-article.st-four .content-box {
      float: right;
  }


  .timeline-article.st-two .meta-date, .timeline-article.st-four .meta-date {
      left: 51% !important;
  }


  .timeline-article.st-two .meta-date.bot-line::before, .timeline-article.st-four .meta-date.bot-line::before {
      left: -15px !important;
  }

  .timeline-article {

    width: auto;

    float: none;

    min-height: 200px;

    clear: both;

  }

  .timeline-article .content-box {

    width: 470px;

    position: relative;

    left: 50px;

    top: auto;

  }

  .timeline-article .meta-date {
      top: 25%;
      left: 46% !important;
      transform: translateY(50%);
  }

  .timeline-article .meta-date.top-line::before, .timeline-article .meta-date.bot-line::before {

    content: '';

    width: 15px;

    height: 2px;

    top: 10px;

    left: 25px;

  }

  .timeline-article.st-one .meta-date, .timeline-article.st-three .meta-date{

    left: -15px;

  }

  .timeline-article.st-one .content-box, .timeline-article.st-two .content-box, .timeline-article.st-three .content-box, .timeline-article.st-four .content-box {

    left: 0px;

  }

  .main-timeline-section {

    height: auto;

  }

  .st-one .content-box p, .st-two .content-box p, .st-three .content-box p, .st-four .content-box p{

    width: auto;

  }

}

.big-tx-bx {

    text-align: center;

    position: relative;

    /*min-height: 100px;*/

}

.big-tx {

    font-size: 14.2857142857rem !important;

    font-weight: 900;

    color: #f3f3f3;

    position: absolute;

    width: 100% !important;

    top: -18px;

}



@media (max-width: 1920px) {

  .big-tx{

    font-size: 10rem !important;

    width: auto;

  }

  .big-tx-bx {

    min-height: auto;

  }

}


@media (max-width: 1112px) {

  .timeline-article .content-box {
      width: 440px;
  }

}

@media (max-width: 1024px) {

  .timeline-article .content-box {
      width: 400px;
      left: 50px;
  }

  .timeline-article.st-two .meta-date.bot-line::before, .timeline-article.st-four .meta-date.bot-line::before {
      left: -14px !important;
      width: 10px;
  }

  .timeline-article .meta-date.top-line::before, .timeline-article .meta-date.bot-line::before {
      content: '';
      width: 6px;
      left: 25px;
  }

  .main-timeline-section .conference-center-line {
      height: 110%;
  }

}


@media (max-width: 991px) {

  .main-timeline-section .conference-center-line {
      height: 100%;
      left: 10px !important;
  }

  .timeline-article .content-box {
      width: auto;
      left: 25px !important;
  }

  .timeline-article.st-one .meta-date, .timeline-article.st-three .meta-date,
  .timeline-article.st-two .meta-date, .timeline-article.st-four .meta-date {
    left: -30px !important;
  }


  .timeline-article .meta-date.top-line::before, .timeline-article .meta-date.bot-line::before {
      width: 10px !important;
      left: 25px !important;
  }

  .timeline-article {
      min-height: 150px;
  }

  .timeline-article.st-two .meta-date.bot-line::before, .timeline-article.st-four .meta-date.bot-line::before {
    left: 25px !important;
  }

}





@media (max-width: 768px) {
  .big-tx{

    font-size: 5rem !important;

    margin-top: 15px;

    margin-bottom: -94px;

    position: relative;

  }

}

@media (max-width: 767px) {

  .main-timeline-section .conference-center-line {
      height: 115% !important;
  }


}