/* CSS Document 
   Designed at publiSITIO
*/

/* Generic Styling, for Desktops/Laptops */
table { 
	width:100%; 
	/*margin-bottom:50px;
	padding: 0 10px;*/
	border-collapse: collapse;
	
	box-sizing: border-box;
	line-height: 1;
}
caption{
	padding: 15px 0
}
thead tr{
	color:black;
	font-size:18px;
}
thead th{
	padding: 10px 0px; 
	border-top: 1px solid #000;
	vertical-align:top;
	text-align: left;
	white-space:pre-line;
}
	thead th:nth-child(2){
		padding-left: 10px;
	}
td{ 
	padding: 15px 0px; 
	border-top: 1px solid #999;
	vertical-align:top;
	text-align: left;
	/*white-space:pre-line;*/
}
	td:first-child{
		width: 70px;
		color: var(--main-color);
		font-weight: 700;
		border-top: 4px solid var(--main-color);
	}
	td:nth-child(2){
		padding: 15px 10px;
	}
	td:last-child{
		width: 12%;
		text-align: left;
		font-size: 16px;
	}
td hr{
	border-bottom: 5px solid #000;
	margin: 10px 0;
	width: 5%;
}
	@media screen and (max-width: 800px) {
		caption {
  			white-space: normal;
  			width: 80%;
		}
		/* Zebra striping */
		/*tr{
			background:#;
			border-bottom: 1px solid #000;
		}*/
		th { 
			color:red; 
			font-weight:300; 
		}
	 
		/* Force table to not be like tables anymore */
		table, thead, tbody, th, td, tr { 
			display: block; 
		}
		
		/* Hide table headers (but not display: none;, for accessibility) */
		thead tr { 
			position: absolute;
			top: -9999px;
			left: -9999px;
		}
		td:first-child{
			width:100%;
			/*font-size: 1.5em;
			padding-left: 15px;*/
		}
		td:first-child:after{
			content: '';
			position: absolute;
			bottom: 0;
			left: 0;
			width:25%;
			border-bottom: 5px solid #ccc;
		}
		td:last-child{
			width: 100%;
			text-align:right;
			color:grey;
		}
		td { 
			/* Behave  like a "row" */
			border: none;
			position: relative;
		}
	}

@media (prefers-color-scheme: dark) {
	td hr{
	border-bottom: 5px solid var(--dkm-main-color);
	}
	thead tr {
	  color: var(--dkm-main-color);
	}
	thead th {
	  border-top: 1px solid var(--dkm-main-color);
	}
	td{ 
		border-top: 1px solid var(--dkm-main-color);
	}
}