:root {
	--corBlue: #0a67b7;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

button[type=submit].pesquisa {
    font-size: clamp(0.5em,0.5em + 0.4vw,1em);
	cursor: pointer;
	border-radius: 0px 10px 10px 0px;
}

button[type=submit].imagem {
 	cursor: pointer;
	border-radius: 10px;
}

button[type=submit] {
    font-size: clamp(0.5em,0.5em + 0.4vw,1em);
	cursor: pointer;
	border-radius: 10px;
}

input[type="submit"], input[type="file"]{ 
    font-size: clamp(0.5em,0.5em + 0.4vw,1em);
	cursor: pointer;
	border-radius: 10px;
}

input[type="text"], input[type="date"], input[type="month"], input[type="number"], input[type="password"]{
	border-radius: 10px;
	padding: 4px;
}

input[type="text"]:hover, input[type="date"]:hover, input[type="month"]:hover, input[type="number"]:hover, input[type="password"]:hover{
	border:1px solid #000000;
}

select.form-select{
	border-radius: 10px;
	padding: 4px;
}

select.form-select:hover {
	border:1px solid #000000;
}

textarea.form-control{
	border-radius: 10px;
	padding: 4px;
}

textarea.form-control:hover {
	border:1px solid #000000;
}

input[type="checkbox"] {
	-webkit-appearance: none;
	background-color: white;
	border: 2px solid #888;
	border-radius: 5px;
	padding: 4px;
	width: clamp(8px,8px + 0.4vw,16px);
	height: clamp(8px,8px + 0.4vw,16px);
}

input[type="radio"] {
	-webkit-appearance: none;
	border: 2px solid #888;
	border-radius: 5px;
	background-color: white;
	padding: 4px;
	width: clamp(8px,8px + 0.4vw,16px);
	height: clamp(8px,8px + 0.4vw,16px);
}

input[type="checkbox"]:checked, input[type="radio"]:checked {
	border: 2px solid #000;
	border-radius: 5px;
	background-color:#000;
	}

input[type="checkbox"]:hover, input[type="radio"]:hover {
	border: 2px solid #000;
	border-radius: 5px;
	}

label.form-control-label {
	color:black;
	font-weight: Bold;
	font-size: clamp(0.5em,0.5em + 0.4vw,1em);
	text-decoration: none;
	border: none;
	text-align: left;
	padding-left: 10px;
	margin-top: 4px;
}

label.periodo {
	color:blue;
	font-weight: Bold;
	font-size: clamp(0.5em,0.5em + 0.4vw,1em);
	text-decoration: none;
	border: none;
	text-align: right;
	padding-right: 5px;
	margin-top: 4px;
}

input[type="checkbox"].periodo {
	-webkit-appearance: none;
	background-color: white;
	border: 2px solid #00f;
	border-radius: 5px;
	padding: 4px;
	width: clamp(8px,8px + 0.4vw,16px);
	height: clamp(8px,8px + 0.4vw,16px);
}

input[type="checkbox"].periodo:checked {
	border: 2px solid #000;
	border-radius: 5px;
	background-color:#00f;
	}

input[type="checkbox"].periodo:hover {
	border: 2px solid #00f;
	border-radius: 5px;
	}

select option.italico {
      font-style: italic;
    }

.letra_sistema{
	color: var(--corBlue);
	letter-spacing: 5px;
	font-size: clamp(2em,2em + 0.5vw,2.7em);
}

.letra_titulo{
	color: var(--corBlue);
	font-size: clamp(2em,2em + 0.5vw,2.7em);
	line-height: clamp(2.1em,2.1em + 0.5vw,2.8em);
}
.letra_saudacao{
	color: var(--corBlue);
	font-size: clamp(1.5em,1.5em + 0.5vw,1.5em);
}

.letra_cor{
	color: var(--corBlue);
	font-size: clamp(0.7em,0.7em + 0.3vw,1em);
	line-height: clamp(0.8em,0.8em + 0.3vw,1.1em);
}

.letra{
	color:#000;
	font-size: clamp(0.7em,0.7em + 0.3vw,1em);
	line-height: clamp(0.8em,0.8em + 0.3vw,1.1em);
}
.letra_deleta{
	color:#f00;
	font-size: clamp(0.7em,0.7em + 0.3vw,1em);
	line-height: clamp(0.8em,0.8em + 0.3vw,1.1em);
}

.direitos {
	color: #000;
	text-align: center;
}
			
.cor{
	color: var(--corBlue);
}

.breadcrumb {
	padding: 10px;
	background: #eeeeee;
}
.breadcrumb-item {
	color: #000;
}

.breadcrumb-item.active {
	color: var(--corBlue);
}

.breadcrumb-item a {
	color: #000;
	text-decoration: none;
}

.breadcrumb-item a:hover {
	color: var(--corBlue);
	text-decoration: none;
	cursor: pointer;
}

.inicial {
	background: #f8f8f8;
	padding: 5px;
	color: #000;
}

.btn-outline-dark {
	border-radius: 10px;
}


/* ==========================================================
   CORPO DE TEXTO DAS PAGINAS
   Fonte, cor e tamanho vem da classe .letra (acima) aplicada em .conteudo
   ========================================================== */
.conteudo {
	text-align: left;
	overflow-wrap: break-word;
}

.conteudo p {
	margin: 0 0 0.8em;
}

.conteudo h1,
.conteudo h2,
.conteudo h3,
.conteudo h4 {
	font-weight: bold;
	margin: 0.6em 0 0.5em;
}

.conteudo img {
	max-width: 100%;
	height: auto;
}

.conteudo table {
	max-width: 100%;
}

.texto-justificado {
	text-align: justify;
}

.text-center {
	text-align: center;
}


/* ==========================================================
   CELULAR - conteudo das paginas (tabelas, imagens, rolagem)
   O menu e o layout em coluna ja ficam no menu.js
   ========================================================== */
html {
	-webkit-text-size-adjust: 100%;
}

iframe, video {
	max-width: 100%;
}

.conteudo {
	overflow-x: auto;
}

@media (max-width: 800px) {
	.conteudo table,
	.conteudo table[align] {
		width: 100% !important;
		float: none !important;
		margin: 0 0 12px;
	}

	.conteudo td,
	.conteudo th {
		width: auto !important;
		height: auto !important;
		padding: 6px 8px;
		vertical-align: top;
	}

	.conteudo img[style*="float"] {
		float: none !important;
		display: block;
		margin: 0 auto 12px;
	}
}


/* ==========================================================
   PAGINA INICIAL (index.html): eventos e logos
   ========================================================== */
.evento {
	margin: 0 0 20px;
}

.links-title {
	margin: 28px 0 16px;
}

.logos {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
	justify-items: center;
	align-items: center;
}

.logos a {
	display: block;
}

.logos img {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: 220px;
	border: 0;
}

@media (max-width: 340px) {
	.logos {
		gap: 14px;
	}
}

/* Layout da página: menu lateral (menu.js) + conteúdo */
.ib-pagina {
	display: flex;
	align-items: flex-start;
	gap: 28px;
	max-width: 1200px;
	margin: 20px auto;
	padding: 0 16px;
	box-sizing: border-box;
}

.ib-content {
	flex: 1 1 auto;
	min-width: 0;
}

@media (max-width: 800px) {
	.ib-pagina {
		flex-direction: column;
		gap: 16px;
		margin: 12px auto;
		padding: 0 12px;
	}

	.ib-content {
		width: 100%;
	}
}