/*
Theme Name:		Esporte Jundiaí 3.0
Theme URI:		https://esporte.jundiai.sp.gov.br/
Author:			CIJUN
Author URI:		https://cijun.sp.gov.br/
Description:	Site da Unidade de Gestão de Esportes e Lazer da Prefeitura de Jundiaí.
Template:		jundiai-tema-base
Version:		3.0
*/

/* ----- CABEÇALHO ------------------------------------------------------------------- */

#barra-plataforma {
	background: var(--ciano);
}

@media only screen and (min-width: 1024px) {

	#header .container {
		gap: 30px;
	}

	#site-titulo {
		background-image: url(images/time-jundiai.png);
		background-size: auto 100%;
		background-repeat: no-repeat;
		background-position: left center;
		padding: 10px 0 10px 100px;
	}

	#site-titulo .titulo {
		margin-top: 0;
	}

	#site-titulo .subtitulo {
		margin-top: 0.3em;
	}

	.brasao {
		color: transparent !important;
	}

	/*
	.brasao:before {
		content: " ";
		background: url(images/cidade-das-criancas.png) no-repeat center center/100% 100%;
		aspect-ratio: 33/35;
		width: auto;
		height: 110px;
		margin-left: -120px;
		margin-top: -15px;
		display: block;
	}
	*/

}


/* ----- PÁGINA INICIAL -------------------------------------------------------------- */

#modalidades-home {
	padding-top: 6em;
	padding-bottom: 6em;
}

#noticias-portal {
	padding-top: 10em;
}

#noticias-home .noticias-lista .noticia-item:nth-child(2) .noticia-resumo,
#noticias-home .noticias-lista .noticia-item:nth-child(3) .noticia-resumo,
#noticias-home .noticias-lista .noticia-item:nth-child(4) .noticia-resumo {
	display: none;
}

@media only screen and (min-width: 1024px) {

	#noticias-home .noticias-lista {
		grid-template-columns: 1fr 1fr 1fr;
		gap: 40px;
		grid-template-areas:
			"a a a"
			"b c d";
	}

	#noticias-home .noticias-lista .noticia-item:nth-child(1) {
		min-height: 420px;
		position: relative;
		grid-area: a;
	}

	#noticias-home .noticias-lista .noticia-item:nth-child(1) .noticia-data {
		position: absolute;
		top: 0;
		left: 0;
	}

	#noticias-home .noticias-lista .noticia-item:nth-child(1) .noticia-titulo {
		background: var(--ciano);
		color: #fff;
		padding: 10px 15px;
		position: absolute;
		left: 550px;
		top: 80px;
		font-size: 180%;
		text-decoration: none;
	}

	#noticias-home .noticias-lista .noticia-item .noticia-foto {
		aspect-ratio: 3 / 2;
		height: auto;
	}

	#noticias-home .noticias-lista .noticia-item:nth-child(1) .noticia-foto {
		width: 600px;
		position: absolute;
		top: 20px;
		left: 0;
	}

	#noticias-home .noticias-lista .noticia-item:nth-child(1) .noticia-resumo {
		position: absolute;
		left: 640px;
		top: 230px;
	}

	#noticias-home .noticias-lista .noticia-item:nth-child(2) {
		grid-area: b;
	}

	#noticias-home .noticias-lista .noticia-item:nth-child(3) {
		grid-area: c;
	}

	#noticias-home .noticias-lista .noticia-item:nth-child(4) {
		grid-area: d;
	}

	#noticias-home .noticias-lista .noticia-item:nth-child(2) .noticia-resumo,
	#noticias-home .noticias-lista .noticia-item:nth-child(3) .noticia-resumo,
	#noticias-home .noticias-lista .noticia-item:nth-child(4) .noticia-resumo {
		display: none;
	}

	#noticias-home .noticias-lista p {
		margin-bottom: 1em;
	}

}


/* ----- LISTA DE MODALIDADES -------------------------------------------------------- */

#modalidades-lista {
	margin: 60px 0;
	display: grid;
	gap: 20px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.home #modalidades-lista {
	margin-bottom: 20px;
}

#modalidades-lista .modalidade {
	width: 100%;
	text-align: center;
}

#modalidades-lista .modalidade a {
	text-decoration: none;
}

#modalidades-lista .modalidade-titulo {
	font-size: 16px;
	text-align: center;
}

#modalidades-lista .modalidade-imagem {
	width: 100%;
	height: auto;
	margin: 0 auto 20px;
}

@media only screen and (min-width: 480px) {

	#modalidades-lista {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

}

@media only screen and (min-width: 600px) {

	#modalidades-lista {
		grid-template-columns: repeat(5, minmax(0, 1fr));
	}

}

@media only screen and (min-width: 800px) {

	#modalidades-lista {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}

}

@media only screen and (min-width: 1024px) {

	#modalidades-lista {
		gap: 40px;
		grid-template-columns: repeat(7, minmax(0, 1fr));
	}

}

@media only screen and (min-width: 1220px) {

	#modalidades-lista {
		display: flex;
		gap: 20px;
		flex-flow: row nowrap;
		justify-content: space-between;
		align-items: center;
	}

}


/* ----- TEMPLATE PAGE MODALIDADES --------------------------------------------------- */

.page-modalidades .lista-colunas {
	column-count: 2;
	column-gap: 30px;
}

@media only screen and (min-width: 600px) {

	.page-modalidades .lista-colunas {
		column-count: 3;
		column-gap: 40px;
	}

}

@media only screen and (min-width: 1024px) {

	.page-modalidades .lista-colunas {
		column-count: 4;
		column-gap: 60px;
	}

}


/* ----- LOGOTIPOS ------------------------------------------------------------------- */

#logotipos {
	max-width: 300px;
	margin: 60px auto 0;
	padding: 0 20px;
	display: flex;
	gap: 20px;
	align-items: center;
	justify-content: space-around;
}

#logotipos .widget {
	margin-bottom: 0;
	flex-grow: 1;
	flex-shrink: 1;
	flex-basis: 0;
	text-align: center;
}

#logotipos .widget-titulo {
	display: none;
}

#logotipos img {
	width: 100%;
	max-width: 200px;
	height: auto;
	margin: auto;
}

@media only screen and (min-width: 600px) {

	#logotipos {
		gap: 40px;
	}

}