@import url('main.css');

#content-header {
	margin-bottom: 0px;
	height: 250px;
}

#content-header h1 {
	max-width: 410px;
}

@media (max-width: 340px) {
	#content-header h1 {
		font-size: calc(var(--size-xl) - 0.1em);
	}
}

#documentation {
	grid-column: var(--col-1-2);
}

#documentation > ul {
	display: flex;
	justify-content: space-evenly;

	list-style: none;

	border-radius: 15px;
	padding: 30px 0px;
}

#documentation li {
	width: 170px;
}

#documentation li img {
	margin-bottom: 20px;
}

@media (max-width: 940px) {
	#documentation {
		grid-column: var(--col-all);
	}
}

@media (max-width: 500px) {
	#documentation > ul {
		flex-direction: column;
		padding: 10px 20px;
		margin: 10px 20px;
	}

	#documentation li {
		flex-direction: row;
		width: auto;
		justify-content: flex-start;
		margin: 10px 0px 10px 0px;
	}

	#documentation li img {
		height: auto;
		width: 32px;
		margin: 0px 15px 0px 0px;
	}
}


/*Downloads*/
#downloads {
	grid-column: var(--col-3);
}

#downloads ul {
	list-style: none;

	padding: 0px;
	width: 100%;
}

#downloads li {
	display: inline-block;
	padding: 7px 0px 2px 0px;
}

#downloads li a {
	display: inline-flex;
	align-items: center;
}

#downloads li img {
	margin: 0px 10px;
}

#downloads li h3 {
	margin: 3px 10px 0px 0px;
	line-height: 1em;
}

#downloads li p {
	margin: 0px;

	color: var(--light-grey-content);
	font-weight: normal;
	font-size: var(--size-s);
}

@media (max-width: 940px) {
	#downloads {
		grid-column: var(--col-1);
	}
}

/* Recover Licence */
#recover-licence {
	grid-column: var(--col-all);
}

/* #recover-licence form {
	display: flex;
	justify-content: center;

	margin-top: 30px;
} */

input[name="email"] {
	width: 300px;
}

@media (max-width: 940px) {
	#recover-licence {
		grid-column: var(--col-2);
	}

	#recover-licence form {
		flex-direction: column;
	}

	input[name="email"] {
		margin-bottom: 10px;
		width: calc(100% - 20px);
	}
}

#contact {
	grid-column: var(--col-all);
}