@charset "utf-8";
/*!
 * CSS3
 * FRAMEBASE v1 (http://www.dudacaletti.com.br)
 * Copyright 2014
 * No Licensed
 * Developer: Eduardo Petry Caletti
 * E-mail: contato@dudacaletti.com.br
 */

 
/* ==========================================================================
   //// OBSERVAÇÕES GERAIS
   
   - OBS 1: #000 será a cor padrão para todos os seletores.
   - OBS 2: O posicionamento padrão dos objetos será left.
   - OBS 3: Esse CSS será derivado para templates.
   
   
   //// OBSERVAÇÕES HTML 5 E CSS3
      
   - HEADER: define o cabeçalho.
   
   - NAV: define o menu ou a navegação do site.
   
   - ARTICLE: define uma parte da página que tem uma composição de formulários, 
   textos etc. Por exemplo, pode ser um post de forum, blog, comentários etc.
   
   - SECTION: define uma seção do layout em um determinado element. Ele pode
   conter um header e também um footer se preciso.
   
   - ASIDE: consiste em envolver informações que tem algo a ver com o conteúdo
   principal do site. Pode ser um menu lateral, um sidebar padrão com menu, 
   banner, busca etc.
   
   - FOOTER: define o rodapé do elemento ou do layout.
   ========================================================================== */


/* ==========================================================================
   *
   ========================================================================== */
	*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
/* ==========================================================================
   end *
   ========================================================================== */





   
/* ==========================================================================
   HTML
   ========================================================================== */
	html { font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
/* ==========================================================================
   end HTML
   ========================================================================== */






/* ==========================================================================
   BODY
   ========================================================================== */
	body { margin: 0; padding: 0; font: Arial; }
	html, body { height:100%; }
/* ==========================================================================
   end BODY
   ========================================================================== */


		@font-face {
		    font-family: Avenir-Black;
		    src: url('../fonts/Avenir-Black.ttf');
		}
		@font-face {
			font-family: Avenir-Roman;
		    src: url('../fonts/Avenir-Roman.ttf');
		}
   		@font-face {
			font-family: Avenir-Next;
		    src: url('../fonts/AvenirNext-Medium.ttf');
		}



/* ==========================================================================
   SELETORES
   ========================================================================== */

    h1, h2, h3, h4, h5, h6, p, span { margin: 0; padding: 0; font-weight: normal; }  
	
	.link-branco 	{ color: #eaf2f0; font-family: Avenir-Next; font-size: 0.9em; text-decoration: none; transition: all ease 0.5s; }
	.link-branco:hover 	{ color: #33c5a1; }	
	
	.link-url 	{ color: #eaf2f0; font-family: Avenir-Next; font-size: 0.8em; text-decoration: none; transition: all ease 0.5s; }
	.link-url:hover 	{ color: #33c5a1; }	
	
	.link-email 	{ color: #666; font-family: Avenir-Next; font-size: 0.95em; text-decoration: none; transition: all ease 0.5s; }
	.link-email:hover 	{ color: #008967; }		
	
/* ==========================================================================
   end SELETORES
   ========================================================================== */





   
   
/* ==========================================================================
   NAV MENU
   ========================================================================== */
   .menu-footer-block ul { margin: 0; padding: 0; font-family: Avenir-Next; font-size: 0.9em; text-align: left; font-weight: normal; }
   .menu-footer-block ul li { display: block; margin: 0 0 6px 0; }
   .menu-footer-block ul li a { color: #eaf2f0; text-decoration: none; transition: all ease 0.5s; -webkit-transition: all ease 0.5s;  }
   .menu-footer-block ul li a:hover { color: #fff; text-decoration: none; }
   
   .bread ul { margin: 0; padding: 0; font-family: Avenir-Next;  font-size: 1em; text-align: left; font-weight: normal;  }
   .bread ul li { display: inline-block; text-transform: uppercase; }
   .bread ul li a { color: #fff; text-decoration: none; transition: all ease 0.5s; -webkit-transition: all ease 0.5s; padding: 10px; border: 1px solid #fff; }
   .bread ul li a:hover { color: #fff; -webkit-transition: all ease 0.5s; border: 1px solid #008967; background-color:#008967;  }
   .bread li.active { color:#fff; padding: 10px; border: 1px solid #008967; background-color:#008967; }  
   
   .logo-clientes ul { margin: 0; padding: 0; text-align: center; font-weight: normal; }
   .logo-clientes ul li { display: block; width: 25%; float: left; height: 90px; padding: 20px 10px 20px 10px; border: 1px solid #ededec; }
   .logo-clientes ul li a { color: #aaa; text-decoration: none; transition: all ease 0.5s; -webkit-transition: all ease 0.5s; }
   .logo-clientes ul li a:hover { color: #a94e29; text-decoration: none; -webkit-transition: all ease 0.5s;  }   
	img.logo-clientes-plann-site { height: 50px; }

   .lista-detalhes ul { margin: 0; padding: 0; text-align: center; font-weight: normal; font-family: Avenir-Next; font-size: 0.95em; color:#666; line-height: 22px; }
   .lista-detalhes ul li { display: block; width: 25%; float: left; padding: 15px; border: 2px solid #ededec; }
	span.verde { color:#008967;  }
	
	
	

	
/* ==========================================================================
   end NAV MENU
   ========================================================================== */ 
   


   
   

/* ==========================================================================
   IMG
   ========================================================================== */
	img 				{ max-width: 100%; border: 0; }
	img.logo		{ height: 60px; margin: 17px 0 0 0; }	
	img.circle		{ border-radius: 50%; }
	img.padrao		{ margin: 0 0 20px 0; }
	img.flutuante	{ max-width: 100%; margin: 0 20px 20px 0; float: left; }
	img.seta-menu { height: 7px; float: right; margin: 5px 0 0 8px; }
	img.icone-mapa { height: 60px; float: right; margin: 3px 0 0 20px; border-left: 1px solid #ededec; padding: 10px 0 10px 20px; }
	img.banner { width: 100%; -webkit-filter: grayscale(85%); -moz-filter: grayscale(85%); -ms-filter: grayscale(85%); -o-filter: grayscale(85%); filter: grayscale(85%); }
	img.icone-top { float: left; margin: 5px 7px 0 0; }
	img.imagem-box1 { width: 100%; }
	img.logo-footer { height: 60px; float: left; margin: 0 20px 0 0; }
	img.imagem-flutuante { width: 150px; float: left; margin: 0 10px 0 0; }
	img.bread { width: 100%; }
	img.icon-form { height: 20px; float: left; margin: 2px 10px 0 0; }
	img.yes { float: left; margin: 5px 10px 0 0; height: 10px; }	
	img.post-flutuante { width: 400px; float: left; position: relative; margin: 0 20px 0 0; border: 1px solid #ededec; }
	img.galeria { width: 200px; float: left; margin-right: 20px; }
	img.icon-redes-sociais		{ width: 35px; height: 35px; margin: 0 2px 0 0; border: 1px solid #fff; transition: all ease 0.5s; }
	img.icon-redes-sociais:hover	{ background-color:#33c5a1; }	
	
/* ==========================================================================
   end IMG
   ========================================================================== */




/* ==========================================================================
   FORMULÁRIOS PADRÃO
   ========================================================================== */
   .campocontato1 { width: 33.05%; padding: 15px; margin: 0 0 5px 0; border: 3px solid #ededec; background-color:#fff; font-size: 0.85em; font-family: Avenir-Next; outline: 0; color:#666; }
   .campocontato2 { width: 100%; padding: 15px; margin: 0 0 5px 0; border: 3px solid #ededec; background-color:#fff; font-size: 0.85em; font-family: Avenir-Next; outline: 0; color:#666; }
   .campocontato3 { width: 49.7%; padding: 15px; margin: 0 0 5px 0; border: 3px solid #ededec; background-color:#fff; font-size: 0.85em; font-family: Avenir-Next; outline: 0; color:#666; }
   .botaocontato { width: auto; height: auto; padding: 12px; border: 1px solid #fff; background-color:#fff; font-size: 0.85em; font-family: Avenir-Next; outline: 0; color:#008967; font-weight: bold; }
   .box-form { width: 100%; height: auto; float: left; position: relative; margin: 5px 0 0 0; text-align: right; }

  	input { color:#666; }
	::-webkit-input-placeholder { color: #666; }
	:-moz-placeholder { color: #666; }
	::-moz-placeholder { color: #666; }
	:-ms-input-placeholder { color: #666; } 
	
	
   .camporota { width: 43%; padding: 15px; margin: 0 0 5px 0; border: 3px solid #ededec; background-color:#fff; font-size: 0.85em; font-family: Avenir-Next; outline: 0; }
   .botaorota { width: auto; height: auto; padding: 12px; border: 1px solid #fff; background-color:#fff; font-size: 0.85em; font-family: Avenir-Next; outline: 0; color:#008967; font-weight: bold; }
	
	
/* ==========================================================================
   end FORMULÁRIOS PADRÃO
   ========================================================================== */







/* ==========================================================================
   DIVS ID e CLASSES ESTRUTURAIS HTML5
   ========================================================================== */
	#main, #top, #header, #menu, #box-header, #slide, #content, #mapa, #mais-projetos, #rodape, #chamada, #bread, #projetos, #interno, #obras, #clientes, #noticias, #footer, #copy, #copyright { width: 100%; height: auto; position: relative; float: left;	}
	#box1, #box2, #box3, #box4, #box5, #box6, #box7, #box8, #box9, #box10, #box11, #box12, #box13, #box14, #box15 { width: 100%; height: auto; position: relative; float: left;	}
	.box1, .box2, .box3, .box4, .box5, .box6, .box7, .box8, .box9, .box10, .box11, .box12, .box13, .box14, .box15 { width: 100%; height: auto; position: relative; float: left;	}
	header, content, footer { width: 100%; height: auto; position: relative; float: left;	}
	
	.text-left { text-align: left; }
	.text-right { text-align: right; }
	.text-center { text-align: center; }	
	
	
	header { z-index: 1; }
	footer { clear: both; }
	content { padding: 50px 0 0 0; }
	content#interno { width: 100%; height: auto; position: relative; float: left; padding: 50px 0 50px 0; }	
	content#interno-mapa { width: 100%; height: auto; position: relative; float: left; padding: 50px 0 0 0; }	
	
	#noticias { padding: 60px 0 0 0; background-color:#f4f4f4;  }
	#slider { width: 100%; height: 650px;  }	
	#slide { margin-top: 75px; z-index: 1; }
	#mapa { margin-bottom: -4px; }
	#bread { margin-top: 88px; padding: 100px 0 100px 0; background:url(../jpg/bread.jpg) center top no-repeat; }
	#mais-projetos { padding: 60px 0 20px 0; background-color:#f4f4f4;  }
	
	
	.box-conteudo { width: 100%; height: auto; position: relative; float: left;	}
	.box-conteudo h1	{ font-family: Avenir-Next; font-size: 1.5em; color: #008967; font-weight: bold; }
	.box-conteudo h2	{ font-family: Avenir-Next; font-size: 1.7em; color: #000; }
	.box-conteudo h3	{ font-family: Avenir-Next; font-size: 1.2em; color: #008967; font-weight: bold; margin: 0 0 5px 0; }
	.box-conteudo h4	{ font-family: Avenir-Next; font-size: 1em; color: #666; font-weight: bold; margin: 5px 0 5px 0; }
	.box-conteudo h5	{ font-family: Avenir-Next; font-size: 1.4em; color: #000; }
	.box-conteudo h6	{ font-family: Avenir-Next; font-size: 1.3em; color: #008967; border: 1px solid #008967; padding: 10px; margin: 40px 0 20px 0; text-align: center; }
	.box-conteudo p	{ font-family: Avenir-Next; font-size: 0.95em; color: #666; line-height: 22px; }	
	.box-rota { width: 100%; height: auto; position: relative; float: left; padding: 50px 0 50px 0; }

	
	.box-post { width: 100%; height: auto; position: relative; float: left;	}
	.box-post h1	{ font-family: Avenir-Next; font-size: 1.7em; color: #008967; font-weight: bold; margin-bottom: 10px; }
	.box-post h2	{ font-family: Avenir-Next; font-size: 1em; color: #666; margin-bottom: 25px; font-weight: bold; }
	.box-post h3	{ font-family: Avenir-Next; font-size: 0.95em; color: #666; margin: 0 0 5px 0; }
	.box-post h4	{ font-family: Avenir-Next; font-size: 1em; color: #666;  }
	.box-post h5	{ font-family: Avenir-Next; font-size: 1.4em; color: #000; }
	.box-post h6	{ font-family: Avenir-Next; font-size: 1.3em; color: #008967; }
	.box-post p	{ font-family: Avenir-Next; font-size: 0.95em; color: #666; line-height: 22px;  }	
	
	.box-detalhes { width: 100%; height: auto; position: relative; float: left;	}
	.box-detalhes h1	{ font-family: Avenir-Next; font-size: 1.5em; color: #008967;  }
	.box-detalhes p	{ font-family: Avenir-Next; font-size: 0.95em; color: #666; line-height: 22px;  }		
	
	.accordion__panel p	{ font-family: Avenir-Next; font-size: 0.95em; color: #666; line-height: 22px;  }
	
	
	.box-resposta { width: 100%; height: auto; position: relative; float: left; margin: 25px 0 0 0; text-align: center;	}
	.box-resposta h1 {
		font-family: Avenir-Next;
		font-size: 1em;
		color: #fff;
		padding: 10px;
		border: 2px solid #008967;
		background-color: #008967;
		font-weight: bold;
	}
	.box-clientes { width: 100%; height: auto; position: relative; float: left; margin: 45px 0 0 0; text-align: center;	}
	.box-clientes h1	{ font-family: Avenir-Next; font-size: 1.5em; color: #004525; margin: 0 0 20px 0; }

	.box-carrousel-portfolio { width: 100%; height: auto; position: relative; float: left; padding: 0 5px 0 5px; }
	.box-carrousel-portfolio1 { width: 25%; height: auto; position: relative; float: left; padding: 0 5px 0 5px; }
	
	
	.box-slider-home { width: 40%; height: auto; position: relative; float: left; text-align: left; top: 50%; transform: translateY(-50%); background:url(../jpg/backarea1.png) center right no-repeat; padding: 50px 150px 50px 100px;  }
	.box-slider-home h1	{ font-family: Avenir-Next; font-size: 1.5em; color: #fff; text-transform: uppercase; margin-bottom: 15px;  }
	.box-slider-home h2	{ width: 180px; font-family: Avenir-Next; font-size: 0.9em; color: #fff; border: 2px solid #fff; padding: 8px; -webkit-transition: all ease 0.5s; text-decoration: none;  text-align: center; margin: 20px 0 0 0; font-weight: bold; }			
	.box-slider-home p	{ font-family: Avenir-Next; font-size: 0.95em; color: #eaf2f0; line-height: 22px;  }
	.box-slider-home:hover h2	{ color: #008967; border: 2px solid #fff; background-color:#fff; -webkit-transition: all ease 0.5s; text-decoration: none; }			
	.box-mais-center { width: 100%; height: auto; position: relative; float: left; margin: 25px 0 0 0; }	

	
	.box-obra-img { width: auto; float: left; overflow: hidden; height: 180px; z-index: 1; margin: 0 0 10px 0; }
	.box-obra-img img { width: 100%; clip:rect(550px,550px,550px,550px); min-height: 250px; transition: all ease 0.5s; z-index: 1;}			
	

	.box-obra-conteudo { width: 100%; height: auto; position: relative; float: left;	}	
	.box-obra-conteudo h1	{ font-family: Avenir-Next; font-size: 0.9em; color: #fff; position: absolute; transition: all ease 0.5s; padding: 10px 10px 10px 10px; text-align: center; background-color:#004525; z-index: 1; bottom: 20px; left: 10px; }
	.box-obra-conteudo:hover h1	{ background-color:#008967; color:#fff; }
	.box-obra-conteudo img { -webkit-transition: all .8s cubic-bezier(.190, 1.000, .220, 1.000); -moz-transition: all .8s cubic-bezier(.190, 1.000, .220, 1.000); -ms-transition: all .8s cubic-bezier(.190, 1.000, .220, 1.000); -o-transition: all .8s cubic-bezier(.190, 1.000, .220, 1.000); transition: all .8s cubic-bezier(.190, 1.000, .220, 1.000); }
	
	
	.box-titulo1 { width: 100%; height: auto; position: relative; float: left; margin-bottom: 25px;  }
	.box-titulo1 h1	{ font-family: Avenir-Next; font-size: 1.1em; color: #008967; font-weight: bold; width: 200px; border-bottom: 2px solid #008967; margin: 0 auto; padding: 0 0 10px 0; }
	.box-titulo1 h2	{ width: 180px; font-family: Avenir-Next; font-size: 0.85em; color: #004725; border: 1px solid #004725; padding: 5px; float: right; text-align: center; margin: 0 0 10px 0; }
	
	
	.box-titulo { width: 100%; height: auto; position: relative; float: left; margin-bottom: 15px;  }
	.box-titulo h1	{ font-family: Avenir-Next; font-size: 1.1em; color: #008967; font-weight: bold; width: 200px; border-bottom: 2px solid #008967; margin: 0 auto; padding: 0 0 10px 0; }
	.box-titulo h2	{ width: 180px; font-family: Avenir-Next; font-size: 0.85em; color: #004725; border: 1px solid #004725; padding: 5px; float: right; text-align: center; margin: 0 0 10px 0; }
	
	.box-titulo2 { width: 100%; height: auto; position: relative; float: left; margin-bottom: 25px;  }
	.box-titulo2 h1	{ font-family: Avenir-Next; font-size: 1.1em; color: #008967; font-weight: bold; width: 200px; border-bottom: 2px solid #008967; margin: 0 auto; padding: 0 0 10px 0; }
	.box-titulo2 h2	{ width: 400px; font-family: Avenir-Next; font-size: 0.85em; color: #004725; border: 1px solid #004725; padding: 5px; float: right; text-align: center; margin: 0 0 10px 0; font-weight: bold; }


	.box-obra-imagem { width: 50%; height: 400px; position: relative; float: left; background-color:#000;	}	
	.box-obra-texto { width: 50%; height: 400px; position: relative; float: left; padding: 60px; background-color:#fff; transition: all ease 0.5s; }	
	.box-obra-texto h1	{ font-family: Avenir-Next; font-size: 1.2em; color: #004725; font-weight: bold; text-transform: uppercase; margin: 0 0 5px 0; transition: all ease 0.5s; }

	
	.box-noticia { width: 100%; height: auto; position: relative; float: left;margin: 0 0 30px 0; }	
	.box-noticia h1	{ font-family: Avenir-Next; font-size: 1em; color: #666; transition: all ease 0.5s; font-weight: bold; }
	.box-noticia h2	{ font-family: Avenir-Next; font-size: 0.8em; color: #666; margin: 0 0 5px 0; }
	.box-noticia h3	{ font-family: Avenir-Next; font-size: 0.7em; color: #666; margin: 10px 0 0 0; font-weight: bold; border: 1px solid #ccc; width: 100px; text-align: center; padding: 5px; transition: all ease 0.5s; }
	.box-noticia:hover h1	{ color:#008967; font-weight: bold; }
	.box-noticia img { -webkit-transition: all .8s cubic-bezier(.190, 1.000, .220, 1.000); -moz-transition: all .8s cubic-bezier(.190, 1.000, .220, 1.000); -ms-transition: all .8s cubic-bezier(.190, 1.000, .220, 1.000); -o-transition: all .8s cubic-bezier(.190, 1.000, .220, 1.000); transition: all .8s cubic-bezier(.190, 1.000, .220, 1.000); }
	.box-noticia:hover h3	{ font-family: Avenir-Next; font-size: 0.7em; color: #fff; margin: 10px 0 0 0; background-color:#008967; font-weight: bold; border: 1px solid #008967; width: 100px; text-align: center; padding: 5px; }
	.box-post-home { width: auto; float: left; overflow: hidden; height: 180px; z-index: 1; margin: 10px 0 10px 0; }
	.box-post-home img { position: relative; top: 50%; transform: translateY(-50%); }		
	
	
	.box-post-home-1 { width: 100%; float: left; overflow: hidden; height: 300px; z-index: 1; margin: 10px 0 10px 0; border: 1px solid #ededec;  }
	.box-post-home-1 img {  width: 100%; position: relative; top: 50%; transform: translateY(-50%); }	
	
	
	.box-footer { width: 100%; height: auto; position: relative; float: left;	}
	.box-footer h1	{ font-family: Avenir-Next; font-size: 1em; color: #fff; margin: 0 0 5px 0; font-weight: bold; }
	.box-footer h2	{ font-family: Avenir-Next; font-size: 1em; color: #fff; margin: 5px 0 0 0; font-weight: bold; }
	.box-footer h3	{ font-family: Avenir-Next; font-size: 1em; color: #fff; margin: 0 0 5px 0; font-weight: bold; }
	.box-footer h4	{ font-family: Avenir-Next; font-size: 1em; color: #fff; margin: 0 0 5px 0; font-weight: bold; text-transform: uppercase; }
	.box-footer p	{ font-family: Avenir-Next; font-size: 0.9em; color: #eaf2f0; line-height: 22px; }
	
	
	.box1 { margin: 40px 0 0 0; padding: 40px 0 0 0; border-top: 1px solid #046237; }
	.box-footer-3 { width: 50%; height: auto; position: relative; float: left;	}
	.box-footer-box { width: 33.33%; height: auto; position: relative; float: left; padding: 0 0 0 20px;	}
	
	.margem-box-rodape { width: 100%; height: auto; position: relative; float: left; margin: 0 0 50px 0;	}
	.margem-box-interno { width: 100%; height: auto; position: relative; float: left; margin: 0 0 25px 0;	}
	
	
	.box-imagem-responsiva { width: 25%; float: left; overflow: hidden; height: 220px; z-index: 1; padding: 1px; padding: 2px; }
	.box-imagem-responsiva img { width: 100%; clip:rect(550px,550px,550px,550px); min-height: 220px; transition: all ease 0.5s; z-index: 1;}		
	.box-imagem-responsiva:hover img { transition: all ease 0.5s; z-index: 1;  }	
	
	
	.box-galeria { width: 100%; height: auto; position: relative; float: left; margin: 25px 0 0 0;	}
	.box-compartilhe { width: 100%; height: auto; position: relative; float: left; margin: 25px 0 0 0;	}
	.box-compartilhe h1	{ font-family: Avenir-Next; font-size: 0.95em; color: #000; font-weight: bold; float: left; margin: 7px 10px 0 0; }
	.box-dados-detalhes { width: 100%; height: auto; position: relative; float: left; margin: 25px 0 25px 0;	}
	
	.margem-rodape-site { width: 100%; height: auto; position: relative; float: left; margin-bottom: 30px; }
	
	.box-padding { width: 100%; height: auto; position: relative; float: left; padding: 20px 0 20px 0; }
	
	
	.rodape-left { width: 70%; height: auto; position: relative; float: left; }
	.rodape-right { width: 30%; height: 450px; position: relative; float: left; padding: 60px; background-color:#008967; }
	
	
	.box-video { width: 100%; height: auto; position: relative; float: left; margin: 25px 0 0 0;	}
	
	

.box-accordion-padding { font-family: Avenir-Next; font-size: 0.95em; color: #666; line-height: 22px; }
.box-accordion-padding ul li { padding: 5px 0 5px 0; display: block; font-family: 'Ubuntu', sans-serif; font-size: 0.95em; color: #666; }	
	
	
	
	
/* ==========================================================================
   end DIVS ID e CLASSES ESTRUTURAIS
   ========================================================================== */



#paging-table {
width: 300px; height: auto; position: relative;
text-align:center;font-family: Avenir-Next;margin: 0 auto;
margin:
}
.paging-table-estrutura {
font-family: 'Roboto Condensed', sans-serif;
margin: 25px 0 0 0;
}
.page-far-left	{
	display: block;
	float: left;
	height: 35px;
	margin: 0 4px 0 0;
	width: 35px;
	background-color:#008967;
	border-radius: 100px;
	transition: all ease 0.5s; -webkit-transition: all ease 0.5s;
	padding: 7px;
	}
.page-far-left:hover	{
	display: block;
	float: left;
	height: 35px;
	margin: 0 4px 0 0;
	width: 35px;
	background-color:#004823;
	border-radius: 100px;
	padding: 7px;
	}
.page-far-left-1	{
	display: block;
	float: left;
	height: 35px;
	margin: 0 4px 0 0;
	width: 35px;
	background-color:#008967;
	border-radius: 100px;
	transition: all ease 0.5s; -webkit-transition: all ease 0.5s;
	padding: 7px;
	}
.page-far-left-1:hover	{
	display: block;
	float: left;
	height: 35px;
	margin: 0 4px 0 0;
	width: 35px;
	background-color:#004823;
	border-radius: 100px;
	padding: 7px;
	}
.page-left	{
	display: block;
	float: left;
	height: 35px;
	width: 35px;
	}
.page-far-right	{
	display: block;
	float: left;
	height: 35px;
	margin: 0 4px 0 4px;
	width: 35px;
	background-color:#008967;
	border-radius: 100px;
	transition: all ease 0.5s; -webkit-transition: all ease 0.5s;
	padding: 7px;
	}
.page-far-right:hover	{
	display: block;
	float: left;
	height: 35px;
	margin: 0 4px 0 4px;
	width: 35px;
	background-color:#004823;
	border-radius: 100px;
	padding: 7px;
	}
.page-far-right-1	{
	display: block;
	float: left;
	height: 35px;
	margin: 0 4px 0 4px;
	width: 35px;
	background-color:#008967;
	border-radius: 100px;
	transition: all ease 0.5s; -webkit-transition: all ease 0.5s;
	padding: 7px;
	}
.page-far-right-1:hover	{
	display: block;
	float: left;
	height: 35px;
	margin: 0 4px 0 4px;
	width: 35px;
	background-color:#004823;
	border-radius: 100px;
	padding: 7px;
	}
.page-right	{
	display: block;
	float: left;
	height: 35px;
	width: 35px;
	}
#page-info	{
	float: left;
	line-height: 16px;
	padding: 3px 12px 0 12px;
	color:#666;
	text-align: center;
	margin: 7px 0 0 0;
	}



/* ==========================================================================
   GRID SYSTEM
   ========================================================================== */
	[class*='col-'] { float: left; padding-right: 20px; }
	[class*='col-']:last-of-type { padding-right: 0px; }
	.grid { width: 100%; max-width: 1250px; min-width: 755px; margin: 0 auto; }
	.grid:after { content: ""; display: table; clear: both; }
	.grid-pad { padding: 0 0 0 20px; }
	.grid-pad > [class*='col-']:last-of-type { padding-right: 20px; }
	.push-right { float: right; }
/* ==========================================================================
   end GRID SYSTEM
   ========================================================================== */






/* ==========================================================================
   CONTENT COLUNAS
   ========================================================================== */
	.col-1-1				{ width: 100%; }
	.col-2-3, .col-8-12		{ width: 66.66%; }
	.col-1-2, .col-6-12		{ width: 50%; }
	.col-1-3, .col-4-12		{ width: 33.33%; }
	.col-1-4, .col-3-12		{ width: 25%; }
	.col-1-5				{ width: 20%; }
	.col-1-6, .col-2-12		{ width: 16.667%; }
	.col-1-7				{ width: 14.28%; }
	.col-1-8				{ width: 12.5%; }
	.col-1-9				{ width: 11.1%; }
	.col-1-10				{ width: 10%; }
	.col-1-11				{ width: 9.09%; }
	.col-1-12				{ width: 8.33%; }
/* ==========================================================================
   end CONTENT COLUNAS
   ========================================================================== */






/* ==========================================================================
   LAYOUT COLUNAS
   ========================================================================== */
	.col-11-12		{ width: 91.66%; }
	.col-10-12		{ width: 83.333%; }
	.col-9-12		{ width: 75%; }
	.col-5-12		{ width: 41.66%; }
	.col-7-12		{ width: 58.33%; }
	
	.col-rodape-1 { width: 45%; }
	.col-rodape-2 { width: 55%; }	
	
/* ==========================================================================
   end LAYOUT COLUNAS
   ========================================================================== */


   



   
/* ==========================================================================
   MEDIA QUERIES 767px
   ========================================================================== */
	@media handheld, only screen and (max-width: 900px) {
	.grid { width: 100%; min-width: 0; margin:0; }
	[class*='col-'] { width: auto; float: none; margin: 0; }

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


	.margem-box-rodape { width: 100%; height: auto; position: relative; float: left; margin: 0 0 35px 0;	}	
	.margem-rodape {  width: 100%; height: auto; position: relative; float: left; margin-bottom: 35px; }	
	.box-footer-box { width: 100%; height: auto; position: relative; float: left; padding: 0 0 0 0;	}
	.box-footer-3 { width: 100%; height: auto; position: relative; float: left;	}
	.box-top { display: none; }
	.box-titulo { width: 100%; }

	.box-menu { width: 100%; height: auto; position: relative; float: left; text-align: center; }
	.box-menu-estrutura { width: 100%; margin-left:auto; margin-right:auto; margin-top:0; display:table; }	

	.box-slider-home { width: 60%; height: auto; position: relative; float: left; text-align: left; top: 50%; transform: translateY(-50%); background:none; padding: 30px; left: 20%; right: 20%; background-color:#008967; text-align: center;  }
	.box-titulo h2	{ width: 100%; font-size: 0.85em; color: #004725; font-weight: bold; border: 1px solid #004725; padding: 5px; float: right; text-align: center; margin: 0 0 10px 0; }
	

   .menu-footer-inline ul li { display: block; width: 50%; float: left; margin: 0; text-align: left; }
	#slider { width: 100%; height: 700px; clear: both; }	

	.box-slider-home h2	{ width: 100%; font-size: 0.9em; color: #fff; border: 2px solid #fff; padding: 8px; -webkit-transition: all ease 0.5s; text-decoration: none;  text-align: center; margin: 20px 0 0 0; font-weight: bold; }			
	.box-slider-home p	{ font-size: 0.95em; color: #eaf2f0; line-height: 22px; text-align: center; }

	#bread { margin-top: 140px; padding: 60px 0 60px 0;  }
   .campocontato3 { width: 100%; padding: 15px; margin: 0 0 5px 0; border: 3px solid #ededec; background-color:#fff; font-size: 0.85em; outline: 0; }

	#mapa { padding: 0 20px 20px 20px; }
   .logo-clientes ul li { display: block; width: 100%; float: left; height: 70px; padding: 20px 10px 20px 10px; border: 1px solid #ededec; }
	img.logo-clientes-plann-site { height: 30px; }
   .camporota { width: 100%; padding: 15px; margin: 0 0 5px 0; border: 3px solid #ededec; background-color:#fff; font-size: 0.85em; outline: 0; }
   .botaorota { width: 100%; height: auto; padding: 12px; border: 1px solid #fff; background-color:#fff; font-size: 0.85em; outline: 0; color:#008967; font-weight: bold; }	
	.box-carrousel-portfolio1 { width: 100%; height: auto; position: relative; float: left; padding: 0 0 0 0; margin-bottom: 10px; }
	

	.box-imagem-responsiva { width: 50%; float: left; overflow: hidden; height: 130px; z-index: 1; padding: 1px; padding: 2px; }
	.box-compartilhe h1	{ font-size: 0.95em; color: #000; font-weight: bold; float: none; margin: 0 0 5px 0; }

	.box-post h1	{ font-size: 1.5em; color: #008967; font-weight: bold; margin-bottom: 5px; line-height: 30px; }
	.box-post h2	{ font-size: 1em; color: #666; margin-bottom: 25px; font-weight: bold; line-height: 21px; }
   .lista-detalhes ul li { display: block; width: 100%; float: left; padding: 15px; border: 2px solid #ededec; }
	
	.box-post-home-1 { width: auto; float: left; overflow: hidden; height: 190px; z-index: 1; margin: 10px 0 10px 0; }
	.box-post-home-1 img { width: 100%; clip:rect(550px,550px,550px,550px); min-height: 190px; transition: all ease 0.5s; z-index: 1; }		
	
	.rodape-left { width: 100%; height: auto; position: relative; float: left; }
	.rodape-right { width: 100%; height: auto; position: relative; float: left; background-color:#008967; padding: 40px 20px 40px 20px;  }
	.margem-rodape-site { width: 100%; height: auto; position: relative; float: left; margin-bottom: 30px; }

	img.icon-redes-sociais		{ width: 35px; height: 35px; margin: 0 2px 20px 2px; transition: all ease 0.5s; }
	
   .bread ul li { width: 100%; float: left; display: block; text-transform: uppercase; margin: 10px 0 0 0; padding: 10px 0 0 0; text-align: center; }
	
   .bread ul li a { width: 100%; float: left; height: auto; color: #fff; text-decoration: none; transition: all ease 0.5s; -webkit-transition: all ease 0.5s; padding: 10px; border: 1px solid #fff; }
	
	
	}
/* ==========================================================================
   end MEDIA QUERIES 767px
   ========================================================================== */