/* TIMELINE
			–––––––––––––––––––––––––––––––––––––––––––––––––– */
			.timeline2 {
				overflow-y: scroll;
				overflow-x: hidden;
				height: 950px;
				top: calc(100%-600px);
				position: relative;
				scroll-behavior:  smooth ;
				 
			}
			.timeline2   *, .timeline2   *::before, .timeline2   *::after { 
				font: normal 16px/1.5 "Helvetica Neue", sans-serif;
				color: #fff;
				margin: 0;
				padding: 0;
				box-sizing: border-box;
			}
			.timeline2::-webkit-scrollbar {
				width: 12px;
				background-color: #F5F5F5;
			}
			 
			.timeline2::-webkit-scrollbar-track {
				-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
				border-radius: 10px;
				background-color: #F5F5F5;
			}
			 
			.timeline2::-webkit-scrollbar-thumb {
				border-radius: 10px;
				-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
				background-color: #555;
			}
			 
			.timeline2 ul {
			  background: #456990;
			  /* padding: 50px 0; */
			}

			.timeline2 ul li {
			  list-style-type: none;
			  position: relative;
			      width: 2px;/* width: 6px; */
			  margin: 0 auto;
				padding-top: 10px;/* 50px; */
				padding-bottom: 10px;/* padding-bottom: 20px; = center padding-bottom: 10px; = center */
			 background: #fff; /* background: black;  */
			  
				border-left: 3px double white;
				
			}

			 
			.timeline2 ul li::after {
			  content: '';
			  position: absolute;
			  left: 50%;
			  top: 30px; /* bottom: 0;  bottom: 50%;=center top: 30px;=top  */ 
			  transform: translateX(-55%);/* transform: translateX(-50%); */
			  -webkit-transform: translateX(-55%);
			  width: 30px;
			  height: 30px;
			  border-radius: 50%;
			  background: inherit;
			  border: 2px solid #03A9F4;
			}

			.timeline2 ul li div {
			  position: relative;
			  bottom: 0;
			  width: 400px;
			  padding: 15px;
			  background: #03A9F4;
			  
			}

			.timeline2 ul li div::before {
			  content: '';
			  position: absolute;
			  top: 20px; /* bottom: 7px; bottom: 50%;=center top: 20px;=top */
			  
			  width: 0;
			  height: 0;
			  border-style: solid;
			}

			.timeline2 ul li:nth-child(odd) div {
			  left: 45px;
			}

			.timeline2 ul li:nth-child(odd) div::before {
			  left: -15px;
				border-width: 16px 16px 16px 0;/* border-width: 8px 16px 8px 0; */
			  border-color: transparent #03A9F4 transparent transparent;
			}

			.timeline2 ul li:nth-child(even) div {
			  left: -439px;
			}

			.timeline2 ul li:nth-child(even) div::before {
			  right: -15px;
			  	border-width: 16px 0 16px 16px; /* border-width: 8px 0 8px 16px; */
			  border-color: transparent transparent transparent #03A9F4;
			}
			
			
			.timeline2 ul li:nth-child(odd) .time {
				position: absolute;
				top: 20px;
				left: -100px;
				width: 90px;
			}
			.timeline2 ul li:nth-child(even) .time {
				position: absolute;
				top: 20px;
				right: -120px;
				width: 90px;
			}
			
			
			.timeline2 time {
			  display: block;
			  font-size: 1.2rem;
			  font-weight: bold;
			  margin-bottom: 8px;
			}


			/* EFFECTS
			–––––––––––––––––––––––––––––––––––––––––––––––––– */

			.timeline2 ul li::after {
				transition: background .5s ease-in-out;
				-webkit-transition: background .5s ease-in-out;
			}

			.timeline2 ul li.in-view::after {
			  background: #03A9F4;
			  border: 2px solid white;
			}

			.timeline2 ul li div {
			  visibility: hidden;
			  opacity: 0;
				transition: all .5s ease-in-out;
				-webkit-transition: all .5s ease-in-out;
			}

			.timeline2 ul li:nth-child(odd) div {
				transform: translate3d(200px, 0, 0);
				-webkit-transform: translate(200px, 0, 0);
			}

			.timeline2 ul li:nth-child(even) div {
				transform: translate3d(-200px, 0, 0);
				-webkit-transform: translate(-200px, 0, 0);
			}

			.timeline2 ul li.in-view div {
				transform: none;
				-webkit-transform: none;
			  visibility: visible;
			  opacity: 1;
			  /* disabled when arrow is on top position
			  border-radius: 10px;
			  */
			}

			/* GENERAL MEDIA QUERIES
			–––––––––––––––––––––––––––––––––––––––––––––––––– */

			@media screen and (max-width: 900px) {
			  .timeline2 ul li div {
				width: 250px;
			  }
			  .timeline2 ul li:nth-child(even) div {
				left: -289px;
				/*250+45-6*/
			  }
			}

			@media screen and (max-width: 900px) {
			  .timeline2 ul li {
				margin-left: 20px;
			  }
			  .timeline2 ul li div {
				width: calc(100vw - 120px);
			  }
			  .timeline2 ul li:nth-child(even) div {
				left: 45px;
			  }
			  .timeline2 ul li:nth-child(even) div::before {
				left: -15px;
				border-width: 16px 16px 16px 0; /* border-width: 8px 16px 8px 0;  */
				border-color: transparent #03A9F4 transparent transparent;
			  }
			  
				
				.timeline2 ul li:nth-child(odd) .time {
					position: absolute;
					top: 60px;
					left: -23px;
					width: 90px;
					/*
					transform: rotate(-90deg);
					-webkit-transform:rotate(270deg);
					*/
					transform: rotate(0deg);
					-webkit-transform:rotate(0deg);
				}
				.timeline2 ul li:nth-child(even) .time {
					position: absolute;
					top: 60px;
					right: -67px;
					width: 90px;
					/*
					transform: rotate(-90deg);
					-webkit-transform:rotate(270deg);
					*/
					transform: rotate(0deg);
					-webkit-transform:rotate(0deg);
				}
				.timeline2 ul li.in-view:nth-child(odd) .time {
					transform: rotate(-90deg);
					-webkit-transform:rotate(270deg);					 
				}
				.timeline2 ul li.in-view:nth-child(even) .time {
					transform: rotate(-90deg);
					-webkit-transform:rotate(270deg);
				}
			  
			}