html,
body {
	height: 100%;
	font-family: "Open Sans", sans-serif;
	color: #363636;
}

* {
	padding: 0;
	margin: 0;
	border: 0;
	box-sizing: border-box;
}

body {
	display: flex;
	flex-direction: column;
}

main {
	flex: 1;
}

a {
	text-decoration: none;
}

hr.gradiente {
	border: 0;
	height: 1px;
	background-image: linear-gradient(
		to right,
		rgba(0, 0, 0, 0),
		rgba(0, 0, 0, 0.3),
		rgba(0, 0, 0, 0)
	);
}

/***********************************************************/
/***** estilos gerais **************************************/

div#conteudo {
	/* padding-top: 30px; */
}

.conteudo {
	position: relative;
}

.tituloPagina {
	margin: 27px 0;
	font-family: oswald;
	color: #294d8c;
	font-size: 0.9rem;
	font-weight: 600;
	text-transform: uppercase;
}
.titulo-slide {
	padding: 0 30px;
}
.titulo-slide h5 {
	font-size: 2em;
	font-weight: 700;
	color: #294d8c;
	padding-bottom: 5px;
}
.titulo-slide p {
	color: #294d8c;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-moz-box-orient: vertical;
	-ms-box-orient: vertical;
	box-orient: vertical;
	-webkit-line-clamp: 5;
	-moz-line-clamp: 5;
	-ms-line-clamp: 5;
	line-clamp: 5;
	overflow: hidden;
}

.conteudoContainer {
	width: 70%;
	margin: 0 auto;
	padding: 0 2rem;
}

.home-container {
	width: 85%;
}

.secao {
	/* padding: 25px 0;
	margin-top: 100px; */
}

.container-interno-secao {
	width: 80%;
	margin: 0 auto;
}

.subTituloSecao {
	margin: 10px 0 27px 0;
	font-family: oswald;
	color: #ff6d23;
	font-size: 1.5em;
	font-weight: 600;
}

.tituloSecao {
	margin: 27px auto;
	font-family: oswald;
	color: #00508a;
	font-size: 1.7em;
	font-weight: 600;
	text-transform: uppercase;
}

.bg-azul {
	background-color: #d4dee4;
}

#hero span {
	position: absolute;
	font-size: 4em;
	font-weight: 700;
	color: #00508a;
	text-shadow: 2px 2px 7px #000;
	margin: 2em 2em;
}

.hero-interno {
	height: 200px;
}

.hero-interno span {
	font-family: oswald;
	font-size: 3em;
	font-weight: 600;
	text-transform: uppercase;
	position: absolute;
	color: #00508a;
	text-shadow: 2px 2px 7px #000;
	margin: 0.5em 2em;
	/* width: min-content; */
	z-index: 2;
}

.btn-principal {
	display: flex;
	justify-content: center;
	width: 80%;
	margin: 0 auto;
}

.btn-principal ul {
	display: flex;
	width: 100%;
	gap: 15px;
	margin: 25px 0;
}

.btn-principal ul li {
	display: flex;
	justify-content: space-around;
	width: 100%;
	background: #00508a;
	color: #fff;
	border-radius: 8px;
	padding: 10px;
}

.btn-principal a:hover {
	color: #68b2c9;
	cursor: pointer;
}

.btn-principal ul li:hover {
	color: #68b2c9;
	cursor: pointer;
}

/***** Translate bar ********************************/
.translate-div {
	display: flex;
	justify-content: flex-end;
	font-family: oswald;
	color: #294d8c;
	font-size: 1rem;
}

.translate-to-english {
	display: flex;
	align-items: center;
}

.flag-language {
	width: 2rem;
	height: 2rem;
	margin-right: 0.2rem;
	border-radius: 100%;
}

/***********************************************************/
/***** Página Infra ****************************************/

.hero-infra {
	background: url(/assets/img/rodovia.jpg) no-repeat center center;
	background-size: cover;
}

.hero-infra::after,
.hero-interno::after {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.2);
}

.item-container {
	padding: 2rem;
}

.rodovias {
	margin-top: 20px;
}

.rodovias-img,
.eixo-img,
.rj-img {
	display: flex;
	justify-content: center;
	margin: 0 auto;
	max-width: 500px;
}

.rodovias-img img,
.eixo-img img,
.rj-img img {
	display: block;
	width: 100%;
}

.secao-2 .sub-titulo {
	margin-top: 40px;
}

.secao-2 .paragrafo-p {
	margin: 1.5rem 0;
	text-align: left;
}

.rodovias .paragrafo-p {
	text-align: left;
	margin: 1.5rem 0;
}

.rodovias .paragrafo-p span {
	display: block;
}

.secao-2 {
	padding: 1rem 0;
}

.secao-3 {
	padding: 1rem;
	padding-left: 0 !important;
}

.sub-titulo-2 {
	font-family: oswald;
	color: #00508a;
	font-weight: 600;
	margin-bottom: 15px;
}

.bondes-container-img {
	width: 100%;
	height: auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.img-infra {
	width: 45%;
}

.lote-grupo {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.lote-grupo-2 {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.img-infra-lote {
	width: 80%;
}

.tabela-lote {
	width: 135%;
}

.documento-lote {
	width: 50%;
	margin-top: 2rem;
	padding: 0.5rem;
	color: #ffffff;
	background-color: #00508a;
	font-size: 13pt;
	font-family: sans-serif;
	text-decoration: none;
	text-align: center;
	border-radius: 25px;
	overflow: hidden;
}

ul.tabela-legenda {
	display: flex;
}

.legenda {
	font-size: 0.85em;
	font-family: sans-serif;
	line-height: 1.5;
	text-align: justify;
	padding: 3px 0;
	width: 100%;
	display: flex;
	justify-content: space-between;
}

ul.tabela-legenda li {
	margin-left: 15px;
}

.rodovias-container-img {
	height: auto;
	display: flex;
	align-items: center;
	flex-direction: column;
}

.terminais-rodoviarios-container-img {
	width: 100%;
	height: auto;
	display: flex;
	flex-direction: column-reverse;
	align-items: center;
}

img.img17 {
	width: 100%;
}

.rj-img,
.eixo-img {
	display: flex;
	justify-content: center;
}

.eixos .paragrafo-p,
.RJ .paragrafo-p {
	margin: 1.5rem 0;
	text-align: left;
}

.RJ {
	margin-top: 40px;
}

/* .RJ .paragrafo-p:last-child, .RJ .paragrafo-p:nth-of-type(2) {
    text-align: center;

} */

.rodovias-container {
	display: flex;
	flex-direction: column-reverse;
	justify-content: center;
	align-items: center;
}

.tabela-legenda {
	list-style: none;
}

.lotes-container-img {
	width: 85%;
	height: auto;
	display: flex;
	justify-content: center;
	align-items: baseline;
	padding-bottom: 2rem;
}

.sub-titulo {
	font-family: oswald;
	color: #00508a;
	font-size: 1.3em;
	font-weight: 600;
	margin-bottom: 15px;
}

.alinha-centro {
	text-align: center;
	margin: 30px 0 15px;
}

.text-rod-container {
	width: 100%;
}

.text-rod-container .paragrafo-p {
	text-align: left;
	margin: 1.5rem 0;
}

.paragrafo-p {
	font-size: 12pt;
	line-height: 1.5;
	text-align: justify !important;
	margin: 1.5rem;
}

.paragrafo-term-p {
	font-size: 12pt;
	line-height: 1.5;
	text-align: justify;
	margin-bottom: 1.5rem;
}

/* margem a direita */
.m-r {
	margin-right: 1rem;
}

section#terminais-rodoviarios {
	padding-bottom: 100px;
}

/* MENU SUPERIOR ********************************************/

.menu-superior {
	background: #363636;
	/* padding-bottom: 3px; */
	height: 45px;
	font-family: "Open Sans", sans-serif;
	display: flex;
}

.menusupi {
	width: 80%;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	padding-bottom: 3px;
	position: relative;
	z-index: 1;
	align-items: center;
}

.esquerda-menu-superior {
	display: flex;
	/* width: 14.08em; */
	width: 11.08em;
}

.menu-superior li {
	list-style: none;
}

.menu-superior a {
	text-decoration: none;
	color: #fff;
	/* margin-left: 30px; */
	font-size: 0.8em;
}

.social-midia-sup {
	padding-left: 20px;
}

.social-midia-sup li {
	list-style: none;
	display: inline-block;
	width: 25px;
}

.icons {
	width: 17px;
	height: 17px;
	text-indent: -9999px;
	display: block;
}

.instagram-sup {
	background: url(/assets/img/sm_instagram-ft.svg) no-repeat center center;
	background-size: cover;
}

.facebook-sup {
	background: url(/assets/img/sm_facebook-ft.svg) no-repeat center center;
	background-size: cover;
}

.twitter-sup {
	background: url(/assets/img/sm_twitter-ft.svg) no-repeat center center;
	background-size: cover;
}

.youtube-sup {
	background: url(/assets/img/sm_youtube-ft.svg) no-repeat center center;
	background-size: cover;
}

.infosup {
	letter-spacing: 0.01em;
}

.infosup li {
	display: inline-block;
	vertical-align: middle;
	margin-left: 1.1em;
}

/* ACESSIBILIDADE DROPDOWN **************************************/

.acessibilidade-dropbtn {
	/*padding: 16px;
    background-color: #363636; */
	color: #ffffff;
	border: none;
	cursor: pointer;
	font-size: 0.8em;
}

button.acessibilidade-dropbtn {
	background-color: transparent;
}

div#acessibilidade-myDropdown a {
	color: #363636;
}

/* .acessibilidade-dropbtn:hover, .acessibilidade-dropbtn:focus {
    background-color: #2980B9;
  } */

button:active.acessibilidade-dropbtn {
	outline: none;
	border: none;
}

button:focus.acessibilidade-dropbtn {
	outline: 0;
}

.acessibilidade-dropdown {
	position: relative;
	display: inline-block;
}

.acessibilidade-dropdown-content {
	display: none;
	position: absolute;
	background-color: #f1f1f1;
	min-width: 160px;
	overflow: auto;
	box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
	z-index: 1;
	text-align: left;
	border-radius: 2px 2px 5px 5px;
}

.acessibilidade-dropdown-content a {
	color: black;
	padding: 12px 8px;
	text-decoration: none;
	display: block;
}

.acessibilidade-dropdown a {
	color: #363636 !important;
}

.acessibilidade-dropdown a:hover {
	background-color: #ddd;
}

.acessibilidade-show {
	display: block;
}

/* CONTRASTE *****************************************************/

.contrast::before {
	content: "";
	width: 15px;
	height: 15px;
	background: url(/assets/img/contrast-black.svg) no-repeat center center;
	background-size: cover;
	vertical-align: middle;
	display: inline-block;
	margin-right: 5px;
}

/* Mudança de background e cor de texto ao clicar em Contrast na parte de acessibilidade */

#conteudo.bgContrast,
#cabecalho.bgContrast {
	background-color: #363636;
	transition: all 0.3s ease-in-out;
}

#conteudo.bgContrast *:not(.assinaturasRodape):not(img):not(#back2Top) {
	color: #ebc41a;
	transition: all 0.3s ease-in-out;
}

#conteudo.bgContrast #mapsvg {
	background-color: #363636;
}

#conteudo.bgContrast .w3-button > button {
	background-color: #363636;
}

#conteudo.bgContrast .w3-modal-content,
#conteudo.bgContrast .w3-modal-content button {
	background-color: #363636;
}

#cabecalho.bgContrast .containerCabecalho * {
	color: #ebc41a;
}

#cabecalho.bgContrast .subMenuContent {
	background-color: #363636;
}

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

#cabecalho {
	box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2), 0 4px 20px 0 rgba(0, 0, 0, 0.19);
}

.containerCabecalho {
	width: 100%;
	display: flex;
	justify-content: space-around;
	margin: 0 auto;
	align-items: center;
	padding: 20px 0;
	background-color: #00508a;
}

div#navDesk {
	font-size: 1.2em;
	font-weight: 600;
	margin-top: 27px;
	display: inline-block;
}

#navDesk ul {
	list-style-type: none;
	display: flex;
	padding: unset;
}

#navDesk ul a {
	text-decoration: none;
	color: #00508a;
	font-family: "oswald";
	line-height: 1.1;
}

/* #navDesk ul li {
	margin-right: 20px;
} */

#navDesk ul li a:hover {
	color: #68b2c9;
	cursor: pointer;
}

.subMenuContent li:hover {
	background-color: rgb(223, 223, 223);
}

li.itemMenu {
	height: 40px;
}

.subMenuContent {
	display: none !important;
	position: absolute;
	background-color: #ffffff;
	min-width: 160px;
	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.4);
	z-index: 1;
	top: 130px;
	max-width: 230px;
	font-weight: 500;
}

.subMenuContent li {
	padding: 10px;
	height: auto !important;
	margin-right: 0 !important;
}

/* .subMenuContent li:hover {
    background-color: #ddd;
} */

.subMenuContent a,
.subMenuContent__navMob a {
	text-decoration: none;
}

.itemMenu:hover .subMenuContent {
	display: block !important;
}

.logos-container {
	display: flex;
}

#logoGovEstadoRJ img {
	width: 235px;
}

#logoFacilita img {
	width: 200px;
}

ul#menu {
	background-color: #fff;
	box-shadow: 0 4px 10px 0 rgb(0 0 0 / 20%), 0 4px 20px 0 rgb(0 0 0 / 19%);
}

/***** PÁGINA NOTICIAS - FACILITARJ *******/

.noticias {
	flex-direction: column;
	margin-top: 0;
}

.noticias .card-noticias {
	box-shadow: none;
	flex-direction: row;
	width: 100%;
}

.noticias .card-noticias:hover {
	box-shadow: none;
}

.noticias .card-noticiasTexto {
	padding: 0 15px;
}

.noticias .card-noticiasTexto h4 {
	margin-top: 0;
}

.noticias .card-noticias-img {
	width: 350px;
	height: 175px;
}

.noticias .card-noticias-img img {
	width: 100%;
	height: 200px;
}

.noticias .card-noticiasTexto {
	flex: 1;
}

.noticias .card-noticias {
	margin-bottom: 40px;
}

.noticias .card-noticias:nth-of-type(odd) .card-noticias-img {
	order: 2;
}

.noticias .card-noticias:nth-of-type(2n) .card-noticiasTexto {
	padding-left: 30px;
}

.lista-noticias-line {
	padding-bottom: 20px;
}

.lista-noticias {
	padding: 0.5em 2em;
	border: 0;
	border-radius: 25px;
	font-weight: bold;
	text-transform: uppercase;
	font-size: 0.7em;
	letter-spacing: 0.5;
	margin: 0 auto;
	display: block;
	background-color: #00508a;
}

.lista-noticias a {
	color: #ffffff;
	text-decoration: none;
}

@media only screen and (max-width: 767px) {
	.noticias .card-noticias {
		flex-direction: column;
	}

	.noticias .card-noticiasTexto h4 {
		margin-top: 35px;
	}

	.noticias .card-noticiasTexto {
		padding: 0;
	}

	.noticias .card-noticias:nth-of-type(2n) .card-noticias-img {
		order: 0;
	}

	.noticias .card-noticias:nth-of-type(2n) .card-noticiasTexto {
		padding-left: 0;
	}

	.noticias .card-noticias:nth-of-type(odd) .card-noticiasTexto {
		padding-bottom: 10px;
	}
}

/* MENU CONTEXTO **************************/

#menu-contexto {
	box-shadow: 0 1px 10px 0 rgb(0 0 0 / 20%), 0 1px 80px 0 rgb(0 0 0 / 19%);
}

.menu-contexto-container {
	width: 80%;
	display: flex;
	justify-content: space-between;
	margin: 0 auto;
	align-items: center;
	padding: 20px 0;
}

div#menu-contexto-navDesk {
	font-size: 1em;
}

#menu-contexto-navDesk ul {
	list-style-type: none;
	display: flex;
	padding: unset;
}

#menu-contexto-navDesk ul li {
	margin-right: 20px;
}

#menu-contexto-navDesk ul a {
	text-decoration: none;
	color: #00508a;
	font-family: "oswald";
	line-height: 1.1;
}

#menu-contexto-navDesk ul li a:hover {
	color: #68b2c9;
	cursor: pointer;
}

/* SETA VOLTA AO TOPO **************************/

#back2Top:hover {
	background-color: #ddf;
	color: #000;
}
#back2Top {
	width: 40px;
	line-height: 40px;
	overflow: hidden;
	z-index: 999;
	display: none;
	cursor: pointer;
	position: fixed;
	bottom: 50px;
	right: 0;
	background-color: #ccc;
	color: #555;
	text-align: center;
	font-size: 30px;
	text-decoration: none;
	border-radius: 15px 15px 0 0;
	-moz-transform: rotate(270deg);
	-webkit-transform: rotate(270deg);
	-o-transform: rotate(270deg);
	-ms-transform: rotate(270deg);
	transform: rotate(270deg);
}

/***** HERO IMAGE ********************************/

div#hero {
	background-color: #00508a;
	display: flex;
}

div#hero img {
	width: 38%;
	height: auto;
	justify-content: center;
}

/***** SOBRE O PROGRAMA ********************************/

section#sobre {
	padding: 50px 0 100px;
}

h2.tituloSecao {
	text-align: center;
	/* margin-top: 100px; */
	padding-top: 30px;
}

.sobre-p-container {
	width: 100%;
	margin: 0 auto;
	text-align: justify;
}

.sobre-p-container p {
	font-size: 13pt;
	font-family: sans-serif;
	line-height: 1.5;
}

/***** EIXOS ESTRATÉGICOS ********************************/

.eixos-estrategicos-container {
	display: flex;
	justify-content: space-between;
	width: 80%;
	margin: 0 auto;
}

.eixos-container-interno {
	width: 33%;
	text-align: left;
}

.eixos-container-interno:nth-of-type(2) {
	flex: 1;
	width: 100%;
}

.eixos-container-interno h3 {
	color: #00508a;
	margin-bottom: 8px;
	padding-left: 10px;
}

.a-eixos {
	border-radius: 25px;
	background-color: #00508a;
	color: #ffffff;
	/* font-weight: bold; */
	box-shadow: 1px 2px 4px 0 rgb(0 0 0 / 8%);
	padding: 10px 22px;
	border: 0;
	margin: 35px auto;
	width: fit-content;
	font-size: 0.8em;
	overflow: hidden;
}

.quebra-cabeca {
	background: url(/assets/img/quebra-cabeca-5.webp);
	background-repeat: no-repeat;
	background-size: contain;
	background-position-y: center;
}

.eixos-item {
	margin: 20px 0 40px;
	display: flex;
	flex-direction: column;
}

.eixos-item ul {
	list-style-type: none;
}

.eixos-item p {
	line-height: 1.5;
	font-size: 0.9em;
	font-weight: 600;
	padding: 6px 10px;
}

.eixos-item ul li {
	margin-bottom: 10px;
	font-size: 0.9em;
	font-weight: 600;
	padding: 6px 10px;
}

/* Bounce To Top */
.hvr-bounce-to-top {
	display: inline-block;
	vertical-align: middle;
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
	box-shadow: 0 0 1px rgba(0, 0, 0, 0);
	position: relative;
	-webkit-transition-property: color;
	transition-property: color;
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s;
}
.hvr-bounce-to-top:before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #8f9da7; /* #2098D1; */
	-webkit-transform: scaleY(0);
	transform: scaleY(0);
	-webkit-transform-origin: 50% 100%;
	transform-origin: 50% 100%;
	-webkit-transition-property: transform;
	transition-property: transform;
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s;
	-webkit-transition-timing-function: ease-out;
	transition-timing-function: ease-out;
}
.hvr-bounce-to-top:hover,
.hvr-bounce-to-top:focus,
.hvr-bounce-to-top:active {
	color: white;
}
.hvr-bounce-to-top:hover:before,
.hvr-bounce-to-top:focus:before,
.hvr-bounce-to-top:active:before {
	-webkit-transform: scaleY(1);
	transform: scaleY(1);
	-webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
	transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
}

/* Grow */
.hvr-grow {
	/* display: inline-block; */
	vertical-align: middle;
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
	box-shadow: 0 0 1px rgba(0, 0, 0, 0);
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-property: transform;
	transition-property: transform;
	padding: 6px 10px;
	border-radius: 6px;
}
.hvr-grow:hover,
.hvr-grow:focus,
.hvr-grow:active {
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
	background-color: #8f9da7;
}

/****** Cronograma de projetos - Home ******/

#cronograma-projetos {
	margin: 80px 0;
}

#cronograma-projetos .tituloSecao {
	text-align: center;
}

.projetos {
	display: flex;
	justify-content: space-around;
	margin-top: 60px;
}

.projetos h1 {
	font-size: 1.2em;
	text-align: center;
	justify-content: center;
	flex: 2;
	display: flex;
	align-items: flex-end;
}

.projetos h1:first-child {
	min-width: 20%;
}

.status-interno {
	width: 52%;
	height: 7px;
	background: rgba(0, 31, 95, 1);
	border-radius: 6px;
}

.projeto-status:nth-of-type(3) .status-interno {
	width: 27%;
	height: 7px;
	background: rgba(0, 31, 95, 1);
	border-radius: 6px;
}

.projeto-status:nth-of-type(4) .status-interno {
	width: 15%;
	height: 7px;
	background: rgba(0, 31, 95, 1);
	border-radius: 6px;
}
.projeto-status:nth-of-type(5) .status-interno {
	width: 13%;
	height: 7px;
	background: #7f7f7f;
	border-radius: 6px;
}
.projeto-status:nth-of-type(6) .status-interno {
	width: 8%;
	height: 7px;
	background: rgba(0, 31, 95, 1);
	border-radius: 6px;
}
.projeto-status:nth-of-type(7) .status-interno {
	width: 13%;
	height: 7px;
	background: #7f7f7f;
	border-radius: 6px;
}

.projeto-legenda .status .status-interno {
	width: 3%;
	display: flex;
}

.projeto-legenda .status-interno {
	margin-right: 10px;
}

.projeto-legenda .status span {
	margin-right: 20px;
}

.projeto-legenda .status-interno:nth-of-type(2) {
	background: #7f7f7f;
}

.projeto-legenda .status {
	display: flex;
	align-items: center;
	margin-top: 10px;
	background-color: #fff;
}

.projeto-title {
	width: 20%;
}

.projeto-title span {
	width: 100%;
	display: block;
	font-weight: bold;
	text-align: end;
	padding-right: 20px;
}

.projeto-status-container {
	display: flex;
	height: 65px;
	align-items: center;
	justify-content: space-around;
}

.status-container {
	flex: 1;
}

.status-span {
	display: flex;
	max-width: 100%;
}

.status-span-container {
	width: 100%;
	display: flex;
	justify-content: space-around;
}

.status-span-container > div {
	flex: 1;
	display: flex;
	justify-content: space-around;
	border-right: 2px solid #ddd;
}

.status-span-container .marked {
	font-weight: bold;
}

.status-span-container > span {
	border-right: 2px solid #ddd;
	flex: 1;
	text-align: center;
}

.projetos h1:nth-of-type(4) {
	flex: 2;
}

@media only screen and (max-width: 767px) {
	.status-span {
		width: 100%;
	}

	.status-span-container > span {
		padding: 0;
		font-size: 0.5em;
	}

	.projeto-title span {
		font-size: 0.5em;
	}

	.status-span-container > div {
		font-size: 0.5em;
		padding: 0;
	}

	.projeto-status-container {
		display: flex;
		height: 50px;
		align-items: center;
		justify-content: space-around;
	}

	.projetos h1 {
		flex: 1;
		justify-content: center;
		font-size: 0.5em;
	}

	.status-span-container > span:nth-of-type(2) {
		margin-left: 0px;
	}
}

/***** SERVIÇOS / NOTÍCIAS ********************************/

.cardsContainer {
	display: flex;
	margin: 10px;
	justify-content: space-around;
	flex-wrap: wrap;
}

.card-noticias {
	box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2), 0 4px 20px 0 rgba(0, 0, 0, 0.19);
	display: flex;
	flex-direction: column;
	width: 40%;
	/* border-top: solid #00508a 3px; */
	overflow: hidden;
}

.card-noticias a {
	text-decoration: none;
}

.card-noticias:hover {
	box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.3), 0 4px 20px 0 rgba(0, 0, 0, 0.5);
}

.card-noticias img {
	/* width: 100%;
    height: auto; */
	width: 100%;
	height: 175px;
	object-fit: cover;
	object-position: 50% 50%;
}

.card-noticiasTexto {
	padding: 15px;
	height: -webkit-fill-available;
}

.card-noticiasTexto h4 {
	font-family: "Open Sans", sans-serif;
	font-size: 1.25em;
	color: #294d8c;
	font-size: 1.1em;
	font-weight: 700;
	/* text-transform: uppercase; */
	margin-top: 15px;
}

.card-noticiasTexto p {
	font-size: 0.9em;
	margin-top: 15px;
	line-height: 1.3;
}

.a-botao {
	border-radius: 2px;
	background-color: #00508a;
	color: #ffffff;
	/* font-weight: bold; */
	box-shadow: 1px 2px 4px 0 rgb(0 0 0 / 8%);
	padding: 14px 22px;
	border: 0;
	margin: 15px;
	width: fit-content;
	font-size: 0.8em;
}

.projeto-nucleo{
	padding-bottom: 0!important;
}

/***** FALE CONOSCO ********************************/

section#fale-conosco {
	/* background: #d4dee4; */
	padding: 50px 0;
}

.fale-conosco-container {
	display: flex;
	flex-direction: row;
}

.map-end-container {
	display: flex;
	align-items: center;
	width: 100%;
}

.endereco {
	width: 55%;
	padding-left: 65px;
	line-height: 1.7em;
}

form.form-labels-on-top {
	width: 55%;
}

.fale-conosco-container {
	display: flex;
	flex-direction: row;
	width: 76%;
	margin: 0 auto;
	justify-content: space-between;
}

.lista-documentos ul {
	list-style: none;
	margin-left: 3rem;
	line-height: 2rem;
}

.texto {
	margin-left: 3rem;
	text-align: justify;
	line-height: 1.7rem;
}

/***** FALE CONOSCO FORM  */

.form-labels-on-top {
	box-sizing: border-box;
	min-width: 375px;
	/* margin: 50px auto; */
	padding: 35px 25px;
	background-color: #ffffff;
	box-shadow: 0 1px 3px 0 rgb(0 0 0 / 10%);
	font: bold 14px sans-serif;
	text-align: center;
}

.form-labels-on-top .form-row {
	margin-top: 25px;
}

.form-labels-on-top .form-row {
	text-align: left;
	max-width: 315px;
	margin: 0 auto;
}

.form-labels-on-top .form-row > label span {
	display: block;
	box-sizing: border-box;
	color: #5f5f5f;
	width: 200px;
	padding: 12px 0 6px;
	width: auto;
}

.form-labels-on-top .form-row > label.obrigatorio span::after {
	content: "*";
	color: red;
	font-size: 1.2em;
}

.form-labels-on-top input {
	color: #5f5f5f;
	box-sizing: border-box;
	width: 300px;
	box-shadow: 1px 2px 4px 0 rgb(0 0 0 / 8%);
	padding: 12px 18px;
	border: 1px solid #dbdbdb !important;
}

.form-labels-on-top button {
	border-radius: 2px;
	background-color: #00508a;
	color: #ffffff;
	font-weight: bold;
	box-shadow: 1px 2px 4px 0 rgb(0 0 0 / 8%);
	padding: 14px 22px;
	border: 0;
	margin-top: 15px;
}

textarea#textarea_comp-kmkx9tv3 {
	color: #5f5f5f;
	box-sizing: border-box;
	width: 300px;
	box-shadow: 1px 2px 4px 0 rgb(0 0 0 / 8%);
	padding: 12px 18px;
	border: 1px solid #dbdbdb !important;
}

textarea#textarea_comp-kmkx9tv3::placeholder {
	color: #ccc;
	font-family: times;
}

.form-row.submit {
	display: flex;
	justify-items: center;
}

/***** PÁGINA PMI SANTA TERESA ********************************/

.hero-pmisantateresa {
	background: url(/assets/img/15.png) no-repeat center center;
	background-size: cover;
}

/***** PÁGINA CONCESSÃO 1 ********************************/

/* .lista-docs ul {
    list-style-image: url(../img/icon-filetypes-pdf.svg);
    margin-left: 3rem;
    line-height: 3rem;
}  */

.container-legislacao {
	margin-top: 100px;
}
.container-legislacao h3 {
	margin: 30px;
	text-align: center;
}

.container-legislacao ol {
	margin-left: 30px;
}
.hero-concessao {
	background: url(/assets/img/Rodovia.jpg) no-repeat center center;
	background-size: cover;
}

ul.link {
	list-style-image: url(/assets/img/icon-filetypes-pdf.svg);
	margin-left: 3rem;
	line-height: 2rem;
}

.requerimentos ul.link a {
	line-height: 1.5rem;
}

ul.link li{
	margin-bottom: 10px;
}

.lista-docs ul li {
	width: fit-content;
}

.link li {
	padding-left: 10px;
	padding-right: 10px;
	border-radius: 3px;
}

/* .link li:hover {
    background-color: #d4dee4;
} */

.list-docs.pub ul {
	list-style-type: none;
}

.produtos-link {
	margin-bottom: 40px;
}

/************* PÁGINA CONCESSÂO2/LOTE2***************/

.produtos {
	margin-top: 40px;
}

#rodovias-lote2 .container-interno-secao {
	width: 100%;
}

.lote-2_ul {
	list-style: none;
}

.lote-2_ul li > strong {
	margin-right: 10px;
}

.lote-2_ul li {
	padding-left: 20px;
}

/************ PÁGINA ATIVOS AMBIENTAIS ****************/

.crono {
	width: 100%;
	/* background-color: #DDD; */
	border-radius: 5px;
	margin: 60px 0;
}

#bondes-santa-teresa .crono {
	width: 100%;
	border-radius: 5px;
	margin: 10px 0;
}

.crono-title {
	display: flex;
	justify-content: space-around;
	text-align: center;
}

.crono-title span {
	width: 125px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.hero-ativos {
	background: url(/assets/img/ativos-ambientais.jpg) no-repeat center center;
	background-size: cover;
}

.hero-ativos::after,
.hero-interno::after {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.2);
}

.crono-ball {
	width: 70px;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 70px;
	background: #ddd;
	border-radius: 50%;
	z-index: 1;
}

#bondes-santa-teresa .crono-ball {
	width: 70px;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 70px;
	background: #fff;
	border-radius: 50%;
	z-index: 1;
}

.crono-ball span {
	font-size: 3em;
	color: #ddd;
}

.crono-style {
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
}

.container-ball {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	flex: 1;
}

.new-crono .container-ball > div:first-child {
	display: flex;
	height: 70px;
	align-items: center;
}

.container-ball > div {
	display: flex;
}

.new-crono2 .container-ball > div:first-child {
	display: flex;
	height: 70px;
	align-items: center;
}

.container-ball > div > span {
	text-align: center;
	font-weight: bold;
	margin-bottom: 5px;
}

.container-ball::before {
	content: "";
	display: flex;
	width: 100%;
	height: 5px;
	background: #ddd;
	position: relative;
	top: 85px;
	left: 50%;
}

#bondes-santa-teresa .container-ball::before {
	content: "";
	/*display: flex;*/
	width: 100%;
	height: 5px;
	background: #fff;
	position: relative;
	/* top: 85px; */
	left: 50%;
}

.new-crono .container-ball::before {
	content: "";
	display: flex;
	width: 100%;
	height: 5px;
	background-color: #ddd;
	top: 65%;
	left: 50%;
}

.new-crono .container-ball:nth-of-type(1)::before {
	content: "";
	display: flex;
	width: 100%;
	height: 5px;
	background-color: #a9d18e;
	top: 65%;
	left: 50%;
}
.new-crono .container-ball:nth-of-type(2)::before {
	content: "";
	display: flex;
	width: 100%;
	height: 5px;
	background-color: #a9d18e;
	top: 65%;
	left: 50%;
}

.new-crono-english .container-ball:nth-of-type(1)::before {
	content: "";
	display: flex;
	width: 100%;
	height: 5px;
	background-color: #ddd;
	top: 65%;
	left: 50%;
}
.new-crono-english .container-ball:nth-of-type(2)::before {
	content: "";
	display: flex;
	width: 100%;
	height: 5px;
	background-color: #ddd;
	top: 65%;
	left: 50%;
}

.new-crono2 .container-ball::before {
	top: 65%;
}

.container-ball:last-child::before {
	display: none;
}

.ativos-ul {
	margin-left: 30px;
}

.crono-status {
	display: flex;
	margin-top: 30px;
	margin-left: 75px;
	/*width: 48px;allan*/
}

.new-crono .crono-status {
	margin-left: 63px;
}

.status {
	display: flex;
	margin-right: 30px;
	margin-bottom: 10px;
	/* background-color: rgb(192, 192, 192); aqui
    border-radius: 6px; */
}

.status > span:first-child {
	color: white;
	width: 20px;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 20px;
	border-radius: 50%;
	background: #a9d18e;
	margin-right: 5px;
}

.checked {
	background-color: #a9d18e;
}

.status:last-child > span:first-child {
	background: #ddd;
}

#bondes-santa-teresa .status:last-child > span:first-child {
	background: #fff;
}

@media only screen and (max-width: 1024px) {
	.container-ball:nth-of-type(4),
	.container-ball:nth-of-type(5),
	.container-ball:nth-of-type(6) {
		width: 50%;
		margin-top: 40px;
	}

	.container-ball::before {
		display: none;
	}

	.new-crono .container-ball::before {
		display: none;
	}

	.container-ball:nth-of-type(1)::before,
	.container-ball:nth-of-type(2)::before {
		content: "";
		display: flex;
		width: 100%;
		height: 2px;
		background: #ddd;
		position: relative;
		top: 80px;
		left: 95px;
	}

	.new-crono2 .container-ball:nth-of-type(1)::before,
	.new-crono2 .container-ball:nth-of-type(2)::before {
		content: "";
		display: flex;
		width: 100%;
		height: 2px;
		background: #ddd;
		position: relative;
		top: 65%;
		left: 80px;
	}

	.new-crono .container-ball:nth-of-type(1)::before,
	.new-crono .container-ball:nth-of-type(2)::before,
	#bondes-santa-teresa .new-crono .container-ball:nth-of-type(1)::before,
	#bondes-santa-teresa .new-crono .container-ball:nth-of-type(2)::before {
		content: "";
		display: flex;
		width: 100%;
		height: 2px;
		top: 65%;
		left: 50%;
	}

	.container-ball:nth-of-type(4)::before,
	#bondes-santa-teresa .container-ball:nth-of-type(4)::before {
		content: "";
		display: flex;
		width: 120px;
		height: 2px;
		background: #ddd;
		position: relative;
		top: 83px;
		left: 77px;
	}

	.container-ball:nth-of-type(4)::before,
	#bondes-santa-teresa .new-crono .container-ball:nth-of-type(4)::before {
		display: none;
	}

	.container-ball {
		flex: 1 33%;
	}

	.crono-status,
	.new-crono .crono-status {
		margin-left: 10px;
		flex-direction: column;
	}

	.container-ball:nth-of-type(4)::before {
		content: "";
		display: flex;
		height: 2px;
		width: 100%;
		background-color: #ddd;
		left: 50%;
	}

	.new-crono2 .container-ball:nth-of-type(4)::before {
		content: "";
		display: flex;
		height: 2px;
		width: 100%;
		background-color: #ddd;
		top: 65%;
		left: 50%;
	}

	.new-crono .container-ball:nth-of-type(4)::before,
	.new-crono .container-ball:nth-of-type(5)::before {
		content: "";
		display: flex;
		height: 2px;
		width: 100%;
		background-color: #ddd;
		left: 50%;
		top: 65%;
	}

	#bondes-santa-teresa .new-crono .container-ball:nth-of-type(4)::before,
	#bondes-santa-teresa .new-crono .container-ball:nth-of-type(5)::before {
		content: "";
		display: flex;
		height: 2px;
		width: 100%;
		background-color: #fff;
		left: 50%;
		top: 65%;
	}

	#bondes-santa-teresa .new-crono .container-ball:nth-of-type(5)::before {
		display: none;
	}
}

@media only screen and (max-width: 420px) {
	.container-ball:nth-of-type(1)::before,
	.container-ball:nth-of-type(2)::before {
		top: 105px;
		left: 80px;
	}
}

/********** PÁGINA URBANISMO **************/

.hero-urbanismo {
	background: url(/assets/img/urbanismo.png) no-repeat center center;
	background-size: cover;
	display: flex;
	align-items: center;
}

/*--mercado uruguiana--*/

.hero-uruguaiana {
	background: url(/assets/img/Uruguaiana_original.png) no-repeat center center;
	background-size: cover;
	display: flex;
	align-items: center;
}

.hero-uruguaiana::after,
.hero-interno::after {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.2);
}

/************* PÁGINA EFICIÊNCIA ENERGÉTICA***************/

.hero-eficiencia {
	background: url(/assets/img/eficiencia_energetica.png) no-repeat center center;
	background-size: cover;
}

.hero-eficiencia::after,
.hero-interno::after {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.2);
}

/************************************************************************************/
/***** NOVOS BREAKPOINTS ************************************************************/
/***** (depois acertar com os outros no fim da página) ******************************/
/************************************************************************************/

@media only screen and (min-width: 620px) and (max-width: 1440px) {
	.containerCabecalho {
		flex-wrap: wrap;
	}
	div#navDesk {
		/*width: 100%;*/
		display: inline-block;
		justify-content: left;
		padding-left: 25px;
	}
	.subMenuContent {
		top: 120px;
		left: 505px;
		z-index: 3;
	}
}

@media only screen and (min-width: 620px) and (max-width: 1024px) {
	.eixos-estrategicos-container {
		flex-wrap: wrap;
	}
	.eixos-container-interno {
		justify-content: space-between;
		width: 100%;
		display: flex;
	}
	.eixos-container-interno:nth-of-type(2) {
		justify-content: center;
	}
	.eixos-item {
		width: 45%;
	}
	.card-noticias {
		width: 80%;
		margin: 25px auto;
	}
	.assinaturasRodape {
		justify-content: space-around;
	}
}

@media screen and (max-device-width: 720px) {
	.containerCabecalho {
		justify-content: center;
	}
}

@media screen and (max-device-width: 620px) {
	.hero-interno span {
		margin: 0.5em;
		font-size: 2.5em;
	}
	.fale-conosco-container {
		flex-direction: column;
	}
	.sobre-p-container {
		width: 100%;
	}
	.eixos-estrategicos-container {
		width: 80%;
		flex-direction: column;
	}
	.eixos-container-interno {
		width: 100%;
		height: 300px;
		display: contents;
	}
	.eixos-container-interno.quebra-cabeca {
		display: block;
	}
	div#hero img {
		height: inherit;
		object-fit: cover;
	}
	.fale-conosco-container {
		width: 85%;
	}
	form.form-labels-on-top {
		width: 100%;
	}
	.mapouter,
	.gmap_canvas {
		width: 100%;
	}
	div#logoFacilita {
		margin-top: 30px;
	}
	.endereco {
		margin-bottom: 20px;
		padding-left: 0;
		width: 80%;
	}
	.map-end-container {
		flex-direction: column;
	}
	.menu-contexto-container {
		width: 95%;
	}
	#menu-contexto-navDesk ul {
		flex-wrap: wrap;
	}
	#menu-contexto-navDesk ul li {
		padding: 10px;
	}
	.bondes-container-img {
		flex-direction: column;
	}
	.bondes-container-img > .img-infra {
		width: 100%;
		padding: 20px;
	}
	/**** página infra.php */
	.rodovias-container-img {
		flex-direction: column;
	}
	img.img-infra {
		width: 100%;
	}
	.lotes-container-img {
		flex-direction: column;
		width: 100%;
	}
	.lote-grupo {
		width: 100%;
	}
	img.tabela-lote {
		width: 80%;
	}
	img.img-infra-lote {
		width: 100%;
	}
	a.documento-lote {
		width: 80%;
		margin-bottom: 20px;
	}
	.rodovias-container {
		flex-direction: column;
	}
	.terminais-rodoviarios-container-img {
		flex-direction: column;
	}
	ul.tabela-legenda {
		font-size: 0.85em;
	}
	/**** página concessao1 */
	.texto {
		margin: 0 auto;
		width: 85%;
	}
	section.list-docs.pub {
		width: 85%;
		margin: 0 auto;
	}
	.list-docs.pub ul {
		list-style-type: none;
	}
	section.list-docs.pub {
		width: 85%;
		margin: 0 auto;
	}
	.list-docs.pub ul {
		list-style-type: none;
	}
	#hero span {
		font-size: 3em;
		margin: 1em;
		width: min-content;
	}
	/* div#alertaSms {
		width: 85%;
		margin: 0 auto;
	} */
	div#documentos {
		margin-top: 20px;
	}
}

.legislacao ul.link {
	list-style-image: none;
	list-style: disc;
}

/***** PREVISÃO DO TEMPO ********************************/

.wrap-tituloSecao {
	display: flex;
	justify-content: space-between;
	height: 60px;
	align-items: center;
	/* margin: 30px 0 15px 0; */
}

.wrap-tituloSecao a {
	text-decoration: none;
}

.wrap-tituloSecao a:hover {
	border-bottom: 3px solid #294d8c;
}

.wrap-tituloSecao h3 {
	font-family: oswald;
	color: #ff6d23;
}

.cardPrevisaoTempo-wrapper {
	position: relative;
	-o-perspective: 900px;
	-webkit-perspective: 900px;
	-ms-perspective: 900px;
	perspective: 900px;
	margin: 0 auto;
}

#cardPrevisaoTempo {
	font-family: oswald;
	font-size: 1.1em;

	/* position: absolute; */
	-o-transition: all 1s ease-in-out;
	-webkit-transition: all 1s ease-in-out;
	-ms-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
	-o-transform-style: preserve-3d;
	-webkit-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	transform-style: preserve-3d;
}

.cardPrevisaoTempo img {
	width: 50%;
}

.cardPrevisaoTempoTexto {
	padding: 15px 35px;
	font-family: oswald;
	width: 50%;
}

.cardPrevisaoTempo {
	box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2), 0 4px 20px 0 rgba(0, 0, 0, 0.19);
	display: flex;
	flex-direction: row;
	width: 100%;
	border-bottom: solid #ff6d23 3px;
}

.nomeRegiao {
	display: flex;
	justify-content: space-between;
	height: 60px;
	align-items: center;
	margin-top: 10px;
	font-size: 0.9em;
}
.nomeRegiao h2 {
	color: #ff6d23;
}

.nomeRegiao button {
	background-color: #fff;
	border: none;
	font-family: oswald;
	color: #294d8c;
	font-size: 1em;
	font-weight: 600;
	margin-bottom: 10px;
}

svg.svg-inline--fa.fa-map-marker-alt.fa-w-12 {
	font-size: 2.5em;
}

.cardPrevisaoTempoTexto p {
	font-size: 1.2em;
	font-weight: 300;
}

p.dataPrevisao {
	font-weight: 600 !important;
	color: #294d8c;
	height: 60px;
	display: flex;
	align-items: center;
	font-size: 1.2em;
}

.dadosPrevisao {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 20px 0;
}

.dadosPrevisao img {
	width: auto;
}

div#temperaturas {
	display: flex;
	flex-direction: column;
	align-self: flex-end;
}

#temperaturas > div {
	display: flex;
}

.wrap-internoTemperaturas > div:first-child {
	margin-right: 10px;
}

.wrap-internoTemperaturas {
	padding: 4px 0;
}

.wiT1 {
	margin-bottom: 6px;
}

.valorIndice {
	display: inline-flex;
}

div#sol > div {
	text-align: center;
}

.horarioSol {
	display: flex;
	justify-content: center;
}

div#humidade > div {
	text-align: center;
}

div#humidade img {
	width: 80%;
}

.linha-internoHumidade {
	display: inline-flex;
}

div#humidade span {
	display: flex;
	flex-direction: column;
}

.wrap-internoHumidade {
	display: inline-flex;
}

.wrap-internoHumidade.home {
	display: flex;
	flex-direction: column;
}

div#ventos {
	width: min-content;
}

.w3-animate-zoom {
	animation: animatezoom 0.6s;
}

.w3-modal {
	padding-top: 0;
}

.w3-modal-content {
	margin: auto;
	background-color: #fff;
	position: relative;
	padding: 0;
	outline: 0;
	width: inherit;
	height: 100%;
	padding: 30px;
}

.w3-container,
.w3-panel {
	height: inherit !important;
}

.alterarRegiao {
	display: flex;
	justify-content: space-between;
	height: 60px;
	align-items: center;
	margin-bottom: 30px;
}

.alterarRegiao h2 {
	color: #294d8c;
}

.alterarRegiao button {
	background-color: #fff;
	border: none;
	font-family: oswald;
	color: #ff6d23;
	font-size: 1em;
	font-weight: 600;
}

.regioesRJ {
	color: #294d8c;
	font-size: 1.2em;
	display: flex;
}

.regioesRJ > div {
	margin-right: 40px;
}

.regioesRJ > div > div {
	margin-bottom: 15px;
	font-weight: 600;
}

.regioesRJ a {
	text-decoration: none;
}

div#cardPrevisaoTempo-wrapper {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.cardPrevisaoTempo {
	box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2), 0 4px 20px 0 rgba(0, 0, 0, 0.19);
	display: flex;
	flex-direction: row;
	width: 100%;
	border-bottom: solid #ff6d23 3px;
}

.cardPrevisaoTempo {
	width: 100%;
}

/***********************
TOOLTIP
***************************/

[data-tooltip] {
	position: relative;
	cursor: pointer;
}
[data-tooltip]:before,
[data-tooltip]:after {
	line-height: 1;
	font-size: 0.9em;
	pointer-events: none;
	position: absolute;
	box-sizing: border-box;
	display: none;
	opacity: 0;
}
[data-tooltip]:before {
	content: "";
	border: 5px solid transparent;
	z-index: 100;
}
[data-tooltip]:after {
	content: attr(data-tooltip);
	text-align: center;
	min-width: 3em;
	max-width: 21em;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	padding: 6px 8px;
	border-radius: 3px;
	background: #ff6d23;
	color: #ffffff;
	z-index: 99;
}
[data-tooltip]:hover:before,
[data-tooltip]:hover:after {
	display: block;
	opacity: 1;
}
[data-tooltip]:not([data-flow])::before,
[data-tooltip][data-flow="top"]::before {
	bottom: 100%;
	border-bottom-width: 0;
	border-top-color: #ff6d23;
}
[data-tooltip]:not([data-flow])::after,
[data-tooltip][data-flow="top"]::after {
	bottom: calc(100% + 5px);
}
[data-tooltip]:not([data-flow])::before,
[tooltip]:not([data-flow])::after,
[data-tooltip][data-flow="top"]::before,
[data-tooltip][data-flow="top"]::after {
	left: 50%;
	-webkit-transform: translate(-50%, -4px);
	transform: translate(-50%, -4px);
}
[data-tooltip][data-flow="bottom"]::before {
	top: 100%;
	border-top-width: 0;
	border-bottom-color: #ff6d23;
}
[data-tooltip][data-flow="bottom"]::after {
	top: calc(100% + 5px);
}
[data-tooltip][data-flow="bottom"]::before,
[data-tooltip][data-flow="bottom"]::after {
	left: 50%;
	-webkit-transform: translate(-50%, 8px);
	transform: translate(-50%, 8px);
}
[data-tooltip][data-flow="left"]::before {
	top: 50%;
	border-right-width: 0;
	border-left-color: #ff6d23;
	left: calc(0em - 5px);
	-webkit-transform: translate(-8px, -50%);
	transform: translate(-8px, -50%);
}
[data-tooltip][data-flow="left"]::after {
	top: 50%;
	right: calc(100% + 5px);
	-webkit-transform: translate(-8px, -50%);
	transform: translate(-8px, -50%);
}
[data-tooltip][data-flow="right"]::before {
	top: 50%;
	border-left-width: 0;
	border-right-color: #ff6d23;
	right: calc(0em - 5px);
	-webkit-transform: translate(8px, -50%);
	transform: translate(8px, -50%);
}
[data-tooltip][data-flow="right"]::after {
	top: 50%;
	left: calc(100% + 5px);
	-webkit-transform: translate(8px, -50%);
	transform: translate(8px, -50%);
}
[data-tooltip=""]::after,
[data-tooltip=""]::before {
	display: none !important;
}

/***** LOCAIS PONTO DE APOIO ********************************/

div#locaisApoio img {
	width: auto;
	height: auto;
}

/***** REDE SALVAR ********************************/

div#redeSalvar img {
	width: 100%;
	height: auto;
}

/***** AVISO meteorologico home ********************************/

.informativoHome {
	display: flex;
	font-family: oswald;
	margin: 50px 0;
	box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2), 0 4px 20px 0 rgba(0, 0, 0, 0.19);
	border-bottom: solid #ff6d23 3px;
}

.informativoImagemHome {
	display: flex;
	flex-direction: column;
	width: 50%;
	align-items: center;
	justify-content: center;
}

.informativoImagemHome img {
	width: 100%;
	height: auto;
}

.informativoTextoHome {
	width: 50%;
	padding: 30px;
}

.informativoTextoHome h3 {
	color: #294d8c;
	margin-bottom: 11px;
}

.informativoTextoHome p,
.informativoTextoHome ul {
	margin: 8px 0;
	color: #363636;
	font-weight: 300;
	font-size: 1.2em;
	line-height: 1.7em;
}

.informativoTextoHome p {
	margin: 15px 0;
}

.informativoTextoHome ul {
	text-indent: 25px;
}

/***** LINKS ÚTEIS ********************************/

.cardLinksUteis {
	box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2), 0 4px 20px 0 rgba(0, 0, 0, 0.19);
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	border-bottom: solid #ff6d23 3px;
	padding: 20px;
}

.cardLinksUteis img {
	margin: 15px;
}

div#rodape {
	min-height: 70px;
	max-height: 70px;
	display: flex;
	align-items: center;
	background-color: #00508a;
	/* flex-direction: column; */
	justify-content: center;
}

.assinaturasRodape {
	width: 85%;
	margin: 0 auto;
	justify-content: space-between;
	display: flex;
	align-items: center;
}

.assinaturasRodape img {
	height: fit-content;
}

/***** PÁGINA PREVISAO.HTML ********************************/

.cardPrevisaoTempoInterno {
	box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2), 0 4px 20px 0 rgba(0, 0, 0, 0.19);
	display: flex;
	flex-direction: row;
	width: 100%;
	border-bottom: solid #ff6d23 3px;
}

.nomeRegiaoInterno {
	display: flex;
	justify-content: space-between;
	height: auto;
	align-items: center;
	margin-top: 10px;
	font-size: 0.9em;
	color: #ff6d23;
}

p.dataPrevisaoInterno {
	font-weight: 600 !important;
	color: #294d8c;
	height: 40px;
	display: flex;
	align-items: center;
	font-size: 1.2em;
}

.cardPrevisaoTempoInterno {
	font-family: oswald;
	width: 45%;
	margin: 15px;
}

.cardPrevisaoTempoInterno p {
	font-weight: 300;
}

.cardPrevisaoTempoTextoInterno {
	padding: 15px 35px;
	width: 100%;
}

/***** PÁGINA AVISOS.HTML ********************************/

.informativo {
	display: flex;
	font-family: oswald;
	margin: 50px 0;
	font-weight: 300;
	font-size: 1.2em;
	line-height: 1.7em;
}

.informativoImagem {
	display: flex;
	flex-direction: column;
	width: 30%;
	align-items: center;
	justify-content: center;
	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2), 0 0 20px 0 rgba(0, 0, 0, 0.19);
}

.informativoImagem img {
	width: 100%;
	height: auto;
}

.informativoImagem.riscoAlto img,
.informativoImagem.riscoModerado img {
	width: 200px;
}

.informativoTexto {
	width: 70%;
	padding: 30px;
}

.informativoTexto h3 {
	color: #294d8c;
	margin-bottom: 11px;
}

.h3-topMargin {
	margin-top: 20px;
}

.informativoTexto p,
.informativoTexto ul {
	margin: 8px 0;
	color: #363636;
	font-weight: 300;
	font-size: 1.2em;
	line-height: 1.7em;
}

.informativoTexto p {
	margin: 15px 0;
}

.informativoTexto ul {
	text-indent: 25px;
}

.riscoAlto {
	border: solid #fb3b3b 4px;
	border-radius: 3px;
	color: #fb3b3b;
	font-size: 1.5em;
	font-weight: 600;
}

.riscoModerado {
	border: solid rgb(226, 143, 19) 4px;
	border-radius: 3px;
	color: rgb(226, 143, 19);
	font-size: 1.5em;
	font-weight: 600;
}

.riscoAlto span,
.riscoModerado span {
	margin-top: 20px;
}

/***** PÁGINA ALERTAS.HTML ********************************/

.alerta {
	display: flex;
	font-family: oswald;
	margin: 50px 0;
}

.alertaImagem {
	display: flex;
	flex-direction: column;
	width: 30%;
	align-items: center;
	justify-content: center;
	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2), 0 0 20px 0 rgba(0, 0, 0, 0.19);
	height: fit-content;
}

.alertaImagem img {
	width: 100%;
	height: auto;
}

.alertaTexto {
	padding: 15px 30px;
	width: 70%;
}

.alertaTexto h3 {
	color: #294d8c;
}

.alertaTexto p,
.alertaTexto ul {
	margin: 8px 0;
	color: #363636;
	font-size: 0.9em;
}

.alertaTexto p {
	margin: 15px 0;
	line-height: 1.7em;
}

.alertaTexto ul {
	text-indent: 25px;
}

/***** PÁGINA ALERTA SMS ********************************/

#cardAlertaSms-wrapper img {
	width: 100%;
	height: auto;
}

div#alertaSms h1 {
	color: #294d8c;
	margin: 30px 0;
}

div#alertaSms p {
	margin-left: 80px;
	line-height: 27px;
}

div#alertaSms h2 {
	color: #294d8c;
	padding: 0 70px;
	margin: 40px 10px 10px 10px;
}

div#alertaSms figure {
	margin: 1em 0 1em 120px;
}

div#alertaSms figcaption {
	font-size: 0.8em;
	font-style: oblique;
}

.caixaObservacao {
	width: 50%;
	background-color: #ddd;
	padding: 20px;
	margin: 20px 0 20px 120px;
	border-radius: 20px;
}

.caixaObservacao p {
	margin-left: 20px !important;
}

/******* PÁGINA DESASTRES ***********/

.cardDesastres {
	box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2), 0 4px 20px 0 rgba(0, 0, 0, 0.19);
	display: flex;
	flex-direction: column;
	width: 30%;
	border-bottom: solid #ff6d23 3px;
	margin: 0 15px 20px 0;
	cursor: pointer;
	/* width: 100%; */
}

.cardsContainerDesastres {
	display: flex;
	flex-wrap: wrap;
}

.cardDesastres a {
	text-decoration: none;
}

.cardDesastresTexto {
	padding: 15px;
	font-family: oswald;
	font-size: 1.25em;
	color: #294d8c;
	font-size: 1.1em;
	font-weight: 600;
	text-transform: uppercase;
}

.cardDesastres:hover {
	box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.3), 0 4px 20px 0 rgba(0, 0, 0, 0.5);
}

.cardDesastres img {
	width: 100%;
}

/*
.cardsContainer a:last-child {
    margin-right: 0;
}

 .cardsContainer a:nth-of-type(4) {
    margin-top: 20px;
}

.cardsContainer a:nth-of-type(5) {
    margin-top: 20px;
} 

#desastres .cardsContainer {
    flex-wrap: wrap;
    justify-content: flex-start;
}

.cardsContainer a {
    text-decoration: none;
    margin: 0 20px 20px 0;
}
*/

/******** Pagina Granizo **********/

.granizo h4 {
	font-size: 1.3em;
	font-family: oswald;
	font-weight: bold;
	margin-bottom: 15px;
	color: #294d8c;
}

.granizo .textoContainer p,
.granizo .textoContainer ul,
.granizo .textoContainer ul li {
	font-size: 1.2em;
	font-family: oswald;
	font-weight: 300;
	color: #000;
}

.granizo .textoContainer p:nth-of-type(1) {
	margin-bottom: 25px;
}

.granizo .textoContainer p:nth-of-type(2) {
	margin-bottom: 25px;
}

.granizo .textoContainer ul li {
	list-style: none;
	font-size: 1em;
	margin-left: 10px;
}

.granizo h4:nth-of-type(1) {
	margin-top: 40px;
}

.granizo .textoContainer p:nth-of-type(3) {
	margin-bottom: 25px;
}

.granizo .textoContainer p:nth-of-type(4) {
	margin-bottom: 25px;
}

.granizo .textoContainer p:nth-of-type(5) {
	margin-bottom: 50px;
}

#perguntas-frequentes ul {
	font-size: 1.2em;
	margin-top: 20px;
}

#perguntas-frequentes span {
	font-size: 1.3em;
	font-weight: bold;
	font-family: oswald;
	color: #294d8c !important;
	margin-bottom: 20px;
}

#perguntas-frequentes ul li {
	font-style: 0.9em !important;
	margin-top: 25px;
	margin-bottom: 25px;
	margin-left: 10px;
	font-weight: 300;
}

/************ Pagina Raios ***********/

.raios h4 {
	font-size: 1.3em;
	font-family: oswald;
	font-weight: bold;
	margin-bottom: 15px;
	color: #294d8c;
}

.raios .textoContainer p,
.raios .textoContainer ul,
.raios .textoContainer ul li {
	font-size: 1.2em;
	font-family: oswald;
	font-weight: 300;
	color: #000;
}

.raios .textoContainer p:nth-of-type(1) {
	margin-bottom: 25px;
}

.raios .textoContainer p:nth-of-type(2) {
	margin-bottom: 25px;
}

.raios .textoContainer ul li {
	list-style: none;
	font-size: 1em;
	margin-left: 10px;
}

.raios h4:nth-of-type(1) {
	margin-top: 40px;
}

.raios .textoContainer p:nth-of-type(3) {
	margin-bottom: 25px;
}

.raios .textoContainer p:nth-of-type(4) {
	margin-bottom: 25px;
}

.raios .textoContainer p:nth-of-type(5) {
	margin-bottom: 25px;
}
.raios .textoContainer p:nth-of-type(6) {
	margin-bottom: 25px;
}
.raios .textoContainer p:nth-of-type(7) {
	margin-bottom: 25px;
}
.raios .textoContainer p:nth-of-type(8) {
	margin-bottom: 50px;
}

#perguntas-frequentes ul {
	font-size: 1.2em;
	margin-top: 20px;
}

#perguntas-frequentes span {
	font-size: 1.3em;
	font-weight: bold;
	font-family: oswald;
	color: #294d8c !important;
	margin-bottom: 20px;
}

#perguntas-frequentes ul li {
	font-style: 0.9em !important;

	margin-top: 25px;
	margin-bottom: 25px;
	margin-left: 10px;
	font-weight: 300;
}

#ul-danos span {
	font-size: 1em !important;
}

#ul-danos li {
	font-family: oswald !important;
	font-size: 0.7em !important;
	font-weight: 400 !important;
	margin-left: 40px !important;
}

#ul-danos li:last-child {
	margin-bottom: 50px;
}

/******** Página vendaval *******/

.vendaval h4 {
	font-size: 1.3em;
	font-family: oswald;
	font-weight: bold;
	margin-bottom: 15px;
	color: #294d8c;
}

.vendaval .textoContainer p,
.vendaval .textoContainer ul,
.vendaval .textoContainer ul li {
	font-size: 1.2em;
	font-family: oswald;
	font-weight: 300;
	color: #000;
}

.vendaval .textoContainer p:nth-of-type(1) {
	margin-bottom: 25px;
}

.vendaval .textoContainer p:nth-of-type(2) {
	margin-bottom: 25px;
}

.vendaval .textoContainer ul li {
	list-style: none;
	font-size: 1em;
	margin-left: 10px;
}

.vendaval h4:nth-of-type(1) {
	margin-top: 40px;
}

.vendaval .textoContainer p:nth-of-type(1n + 1) {
	margin-bottom: 25px;
}

.vendaval .textoContainer p:nth-of-type(7) {
	margin-bottom: 50px;
}

#perguntas-frequentes ul span {
	font-size: 1em;
}

#perguntas-frequentes ul {
	font-size: 1.2em;
	margin-top: 20px;
}

#perguntas-frequentes span {
	font-size: 1.3em;
	font-weight: bold;
	font-family: oswald;
	color: #294d8c !important;
	margin-bottom: 20px;
}

#perguntas-frequentes ul li {
	font-style: 0.9em !important;
	margin-top: 25px;
	margin-bottom: 25px;
	margin-left: 10px;
	font-weight: 300;
}

#ul-danos span {
	font-size: 1em !important;
}

#ul-danos li,
#ul-oqueSAO li {
	font-family: oswald !important;
	font-size: 0.7em !important;
	font-weight: 400 !important;
	margin-left: 40px !important;
}

#ul-danos li:last-child,
#ul-oqueSAO li:last-child {
	margin-bottom: 50px;
}

/*
PÁGINA TRANSPARÊNCIA
****************************************/

/* 
Generic Styling, for Desktops/Laptops 
*/
table {
	width: 100%;
	border-collapse: collapse;
}
/* Zebra striping */
tr:nth-of-type(odd) {
	background: #eee;
}
th {
	background: #333;
	color: white;
	font-weight: bold;
}
td,
th {
	padding: 6px;
	border: 1px solid #ccc;
	text-align: left;
	font-family: sans-serif;
}
td {
	line-height: 1.2;
}

/* Página Portfolio de Projetos */

aside#menu-aside-portfolio {
	background-color: rgba(33, 33, 33, 1);
	max-width: 250px;
	position: sticky;
}
aside#menu-aside-portfolio nav.container {
	padding: 12px;
}

aside#menu-aside-portfolio nav > ul {
	list-style: none;
}

aside#menu-aside-portfolio nav ul li div span {
	display: inline-block;
	min-width: 24px;
	height: 24px;
	margin-right: 5px;
	transition: transform 0.3s ease-in-out;
}

aside#menu-aside-portfolio nav ul li.active div span {
	transform: rotate(180deg);
}

aside#menu-aside-portfolio nav ul li {
	margin-bottom: 20px;
	overflow: hidden;
}

aside#menu-aside-portfolio nav > ul > li > div {
	display: flex;
	align-items: center;
}

aside#menu-aside-portfolio nav ul li div span {
	cursor: pointer;
}

aside#menu-aside-portfolio a {
	font-size: 1rem;
	font-family: sans-serif;
	color: white;
}

aside#menu-aside-portfolio nav ul.menu-aside-ul > li.active > div > a,
aside#menu-aside-portfolio nav ul li.active svg,
aside#menu-aside-portfolio nav ul li a:hover,
aside#menu-aside-portfolio nav ul li.active > a,
aside#menu-aside-portfolio nav ul.menu-aside-ul > li svg:hover,
aside#menu-aside-portfolio nav ul.menu-aside-ul > li > div > span.active svg {
	color: rgb(187, 211, 226);
	stroke: rgb(187, 211, 226);
}

aside#menu-aside-portfolio nav > ul.menu-aside-ul > li:first-child {
	margin-left: 30px;
}

aside#menu-aside-portfolio .logo-area {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0 auto;
	margin-bottom: 30px;
	width: 70%;
}

aside#menu-aside-portfolio .logo-area img {
	max-width: 100%;
}

.portfolio-projetos-area {
	width: 100%;
}

.titulo-portfolio {
	height: 300px;
	display: grid;
	place-items: center;
	text-align: center;
	position: relative;
	color: white;
	z-index: 200;
}

.titulo-portfolio::before {
	content: "";
	display: inline-block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	backdrop-filter: blur(1px);
	z-index: -1;
}

.portfolio-detalhes {
	padding: 25px 0px 50px 0px;
	width: 100%;
	margin: 0 auto;
}

.titulo-portfolio.concessoes {
	background: url("/assets/img/concessao.jpg") no-repeat;
	background-attachment: fixed;
	background-size: cover;
	background-position: center;
}

.titulo-portfolio.escolas-solares {
	background: url("/assets/img/FOTO 4 - ESCOLAS SUSTENTÁVEIS.jpg") no-repeat;
	background-size: cover;
	background-position: center center;
}

.titulo-portfolio.parques-estaduais {
	background: url("/assets/img/ativos-ambientais.jpg") no-repeat;
	background-size: cover;
	background-position: center center;
}

.titulo-portfolio.projetos-estruturacao {
	background: url("/assets/img/background-projetos.jpg") no-repeat;
	background-size: cover;
}

.titulo-portfolio.projetos-viabilidade {
	background: url("/assets/img/bgViabilidade.jpg") no-repeat;
	background-size: cover;
}

.titulo-portfolio.estacao-maua {
	background: url("/assets/img/Leopoldina2.jpg") no-repeat;
	background-size: cover;
	background-position: center center;
}

.titulo-portfolio.estadio-lagoa {
	background: url("/assets/img/Estadio_Remo_Lagoa.jpeg") no-repeat;
	background-size: cover;
	background-position: center center;
}
.titulo-portfolio.projeto-nucleo {
	background: url("/assets/img/parque_estadual.png") no-repeat;
	background-size: cover;
	background-position: center center;
}

.titulo-portfolio.rodovias-portfolio {
	background: url("/assets/img/FOTO\ 2\ -\ RODOVIAS.jpg") no-repeat;
	background-size: cover;
	background-position: center center;
}

.titulo-portfolio.lote1 {
	background: url("/assets/img/LOTE1.jpg") no-repeat;
	background-size: cover;
	background-position: center center;
}

.titulo-portfolio.lote2 {
	background: url("/assets/img/LOTE2.jpg") no-repeat;
	background-size: cover;
	background-position: center center;
}

.boxes {
	/* display: grid;
	grid-template-columns: repeat(3, 250px); */
	row-gap: 20px;
	margin-top: 30px;
	column-gap: 30px;
	display: flex;
	flex-wrap: wrap;
	/* justify-content: center; */
}
.boxes:first-child{
	justify-content: center;
}


.subtitle-boxes {
	color: #00508a;
	width: 100%;
	display: block;
	font-weight: bold;
	font-size: 1.5rem;
	text-align: center;
	margin-bottom: 60px;
}

.box-wrap:not(.box-wrap:last-child) {
	margin-top: 80px;
	margin-bottom: 80px;
}

.mobile-close {
	display: none;
}

.button-mobile {
	display: none;
}

.titulo-portfolio h2 {
	margin: 0 auto;
	font-size: 4rem;
	color: white;
}

.portfolio-projetos-area::-webkit-scrollbar {
	width: 10px;
}

.portfolio-projetos-area::-webkit-scrollbar-thumb {
	background-color: #00508a;
	border-radius: 20px;
	border: 2px solid #fff;
}

ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.sublist-area {
	overflow: hidden;
	visibility: hidden;
	transform: translateY(-200%);
	max-height: 0;
}

.sublist {
	padding-left: 50px;
	margin-top: 10px;
	color: white;
}

.sublist li {
	margin-top: 15px;
}

aside#menu-aside-portfolio nav > ul.menu-aside-ul li.active .sublist-area,
aside#menu-aside-portfolio nav > ul.menu-aside-ul li .sublist-area.active {
	animation: sublistDown 0.4s ease-in-out forwards;
}

.card-box {
	width: 100%;
	box-shadow: 4px 4px 0px 0px #bbb, 8px 8px 0 0 #ddd;
	border-radius: 3px;
	transition: box-shadow 0.4s ease-in-out;
	overflow: hidden;
	/* max-height: 250px; */
	height: 230px;
	max-width: 225px;
}

.card-box a img {
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
	width: 100%;
}

.card-box:hover {
	box-shadow: 3px 3px 0px 0px #bbb, 6px 6px 0 0 #ddd;
}

.card-box a p {
	padding: 10px;
	font-weight: bold;
	transition: all 0.3s ease-in-out;
	width: 100%;
	text-align: center;
	color: white;
	opacity: 0;
	transform: translate(-100%, 50px);
	position: absolute;
	opacity: 1;
	top: 50%;
	left: -50%;
}

.card-box img {
	display: block;
	max-width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.3s ease-in-out;
}

.card-box a {
	display: block;
	height: 100%;
	position: relative;
}

.card-box a::after {
	transition: opacity 0.3s ease-in-out;
}

.sublist li.active a {
	color: rgb(187, 211, 226) !important;
}

.card-box:hover img {
	transform: scale(1.2);
}

.card-box:hover a:after {
	content: "";
	display: block;
	height: 100%;
	width: 100%;
	background-color: rgba(0, 0, 0, 0.35);
	position: absolute;
	top: 0;
	left: 0;
	z-index: 8888;
}

.card-box:hover a p {
	z-index: 9999;
	color: white;
	transform: translate(50%, -50%);
	transition: all 0.3s ease-in-out;
}

.detalhes-container {
	width: 75%;
	margin: 0 auto;
}

.portfolio-detalhes hr {
	margin-top: 50px;
	border-bottom: 2px solid #ddd;
	height: 2px;
	border-radius: 2px;
}

.box-area {
	width: 90%;
	margin: 50px auto;
}

.wrap {
	margin: 30px 0;
	display: grid;
	align-items: flex-start;
	grid-template-columns: 450px 1fr;
}

.wrap-img-area {
	max-width: 450px;
	margin-right: 30px;
	height: auto;
	min-height: 220px;
}

.wrap-img-area.mobile {
	display: none;
}

.wrap-img-area img {
	width: 100%;
	min-height: 220px;
	height: 100%;
}

.wrap-detalhes-area {
	flex: 1;
}

.wrap-detalhes-area b {
	font-size: 2.8333rem;
	display: block;
	font-weight: 600;
	color: #000;
	margin: 25px 0;
	font-family: "Oswald";
}

.subtitle-portfolio {
	font-size: 1.5rem;
	font-weight: bold;
	color: #00508a;
	display: inline-block;
	margin-bottom: 20px;
}

.subtitle-portfolio::after {
	content: "";
	height: 3px;
	width: 40%;
	background-color: #00508a;
	border-radius: 2px;
	display: block;
}

.portfolio-textos {
	margin: 80px 0;
}

.portfolio-textos .portfolio-texto {
	margin: 50px 0;
}

@keyframes sublistDown {
	from {
		transform: translateY(-200%);
		visibility: hidden;
	}
	to {
		transform: translateY(0px);
		visibility: visible;
		max-height: unset;
	}
}

/* 
  Max width before this PARTICULAR table gets nasty
  This query will take effect for any screen smaller than 760px
  and also iPads specifically.
  */
@media only screen and (max-width: 760px),
	(min-device-width: 768px) and (max-device-width: 1024px) {
	/* Force table to not be like tables anymore */
	table,
	thead,
	tbody,
	th,
	td,
	tr {
		display: block;
	}

	/* Hide table headers (but not display: none;, for accessibility) */
	thead tr {
		position: absolute;
		top: -9999px;
		left: -9999px;
	}

	tr {
		border: 1px solid #ccc;
	}

	td {
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee;
		position: relative;
		padding-left: 50%;
	}

	td:before {
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 45%;
		padding-right: 10px;
		white-space: nowrap;
	}

	/*
      Label the data
      */
	td:nth-of-type(1):before {
		content: "ÓRGÃO GERENCIADOR";
		font-family: oswald;
		font-size: 0.8em;
	}
	td:nth-of-type(2):before {
		content: "OBJETO DA CONTRATAÇÃO";
		font-family: oswald;
		font-size: 0.8em;
	}
	td:nth-of-type(3):before {
		content: "PROCESSO SEI";
		font-family: oswald;
		font-size: 0.8em;
	}
	td:nth-of-type(4):before {
		content: "ESTIMADO DA CONTRATAÇÃO (R$)";
		font-family: oswald;
		font-size: 0.8em;
	}
}

/*
  Customizações na tabela
  */

th {
	font-family: oswald;
}

.direitosHumanos,
.defesaCivil,
.ambiente,
.obras,
.pescaAbastecimento {
	font-family: oswald;
	font-size: 0.9em;
}

.direitosHumanos {
	background-color: #64bae42b;
}
.defesaCivil {
	background-color: #ff6d2352;
}
.ambiente {
	background-color: #4caf5038;
}
.obras {
	background-color: #294d8cad;
}
.pescaAbastecimento {
	background-color: #673ab733;
}

.transparencia p {
	font-family: sans-serif;
}

td:nth-of-type(3),
td:nth-of-type(4) {
	font-size: 0.7em;
}
/*  td:nth-of-type(3) {  } */

section.licitacoes-em-andamento {
	margin-top: 150px;
}

.lista-licitacoes {
	padding-left: 30px;
	font-family: sans-serif;
	margin-bottom: 150px;
}

.lista-licitacoes ul {
	margin-top: 50px;
}

.lista-licitacoes ul li {
	padding: 12px 15px;
	font-size: 1.2em;
	list-style-type: square;
	border-bottom: solid 1px #bbb;
}

.lista-licitacoes ul li:nth-child(odd) {
	background: #cccccc87;
}

.lista-licitacoes ul li:nth-child(even) {
	background: #eee;
}

.lista-licitacoes ul li:hover {
	background-color: #7393a138;
	border-bottom: solid 1px #3636368c;
}

/******* Parte do vídeo na Home ******/

.video {
	margin-top: 50px;
}

/********** HOME: Ajuda Humanitária ************/

.ajuda_humanitaria {
	width: 100%;
	margin: 80px 0;
}

.ajuda_humanitaria a {
	display: block;
	width: 100%;
	text-decoration: none;
}

.banner img {
	display: block;
	width: 100%;
	height: auto;
}

/* Projetos Portfolio */

#projeto_estruturacao {
	margin: 30px 0;
}

#projeto_estruturacao img {
	display: block;
	max-width: 100%;
}

.subtitle-projeto_estruturacao {
	display: inline-block;
	font-size: 1.5rem;
}

.subtitle-projeto_estruturacao::after {
	content: "";
	width: 100%;
	display: inline-block;
	height: 3px;
	background-color: #00508a;
}

.projeto_estruturacao-cards {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	margin: 30px 0;
	gap: 25px;
}

.projeto_estruturacao-card {
	text-align: center;
	box-shadow: 0 0 3px #ccc;
	cursor: pointer;
	border-radius: 4px;
	transition: 0.3s ease-in-out;
}

.projeto_estruturacao-card:hover {
	box-shadow: 0 0 3px 2px #00508a;
}

.projeto_estruturacao-card-details {
	padding: 10px 10px 40px 10px;
}
/***** MEDIA-QUERIES ********************************/

/* @media (min-width: 993px) {
.w3-modal-content {
    width: 900px;}
} */

@media only screen and (max-width: 1400px) {
	.card-box{
		height: 220px;
		max-width: 212px;
		
	}
}

@media only screen and (max-width: 1200px) {
	.containerCabecalho {
		width: 100%;
	}
	
}

@media only screen and (max-width: 1024px) {
	/***** HOME: PREVISÃO DO TEMPO *******************/

	.dadosPrevisao {
		justify-content: space-around;
		flex-wrap: wrap;
	}

	.dadosPrevisao > div {
		border: solid 2px #ddd;
		border-radius: 12px;
		display: flex;
		flex-direction: column;
		align-items: center;
		min-height: 115px;
		margin-bottom: 15px;
		padding: 5px;
		width: 100px;
	}

	.dadosPrevisao img {
		width: auto;
		/* margin-bottom: 20px; */
	}

	div#tempo {
		display: flex;
		justify-content: center;
	}

	div#tempo img {
		margin-bottom: 0px;
	}

	div#temperaturas {
		display: flex;
		justify-content: center;
	}

	#temperaturas > div {
		display: flex;
		height: 40px;
		align-items: center;
	}

	.wrap-internoTemperaturas {
		padding: 0;
	}

	.wrap-internoTemperaturas > div img {
		margin-bottom: 0;
	}

	.wrap-internoTemperaturas div:nth-child(2) {
		width: 20px;
		text-align: center;
	}

	div#sol {
		display: flex;
		justify-content: center;
	}

	div#ventos {
		width: min-content;
		display: flex;
		justify-content: center;
		font-size: 0.9em;
		min-width: 100px;
	}

	.wrap-internoHumidade {
		padding: 8px;
	}

	div#humidade {
		display: flex;
		flex-direction: row;
		justify-content: center;
	}

	div#humidade img {
		width: auto;
	}

	.cardPrevisaoTempoTextoInterno {
		padding: 15px;
	}

	.cardPrevisaoTempoTextoInterno p {
		padding: 0 10px 0 20px;
	}

	.nomeRegiao {
		padding-left: 20px;
	}
}

@media screen and (min-device-width: 601px) {
	#navMob {
		display: none;
		visibility: hidden;
	}
	.logo-secretaria-vertical {
		display: none;
		visibility: hidden;
	}
}

/******** Responsividade da parte de DESASTRES pra modo tablet *********/

@media only screen and (min-width: 767px) and (max-width: 1024px) {
	.cardDesastres:nth-of-type(3) {
		margin-right: 0;
	}

	/*     .assinaturasRodape {
        justify-content: flex-start;
    }
    .assinaturasRodape img:nth-of-type(1) {
        width: 170px;
        margin-right: 10px;
    } 

    .assinaturasRodape img:nth-of-type(3) {
        width: 360px;
        margin-left: 10px;
    } */
	.containerCabecalho #logoDefesaCivilRJ img,
	.containerCabecalho #logoBombeirosRJ img {
		width: 60px;
	}

	div#navDesk ul li {
		width: auto;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.containerCabecalho {
		justify-content: space-around;
	}
	div#navDesk ul li {
		font-size: 13px;
	}
	div#navDesk ul li:nth-of-type(1) {
		margin-right: 15px;
		margin-left: 5px;
	}
	div#logoBombeirosRJ {
		margin-left: 10px;
	}

	div#logoGovEstadoRJ img {
		width: 285px;
	}

	/* div#rodape {
        height: 300px;
    } */

	.cardsContainer a {
		text-decoration: none;
	}
}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
	/***** HOME: cards no tablet ******/
	#servicos .cardsContainer {
		justify-content: center;
	}

	#servicos .card-noticias:first-child,
	#servicos .card-noticias:nth-of-type(3) {
		margin-right: 5%;
	}

	#servicos .card-noticias:first-child,
	#servicos .card-noticias:nth-of-type(2) {
		margin-top: 5%;
	}
}

@media only screen and (max-width: 768px) {
	/****** HOME: Cards no celular*****/

	#servicos .cardsContainer {
		justify-content: center;
	}

	#servicos .card-noticias {
		margin: 0 0 20px 0;
	}

	/*********** Parte dos cartões de desastres no celular ***********/

	.cardDesastres {
		width: 45%;
	}

	.conteudoContainer {
		width: 95%;
	}

	/*     .cardDesastres:nth-of-type(4) {
        margin-top: 0;
    }
    .cardDesastres:nth-of-type(5) {
        margin-top: 0;
    } */

	div#rodape {
		height: 80px;
	}

	/*     .cardsContainer a:nth-of-type(2), .cardsContainer a:nth-of-type(3) {
        margin-top: 20px;
    } */

	#desastres .cardsContainer {
		justify-content: center;
	}

	.cardsContainer a {
		margin-right: 0;
	}

	/************ HOME: SERVIÇOS ********************/

	.cardsContainer {
		flex-wrap: wrap;
	}

	/************ cabeçalho ********************/

	.nav__toggle {
		top: 165px;
	}

	div#logoGovEstadoRJ {
		width: 100%;
		display: flex;
		justify-content: center;
	}

	.menu-superior {
		height: auto;
	}

	.menusupi {
		width: 100%;
		flex-direction: column;
		padding: 15px;
	}

	.infosup {
		text-align: center;
		padding: 10px;
		font-size: 1.1em;
	}

	.esquerda-menu-superior {
		padding: 8px 0;
		width: 100%;
		display: flex;
		justify-content: center;
	}

	.containerCabecalho {
		padding-top: 50px;
	}

	.splash {
		top: 165px;
	}

	.nav:target .nav__item,
	.nav--open .nav__item {
		max-width: 95%;
	}

	ul.nav__menu {
		padding-left: 20px;
	}

	a.nav__link {
		font-size: 1.3rem;
	}

	ul.subMenuContent__navMob li {
		font-size: 1.2rem;
		margin-bottom: 10px;
	}

	/**** HOME: AVISOS E INFORMATIVOS METEREOLÓGICOS *****/

	.informativoHome {
		flex-direction: column;
		margin: 0;
	}

	.informativoImagemHome {
		width: 100%;
	}

	.informativoImagemHome img {
		width: 70%;
		height: auto;
	}

	.informativoTexto {
		width: 100%;
		padding-top: 0;
	}

	p.subTituloSecao {
		font-size: 1.1em;
	}

	/******************** PÁGINA AVISOS METEREOLÓGICOS *********************/

	div#alertaSms figure {
		margin: 1em 0;
	}

	div#alertaSms figure img {
		width: 100%;
		height: auto;
	}

	div#alertaSms p {
		margin-left: 10px;
	}

	div#alertaSms h2 {
		padding: 0;
	}

	.caixaObservacao {
		margin: 20px 0;
		width: 95%;
	}

	.informativo {
		flex-direction: column;
		box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2), 0 0 20px 0 rgba(0, 0, 0, 0.19);
		width: 95%;
		margin: 40px auto;
	}

	.informativoImagem {
		box-shadow: unset;
	}

	/************* PÁGINA ALERTA HIDROLÓGICO *******************/

	.alertaImagem {
		box-shadow: unset;
	}

	.alertaImagem img {
		width: 60%;
	}

	.alerta {
		flex-direction: column;
		box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2), 0 0 20px 0 rgba(0, 0, 0, 0.19);
		width: 95%;
		margin: 40px auto;
	}
}

@media screen and (max-device-width: 600px) {
	/* CABEÇALHO E RODAPÉ */
	div#navDesk {
		display: none;
		visibility: hidden;
	}

	.btn-principal {
		display: none;
	}
	.containerCabecalho {
		flex-wrap: wrap;
		justify-content: center;
	}
	#logoBombeirosRJ {
		margin: 25px;
	}
	#logoDefesaCivilRJ {
		margin: 25px;
	}
	div#rodape {
		height: fit-content;
		padding: 30px;
		min-height: fit-content;
		max-height: 100%;
	}
	.assinaturasRodape {
		flex-direction: column;
		align-items: center;
	}
	.assinaturasRodape img {
		margin-bottom: 30px;
	}
	.logo-secretaria {
		display: none;
		visibility: hidden;
	}
	/* GERAL */
	.conteudoContainer {
		width: 95%;
		padding: 0;
	}
	.tituloSecao {
		margin: 27px 0;
		font-family: oswald;
		color: #00508a;
		font-size: 1.3em;
		font-weight: 600;
		text-transform: uppercase;
	}
	.wrap-tituloSecao h3 {
		font-family: oswald;
		color: #ff6d23;
		font-size: 0.9em;
	}
	/* HOME */
	.card-noticias {
		width: 100%;
		margin-bottom: 40px;
	}
	.cardsContainer {
		flex-wrap: wrap;
		justify-content: center;
	}
	.cardLinksUteis {
		justify-content: center;
	}
	/* PÁGINA PREVISÃO */
	.cardPrevisaoTempoInterno {
		width: 100%;
	}
	.cardPrevisaoTempo {
		flex-direction: column;
	}
	.cardPrevisaoTempo img {
		width: 100%;
	}
	.cardPrevisaoTempoTexto {
		width: 100%;
	}
	.cardPrevisaoTempoTexto p {
		font-size: 1em;
		font-weight: 300;
	}
	.dadosPrevisao {
		flex-wrap: wrap;
		margin: 20px 0 20px 0;
	}
	.dadosPrevisao > div {
		width: 35%;
	}
	.nomeRegiao {
		font-size: 0.7em;
		height: fit-content;
	}
	p.dataPrevisao {
		font-size: 0.9em;
		height: fit-content;
	}
	/* PÁGINA AVISOS */
	.informativo {
		flex-direction: column;
	}
	.alerta {
		flex-direction: column;
	}
	.alertaTexto {
		width: 100%;
	}
}

@media only screen and (min-width: 300px) and (max-width: 767px) {
	/* Alterando a parte de aviso na versão mobile. Colocando a imagem no centro. */
	.informativoImagem {
		width: 200px;
		margin-left: auto;
		margin-right: auto;
	}

	/* Aumentando em 100% a div alertaImagem */
	.alertaImagem {
		width: 100%;
	}

	/* Resolvendo problema de desaparecimento do botão de localização no card. */
	.cardPrevisaoTempoTexto {
		padding: 15px 10px;
	}

	.w3-modal-content {
		padding: 0;
	}
	/*     #hero > div {
        height: 229px;
    } */

	.wrap-tituloSecao {
		justify-content: center;
	}
}

@media only screen and (max-width: 460px) {
	.card-noticias {
		width: 90%;
		margin-bottom: 30px;
	}
}

@media only screen and (max-width: 300px) {
	/* Alteração do font-size do h2 da div alterarRegiao */

	.alterarRegiao h2 {
		font-size: 22px;
	}

	/* Alterando o padding do modal pra 0 na versão menor do mobile */

	.w3-modal-content {
		padding: 0;
	}

	/* Alteração apenas do padding da direita e esquerda na div cardPrevisaoTempoTexto */

	.cardPrevisaoTempoTexto {
		padding: 15px 10px;
	}

	/* Definindo o elemento a dentro da div nomeRegiao para flex e colocando ele no centro  para que não quebre */

	.nomeRegiao a {
		display: flex;
		justify-content: center;
	}
}

/* Projetos Portfolio Media Queries */

@media screen and (max-width: 1023px) {
	.row {
		flex-direction: column;
	}

	aside#menu-aside-portfolio {
		max-width: 100%;
		position: fixed;
		z-index: 9999;
		height: 100vh;
		top: 0;
		transition: transform 0.4s ease-in-out;
		transform: translate(-100vw, 0);
	}

	aside#menu-aside-portfolio.active {
		transform: translate(0, 0);
	}

	.portfolio-projetos-area {
		overflow: initial;
	}

	.card-box a p {
		z-index: 9998;
		color: white;
		transform: translate(50%, -50%);
		transition: all 0.3s ease-in-out;
	}

	.portfolio-projetos-area {
		height: auto;
	}

	.titulo-portfolio {
		/* height: auto !important; */
		/* padding: 40px; */
	}

	.button-mobile {
		display: inline-block;
		position: absolute;
		left: 20px;
		top: 20px;
		z-index: 999;
		cursor: pointer;
	}

	.button-mobile span {
		height: 3px;
		width: 20px;
		background-color: #fff;
		margin-bottom: 4px;
		display: block;
	}

	.mobile-close {
		position: absolute;
		top: 20px;
		right: 15px;
		display: inline-block;
	}

	.mobile-close span {
		width: 20px;
		height: 3px;
		background: #fff;
		display: block;
		margin-bottom: 5px;
	}

	.mobile-close span:nth-child(2) {
		transform: rotate(40deg);
		position: relative;
		top: -8px;
		left: 0px;
	}

	.mobile-close span:nth-child(1) {
		transform: rotate(-40deg);
		position: relative;
		left: 0px;
	}

	.tituloSecao,
	.tituloSecao h2 {
		font-size: 2.5rem !important;
	}

	.portfolio-detalhes {
		width: 80%;
	}

	.portfolio-detalhes .detalhes-container {
		width: 100% !important;
		line-height: 1.5rem;
	}

	.wrap {
		grid-template-columns: 1fr;
		align-items: center;
	}

	.wrap-img-area img {
		height: auto;
	}

	.wrap-img-area {
		display: none;
	}

	.wrap-img-area.mobile {
		display: block;
		margin-right: 0;
		margin-bottom: 20px;
	}

	.wrap-detalhes-area b {
		text-align: c;
	}
}

@media only screen and (max-width: 767px) {
	.boxes {
		grid-template-columns: 250px;
		justify-content: center;
		animation: none;
	}

	.titulo-slide p {
		color: #294d8c;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-moz-box-orient: vertical;
		-ms-box-orient: vertical;
		box-orient: vertical;
		-webkit-line-clamp: 3;
		-moz-line-clamp: 3;
		-ms-line-clamp: 3;
		line-clamp: 3;
		overflow: hidden;
	}

	.titulo-slide h5 {
		font-size: 1rem;
	}

	div#rodape {
		height: unset;
	}

	.assinaturasRodape {
		flex-direction: column;
	}

	.assinaturasRodape > div {
		margin-bottom: 15px;
		flex-direction: column;
	}

	.assinaturasRodape > div div {
		border-left: none !important;
		border-top: 2px solid #fff;
		padding-top: 20px;
	}

	.logos-container {
		flex-direction: column;
	}
	.wrap-tituloSecao {
		height: auto;
		margin-top: 20px;
	}
}
