* {
  box-sizing: border-box;
}

.text>li{
  margin-bottom: -14px !important;
}

.title1_2{
      margin: 0px 0px 70px !important;
}


.timeline {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
}


.timeline::after {
  content: '';
  position: absolute;
  width: 2px;
  background-color: #A5A5A5;
  top: 100px;
  bottom: 12px;
  left: 25.8%;
  margin-left: -3px;
}


.cont_1 {
  padding: 10px 40px;
  position: relative;
  background-color: inherit;
  width: 70%;
}
.cont_2 {
  padding: 10px 40px;
  position: relative;
  background-color: inherit;
  width: 25%;
  display: inline-block;
}

.cont_1::after {
  content: '';
  position: absolute;
  width: 35px;
  height: 35px;
  right: -17px;
  background-color: white;
  border: 2px solid #A5A5A5;
  top: 32px;
  border-radius: 50%;
  z-index: 1;
}



.left {
  left: 75px;
  top: 72px;
}

.right {
  left: 25.5%;
}



.right::after {
  left: -16px;
}


.content {
  padding: 4px 30px;
  background-color: transparent;
  position: relative;
  border-radius: 6px;
}

.row{
  margin-left: 0px;
  margin-right: 0px;
}


@media screen and (max-width: 600px) {
  .timeline::after {
  left: 31px;
  }

  .cont_1 {
  width: 100%;
  padding-left: 70px;
  padding-right: 25px;
  }

  .cont_2 {
  width: 100%;
  padding-left: 70px;
  padding-right: 25px;
  }


  .cont_1::before {
  left: 60px;
  border: medium solid white;
  border-width: 10px 10px 10px 0;
  border-color: transparent white transparent transparent;
  }


  .left::after, .right::after {
  left: 15px;
  }


  .right {
  left: 0%;
  }
}
/*CARDS COLLAPSE*/
.card{
  /* margin: 0% 5%; */
  background-color: transparent;
  border: 0px solid rgba(0,0,0,.125);
}
.card-body{
  /* margin: 1%; */
  background-color: white;
  /* border: 1px solid rgba(0,0,0,.125); */
}
.card-header{
  margin: 1%;
  background-color: #d8d8d8;
}
.cont_1_titleCollapse{
  display: flex;
  justify-content: space-between;
  background-color: #464444;
  padding: 0px 24px 12px;
}
.title_collapse{
  color: #EED972;
  white-space: pre-line;
  font-size: 18px;
  margin-bottom: 10px;
  font-weight: 500;
}
.title_collapse[aria-expanded="true"] {
    font-weight: bold;
}
.title_collapse::before{
  content: " ";
  height: 0;
  position: absolute;
  top: 22px;
  width: 0;
  z-index: 1;
  left: -10px;
  border: medium solid white;
  border-width: 10px 10px 10px 0;
  border-color: transparent #464444 transparent transparent;
}
.text_descriptionCollapse{
  padding: 12px 40px 12px 40px;
  background: white;
  margin: 0px 0px 7px;
}
.text_descriptionCollapse>ul>li
{
  margin-top: 5px !important;
  margin-bottom: 5px !important;
}
.dateTimeLine{
  color: black;
  font-size: 20px;
  font-weight: 500px;
}
.dateTimeLine[aria-expanded="true"]{
  font-weight: bold;
  color: #BA9B00;
  transform: scale(1.2);
}

/* #eventCollapseOne[aria-expanded="true"]::after{
  background-color: blue;
} */

.card-body{
  padding: 10px 40px 10px 40px;
}

#eventCollapse1::after, #eventCollapse2::after, #eventCollapse3::after, #eventCollapse4::after{
  background-color: var(--backgroundColor);
  border: var(--border);
}


@media screen and (max-width: 1199px){
  .left{
    left: 20px;
  }
  .right{
    left: 25%;
  }
  .timeline::after {
    left: 25.3%;
    bottom: 15px;
  }
  .cont_1::after {
    top: 28px;
  }
  .cont_2{
    width: 30%;
  }
  .content{
    width: 650px;
  }
}

@media screen and (max-width: 991px){
  .left{
    top: 10px;
    left: 128px;
  }
  .right{
    left: 8%;
  }
  .content{
    width: 600px;
  }
  .timeline::after {
    left: 8.3%;
    bottom: 14px;
  }
  .cont_2{
    padding: 10px 10px;
  }
  .title1_1 {
    margin: 0px 0px 30px !important;
  }
}

@media screen and (max-width: 767px){
  .left{
    left: 48px;
    top: 20px;
  }
  .right{
    left: 8%;
  }
  .right::after {
    left: -65px;
  }
  .content {
    width: 100%;
    padding: 4px 10px;
  }
  .cont_1 {
    width: 100%;
    padding: 10px 0px;
  }
  .timeline::after {
    left: -1%;
  }
  .dateTimeLine {
    font-size: 18px;
  }
  .title_collapse{
    font-size: 16px;
  }
  .title1_2{
    margin: 15px 0px 48px !important;
  }

}

@media screen and (max-width: 600px){
  .left {
    left: 96px;
  }
  .right {
    left: 18%;
  }
  .timeline::after {
    left: 9%;
    bottom: 16px;
  }
  .content{
    width: 80%;
  }
  /* .cont_2 {
    width: 22%;
  } */
}


@media screen and (max-width: 575px){
  .right {
    left: 18%;
  }
  .timeline::after {
    left: 8.5%;
  }
  /* .cont_2 {
    width: 25%;
  } */
}

@media screen and (max-width: 480px){
  .left {
    left: 82px;
  }
  .right {
    left: 18%;
  }
  .timeline::after {
    left: 6.5%;
    /* bottom: 180px; */
  }
  .cont_2 {
    width: 36%;
  }
  .dateTimeLine {
    font-size: 16px;
  }
}
@media screen and (max-width: 420px){
  /* .left {
    left: 70px;
  } */
  .right::after {
    left: -58px;
  }
  .cont_2{
    width: 42%;
  }
  .cont_1_titleCollapse {
    padding: 0px 20px 12px;
  }
  .text_descriptionCollapse{
    padding: 12px 20px 12px 20px;
  }
  .card-body {
    padding: 10px 20px 10px 20px;
  }
  .title1_1 {
    margin: 0px 0px 20px !important;
  }
  .timeline::after{
    /* bottom: 205px; */
  }
}

@media screen and (max-width: 375px){
  .left {
    left: 60px;
  }
  .right {
    left: 16%;
  }
  .right::after{
    left: -43px;
  }
  .content {
    width: 85%;
  }
  .cont_2 {
    width: 44%;
  }
  .cont_1::after{
    width: 30px;
    height: 30px;
    top: 32px;
  }
  .timeline::after{
    left: 7%;
  }
  .title1_2{
    margin: 25px 0px 48px !important;
  }
}
@media screen and (max-width: 360px){
  .cont_2 {
    width: 46%;
  }
  .left {
    left: 55px;
  }
  .title_collapse{
    font-size: 15px;
  }
}