html,* { font-family: 'Inter'; box-sizing: border-box; }
body { background-color: #fafaf7; line-height:1.6;}
.lead { font-size: 1.5rem; font-weight: 300;background: linear-gradient(to right, #000000 0%, #000000 50%,#999999 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color:transparent; }
.container { margin: 20px auto; max-width: 960px; }
h1 {
  background: linear-gradient( 120deg, #bd34fe 30%, #41d1ff );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
table {
	border-collapse: collapse;
	margin: 1em 0;
}
th, td {
	padding: 5px 10px;
	border: 1px solid #bbb;
}
th {
	background-color: #eee;
	padding: 10px;
}

/* random additional styles for a more real-world situation */
td.name {
	font-weight: bold;
}
td.email {
	color: #666;
	text-decoration: underline;
}

/* form styles */
input, select {
	font: inherit;
	margin: 0;
	padding: 4px;
	border: 1px solid #bbb;
}
.input-text {
	min-width: 150px;
	background-color: #fff;
}
select {
	min-width: 150px;
}
label {
	margin-right: 4px;
}



/* Filtable styles */
tr.hidden {
	display: none;
}
tr:nth-child(odd) > td {
	background-color: #ffffff;
}
tr:nth-child(even) > td {
	background-color: #f4f4f2;
}
tr.odd > td {
	background-color: #ffffff;
}
tr.even > td {
	background-color: #f4f4f2;
}


/* Large table example */
.large-table {
	width: 100%;
}
.large-table td {
	font-size: 12px;
}
.console {
	font-family: ui-monospace, monospace;
}