body {
  width: 70%;
  margin: 0 auto;
  font-family: Tahoma, Verdana, Arial, sans-serif;
}

h2 {
  text-align: center;
  color: #0d6efd;
}

h3 {
  text-align: center;
}

body { font-family: Helvetica; }

.history div {
  width: 90%;
  margin: auto;
}

.history p {
  border-top: 2px dashed;
  border-color: #0d6efd !important;
  margin: 0px; padding: 30px;
  counter-increment: section;
  position: relative;
}

.history p:nth-child(even):before {
  content: counter(section);
  right: 100%; 
  margin-right: -20px;
  position: absolute;
  border-radius: 50%;
  padding: 15px;
  height: -10px;
  width: -15px;
  background-color: #0d6efd;
  text-align:center;
  color: white;
  font-size: 110%;
}

.history p:nth-child(odd):before {
  content: counter(section);
  left: 100%; 
  margin-left: -20px;
  position: absolute;
  border-radius: 50%;
  padding: 15px;
  height: -10px;
  width: -15px;
  background-color: #0d6efd;
  text-align:center;
  color: white;
  font-size: 110%;
}

.history p:nth-child(even) {
  border-left: 2px dashed;
  border-top-left-radius: 30px;
  border-bottom-left-radius: 30px;
  margin-right: 30px; 
  padding-right: 0;
}

.history p:nth-child(odd) {
  border-right: 2px dashed;
  border-top-right-radius: 30px;
  border-bottom-right-radius: 30px;
  margin-left: 30px; 
  padding-left: 0;
}

.history p:first-child {
  border-top: 0;
  border-top-right-radius:0;
  border-top-left-radius:0;
}

.history p:last-child {
  display: none;

  border-bottom-right-radius:0;
  border-bottom-left-radius:0;
}

/* Style the buttons that are used to open and close the accordion panel */
.accordion {
  background-color: #eee;
  color: #0d6efd;
  font-size: 24px;
  cursor: pointer;
  padding: 14px;
  margin: 2px;
  width: 100%;
  text-align: left;
  border: none;
  outline: none;
  transition: 0.4s;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active, .accordion:hover {
  background-color: #ccc;
}

/* Style the accordion panel. Note: hidden by default */
.panel {
  padding: 18px;
  background-color: white;
  display: none;
  overflow: hidden;
}

table {
  width:100%;
}
table, th, td {
  border: 1px solid black;
  border-collapse: collapse;
}
th {
  padding: 15px;
  text-align: center;
}
td {
  padding: 15px;
  text-align: left;
} 
table#t01 tr:nth-child(even) {
  background-color: #eee;
}
table#t01 tr:nth-child(odd) {
 background-color: #fff;
}
table#t01 th {
  background-color: rgb(77, 77, 77);
  color: white;
}

img {
  border: 1px solid #ddd;
  border-radius: 4px;
  padding: 5px;
  width: 150px;
}

img:hover {
  box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
}

@media (max-width: 600px) {
  body {
      width: 98%;
  }
}
