.triplist {
	table-layout: fixed;
	width: 100%;
}

.triplist td {
	padding: 0.8em 0.2em;
	vertical-align: top;
	border: none;
	width: calc((100% - 50px - 1em) / 4);
	overflow: hidden;
	margin-bottom: -0.2rem;
}

.triplist {
	width: 100%;
	margin: 0 -0.2em 0 -0.2em;
	border: none;
	table-layout: fixed;
	word-wrap: break-word;
	margin-bottom: 2em;
}

.triplist td p, .triplist td h4 {
	padding-bottom: 0.2rem;
}
	
	
.triplist td.year, th.year {
	width: 50px !important;
}

p.date {
	text-align: right;
	font-style: italic;
}

@media only screen and (max-width : 768px) {
	
  
.triplist thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }
  
.triplist tr {
    display: block;
  }
  
.triplist td {
    display: block;
    text-align: right;
	width: 100%;
	}
	
.triplist td.year {
		text-align: left;
	}
	
.triplist td.year::before {
	padding: 0 0 0 0 !important;
	}

.triplist td::before {
    content: attr(data-label);
    float: left;
	color: #59BFFA !important;
  }
  
	
}