@charset "UTF-8";
/* CSS Document */


section {
	padding-top: 100px;
}

#dulezita-data {
	padding-bottom: 120px;
	border-bottom: 1px solid var(--cnx-greylight);
}

#dulezita-data p {
	max-width: 720px;
}

#dulezita-data h2 {
	margin-bottom: 40px;
}

.data-container {
	padding-top: 80px;
	width: 100%;
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-gap: 60px;
}

.data-container h3 {
	font-size: 1.125rem;
	padding: 20px 40px;
	position: relative;
	cursor: pointer;
	user-select: none;
	margin-bottom: 15px;
	border-bottom: 1px solid var(--cnx-greylight);
}

.colapse::after {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 21px;
	height: 100%;
	background-image: url("/imgs/svg/colapse.svg");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	transform-origin: center;
	transform: translateY(-2px);
	transition: 0.2s;
}

.colapse.active::after {
	transform: rotateX(180deg);
}

.colapse.active + .data-tabulka {
	margin-bottom: 40px;
}

.data-tabulka {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.2s;
}

table, tr {
	width: 100%;
}

th {
	padding-left: 20px;
	width: 100px;
}

.data-tabulka p {
	padding: 30px;
}

#projekty {
	padding-bottom: 120px;
	border-bottom: 1px solid var(--cnx-greylight);
}

.data-boxy {
	padding-top: 80px;
	display: grid;
	grid-template-columns: repeat(auto-fill,minmax(max-content,380px));
	grid-gap: 20px;
}

.data-boxy div {
	display: flex;
	align-items: center;
	padding: 25px;
	font-weight: var(--medium);
	border: 1px solid var(--cnx-greylight);
}

.data-boxy span {
	color: var(--cnx-greydark);
	font-weight: var(--bold);
	font-size: 1rem;
	width: 36px;
}

.data-boxy + div {
	margin-top: 40px;
}

.data-boxy + div span {
	font-weight: var(--bold);
}

.data-boxy div.old, .data-boxy div.old span {
	color: var(--cnx-greylight);
}



/* ----- Responz – Mobil ----- */



@media screen and (max-width: 599px) {
	
	.data-container {
		grid-template-columns: 100%;
		grid-gap: 0;
	}
	
	.data-tabulka th {
		padding-right: 20px;
	}
	
	.data-tabulka td {
		padding-right: 10px;
		height: 50px;
	}
	
	
}


