html,body,h1,h2,h3,h4,h5,h6 {font-family: "Roboto Condensed", sans-serif}
  a {border-bottom: 1px solid #eb4034;}

.lnk {
    target: "_blank";
    border-bottom: 0px;
    color: #ff5722;
}

.back-to-top {
    position: fixed;
    bottom: 10px;
    left: 12px;
    text-decoration: none;
    color: #000000;
    background-color: rgba(125, 60, 70, 0);
    font-size: 22px;
    //font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
    padding: 1em;
    display: none;
}

.master {
    //object-fit: contain;
    width:50%;
    height:auto;
}

.caner-card {
  background-color: #181a1b; /* dark background */
  color: #E8E6E3;           /* light text */
}

.left-card {
  background-color: #181a1b; /* dark background */
  color: #E8E6E3;           /* light text */
}

/* Reusable helper to remove link underlines/borders everywhere */
.no-underline,
.no-underline:visited,
.no-underline:hover,
.no-underline:focus,
.no-underline:active {
  text-decoration: none !important;
  border-bottom: 0 !important; /* you were using border-bottom for links elsewhere */
}

.timeline-wrap{
  --indent: 1.5rem;
  width: 50%;
  margin: 0 0 0 var(--indent);
}

.timeline{
  --gutter: 1.25rem;
  --line: #3a3a3a;
  --dot: #888;
  position: relative;
  display: grid;
  column-gap: 1rem;
  row-gap: .5rem;
  margin: .5rem 0 1.5rem;
}

.timeline::before{
  content:"";
  position:absolute;
  left: calc(var(--gutter) / 2);
  top:.25rem;
  bottom:.25rem;
  width:2px;
  background: var(--line);
}

.timeline dt,
.timeline dd{ margin:0; }

.timeline dt{
  position: relative;
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.timeline dt::before{
  content:"";
  position:absolute;
  left: calc(-1 * var(--gutter));
  top:.6em;
  width:.55rem;
  height:.55rem;
  border-radius:50%;
  background: var(--dot);
  box-shadow: 0 0 0 2px var(--line);
}

.timeline-4{
  grid-template-columns: var(--gutter) 12ch 9ch minmax(20ch, 1.3fr) minmax(22ch, 1fr);
  column-gap: 1.25rem;
}

.timeline-4 dt{ grid-column:2; }
.timeline-4 .kind{ grid-column:3; white-space:nowrap; }
.timeline-4 .main{ grid-column:4; white-space:nowrap; }
.timeline-4 .sub{ grid-column:5; white-space:nowrap; }

@media (max-width: 720px){
  .timeline-wrap{ width:100%; margin-left:1rem; }
  .timeline-4{ grid-template-columns: var(--gutter) 10ch 1fr; }
  .timeline-4 .kind{ grid-column:3; opacity:.9; }
  .timeline-4 .main,
  .timeline-4 .sub{ grid-column:3; white-space:normal; }
}