@import url('https://fonts.googleapis.com/css2?family=Gabarito:wght@400..900&family=Libre+Franklin:ital,wght@0,100..900;1,100..900&display=swap');

* {
	margin: 0;
	padding: 0;
}

body {
	display: flex;
	flex-direction: column;
	align-items: center;
	background-color: rgb(235, 247, 221);
}

#table-container {
	position: relative;
	overflow: hidden;
}

#time-line {
	position: absolute;
	width: 100%;
	height: 1px;
	background-color: red;
	opacity: 0.4;
	border: none;
	z-index: 10;
}

table {
	border-collapse: collapse;
	border-spacing: 15px;
	font-family: "Libre Franklin", sans-serif;
	letter-spacing: 1px;
	z-index: 0;
}

table th {
	background-color: rgb(243, 181, 160);
	color:brown;
}

th:first-child {
	background-color: cornsilk;
	font-weight: normal;
}

table th, table td {
	padding: 14px 20px;
	border: 3px solid rgb(255, 255, 255);
	text-decoration-skip-ink: auto;
}

td:first-child {
	background-color: rgb(194, 235, 154);
	font-size: 0.8em;
	width: 100px;
}

.lekcja:hover {
	/* background-color:khaki; */
	filter: brightness(120%);
}

#switcher {
	display: flex;
	width: 100%;
	justify-content: space-between;
	visibility: hidden;
}

.arrow {
	margin: 1rem;
	padding: 1rem;
}

td {
	border-radius: 10px;
}

.ppa5bt-gr1 {
	background-color: rgb(250, 129, 129);
}

.ppa5bt-gr2 {
	background-color: rgb(255, 174, 108);
}

.ppa5dt {
	background-color: rgb(254, 117, 209);
}

.ppa4ct-gr1 {
	background-color: rgb(154, 194, 240);
}

.ppa4ct-gr2 {
	background-color: rgb(136, 220, 241);
}

.ppa4bt-gr1 {
	background-color: rgb(166, 154, 240);
}

.ppa4bt-gr2 {
	background-color: rgb(196, 172, 244);
}

.ppai {
	background-color: rgb(189, 249, 129);
}

.pr_str_app {
	background-color:lightgreen;
}

.ind {
	background-color:rgb(101, 52, 150);
	color: white;
}

.highlight {
	color: red;
	font-weight: bold;
	border: 2px solid red;
}

.dyzur-alt {
	border-bottom: 5px dashed rgb(246, 240, 53) !important;
}

@media (max-width: 800px) {

	#switcher {
		visibility: visible;
		background-color:azure;
	}

	td:nth-child(n+3), th:nth-child(n+3) {
		display: none;
	}

	table {
		table-layout: fixed;
	}

	td:nth-child(1), th:nth-child(1) {
		width: 100px;
	}

	tr {
		height: 50px;
	}

	.arrow {
		background-color: brown;
		color: white;
		border-radius: 50%;
		width: 30px; height: 30px;
		text-align: center;
		font-weight: 1000;
		font-size: 1.5em;
		padding: 15px;
	}

}