/* ...................... geral ................................................................................................................................................. */


html						{ height:100%; }

body						{ margin:0; font-size:12px; line-height:160%; color:#5F5959; font-family:arial; background:url(images/concreto.jpg); height:100%; }

input, textarea, select, option			{ font-family:arial; }

img						{ border:none; }

a						{ color:#D62D25; text-decoration:none; }

a:hover						{ color:#BF2922; }

::selection					{ background:#D62D25; color:#fff; }
::-moz-selection				{ background:#D62D25; color:#fff; }

form						{ margin:0; padding:0; }

  fieldset					{ margin:0; padding:0; border:none; }

.clear						{ clear:both; }

.tudo						{ max-width:923px; min-width:923px; padding:0 20px 0 20px; position:relative; margin:0 auto; background-color:#fff; }
*html .tudo					{ height:100%; }


@media only screen and (max-width : 900px) {
	
.tudo						{ max-width:100%; min-width:100%; height:auto; box-sizing:border-box; }

}


body li.clear					{ clear:both; height:0; padding:0; margin:0; width:100%; float:none; }


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


.cab						{ position:relative; z-index:2; width:923px; height:174px; margin:0 auto; }

  .cab .logo					{ width:377px; height:93px; position:absolute; top:14px; left:0; display:block; z-index:99; }

  .cab .contato					{ width:500px; height:41px; position:absolute; top:40px; right:0; text-align:right; }
  .cab .contato .caixa				{ position:relative; }
	.cab .contato .pcontato			{ font-size:16px; font-weight:700; color:#D62D26; padding-right:5px; }
	.cab .contato .numero			{ font-size:20px; font-weight:700; }
	.cab .contato .facebook			{ width:20px; height:20px; background:url(images/icone_facebook.png); display:block; position:absolute; top:22px; right:0;}
	.cab .contato .instagram		{ width:20px; height:20px; background:url(images/icone_instagram.png); display:block; position:absolute; top:22px; right:25px;}
	.cab .contato address			{ display:block; font-size:11px; position:absolute; top:22px; right:50px; font-style:normal;}
  
  .menu						{ width:923px; height:40px; position:absolute; top:120px; left:0; border-top:1px solid #F7F7F7; border-bottom:1px solid #F7F7F7; z-index:200; }

	.navbar					{ list-style:none; padding:10px 0 5px 0; margin:0; z-index:203; }
		.navbar li			{ margin:0 0 0 20px; padding:0; position:relative; color:#666; float:left; }
		.navbar li.ativo		{ border-bottom:1px solid #D62E26; }
		.navbar li a			{ display:block; height:30px; color:#666; z-index:204; padding:0; float:left; }
		.navbar li.ativo a		{ color:#D62E26; }
		.navbar li a:hover		{ color:#CE4F2F; text-decoration:none; }
		.navbar li.ativo a:hover	{ color:#D62E26; }

  .busca					{ position:absolute; top:130px; right:20px; width:200px; height:24px; background:url(images/busca_bg.jpg); z-index:200; }
    .busca fieldset				{ position:relative; width:200px; height:24px; }
      .busca input[type=text]			{ width:160px; height:24px; padding:0 0 0 10px; margin:0; line-height:24px; border:none; background:none; position:absolute; top:0; left:0; }
      .busca input[type=submit]			{ width:17px; height:24px; padding:0; margin:0 5px 0 0; border:none; background:none; position:absolute; top:0; right:0; background:url(images/busca_botao.png) right; cursor:pointer; }
      .busca input[type=submit]:hover		{ background-position:left; }
	
	
  #menu_ico					{ right:0; position:absolute; display:none; cursor:pointer; }
	
	
	
@media only screen and (max-width : 900px) {
	
.cab						{ display:block; width:100%; height:121px; }

  .cab .logo					{ width:377px; height:93px; position:absolute; top:14px; left:0; display:block; z-index:99; }
  
  .cab .contato					{ display:none; }
  
  #menu_ico					{ display:block; top:15px; width:27px; height:23px; background:url(images/smart_ico.png)no-repeat; }

    .menu					{ display:none; top:0; left:600px; background:#fff; position:fixed; height:100%; width:100%; -webkit-box-shadow:0 0 5px rgba(0, 0, 0, 0.3); -moz-box-shadow:0 0 5px rgba(0, 0, 0, 0.3); box-shadow:0 0 5px rgba(0, 0, 0, 0.3); }

	.navbar					{ height:auto; width:100%; position:relative; top:65px; right:auto; font-size:14px; text-transform:uppercase; border-top:1px solid #eee; }
	
		.navbar li			{ float:none; margin:0; }
		.navbar li.ativo		{ border-bottom:none; }
		.navbar li a			{ float:none; margin:0; color:#666; padding:13px 20px 13px 20px; height:auto; line-height:100%; font-size:16px; border-bottom:1px solid #eee; }
		.navbar li a.ativo		{ border-bottom:1px solid #eee;  }
		.navbar li a:hover		{ border-bottom:1px solid #eee;  }

    
    
  .busca					{ display:none; }
    
      #b_fechar					{ position:absolute; right:77px; top:15px; background:url(images/smart_menu_fechar.png); width:19px; height:19px; cursor:pointer; }

  
  
}



@media only screen and (max-width : 450px) {


  .cab .logo					{ width:85%; height:auto; }	
	
}
	
	
/* ...................... inicial ............................................................................................................................................... */
.aviso						{ max-width:923px; color:#fff; text-align:center; background:#D4322A; padding:20px; font-size:14px; line-height:160%; position:relative; left:0; margin:0 0 20px 0; box-sizing:border-box; z-index:1; }
	
.aviso .titulo					{ font-size:30px; font-weight:700; text-align:center; color:#fff; padding-bottom:10px;}
	
/* ...................... inicial ............................................................................................................................................... */

#demo_container					{ max-width:923px; height:372px; padding-bottom:20px; position:relative; left:0; margin:0 0 20px 0; z-index:1; }
  #demo_container #items_container		{ width:100%; height:372px; overflow:hidden; position:absolute; z-index:1; top:0; }
    #demo_container div.slide_item		{ width:100%; height:372px; position:absolute; left:100%; }
    #demo_container div.first_item		{ left:0; }
      #demo_container .slide_item>div		{ width:923px; height:372px; position:relative; z-index:100; background-position:center top; background-repeat:no-repeat; }
      #demo_container .bannerfestas		{ background-image:url(images/banner_festas2015.jpg); }
      #demo_container .bannerstellar		{ background-image:url(images/banner_stellar.jpg); }
	#banner_mensagem_stellar		{ position:absolute; left:20px; bottom:20px; background:url(images/banner_frase_stellar.png) top; z-index:150; width:462px; height:102px; cursor:pointer; }
      
      #demo_container .banner img		{ width:100%; }
      
  #banner_mensagem				{ position:absolute; left:20px; bottom:40px; background:url(images/banner_frase.png) top; z-index:150; width:342px; height:102px; cursor:pointer; }   
  #banner_mensagem_smart			{ display:none; }
  
  
@media only screen and (max-width : 900px) {
	
#demo_container					{ display:block; max-width:100%; padding:0; clear:both;}
  #demo_container #items_container		{ height:100%; }
    #demo_container div.slide_item		{ height:100%; }
      #demo_container .slide_item>div		{ width:100%; height:100%; }
      
      
  #banner_mensagem				{ display:none; }
  #banner_mensagem_smart			{ position:absolute; top:50%; left:20px; display:block; line-height:110%; font-size:30px; text-shadow: 2px 0px 1px rgba(150, 150, 150, 1); color:#fff; z-index:4000; }
      
}


@media only screen and (max-width : 800px) {
	
#demo_container					{ height:250px; }  
      
}


@media only screen and (max-width : 600px) {
	
#demo_container					{ height:200px; }  
  #banner_mensagem_smart			{ font-size:20px }
  
      
}

@media only screen and (max-width : 450px) {
	
#demo_container					{ height:120px; }  
  #banner_mensagem_smart			{ font-size:18px }
      
}

@media only screen and (max-width : 300px) {
	
#demo_container					{ display:none; }  
      
}
      
/* ...................... inicial / conteúdo .............................................................................................................................................. */


.cont						{ width:923px; padding:20px 0 0 0; height:100%; margin:0 auto; position:relative; }

  .cont h1					{ color:#D62C25; font-size:20px; font-weight:normal; margin:0 0 15px 0; line-height:140%;  }
  .cont h2					{ color:#D62C25; font-size:20px; font-weight:normal; margin:0;  line-height:140%; }
  .cont p					{ margin:10px 0 10px 0; }

.inicialdir					{ width:196px; float:right; }
    .informativo				{ list-style:none; padding:0; margin:0; }
    .informativo li				{ margin:0; padding:10px 0 10px 0; border-bottom:1px solid #F7F7F7; }
    .informativo li:first-child			{ padding:0 0 10px 0; }
    .informativo li a				{ color:#666; padding:0; display:block;  }
    .informativo li a:hover			{ color:#D62E26; text-decoration:none; }

  
.inicialesq					{ width:687px; }
.inicialesq .linha				{ border-bottom:1px solid #F7F7F7; margin:5px 0 20px 0;}
.inicialesq .linha2				{ border-bottom:1px solid #F7F7F7; margin:5px 0 0 0;}
.linhagrande					{ border-bottom:1px solid #F7F7F7; margin:5px 0 17px 0;}


@media only screen and (max-width : 900px) {
	
.cont						{ width:100%; height:100%; }

.inicialdir					{ width:100%; float:none; }

.inicialesq					{ width:100%; }

}



/* ...................... inicial / miniaturas de produtos e serviços .............................................................................................................................................. */

.promocao a					{ width:687px; height:120px; border:1px solid #E0DED6; display:block; margin-bottom:20px; }
.promocao a:hover				{ border-color:#D62E26; background:#D62E26; }
.promocao img					{ height:110px; width:677px; margin:5px; background-position:center center; background-repeat:no-repeat; background-color:#fff; text-indent:-99999px; }

.miniaturas					{ position:relative; overflow:hidden; width:687px; top:-17px; }
.miniaturas ul					{ list-style:none; margin:0; padding:0; }
#carrossel ul					{ margin-right:0; }
#carrossel_ser ul				{ margin-right:0; }
  .miniaturas li				{ margin:31px 0 20px 20px; padding:0; float:left; width:215px; }
  .miniaturas#carrossel li			{ margin-left:0; margin-right:20px; }
  .miniaturas#carrossel_ser li			{ margin-left:0; margin-right:20px; }
    .miniaturas li>a				{ float:left; width:215px; height:118px; border:1px solid #E0DED6; display:block; }
      .miniaturas li>a span.foto		{ width:205px; height:108px; display:block; margin:5px 0 0 5px; background-position:center center; background-repeat:no-repeat; background-color:#fff; text-indent:-99999px; font-size:1px; }
    .miniaturas li>a:hover			{ border-color:#D62E26; background:#D62E26; }
    .miniaturas li .tit_cat			{ margin:10px 5px 0 5px; display:block; color:#333; }
      .miniaturas li .tit_cat a			{ color:#555; }

.jcarousel-direction-rtl			{ direction:rtl; }
.jcarousel-clip					{ overflow:hidden; }
.jcarousel-next-horizontal			{ width:16px; height:16px; cursor:pointer; background:url(images/icon_avancar.png) bottom; position:absolute; right:0; top:0; }
.jcarousel-prev-horizontal			{ width:16px; height:16px; cursor:pointer; background:url(images/icon_retornar.png) bottom; position:absolute; right:23px; top:0; }
.jcarousel-mais					{ width:16px; height:16px; cursor:pointer; background:url(images/icon_mais.png) bottom; position:absolute; right:46px; top:0; display:block; }

.jcarousel-next-horizontal:hover, .jcarousel-prev-horizontal:hover, .jcarousel-mais:hover	{ background-position:top; }


@media only screen and (max-width : 900px) {
	
.miniaturas				{ width:100%; top:0; }

}



/* ...................... inicial / pagamentos - orçamento .............................................................................................................................................. */

.visita					{ width:452px; position:relative; height:40px; float:right; }
  .visita .titulo			{ position:absolute; top:0; left:0; color:#D62C25; font-size:18px; margin:0; }
  .visita .agende			{ position:absolute; top:20px; left:0; color:#666; font-size:12px; margin:5px 0 0 0; padding-left:10px; background:url(images/icon_agende.png) left center no-repeat;}
  .visita .agende a			{ color:#666; text-decoration:none; }
  .visita .agende a:hover		{ color:#333; }
  
.formapagamento				{ width:452px; position:relative; height:40px;  }
  .formapagamento .titulo		{ position:absolute; top:10px; left:0; color:#666; font-size:18px; margin:0; }
  .formapagamento .cartoes		{ position:absolute; top:7px; right:60px; width:161px; height:27px; background:url(images/icon_cartoes2.png); display:block; }

  
@media only screen and (max-width : 900px) {
	
.visita					{ display:block; width:100%; height:100%; float:none; clear:both; }
  .visita .titulo			{ position:initial; }
  .visita .agende			{ position:initial; display:block; margin:10px 0 0 0; padding-left:0; background:none; }


.formapagamento				{ display:block; width:100%; height:100%;  clear:both;}
  .formapagamento .titulo		{ position:initial; margin:20px 0 0 0; display:block; }
  .formapagamento .cartoes		{ position:initial; margin:20px 0 0 0; display:block; background:url(images/icon_cartoes2.png); }

}
  
  
/* ...................... diretório / vc está .............................................................................................................................................. */


  .diretorio					{ list-style:none; max-width:923px; min-width:923px; padding:0 20px 0 20px; margin:0 auto; height:30px; background:url(images/diretorio_bg.png); overflow:hidden; white-space: nowrap; }
    .diretorio li				{ margin:0; padding:0 10px 0 14px; float:left; background:url(images/diretorio_seta.png) left center no-repeat; color:#fff; line-height:30px; height:30px; font-size:11px;  }
      .diretorio a				{ color:#fff; float:left; display:block; line-height:30px; }
      .diretorio a:hover			{ color:#fff; }

      
@media only screen and (max-width : 900px) {
	
  .diretorio					{ max-width:100%; min-width:100%; box-sizing:border-box; white-space:nowrap;}

}
      
      




/* ...................... paginas internas / comum .............................................................................................................................................. */


.comumdir					{ width:196px; float:right; }
  .comumdir .mapa				{ display:block; width:185px; margin:20px 0 10px 0; padding:5px; border:1px solid #E0DED6; }
  .comumdir address				{ display:block; font-style:normal; }
  
.comumesq					{ width:687px; }
  
  
   .subit					{ list-style:none; margin:10px 0 0 0; padding:0; }
     .subit li					{ margin:0; padding:0; border-bottom:1px solid #E0DED6; }
     .subit li:last-child				{ border:none; }
	.subit li a				{ display:block; line-height:140%; padding:5px 0 5px 0; color:#999; }

  
@media only screen and (max-width : 900px) {
	
.comumdir					{ display:none; }

.comumesq					{ width:100%; }

}
  
  
/* ...................... pagina fale conosco .............................................................................................................................................. */

.contatodir					{ width:196px; float:right; }
  .contatodir .mapa				{ display:block; width:185px; margin:20px 0 10px 0; padding:5px; border:1px solid #E0DED6; }
  .contatodir address				{ display:block; font-style:normal; }
  
.contatomeio					{ width:473px; float:left; margin-left:20px; }

.contatoesq					{ width:214px; float:left;  }

@media only screen and (max-width : 900px) {
	
.contatodir					{ width:100%; float:none; }
  .contatodir .mapa				{ width:100%;  }

.contatomeio					{ width:100%; float:none; margin-left:0; }

.contatoesq					{ width:100%; float:none;  }

}

  
  
/* ...................... forms ................................................................................................................................................. */


.confirma					{ width:100%; padding:10px; color:#fff; background:#d62c26; font-size:14px; text-align:center; margin:0; position:relative; z-index:4; box-sizing:border-box; }
.contato					{ width:100%; box-sizing:border-box; }
  .contato label				{ display:block; margin:10px 0 0 0; }
  .contato input[type=text], .contato select, .contato textarea, .contato input[type=file]	{ display:block; border:1px solid #F7F7F7; padding:0; background:#F7F7F7; height:30px; font-size:14px; margin:0; color:#333; width:100%; box-sizing:border-box;}
  .contato textarea				{ width:100%; height:70px; box-sizing:border-box; }
  .contato select				{ width:100%; box-sizing:border-box; }
  .contato input[type=button]			{ display:block; border:none; padding:0; background:url(images/b_enviar.jpg) top; margin:10px 0 0 0; width:81px; height:30px; cursor:pointer; }
  .contato input[type=button]:hover		{ background-position:bottom; }
  .contato .asterisco				{ font-weight:700; color:#D62C26; font-size:16px; }
   
  
  
/* ...................... rodapé ................................................................................................................................................ */


.rod						{ width:923px; margin:0 auto; text-align:center; font-size:12px; line-height:160%; color:#666; border-top:1px solid #F7F7F7; margin:20px 0 0 0; padding:20px 0 20px 0; }

  .rod address					{ display:block; font-style:normal; }
  .rod .titulo					{ color:#D62C25; font-size:14px; font-weight:700; }
  .rod .redes					{ display:block; margin:10px auto; text-align:center; }
  .rod .redes .facebook				{ width:20px; height:20px; background:url(images/icone_facebook.png); display:inline-block; }
  .rod .redes .instagram			{ width:20px; height:20px; background:url(images/icone_instagram.png); display:inline-block; }
  .index					{ margin-top:10px; display:block;  }


  @media only screen and (max-width : 900px) {
	
.rod						{ width:100%; margin:20px 0 0 0; padding:20px 0 20px 0; box-sizing:border-box; }

  .rod address					{ float:none; font-style:normal; text-align:center; line-height:160%; }

  .index					{ float:none; padding-top:20px; text-align:center; font-size:11px; }

}
  
  

/* ...................... miniaturas ............................................................................................................................................ */


.prodir						{ width:196px; float:right; margin:0; padding:0; }
  .prodir .mapa					{ display:block; width:185px; margin:20px 0 10px 0; padding:5px; border:1px solid #E0DED6; }
  .prodir address				{ display:block; font-style:normal; }
  
.proesq						{ width:687px; float:left;  margin:0; padding:0; }


@media only screen and (max-width : 900px) {
	
.prodir						{ width:100%; float:none; display:block; }
  .prodir .mapa					{ width:100%; }
	
.proesq						{ width:100%; float:none; display:block; box-sizing:border-box; }

}



/* ...................... miniaturas / catalogo / departamentos / produtos  ............................................................................................................................................ */

.produtos					{ list-style:none; margin:0; padding:0; }
  .produtos li					{ margin:0 0 30px 0; padding:0 10px 0 10px; float:left; width: calc(33% - 20px); }
  .produtos li a				{ float:left; width:100%; display:block; box-sizing:border-box;  }
  .produtos li a:hover				{ border-color:#D62E26; }
  .produtos li a span.foto			{ border:1px solid #E0DED6; height:118px; width:100%; overflow:hidden; display:block; margin:0; background-position:center center; background-repeat:no-repeat; background-color:#fff; text-indent:-99999px; font-size:1px; box-sizing:border-box; }
  .produtos li a span.foto img			{ width:100%; }
  .produtos li a span.foto:hover		{ border:1px solid #D62E26; }
  .produtos li a span.tit			{ padding:3px; margin:0 5px 0 5px; display:block; color:#333; box-sizing:border-box; }
  .produtos li.clear				{ width:100%; float:none; clear:both; height:0px; overflow:hidden; }

@media only screen and (max-width : 900px) {
	
  .produtos li					{ margin:0 0 30px 0; float:left; width: calc(25% - 20px);}

}


@media only screen and (max-width : 800px) {
	
  .produtos li					{ margin:0 0 30px 0; float:left; width: calc(33% - 20px);}

}

@media only screen and (max-width : 600px) {
	
  .produtos li					{ margin:0 0 30px 0; float:left; width: calc(50% - 20px);}

}


@media only screen and (max-width : 400px) {
	
  .produtos li					{ margin:0 0 30px 0; float:left; width: calc(100%); padding:0; }

}
  
/* ...................... miniaturas / departamentos produtos  ............................................................................................................................................ */


/* WhatsApp */

a.linkWhats					{ position:fixed; width:60px; height:60px; bottom:30px; right:30px; z-index:1000;}
.imgWhats					{ animation-name: zoomWhats; animation-duration: 1s; -webkit-animation-name: zoomWhats; -webkit-animation-duration: 1s; }
   
@-webkit-keyframes zoomWhats 			{ from {width:0px;} to {width:60px;} }