:root {
	 /* --primary-color: #425b84;*/
	  --secondary-color: rgb(241, 173, 156);
	  --moon-yellow-2: rgb(241, 173, 156);
	  --grey-color22: #cccccc;
	  --max-width: 1100px;
	}
	
	body {
	  /*font: normal 1rem/1.5 'Arial', sans-serif;*/
	  /*background: var(--primary-color);*/
	  color: #3e3e3e;
	  overflow-x: hidden;
	  /*padding-bottom: 50px;*/
	}
	
	#timeline .owl-theme .owl-nav [class*="owl-"] .fa, .fas {
		font-weight: 200 !important;
		font-size: 20px !important;
		opacity: 1;
	}
		
	#timeline ul {
		/*background: #fff; */
		padding: 50px 0;
		list-style: none;
	}
	
	/*Create line*/
	#timeline ul li {
		list-style: none;
		position: relative;
		width: 6px;
		margin: 0 auto;
		padding-top: 50px;
		background: var(--secondary-color);
	}

	/*Boxes*/
	#timeline ul li div {
		position: relative;
		bottom: 0;
		width: 400px;
		/*width: 230px;*/
		padding: 1rem;
		/*background: var(--grey-color22);*/
		background: #fff;
		border: 1px solid var(--grey-color22);
		border-radius: 4px;
		-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .1);
		box-shadow: 0 0 10px rgba(0, 0, 0, .1);
		/*box-shadow: 0 0 0 1px var(--grey-color22);*/
		transition: all 0.5s ease-in-out;
		visibility: hidden;
		opacity: 0;
	}
	
	/*H3 + p + img*/
	#timeline ul li div h3{ 
		font-size: 18px;
		font-weight: 400;
		
	}
	
	#timeline ul li div p{ 
		font-size: 12px;
		vertical-align: text-top;
	}
	
	#timeline ul li div img{
		width: 200px;
		padding-right: 8px;

	}
	
	#timeline ul li div hr{ 
		margin-top: 10px;
		margin-bottom: 10px;
		
	}
	
	/*Right side*/
	#timeline ul li:nth-child(odd) div {
		left: 40px;
		transform: translate(200px, 0);
	}
	
	/*Left side*/
	#timeline ul li:nth-child(even) div {
		left: -434px;
		/*left: -264px;*/
		transform: translate(-200px, 0);
	}
	
	/* Dots */
	#timeline ul li:after {
	  content: '';
	  position: absolute;
	  left: 50%;
	  bottom: 0;
	  width: 25px;
	  height: 25px;
	  background: inherit;
	  transform: translateX(-50%);
	  border-radius: 50%;
	  transition: background 0.5s ease-in-out;
	}
	
	/* Arrows Base */
	#timeline div:before {
	  content: '';
	  position: absolute;
	  bottom: 5px;
	  width: 0;
	  height: 0;
	  border-style: solid;
	  border-width: 0px 0px 0px 0px;
	}

	/* Right Side Arrows */
	#timeline ul li:nth-child(odd) div:before {
	  left: -16px;
	  border-width: 8px 16px 8px 0;
	  border-color: transparent var(--grey-color22) transparent transparent;
	}

	/* Left Side Arrows */
	#timeline ul li:nth-child(even) div:before {
	  right: -16px;
	  border-width: 8px 0 8px 16px;
	  border-color: transparent transparent transparent var(--grey-color22);
	}
	
	/* Show Boxes */
	#timeline ul li.show div {
	  transform: none;
	  visibility: visible;
	  opacity: 1;
	}

	#timeline ul li.show:after {
	  background: var(--grey-color22);
	}
	
	@media(max-width: 900px) {
	  #timeline ul li div {
		width: 250px;
	  }

	  #timeline ul li:nth-child(even) div {
		left: -284px;
	  }
	}

	@media(max-width: 600px) {
	  #timeline ul li {
		margin-left: 20px;
	  }

	  #timeline ul li div {
		width: calc(100vw - 90px);
	  }

	  #timeline ul li:nth-child(even) div {
		left: 40px;
	  }

	  #timeline ul li:nth-child(even) div:before {
		left: -15px;
		border-width: 8px 16px 8px 0;
		border-color: transparent var(--grey-color22) transparent transparent;
	  }
}