* {
  box-sizing: border-box;
}

h1 {
  text-align: center;
  font-family: "Raleway", sans-serif;
}

.timeline {
  position: relative;
  padding: 1rem;
  margin: 0 auto;
  max-width: 1300px;
}

.timeline:before {
  content: "";
  position: absolute;
  height: 100%;
  border: 1px solid rgb(179, 179, 179);
  right: 40px;
  top: 0;
}

.timeline:after {
  content: "";
  display: table;
  clear: both;
}

@media screen and (min-width: 700px) {
  .timeline {
    padding: 2rem;
  }
  .timeline:before {
    left: calc(50% - 1px);
    right: auto;
  }
}

.timeline__item {
  padding: 1rem;
  margin: 1rem 3rem 1rem 1rem;
  clear: both;
}

.timeline__item:after, .timeline__item:before {
  content: "";
  position: absolute;
}

.timeline__item:before {
  right: -10px;
  top: calc(50% - 5px);
  border-width: 10px;
  transform: rotate(45deg);
}

@media screen and (min-width: 700px) {
  .timeline__item {
    width: 44%;
    margin: 1rem;
  }

  .timeline__item_image {
    width: 44%;
    margin: 1rem;
  }

  .timeline__item:nth-of-type(2n) {
    float: right;
    margin: 1rem;
    border-image-slice: 1;
  }

  .timeline__item_image {
    float: right;
    margin: 1rem;
    border-image-slice: 1;
  }

  .timeline__item:nth-of-type(2n):before {
    right: auto;
    left: -10px;
  }

  .timeline__item_image:before {
    right: auto;
    left: -10px;
    border-color: transparent transparent hotpink hotpink;
  }
}

.timeline__item--year {
  text-align: center;
  max-width: 150px;
  margin: 0 48px 0 auto;
  line-height: 1;
  border-image: none;
  padding: 0.5rem 1rem 1rem;
}

.timeline__item--year:before {
  display: none;
}
.timeline__item img.img-full.image {
  float: left;
  margin-right: 20px;
  max-width: 200px;
}

@media screen and (min-width: 700px) {

  .timeline__item img.img-full.image {
    margin-right: 20px;
    max-width: 200px;
  }

  .timeline__item--year {
    text-align: center;
    margin: 0 auto;
    font-size: 65px;
    font-family: "Plus Jakarta Sans", sans-serif;
    color: black; 
  }

  .timeline__item--year:nth-of-type(2n) {
    float: none;
    margin: 0 auto;
    border-image: none;
  }

  .timeline__item--year:nth-of-type(2n):before {
    display: none;
  }
}

.timeline__title {
  margin: 0;
  font-family: "Raleway", sans-serif;
  font-size: 1.5em;
}

.timeline__blurb {
  line-height: 1.5;
  font-size: 1rem;
  margin: 0.5rem 0 0;
}

.timeline__item img.img-full.image {
  float: right;
  margin-left: 20px;
  max-width: 200px; /* Adjust as needed */
}

@media screen and (min-width: 700px) {
  .timeline__item img.img-full.image {
    margin-left: 20px;
    max-width: 200px; /* Adjust as needed */
  }
}

  
  .timeline{
      position:relative;
      /* margin-bottom:100px; */
      z-index:1;
  }
  
  .timeline:before{
      display:block;
      content:"";
      position:absolute;
      /* width:50%; */
      height:100%;
      top:0;
      border-right:2px solid #bbbbbb;
      z-index:-1;
  } 
  
  .timeline:after{
      display:block;
      content:"";
      position:absolute;
      width:50%;
      height:100px;
      left:1px;
      bottom:-105px;
      /* border-right:1px solid #bbbbbb; */
      z-index:-1;
  } 
  
  .timeline .date-title{
      text-align:center;
      margin:70px 0 50px;
  }
  
  .timeline .date-title span{
      padding:15px 30px;
      font-size:40px;
      font-weight:600;
      color:#000000;
      border-radius:5px;
      font-family: "Plus Jakarta Sans", sans-serif;
  }
  
  .news-item {
      padding-bottom:45px;
  }
  
  .news-item.right {
      float:right;
      margin-top:40px;
  }
  
  .news-item .news-content {
      margin:20px 30px 0 0;
      position:relative;
      padding:30px;
      padding-left:100px;
      /* background:#f5f5f5; */
      border-radius:10px;
      /* box-shadow:-5px 5px 0 rgba(0,0,0,0.08); */
      /* -webkit-transition:all .3s ease-out; */
      /* transition:all .3s ease-out; */
  }


  .news-item .news-content-image {
    margin:0px 30px 0 0;
    position:relative;
    padding:0px;
    padding-left:100px;
    /* background:#f5f5f5; */
    border-radius:10px;
    /* box-shadow:-5px 5px 0 rgba(0,0,0,0.08); */
    /* -webkit-transition:all .3s ease-out; */
    /* transition:all .3s ease-out; */
}

  
  .news-item:hover .news-content {
      /* background:#5CC9DF; */
      color:#fff;
  }

  

  
  .news-item.right .news-content:after {
      position:absolute;
      left:-40px;
      right:auto;
      border-left:20px solid transparent;
      border-right:20px solid #f5f5f5;
      -webkit-transition:border-right-color .3s ease-out;
      transition:border-right-color .3s ease-out;
  }

  
  .news-item.right:hover .news-content:after {
      border-left-color:transparent;
      border-right-color:#5CC9DF;
  }

  
  .news-item.right .news-content:before {
      left:-55px;
      right:auto;
  }
  
  .news-content .date {
      position:absolute;
      width:80px;
      height:80px;
      left:10px;
      text-align:center;
      color:#5CC9DF;
      -webkit-transition:color .3s ease-out;
      transition:color .3s ease-out;
  }
  
  .news-item:hover .news-content .date {
      color:#fff;
  }
  
  .news-content .date p{
      margin:0;
      font-size:48px;
      font-weight:600;
      line-height:48px;
  }
  
  .news-content .date small{
      margin:0;
      font-size:26px;
      font-weight:300;
      line-height:24px;
  }
  
  .news-content .news-title{
      font-weight:500;
      font-size: 34px;
      line-height: 46px;
      text-align: center;
      font-family: "Plus Jakarta Sans", sans-serif;
  }

  .news-content p{
      font-size: 18px;
      line-height:24px;
      font-weight:300;
      letter-spacing:0.02em;
      font-family: "Plus Jakarta Sans", sans-serif;
      margin-bottom:10px;
      color: #939393;
  }


  
  .news-content .read-more,
  .news-content .read-more:hover,
  .news-content .read-more:active,
  .news-content .read-more:focus{
      padding:10px 0;
      text-decoration:none;
      font-size:16px;
      color:#7A7C7F;
      line-height:24px;
  }
  
  .news-item:hover .news-content .read-more,
  .news-item:hover .news-content .read-more:hover,
  .news-item:hover .news-content .read-more:active,
  .news-item:hover .news-content .read-more:focus{
      color:#fff;
  }
  
  .news-content .read-more{
      -webkit-transition:padding .3s ease-out;
      transition:padding .3s ease-out;
  }
  
  .news-content .read-more:hover {
      padding-left:7px;
  }
  
  .news-content .read-more:after{
      content:'\f054';
      padding-left:15px;
      font-family:'FontAwesome';
      font-size:21px;
      line-height:21px;
      color:#5CC9DF;
      vertical-align:middle;
      -webkit-transition:padding .3s ease-out;
      transition:padding .3s ease-out;
  }
  
  .news-content .read-more:hover:after{
      padding-left:20px;
  }
  
  .news-item:hover .news-content .read-more:after{
      color:#fff;
  }
  
  .news-content .news-media{
      position:absolute;
      width:80px;
      bottom:-45px;
      right:40px;
      border-radius:8px;
  }
  
  .news-content .news-media img{
      border-radius:8px;
      transform:scale(1);
      -webkit-transition:-webkit-transform .3s ease-out;
      transition:transform .3s ease-out;
  }
  
  .news-content .news-media a{
      display:block;
    text-decoration:none;
      background:#fff;
      border-radius:8px;
      overflow:hidden;
      -webkit-mask-image: -webkit-radial-gradient(circle, white, black);
  }
  
  .news-content .news-media a:hover img{
      -webkit-transform:scale(1.3);
      transform:scale(1.3);
  }
  
  .news-content .news-media a:after{
      content:'\f065';
      position:absolute;
      width:100%;
      top:0;
      left:0;
      font-family:FontAwesome;
      font-size:32px;
      line-height:80px;
      text-align:center;
      color:#5CC9DF;
      -webkit-transform:scale(0);
      transform:scale(0);
      opacity:0;
      -webkit-transition:all .2s ease-out .1s;
      transition:all .2s ease-out .1s;
  }
  
  .news-content .news-media.video a:after{
      content:'\f04b';
  }
  
  .news-content .news-media a:hover:after{
      -webkit-transform:scale(1);
      transform:scale(1);
      opacity:1;
  }
  
  .news-content .news-media.gallery{
      box-shadow:4px 4px 0 #bbb,8px 8px 0 #ddd;
  }