

.banner {
	width: 100%;
	height: 400px;
	background-size: cover;
	background-position: center;
}

.page {
	padding: 0;
	overflow: hidden;
}

.papurguesa-banner {
	background-image: url("../img/projects/papurguesa/banner.webp");
}

.content {
	padding: 20px;
	font-family: raleway;
}

.project-title {
	color: #ffd56a;
	font-size: 35px;
}

.project-description {
	color: #fff;
	font-size: 18px;
}

.bold {
	font-weight: 800;
	color: #fff;
}

.ficha {
	margin-top: 30px;
	background-color: #222222;
	padding: 20px;
	border-radius: 20px;
	color: #fff;
}

.ficha-title {
	color: #ffd56a;
	margin-bottom: 5px;
}

.ficha-text {
	font-size: 18px;
	margin: 0;
}

.ficha p {
	font-weight: 500;
	color: #ddd;
}

.captures {
	margin-top: 20px;
}

.captures-title {
	color: #ffd56a;
	margin-bottom: 16px;
}

.captures-container {
	width: 100%;
	height: fit-content;
}

.capture {
	width: 200px;
	margin-right: 16px;
	margin-bottom: 16px;
	border-radius: 2px;
}

.image-container {
	width: 100vw;
	height: 100vh;
	position: fixed;
	z-index: 99999;
	background-color: rgba(0, 0, 0, 0.7);
	left: -9999px;
	transition: left 0.1s;
}

.image {
	display: flex;
	border-radius: 10px;
	margin-top: auto;
	margin-bottom: auto;
	width: 60vw;
}

.x {
	display: flex;
	margin-left: auto;
	margin: 62px;
	width: 60px;
}

.flex-center {
	display: flex;
}

.right {
	left: 0px;
}

@media (max-width: 620px) {
	.ficha-text .bold {
		display: block;
		width: 100%;
		margin-bottom: 0;
	}
}

@media (max-width: 690px) {
	.image {
		width: 80vw;
	}

	.capture {
		display: flex;
		width: 90%;
		margin-left: auto;
		margin-right: auto;
	}
}

@media (max-width: 390px) {
	.image {
		width: 95vw;
	}
}

.download-it {
	margin-top: 40px;
	justify-content: center;
}

.avaiable-on {
	width: 100%;
	display: flex;
	justify-content: center;
} 

.avaiable-on-link {
	width: 40%;
	height: fit-content;
}

.avaiable-on-img {
	width: 100%;
}

@media (max-width: 900px) {
	.avaiable-on-link {
		width: 70%;
	}
}

@media (max-width: 500px) {
	.avaiable-on-link {
		width: 90%;
	}
}

@media (max-width: 400px) {
	.avaiable-on-link {
		width: 100%;
	}
}


.download-button {
	display: block;
	width: fit-content;
	height: fit-content;
	padding: 22px 22px;
	background-color: #ccc;
	border-radius: 12px;
	color: #212121;
	margin-top: 20px;
	transition: padding 0.2s;
	text-align: center;
}


.download-button-title {
	margin: 0;
	font-size: 22px;
}

.download-button:hover {
	padding: 22px 28px;
}

@media (max-width: 720px) {
	.download-button-title {
		font-size: 18px;
	}
}