@charset "utf-8";
/* CSS Document */
  
*{ margin:0 auto; padding:0; font-family:Arial, Helvetica, sans-serif}
a,body,input,p,ul{color:#000}a,abbr,acronym,address,applet,big,blockquote,body,caption,cite,code,dd,del,dfn,div,dl,dt,em,fieldset,figure,font,form,h1,h2,h3,h4,h5,h6,html,iframe,img,ins,kbd,label,legend,li,object,ol,pre,q,s,samp,small,span,strike,sub,sup,table,tbody,td,tfoot,th,thead,tr,tt,ul,var{margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;list-style:none}a,input,p,textarea,ul{font-family:Arial,Helvetica,sans-serif;font-size:12px}body{line-height:normal}table{border-collapse:separate;border-spacing:0}caption{text-align:left;font-weight:400}blockquote:after,blockquote:before,q:after,q:before{content:""}blockquote,q{quotes:"" ""}address{font-style:normal}
a{text-decoration:none}
img, iframe, object, embed, video{max-width:100%; height:auto;}
 
.centro{ max-width:1200px; width:100%; margin:0 auto; position: relative; }
.clear{ clear:both}
header, figure, section, aside, article, nav, footer {display: block;}
 
 
#header{height:252px; background: url(../img/bg/header.jpg) center top repeat-x; position:relative; float: left; width: 100%;}

.logo{ position: absolute; float: left; width: 335px; left: 50%; margin-left: -15%; top: 10px;}


/********************** Inicio Menu *******************************/
	
#menu{ height:54px; width:100%; float: left; left:0; top:196px; position:absolute; z-index:99; }
#menu ul {max-width:1120px; width:100%; margin:0 auto; text-align: center; display: block;}
#menu ul li{ float: left; height: 54px; position: relative;}
#menu ul li a{ font-size:16px; display: block; height: 54px; padding: 0px 10px; font-weight: 700; font-family: 'Raleway', sans-serif; line-height: 54px; color:#fff; text-transform: uppercase; } 
#menu ul li a:hover{ background: #0c4876; transition: all 0.6s; -moz-transition: all 0.6s; -o-transition: all 0.6s; -webkit-transition: all 0.6s;} 
.sep{width: 1px; background: url(../img/icones/sep.jpg) no-repeat center;}

 
/* Submenu */
#menu li ul {position: absolute; z-index:99999; top: 48px; left:0px; display: none; width:180px; background:#2986ce; margin-left:0px;}
#menu li ul li {font-size:12px; height:auto; width:180px; background:#2986ce; }
#menu ul li:hover > ul {display: block; }
#menu li ul li a{height:auto; line-height:20px; padding: 8px 10px; color:#FFF; font-size:12px; display:block; border-bottom:1px solid #186194;}

@media only screen and (min-width: 1200px) { 
#menu.nav-fixed {position: fixed; left: 0; top:0; z-index: 99999; background: #2488d4; }
#menu.nav-fixed ul{ display: block; margin: 0 auto; float: none;  }
#menu.nav-fixed ul ul{display: none;}

#menu.nav-fixed ul li a{ font-size:15px;}

}
/********************** Inicio Conteiner *******************************/

#conteiner {padding: 3em 0 1.5em 0; clear: both; background: url(../img/bg/conteiner.jpg) center top repeat-x;}
#conteiner p {line-height: 18px; font-size:14px;} 


#painel-home{display: block; clear: both; width: 100%;  } 


.colahome{float:left; width:70%;}
	.colahome img{float:left; width:30%;}
.colbhome{float:right; width:27%;} 

.boxe-home{ float:right; width:68%; height:auto; margin:0 0 2% 0; }
.boxe-home h2, .boxehome h2{ color:#0c4876; font-size:24px; margin-bottom:10px; font-weight: 700; text-transform: uppercase; font-family: 'Raleway', sans-serif;}
.boxe-home p, .boxehome p{ color: #0c4876; }
.boxehome{width: 100%;}
.boxehome img{margin-top: -45px;}

.home{padding: 15px; background: #f5f8fa; margin: 2em 0;}

.boxihome{float: left; width: 48%; padding-right: 1%;}
.boxihome img{float: left; margin: 0 10px 10px 0; border:3px solid #0c4876; border-radius: 50%; -o-border-radius: 50%; -webkit-border-radius: 50%;
-moz-border-radius: 50%; -webkit-transition: all 1s;
         -moz-transition: all 1s;
           -o-transition: all 1s;
              transition: all 1s;
      -webkit-transform-style: preserve-3d;
         -moz-transform-style: preserve-3d;
           -o-transform-style: preserve-3d;
              transform-style: preserve-3d;}
.boxihome a:hover img {-webkit-transform: rotateY( 180deg );
 -moz-transform: rotateY( 180deg );
   -o-transform: rotateY( 180deg );
      transform: rotateY( 180deg );
      border:3px solid #9a9a9a;}



.boxihome h3{color: #0c4876; text-transform: uppercase; margin-bottom: 15px; font-family: 'Raleway', sans-serif; font-weight: 700; font-size: 24px;}
.boxihome p{ font-family: 'Raleway', sans-serif; color: #0c4876;}

.bordarbottom{border-bottom: 2px dotted #b6c8d6; padding-bottom: 2%;}


.btn{ float: left; padding: 10px; clear: both; border:1px solid #57aae9; color: #0c4876; font-size:14px; margin-top: 10px; font-weight: 700;
 position: relative; z-index: 1; font-family: 'Raleway', sans-serif;}
.btn:hover{background: #0c4876; color: #fff; transition: all 0.6s; -moz-transition: all 0.6s; -o-transition: all 0.6s; -webkit-transition: all 0.6s;}


.carousel{float: left; width: 84%; padding: 2% 8%; background: url(../img/bg/carousel.jpg) no-repeat center top;}   
	.owl-prev, .owl-next{display: block; height: 42px; width: 42px; position: absolute; z-index: 200; text-indent: -9999px; top:30%; 
	background-image: url(../img/icones/arrows.png); background-repeat: no-repeat;}
	.owl-prev {background-position: 0 -35px; left: -40px; }
	.owl-next  {background-position: -48px -35px; right: -40px; }
	.owl-item {background: #fff; text-align: center;} 


/*---------------------- Formulários --------------------*/
#form {width: 50%; float: left; padding: 0px 0 0 0; margin-bottom: 25px;}
#form label{display: block; float: left; padding: 0 0 16px 0; min-height: 50px; font-family: Arial, sans-serif; width: 100%;}
#form input,#form textarea{background: #fff; border: 1px solid #509dd9; height: 29px; font-size:14px; padding: 5px; }
#form label.medio {width: 48% ;}
#form .lr {float: right;}
#form label span { display: block; padding: 0 0 3px 0; font-size: 16px; color:#1a537e; font-family: 'franklin', Arial, sans-serif;  }
#form input[type=text],#form input[type=file],#form textarea ,
#form input[type=email], #form input[type=tel] { width: 100%; }
#form textarea{ height:125px; }
#form input[type=submit]{ cursor:pointer; background:#0f5489; color:#fff; border:none; font-family: 'franklin', Arial, sans-serif; 
width: 100px; font-size:16px; height:52px; float:left; text-transform:uppercase}
#form input[type=submit]:hover{background:#082f4e;}

#form .medio input{width: 100%;}
#form .medio input[type=radio]{width: 20px; height: 20px; vertical-align: bottom;}
#form small {margin-right: 15px; padding-top: 10px; display: inline-block;}
#form label div{float: left; width: 300px;}
#form label div small{display: block;}
#form label div input{vertical-align: middle;}

.captcha{float: left; margin-right: 5px; padding: 7px; border:1px solid #ccc;}
#captcha{width: 160px !important; float: left;}

#mapa{
	float: right;
	width: 100%;
	margin:0 0 20px auto;
	height: 300px;
	border: 1px solid #509dd9;
}

.ico-fone{
	background: url(../img/icones/telefone.png) no-repeat center;
	background-size: 60%;
	width: 30px;
	height: 30px;
	float: left;
	margin-left: -45px;
	border-radius: 50%;
	margin-right: 10px;
	border:1px solid #217abe;
}

.contato {
	width: 45%;
	float: right;
	margin-top: 20px;
}
.contato p{
	color: #0c4876;
	font-size: 16px !important;
	border-bottom: 1px solid #93d0ff;
	margin-bottom: 10px;
	padding-bottom: 5px;
	padding-left: 45px;
	line-height: 22px !important; 
}

.contato p:last-of-type{
	border: none;
}

.contato p b{
	font-size: 18px;
}
 

/*Footer Rodapé*/
#footer{ background:#0b416b url(../img/bg/footer.jpg) repeat-x top center; height:auto; color:#FFF; clear: both; padding: 60px 0 10px 0; } 
#footer address{ display: block; text-align: center; font-size:14px; line-height: 22px; margin-bottom: 10px;} 

.pratica {background: url(../img/pratica.png) no-repeat left top; float:right;height: 19px;width: 65px; clear: both;}
 

/********************** Inicio Interna *******************************/
.main{min-height: 350px;}
	.main p{margin-bottom: 25px;}

.content {float: left; width: 62%; }
.content p {color: #0c4876; margin: 0 0 20px;}
.side {float: right; width: 34%;}

.tt {color: #0c4876; font-size: 28px;  font-family: 'Raleway', sans-serif; text-transform: uppercase; margin: 0 0 30px; font-weight: bold;}
.tt-home {color: #0c4876; font-size: 26px; font-family: 'Raleway', sans-serif; text-transform: uppercase; margin: 0 0 30px; font-weight: bold; 
background: url(../img/icones/tt-home.jpg) no-repeat center; text-align: center;}
.tt img {vertical-align: middle;}
.topic {color: #0c4876;  font-family: 'Raleway', sans-serif; margin: 0 0 8px; font-weight: bold;}

.list li {list-style-image: url(../img/bullet.png); color: #217abe; font-size: 14px; line-height: 18px; margin: 0 0 6px 40px;}
.list li span {font-size: 12px;}

.list li a {color: #217abe; font-size: 14px; line-height: 18px}
.list li a:hover {text-decoration: underline;}

/* Area atuação */
.area-atuacao {float: left; margin: 0 20px 0 0;}
.txt-areaatuacao {padding: 60px 0 0;}

/* Produtos */
.col-1-3 {float: left; width: 30%; margin: 0 1%;}
.large {float: none; width: auto;}
.fts-logistica img {margin: 0 20px 20px 0;}

/* Fabricação própria */
.area {
	padding: 3rem 0;
}

.area h2 {
	color: #0d274a;
	font-size: 50px;
	font-weight: bold;
	margin-bottom: 30px;
}

.area h2 span {
	font-size: 80px;
	color: #fff;
}

#conteiner .area p {
	color: #fff;
	font-size: 18px;
	line-height: 24px;
}

.area1 {
	background-color: #62caec;
}

.area2 {
	background-color: #478dec;
}

.area3 {
	background-color: #3f47f0;
}

.area-container {
	max-width:1200px; 
	width:100%; 
	margin:0 auto;
	display: flex;
	align-items: center;
	gap: 50px;
}

.area-texto,
.area-imagem {
	flex: 1;
}

.area-imagem {
	border-radius: 30px;
	padding: 0 50px 50px;
}

.area-imagem img {
	margin: -50px auto 0;
	display: block;
}

.area1 .area-imagem {
	background-color: #4fafcf;
}

.area2 .area-imagem {
	background-color: #306dc0;
}

.area3 .area-imagem {
	background-color: #262dc6;
}

.area h3 {
	font-weight: bold;
	margin-bottom: 15px;
	font-size: 18px;
}

.area1 .area-imagem h3,
.area1 .lista-tipos span {
	color: #173d49;
}

.area2 .area-imagem h3,
.area2 .lista-tipos span {
	color: #0d274a;
}

.area3 .area-imagem h3,
.area3 .lista-tipos span {
	color: #62caec;
}

.lista-tipos {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 30px;
	gap: 10px;
}

.lista-tipos li {
	flex: 1;
	font-weight: bold;
	color: #fff;
	font-size: 16px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 15px 0;
	border-radius: 10px;
}

.area1 .lista-tipos li {
	border: 2px solid #173d49;
}

.area2 .lista-tipos li {
	border: 2px solid #0d274a;
}

.area3 .lista-tipos li {
	border: 2px solid #62caec;
}


@media only screen and (max-width: 1200px) {
	.area-container {
	    padding: 0 20px;
	    box-sizing: border-box;
	}
}

@media only screen and (max-width: 900px) {
	.area-container {
	    flex-direction: column;
	}

	.area-imagem img {
		margin-top: 0;
		margin-bottom: 30px;
	}

	.area-imagem {
		padding: 40px 20px;
	}

	.lista-tipos li {
		flex: 0;
		flex-basis: 100%;
	}

	.area h2 {
		font-size: 25px;
	}

	.area h2 span {
		font-size: 40px;
	}


	#conteiner .area p {
		font-size: 16px;
	}
}


.contato-container {
	padding: 20px;
	text-align: center;
}

.contato-container a {
	background: linear-gradient(#4bbbdf, #62caec, #4bbbdf);
	display: inline-block;
	padding: 20px;
	border-radius: 10px;
	font-size: 20px;
	font-weight: bold;
}

/* Politica Ambiental */
.politica-ambiental {float: left; margin: 0 20px 0 0; border: 3px solid #ccc; border-radius: 50%;}
.txt-politica-ambiental {padding: 70px 0 0;}

/* Localização */
.map {border: 3px solid #217abe;}
.map iframe {display: block; width: 100%; height: 400px;}

/********************** Classes úteis *******************************/
.bt-efeito:hover {opacity: 0.80; -moz-opacity: 0.80; -webkit-opacity: 0.80; -o-opacity: 0.80; filter: alpha(opacity=80);}
.visuallyhidden{border: 0;clip: rect(0 0 0 0);height: 1px;margin: -1px;overflow: hidden;padding: 0;position: absolute;width: 1px}
p.error {margin: 0; padding: 0;  color: #f00; font-size: 10px;}
#dp_swf_engine {display:none;}
#fb-root {display: none;}
.fb_iframe_widget, .fb_iframe_widget span, .fb_iframe_widget span iframe[style] {width: 100% !important;}#header .maia-teleport { height:1px; left:-10000px; overflow:hidden; position:absolute; top:auto; width:1px} [dir=rtl] #maia-header .maia-teleport {left:auto; right:-10000px} #header .maia-teleport:active,#header .maia-teleport:focus,#header .maia-teleport:hover {background:#f9edbe; border:1px solid #f0c36d; -moz-border-radius:2px;
-webkit-border-radius:2px; border-radius:2px; -moz-box-shadow:0 2px 4px rgba(0,0,0,.14); -webkit-box-shadow:0 2px 4px rgba(0,0,0,.14); box-shadow:0 2px 4px rgba(0,0,0,.14);
height:auto; left:0; margin:5px auto; max-width:180px; padding:6px; right:0; text-align:center;	width:auto;	z-index:3} 



.barratopo{display:none} 
.pull {display: none; background: url(../img/icones/pull.png) no-repeat right top; width: 36px; height: 36px; margin-right: 20px; }
@media only screen and (max-width: 1200px) {
	 #conteiner, #home{padding:1%; } 
	.pull {display: block; float: right; padding: 0 40px 0 0; }
	.bgplb {background: url(../img/icones/pull.png) no-repeat right bottom; width: 36px; height: 36px; margin-right: 20px; float: right; padding: 0 40px 0 0;}  
	.off-canvas {left: 0 !important;}
	#menu {background: #0c4876; position: fixed; left: -100%; top: 0;  z-index: 99999; width: 200px; height: 100%; overflow-y: scroll; overflow-x: hidden;transition-property: left; transition-duration: 0.5s; transition-timing-function:  ease-in-out; margin: 0;}
	#menu ul li {width: 200px; display: block; float: none; height: auto; border-bottom:1px solid #2783d1;}
	#menu ul li a {text-align: left; color: #fff; font-size: 1.2em; text-indent: 0px; width: auto; height: auto; line-height: 36px; padding: 0 0 0 10px; } 
	#menu ul li.sep,#menu img{display: none;} 
	#menu ul li ul{position:relative; top:0px; margin:0px; }
	#menu span{display: block;} 
	.barratopo{position:fixed; display: block; left: 0; top: 0; padding: 0; width: 100%; height: 35px; z-index:99999; background: #0c4876; border-bottom:1px solid #2783d1;}	
	.barratopo p{color: #fff; position: absolute; z-index: 99999; line-height:35px; right: 60px; font-size:14px;}
	.barratopo span {color: #fff; position: absolute; z-index: 99999; line-height:35px; left: 10px; font-family:Arial, Helvetica, sans-serif; font-size:14px;}

	#header{margin-top: 35px; padding: 0 1%; width: 98%; }
	.carousel{width: 80%; display: block; margin: 0 auto; float: none; background: none;}
	#footer{padding: 60px 20px 10px 20px;}
	#conteiner {padding: 1.5em 20px;}
	.colahome img{display: none;}
	.logo{margin: 0 auto; width: 335px; left: auto; float: none; display: block; position: relative;}
	#header { height: 210px; }
	.boxe-home{width: 100%; float: left;}
	.colahome{width: 60%;}
	.colbhome{width: 38%;}
} 

/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (max-width: 767px) {
#form{width:97%}
#form textarea, #form label,#form input[type=file],#form input[type=email], #form input[type=tel], #form input[type=text]{width:100% !important; } 
#form input[type=submit]{width:100px !important; }	
 .boxehome img{display: none;}

.boxe-home{width: 98%; min-height: 50px; margin-bottom: 2em;}
 #painel-home{display: none;}
 .colahome, .colbhome, .side, .contato{width: 100%; float: left;} 

 .boxihome img{display: block; margin: 0 auto 10px auto; float: none; max-width: 80%;}
 .boxihome {text-align: center;}

	.content {float: none; width: auto;}
 .vh {display: none;}
 .area-atuacao,
 .politica-ambiental {width: 150px;}
 .txt-areaatuacao,
 .txt-politica-ambiental {padding: 20px 0 0;}
 .col-1-3 {float: none; width: auto;}

 .map iframe {height: 300px;}

 #mapa{
 	width: 100%;
 	height: 300px;
 }
 }

	  
/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (max-width: 470px) {
	.boxihome {width: 100%; float: left; margin-bottom: 2em; text-align: left;}
	.boxihome img{float: left; width: 40%; margin: 0 10px 10px 0;}
	}