/* padding del main */
@media screen and (min-width: 1023px) {
	.section {
		--bulma-section-padding-desktop: 1rem 1rem;
	}
}

html,
body {
	height: 100%;
}

body {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

header {
	width: 80%;
	max-width: 1400px;
	margin: 0 auto;
}

main .container {
	width: 80%;
	max-width: 1400px;
	margin: 0 auto;
}

/* Fila donde salen los iconos de redes, los idiomas y el buscador */
div.filaSuperior {
	width: 100%;
	border-bottom: 1px solid #d63b17;
	display: flex;
	align-items: center;
	position: relative;
}

div.contenedorLogos {
	margin-top: 0.25rem;
}

div.contenedorIdiomas {
	position: absolute;
	right: 0;
	font-size: 0.8rem;
	display: flex;
	align-items: flex-end;
}

div.contenedorIdiomas span.eus {
	color: #d63b17;
}

div.contenedorIdiomas .icon .fa-globe {
	color: #d63b17;
	margin-right: 0;
}

img.iconoLupa {
	margin-left: 0.5rem;
}

/* Nabvar */
.navbar {
	width: 100%;
	min-height: 7rem;
	font-size: 0.9rem;
}

.navbar-brand .navbar-item,
.navbar-brand .navbar-item:hover {
	background-color: transparent !important;
	padding-left: 0;
}

.navbar-brand .navbar-item img {
	max-height: none;
	height: auto;
	width: 15rem;
}

.navbar-menu {
	flex-grow: 1;
}

.navbar-start {
	justify-content: flex-end;
	width: 100%;
	margin-right: 0;
}

.navbar-start a {
	font-weight: 500;
}

.navbar-item {
	color: black;
	display: flex;
	align-items: flex-end;
}

.navbar-item:hover {
	background-color: transparent !important;
	color: inherit !important;
}

.navbar-item.active {
	color: #d63b17 !important;
	background-color: transparent !important;
}

.navbar-burger span {
	background-color: #d63b17;
}

/* Mostrar las tres lineas del menu si se vuelve movil */
@media screen and (max-width: 1023px) {
	.navbar-brand .navbar-item img {
		width: 10rem;
		margin-left: 1rem;
	}

	.navbar-menu {
		box-shadow: none;
		padding: 1rem 0;
	}

	.navbar-start {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
	}

	.navbar-start .navbar-item {
		width: 95%;
		padding-left: 1.5rem;
		border-bottom: 1px solid red;
		margin-left: 1rem;
		align-items: center;
	}
}

/* Footer */
footer.footer {
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	background-color: #f6f6f6;
	padding-top: 1rem;
	padding-bottom: 1rem;
}

div.txtFooter {
	display: flex;
	justify-content: space-evenly;
}

div.columna {
	width: 22%;
}

h4.title {
	border-bottom: 1px solid #888888;
	margin-bottom: 1rem !important;
}

div.column p {
	font-size: 0.9rem;
	font-weight: 400;
}

div.column li {
	font-size: 0.8rem;
}

div.column img {
	height: auto;
	max-width: 75%;
}

div.info span {
	color: #d63b17;
}

.footer-mobile {
	display: none;
}

a {
	text-decoration: none;
	color: black;
}

/* Carousel */
.carousel {
	height: 22rem;
	position: relative;
}

figure.carousel-image {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

figure.carousel-image img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	transition: opacity 0.4s ease;
}

figure.carousel-image img.is-active {
	opacity: 1;
}

.carousel-btn.prev {
	position: absolute;
	left: 10px;
	top: 10rem;
	color: white;
	font-size: 2rem;
}

.carousel-btn.next {
	position: absolute;
	right: 10px;
	top: 10rem;
	color: white;
	font-size: 2rem;
}

/* Tarjetas del index */
.contenedorTarjetas {
	display: flex;
	justify-content: space-between;
	margin-top: 3rem;
}

.card {
	width: 22%;
	height: 20rem;
	background-color: #d63b17;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.card img.iconoCard {
	margin-top: 2rem;
	margin-bottom: 1rem;
}

.card p,
.card span,
.card a {
  height: 3rem;
  color: white;
  font-size: 1.5rem;
  text-align: center;
}

.card .icon {
	bottom: 1rem;
	position: absolute;
	cursor: pointer;
}

/* Diseño para movil del footer y de las cartas del index */
@media screen and (max-width: 1023px) {
	footer.footer {
		background-color: white;
		padding: 2rem 1rem 1rem;
	}

	footer.footer .footer-desktop {
		display: none;
	}

	footer.footer .footer-mobile {
		display: block;
	}

	.footer-mobile-section {
		margin-bottom: 0.35rem;
	}

	.footer-mobile-section summary {
		min-height: 3rem;
		background-color: #eeeeee;
		color: #2d2d2d;
		cursor: pointer;
		display: flex;
		align-items: center;
		justify-content: center;
		list-style: none;
		font-size: 1.2rem;
		font-weight: 700;
		position: relative;
	}

	.footer-mobile-section summary::-webkit-details-marker {
		display: none;
	}

	.footer-mobile-section summary::after {
		content: "\f078";
		color: #7a7a7a;
		font-family: "Font Awesome 6 Free";
		font-size: 1.8rem;
		font-weight: 900;
		position: absolute;
		right: 1rem;
	}

	.footer-mobile-section[open] summary::after {
		content: "\f077";
		color: #cfcfcf;
	}

	.footer-mobile-content {
		padding: 1rem 1.4rem 1.3rem;
	}

	.footer-mobile-content p {
		font-size: 1rem;
		font-weight: 700;
		margin-bottom: 0.25rem;
	}

	.footer-mobile-content li {
		color: #555555;
		font-size: 1rem;
		line-height: 1.45;
	}

	.footer-mobile-content img {
		display: block;
		height: auto;
		max-width: 100%;
	}

	.iconoFooter {
		width: 2rem;
	}

	.footer-mobile-social {
		display: flex;
		justify-content: center;
		gap: 0.7rem;
		margin: 1rem 0;
	}

	.footer-mobile-social a {
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}

	.footer-mobile-license {
		padding: 0 1.4rem;
	}

	.footer-mobile-license img {
		display: block;
		margin-bottom: 0.75rem;
	}

	.footer-mobile-license .info {
		color: #555555;
		font-size: 1rem;
		line-height: 1.35;
	}

	/* Contenedor tarjetas de pantalla index */
	.contenedorTarjetas {
		flex-direction: column;
		align-items: center;
		gap: 1rem;
	}

	.card {
		width: 100%;
		height: 6rem;
		display: flex;
		flex-direction: row;
	}

	.card img.iconoCard {
		width: 5rem;
		margin-top: 0;
		margin-bottom: 0;
		position: relative;
		left: 1rem;
	}

	.card p {
		width: 22rem;
		height: auto;
		--bulma-block-spacing: 0;
		margin-left: 1rem;
	}

	.card span {
		right: 1rem;
		top: 1.5rem;
	}
}

/* Pantalla donde se muestra el mapa */
#content {
	--bulma-column-gap: 0;
}

#content div.section {
	padding-left: 0;
	padding-right: 0;
}

#contenedorTitulo {
	width: 100%;
	padding: 0.5rem;
	position: relative;
	background-color: #d73a17;
	color: white;
	text-align: center;
	font-size: 1.25rem;
	font-weight: bold;
}

#map {
	width: 100% !important;
	aspect-ratio: 4/3;
}

.custom-cluster div {
	background: #c8102e;
	color: white;
	border-radius: 50%;
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	font-weight: bold;
}

/* Pantalla del buscador */
#page-title {
	width: 100%;
	padding: 0.5rem;
	text-align: center;
	background-color: #d63b17;
	color: white;
	font-size: 1.25rem;
	font-weight: bold;
	margin-bottom: 1rem;
}

div.view-header p.intro-text {
	font-size: 1rem;
	color: black;
	margin-bottom: 1rem;
}

div.views-exposed-widgets {
	padding: 1rem;
	width: 100%;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	background-color: #f6f6f6;
}

input#edit-title,
div#edit-field-herria2-tid,
div#edit-field-tipologia-tid {
	height: 1.5rem;
	border: 1px solid #b1b1b1;
	border-radius: 0.2rem;
}

div.form-item-field-herria2-tid,
div.form-item-field-tipologia-tid {
	width: 16rem;
}

div.ts-control {
	padding: 2px 8px;
	height: 1.5rem;
}

div.contenedorBotonesForm {
	display: flex;
	gap: 1rem;
	margin-top: 1.3rem;
}

input.form-submit {
	width: 7rem;
	padding: 0.25rem;
	font-size: 1rem;
	border-radius: 0.5rem;
	background-color: #d73a17;
	color: white;
	border: none;
	cursor: pointer;
}

h2.element-invisible {
	color: #d73a17;
	text-align: center;
}

div.contenedorDanzas {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1rem;
}

div.contenedorDanzas div.card {
	width: 100%;
	height: 90%;
	background-color: #f6f6f6;
	border-radius: 6px;
	padding: 1rem;
}

div.contenedorDanzas div.card-image {
	height: 140px;
	display: flex;
	justify-content: center;
}

div.contenedorDanzas .card-image,
div.contenedorDanzas .card-image .image {
	width: 100%;
	height: 220px;
	margin: 0;
}

div.contenedorDanzas div.card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

div.contenedorDanzas div.card-content {
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
	--bulma-card-content-padding: 0;
}

div.contenedorDanzas div.tituloCard {
	color: black;
}

div.contenedorDanzas div.descripcion {
	font-size: 0.9rem;
	color: #585858;
	margin-top: 0.5rem;
}

div.contenedorDanzas div.txtMas {
	color: #d63b17;
	margin-top: 0.5rem;
	cursor: pointer;
}

@media screen and (max-width: 1023px) {
	div.views-exposed-widgets {
		flex-direction: column;
		align-items: stretch;
		gap: 1rem;
	}

	input#edit-title,
	select#edit-field-herria2-tid,
	select#edit-field-tipologia-tid {
		width: 100%;
	}

	.views-exposed-widget {
		width: 100%;
	}

	input.form-submit {
		margin-left: 42%;
	}

	div.contenedorDanzas {
		grid-template-columns: repeat(2, 1fr);
	}

	div.contenedorDanzas div.card {
		height: 19rem;
		display: flex;
		flex-direction: column;
	}
}

/* Pantalla de la ficha tecnica */
div.ficha-danza {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 2rem;
}

div.bloque-ficha {
	margin-top: 1rem;
	background: #f5f5f5;
	padding: 1rem;
}

div.bloque-ficha h3 {
	color: #c84a2f;
	font-weight: bold;
	font-size: 1.1rem;
	margin-bottom: 1rem;
	padding-bottom: 0.5rem;
	border-bottom: 1px solid #ddd;
}

div.campo-ficha {
	margin-bottom: 1rem;
	display: flex;
}

div.campo-ficha strong {
	display: block;
	margin-bottom: 0.25rem;
	color: #c84a2f;
}

div.campo-ficha.descripcion {
  display: flex;
  flex-direction: column;
}

ul.lista-danzas {
	list-style: none;
	padding: 0;
	margin: 0.5rem 0 0;
}

ul.lista-danzas li {
	background: #666;
	color: white;
	padding: 0.4rem 0.6rem;
	margin-bottom: 0.25rem;
}

div.tags-danzas {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-top: 0.5rem;
}

div.tags-danzas span {
	background: #666;
	color: white;
	padding: 0.3rem 0.6rem;
	font-size: 0.9rem;
}

div.contenedorImgFicha img {
	width: 100%;
	height: auto;
	display: block;
	border-top-left-radius: 1rem;
	border-top-right-radius: 1rem;
}

@media (max-width: 768px) {
	.ficha-danza {
		grid-template-columns: 1fr;
	}
}

/* Pantalla de quien somos */
div.contenedorImg {
  text-align: center;
}

div.contenedorImg img {
  border-radius: 15rem;
  height: 19rem;
  width: 19rem;
  box-shadow: 8px 8px 5px 0px #d63b17;
}

div.content p {
  color: black;
}

div.content span,
div.content a,
div.content strong {
  color: #d63b17;
}

div.contenedorOpciones {
  padding: 1rem;
  background-color: #f6f6f6;
  border-left: 1px solid #d63b17;
  margin-bottom: 1rem;
}

div.contenedorOpciones p.title {
  color: #d63b17;
  --bulma-content-block-margin-bottom: 0;
}