body {
	padding: 20px;
	max-width: 1200px;
	margin: auto;
	font-family: Verdana, sans-serif;
	color: rgb(55, 55, 55);
}

a:link, a:visited, a:active, a:hover {
	text-decoration: none;
}

/* header */ 
header {
	margin-top: 20px;
	display: flex;
	align-items: center;
	align-content: center;
	justify-content: center;
	flex-wrap: wrap;
	text-align: center;
	flex-direction: column;
}
header > p {
	color: #618e39;
}

/* article */

article{
	max-width: 800px;
	margin: auto;
	margin-bottom: 30px;
}

.list-description {
	text-align: center;
	margin-top: 32px;
	margin-bottom: 32px;
	display: flex;
}

.list-description > div {
	display: flex;
	flex-direction: column;
	width: 100%;
	gap: 10px;
}

/* card */

.cards {
	display: flex;
	align-content: center;
	justify-content: center;
	flex-wrap: wrap;
	flex-direction: column;
}

.card {
	box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
	
	display: flex;
	align-items: center;
	background-color: #e4ffcc;
	color: #618e39;
	padding: 20px;
	border-radius: 20px;
	gap: 20px;
}

.card a {
	text-align: center;
	color: rgb(138, 136, 11);
}

.card-link {
	display: block;
	width: 100%;
	background-color: #d4dfac;
	border-radius: 50px;
	padding: 8px 0px;
	margin: 8px 0 8px 0;
}


/* table */

.table-container {
	width: 100%;
	overflow-x: scroll;
}

table {
	width: max-content;
	max-width: 100%;
  	overflow: auto;
	border-collapse: collapse;
}

td {
	padding: 8px 14px 8px 14px;
}

th {
	padding: 14px;
}

tr:nth-child(odd) > td {
	background-color: rgb(240, 240, 240);
}

/* table header */

tr:nth-child(1) > th {
	background-color: rgb(55, 55, 55);
	color: white;
	font-weight: bold;
}

tr:nth-child(1) > th:nth-child(1) {
	border-radius: 15px 0 0 0;
}

tr:nth-child(1) > th:last-child {
	border-radius: 0 15px 0 0;
}

/* last row */

tr:last-child > td:nth-child(1) {
	border-radius: 0 0 0 15px;
}

tr:last-child > td:last-child {
	border-radius: 0 0 15px 0;
}

/* account column */

td:nth-child(3) > ul {
	list-style-type: none;
}

.account {
	border: 2px solid rgb(200, 200, 200);
	border-radius: 50px;
	margin: 8px 0 8px 0;
}

.account > a {
	color: rgb(100, 100, 100);
}

.account > a > img {
	width: 20px;
	margin-left: 10px;
}

.account > a {
	display: flex;
	align-items: center;
}

.account > a > p {
	margin: 6px;
}

/* source column */

td:nth-child(5) > ul {
	list-style-image: url("images/check-badge.svg");
}

td:nth-child(5) > ul > li > a {
	display: flex;
	align-items: center;
}

/* footer */

.references-explaination * {
	color: gray;
}

@media (width <= 700px) {
	.card {
		flex-direction: column;
	}
}

@media (width <= 1100px) {
	td{
		text-wrap: wrap;
		padding: 4px 6px 4px 6px;
	}
	td:nth-child(2){
		min-width: 120px;
		max-width: 120px;
		word-break: break-word;
	}
	td:nth-child(4), td:nth-child(5){
		min-width: 200px;
		max-width: 200px;
		word-break: break-word;
	}
	.account {
		min-width: 200px;
		word-break: break-word;
	}
}