/************************************/

/* Criado por id3 Comunicação/2018 */

/************************************/

html, body {
    height: 100%;
    min-height: 100%;
}

body {
	.Regular;
	font-size: 16px;
	color:@preto;
}


/* Opções de Posicionamento */
.fLeft { float:left; }
.fRight { float:right; }
.clearfix { clear: both; }

/* Esquema de cores */
@vermelho: #f65d4c;
@azul: #1a2e3b;
@verde: #27ae60;
@laranja: #ff8400;
@preto: #142530;
@cinza:#a9b1bc;
@cinza_claro:#ccd0d9;
@fundo: #eeeeee;
.fundoteste { background-color:rgba(0,0,0,0.15); }
*::selection { background: lighten(@preto, 30%); }
*::-moz-selection { background: lighten(@preto, 30%); }

/************ Fontes */

@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,700');

.Light { font-family:"Montserrat"; font-weight:300; }
.Regular { font-family:"Montserrat"; font-weight:400; }
.Bold { font-family:"Montserrat"; font-weight:700; }

.escondeTexto { text-indent:-9999px; }
.cursor { cursor:pointer; }
.borda (@radius: 5px) {
	-webkit-border-radius: @radius;
	-moz-border-radius: @radius;
	-ms-border-radius: @radius;
	-o-border-radius: @radius;
	border-radius: @radius;
}
.limitaTexto {
	text-overflow: ellipsis;
	white-space: nowrap;
    overflow: hidden;
}
.boxSizing {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
.calc(@prop; @val) {
  @{prop}: calc(~'@{val}');
  @{prop}: -moz-calc(~'@{val}');
  @{prop}: -webkit-calc(~'@{val}');
  @{prop}: -o-calc(~'@{val}');
}

/* .calc(prop; "100% - 0px"); */

.btn {
	padding: 10px 24px;
	background: @azul;
	.borda;
	color: #fff;
	text-transform: uppercase;
	.Bold;
	text-align: center;
	border:none;
	.cursor;
	margin: 10px auto;
	font-size: 16px;
	.boxSizing;
	display: block;
}

.btnVaz {
	background: none;
	border: 3px solid #fff;
	padding: 7px 21px;
	&:hover {
		background: #fff;
		color: @azul;
	}
}

.btnNeg {
	background: #fff;
	color: @azul;
}

.btnSmall {
	padding: 5px 14px;
	font-size: 12px;
}

/* Grid sizes */

.grid1 {
	width: 40px;
	@media only screen and (min-width : 1200px) { width: 55px; }
}
.grid2 {
	width: 100px;
	@media only screen and (min-width : 1200px) { width: 130px; }
}
.grid3 {
	width: 160px;
	@media only screen and (min-width : 1200px) { width: 205px; }
}
.grid4 {
	width: 220px;
	@media only screen and (min-width : 1200px) { width: 280px; }
}
.grid5 {
	width: 260px;
	@media only screen and (min-width : 1200px) { width: 355px; }
}
.grid6 {
	width: 340px;
	@media only screen and (min-width : 1200px) { width: 430px; }
}
.grid7 {
	width: 400px;
	@media only screen and (min-width : 1200px) { width: 505px; }
}
.grid8 {
	width: 460px;
	@media only screen and (min-width : 1200px) { width: 580px; }
}
.grid9 { 
	width: 520px;
	@media only screen and (min-width : 1200px) { width: 655px; }
}
.grid10 { 
	width: 580px;
	@media only screen and (min-width : 1200px) { width: 730px; }
}
.grid11 {
	width: 640px;
	@media only screen and (min-width : 1200px) { width: 805px; }
}
.grid12 {
	width: 700px;
	@media only screen and (min-width : 1200px) { width: 880px; }
}
.grid13 {
	width: 760px;
	@media only screen and (min-width : 1200px) { width: 955px; }
}
.grid14 {
	width: 820px;
	@media only screen and (min-width : 1200px) { width: 1030px; }
}
.grid15 {
	width: 880px;
	@media only screen and (min-width : 1200px) { width: 1105px; }
}
.grid16 {
	width: 940px;
	@media only screen and (min-width : 1200px) { width: 1180px; }
}



/*****##########################  SETUP DE COLUNAS  */

.cols-2 {
	display: flex;
	justify-content: center;
	.col {
		width: 50%;
		&[data-col="img"] { .fundoteste; }
		&[data-col="conteudo"] {
			padding: 60px 0;
			.boxConteudo {
				.grid8;
				.boxSizing;
			}
		}
		&[data-pos="left"] {
			.boxConteudo {
				.fRight;
				padding-right: 50px;
				text-align: right;
			}
		}
		&[data-pos="right"] {
			.boxConteudo {
				.fLeft;
				padding-left: 50px;
			}
		}
	}
}



/** Big Bang **/

div { .boxSizing; }

.wrapper {
	width: 100%;
	min-width: 940px;
	.fLeft;
	@media only screen and (min-width : 1200px) { min-width: 1180px; }
}

.conteudo {
	h1, h2, h3 {
		.Light;
		margin-bottom: 10px;
	}
	h1 {
		font-size: 40px;
		letter-spacing: -2px;
	}
	h2 { font-size: 32px; }
	h3 { font-size: 24px; }
	h4 {
		font-size: 18px;
		.Bold;
		color: lighten(@preto, 35%);
	}
	p { margin-bottom: 10px; }
}

.boxConteudo {
	.grid16;
	margin: auto;
}

.vertPad { padding: 50px 0; }



/* ################################# HEADER */


header {
	display: flex;
	flex-direction:column;
	align-items: center;
	.boxConteudo {
		display: flex;
		align-items: center;
		justify-content: space-between;
		.trigger {
			width: 70px;
			height: 70px;
			.fRight;
			background: url(../imagens/abremenu.png) no-repeat  right center;
			margin: 0 30px 0 0;
			display: none;
			.cursor;

		}
		.logoPrincipal {
			width: 250px;
			height: 100px;
			.escondeTexto;
			background:url(../imagens/logoprincipal.png) no-repeat center;
			background-size: contain;
			.boxSizing;
			margin: 15px 0;
			min-width: 170px;
		}
		.menuPrincipal {
			display: flex;
			justify-content: flex-end;
			align-items: center;
			li {
				margin-left: 60px;
				a {
					text-transform: uppercase;
					color: @azul;
					font-size: 16px;
					transition: letter-spacing .3s ease;
					&:hover { letter-spacing: 2px; }
				}
			}
		}
		
	}
	.telefonesMenu {
		.fRight;
		.Regular;
		
		font-style: normal;
		padding-left: 35px;
		background: no-repeat left center;
		background-size: contain;
		font-size:25px;
		.Bold;
		margin-bottom:15px;
		
		
		background-image: url(../imagens/whatsapp.png);


	}
}


/* ################################# PÁGINA INICIAL */


.hero {
	.slideHero {
		background: no-repeat center;
		background-size: cover;

		height: 70vh;
    	position: relative;		
		.internoSlide {
			display: flex;
			align-items: center;
			justify-content: center;
			box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.1);
			width: 100%;
			height: 100%;
			position: absolute;
			z-index: 0 ;
			.boxConteudo {
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				h1 {
					font-size: 58px;
					.Bold;
					color: white;
					line-height: 58px;
					letter-spacing: -2px;
					margin-bottom: 20px;
				}
				.btn {
					.fLeft;
					background: white;
					padding: 17px 25px 15px 25px;
					margin-top:30px;
					.Regular;
					color: @preto;
					font-size: 18px;
					border: 4px solid white;
					transition: background-color .3s ease;
					&:hover {
						background: none;
						color: white;
					}
				}
			}
		}
		.bgHero {
			width: 100%;
			height: 100%;
			display: flex;
			overflow: hidden;
			position: absolute;
			z-index: -30 ;		
			background-size: cover;	
			.overlay{
				background: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.5) 100%); 
				width:100%;
				height: 100%;
				position: absolute;
			}	
			video {
				width: 100% !important;
				object-fit: cover;
				height: 100%;
			}
			img {
				width: 100%;
				object-fit: cover;
			}
		}
	}
}

.sustentabilidade {
	background: url(../imagens/2846377.v2.jpg) no-repeat left center;
	background-size: cover;
	.slideSustentabilidade {
		background: no-repeat center;
		background-size: cover;
		.internoSlide {
			height: auto;
			display: flex;
			align-items: center;
			justify-content: center;
			box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.1);
			.boxConteudo {
				padding:200px 0 100px 0;
				h1 {
					font-size: 35px;
					.Bold;
					line-height: 45px;
					letter-spacing: -2px;
					margin-bottom: 40px;
					text-align: center;
					color: white;
				}

				.dados {
					
					display: flex;
					justify-content: space-around;
					margin-bottom:60px;
					li {
						display: flex;
						flex-direction: column;
						text-align: center;
					
						span {
							font-size: 65px;
							.Bold;
							color: white;
							small {
								font-size: 35px;
								margin-left: -15px;
								
							}
						}
						small {
							text-transform: uppercase;
							margin-left:5px !important;
							color: white;
			
						}
					}
					
				}

				p {
					font-size: 15px;
					line-height: 15px;
					margin: 5px 0;
					text-align: center;
					color: white;
				}

				.btn {
					.fLeft;
					background: white;
					padding: 17px 25px 15px 25px;
					.Regular;
					color: @preto;
					font-size: 18px;
					border: 4px solid white;
					transition: background-color .3s ease;
					&:hover {
						background: none;
					}
				}
			}
		}
	}
}

.wrapper[data-bloco="introducaoHome"] {
	padding: 60px 0;
	.boxConteudo {
		text-align: center;
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-wrap: wrap;
		h2 {
			font-size: 32px;
			margin-bottom: 20px;
			width:100%;
		}
		.politica {
			width: 70%;
			h3 {
				font-size: 25px;
				margin-bottom: 20px;
				width:100%;
			}
			p {
				
				font-size: 20px;
				.Light;
				line-height: 30px;
			}
			.listaPolitica {
				margin-top:15px;
				li{
					list-style:circle;
					list-style-position: inside;
					padding:5px 0 ;
				}
			}
		}
		
		.img {
			width: 30%;
			height: 300px;
			background: no-repeat center;
			background-size: contain;
		}
	}
}

.wrapper[data-bloco="introducao"] {
	padding: 60px 0;
	.boxConteudo {
		text-align: center;
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-wrap: wrap;
		h2 {
			font-size: 32px;
			margin-bottom: 20px;
			width:100%;
		}
		p {
			width: 100%;
			font-size: 20px;
			.Light;
			line-height: 30px;
		}
		.img {
			width: 20%;
			height: 200px;
			background: no-repeat center;
			background-size: contain;
		}
	}
}


.wrapper[data-bloco="servicos"] {
	padding: 60px 0;
	background: @fundo;
	.boxConteudo {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		text-align: center;
		/*h2 {
			width: 100%;
			font-size: 18px;
			.Regular;
			text-transform: uppercase;
			letter-spacing: 4px;
			margin-bottom: 40px;
		}*/
		span {
			width: 2px;
			background: @fundo;
		}
		.itemServico {
			width:45%;
			display: flex;
			flex-direction: column;
			align-items: center;
			.img {
				width: 330px;
				height: 230px;
				background: no-repeat center;
				background-size: cover;
				.fundoteste;
				border-radius: 5px;
				margin-bottom: 10px;
			}
			h3 {
				font-size: 32px;
				margin-bottom: 15px;
				color: @azul;
			}
			p {
				font-size: 20px;
				.Light;
				color: @preto;
			}
		}
	}
}


.wrapper[data-bloco="processo"] {
	padding: 60px 0;
	background: @fundo;

	.boxConteudo {
		display: flex;
		flex-direction: column;
		border-radius: 5px;
		background-color: white;
		padding:60px;
		text-align: center;

		h2 {
			color:@azul;
			font-size: 25px;
			margin-bottom: 20px;
			.Bold;
		}
		
	
		.processoimagem {
			display: flex;
			justify-content: center;
			flex-wrap: wrap;
			text-align: center;
			
			
			.img {
				background-size: contain;
				background-repeat: no-repeat;
				background-position: center;
				width: 100px;
				border-radius: 5px;
				background-color: #fff;

			}
			.itensProcesso {
				padding:0 30px;
				ul {
					li {
						color: @azul;
						font-size: 18px;
						padding: 5px 0;

						display: flex;
						justify-content: flex-start;
						span {
							border-radius: 100%;
							background-color: @azul;
							color:white;
							padding:5px 10px;
							margin-right: 10px;
						}
						
					}
				}
			}
		}
	}
}

.wrapper[data-bloco="plantas"] {
	padding: 60px 0;
	background: @fundo;
	.boxConteudo {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		text-align: center;

		flex-direction: row;

		/*h2 {
			width: 100%;
			font-size: 18px;
			.Regular;
			text-transform: uppercase;
			letter-spacing: 4px;
			margin-bottom: 40px;
		}*/
		// span {
		// 	width: 2px;
		// 	background: @fundo;
		// }
		.itemPlanta {
			//.calc(width, '30% - 20px');
			width:30%;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			align-items: center;
			padding: 40px 0;


			.textoItemPlanta {
				display: flex;
				flex-direction: column;

				padding: 0 40px;
				
				
				h3 {
					font-size: 25px;
					margin-bottom: 5px;
					color: @azul;
					.Bold;
				}
				.conteudoPlanta {
					height: 120px;
					h4 {
						font-size: 22px;
						margin-bottom: 5px;
						color: @azul;
						.Bold;
					}
					p {
						font-size: 16px;
						.Light;
						color: @preto;
						span {
							.Bold;
						}
					}
				}
			}
			.img {
				width: 300px;
				height: 200px;
				background: no-repeat center;
				background-size: cover;
				border-radius: 5px;

			}

				
		}
	}
}

.wrapper[data-bloco="plantas2"] {
	padding: 0;
	background: @fundo;
	.boxConteudo {
		display: flex;
		justify-content: flex-start;
		flex-wrap: wrap;
		text-align: left;

		flex-direction: row;
		background-size: contain;
		background-repeat: no-repeat;
		background-position: right;

		.contatos {
			width:350px;
			margin: 0 15px;
			padding:60px 0;
			float:left;
		
			display: flex;
			justify-content:flex-start;
			align-items: flex-start;
			flex-wrap: wrap;
			
			h3 {
				width:100%;
				padding-left: 30px;
				font-style: normal;
				color: @azul;
				margin: 15px;
				.Bold;
				img {
					width:35px;
					border-radius: 5px;
					margin-right: 15px;
				}
			}
			address, p {
				color:@azul;
				font-style: normal;
				padding-left: 30px;
				background: no-repeat left center;
				background-size: contain;
				margin: 15px;
				a {
					color: @azul;
				}
				&[data-icon="local"] { background-image: url(../imagens/local-escuro.svg); height:20px; }
				&[data-icon="telefone"] { background-image: url(../imagens/telefone-escuro.svg); height:20px; }
				&[data-icon="whatsapp"] { background-image: url(../imagens/whatsapp-escuro.svg);height:20px;  }
				&[data-icon="mail"] { background-image: url(../imagens/mail-escuro.svg); height:20px; }
			}
		}
	}
}


.wrapper[data-bloco="capacidadeprodutiva"] {
	background: @preto;
	padding: 28px 0;
	.boxConteudo {
		text-align: center;
		display: flex;
		flex-wrap: wrap;
		.tabelaCapacidade {
			background: white;
			box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1);
			display: flex;
			flex-wrap: wrap;
			padding: 20px 0;
			justify-content: center;
			li {
				width: 40%;
				display: flex;
				flex-direction: column;
				padding: 10px 0;
				span { font-size: 18px; }
				strong {
					.Bold;
					font-size: 28px;
				}
			}
		}
		a {
			width: 100%;
			color: white;
			margin-top: 25px;
			&:after {
				content: "››";
				margin-left: 10px;
			}
		}
	}
}


.wrapper[data-bloco="estatisticas"] {
	//background: @azul;
	padding: 35px 0 25px 0;
	* { color: white; }
	.infoestatisticas {
		display: flex;
		justify-content: space-around;
		li {
			display: flex;
			flex-direction: column;
			text-align: center;
			span {
				font-size: 65px;
				.Bold;
				small {
					font-size: 35px;
					margin-left: -15px;
				}
			}
			small {
				text-transform: uppercase;
				margin-left:5px !important;

			}
		}
	}
}


.wrapper[data-bloco="fotos"] {
	background: @azul;
	.slide {
		.internoSlide {
			height: 300px;
			padding: 12px 6px;
			display: flex;
			justify-content: space-between;
			.img {
				flex-grow:1;
				margin: 0 6px;
				background: no-repeat center;
				background-size: cover;
			}
		}
	}
}


.wrapper[data-bloco="mapa"] {
	display: flex;
	flex-direction: row;
	.planta {
		width: 50%;
		height: 450px;
		text-align: center;
		h2 {
			font-size: 25px;
			margin-bottom: 5px;
			color: @azul;
			padding:20px 0;
			.Bold;
		}
		&:first-child {
			border-right:1px solid @azul;
		}
		&:last-child {
			border-left:1px solid @azul;
		}
	}
	iframe {
		width: 100%;
		height: 380px;
	}
}


/* ################################# RODAPÉ */


footer {
	background: @preto;
	padding: 15px 0 10px 0;
	display:flex;
	flex-direction: column;
	
	.boxConteudo {
		.contatosFooter {
			width:32%;
			float:left;
			display: flex;
			justify-content: space-between;
			flex-wrap: wrap;
			h3 {
				width:100%;
				padding-left: 30px;
				font-style: normal;
				color: white;
				margin: 15px;
				.Bold;
			}
			address, p {
				color: white;
				font-style: normal;
				padding-left: 30px;
				background: no-repeat left center;
				background-size: contain;
				margin: 15px;
				a {
					color: white;
				}
				&[data-icon="local"] { background-image: url(../imagens/local.svg); height:25px; }
				&[data-icon="telefone"] { background-image: url(../imagens/telefone.svg); }
				&[data-icon="whatsapp"] { background-image: url(../imagens/whatsapp.svg); }
				&[data-icon="mail"] { background-image: url(../imagens/mail.svg); }
			}
		}
		
		.linksTermos {
		    width:100%;
		    text-align:center;
		    padding:20px 0;
		    li{
		        padding:10px 0;
		        a {
    		        color: white;
    		        
    		    }
		    }
		    
		}

		.desenvolvedor {
			width:100%;
			float:right;

			.logocubi {
				width: 50px;
				height: 50px;
				float:right;
				.escondeTexto;
				background: url(../imagens/logocubi.png) no-repeat right center;
				background-size: 30px;
			}
		}
	}
}


/* ################################# PÁGINAS INTERNAS */


.tituloPagina {
	background: @preto;
	padding: 30px 0;
	text-align: center;
	h1 {
		font-size: 32px;
		.Bold;
		color: white;
	}
}

.capaPagina {
	background: no-repeat center;
	background-size: cover;
	.boxConteudo {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 350px;
		span {
			padding: 20px;
			color: white;
			border: 5px solid white;
			font-size: 28px;
			text-transform: uppercase;
			letter-spacing: 3px;
			line-height: 38px;
			strong {
				font-size: 48px;
				letter-spacing: 0;
			}
		}
		p {
			font-size: 24px;
			margin-left: 40px;
			width: 50%;
			color: white;
			text-align: right;
		}
	}
}



/* ################################# INSTITUCIONAL */



.wrapper[data-bloco="fotosinstitucionais"] {
	padding: 0 30px 50px 30px;
	display: flex;
	justify-content: space-between;
	.img {
		height: 300px;
		flex-grow: 1;
		margin: 0 30px;
		background: no-repeat center;
		background-size: cover;
		.borda(10px);
	}
}


.wrapper[data-bloco="valores"] {
	padding: 0 0 40px 0;
	.boxConteudo {
		h2 {
			text-align: center;
		}
		.listaValores {
			width: 100%;
			.fLeft;
			padding-top: 30px;
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			li {
				border: 1px solid @cinza;
				.borda(25px);
				font-size: 18px;
				.Light;
				padding: 15px 20px;
				margin: 0 15px 15px 15px;
			}
		}
	}
}

.wrapper[data-bloco="missaovisao"] {
	padding: 50px 0;
	background: @fundo;
	.boxConteudo {
		display: flex;
		justify-content: space-between;
		li {
			.calc(width, '33.3% - 20px');
			h3 {
				font-size: 22px;
				margin-bottom: 10px;
			}
			p {
				font-size: 14px;
				line-height: 24px;
				margin-bottom: 10px;
			}
		}
	}
}


/* ################################# SERVIÇOS */

.paginaServicos {
	padding: 50px 0;
	.boxConteudo {
		.menuServicos {
			width: 100%;
			.fLeft;
			margin-bottom: 40px;
			display: flex;
			justify-content: center;
			li {
				a {
					padding: 10px 40px;
					border:1px solid @cinza_claro;
					display: flex;
					justify-content: center;
					align-items: center;
					.img {
						width: 100px;
						height: 100px;
						.borda(50%);
						margin-right: 15px;
						background: no-repeat center;
						background-size: cover;
					}
					span {
						color: @preto;
						font-size: 20px;
					}
				}
				&[aria-selected="true"] a {
					background: @fundo;
				}
				&:first-of-type a { .borda(10px 0 0 10px); border-right: none; }
				&:last-of-type a {
					border-left: none;
					.borda(0 10px 10px 0);
				}
			}
		}
		.abaServico {
			width: 100%;
			.fLeft;
			.introServico {
				display: flex;
				align-items: stretch;
				justify-content: space-between;
				.img {
					width: 35%;
					flex-shrink: 0;
					margin-right: 40px;
					background: no-repeat center;
					background-size: cover;
					.borda;
				}
				.desc {
					padding: 30px 0;
					h2 {
						font-size: 24px;
						margin-bottom: 15px;
					}
					p {
						line-height: 26px;
						margin-bottom: 15px;
					}
				}
			}
			.vantagemServico {
				width: 100%;
				.fLeft;
				margin-top: 50px;
				display:flex;
				flex-direction: column;
				justify-content: center;

				h3 {
					font-size: 18px;
					.Bold;
					margin-bottom: 10px;
				}
				p {
					line-height: 26px;
					font-size: 14px;
					margin-bottom: 10px;
				}
				img {
					width:33%;
					height:auto;
					border-radius: 5px;
					margin:0 5px;
				}
			}
			.vantagemServicoFotos {
				width: 100%;
				.fLeft;
				margin-top: 50px;
				display:flex;
				justify-content: center;

				img {
					width:33%;
					height:auto;
					border-radius: 5px;
					margin:0 5px;
				}
			}
			.galeriaServico {
				width: 100%;
				.fLeft;
				border:1px solid red;
				span {
					width: 100%;
					.fLeft;
					background: no-repeat center;
					background-size: cover;
					.borda;
					border:1px solid red;
					img {
						width: 100%;
						.fLeft;
						.borda;
						padding:2px;

					}
					span {
						width:100%;
						.fLeft;
					}
				}
			}
		}
		.abaServicoCentrifuga {
			width: 100%;
			.fLeft;
			.introServico {
				// width:100%;
				// .fLeft;

				display: flex;
				align-items: stretch;
				justify-content: space-between;
				.img {
					width: 35%;
					flex-shrink: 0;
					margin-right: 40px;
					background: no-repeat center;
					background-size: cover;
					.borda;
				}

				
				.desc {
					padding: 30px 0;
					width:100%;
					.fLeft;
					h2 {
						font-size: 24px;
						margin-bottom: 15px;
					}
					p {
						line-height: 26px;
						margin-bottom: 15px;
					}
				}
			}
			.galeriaServico {
				width: 100%;
				.fLeft;
				margin-top:20px;
				
				span {
					width: 24%;
					.fLeft;
					background: no-repeat center;
					background-size: cover;
					.borda;
					margin-right:7px;

					
					img {
						width: 100%;
						.fLeft;
						.borda;
						padding:2px;

					}
					span {
						width:100%;
						.fLeft;
					}
				}
			}
		}
	}
}

/* ################################# SUSTENTABILIDADE */

.paginaSustentabilidade {
	padding: 50px 0;
	.boxConteudo {
		.menuSustentabilidade {
			width: 100%;
			.fLeft;
			margin-bottom: 40px;
			display: flex;
			align-items: stretch;
			li {
				display: flex;
				align-items: stretch;
				a {
					padding: 10px 40px;
					border:1px solid @cinza_claro;
					display: flex;
					align-items: center;
					.img {
						width: 100px;
						height: 100px;
						.borda(50%);
						margin-right: 15px;
						background: no-repeat center;
						background-size: cover;
					}
					span {
						color: @preto;
						font-size: 20px;
					}
				}
				&[aria-selected="true"] a {
					background: @fundo;
				}
				&:first-of-type a { .borda(10px 0 0 10px); border-right: none; }
				&:last-of-type a {
					border-left: none;
					.borda(0 10px 10px 0);
				}
			}
		}
		.abaSustentabilidade {
			width: 100%;
			.fLeft;
			.introSustentabilidade {
				display: flex;
				align-items: stretch;
				justify-content: space-between;
				padding:50px 0;
				.img {
					width: 35%;
					height: 450px;
					flex-shrink: 0;
					margin: 0 40px;
					background: no-repeat center;
					background-size: cover;
					.borda;
				}
				.desc {
					padding: 30px 0;
					h2 {
						font-size: 24px;
						margin-bottom: 15px;
						.Bold;
					}
					h3 {
						font-size: 24px;
						margin-bottom: 15px;
					}
					p {
						line-height: 26px;
						margin-bottom: 15px;
					}
					ul {
						
						li {
							display: list-item;
							list-style-position: outside;
							list-style: circle !important;
							
						}
					}
					
					.valores {
						display:flex;
						flex-direction: row;
						border-radius: 5px;
						background-color: #f7f6f6;
						padding:15px;
						.itemValores {
							display:flex;
							flex-direction: column;
							align-items: center;
							text-align: center;

							.icone {
								width: 50px;
								height: 70px;
								background-size: contain;
								background-repeat: no-repeat;
								background-position: center;
								margin-bottom:15px;
							}
							h3 {
								color:@azul;
								.Bold;
								margin-bottom:15px;
								
							}
							p {
								font-size:12px;
								line-height: 15px;
							}
						}
					}
					
				}

				
				
			}
			.vantagemSustentabilidade {
				width: 100%;
				.fLeft;
				margin-top: 50px;
				display:flex;
				flex-direction: column;
				justify-content: center;

				h3 {
					font-size: 18px;
					.Bold;
					margin-bottom: 10px;
				}
				p {
					line-height: 26px;
					font-size: 14px;
					margin-bottom: 10px;
				}
				img {
					width:100%;
					height:auto;
					border-radius: 5px;
					margin:0 5px;
				}

				
			}
			.vantagemSustentabilidadeFotos {
				width: 100%;
				.fLeft;
				margin-top: 50px;
				display:flex;
				justify-content: center;

				img {
					width:33%;
					height:auto;
					border-radius: 5px;
					margin:0 5px;
				}
			}

			ul {
				
				li {
					width: 100%;
					display: flex;
					flex-direction: column;
					padding: 10px 0;
					font-size: 15px;


					
					
				}
			}
			
		}
	}
}



/* ################################# ORÇAMENTO/CONTATO */


.formularioContato {
	padding: 50px 0;
	.boxConteudo {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		h2, h3 {
			width: 100%;
			text-align: center;
		}
		h2 {
			font-size: 18px;
			a {
				.Bold;
				color: @preto;
			}
		}
		h3 {
			display: flex;
			justify-content: center;
			align-items: center;
			margin: 15px 0 30px 0;
			font-size: 14px;
			span {
				width: 5px;
				margin-right: 10px;
				height: 5px;
				background: @vermelho;
				.borda(50%);
			}
		}
		p {
			width:100%;
			padding:10px 0;
		}
		form {
			width: 60%;
			display: flex;
			flex-wrap: wrap;

			fieldset {
				width: 100%;
				margin-bottom: 10px;
				label {
					width: 210px;
					font-size: 14px;
					justify-content: flex-end;
					align-items: center;
					display: flex;
					.fLeft;
					height: 50px;
					span {
						width: 5px;
						margin-left: 10px;
						height: 5px;
						background: @vermelho;
						.borda(50%);
					}
				}
				input, textarea, select {
					padding: 13px 20px;
					.Regular;
					flex-grow: 1;
					color: @preto;
					.borda;
					.calc(width, '100% - 280px');
					.fRight;
					border:1px solid lighten(@cinza, 5%);
					font-size: 18px;
				}
				select {
					.calc(width, '100% - 237px');
				}
				textarea {
					font-size: 16px;
					resize: vertical;
				}
			}
		}
	}
}

.mapaContato {
	iframe {
		.fLeft;
		width: 100%;
		height: 350px;
	}
}


.abaTrabalhe {
	width: 100%;
	.fLeft;
	.introTrabalhe {
		display: flex;
		align-items: stretch;
		justify-content: space-between;
		padding: 50px 0;
		.img {
			width: 450px;
			height: 250px;
			flex-shrink: 0;
			margin: 0 40px;
			background: no-repeat center;
			background-size: cover;
			.borda;
		}
		.desc {
			padding: 30px 0;
			h2 {
				font-size: 24px;
				margin-bottom: 15px;
				.Bold;
			}
			h3 {
				font-size: 24px;
				margin-bottom: 15px;
			}
			p {
				line-height: 26px;
				margin-bottom: 15px;
			}
			a {
				width: 100% !important;
				padding:10px;				
				text-transform: uppercase;
				color: white;
				font-size: 16px;
				background-color: @preto;
				border-radius: 5px;
				.boxSizing;
			}
			
			
		}

		
		
	}
}



/* ################################# SECTION */
/* ################################# SECTION */



/* ################################# RESPONSIVO */

@media only screen and (max-width : 1300px) {
	//header { border-top: 2px solid yellow; }
}

@media only screen and (max-width : 1040px) {
	//header { border-top: 2px solid blue; }
	.wrapper {
		min-width: 0;
		.boxConteudo {
			min-width: 0;
			width: 100%;
			padding-left: 30px;
			padding-right: 30px;
			.boxSizing;
			.menuPrincipal {
				li {
					margin-left: 10px;
				}
			}
		}
	}
}

@media only screen and (max-width : 768px) {
	//header { border-top: 2px solid red; }
}

@media only screen and (max-width : 570px) {
	//header { border-top: 2px solid purple; }
}




.antiBot {
	visibility: hidden;
	width: 0 !important;
	height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden;
	float:left;
}

.validate .invalid { border:1px solid #c21212 !important; }
.validate .valid {   border:1px solid #0cb169 !important; }

.emailEnviado {
	width: 100%;
	.fLeft;
	.fundoteste;
	padding:10px 20px 10px 60px;
	margin: 20px 0;
	background: url(../imagens/confirmar.png) no-repeat 15px center lighten(@verde, 50%);
	background-size: 30px 30px;
	border: 1px solid lighten(@verde, 35%);
	.borda;
	.boxSizing;
	line-height: 26px;
	text-align: center;
	span { color: @verde; }	
	small {
		width: 100%;
		.fLeft;
		font-size: 14px;
		color: @cinza;
		margin-top: 5px;
		line-height: 20px;
	}
}

.dadosIncorretos {
	width: 100%;
	.fLeft;
	line-height: 26px;
	.boxSizing;
	padding:10px 20px 10px 60px;
	margin: 20px 0;
	background: url(../imagens/erro.png) no-repeat 15px center lighten(@vermelho, 32%);
	background-size: 30px 30px;
	border: 1px solid lighten(@vermelho, 10%);
	.borda;
	color: @vermelho !important;
	text-align: center;
	small {
		width: 100%;
		.fLeft;
		font-size: 14px;
		color: @cinza;
		margin-top: 5px;
		line-height: 20px;
		a {
			color: @vermelho;
			text-decoration: underline;
		}
	}
}

.grecaptcha-badge {
	opacity: 0;
    margin-bottom:100px;
}

.flutuanteLateral {
	position: fixed;
	.fundoteste;
	z-index: 999;
	display: flex;
	right: 0;
	top: 40%;
	flex-direction: column;
	width: 50px;
	.borda(10px 0 0 10px);
	overflow: hidden;
	box-shadow: -1px 1px 5px rgba(0,0,0,0.25);
	.whatsapp {
		width: 100%;
		height:65px;
		background: @azul;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 32px;
		color: white;
	}
	.redesSociais {
		width: 100%;
		background-color:#fff;
		padding: 10px 0;
		z-index:998;
		display: flex;
		align-items: center;
		flex-direction: column;
		a {
			width: 35px;
			height: 35px;
			color:@azul;
			font-size:25px;
			text-align:center;
		}
		

	}
}


.wrapper[data-bloco="termos"] {
	padding: 60px 0;
	.boxConteudo {
		text-align: justify;
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-wrap: wrap;
		h1 {
			font-size: 32px;			
			padding:20px 0;
			width:100%;
			.Bold;
		}
		h2 {
			font-size: 24px;
			width:100%;
			.Bold;
			padding:20px 0;
		}
		h3 {
			font-size: 24px;
			width:100%;
			.Bold;
			padding:20px 0;
		}
		p {
			width: 100%;
			font-size: 20px;
			.Light;
			line-height: 30px;
		}
		.img {
			width: 20%;
			height: 200px;
			background: no-repeat center;
			background-size: contain;
		}
	}
}

.popoup-cookie {
	display:none;
	background: white;
	position: fixed;
	bottom: 0;
	left: 0;	
	width: 100%;
	height:auto;	
	//box-shadow: 2px 2px 30px 0 rgb(0 0 20 / 10%);
}

.popoup-cookie .inner {
	width: 100%;
	padding: 10px;
	display:flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
}

.popoup-cookie .inner p {
	width:80%;
	line-height: 34px;
}

.popoup-cookie .inner .actions {
	width: 20%;
}

.popoup-cookie .inner .actions .btn {
    margin: 0 auto;
    padding: 10px;
    max-width: 110px;
    background: #007edb;
    color: #fff;
    font-size: 14px;
    text-align: center;
    text-transform: uppercase;
    line-height: 24px;
    cursor: pointer;
    border-radius: 5px;
}

@import url(../estilos/responsivo.less);