/*
 * Reference
 * ----------------------------------------------
 *
 * 01 - Heading
 * 02 - Topo/Menu
 * 03 - Banner
 * 04 - Últimos projetos
 * 05 - Serviços
 * 06 - Barra News
 * 07 - Rodapé
 * 09 - Somos a Seen
 * 10 - Soluções
 * 11 - Soluções Visualizar
 * 12 - Equipe
 * 13 - Clientes
 * 14 - Cases
 * 15 - Servicos
 * 16 - Glossário
 * 17 - Cases Visualizar
 * 18 - Inspired Agency
 * 19 - Marketing Digital
 * 20 - Serviços
 * 21 - Cursos
 * 22 - Parallax
 *
 * -----------------------------------------------*/

/*font-family: 'Titillium Web', sans-serif;*/
@import url(http://fonts.googleapis.com/css?family=Titillium+Web:600,300italic,700,400,400italic,300);
/*
 * 01 - Heading
 * ---------------------------------------------- */
*{
	padding:0;
	margin:0;
}
ul li {list-style: none;}
body {
  font-family: 'Titillium Web';
  line-height: 1.42857143;
  color: #333333;
  background-color: #fff;
}

.title-left {
    text-align: left;
    font-family: lato,sans-serif;
    text-transform: uppercase;
    font-size: 18px;
    border-left: 1px solid;
    padding: 10px 30px;
    letter-spacing: 4px;
}
.title-center{
    margin-top: 50px;
    margin-bottom: 0px;
    text-align: center;
    font-family: lato,sans-serif;
    font-size: 35px;
    color:#fff;
}

/* 
 * 02 - Menu
 * ---------------------------------------------- */
#menu-bg {height: 85px; background: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);position:relative; z-index: 9999;}
#menu 
{
    width:100%;
    margin: 0 auto; 
}
#menu ul {
    margin-top: 75px;
    float:right;
    margin-right:60px;
}
#menu  ul li {
    display: block;
    height: 17px;
    float: left;
    clear: none;
    margin-left: 45px;
    position: relative;
}
#menu li a{
    font-family: 'Titillium Web';
    font-weight: bold; 
    cursor: pointer;
    height: 50px;
    color: #5b5b5b;
     text-transform: uppercase;
    text-decoration: none;
    font-size: 1.366em;
    display: inline-block;
    letter-spacing: 1px;
}
.logo{width:100%; display: inline-block;}
.logo h1 {
    margin-left:45px; 
    margin-top:25px;  
    background: url(../imagens/logo.png)no-repeat left;
    text-indent: -9999px;
    width: 304px;
    height:94px;
    
}
.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }
.pullcontainer a#pull { display: none; }
a { color: #282f35; -webkit-transition: all .25s ease; -moz-transition: all .25s ease; -ms-transition: all .25s ease; -o-transition: all .25s ease; transition: all .25s ease; }
a:hover { color: #64c29e; text-decoration: none; }

nav { height: 85px; margin-bottom:20px; position: relative; }
.logo-holder h1{
  float: left;
  width: 304px;
  height:94px;
  background: url(../imagens/logo.png) no-repeat;
  text-indent: -9999px;
  margin-left:50px;
  margin-top: 5px;
  cursor:pointer;
}

.responsive-logo { display: hidden; }
header { text-align: center; background-color: #ffffff; }
ul.clearfix  { float:right; right:0; padding-top: 35px; padding-bottom: 15px; }
ul.clearfix li { 
  color: #372f2c;
  font-family: "NeutraBold";
  font-size: 14px;
  list-style: none; 
  float: left; 
  letter-spacing: 0px;
  text-transform: uppercase;
}

ul.clearfix li a { display: block; margin: 0 20px; color: #372f2c; text-decoration: none; }

/* 
 * 03 - Banner
 * ---------------------------------------------- */

#banners {
    width: 100%;
    height: 420px;
    background: url(../imagens/dot-pattern.png),url(../imagens/banner.jpg);
    background-repeat: repeat, no-repeat;
        background-size: cover;
}

.icon_banner {
    margin:60px 0 0;
    position:relative;
    display:block;
    width:50%;
    float:left;
    text-align:center;
}

/* 
 * 04 - Empresa
 * ---------------------------------------------- */

#empresa {
    padding:80px 40px;
}
#empresa h2 {
    font-size: 15px;
}
#empresa p {
    font-size: 13px;
    text-align:justify;
    padding-left:30px;
    padding-top:25px;
}
#empresa .maps {
    margin-left:10%;
    width: 80%;
    height: 290px;
    border-radius: 50%;
    overflow: hidden;
    position: relative;
}
#empresa .maps iframe {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    border-radius: 50%;
    top: 0;
    left: 0;
    z-index: 50;
    -webkit-mask-box-image: url(../imagens/maps.png);
    -o-mask-box-image: url(../imagens/maps.png);
    -mask-box-image: url(../imagens/maps.png);
}
#empresa .conheca {
    background: url(../imagens/conheca.png) no-repeat;
    text-indent: -999px;
    width:304px;
    height: 25px;
    margin-left: 25px;
    margin-top:50px;
}
/* 
 * 04 - Empresa
 * ---------------------------------------------- */

#clientes {
    padding:0px 40px 50px;
}
#clientes h2 {
    font-size: 15px;
}

.cli_logo{
    margin:20px 0;
}

.wrapper-img {
    width: 100%;
    height: 100px;
    overflow: hidden;
    border: 1px solid #DBDBEA;
    display: table;
}
.middle {
    display: table-cell;
    vertical-align: middle;
}
.wrapper-img img {
    margin: 0 auto;
    display: block;
    max-height: 43px;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}
.wrapper-img img:hover{
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%);
}
/*
 * 06 - Barra News
 * ---------------------------------------------- */

.barra_news {
    background: #fafafa;
    position:relative;
    padding: 30px 0;
}
.newsletter {color:#304269; }
.newsletter input[type="text"], .newsletter input[type="email"], .newsletter .botao{margin-top:10px;}
.newsletter h3 {
    color:#712d40;
    font-weight:bold;
    font-size:14px;
    padding:7px 0;
    text-align:right;
    line-height: 40px;
} 

/*
 * 07 - Footer
 * ---------------------------------------------- */
#footer {
    background: #1f2237;
    color:#fff;
    padding-top:60px;
    min-height:180px;
}
#footer h1 {
    background: url(../imagens/logofooter.png)no-repeat center;
    text-indent: -9999px;
    height: 105px; 
    border-right: 1px solid #fff;
    width:320px;
}
#footer span {
    font-size: 18px;
    line-height: 45px;
    letter-spacing: 2px;
}
.endereco{
    padding-top:4px; 
    padding-bottom: 5px;
    font-size:14px;
}
.localizacao {
    font-size: 14px;
    line-height: 40px;
}
.localizacao a {color:#fff;}

.copyright {position: relative; min-height:60px;background: #1f2237; padding: 8px 0 18px; color:#fff; }
.copyright .endereco{padding-top:14px; padding-bottom: 5px;font-size:12px;}
.copyright a.assinatura:hover {
    background-position: left bottom;
}

.copyright a.assinatura {
    display: block;
    width: 116px;
    height: 44px;
    background: url(../imagens/assinatura.png) left top no-repeat;
    text-indent: -20000px;
    position: absolute;
    right: 0;
}


/*
 * 08 - Empresa
 * ---------------------------------------------- */

#institucional #sobre {background-image: url(../imagens/dot-pattern.png), url('../imagens/banner.jpg'); background-repeat: repeat, no-repeat;}

.head{
    padding: 10px 0px 30px;
    color: #fff;
    font-size: 14px;
    font-size: 1.3em;
    text-transform: uppercase;
    line-height: 40px;
    font-weight: 900;
    letter-spacing: 0.3em;
}
#institucional h1 {color:#fff;width:60%;}
#sobre p{
    width:70%;
    margin-top: 25px;
    margin-bottom: 25px;
    font-weight: 400;
    font-size: 16px;
    font-size: 1.6em;
    line-height: 1.6em;
    color:#fff;
}
.historia {text-align: justify;}
.historia h3 {
    margin-top: 55px;
    margin-bottom: 25px;
}
.historia p {
    margin-top: 15px;
    margin-bottom: 15px;
    font-weight: 400;
    font-size: 16px;
    font-size: 1.6em;
    line-height: 1.6em;
}

/*
 * 08 - Produtos e Serviços
 * ---------------------------------------------- */
#produtos {background-image: url(../imagens/dot-pattern.png), url('../imagens/banner.jpg'); background-repeat: repeat, no-repeat;}
#produtos h1 {color:#fff;width:60%;}
#produtos p{
    width:70%;
    margin-top: 25px;
    margin-bottom: 25px;
    font-weight: 400;
    font-size: 16px;
    font-size: 1.6em;
    line-height: 1.6em;
    color:#fff;
}
nav.aside {
    margin-top: 55px;
    width: 100%;
    height:auto;
    padding: 25px 40px;
    border-radius: 10px;
    border: 1px solid #B9B9C8;
    background: #fff;
}
nav.aside ul li a {
font-family: lato,sans-serif;
font-size: 22px;
font-weight: 300;
color: #0c0c1e;
}
.servico h3 {
    margin-top: 55px;
    margin-bottom: 25px;
}
.servico p {
    margin-top: 15px;
    margin-bottom: 15px;
    font-weight: 400;
    font-size: 16px;
    font-size: 1.6em;
    line-height: 1.6em;
}
.icon {
    background-repeat: no-repeat;
    background-position: left center;
    padding: 0px 0px 0px 50px;
    padding-top: 8px;
    margin-bottom: 18px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    width: 100%;
    background-color: white;
    box-sizing: border-box;
    line-height: 18px;
    line-height: 1.2em;
    color: black;
    height:40px;
}
.porta {
background-image: url('../imagens/porta.png');
}
.janela {
background-image: url('../imagens/janela.png');
}
.veneziana {
background-image: url('../imagens/venezianas.png');
}
.brises {
background-image: url('../imagens/brises.png');
}
.box {
background-image: url('../imagens/box.png');
}
.vidro {
background-image: url('../imagens/vidro.png');
}
.cobertura {
background-image: url('../imagens/cobertura.png');
}
.sacada {
background-image: url('../imagens/sacada.png');
}

#tecnologia h4 {
    margin-top:20px;
}
#tecnologia h3 {
    margin-top: 55px;
    margin-bottom: 25px;
}
#tecnologia p {
    margin-top: 15px;
    margin-bottom: 15px;
    font-weight: 400;
    font-size: 16px;
    font-size: 1.6em;
    line-height: 1.6em;
}
#tecnologia img {max-width:100%;}


/*
 * 09 - Representantes
 * ---------------------------------------------- */
#representantes {background-image: url(../imagens/dot-pattern.png), url('../imagens/representantes.jpg'); background-repeat: repeat, no-repeat;}
#representantes h1 {color:#fff;width:60%;}
#representantes p{
    width:70%;
    margin-top: 25px;
    margin-bottom: 25px;
    font-weight: 400;
    font-size: 16px;
    font-size: 1.6em;
    line-height: 1.6em;
    color:#fff;
}
.onde-encontrar {
    min-height:280px;
}
.onde-encontrar p {
    margin-top: 15px;
    margin-bottom: 15px;
    font-weight: 400;
    font-size: 14px;
    font-size: 1.4em;
    line-height: 1.6em;
}
.onde-encontrar h3 {
    margin-top: 55px;
    margin-bottom: 25px;
}
.onde-encontrar h4 {
    margin: 10px 0;
}


/*
 * 10 - Contato
 * ---------------------------------------------- */
.contato .map {
    max-width: 1200px;
    height: 480px;
    overflow: visible;
    margin:0 auto;
}
.contato iframe{
    width:100%;
    height:100%;
}
.contato h3 {
    margin: 50px auto;
    width: 100%;
    text-align: center;
}
.formulario {
    clear: both;
    padding-bottom: 50px;
}
/*
 * CAMPOS COMUNS
 * ---------------------------------------------- */

h1 {
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-weight: 300;
    font-size: 42px;
    font-size: 4.2em;
    line-height: 1.2em;
}
h3 {
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-weight: 800;
    font-size: 22px;
    font-size: 2.2em;
    line-height: 1.5em;
    color:#091c3c;
}
h4 {
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-weight: 800;
    font-size: 22px;
    font-size: 1.6em;
    line-height: 1em;
    color:#091c3c;
}
label {font-size: 1.4em;}
select {
    display: block;
    width: 100%;
    height: 25px;
    margin-bottom: 10px;
    border: 1px solid #6e6e6e;
    padding-right: 5px;
    padding-top: 3px;
    padding-bottom: 3px;
    border-radius: 4px;
}
input[type="text"], input[type="email"]{
    width: 100%;
    min-height: 35px;
    margin-top: 3px;
    margin-bottom: 10px;
    padding-left: 7px;
    padding-right: 3px;
    display: block;
    border: 1px solid #ccc;
    font-size: 13px;
}
input[type="text"]:focus, input[type="email"]:focus{
    outline: transparent;
}
textarea {
    width: 100%;
    min-height: 100px;
    margin-top: 3px;
    margin-bottom: 13px;
    padding-left: 7px;
    padding-right: 3px;
    display: block;
    border: 1px solid #ccc;
}
.botao { 	
    min-width: 140px;
    color: #f8f8f8;
    font-size: 13px;
    padding: 0px 0px 4px 0px;
    border-radius: 2px;
    background: #929191;
    border: none;
    cursor: pointer;
    text-align:center;
}
.botao a:hover{
    color: #f0f0f0;
}
table{
	width: 100%;
	margin-top: 16px;
	margin-bottom: 25px;
	border: none;
}
table th{
	border: none;
	text-align: left;
	height: 22px;
	background: #929292;
	color: #ffffff;
	font-size: 12px;
	padding-left: 10px;
	border-left: 1px solid #fff;
}
table td{
	border: none;
	text-align: left;
	height: 22px;
	font-size: 12px;
	padding-left: 10px;
	border-left: 1px solid #fff;
}
table tr.cor{
	background: #eaeaea;
}
strong {
font-weight: 800;
}

@media (max-width: 959px) {
 .logo h1 {
  margin-left: 0px;
  margin-top: 25px;
  background: url(../imagens/logo.png) no-repeat center;
  width:auto;
  }
#banners {
  position: relative;
}
#menu ul {
  margin-top: 0px;
  float: none;
  margin-right: 0px;
text-align:center;
}
#menu ul li {
  margin-left: 0px; 
  position: relative;
  width: 25%;
}
#footer h1 {
   border-right: 0; 
   width: auto;
}
.endereco, .localizacao, .copyright{
	text-align:center;
}
.copyright a.assinatura {
  display: inline-block;
  width: 116px;
  position:relative;
}

}