/* ---------------------------------------- */
/* https://github.com/FaridZelli */
/* ---------------------------------------- */

/* ---------------------------------------- */
/* --- Hero Section --- */
/* ---------------------------------------- */

#hero {
padding: 3rem 0;
padding-top: 7rem;
}

.red-rectangle {
	width: auto;
	max-width: auto;
	padding: unset;
	margin: 0 4rem;
}

.red-rectangle-content {
	width: 100%;
}

/* ---------------------------------------- */
/* --- Mobile Site --- */
/* ---------------------------------------- */

@media (max-width: 768px), (max-height: 412px) {

	main section {
		padding: 3rem;
	}

	#hero {
	min-height: unset;
	padding: 7rem 0;
	padding-bottom: 3rem;
	}

	.red-rectangle {
		width: auto;
		flex-direction: column;
		align-items: center;
		padding: unset;
		margin: 0 1rem;
		gap: 0;
	}

	.red-rectangle-content {
		width: 100%;
		padding: 1.5rem;
		margin-top: unset;
	}