.timelineHolder
 {
     width: 98%;
 }
 
 .topicTimeline
 {
     position: relative; /*height:400px;*/
     width: 100%;
     border: 0px solid black;
     list-style:none inside;
     padding-bottom: 100px;
 }
 
 li::marker
 {
    font-size: 0px;
	line-height: 0px;
 }
 
 .topicTimeline::before
 {
     content: '';
     position: absolute;
     width: 4px;
     background-color: #0e6d73;
     top: 12px;
     bottom: 100px;
     left: 15px; 
 }
 
 
 .absolutepositionSR
 {
     position: absolute;
     top: 6px;
     right: 25px; 
 }
 
 
 .testItem
 {
     position: relative;
     border: 0px solid red;
     width: 2px;
     height: 200px;
     text-align: center;
     padding-top: 6px;
    /* background-color: white !important; */
 }
 .testItem::before
 {
     content: " ";
     position: absolute;
     top: 75px;
     right: -10px;
     background-color: #0e6d73;
     z-index: 1;
     height: 4px;
     width: 42px;
 }
 
 
 
 .testItem::after
 {
     content: '';
     position: absolute;
     width: 15px;
     height: 15px;
     right: 18px;
     background-color: #0e6d73;
     border: 0px solid #FF9F55;
     top: 70px;
     border-radius: 50%;
     z-index: 1;
 }
 
 .testItem1
 {
     position: relative;
     border: 0px solid red;
     width: 2px;
     height: 200px;
     text-align: center;
     padding-top: 6px;
     margin-top: 14px;
    /* background-color: white !important; */
 }
 .testItem1::before
 {
     content: " ";
     position: absolute;
     top: 25px;
     right: -10px;
     background-color: #0e6d73;
     z-index: 1;
     height: 4px;
     width: 42px;
 }
 
 
 
 .testItem1::after
 {
     content: '';
     position: absolute;
     width: 15px;
     height: 15px;
     right: 18px;
     background-color: #0e6d73;
     border: 0px solid #FF9F55;
     top: 20px;
     border-radius: 50%;
     z-index: 1;
 }
 
  .testItem2
 {
     position: relative;
     border: 0px solid red;
     width: 2px;
     height: 200px;
     text-align: center;
     padding-top: 6px;
     margin-top: 10px;
    /* background-color: white !important; */
 }
 .testItem2::before
 {
     content: " ";
     position: absolute;
     top: 25px;
     right: -10px;
     background-color: #0e6d73;
     z-index: 1;
     height: 4px;
     width: 42px;
 }
 
 
 
 .testItem2::after
 {
     content: '';
     position: absolute;
     width: 15px;
     height: 15px;
     right: 18px;
     background-color: #0e6d73;
     border: 0px solid #FF9F55;
     top: 20px;
     border-radius: 50%;
     z-index: 1;
 }
 
 .testItem1 > .itemContent
 {
 	 vertical-align:top;
 	 text-align: left;
     padding: 7px 10px;
     border: 0px solid red;
     background-color: white;
     position: absolute;
     top: 10px;
     left: 15px;
     width: 1000px;
     border: 1px solid #C6C6C6;
     border-radius: 5px;
 } 
 
 .testItem2 > .itemContent
 {
     vertical-align:top;
 	 text-align: left;
     padding: 7px 10px;
     border: 0px solid red;
     background-color: white;
     position: absolute;
     top: 10px;
     left: 15px;
     width: 1000px;
     border: 1px solid #C6C6C6;
     border-radius: 5px;
 } 
 
 .testItem > .itemContent
 {
 	 vertical-align:top;
 	 text-align: left;
     padding: 7px 10px;
     border: 0px solid red;
     background-color: white;
     position: absolute;
     top: 60px;
     left: 15px;
     width: 1000px;
     border: 1px solid #C6C6C6;
     border-radius: 5px;
 }
 
 .timelineHeader
 {
     color: #128289;
     font-size: 18px;
     padding: 10px 20px;
 }
 .timelineYear
 {
     color: #128289;
     font-size: 30px;
     font-weight: 700;
     position: absolute;
	 top: -5px;
	 left: 20px;
     padding: 1px 5px;
     font-family: 'Aleo Bold', 'Aleo Regular', 'Aleo', sans-serif;
 }
 
 .timelineHead
 {
     font-size: 16px;
 }
 
 .timelineYearNav
 {
     position: fixed;
     top: 170px;
     height: inherit; 
     overflow-x: hidden; 
     overflow-y: auto; 
 }
 
 .timelineNav
 {
     color: #128289;
     font-size: 15px;
     font-weight: 700;
	 left: 10px;
     padding: 3px 18px;
 }
 
 .timelineNavAnchor
 {
     padding: 1px 15px;
     color: #0e6d73;
 }
 .timelineNoDataNavAnchor:hover{
 	text-decoration: none; 	
 }
 .timelineNoDataNavAnchor
 {
     padding: 1px 15px;
     color: #0e6d73;
     pointer-events: none;
 }
 
 .timelineNavAnchor.active
 {
     background: #118289;
     color: white;
     border-radius: 3px;
 }
 
 .keyDoc{
    font-family: 'Roboto Medium', 'Roboto Regular', 'Roboto', sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 16px;
 }
 
 .timelineTopic{
 	display:inline-block;
 	padding-right:10px;
 	vertical-align:top;
 }
 .timelineEvent{
 	display:inline-block;
 	vertical-align:top;
 	width:calc(100% - 180px);
 }
 .timelineImg{
 	height:96x;
 }
 .timelineOther{
 	font-size: 14px;
 	padding-top: 4px;
 }
 
 .timelineOther1{
 	font-size: 14px;
 	padding-top: 10px;
 	font-style: italic;
 }
 .timelineOther2{
 	font-size: 12px;
 	padding-top: 10px;
 	margin-left: 90px;
 }
 .timelinerelatedlink{
 	font-size: 13px;
 	padding: 3px 6px;
 	background-color: #E5F5F6;
 	color: #044246;
 	border-radius: 3px;
 }
 
@media screen and (max-width: 1020px) {
  #imgTimeline {
    width: 95%;
  }
  .absolutepositionSR {
  	position: relative;
	left: -5px;
	margin-bottom: 8px;
  }
}
@media screen and (min-width: 820px) {
  #imgTimeline {
    width: 98%;
  }
}